Copy disabled (too large)
Download .txt
Showing preview only (14,071K chars total). Download the full file to get everything.
Repository: GeekyAnts/NativeBase
Branch: master
Commit: 335a1d5f854f
Files: 1192
Total size: 13.2 MB
Directory structure:
gitextract__kwg0xgp/
├── .editorconfig
├── .eslintrc.json
├── .github/
│ ├── ISSUE_TEMPLATE/
│ │ ├── bug_report.yml
│ │ ├── config.yml
│ │ └── feature_request.yml
│ ├── auto_assign.yml
│ ├── pull_request_template.md
│ └── workflows/
│ └── build.yml
├── .gitignore
├── .npmignore
├── .nvmrc
├── .prettierrc
├── .vscode/
│ └── settings.json
├── CODE_OF_CONDUCT.md
├── CONTRIBUTING.md
├── LICENSE
├── README.md
├── RNBareExample/
│ ├── .buckconfig
│ ├── .eslintrc.js
│ ├── .gitattributes
│ ├── .gitignore
│ ├── .prettierrc.js
│ ├── .watchmanconfig
│ ├── App.tsx
│ ├── _editorconfig
│ ├── android/
│ │ ├── app/
│ │ │ ├── _BUCK
│ │ │ ├── build.gradle
│ │ │ ├── build_defs.bzl
│ │ │ ├── debug.keystore
│ │ │ ├── proguard-rules.pro
│ │ │ └── src/
│ │ │ ├── debug/
│ │ │ │ ├── AndroidManifest.xml
│ │ │ │ └── java/
│ │ │ │ └── com/
│ │ │ │ └── rnbareexample/
│ │ │ │ └── ReactNativeFlipper.java
│ │ │ └── main/
│ │ │ ├── AndroidManifest.xml
│ │ │ ├── java/
│ │ │ │ └── com/
│ │ │ │ └── rnbareexample/
│ │ │ │ ├── MainActivity.java
│ │ │ │ └── MainApplication.java
│ │ │ └── res/
│ │ │ └── values/
│ │ │ ├── strings.xml
│ │ │ └── styles.xml
│ │ ├── build.gradle
│ │ ├── gradle/
│ │ │ └── wrapper/
│ │ │ ├── gradle-wrapper.jar
│ │ │ └── gradle-wrapper.properties
│ │ ├── gradle.properties
│ │ ├── gradlew
│ │ ├── gradlew.bat
│ │ └── settings.gradle
│ ├── app.json
│ ├── babel.config.js
│ ├── index.js
│ ├── ios/
│ │ ├── Podfile
│ │ ├── RNBareExample/
│ │ │ ├── AppDelegate.h
│ │ │ ├── AppDelegate.m
│ │ │ ├── Images.xcassets/
│ │ │ │ ├── AppIcon.appiconset/
│ │ │ │ │ └── Contents.json
│ │ │ │ └── Contents.json
│ │ │ ├── Info.plist
│ │ │ ├── LaunchScreen.storyboard
│ │ │ └── main.m
│ │ ├── RNBareExample.xcodeproj/
│ │ │ ├── project.pbxproj
│ │ │ └── xcshareddata/
│ │ │ └── xcschemes/
│ │ │ └── RNBareExample.xcscheme
│ │ ├── RNBareExample.xcworkspace/
│ │ │ ├── contents.xcworkspacedata
│ │ │ └── xcshareddata/
│ │ │ └── IDEWorkspaceChecks.plist
│ │ └── RNBareExampleTests/
│ │ ├── Info.plist
│ │ └── RNBareExampleTests.m
│ ├── metro.config.js
│ ├── package.json
│ ├── react-native.config.js
│ └── tsconfig.json
├── babel.config.js
├── cli.js
├── example/
│ ├── .eslintrc.json
│ ├── .nvmrc
│ ├── App.tsx
│ ├── __mocks__/
│ │ ├── @react-native-async-storage/
│ │ │ └── async-storage.js
│ │ └── globalMock.js
│ ├── app.json
│ ├── babel.config.js
│ ├── jest-android.config.js
│ ├── jest-ios.config.js
│ ├── jest.config.js
│ ├── metro.config.js
│ ├── nativebase.config.ts
│ ├── package.json
│ ├── patches/
│ │ └── core-js+3.6.5.patch
│ ├── scripts/
│ │ └── test.sh
│ ├── storybook/
│ │ ├── addons.ts
│ │ ├── index.ts
│ │ ├── rn-addons.ts
│ │ └── stories/
│ │ ├── community-integrations/
│ │ │ ├── Formik/
│ │ │ │ ├── Basic.tsx
│ │ │ │ └── index.tsx
│ │ │ └── ReactHookForm/
│ │ │ ├── DemoForm.tsx
│ │ │ ├── NumberInput.tsx
│ │ │ ├── PinInput.tsx
│ │ │ ├── RadioAndCheckbox.tsx
│ │ │ ├── Select.tsx
│ │ │ ├── Slider.tsx
│ │ │ ├── Switch.tsx
│ │ │ ├── Textarea.tsx
│ │ │ ├── Usage.tsx
│ │ │ └── index.tsx
│ │ ├── components/
│ │ │ ├── Allcomponents.tsx
│ │ │ ├── Wrapper.tsx
│ │ │ ├── basic/
│ │ │ │ ├── FlatList/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── KeyboardAvoidingView/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── Kitchensink-Basic.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── ScrollView/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── SectionList/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── StatusBar/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ └── View/
│ │ │ │ ├── Basic.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── composites/
│ │ │ │ ├── Accordion/
│ │ │ │ │ ├── AccessingInternalState.tsx
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── DefaultIndex.tsx
│ │ │ │ │ ├── ExpandedStyle.tsx
│ │ │ │ │ ├── Multiple.tsx
│ │ │ │ │ ├── Playground.tsx
│ │ │ │ │ ├── Toggle.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Actionsheet/
│ │ │ │ │ ├── Composition.tsx
│ │ │ │ │ ├── CustomBackdrop.tsx
│ │ │ │ │ ├── DisableOverlay.tsx
│ │ │ │ │ ├── Icon.tsx
│ │ │ │ │ ├── Usage.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Alert/
│ │ │ │ │ ├── action.tsx
│ │ │ │ │ ├── basic.tsx
│ │ │ │ │ ├── colorScheme.tsx
│ │ │ │ │ ├── composition.tsx
│ │ │ │ │ ├── index.tsx
│ │ │ │ │ ├── knobEnabled.tsx
│ │ │ │ │ ├── status.tsx
│ │ │ │ │ ├── usage.tsx
│ │ │ │ │ └── variant.tsx
│ │ │ │ ├── AlertDialog/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── Transition.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── AppBar/
│ │ │ │ │ ├── AppBarExamples.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── AspectRatio/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── EmbedImage.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Avatar/
│ │ │ │ │ ├── AvatarBadge.tsx
│ │ │ │ │ ├── AvatarGroup.tsx
│ │ │ │ │ ├── Fallback.tsx
│ │ │ │ │ ├── index.tsx
│ │ │ │ │ ├── knobEnabled.tsx
│ │ │ │ │ ├── size.tsx
│ │ │ │ │ └── usage.tsx
│ │ │ │ ├── Badge/
│ │ │ │ │ ├── color.tsx
│ │ │ │ │ ├── composition.tsx
│ │ │ │ │ ├── icons.tsx
│ │ │ │ │ ├── index.tsx
│ │ │ │ │ ├── knobEnabled.tsx
│ │ │ │ │ ├── usage.tsx
│ │ │ │ │ └── variants.tsx
│ │ │ │ ├── Breadcrumb/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── Collapsible.tsx
│ │ │ │ │ ├── ComponentSeparator.tsx
│ │ │ │ │ ├── Composition.tsx
│ │ │ │ │ ├── Separators.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Card/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Center/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── SquareCircle.tsx
│ │ │ │ │ ├── WithIcons.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── CircularProgress/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── ColorScheme.tsx
│ │ │ │ │ ├── Colors.tsx
│ │ │ │ │ ├── Indeterminate.tsx
│ │ │ │ │ ├── Label.tsx
│ │ │ │ │ ├── MinMax.tsx
│ │ │ │ │ ├── Sizes.tsx
│ │ │ │ │ ├── Thickness.tsx
│ │ │ │ │ ├── TrackColor.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── CloseButton/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── Sizes.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Code/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── colors.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Collapse/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── Callback.tsx
│ │ │ │ │ ├── Duration.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Container/
│ │ │ │ │ ├── Playground.tsx
│ │ │ │ │ ├── centeringChildren.tsx
│ │ │ │ │ ├── index.tsx
│ │ │ │ │ └── usage.tsx
│ │ │ │ ├── Divider/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── Composition.tsx
│ │ │ │ │ ├── Orientation.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Drawer/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Fab/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── CustomPosition.tsx
│ │ │ │ │ ├── DocsBasic.tsx
│ │ │ │ │ ├── DocsCustomPosition.tsx
│ │ │ │ │ ├── DocsPlacement.tsx
│ │ │ │ │ ├── Kitchensink-Basic.tsx
│ │ │ │ │ ├── Kitchensink-CustomPosition.tsx
│ │ │ │ │ ├── Kitchensink-Placement.tsx
│ │ │ │ │ ├── Placement.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── FormControl/
│ │ │ │ │ ├── CustomStyle.tsx
│ │ │ │ │ ├── Playground.tsx
│ │ │ │ │ ├── Usage.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── IconButton/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── SVGIcon.tsx
│ │ │ │ │ ├── Sizes.tsx
│ │ │ │ │ ├── Variant.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Kbd/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Menu/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── Group.tsx
│ │ │ │ │ ├── MenuOptionsGroup.tsx
│ │ │ │ │ ├── MenuPositions.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Modal/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── CustomBackdrop.tsx
│ │ │ │ │ ├── ModalPlacement.tsx
│ │ │ │ │ ├── ModalRefEg.tsx
│ │ │ │ │ ├── ModalWithAvoidKeyboard.tsx
│ │ │ │ │ ├── MultipleModal.tsx
│ │ │ │ │ ├── Size.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── NumberInput/
│ │ │ │ │ ├── Combination.tsx
│ │ │ │ │ ├── DefaultValue.tsx
│ │ │ │ │ ├── FormControlled.tsx
│ │ │ │ │ ├── MinMax.tsx
│ │ │ │ │ ├── Playground.tsx
│ │ │ │ │ ├── Steps.tsx
│ │ │ │ │ ├── Usage.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── PinInput/
│ │ │ │ │ ├── DefaultValue.tsx
│ │ │ │ │ ├── FormControlled.tsx
│ │ │ │ │ ├── ManageFocus.tsx
│ │ │ │ │ ├── Placeholder.tsx
│ │ │ │ │ ├── Playground.tsx
│ │ │ │ │ ├── Size.tsx
│ │ │ │ │ ├── Usage.tsx
│ │ │ │ │ ├── Variants.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Popover/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── PopoverPositions.tsx
│ │ │ │ │ ├── RefEg.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Progress/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── ColorScheme.tsx
│ │ │ │ │ ├── Composition.tsx
│ │ │ │ │ ├── CustomBgColor.tsx
│ │ │ │ │ ├── Flat.tsx
│ │ │ │ │ ├── Sizes.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── SimpleGrid/
│ │ │ │ │ ├── MinWidthColumns.tsx
│ │ │ │ │ ├── NumberOfColumns.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Skeleton/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── Color.tsx
│ │ │ │ │ ├── Composition.tsx
│ │ │ │ │ ├── FadeDuration.tsx
│ │ │ │ │ ├── index.tsx
│ │ │ │ │ └── isLoaded.tsx
│ │ │ │ ├── Stat/
│ │ │ │ │ ├── Example.tsx
│ │ │ │ │ ├── Indicator.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Tabs/
│ │ │ │ │ ├── Colors.tsx
│ │ │ │ │ ├── Composition.tsx
│ │ │ │ │ ├── Controlled.tsx
│ │ │ │ │ ├── FittedTab.tsx
│ │ │ │ │ ├── IconTabs.tsx
│ │ │ │ │ ├── Size.tsx
│ │ │ │ │ ├── TabAlignment.tsx
│ │ │ │ │ ├── TabBarOnly.tsx
│ │ │ │ │ ├── Usage.tsx
│ │ │ │ │ ├── Variants.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Tag/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── Custom.tsx
│ │ │ │ │ ├── Size.tsx
│ │ │ │ │ ├── Variants.tsx
│ │ │ │ │ ├── WithIcon.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── TextField/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── Invalid.tsx
│ │ │ │ │ ├── Select.tsx
│ │ │ │ │ ├── Textarea.tsx
│ │ │ │ │ ├── WithIcon.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Toast/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── CloseToast.tsx
│ │ │ │ │ ├── CustomComponent.tsx
│ │ │ │ │ ├── CustomComponentWithCustomId.tsx
│ │ │ │ │ ├── PreventDuplicate.tsx
│ │ │ │ │ ├── StandaloneToast.tsx
│ │ │ │ │ ├── StatusRecipies.tsx
│ │ │ │ │ ├── ToastPositions.tsx
│ │ │ │ │ ├── VariantRecipies.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Tooltip/
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── CustomTooltip.tsx
│ │ │ │ │ ├── TooltipPositions.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Transitions/
│ │ │ │ │ ├── Fade.tsx
│ │ │ │ │ ├── ScaleFade.tsx
│ │ │ │ │ ├── Slide.tsx
│ │ │ │ │ ├── SlideComposition.tsx
│ │ │ │ │ ├── SlideFade.tsx
│ │ │ │ │ ├── SlideWrapped.tsx
│ │ │ │ │ ├── Stagger.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Typeahead/
│ │ │ │ │ ├── UsingComponent.tsx
│ │ │ │ │ ├── UsingComponentWithRenderItem.tsx
│ │ │ │ │ ├── UsingControlledInput.tsx
│ │ │ │ │ ├── UsingHook.tsx
│ │ │ │ │ ├── UsingWithAPI.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ ├── Wrap/
│ │ │ │ │ ├── AlignmentAlign.tsx
│ │ │ │ │ ├── AlignmentJustify.tsx
│ │ │ │ │ ├── Basic.tsx
│ │ │ │ │ ├── Spacing.tsx
│ │ │ │ │ └── index.tsx
│ │ │ │ └── factory/
│ │ │ │ ├── index.tsx
│ │ │ │ ├── modes.tsx
│ │ │ │ ├── ref.tsx
│ │ │ │ ├── theme.tsx
│ │ │ │ └── usage.tsx
│ │ │ ├── perf/
│ │ │ │ ├── NBButton.tsx
│ │ │ │ ├── RNButton.tsx
│ │ │ │ └── index.tsx
│ │ │ └── primitives/
│ │ │ ├── Box/
│ │ │ │ ├── LinearGrad.tsx
│ │ │ │ ├── WithRef.tsx
│ │ │ │ ├── basic.tsx
│ │ │ │ ├── composition-card.tsx
│ │ │ │ ├── composition-card1.tsx
│ │ │ │ ├── composition-card2.tsx
│ │ │ │ ├── composition-card3.tsx
│ │ │ │ ├── composition-shoes-card.tsx
│ │ │ │ ├── composition.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Button/
│ │ │ │ ├── Composition.tsx
│ │ │ │ ├── WithRef.tsx
│ │ │ │ ├── basic.tsx
│ │ │ │ ├── icons.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── loading.tsx
│ │ │ │ ├── sizes.tsx
│ │ │ │ └── variants.tsx
│ │ │ ├── ButtonGroup/
│ │ │ │ ├── basic.tsx
│ │ │ │ ├── direction.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── isAttached.tsx
│ │ │ │ ├── sizes.tsx
│ │ │ │ └── variants.tsx
│ │ │ ├── Checkbox/
│ │ │ │ ├── FormControlled.tsx
│ │ │ │ ├── basic.tsx
│ │ │ │ ├── checkboxGroup.tsx
│ │ │ │ ├── controlledCheckbox.tsx
│ │ │ │ ├── customColor.tsx
│ │ │ │ ├── customIcon.tsx
│ │ │ │ ├── disabled.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── invalid.tsx
│ │ │ │ ├── playground.tsx
│ │ │ │ ├── size.tsx
│ │ │ │ ├── uncontrolledCheckbox.tsx
│ │ │ │ └── withRef.tsx
│ │ │ ├── Column/
│ │ │ │ ├── Basic.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Flex/
│ │ │ │ ├── basic.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── spacer.tsx
│ │ │ ├── HStack/
│ │ │ │ ├── basic.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Heading/
│ │ │ │ ├── Basic.tsx
│ │ │ │ ├── Composition.tsx
│ │ │ │ ├── OverridenStyle.tsx
│ │ │ │ ├── Sizes.tsx
│ │ │ │ ├── Truncate.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Hidden/
│ │ │ │ ├── basic.tsx
│ │ │ │ ├── hiddenFromAndToBreakpoints.tsx
│ │ │ │ ├── hiddenOnColorModes.tsx
│ │ │ │ ├── hiddenOnPlatforms.tsx
│ │ │ │ ├── hiddenOnlyOnBreakPoints.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Icon/
│ │ │ │ ├── AllIcons.tsx
│ │ │ │ ├── Basic.tsx
│ │ │ │ ├── CreateIcon.tsx
│ │ │ │ ├── CustomIcon.tsx
│ │ │ │ ├── Sizes.tsx
│ │ │ │ ├── ThirdPartyIcons.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Image/
│ │ │ │ ├── Basic.tsx
│ │ │ │ ├── BorderRadius.tsx
│ │ │ │ ├── FallbackElement.tsx
│ │ │ │ ├── FallbackSupport.tsx
│ │ │ │ ├── Sizes.tsx
│ │ │ │ ├── WithRef.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Input/
│ │ │ │ ├── Addons.tsx
│ │ │ │ ├── Basic.tsx
│ │ │ │ ├── Controlled.tsx
│ │ │ │ ├── Elements.tsx
│ │ │ │ ├── FormControlled.tsx
│ │ │ │ ├── Masked.tsx
│ │ │ │ ├── Size.tsx
│ │ │ │ ├── Variant.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Link/
│ │ │ │ ├── Basic.tsx
│ │ │ │ ├── CompositeLink.tsx
│ │ │ │ ├── CustomOnPress.tsx
│ │ │ │ ├── ExternalLink.tsx
│ │ │ │ ├── UnderlineLink.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── List/
│ │ │ │ ├── Basic.tsx
│ │ │ │ ├── ListWithIcon.tsx
│ │ │ │ ├── OrderedList.tsx
│ │ │ │ ├── PressableList.tsx
│ │ │ │ ├── StylingList.tsx
│ │ │ │ ├── UnorderedList.tsx
│ │ │ │ ├── VirtualizedList.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Pressable/
│ │ │ │ ├── Basic.tsx
│ │ │ │ ├── Events.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Radio/
│ │ │ │ ├── controlledRadio.tsx
│ │ │ │ ├── customColor.tsx
│ │ │ │ ├── customIcon.tsx
│ │ │ │ ├── disabled.tsx
│ │ │ │ ├── formControlled.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── invalid.tsx
│ │ │ │ ├── playground.tsx
│ │ │ │ ├── size.tsx
│ │ │ │ ├── uncontrolledRadio.tsx
│ │ │ │ └── withRef.tsx
│ │ │ ├── Row/
│ │ │ │ ├── Basic.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Select/
│ │ │ │ ├── Basic.tsx
│ │ │ │ ├── FormControlled.tsx
│ │ │ │ ├── SelectLongList.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Slider/
│ │ │ │ ├── Customized.tsx
│ │ │ │ ├── FormControlled.tsx
│ │ │ │ ├── Playground.tsx
│ │ │ │ ├── Size.tsx
│ │ │ │ ├── Value.tsx
│ │ │ │ ├── Vertical.tsx
│ │ │ │ ├── color.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── isDisabled.tsx
│ │ │ │ ├── isReadOnly.tsx
│ │ │ │ └── usage.tsx
│ │ │ ├── Spinner/
│ │ │ │ ├── color.tsx
│ │ │ │ ├── duration.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── size.tsx
│ │ │ │ ├── usage.tsx
│ │ │ │ ├── variant.tsx
│ │ │ │ └── withKnob.tsx
│ │ │ ├── Stack/
│ │ │ │ ├── basic.tsx
│ │ │ │ ├── divider.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Switch/
│ │ │ │ ├── Accessibility.tsx
│ │ │ │ ├── Basic.tsx
│ │ │ │ ├── ColorSchemes.tsx
│ │ │ │ ├── Sizes.tsx
│ │ │ │ ├── SwitchBgColor.tsx
│ │ │ │ ├── example.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Text/
│ │ │ │ ├── Basic.tsx
│ │ │ │ ├── ChangingFontSize.tsx
│ │ │ │ ├── Nested.tsx
│ │ │ │ ├── Overriden.tsx
│ │ │ │ ├── Truncated.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── TextArea/
│ │ │ │ ├── basic.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── invalid.tsx
│ │ │ │ ├── size-kitchensink.tsx
│ │ │ │ ├── size.tsx
│ │ │ │ └── value.tsx
│ │ │ ├── VStack/
│ │ │ │ ├── basic.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── View/
│ │ │ │ ├── Basic.tsx
│ │ │ │ └── index.tsx
│ │ │ └── ZStack/
│ │ │ ├── CenterStack.tsx
│ │ │ ├── example.tsx
│ │ │ └── index.tsx
│ │ ├── examples/
│ │ │ ├── Signin.tsx
│ │ │ ├── Signup.tsx
│ │ │ ├── TodoApp.tsx
│ │ │ └── index.tsx
│ │ ├── hooks/
│ │ │ ├── useAccessibleColors/
│ │ │ │ ├── Basic.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── useBreakpointValue/
│ │ │ │ ├── index.tsx
│ │ │ │ └── usage.tsx
│ │ │ ├── useClipboard/
│ │ │ │ ├── Usage.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── useColorMode/
│ │ │ │ ├── Basic.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── useColorModeValue/
│ │ │ │ ├── Basic.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── useContrastText/
│ │ │ │ ├── Basic.tsx
│ │ │ │ ├── Variations.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── useDisclose/
│ │ │ │ ├── Usage.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── useMediaQuery/
│ │ │ │ ├── index.tsx
│ │ │ │ ├── max-height.tsx
│ │ │ │ ├── min-width.tsx
│ │ │ │ └── orientation.tsx
│ │ │ ├── useSafeArea/
│ │ │ │ ├── Fixed.tsx
│ │ │ │ ├── Flexible.tsx
│ │ │ │ ├── Hook.tsx
│ │ │ │ └── index.tsx
│ │ │ └── useSx/
│ │ │ ├── Basic.tsx
│ │ │ └── index.tsx
│ │ ├── index.ts
│ │ └── theme/
│ │ ├── Custom/
│ │ │ ├── Basic.tsx
│ │ │ ├── Content.tsx
│ │ │ ├── CustomizingBase.tsx
│ │ │ ├── CustomizingComponents.tsx
│ │ │ ├── CustomizingTheme.tsx
│ │ │ ├── CustomizingVariant.tsx
│ │ │ └── index.tsx
│ │ ├── Mode/
│ │ │ ├── Basic.tsx
│ │ │ ├── Content.tsx
│ │ │ ├── DefaultMode.tsx
│ │ │ ├── Persistence.tsx
│ │ │ └── index.tsx
│ │ └── Responsive/
│ │ ├── Basic.tsx
│ │ ├── Demo.tsx
│ │ ├── Direction.tsx
│ │ ├── FontSize.tsx
│ │ ├── More.tsx
│ │ └── index.tsx
│ ├── tests/
│ │ ├── storybook.test.js
│ │ ├── storybook.test.js.snap.android
│ │ ├── storybook.test.js.snap.ios
│ │ ├── storybook.test.js.snap.node
│ │ └── storybook.test.js.snap.web
│ ├── tsconfig.json
│ ├── web-build/
│ │ └── register-service-worker.js
│ └── webpack.config.js
├── expo-example/
│ ├── App.tsx
│ ├── app.json
│ ├── babel.config.js
│ ├── components/
│ │ ├── button.tsx
│ │ └── index.ts
│ ├── custompressablescreen.tsx
│ ├── metro.config.js
│ ├── nativebase.tsx
│ ├── package.json
│ ├── reactnativescreen.tsx
│ ├── test-babel 11.40.04 AM.js
│ ├── tsconfig.json
│ └── webpack.config.js
├── next-example/
│ ├── .eslintrc.json
│ ├── .gitignore
│ ├── README.md
│ ├── babel.config.js
│ ├── next-env.d.ts
│ ├── next.config.js
│ ├── package.json
│ ├── pages/
│ │ ├── _app.tsx
│ │ ├── _document.js
│ │ ├── api/
│ │ │ └── hello.ts
│ │ └── index.tsx
│ ├── styles/
│ │ ├── Home.module.css
│ │ └── globals.css
│ └── tsconfig.json
├── package.json
├── sonar-project.properties
├── src/
│ ├── components/
│ │ ├── basic/
│ │ │ ├── FlatList/
│ │ │ │ ├── FlatList.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── KeyboardAvoidingView/
│ │ │ │ ├── KeyboardAvoidingView.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── ScrollView/
│ │ │ │ ├── ScrollView.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── SectionList/
│ │ │ │ ├── SectionList.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── StatusBar/
│ │ │ │ ├── StatusBar.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── View/
│ │ │ │ ├── View.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ └── index.tsx
│ │ ├── composites/
│ │ │ ├── Accordion/
│ │ │ │ ├── Accordion.tsx
│ │ │ │ ├── AccordionDetails.tsx
│ │ │ │ ├── AccordionIcon.tsx
│ │ │ │ ├── AccordionItem.tsx
│ │ │ │ ├── AccordionSummary.tsx
│ │ │ │ ├── Context.ts
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Actionsheet/
│ │ │ │ ├── ActionSheetContext.ts
│ │ │ │ ├── Actionsheet.tsx
│ │ │ │ ├── ActionsheetContent.tsx
│ │ │ │ ├── ActionsheetFooter.tsx
│ │ │ │ ├── ActionsheetHeader.tsx
│ │ │ │ ├── ActionsheetItem.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── Alert/
│ │ │ │ ├── Alert.tsx
│ │ │ │ ├── AlertIcon.tsx
│ │ │ │ ├── Context.ts
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── AlertDialog/
│ │ │ │ ├── AlertDialog.tsx
│ │ │ │ ├── AlertDialogBody.tsx
│ │ │ │ ├── AlertDialogCloseButton.tsx
│ │ │ │ ├── AlertDialogContent.tsx
│ │ │ │ ├── AlertDialogFooter.tsx
│ │ │ │ ├── AlertDialogHeader.tsx
│ │ │ │ ├── Context.ts
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── AppBar/
│ │ │ │ ├── AppBar.tsx
│ │ │ │ ├── AppBarContent.tsx
│ │ │ │ ├── AppBarLeft.tsx
│ │ │ │ ├── AppBarRight.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── types.tsx
│ │ │ │ └── utils.ts
│ │ │ ├── AspectRatio/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Avatar/
│ │ │ │ ├── Avatar.tsx
│ │ │ │ ├── Badge.tsx
│ │ │ │ ├── Group.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── Backdrop/
│ │ │ │ └── index.tsx
│ │ │ ├── Badge/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── Breadcrumb/
│ │ │ │ ├── Breadcrumb.tsx
│ │ │ │ ├── BreadcrumbIcon.tsx
│ │ │ │ ├── BreadcrumbItem.tsx
│ │ │ │ ├── BreadcrumbLink.tsx
│ │ │ │ ├── BreadcrumbText.tsx
│ │ │ │ ├── Context.ts
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Card/
│ │ │ │ ├── Card.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Center/
│ │ │ │ ├── Center.tsx
│ │ │ │ ├── Circle.tsx
│ │ │ │ ├── Square.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── CircularProgress/
│ │ │ │ ├── CircularProgress.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Code/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Collapse/
│ │ │ │ └── index.tsx
│ │ │ ├── Container/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── Divider/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Drawer/
│ │ │ │ └── index.tsx
│ │ │ ├── Fab/
│ │ │ │ ├── Fab.tsx
│ │ │ │ ├── FabItem.tsx
│ │ │ │ ├── FabList.tsx
│ │ │ │ ├── context.ts
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── FormControl/
│ │ │ │ ├── FormControl.tsx
│ │ │ │ ├── FormControlErrorMessage.tsx
│ │ │ │ ├── FormControlHelperText.tsx
│ │ │ │ ├── FormControlLabel.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── test/
│ │ │ │ │ └── FormControl.test.tsx
│ │ │ │ ├── types.tsx
│ │ │ │ └── useFormControl.tsx
│ │ │ ├── IconButton/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── KBD/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Menu/
│ │ │ │ ├── Menu.tsx
│ │ │ │ ├── MenuContext.ts
│ │ │ │ ├── MenuGroup.tsx
│ │ │ │ ├── MenuItem.tsx
│ │ │ │ ├── MenuItemOption.tsx
│ │ │ │ ├── MenuOptionGroup.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── types.ts
│ │ │ │ └── useMenu.tsx
│ │ │ ├── Modal/
│ │ │ │ ├── Context.ts
│ │ │ │ ├── Modal.tsx
│ │ │ │ ├── ModalBody.tsx
│ │ │ │ ├── ModalCloseButton.tsx
│ │ │ │ ├── ModalContent.tsx
│ │ │ │ ├── ModalFooter.tsx
│ │ │ │ ├── ModalHeader.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── NumberInput/
│ │ │ │ ├── Context.ts
│ │ │ │ ├── NumberDecrementStepper.tsx
│ │ │ │ ├── NumberIncrementStepper.tsx
│ │ │ │ ├── NumberInput.tsx
│ │ │ │ ├── NumberInputField.tsx
│ │ │ │ ├── NumberInputStepper.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── PinInput/
│ │ │ │ ├── Context.ts
│ │ │ │ ├── PinInput.tsx
│ │ │ │ ├── PinInputField.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── Popover/
│ │ │ │ ├── Popover.tsx
│ │ │ │ ├── PopoverArrow.tsx
│ │ │ │ ├── PopoverBody.tsx
│ │ │ │ ├── PopoverCloseButton.tsx
│ │ │ │ ├── PopoverContent.tsx
│ │ │ │ ├── PopoverContext.ts
│ │ │ │ ├── PopoverFooter.tsx
│ │ │ │ ├── PopoverHeader.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Popper/
│ │ │ │ ├── Popper.tsx
│ │ │ │ ├── index.ts
│ │ │ │ └── types.ts
│ │ │ ├── Progress/
│ │ │ │ └── index.tsx
│ │ │ ├── SimpleGrid/
│ │ │ │ ├── SimpleGrid.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Skeleton/
│ │ │ │ ├── Skeleton.tsx
│ │ │ │ ├── SkeletonText.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── Stat/
│ │ │ │ └── index.tsx
│ │ │ ├── Tabs/
│ │ │ │ ├── Context.ts
│ │ │ │ ├── Tab.tsx
│ │ │ │ ├── TabBar.tsx
│ │ │ │ ├── TabIcon.tsx
│ │ │ │ ├── TabView.tsx
│ │ │ │ ├── TabViews.tsx
│ │ │ │ ├── Tabs.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── Tag/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── TextField/
│ │ │ │ ├── TextField.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── Toast/
│ │ │ │ ├── Toast.tsx
│ │ │ │ ├── ToastDummy.tsx
│ │ │ │ ├── index.ts
│ │ │ │ ├── types.ts
│ │ │ │ └── utils.ts
│ │ │ ├── Tooltip/
│ │ │ │ ├── Tooltip.tsx
│ │ │ │ ├── index.ts
│ │ │ │ └── types.ts
│ │ │ ├── Transitions/
│ │ │ │ ├── Fade.tsx
│ │ │ │ ├── PresenceTransition.tsx
│ │ │ │ ├── ScaleFade.tsx
│ │ │ │ ├── Slide.tsx
│ │ │ │ ├── SlideFade.tsx
│ │ │ │ ├── Stagger.tsx
│ │ │ │ ├── Transition.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── Typeahead/
│ │ │ │ ├── Typeahead.tsx
│ │ │ │ ├── index.ts
│ │ │ │ ├── types.ts
│ │ │ │ └── useTypeahead/
│ │ │ │ ├── index.ts
│ │ │ │ ├── reducer.tsx
│ │ │ │ ├── types.tsx
│ │ │ │ ├── useTypeahead.ts
│ │ │ │ └── utils.ts
│ │ │ ├── Wrap/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ └── index.ts
│ │ ├── primitives/
│ │ │ ├── Box/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Button/
│ │ │ │ ├── Button.tsx
│ │ │ │ ├── ButtonGroup.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Checkbox/
│ │ │ │ ├── Checkbox.tsx
│ │ │ │ ├── Checkbox.web.tsx
│ │ │ │ ├── CheckboxGroup.tsx
│ │ │ │ ├── SizedIcon.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── test/
│ │ │ │ │ └── checkbox.test.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── Column/
│ │ │ │ └── index.tsx
│ │ │ ├── Flex/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── GridItem/
│ │ │ │ └── props.ts
│ │ │ ├── Heading/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Hidden/
│ │ │ │ ├── HiddenSSR.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Icon/
│ │ │ │ ├── Icon.tsx
│ │ │ │ ├── Icons/
│ │ │ │ │ ├── Add.tsx
│ │ │ │ │ ├── Arrow.tsx
│ │ │ │ │ ├── Check.tsx
│ │ │ │ │ ├── Chevron.tsx
│ │ │ │ │ ├── Circle.tsx
│ │ │ │ │ ├── Close.tsx
│ │ │ │ │ ├── Delete.tsx
│ │ │ │ │ ├── Favourite.tsx
│ │ │ │ │ ├── Hamburger.tsx
│ │ │ │ │ ├── Info.tsx
│ │ │ │ │ ├── Minus.tsx
│ │ │ │ │ ├── Moon.tsx
│ │ │ │ │ ├── Play.tsx
│ │ │ │ │ ├── Question.tsx
│ │ │ │ │ ├── Search.tsx
│ │ │ │ │ ├── Share.tsx
│ │ │ │ │ ├── Sun.tsx
│ │ │ │ │ ├── ThreeDots.tsx
│ │ │ │ │ ├── Warning.tsx
│ │ │ │ │ ├── WarningOutline.tsx
│ │ │ │ │ ├── index.tsx
│ │ │ │ │ └── questionIconPath.tsx
│ │ │ │ ├── SVGIcon.tsx
│ │ │ │ ├── createIcon.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── nbSvg.tsx
│ │ │ │ ├── nbSvg.web.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Image/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Input/
│ │ │ │ ├── Input.tsx
│ │ │ │ ├── InputAddons.tsx
│ │ │ │ ├── InputAdvanced.tsx
│ │ │ │ ├── InputBase.tsx
│ │ │ │ ├── InputGroup.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Link/
│ │ │ │ ├── index.tsx
│ │ │ │ ├── types.ts
│ │ │ │ └── useLink.ts
│ │ │ ├── List/
│ │ │ │ ├── List.tsx
│ │ │ │ ├── ListIcon.tsx
│ │ │ │ ├── ListItem.tsx
│ │ │ │ ├── Ordered.tsx
│ │ │ │ ├── Unordered.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── types.ts
│ │ │ │ └── utils.ts
│ │ │ ├── Overlay/
│ │ │ │ ├── ExitAnimationContext.ts
│ │ │ │ ├── Overlay.tsx
│ │ │ │ └── index.ts
│ │ │ ├── Pressable/
│ │ │ │ ├── Pressable.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Radio/
│ │ │ │ ├── Radio.tsx
│ │ │ │ ├── Radio.web.tsx
│ │ │ │ ├── RadioGroup.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ ├── test/
│ │ │ │ │ └── radio.test.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── Row/
│ │ │ │ └── index.tsx
│ │ │ ├── Select/
│ │ │ │ ├── Select.tsx
│ │ │ │ ├── SelectItem.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Slider/
│ │ │ │ ├── Context.ts
│ │ │ │ ├── Slider.tsx
│ │ │ │ ├── SliderFilledTrack.tsx
│ │ │ │ ├── SliderThumb.tsx
│ │ │ │ ├── SliderTrack.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── Spinner/
│ │ │ │ ├── index.tsx
│ │ │ │ ├── types.tsx
│ │ │ │ ├── useSpinner.tsx
│ │ │ │ └── variants/
│ │ │ │ ├── default.tsx
│ │ │ │ ├── dotted.tsx
│ │ │ │ ├── index.ts
│ │ │ │ ├── multiColorDotted.tsx
│ │ │ │ ├── squareDotted.tsx
│ │ │ │ └── stroked.tsx
│ │ │ ├── Stack/
│ │ │ │ ├── HStack.tsx
│ │ │ │ ├── Stack.tsx
│ │ │ │ ├── VStack.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── Switch/
│ │ │ │ ├── index.tsx
│ │ │ │ ├── test/
│ │ │ │ │ └── switch.test.tsx
│ │ │ │ └── types.ts
│ │ │ ├── Text/
│ │ │ │ ├── __test__/
│ │ │ │ │ └── Text.test.tsx
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.tsx
│ │ │ ├── TextArea/
│ │ │ │ └── index.tsx
│ │ │ ├── TouchableItem/
│ │ │ │ └── index.tsx
│ │ │ ├── View/
│ │ │ │ ├── index.tsx
│ │ │ │ └── types.ts
│ │ │ ├── VisuallyHidden/
│ │ │ │ └── index.tsx
│ │ │ ├── ZStack/
│ │ │ │ └── index.tsx
│ │ │ └── index.ts
│ │ └── types/
│ │ ├── ExtraProps.ts
│ │ ├── PlatformProps.ts
│ │ ├── index.tsx
│ │ ├── responsiveValue.ts
│ │ └── utils.ts
│ ├── core/
│ │ ├── NativeBaseContext.ts
│ │ ├── NativeBaseProvider.tsx
│ │ ├── RobotoSlab.otf
│ │ ├── StrictMode.ts
│ │ ├── color-mode/
│ │ │ ├── hooks.tsx
│ │ │ ├── index.tsx
│ │ │ └── types.ts
│ │ ├── extendTheme.tsx
│ │ ├── hybrid-overlay/
│ │ │ ├── Context.ts
│ │ │ ├── HybridProvider.tsx
│ │ │ ├── index.ts
│ │ │ └── types.ts
│ │ └── index.ts
│ ├── factory/
│ │ ├── component.tsx
│ │ ├── index.tsx
│ │ └── types.ts
│ ├── hooks/
│ │ ├── index.ts
│ │ ├── tests/
│ │ │ └── useBreakpointValue.test.tsx
│ │ ├── useBreakpointResolvedProps.ts
│ │ ├── useBreakpointValue.ts
│ │ ├── useClipboard.ts
│ │ ├── useColorModeProps.ts
│ │ ├── useContrastText.ts
│ │ ├── useControllableProp.ts
│ │ ├── useDisclose.ts
│ │ ├── useHasResponsiveProps.ts
│ │ ├── useKeyboardDismissable.ts
│ │ ├── useLayout.tsx
│ │ ├── useMediaQuery.ts
│ │ ├── useNativeBase.tsx
│ │ ├── usePlatformProps.ts
│ │ ├── useResolvedFontFamily.ts
│ │ ├── useResponsiveSSRProps.ts
│ │ ├── useSafeArea/
│ │ │ ├── index.ts
│ │ │ └── utils.ts
│ │ ├── useScreenReaderEnabled.ts
│ │ ├── useStyledSystemPropsResolver.ts
│ │ ├── useSx/
│ │ │ └── index.ts
│ │ ├── useTheme.ts
│ │ ├── useThemeProps/
│ │ │ ├── index.ts
│ │ │ ├── propsFlattener.tsx
│ │ │ ├── propsFlattenerTest.tsx
│ │ │ ├── useProps.tsx
│ │ │ ├── usePropsResolution.test.tsx
│ │ │ ├── usePropsResolution.tsx
│ │ │ ├── usePropsResolutionTest.tsx
│ │ │ ├── usePropsWithComponentTheme.ts
│ │ │ └── utils.ts
│ │ └── useToken.ts
│ ├── index.tsx
│ ├── theme/
│ │ ├── base/
│ │ │ ├── borders.ts
│ │ │ ├── breakpoints.ts
│ │ │ ├── colors.ts
│ │ │ ├── index.ts
│ │ │ ├── opacity.ts
│ │ │ ├── radius.ts
│ │ │ ├── shadows.ts
│ │ │ ├── sizes.ts
│ │ │ ├── space.ts
│ │ │ ├── types.ts
│ │ │ └── typography.ts
│ │ ├── components/
│ │ │ ├── accordion.ts
│ │ │ ├── actionsheet.ts
│ │ │ ├── alert-dialog.ts
│ │ │ ├── alert.ts
│ │ │ ├── app-bar.ts
│ │ │ ├── aspect-ratio.ts
│ │ │ ├── avatar-badge.ts
│ │ │ ├── avatar-group.ts
│ │ │ ├── avatar.ts
│ │ │ ├── badge.ts
│ │ │ ├── box.ts
│ │ │ ├── breadcrumb.ts
│ │ │ ├── button.ts
│ │ │ ├── card.ts
│ │ │ ├── center.ts
│ │ │ ├── checkbox-group.ts
│ │ │ ├── checkbox.ts
│ │ │ ├── circle.ts
│ │ │ ├── circular-progress.ts
│ │ │ ├── code.ts
│ │ │ ├── container.ts
│ │ │ ├── divider.ts
│ │ │ ├── fab.ts
│ │ │ ├── flatList.ts
│ │ │ ├── flex.ts
│ │ │ ├── form-control.ts
│ │ │ ├── heading.ts
│ │ │ ├── hstack.ts
│ │ │ ├── icon-button.ts
│ │ │ ├── icon.ts
│ │ │ ├── image.ts
│ │ │ ├── index.ts
│ │ │ ├── input.ts
│ │ │ ├── inputleftaddon.ts
│ │ │ ├── inputrightaddon.ts
│ │ │ ├── kbd.ts
│ │ │ ├── keyboardAvoidingView.ts
│ │ │ ├── link.ts
│ │ │ ├── list.ts
│ │ │ ├── menu.ts
│ │ │ ├── modal.ts
│ │ │ ├── number-input.ts
│ │ │ ├── pin-input.ts
│ │ │ ├── popover.ts
│ │ │ ├── pressable.ts
│ │ │ ├── progress.ts
│ │ │ ├── radio-group.ts
│ │ │ ├── radio.ts
│ │ │ ├── scrollView.ts
│ │ │ ├── sectionList.ts
│ │ │ ├── select.ts
│ │ │ ├── simple-grid.ts
│ │ │ ├── skeleton.ts
│ │ │ ├── slider.ts
│ │ │ ├── spinner.ts
│ │ │ ├── square.ts
│ │ │ ├── stack.ts
│ │ │ ├── stat.ts
│ │ │ ├── statusBar.ts
│ │ │ ├── switch.ts
│ │ │ ├── tabs.ts
│ │ │ ├── tag.ts
│ │ │ ├── text.ts
│ │ │ ├── textField.ts
│ │ │ ├── textarea.ts
│ │ │ ├── toast.ts
│ │ │ ├── tooltip.ts
│ │ │ ├── transitions.ts
│ │ │ ├── typeahead.ts
│ │ │ ├── view.ts
│ │ │ ├── vstack.ts
│ │ │ ├── wrap.ts
│ │ │ └── zstack.ts
│ │ ├── index.ts
│ │ ├── styled-system.ts
│ │ ├── tests/
│ │ │ ├── findLastValidBreakpoint.test.tsx
│ │ │ ├── getClosestBreakpoint.test.tsx
│ │ │ ├── hasValidBreakpointFormat.test.tsx
│ │ │ └── mode.test.tsx
│ │ ├── tools/
│ │ │ ├── colors.ts
│ │ │ ├── index.ts
│ │ │ ├── platformUnits.test.js
│ │ │ └── utils.ts
│ │ ├── types.ts
│ │ ├── v3-compatible-theme/
│ │ │ └── index.ts
│ │ └── v33x-theme/
│ │ ├── base/
│ │ │ ├── borders.ts
│ │ │ ├── breakpoints.ts
│ │ │ ├── colors.ts
│ │ │ ├── index.ts
│ │ │ ├── opacity.ts
│ │ │ ├── radius.ts
│ │ │ ├── shadows.ts
│ │ │ ├── sizes.ts
│ │ │ ├── space.ts
│ │ │ ├── types.ts
│ │ │ └── typography.ts
│ │ ├── components/
│ │ │ ├── accordion.ts
│ │ │ ├── actionsheet.ts
│ │ │ ├── alert-dialog.ts
│ │ │ ├── alert.ts
│ │ │ ├── app-bar.ts
│ │ │ ├── aspect-ratio.ts
│ │ │ ├── avatar-badge.ts
│ │ │ ├── avatar-group.ts
│ │ │ ├── avatar.ts
│ │ │ ├── badge.ts
│ │ │ ├── box.ts
│ │ │ ├── breadcrumb.ts
│ │ │ ├── button.ts
│ │ │ ├── card.ts
│ │ │ ├── center.ts
│ │ │ ├── checkbox-group.ts
│ │ │ ├── checkbox.ts
│ │ │ ├── circle.ts
│ │ │ ├── circular-progress.ts
│ │ │ ├── code.ts
│ │ │ ├── container.ts
│ │ │ ├── divider.ts
│ │ │ ├── fab.ts
│ │ │ ├── flatList.ts
│ │ │ ├── flex.ts
│ │ │ ├── form-control.ts
│ │ │ ├── heading.ts
│ │ │ ├── hstack.ts
│ │ │ ├── icon-button.ts
│ │ │ ├── icon.ts
│ │ │ ├── image.ts
│ │ │ ├── index.ts
│ │ │ ├── input.ts
│ │ │ ├── inputleftaddon.ts
│ │ │ ├── inputrightaddon.ts
│ │ │ ├── kbd.ts
│ │ │ ├── keyboardAvoidingView.ts
│ │ │ ├── link.ts
│ │ │ ├── list.ts
│ │ │ ├── menu.ts
│ │ │ ├── modal.ts
│ │ │ ├── number-input.ts
│ │ │ ├── pin-input.ts
│ │ │ ├── popover.ts
│ │ │ ├── pressable.ts
│ │ │ ├── progress.ts
│ │ │ ├── radio-group.ts
│ │ │ ├── radio.ts
│ │ │ ├── scrollView.ts
│ │ │ ├── sectionList.ts
│ │ │ ├── select.ts
│ │ │ ├── simple-grid.ts
│ │ │ ├── skeleton.ts
│ │ │ ├── slider.ts
│ │ │ ├── spinner.ts
│ │ │ ├── square.ts
│ │ │ ├── stack.ts
│ │ │ ├── stat.ts
│ │ │ ├── statusBar.ts
│ │ │ ├── switch.ts
│ │ │ ├── tabs.ts
│ │ │ ├── tag.ts
│ │ │ ├── text.ts
│ │ │ ├── textField.ts
│ │ │ ├── textarea.ts
│ │ │ ├── toast.ts
│ │ │ ├── tooltip.ts
│ │ │ ├── transitions.ts
│ │ │ ├── typeahead.ts
│ │ │ ├── view.ts
│ │ │ ├── vstack.ts
│ │ │ ├── wrap.ts
│ │ │ └── zstack.ts
│ │ ├── index.ts
│ │ └── tools/
│ │ ├── colors.ts
│ │ ├── index.ts
│ │ ├── platformUnits.test.js
│ │ └── utils.ts
│ └── utils/
│ ├── accessibilityTypes.ts
│ ├── accessibilityUtils.ts
│ ├── addTextAndPropsToStrings.tsx
│ ├── canUseDom.ts
│ ├── combineContextAndProps.ts
│ ├── convertStringNumberToNumber.ts
│ ├── createContext.tsx
│ ├── filterShadowProps.ts
│ ├── getAbsoluteChildren.ts
│ ├── getAttachedChildren.ts
│ ├── getIndexedChildren.ts
│ ├── getRNKeyAndStyleValue.ts
│ ├── getSpacedChildren.tsx
│ ├── getStyledFromProps.ts
│ ├── getStyledSystemPropsAndRestProps.ts
│ ├── getUnit.ts
│ ├── index.ts
│ ├── isEmptyObj.ts
│ ├── mergeRefs.ts
│ ├── react-native-web-fucntions/
│ │ ├── atomic.ts
│ │ ├── createReactDOMStyle.ts
│ │ ├── hyphenateStyleName.ts
│ │ ├── normalizeColor.ts
│ │ ├── normalizeValueWithProperty.ts
│ │ ├── prefixStyles.ts
│ │ ├── preprocess.ts
│ │ ├── staticData.ts
│ │ └── unitlessNumbers.ts
│ ├── resolveStackStyleInput.ts
│ ├── styled.tsx
│ ├── test-utils.tsx
│ ├── tests/
│ │ └── filterShadow.test.tsx
│ ├── useKeyboardBottomInset.ts
│ ├── useResponsiveQuery/
│ │ ├── ResponsiveQueryProvider.tsx
│ │ ├── common.ts
│ │ ├── hash.ts
│ │ ├── index.ts
│ │ ├── types.ts
│ │ ├── useResponsiveQuery.tsx
│ │ ├── useResponsiveQuery.web.tsx
│ │ └── useStableMemo.ts
│ └── wrapStringChild.tsx
└── tsconfig.json
================================================
FILE CONTENTS
================================================
================================================
FILE: .editorconfig
================================================
# EditorConfig helps developers define and maintain consistent
# coding styles between different editors and IDEs
# editorconfig.org
root = true
[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
================================================
FILE: .eslintrc.json
================================================
{
"extends": ["@react-native-community", "prettier"],
"rules": {
"prettier/prettier": [
"error",
{
"quoteProps": "preserve",
"singleQuote": true,
"tabWidth": 2,
"trailingComma": "es5",
"useTabs": false
}
],
"no-bitwise": 0,
"prefer-const": "warn",
"no-console": ["error", { "allow": ["warn", "error"] }]
},
"plugins": ["prettier"]
}
================================================
FILE: .github/ISSUE_TEMPLATE/bug_report.yml
================================================
name: 'Bug Report'
description: 'File a bug report'
labels: ['v3', 'bug', 'triage']
body:
- type: 'markdown'
attributes:
value: |
### Before reporting this bug, please...
1. Check the latest documentation: https://docs.nativebase.io/
2. Check for existing open/closed issues for a possible duplicate before creating a new issue: https://github.com/GeekyAnts/NativeBase/issues
3. Use the latest NativeBase release: https://github.com/GeekyAnts/NativeBase/releases
4. Check examples from NativeBase KitchenSink https://github.com/GeekyAnts/NativeBase-KitchenSink
5. For discussion purpose make use of NativeBase discord: https://discord.gg/TSgCw2UPmb
### Help us help you better
- type: 'input'
id: 'description'
attributes:
label: 'Description'
description: 'A clear and concise description of what you expected to happen.'
placeholder: |
What's the bug? And why it's a bug?
validations:
required: true
- type: 'input'
id: 'reproduction'
attributes:
label: 'CodeSandbox/Snack link'
description: |
It would be easier for us to debug if you can reproduce the error in a codesandbox link or a snack link. You can use the [codesandbox template](https://codesandbox.io/s/native-base-v3-template-mq6ox)/[snack template](https://snack.expo.io/@mdrehman/nativebase-template).
placeholder: 'https://codesandbox.io/ or https://snack.expo.dev/'
validations:
required: true
- type: 'textarea'
id: 'steps'
attributes:
label: 'Steps to reproduce'
description: |
Let us know how we reproduce it too.
value: |
1. Go to '...'
2. Click on '...'
3. Scroll down to '...'
4. See error
- type: 'input'
id: 'nativebase-version'
attributes:
label: 'NativeBase Version'
description: 'The version of NativeBase you use.'
placeholder: '3.3.1'
validations:
required: true
- type: 'checkboxes'
id: 'platform'
attributes:
label: 'Platform'
description: 'The platform(s) this issue occurred on'
options:
- label: 'Android'
- label: 'CRA'
- label: 'Expo'
- label: 'iOS'
- label: 'Next'
- type: 'input'
id: 'other-platform'
attributes:
label: 'Other Platform'
description: 'Any other platform besides the above one(s)'
placeholder: 'extra platform(s)'
- type: 'textarea'
id: 'additional-information'
attributes:
label: 'Additional Information'
description: |
Use this section to provide any additional information you might have like screenshots, notes, or links to ideas.
placeholder: 'Any and every additional information is always welcome'
================================================
FILE: .github/ISSUE_TEMPLATE/config.yml
================================================
blank_issues_enabled: false
contact_links:
- name: Join us on Discord
url: https://discord.gg/kcbuQWQv
about: Be the part of the community
================================================
FILE: .github/ISSUE_TEMPLATE/feature_request.yml
================================================
name: 'Feature Request'
description: 'Request a feature or enhancement'
labels: ['v3', 'feature request', 'triage']
body:
- type: 'markdown'
attributes:
value: |
Thanks for filing an issue!
Please search open/closed issues before submitting. Someone might have asked the same thing before!
### Help us help you better
- type: 'textarea'
id: 'description'
attributes:
label: 'Description'
description: 'Describe your request as clearly as possible.'
placeholder: "We'll love to know in depth about this feature"
validations:
required: true
- type: 'textarea'
id: 'justification'
attributes:
label: 'Problem Statement'
description: |
Please provide valid reason(s) why this should be a part of NativeBase
Does this feature meant to solve an existing problem, if so please mention it as well.
placeholder: 'Tell us What? Why? and How?'
validations:
required: true
- type: 'textarea'
id: 'proposed-solution'
attributes:
label: 'Proposed Solution or API'
description: |
Please provide code snippets, gists, or links to the ideal design or API.
placeholder: "We know whatever you're it is, its awesome"
validations:
required: true
- type: 'textarea'
id: 'alternatives'
attributes:
label: 'Alternatives'
description: |
What alternative solutions have you considered before making this request?
placeholder: 'Please share if you know any alternative solutions as well'
- type: 'textarea'
id: 'additional-information'
attributes:
label: 'Additional Information'
description: |
What resources (links, screenshots, etc.) do you have to assist this effort?
placeholder: 'Any and every additional information is always welcome'
================================================
FILE: .github/auto_assign.yml
================================================
# Set to true to add reviewers to pull requests
addReviewers: true
# Set to true to add assignees to pull requests
addAssignees: false
# A list of reviewers to be added to pull requests (GitHub user name)
reviewers:
- surajahmed
- rayan1810
# A number of reviewers added to the pull request
# Set 0 to add all the reviewers (default: 0)
numberOfReviewers: 1
# A list of assignees, overrides reviewers if set
# assignees:
# - assigneeA
# A number of assignees to add to the pull request
# Set to 0 to add all of the assignees.
# Uses numberOfReviewers if unset.
# numberOfAssignees: 2
# A list of keywords to be skipped the process that add reviewers if pull requests include it
# skipKeywords:
# - wip
================================================
FILE: .github/pull_request_template.md
================================================
<!-- Thanks for submitting a pull request! We appreciate you spending the time to work on these changes. Please provide enough information so that others can review your pull request. The three fields below are mandatory. -->
## Summary
<!-- Explain the **motivation** for making this change. What existing problem does the pull request solve? -->
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->
[CATEGORY] [TYPE] - Message
## Test Plan
<!-- Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes the user interface. -->
================================================
FILE: .github/workflows/build.yml
================================================
name: Build
on:
push:
branches:
- master
jobs:
build:
name: Build
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
with:
fetch-depth: 0 # Shallow clones should be disabled for a better relevancy of analysis
- uses: sonarsource/sonarqube-scan-action@master
env:
SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
SONAR_HOST_URL: ${{ secrets.SONAR_HOST_URL }}
# If you wish to fail your job when the Quality Gate is red, uncomment the
# following lines. This would typically be used to fail a deployment.
# - uses: sonarsource/sonarqube-quality-gate-action@master
# timeout-minutes: 5
# env:
# SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
================================================
FILE: .gitignore
================================================
# OSX
#
.DS_Store
# XDE
.expo/
# Xcode
#
build/
*.pbxuser
!default.pbxuser
*.mode1v3
!default.mode1v3
*.mode2v3
!default.mode2v3
*.perspectivev3
!default.perspectivev3
xcuserdata
*.xccheckout
*.moved-aside
DerivedData
*.hmap
*.ipa
*.xcuserstate
project.xcworkspace
# Android/IJ
#
.idea
.gradle
local.properties
android.iml
# Cocoapods
#
RNBareExample/ios/Pods
# node.js
#
node_modules/
npm-debug.log
yarn-debug.log
yarn-error.log
# BUCK
buck-out/
\.buckd/
android/app/libs
android/keystores/debug.keystore
# Expo
.expo/*
# generated by bob
lib/
src/jest/mock.ts
node_modules
# personal
.env
.npmrc
================================================
FILE: .npmignore
================================================
# Dotfiles
.babelrc
.eslintignore
.eslintrc.json
.gitattributes
_config.yml
# Documents
CONTRIBUTING.md
ISSUE_TEMPLATE.txt
img
# Test cases
__tests__
dist/__tests__
# Example
example/
expo-example/
next-example/
RNBareExample/
================================================
FILE: .nvmrc
================================================
v16.13.0
================================================
FILE: .prettierrc
================================================
{
"singleQuote": true,
"jsxBracketSameLine": false,
"useTabs": false,
"eslintIntegration": false,
"tslintIntegration": true,
"parser": "typescript",
"requireConfig": false,
"stylelintIntegration": false
}
================================================
FILE: .vscode/settings.json
================================================
{
"javascript.validate.enable": true,
"eslint.format.enable": false,
"eslint.run": "onType",
"tslint.enable": false,
"tslint.autoFixOnSave": true,
"flow.enabled": false,
"editor.tabSize": 2,
"editor.insertSpaces": true,
"editor.formatOnSave": true,
"flow.useNPMPackagedFlow": true,
"editor.formatOnPaste": false,
"prettier.jsxSingleQuote": true,
"prettier.singleQuote": true,
// Path to a .prettierignore or similar file
"prettier.ignorePath": ".prettierignore",
// If true, puts the `>` of a multi-line jsx element at the end of the last line instead of being alone on the next line
"editor.wordWrap": "on"
}
================================================
FILE: CODE_OF_CONDUCT.md
================================================
# Contributor Covenant Code of Conduct
## Our Pledge
In the interest of fostering an open and welcoming environment, we as
contributors and maintainers pledge to making participation in our project and
our community a harassment-free experience for everyone, regardless of age, body
size, disability, ethnicity, gender identity and expression, level of experience,
nationality, personal appearance, race, religion, or sexual identity and
orientation.
## Our Standards
Examples of behavior that contributes to creating a positive environment
include:
- Using welcoming and inclusive language
- Being respectful of differing viewpoints and experiences
- Gracefully accepting constructive criticism
- Focusing on what is best for the community
- Showing empathy towards other community members
Examples of unacceptable behavior by participants include:
- The use of sexualized language or imagery and unwelcome sexual attention or
advances
- Trolling, insulting/derogatory comments, and personal or political attacks
- Public or private harassment
- Publishing others' private information, such as a physical or electronic
address, without explicit permission
- Other conduct which could reasonably be considered inappropriate in a
professional setting
## Our Responsibilities
Project maintainers are responsible for clarifying the standards of acceptable
behavior and are expected to take appropriate and fair corrective action in
response to any instances of unacceptable behavior.
Project maintainers have the right and responsibility to remove, edit, or
reject comments, commits, code, wiki edits, issues, and other contributions
that are not aligned to this Code of Conduct, or to ban temporarily or
permanently any contributor for other behaviors that they deem inappropriate,
threatening, offensive, or harmful.
## Scope
This Code of Conduct applies both within project spaces and in public spaces
when an individual is representing the project or its community. Examples of
representing a project or community include using an official project e-mail
address, posting via an official social media account, or acting as an appointed
representative at an online or offline event. Representation of a project may be
further defined and clarified by project maintainers.
## Enforcement
Instances of abusive, harassing, or otherwise unacceptable behavior may be
reported by contacting the project team at support@nativebase.io. All
complaints will be reviewed and investigated and will result in a response that
is deemed necessary and appropriate to the circumstances. The project team is
obligated to maintain confidentiality with regard to the reporter of an incident.
Further details of specific enforcement policies may be posted separately.
Project maintainers who do not follow or enforce the Code of Conduct in good
faith may face temporary or permanent repercussions as determined by other
members of the project's leadership.
## Attribution
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
available at [http://contributor-covenant.org/version/1/4][version]
[homepage]: http://contributor-covenant.org
[version]: http://contributor-covenant.org/version/1/4/
================================================
FILE: CONTRIBUTING.md
================================================
# Contributing to NativeBase
We'd love for you to contribute to our source code and to make NativeBase even better than it is
today! Here are some guidelines we'd like you to follow:
- [Code of Conduct](#coc)
- [Ways to Contribute](#wtc)
- [Questions and Problems](#question)
- [Issues and Bugs](#issue)
- [Feature Requests](#feature)
- [Issue Submission Guidelines](#submit)
- [Setting Up Development Environment ](#dev-env)
- [Pull Request Submission Guidelines](#submit-pr)
- [Improving Documentation](#docs)
## <a name="coc"></a> Code of Conduct
Help us keep NativeBase open and inclusive. Please read and follow our [Code of Conduct](CODE_OF_CONDUCT.md).
## <a name="wtc"></a> Ways to Contribute
If you are eager to start contributing code right away, you can go through [NativeBase Bugs](https://github.com/GeekyAnts/NativeBase/issues?q=is%3Aopen+is%3Aissue+label%3Abug) that contain bugs.
There are other ways you can contribute without writing a single line of code. Here are a few things you can do to help out:
1. **Replying and handling open issues.** We get a lot of issues every day, and some of them may lack necessary information. You can help out by guiding people through the process of filling out the issue template, asking for clarifying information, or pointing them to existing issues that match their description of the problem.
2. **Reviewing pull requests for the docs.** Reviewing [documentation updates](https://github.com/GeekyAnts/nativebase-docs/pulls) can be as simple as checking for spelling and grammar. If you encounter situations that can be explained better in the docs, click **Edit** at the bottom left of most docs pages to get started with your own contribution.
3. **Help people write test plans.** Some pull requests sent to the main repository may lack a proper test plan. These help reviewers understand how the change was tested, and can speed up the time it takes for a contribution to be accepted.
Each of these tasks is highly impactful, and maintainers will greatly appreciate your help.
## <a name="requests"></a> Questions, Bugs, Features
### <a name="question"></a> Got a Question or Problem?
Do not open issues for general support questions as we want to keep GitHub issues for bug reports
and feature requests. You've got much better chances of getting your question answered on dedicated
support platforms, the best being [Stack Overflow](http://stackoverflow.com/questions/tagged/native-base).
Stack Overflow is a much better place to ask questions since:
- there are thousands of people willing to help on Stack Overflow
- questions and answers stay available for public viewing so your question / answer might help
someone else
- Stack Overflow's voting system assures that the best answers are prominently visible.
To save your and our time, we will systematically close all issues that are requests for general
support and redirect people to the section you are reading right now.
### <a name="issue"></a> Found an Issue or Bug?
If you find a bug in the source code, you can help us by submitting an issue to our
[GitHub Repository](https://github.com/GeekyAnts/NativeBase/issues). Even better, you can submit a Pull Request with a fix.
**Please see the [Submission Guidelines](#submit) below.**
### <a name="feature"></a> Missing a Feature?
You can request a new feature by submitting an issue to our [GitHub Repository](https://github.com/GeekyAnts/NativeBase/issues).
If you would like to implement a new feature then consider what kind of change it is:
- **Major Changes** that you wish to contribute to the project should be discussed first in an
[GitHub issue](https://github.com/GeekyAnts/NativeBase/issues) that clearly outlines the changes and benefits of the feature.
- **Small Changes** can directly be crafted and submitted to the [GitHub Repository](https://github.com/GeekyAnts/NativeBase)
as a Pull Request. See the section about [Contributing Code](#submit-pr).
## <a name="submit"></a> Issue Submission Guidelines
Before you submit your issue search the archive, maybe your question was already answered.
If your issue appears to be a bug, and hasn't been reported, open a new issue. Help us to maximize
the effort we can spend fixing issues and adding new features, by not reporting duplicate issues.
The "[new issue](https://github.com/GeekyAnts/NativeBase/issues/new)" form contains a number of prompts that you should fill out to
make it easier to understand and categorize the issue.
In general, providing the following information will increase the chances of your issue being dealt
with quickly:
- **Issue Description** - if an error is being thrown a non-minified stack trace helps
- **Motivation for or Use Case** - explain why this is a bug for you
- **NativeBase Version(s)** - is it a regression?
- **Browsers and Operating System** - is this a problem with all browsers or only specific ones?
- **Reproduce the Error** - provide a live example (using [expo snack](https://snack.expo.io/) or an unambiguous set of steps.
- **Related Issues** - has a similar issue been reported before?
- **Suggest a Fix** - if you can't fix the bug yourself, perhaps you can point to what might be
causing the problem (line of code or commit)
## <a name="dev-env"></a> Setting Up your Development Environment
- Fork this repository.
- Clone your fork of NativeBase:
```git
git clone git@github.com:${YOUR_USERNAME}/NativeBase.git
```
- Navigate to NativeBase
```
cd NativeBase/
```
- Add main repo remote:
```git
git remote add nativebase git@github.com:GeekyAnts/NativeBase.git
```
- Install dependencies:
```bash
yarn
```
- Move over to the TestBed Example App and install the dependencies :
```bash
cd example
yarn
```
- Navigate back to your app:
```bash
cd ..
```
- Start the Example App:
```bash
yarn example start
```
- To start app directly on Web
```bash
yarn example web
```
- To start app directly on IOS
```bash
yarn example ios
```
- To start app directly on Android
```bash
yarn example android
```
and start making the changes.
## <a name="submit-pr"></a> Contributing Code
Code-level contributions to NativeBase come in the form of [pull requests](https://help.github.com/en/articles/about-pull-requests). These are done by forking the repo and making changes locally. Directly in the repo, there is the [`Storybook Testbed` app](/example) that you can run on your device (or simulators) and use to test the changes you're making to NativeBase source.
The process of proposing a change to NativeBase can be summarized as follows:
1. Fork the NativeBase repository and create your branch from `master`.
2. Make the desired changes to NativeBase source. Use the `Storybook Testbed` app to test them out.
3. If you've added code that should be tested, add tests.
4. If you've changed APIs, update the documentation, which is available [here](https://github.com/GeekyAnts/nativebase-docs).
5. Ensure the test suite passes, either locally or on CI once you opened a pull request.
6. Make sure your code lints. To keep project away from disputes we make use of **ESLint**, which is really a handy linting tool that enforces strict coding styles and makes sure your files are free from dead code. Each module of NativeBase has bundled ESLint as a dev dependency and checks your code everytime you commit.
7. Push the changes to your fork.
8. Create a pull request to the NativeBase repository.
9. Review and address comments on your pull request.
If all goes well, your pull request will be merged. If it is not merged, maintainers will do their best to explain the reason why.
## <a name="docs"></a> Helping with Documentation
The NativeBase documentation is hosted as part of the NativeBase website repository at https://github.com/GeekyAnts/nativebase-docs. The website itself is located at <https://alpha.nativebase.io/> and it is built using [Docusaurus V2](https://v2.docusaurus.io/). If there's anything you'd like to change in the docs, you can get started by clicking on the "Edit" button located on the bottom left of most pages on the website.
================================================
FILE: LICENSE
================================================
The MIT License (MIT)
Copyright (c) 2021 GeekyAnts India Pvt Ltd
Permission is hereby granted, free of charge, to any person obtaining a copy of
this software and associated documentation files (the "Software"), to deal in
the Software without restriction, including without limitation the rights to
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
the Software, and to permit persons to whom the Software is furnished to do so,
subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
================================================
FILE: README.md
================================================
# ⛔️ DEPRECATED
# NativeBase ↔ gluestack
> 🚀 NativeBase is evolving into gluestack-ui! What was planned as NativeBase v4 is now available as gluestack-ui - our next-generation component library built for better performance, enhanced customization, and improved developer experience. Visit [gluestack.io](http://gluestack.io) to get started!
## Important Notice: Evolution to gluestack-ui
NativeBase is entering maintenance mode as we evolve into gluestack-ui. This transition represents our commitment to providing the React Native community with more powerful, flexible, and performant UI components. If you are starting a new project with NativeBase, we recommend using [gluestack-ui](https://ui.gluestack.io/) instead. [Know More](https://nativebase.io/blogs/road-ahead-with-gluestack-ui).
# <img src="https://raw.githubusercontent.com/GeekyAnts/NativeBase/master/img/header_new.png" alt="Nativebase Logo">
[](https://opencollective.com/NativeBase)
[](https://discord.com/invite/TSgCw2UPmb)
[](https://www.npmjs.com/package/native-base)
[](https://www.npmjs.com/package/native-base)
[](https://npm-stat.com/charts.html?package=native-base)
[](https://github.com/GeekyAnts/NativeBase/blob/master/LICENSE)
[](https://twitter.com/nativebase)
[](https://img.shields.io/github/stars/GeekyAnts/NativeBase)
## NativeBase is a mobile-first, accessible component library for building a consistent design system across android, iOS & web.
[**Website**](https://nativebase.io/)
<br/>
[**Documentation**](https://docs.nativebase.io/)
## About GeekyAnts
NativeBase is built and maintained by [GeekyAnts](https://geekyants.com?utm_source=github&utm_medium=opensource&utm_campaign=nativebase),
a product development studio with expertise in:
- [React Native Development](https://geekyants.com/hire-react-native-developers?utm_source=github&utm_medium=opensource&utm_campaign=nativebase) -
Building production-ready mobile applications
- [Design Systems](https://geekyants.com/solution/design-system-development-service?utm_source=github&utm_medium=opensource&utm_campaign=nativebase) -
Creating scalable UI component libraries
- [Cross-Platform Development](https://geekyants.com/solution/universal-and-cross-platform-app-development-services?utm_source=github&utm_medium=opensource&utm_campaign=nativebase) -
Universal apps for iOS, Android, and Web
### Get Professional Support
Need help implementing NativeBase in your project?
[Contact our mobile engineering team](https://geekyants.com/hire?utm_source=github&utm_medium=opensource&utm_campaign=nativebase) for:
- Custom component development
- Performance optimization
- Enterprise support plans
[Explore all services](https://geekyants.com/service?utm_source=github&utm_medium=opensource&utm_campaign=nativebase) |
[View our open source projects](https://geekyants.com/open-source?utm_source=github&utm_medium=opensource&utm_campaign=nativebase)
## Table of Contents
1. [Introduction](#1-introduction)
2. [Motivation](#2-motivation)
3. [Features](#3-features)
4. [Dependencies](#4-dependencies)
5. [Installation & Setup](#5-installation)
6. [Components](#6-components)
7. [Examples](#7-examples)
8. [KitchenSink App](#8-kitchensink-app)
9. [Tech Stack](#9-tech-stack)
10. [Compatible Versions](#10-compatible-versions)
11. [Contributors](#11-contributors)
12. [Changelog](#12-changelog)
13. [Community](#13-community)
14. [License](#14-license)
## 1. Introduction?
[NativeBase](https://nativebase.io/) is a mobile-first, component library for React & React Native. Version 3.0 ships with complete ARIA integration, support for utility props and nearly 40 components that are consistent across Android, iOS and Web. Fast-track your dev process with NativeBase 3.0.
**Recommended by [Awesome React Native](https://github.com/jondot/awesome-react-native)**
> NativeBase was added to the list of Frameworks of Awesome React Native and it is used by numerous React lovers across the world.
## 2. Motivation
Building with React Native from scratch is a tedious process with multiple steps such as adding styling, interactions, state management, responsiveness, accessibility, etc. We wanted to build and ship accessible, high-quality apps quickly.
<br />
Our inspirations include Material UI, Chakra UI, Ant Design, Braid Design System, Bootstrap, TailwindCSS & Flutter.
## 3. Features
### **Out of the Box Accessibility**
Integrated with React ARIA and React Native ARIA, which provides React hooks. This enables you to build accessible design systems in no time.
<img src="https://raw.githubusercontent.com/GeekyAnts/NativeBase/development/img/feature.png" alt="Out of the box accessibility">
### **Supporting Utility Props**
Powered by [Styled System](https://styled-system.com) so you can rapidly build custom UI components with constraint-based utility style props.
### **Rich Component Library**
NativeBase offers around 40 components so you can build seamlessly. It includes button, checkbox, flex, stack and more.
### **Highly Themeable**
Themeability is one of the core elements of NativeBase. You can customise your app theme and component styles to your heart's content.
<img src="https://raw.githubusercontent.com/GeekyAnts/NativeBase/development/img/theme.png" alt="Nativebase Logo">
### **Available for Both Mobile and Web**
NativeBase 3.0 is powered by React Native Web so you can build consistent UIs across Web, Android and iOS.
### **Responsiveness Made Easy**
Instead of manually adding responsiveness, NativeBase 3.0 allows you to provide object and array values to add responsive styles.
### **Now with** **Dark Mode**
Building apps with a dark mode setting just got a whole lot easier. NativeBase is now optimised for light and dark modes.
## 4. Dependencies
React Native, Expo
## 5. Installation
NativeBase is supported in Expo or React Native CLI initiated apps. Web support is made possible by react-native-web.
Refer the [guides](https://docs.nativebase.io/installation) to setup NativeBase in your React app.
## 6. Components
NativeBase 3.0 is a rich component library with nearly 40 components.
- [**Layout**](https://docs.nativebase.io/box)
- [**Forms**](https://docs.nativebase.io/button)
- [**Data Display**](https://docs.nativebase.io/badge)
- [**Feedback**](https://docs.nativebase.io/alert)
- [**Typography**](https://docs.nativebase.io/text)
- [**Overlay** ](https://docs.nativebase.io/alert-dialog)
- [**Disclosure**](https://docs.nativebase.io/action-sheet)
- [**Media & Icons**](https://docs.nativebase.io/avatar)
- [**Transition**](https://docs.nativebase.io/presence-transition)
- [**Other**](https://docs.nativebase.io/fab)
## 7. Examples
[Check out the Todo-List example](https://docs.nativebase.io/todo-list)
## 8. KitchenSink App
[Kitchen Sink](https://kitchensink.nativebase.io/) is a comprehensive demo app showcasing all the NativeBase components in action. It includes buttons, forms, icons, etc.
<div class="flexible">
<img src="https://github.com/GeekyAnts/NativeBase/raw/development/img/kitchensink.gif" height="500px" alt="Kitchensink App gif">
<img src="https://raw.githubusercontent.com/GeekyAnts/NativeBase/development/img/qr.png" height="500px" alt="Kitchensink App QR code">
</div>
## 9. Tech Stack
JavaScript, React Native, Styled System
### Made with :heart: at [GeekyAnts](https://geekyants.com/?utm_source=nb-github&utm_medium=landing+page&utm_campaign=nativebase-github-cta)
NativeBase is an open-source project made by the tech-savvy geeks at GeekyAnts.
GeekyAnts is a group of React Native experts. Do [get in touch with us](https://geekyants.com/hire/?utm_source=nb-github&utm_medium=landing+page&utm_campaign=nativebase-github-hire-cta) for any help with your React Native project. Always happy to help!
## 10. Compatible Versions
| NativeBase | React Native |
| -------------------------------- | ---------------------------------------------------------- |
| v0.1.1 | v0.22 to v0.23 |
| v0.2.0 to v0.3.1 | v0.24 to v0.25 |
| v0.4.6 to v0.4.9 | v0.26.0 - v0.27.1 |
| v0.5.0 to v0.5.15 | v0.26.0 - v0.37.0 |
| v0.5.16 to v0.5.20 | v0.38.0 - v0.39.0 |
| v2.0.0-alpha1 to v2.1.3 | v0.38.0 to v0.43.0 |
| v2.1.4 to v2.1.5 | v0.44.0 to v0.45.0 |
| v2.2.0 | v0.44.0 to v0.45.0 |
| v2.2.1 | v0.46.0 and above |
| v2.3.0 to 2.6.1 | v0.46.0 and above (does not support React 16.0.0-alpha.13) |
| v2.7.0 | v0.56.0 and above |
| v3.0.0-next.36 to v3.0.0-next-41 | v0.63.0 and above |
| v3.0.0 to latest | v0.63.0 and above |
## 11. Contributors
### Code Contributors
This project exists thanks to all the people who contribute. [[Contribute](CONTRIBUTING.md)].
<a href="https://github.com/GeekyAnts/NativeBase/graphs/contributors"><img src="https://opencollective.com/NativeBase/contributors.svg?width=890&button=false" /></a>
### Financial Contributors
Become a financial contributor and help us sustain our community. [[Contribute](https://opencollective.com/NativeBase/contribute)]
#### Individuals
<a href="https://opencollective.com/NativeBase"><img src="https://opencollective.com/NativeBase/individuals.svg?width=890"></a>
#### Organizations
Support this project with your organization. Your logo will show up here with a link to your website. [[Contribute](https://opencollective.com/NativeBase/contribute)]
<a href="https://opencollective.com/NativeBase/organization/0/website"><img src="https://opencollective.com/NativeBase/organization/0/avatar.svg"></a>
<a href="https://opencollective.com/NativeBase/organization/1/website"><img src="https://opencollective.com/NativeBase/organization/1/avatar.svg"></a>
<a href="https://opencollective.com/NativeBase/organization/2/website"><img src="https://opencollective.com/NativeBase/organization/2/avatar.svg"></a>
<a href="https://opencollective.com/NativeBase/organization/3/website"><img src="https://opencollective.com/NativeBase/organization/3/avatar.svg"></a>
<a href="https://opencollective.com/NativeBase/organization/4/website"><img src="https://opencollective.com/NativeBase/organization/4/avatar.svg"></a>
<a href="https://opencollective.com/NativeBase/organization/5/website"><img src="https://opencollective.com/NativeBase/organization/5/avatar.svg"></a>
<a href="https://opencollective.com/NativeBase/organization/6/website"><img src="https://opencollective.com/NativeBase/organization/6/avatar.svg"></a>
<a href="https://opencollective.com/NativeBase/organization/7/website"><img src="https://opencollective.com/NativeBase/organization/7/avatar.svg"></a>
<a href="https://opencollective.com/NativeBase/organization/8/website"><img src="https://opencollective.com/NativeBase/organization/8/avatar.svg"></a>
<a href="https://opencollective.com/NativeBase/organization/9/website"><img src="https://opencollective.com/NativeBase/organization/9/avatar.svg"></a>
## 12. Changelog
[Check out the changelog in the official documentation](https://docs.nativebase.io/changelog)
## 13. Community
- [Facebook](https://www.facebook.com/nativebaseio)
- [Twitter](https://twitter.com/nativebase)
- [Discord](https://discord.com/invite/TSgCw2UPmb)
- [Stackoverflow](https://stackoverflow.com/questions/tagged/native-base)
- [Blog](https://nativebase.io/blogs)
- [YouTube](https://www.youtube.com/channel/UCoL_iTwpY07vDs91974z3xA/about)
## 14. License
Licensed under the MIT License, Copyright © 2021 GeekyAnts. See [LICENSE](https://github.com/GeekyAnts/NativeBase/blob/master/LICENSE) for more information.
Built with ❤️ by [GeekyAnts](https://geekyants.com?utm_source=github&utm_medium=opensource&utm_campaign=nativebase) |
[React Native Experts](https://geekyants.com/hire-react-native-developers?utm_source=github&utm_medium=opensource&utm_campaign=nativebase)
================================================
FILE: RNBareExample/.buckconfig
================================================
[android]
target = Google Inc.:Google APIs:23
[maven_repositories]
central = https://repo1.maven.org/maven2
================================================
FILE: RNBareExample/.eslintrc.js
================================================
module.exports = {
root: true,
extends: '@react-native-community',
};
================================================
FILE: RNBareExample/.gitattributes
================================================
# Windows files should use crlf line endings
# https://help.github.com/articles/dealing-with-line-endings/
*.bat text eol=crlf
================================================
FILE: RNBareExample/.gitignore
================================================
# OSX
#
.DS_Store
# Xcode
#
build/
*.pbxuser
!default.pbxuser
*.mode1v3
!default.mode1v3
*.mode2v3
!default.mode2v3
*.perspectivev3
!default.perspectivev3
xcuserdata
*.xccheckout
*.moved-aside
DerivedData
*.hmap
*.ipa
*.xcuserstate
# Android/IntelliJ
#
build/
.idea
.gradle
local.properties
*.iml
# node.js
#
node_modules/
npm-debug.log
yarn-error.log
# BUCK
buck-out/
\.buckd/
*.keystore
!debug.keystore
# fastlane
#
# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
# screenshots whenever they are needed.
# For more information about the recommended setup visit:
# https://docs.fastlane.tools/best-practices/source-control/
*/fastlane/report.xml
*/fastlane/Preview.html
*/fastlane/screenshots
# Bundle artifact
*.jsbundle
# CocoaPods
/ios/Pods/
================================================
FILE: RNBareExample/.prettierrc.js
================================================
module.exports = {
bracketSpacing: false,
jsxBracketSameLine: true,
singleQuote: true,
trailingComma: 'all',
arrowParens: 'avoid',
};
================================================
FILE: RNBareExample/.watchmanconfig
================================================
{}
================================================
FILE: RNBareExample/App.tsx
================================================
import React from 'react';
import {NativeBaseProvider, Box, Center} from 'native-base';
const config = {
dependencies: {
'linear-gradient': require('react-native-linear-gradient').default,
},
};
const App = () => {
return (
<NativeBaseProvider config={config}>
<Center flex={1}>
<Box
bg={{
linearGradient: {
colors: ['lightBlue.300', 'violet.800'],
start: [0, 0],
end: [1, 0],
},
}}
p={12}
rounded="lg"
_text={{fontSize: 'md', fontWeight: 'bold', color: 'white'}}>
This is a Box with Linear Gradient
</Box>
</Center>
</NativeBaseProvider>
);
};
export default App;
================================================
FILE: RNBareExample/_editorconfig
================================================
# Windows files
[*.bat]
end_of_line = crlf
================================================
FILE: RNBareExample/android/app/_BUCK
================================================
# To learn about Buck see [Docs](https://buckbuild.com/).
# To run your application with Buck:
# - install Buck
# - `npm start` - to start the packager
# - `cd android`
# - `keytool -genkey -v -keystore keystores/debug.keystore -storepass android -alias androiddebugkey -keypass android -dname "CN=Android Debug,O=Android,C=US"`
# - `./gradlew :app:copyDownloadableDepsToLibs` - make all Gradle compile dependencies available to Buck
# - `buck install -r android/app` - compile, install and run application
#
load(":build_defs.bzl", "create_aar_targets", "create_jar_targets")
lib_deps = []
create_aar_targets(glob(["libs/*.aar"]))
create_jar_targets(glob(["libs/*.jar"]))
android_library(
name = "all-libs",
exported_deps = lib_deps,
)
android_library(
name = "app-code",
srcs = glob([
"src/main/java/**/*.java",
]),
deps = [
":all-libs",
":build_config",
":res",
],
)
android_build_config(
name = "build_config",
package = "com.rnbareexample",
)
android_resource(
name = "res",
package = "com.rnbareexample",
res = "src/main/res",
)
android_binary(
name = "app",
keystore = "//android/keystores:debug",
manifest = "src/main/AndroidManifest.xml",
package_type = "debug",
deps = [
":app-code",
],
)
================================================
FILE: RNBareExample/android/app/build.gradle
================================================
apply plugin: "com.android.application"
import com.android.build.OutputFile
/**
* The react.gradle file registers a task for each build variant (e.g. bundleDebugJsAndAssets
* and bundleReleaseJsAndAssets).
* These basically call `react-native bundle` with the correct arguments during the Android build
* cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the
* bundle directly from the development server. Below you can see all the possible configurations
* and their defaults. If you decide to add a configuration block, make sure to add it before the
* `apply from: "../../node_modules/react-native/react.gradle"` line.
*
* project.ext.react = [
* // the name of the generated asset file containing your JS bundle
* bundleAssetName: "index.android.bundle",
*
* // the entry file for bundle generation. If none specified and
* // "index.android.js" exists, it will be used. Otherwise "index.js" is
* // default. Can be overridden with ENTRY_FILE environment variable.
* entryFile: "index.android.js",
*
* // https://reactnative.dev/docs/performance#enable-the-ram-format
* bundleCommand: "ram-bundle",
*
* // whether to bundle JS and assets in debug mode
* bundleInDebug: false,
*
* // whether to bundle JS and assets in release mode
* bundleInRelease: true,
*
* // whether to bundle JS and assets in another build variant (if configured).
* // See http://tools.android.com/tech-docs/new-build-system/user-guide#TOC-Build-Variants
* // The configuration property can be in the following formats
* // 'bundleIn${productFlavor}${buildType}'
* // 'bundleIn${buildType}'
* // bundleInFreeDebug: true,
* // bundleInPaidRelease: true,
* // bundleInBeta: true,
*
* // whether to disable dev mode in custom build variants (by default only disabled in release)
* // for example: to disable dev mode in the staging build type (if configured)
* devDisabledInStaging: true,
* // The configuration property can be in the following formats
* // 'devDisabledIn${productFlavor}${buildType}'
* // 'devDisabledIn${buildType}'
*
* // the root of your project, i.e. where "package.json" lives
* root: "../../",
*
* // where to put the JS bundle asset in debug mode
* jsBundleDirDebug: "$buildDir/intermediates/assets/debug",
*
* // where to put the JS bundle asset in release mode
* jsBundleDirRelease: "$buildDir/intermediates/assets/release",
*
* // where to put drawable resources / React Native assets, e.g. the ones you use via
* // require('./image.png')), in debug mode
* resourcesDirDebug: "$buildDir/intermediates/res/merged/debug",
*
* // where to put drawable resources / React Native assets, e.g. the ones you use via
* // require('./image.png')), in release mode
* resourcesDirRelease: "$buildDir/intermediates/res/merged/release",
*
* // by default the gradle tasks are skipped if none of the JS files or assets change; this means
* // that we don't look at files in android/ or ios/ to determine whether the tasks are up to
* // date; if you have any other folders that you want to ignore for performance reasons (gradle
* // indexes the entire tree), add them here. Alternatively, if you have JS files in android/
* // for example, you might want to remove it from here.
* inputExcludes: ["android/**", "ios/**"],
*
* // override which node gets called and with what additional arguments
* nodeExecutableAndArgs: ["node"],
*
* // supply additional arguments to the packager
* extraPackagerArgs: []
* ]
*/
project.ext.react = [
enableHermes: false, // clean and rebuild if changing
]
apply from: "../../node_modules/react-native/react.gradle"
/**
* Set this to true to create two separate APKs instead of one:
* - An APK that only works on ARM devices
* - An APK that only works on x86 devices
* The advantage is the size of the APK is reduced by about 4MB.
* Upload all the APKs to the Play Store and people will download
* the correct one based on the CPU architecture of their device.
*/
def enableSeparateBuildPerCPUArchitecture = false
/**
* Run Proguard to shrink the Java bytecode in release builds.
*/
def enableProguardInReleaseBuilds = false
/**
* The preferred build flavor of JavaScriptCore.
*
* For example, to use the international variant, you can use:
* `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
*
* The international variant includes ICU i18n library and necessary data
* allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
* give correct results when using with locales other than en-US. Note that
* this variant is about 6MiB larger per architecture than default.
*/
def jscFlavor = 'org.webkit:android-jsc:+'
/**
* Whether to enable the Hermes VM.
*
* This should be set on project.ext.react and mirrored here. If it is not set
* on project.ext.react, JavaScript will not be compiled to Hermes Bytecode
* and the benefits of using Hermes will therefore be sharply reduced.
*/
def enableHermes = project.ext.react.get("enableHermes", false);
android {
ndkVersion rootProject.ext.ndkVersion
compileSdkVersion rootProject.ext.compileSdkVersion
compileOptions {
sourceCompatibility JavaVersion.VERSION_1_8
targetCompatibility JavaVersion.VERSION_1_8
}
defaultConfig {
applicationId "com.rnbareexample"
minSdkVersion rootProject.ext.minSdkVersion
targetSdkVersion rootProject.ext.targetSdkVersion
versionCode 1
versionName "1.0"
}
splits {
abi {
reset()
enable enableSeparateBuildPerCPUArchitecture
universalApk false // If true, also generate a universal APK
include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
}
}
signingConfigs {
debug {
storeFile file('debug.keystore')
storePassword 'android'
keyAlias 'androiddebugkey'
keyPassword 'android'
}
}
buildTypes {
debug {
signingConfig signingConfigs.debug
}
release {
// Caution! In production, you need to generate your own keystore file.
// see https://reactnative.dev/docs/signed-apk-android.
signingConfig signingConfigs.debug
minifyEnabled enableProguardInReleaseBuilds
proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
}
}
// applicationVariants are e.g. debug, release
applicationVariants.all { variant ->
variant.outputs.each { output ->
// For each separate APK per architecture, set a unique version code as described here:
// https://developer.android.com/studio/build/configure-apk-splits.html
// Example: versionCode 1 will generate 1001 for armeabi-v7a, 1002 for x86, etc.
def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4]
def abi = output.getFilter(OutputFile.ABI)
if (abi != null) { // null for the universal-debug, universal-release variants
output.versionCodeOverride =
defaultConfig.versionCode * 1000 + versionCodes.get(abi)
}
}
}
}
dependencies {
implementation fileTree(dir: "libs", include: ["*.jar"])
//noinspection GradleDynamicVersion
implementation "com.facebook.react:react-native:+" // From node_modules
implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"
debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
exclude group:'com.facebook.fbjni'
}
debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
exclude group:'com.facebook.flipper'
exclude group:'com.squareup.okhttp3', module:'okhttp'
}
debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}") {
exclude group:'com.facebook.flipper'
}
if (enableHermes) {
def hermesPath = "../../node_modules/hermes-engine/android/";
debugImplementation files(hermesPath + "hermes-debug.aar")
releaseImplementation files(hermesPath + "hermes-release.aar")
} else {
implementation jscFlavor
}
}
// Run this once to be able to run the application with BUCK
// puts all compile dependencies into folder libs for BUCK to use
task copyDownloadableDepsToLibs(type: Copy) {
from configurations.compile
into 'libs'
}
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)
================================================
FILE: RNBareExample/android/app/build_defs.bzl
================================================
"""Helper definitions to glob .aar and .jar targets"""
def create_aar_targets(aarfiles):
for aarfile in aarfiles:
name = "aars__" + aarfile[aarfile.rindex("/") + 1:aarfile.rindex(".aar")]
lib_deps.append(":" + name)
android_prebuilt_aar(
name = name,
aar = aarfile,
)
def create_jar_targets(jarfiles):
for jarfile in jarfiles:
name = "jars__" + jarfile[jarfile.rindex("/") + 1:jarfile.rindex(".jar")]
lib_deps.append(":" + name)
prebuilt_jar(
name = name,
binary_jar = jarfile,
)
================================================
FILE: RNBareExample/android/app/proguard-rules.pro
================================================
# Add project specific ProGuard rules here.
# By default, the flags in this file are appended to flags specified
# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
# You can edit the include path and order by changing the proguardFiles
# directive in build.gradle.
#
# For more details, see
# http://developer.android.com/guide/developing/tools/proguard.html
# Add any project specific keep options here:
================================================
FILE: RNBareExample/android/app/src/debug/AndroidManifest.xml
================================================
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
<application
android:usesCleartextTraffic="true"
tools:targetApi="28"
tools:ignore="GoogleAppIndexingWarning">
<activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
</application>
</manifest>
================================================
FILE: RNBareExample/android/app/src/debug/java/com/rnbareexample/ReactNativeFlipper.java
================================================
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* <p>This source code is licensed under the MIT license found in the LICENSE file in the root
* directory of this source tree.
*/
package com.rnbareexample;
import android.content.Context;
import com.facebook.flipper.android.AndroidFlipperClient;
import com.facebook.flipper.android.utils.FlipperUtils;
import com.facebook.flipper.core.FlipperClient;
import com.facebook.flipper.plugins.crashreporter.CrashReporterPlugin;
import com.facebook.flipper.plugins.databases.DatabasesFlipperPlugin;
import com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin;
import com.facebook.flipper.plugins.inspector.DescriptorMapping;
import com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin;
import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor;
import com.facebook.flipper.plugins.network.NetworkFlipperPlugin;
import com.facebook.flipper.plugins.react.ReactFlipperPlugin;
import com.facebook.flipper.plugins.sharedpreferences.SharedPreferencesFlipperPlugin;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.bridge.ReactContext;
import com.facebook.react.modules.network.NetworkingModule;
import okhttp3.OkHttpClient;
public class ReactNativeFlipper {
public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
if (FlipperUtils.shouldEnableFlipper(context)) {
final FlipperClient client = AndroidFlipperClient.getInstance(context);
client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));
client.addPlugin(new ReactFlipperPlugin());
client.addPlugin(new DatabasesFlipperPlugin(context));
client.addPlugin(new SharedPreferencesFlipperPlugin(context));
client.addPlugin(CrashReporterPlugin.getInstance());
NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
NetworkingModule.setCustomClientBuilder(
new NetworkingModule.CustomClientBuilder() {
@Override
public void apply(OkHttpClient.Builder builder) {
builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
}
});
client.addPlugin(networkFlipperPlugin);
client.start();
// Fresco Plugin needs to ensure that ImagePipelineFactory is initialized
// Hence we run if after all native modules have been initialized
ReactContext reactContext = reactInstanceManager.getCurrentReactContext();
if (reactContext == null) {
reactInstanceManager.addReactInstanceEventListener(
new ReactInstanceManager.ReactInstanceEventListener() {
@Override
public void onReactContextInitialized(ReactContext reactContext) {
reactInstanceManager.removeReactInstanceEventListener(this);
reactContext.runOnNativeModulesQueueThread(
new Runnable() {
@Override
public void run() {
client.addPlugin(new FrescoFlipperPlugin());
}
});
}
});
} else {
client.addPlugin(new FrescoFlipperPlugin());
}
}
}
}
================================================
FILE: RNBareExample/android/app/src/main/AndroidManifest.xml
================================================
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.rnbareexample">
<uses-permission android:name="android.permission.INTERNET" />
<application
android:name=".MainApplication"
android:label="@string/app_name"
android:icon="@mipmap/ic_launcher"
android:roundIcon="@mipmap/ic_launcher_round"
android:allowBackup="false"
android:theme="@style/AppTheme">
<activity
android:name=".MainActivity"
android:label="@string/app_name"
android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode"
android:launchMode="singleTask"
android:windowSoftInputMode="adjustResize">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
================================================
FILE: RNBareExample/android/app/src/main/java/com/rnbareexample/MainActivity.java
================================================
package com.rnbareexample;
import com.facebook.react.ReactActivity;
public class MainActivity extends ReactActivity {
/**
* Returns the name of the main component registered from JavaScript. This is used to schedule
* rendering of the component.
*/
@Override
protected String getMainComponentName() {
return "RNBareExample";
}
}
================================================
FILE: RNBareExample/android/app/src/main/java/com/rnbareexample/MainApplication.java
================================================
package com.rnbareexample;
import android.app.Application;
import android.content.Context;
import com.facebook.react.PackageList;
import com.facebook.react.ReactApplication;
import com.BV.LinearGradient.LinearGradientPackage;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.soloader.SoLoader;
import java.lang.reflect.InvocationTargetException;
import java.util.List;
public class MainApplication extends Application implements ReactApplication {
private final ReactNativeHost mReactNativeHost =
new ReactNativeHost(this) {
@Override
public boolean getUseDeveloperSupport() {
return BuildConfig.DEBUG;
}
@Override
protected List<ReactPackage> getPackages() {
@SuppressWarnings("UnnecessaryLocalVariable")
List<ReactPackage> packages = new PackageList(this).getPackages();
// Packages that cannot be autolinked yet can be added manually here, for example:
// packages.add(new MyReactNativePackage());
return packages;
}
@Override
protected String getJSMainModuleName() {
return "index";
}
};
@Override
public ReactNativeHost getReactNativeHost() {
return mReactNativeHost;
}
@Override
public void onCreate() {
super.onCreate();
SoLoader.init(this, /* native exopackage */ false);
initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
}
/**
* Loads Flipper in React Native templates. Call this in the onCreate method with something like
* initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
*
* @param context
* @param reactInstanceManager
*/
private static void initializeFlipper(
Context context, ReactInstanceManager reactInstanceManager) {
if (BuildConfig.DEBUG) {
try {
/*
We use reflection here to pick up the class that initializes Flipper,
since Flipper library is not available in release mode
*/
Class<?> aClass = Class.forName("com.rnbareexample.ReactNativeFlipper");
aClass
.getMethod("initializeFlipper", Context.class, ReactInstanceManager.class)
.invoke(null, context, reactInstanceManager);
} catch (ClassNotFoundException e) {
e.printStackTrace();
} catch (NoSuchMethodException e) {
e.printStackTrace();
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (InvocationTargetException e) {
e.printStackTrace();
}
}
}
}
================================================
FILE: RNBareExample/android/app/src/main/res/values/strings.xml
================================================
<resources>
<string name="app_name">RNBareExample</string>
</resources>
================================================
FILE: RNBareExample/android/app/src/main/res/values/styles.xml
================================================
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
<!-- Customize your theme here. -->
<item name="android:textColor">#000000</item>
</style>
</resources>
================================================
FILE: RNBareExample/android/build.gradle
================================================
// Top-level build file where you can add configuration options common to all sub-projects/modules.
buildscript {
ext {
buildToolsVersion = "29.0.3"
minSdkVersion = 21
compileSdkVersion = 29
targetSdkVersion = 29
ndkVersion = "20.1.5948944"
}
repositories {
google()
jcenter()
}
dependencies {
classpath("com.android.tools.build:gradle:4.1.0")
// NOTE: Do not place your application dependencies here; they belong
// in the individual module build.gradle files
}
}
allprojects {
repositories {
mavenLocal()
maven {
// All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
url("$rootDir/../node_modules/react-native/android")
}
maven {
// Android JSC is installed from npm
url("$rootDir/../node_modules/jsc-android/dist")
}
google()
jcenter()
maven { url 'https://www.jitpack.io' }
}
}
================================================
FILE: RNBareExample/android/gradle/wrapper/gradle-wrapper.properties
================================================
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-6.7-all.zip
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
================================================
FILE: RNBareExample/android/gradle.properties
================================================
# Project-wide Gradle settings.
# IDE (e.g. Android Studio) users:
# Gradle settings configured through the IDE *will override*
# any settings specified in this file.
# For more details on how to configure your build environment visit
# http://www.gradle.org/docs/current/userguide/build_environment.html
# Specifies the JVM arguments used for the daemon process.
# The setting is particularly useful for tweaking memory settings.
# Default value: -Xmx10248m -XX:MaxPermSize=256m
# org.gradle.jvmargs=-Xmx2048m -XX:MaxPermSize=512m -XX:+HeapDumpOnOutOfMemoryError -Dfile.encoding=UTF-8
# When configured, Gradle will run in incubating parallel mode.
# This option should only be used with decoupled projects. More details, visit
# http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
# org.gradle.parallel=true
# AndroidX package structure to make it clearer which packages are bundled with the
# Android operating system, and which are packaged with your app's APK
# https://developer.android.com/topic/libraries/support-library/androidx-rn
android.useAndroidX=true
# Automatically convert third-party libraries to use AndroidX
android.enableJetifier=true
# Version of flipper SDK to use with React Native
FLIPPER_VERSION=0.75.1
================================================
FILE: RNBareExample/android/gradlew
================================================
#!/usr/bin/env sh
#
# Copyright 2015 the original author or authors.
#
# Licensed under the Apache License, Version 2.0 (the "License");
# you may not use this file except in compliance with the License.
# You may obtain a copy of the License at
#
# https://www.apache.org/licenses/LICENSE-2.0
#
# Unless required by applicable law or agreed to in writing, software
# distributed under the License is distributed on an "AS IS" BASIS,
# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
# See the License for the specific language governing permissions and
# limitations under the License.
#
##############################################################################
##
## Gradle start up script for UN*X
##
##############################################################################
# Attempt to set APP_HOME
# Resolve links: $0 may be a link
PRG="$0"
# Need this for relative symlinks.
while [ -h "$PRG" ] ; do
ls=`ls -ld "$PRG"`
link=`expr "$ls" : '.*-> \(.*\)$'`
if expr "$link" : '/.*' > /dev/null; then
PRG="$link"
else
PRG=`dirname "$PRG"`"/$link"
fi
done
SAVED="`pwd`"
cd "`dirname \"$PRG\"`/" >/dev/null
APP_HOME="`pwd -P`"
cd "$SAVED" >/dev/null
APP_NAME="Gradle"
APP_BASE_NAME=`basename "$0"`
# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
# Use the maximum available, or set MAX_FD != -1 to use that value.
MAX_FD="maximum"
warn () {
echo "$*"
}
die () {
echo
echo "$*"
echo
exit 1
}
# OS specific support (must be 'true' or 'false').
cygwin=false
msys=false
darwin=false
nonstop=false
case "`uname`" in
CYGWIN* )
cygwin=true
;;
Darwin* )
darwin=true
;;
MINGW* )
msys=true
;;
NONSTOP* )
nonstop=true
;;
esac
CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
# Determine the Java command to use to start the JVM.
if [ -n "$JAVA_HOME" ] ; then
if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
# IBM's JDK on AIX uses strange locations for the executables
JAVACMD="$JAVA_HOME/jre/sh/java"
else
JAVACMD="$JAVA_HOME/bin/java"
fi
if [ ! -x "$JAVACMD" ] ; then
die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
Please set the JAVA_HOME variable in your environment to match the
location of your Java installation."
fi
else
JAVACMD="java"
which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
Please set the JAVA_HOME variable in your environment to match the
location of your Java installation."
fi
# Increase the maximum file descriptors if we can.
if [ "$cygwin" = "false" -a "$darwin" = "false" -a "$nonstop" = "false" ] ; then
MAX_FD_LIMIT=`ulimit -H -n`
if [ $? -eq 0 ] ; then
if [ "$MAX_FD" = "maximum" -o "$MAX_FD" = "max" ] ; then
MAX_FD="$MAX_FD_LIMIT"
fi
ulimit -n $MAX_FD
if [ $? -ne 0 ] ; then
warn "Could not set maximum file descriptor limit: $MAX_FD"
fi
else
warn "Could not query maximum file descriptor limit: $MAX_FD_LIMIT"
fi
fi
# For Darwin, add options to specify how the application appears in the dock
if $darwin; then
GRADLE_OPTS="$GRADLE_OPTS \"-Xdock:name=$APP_NAME\" \"-Xdock:icon=$APP_HOME/media/gradle.icns\""
fi
# For Cygwin or MSYS, switch paths to Windows format before running java
if [ "$cygwin" = "true" -o "$msys" = "true" ] ; then
APP_HOME=`cygpath --path --mixed "$APP_HOME"`
CLASSPATH=`cygpath --path --mixed "$CLASSPATH"`
JAVACMD=`cygpath --unix "$JAVACMD"`
# We build the pattern for arguments to be converted via cygpath
ROOTDIRSRAW=`find -L / -maxdepth 1 -mindepth 1 -type d 2>/dev/null`
SEP=""
for dir in $ROOTDIRSRAW ; do
ROOTDIRS="$ROOTDIRS$SEP$dir"
SEP="|"
done
OURCYGPATTERN="(^($ROOTDIRS))"
# Add a user-defined pattern to the cygpath arguments
if [ "$GRADLE_CYGPATTERN" != "" ] ; then
OURCYGPATTERN="$OURCYGPATTERN|($GRADLE_CYGPATTERN)"
fi
# Now convert the arguments - kludge to limit ourselves to /bin/sh
i=0
for arg in "$@" ; do
CHECK=`echo "$arg"|egrep -c "$OURCYGPATTERN" -`
CHECK2=`echo "$arg"|egrep -c "^-"` ### Determine if an option
if [ $CHECK -ne 0 ] && [ $CHECK2 -eq 0 ] ; then ### Added a condition
eval `echo args$i`=`cygpath --path --ignore --mixed "$arg"`
else
eval `echo args$i`="\"$arg\""
fi
i=`expr $i + 1`
done
case $i in
0) set -- ;;
1) set -- "$args0" ;;
2) set -- "$args0" "$args1" ;;
3) set -- "$args0" "$args1" "$args2" ;;
4) set -- "$args0" "$args1" "$args2" "$args3" ;;
5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;;
6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;;
7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;;
8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;;
9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;;
esac
fi
# Escape application args
save () {
for i do printf %s\\n "$i" | sed "s/'/'\\\\''/g;1s/^/'/;\$s/\$/' \\\\/" ; done
echo " "
}
APP_ARGS=`save "$@"`
# Collect all arguments for the java command, following the shell quoting and substitution rules
eval set -- $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS "\"-Dorg.gradle.appname=$APP_BASE_NAME\"" -classpath "\"$CLASSPATH\"" org.gradle.wrapper.GradleWrapperMain "$APP_ARGS"
exec "$JAVACMD" "$@"
================================================
FILE: RNBareExample/android/gradlew.bat
================================================
@rem
@rem Copyright 2015 the original author or authors.
@rem
@rem Licensed under the Apache License, Version 2.0 (the "License");
@rem you may not use this file except in compliance with the License.
@rem You may obtain a copy of the License at
@rem
@rem https://www.apache.org/licenses/LICENSE-2.0
@rem
@rem Unless required by applicable law or agreed to in writing, software
@rem distributed under the License is distributed on an "AS IS" BASIS,
@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
@rem See the License for the specific language governing permissions and
@rem limitations under the License.
@rem
@if "%DEBUG%" == "" @echo off
@rem ##########################################################################
@rem
@rem Gradle startup script for Windows
@rem
@rem ##########################################################################
@rem Set local scope for the variables with windows NT shell
if "%OS%"=="Windows_NT" setlocal
set DIRNAME=%~dp0
if "%DIRNAME%" == "" set DIRNAME=.
set APP_BASE_NAME=%~n0
set APP_HOME=%DIRNAME%
@rem Resolve any "." and ".." in APP_HOME to make it shorter.
for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
@rem Find java.exe
if defined JAVA_HOME goto findJavaFromJavaHome
set JAVA_EXE=java.exe
%JAVA_EXE% -version >NUL 2>&1
if "%ERRORLEVEL%" == "0" goto execute
echo.
echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
echo.
echo Please set the JAVA_HOME variable in your environment to match the
echo location of your Java installation.
goto fail
:findJavaFromJavaHome
set JAVA_HOME=%JAVA_HOME:"=%
set JAVA_EXE=%JAVA_HOME%/bin/java.exe
if exist "%JAVA_EXE%" goto execute
echo.
echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
echo.
echo Please set the JAVA_HOME variable in your environment to match the
echo location of your Java installation.
goto fail
:execute
@rem Setup the command line
set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
@rem Execute Gradle
"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %*
:end
@rem End local scope for the variables with windows NT shell
if "%ERRORLEVEL%"=="0" goto mainEnd
:fail
rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
rem the _cmd.exe /c_ return code!
if not "" == "%GRADLE_EXIT_CONSOLE%" exit 1
exit /b 1
:mainEnd
if "%OS%"=="Windows_NT" endlocal
:omega
================================================
FILE: RNBareExample/android/settings.gradle
================================================
rootProject.name = 'RNBareExample'
include ':react-native-linear-gradient'
project(':react-native-linear-gradient').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-linear-gradient/android')
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
include ':app'
================================================
FILE: RNBareExample/app.json
================================================
{
"name": "RNBareExample",
"displayName": "RNBareExample"
}
================================================
FILE: RNBareExample/babel.config.js
================================================
const path = require('path');
const pak = require('../package.json');
module.exports = function (api) {
api.cache(true);
return {
presets: ['module:metro-react-native-babel-preset'],
plugins: [
[
'module-resolver',
{
alias: {
// For development, we want to alias the library to the source
[pak.name]: path.join(__dirname, '..', pak.source),
},
},
],
],
};
};
================================================
FILE: RNBareExample/index.js
================================================
/**
* @format
*/
import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';
AppRegistry.registerComponent(appName, () => App);
================================================
FILE: RNBareExample/ios/Podfile
================================================
require_relative '../node_modules/react-native/scripts/react_native_pods'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
platform :ios, '10.0'
target 'RNBareExample' do
config = use_native_modules!
use_react_native!(
:path => config[:reactNativePath],
# to enable hermes on iOS, change `false` to `true` and then install pods
:hermes_enabled => false
)
pod 'BVLinearGradient', :path => '../node_modules/react-native-linear-gradient'
target 'RNBareExampleTests' do
inherit! :complete
# Pods for testing
end
# Enables Flipper.
#
# Note that if you have use_frameworks! enabled, Flipper will not work and
# you should disable the next line.
use_flipper!()
post_install do |installer|
react_native_post_install(installer)
end
end
================================================
FILE: RNBareExample/ios/RNBareExample/AppDelegate.h
================================================
#import <React/RCTBridgeDelegate.h>
#import <UIKit/UIKit.h>
@interface AppDelegate : UIResponder <UIApplicationDelegate, RCTBridgeDelegate>
@property (nonatomic, strong) UIWindow *window;
@end
================================================
FILE: RNBareExample/ios/RNBareExample/AppDelegate.m
================================================
#import "AppDelegate.h"
#import <React/RCTBridge.h>
#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>
#ifdef FB_SONARKIT_ENABLED
#import <FlipperKit/FlipperClient.h>
#import <FlipperKitLayoutPlugin/FlipperKitLayoutPlugin.h>
#import <FlipperKitUserDefaultsPlugin/FKUserDefaultsPlugin.h>
#import <FlipperKitNetworkPlugin/FlipperKitNetworkPlugin.h>
#import <SKIOSNetworkPlugin/SKIOSNetworkAdapter.h>
#import <FlipperKitReactPlugin/FlipperKitReactPlugin.h>
static void InitializeFlipper(UIApplication *application) {
FlipperClient *client = [FlipperClient sharedClient];
SKDescriptorMapper *layoutDescriptorMapper = [[SKDescriptorMapper alloc] initWithDefaults];
[client addPlugin:[[FlipperKitLayoutPlugin alloc] initWithRootNode:application withDescriptorMapper:layoutDescriptorMapper]];
[client addPlugin:[[FKUserDefaultsPlugin alloc] initWithSuiteName:nil]];
[client addPlugin:[FlipperKitReactPlugin new]];
[client addPlugin:[[FlipperKitNetworkPlugin alloc] initWithNetworkAdapter:[SKIOSNetworkAdapter new]]];
[client start];
}
#endif
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
#ifdef FB_SONARKIT_ENABLED
InitializeFlipper(application);
#endif
RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge
moduleName:@"RNBareExample"
initialProperties:nil];
if (@available(iOS 13.0, *)) {
rootView.backgroundColor = [UIColor systemBackgroundColor];
} else {
rootView.backgroundColor = [UIColor whiteColor];
}
self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
UIViewController *rootViewController = [UIViewController new];
rootViewController.view = rootView;
self.window.rootViewController = rootViewController;
[self.window makeKeyAndVisible];
return YES;
}
- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
{
#if DEBUG
return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
#else
return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif
}
@end
================================================
FILE: RNBareExample/ios/RNBareExample/Images.xcassets/AppIcon.appiconset/Contents.json
================================================
{
"images" : [
{
"idiom" : "iphone",
"size" : "29x29",
"scale" : "2x"
},
{
"idiom" : "iphone",
"size" : "29x29",
"scale" : "3x"
},
{
"idiom" : "iphone",
"size" : "40x40",
"scale" : "2x"
},
{
"idiom" : "iphone",
"size" : "40x40",
"scale" : "3x"
},
{
"idiom" : "iphone",
"size" : "60x60",
"scale" : "2x"
},
{
"idiom" : "iphone",
"size" : "60x60",
"scale" : "3x"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
================================================
FILE: RNBareExample/ios/RNBareExample/Images.xcassets/Contents.json
================================================
{
"info" : {
"version" : 1,
"author" : "xcode"
}
}
================================================
FILE: RNBareExample/ios/RNBareExample/Info.plist
================================================
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>CFBundleDevelopmentRegion</key>
<string>en</string>
<key>CFBundleDisplayName</key>
<string>RNBareExample</string>
<key>CFBundleExecutable</key>
<string>$(EXECUTABLE_NAME)</string>
<key>CFBundleIdentifier</key>
<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
<key>CFBundleInfoDictionaryVersion</key>
<string>6.0</string>
<key>CFBundleName</key>
<string>$(PRODUCT_NAME)</string>
<key>CFBundlePackageType</key>
<string>APPL</string>
<key>CFBundleShortVersionString</key>
<string>1.0</string>
<key>CFBundleSignature</key>
<string>????</string>
<key>CFBundleVersion</key>
<string>1</string>
<key>LSRequiresIPhoneOS</key>
<true/>
<key>NSAppTransportSecurity</key>
<dict>
<key>NSExceptionDomains</key>
<dict>
<key>localhost</key>
<dict>
<key>NSExceptionAllowsInsecureHTTPLoads</key>
<true/>
</dict>
</dict>
</dict>
<key>NSLocationWhenInUseUsageDescription</key>
<string/>
<key>UILaunchStoryboardName</key>
<string>LaunchScreen</string>
<key>UIRequiredDeviceCapabilities</key>
<array>
<string>armv7</string>
</array>
<key>UISupportedInterfaceOrientations</key>
<array>
<string>UIInterfaceOrientationPortrait</string>
<string>UIInterfaceOrientationLandscapeLeft</string>
<string>UIInterfaceOrientationLandscapeRight</string>
</array>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>
<key>UIAppFonts</key>
<array>
<string>Roboto-Bold.ttf</string>
<string>Roboto-Italic.ttf</string>
<string>Roboto-Light.ttf</string>
<string>Roboto-Medium.ttf</string>
<string>Roboto-Regular.ttf</string>
<string>Merriweather-Regular.ttf</string>
</array>
</dict>
</plist>
================================================
FILE: RNBareExample/ios/RNBareExample/LaunchScreen.storyboard
================================================
<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="15702" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="01J-lp-oVM">
<device id="retina4_7" orientation="portrait" appearance="light"/>
<dependencies>
<deployment identifier="iOS"/>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="15704"/>
<capability name="Safe area layout guides" minToolsVersion="9.0"/>
<capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
</dependencies>
<scenes>
<!--View Controller-->
<scene sceneID="EHf-IW-A2E">
<objects>
<viewController id="01J-lp-oVM" sceneMemberID="viewController">
<view key="view" contentMode="scaleToFill" id="Ze5-6b-2t3">
<rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
<subviews>
<label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="RNBareExample" textAlignment="center" lineBreakMode="middleTruncation" baselineAdjustment="alignBaselines" minimumFontSize="18" translatesAutoresizingMaskIntoConstraints="NO" id="GJd-Yh-RWb">
<rect key="frame" x="0.0" y="202" width="375" height="43"/>
<fontDescription key="fontDescription" type="boldSystem" pointSize="36"/>
<nil key="highlightedColor"/>
</label>
<label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Powered by React Native" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" minimumFontSize="9" translatesAutoresizingMaskIntoConstraints="NO" id="MN2-I3-ftu">
<rect key="frame" x="0.0" y="626" width="375" height="21"/>
<fontDescription key="fontDescription" type="system" pointSize="17"/>
<nil key="highlightedColor"/>
</label>
</subviews>
<color key="backgroundColor" systemColor="systemBackgroundColor" cocoaTouchSystemColor="whiteColor"/>
<constraints>
<constraint firstItem="Bcu-3y-fUS" firstAttribute="bottom" secondItem="MN2-I3-ftu" secondAttribute="bottom" constant="20" id="OZV-Vh-mqD"/>
<constraint firstItem="Bcu-3y-fUS" firstAttribute="centerX" secondItem="GJd-Yh-RWb" secondAttribute="centerX" id="Q3B-4B-g5h"/>
<constraint firstItem="MN2-I3-ftu" firstAttribute="centerX" secondItem="Bcu-3y-fUS" secondAttribute="centerX" id="akx-eg-2ui"/>
<constraint firstItem="MN2-I3-ftu" firstAttribute="leading" secondItem="Bcu-3y-fUS" secondAttribute="leading" id="i1E-0Y-4RG"/>
<constraint firstItem="GJd-Yh-RWb" firstAttribute="centerY" secondItem="Ze5-6b-2t3" secondAttribute="bottom" multiplier="1/3" constant="1" id="moa-c2-u7t"/>
<constraint firstItem="GJd-Yh-RWb" firstAttribute="leading" secondItem="Bcu-3y-fUS" secondAttribute="leading" symbolic="YES" id="x7j-FC-K8j"/>
</constraints>
<viewLayoutGuide key="safeArea" id="Bcu-3y-fUS"/>
</view>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="iYj-Kq-Ea1" userLabel="First Responder" sceneMemberID="firstResponder"/>
</objects>
<point key="canvasLocation" x="52.173913043478265" y="375"/>
</scene>
</scenes>
</document>
================================================
FILE: RNBareExample/ios/RNBareExample/main.m
================================================
#import <UIKit/UIKit.h>
#import "AppDelegate.h"
int main(int argc, char * argv[]) {
@autoreleasepool {
return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
}
}
================================================
FILE: RNBareExample/ios/RNBareExample.xcodeproj/project.pbxproj
================================================
// !$*UTF8*$!
{
archiveVersion = 1;
classes = {
};
objectVersion = 54;
objects = {
/* Begin PBXBuildFile section */
00E356F31AD99517003FC87E /* RNBareExampleTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* RNBareExampleTests.m */; };
13B07FBC1A68108700A75B9A /* AppDelegate.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.m */; };
13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
38BE891D962D4F349AF2917E /* Roboto-Regular.ttf in Resources */ = {isa = PBXBuildFile; fileRef = D54F1726BC514FD686C64532 /* Roboto-Regular.ttf */; };
4664335C02E54CEEA39B7112 /* Merriweather-Regular.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 4509DF3E719D42139C6957FB /* Merriweather-Regular.ttf */; };
4A2BEF80E0F0453CB2500790 /* Roboto-Medium.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 3E1CF7D40B1D414988D3CC15 /* Roboto-Medium.ttf */; };
81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; };
8EC97A0012A44B37A239430B /* Roboto-Bold.ttf in Resources */ = {isa = PBXBuildFile; fileRef = EE3CE23D43B345559A3E9B05 /* Roboto-Bold.ttf */; };
A407EFB79BE54725A37F6732 /* Roboto-Italic.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 3DF03166C76248F88B6F59F2 /* Roboto-Italic.ttf */; };
CC958B3576C25F72C64CD117 /* libPods-RNBareExample.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 11C0BDDBE1B1045431ABC4E5 /* libPods-RNBareExample.a */; };
DE9675BE0B1F7B1E29B249D0 /* libPods-RNBareExample-RNBareExampleTests.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 41168D7081D471981F679225 /* libPods-RNBareExample-RNBareExampleTests.a */; };
F8E98893793F4862BBC06E24 /* Roboto-Light.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 7BA646F9875F4FCEBAB2D80B /* Roboto-Light.ttf */; };
/* End PBXBuildFile section */
/* Begin PBXContainerItemProxy section */
00E356F41AD99517003FC87E /* PBXContainerItemProxy */ = {
isa = PBXContainerItemProxy;
containerPortal = 83CBB9F71A601CBA00E9B192 /* Project object */;
proxyType = 1;
remoteGlobalIDString = 13B07F861A680F5B00A75B9A;
remoteInfo = RNBareExample;
};
/* End PBXContainerItemProxy section */
/* Begin PBXFileReference section */
00E356EE1AD99517003FC87E /* RNBareExampleTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = RNBareExampleTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
00E356F11AD99517003FC87E /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
00E356F21AD99517003FC87E /* RNBareExampleTests.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNBareExampleTests.m; sourceTree = "<group>"; };
11C0BDDBE1B1045431ABC4E5 /* libPods-RNBareExample.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-RNBareExample.a"; sourceTree = BUILT_PRODUCTS_DIR; };
13B07F961A680F5B00A75B9A /* RNBareExample.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = RNBareExample.app; sourceTree = BUILT_PRODUCTS_DIR; };
13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = RNBareExample/AppDelegate.h; sourceTree = "<group>"; };
13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = AppDelegate.m; path = RNBareExample/AppDelegate.m; sourceTree = "<group>"; };
13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = RNBareExample/Images.xcassets; sourceTree = "<group>"; };
13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = RNBareExample/Info.plist; sourceTree = "<group>"; };
13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = RNBareExample/main.m; sourceTree = "<group>"; };
3DF03166C76248F88B6F59F2 /* Roboto-Italic.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Roboto-Italic.ttf"; path = "../assets/fonts/Roboto-Italic.ttf"; sourceTree = "<group>"; };
3E1CF7D40B1D414988D3CC15 /* Roboto-Medium.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Roboto-Medium.ttf"; path = "../assets/fonts/Roboto-Medium.ttf"; sourceTree = "<group>"; };
41168D7081D471981F679225 /* libPods-RNBareExample-RNBareExampleTests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-RNBareExample-RNBareExampleTests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
4509DF3E719D42139C6957FB /* Merriweather-Regular.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Merriweather-Regular.ttf"; path = "../assets/fonts/Merriweather-Regular.ttf"; sourceTree = "<group>"; };
48A3F3B34B71A627C36D23AE /* Pods-RNBareExample-RNBareExampleTests.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-RNBareExample-RNBareExampleTests.debug.xcconfig"; path = "Target Support Files/Pods-RNBareExample-RNBareExampleTests/Pods-RNBareExample-RNBareExampleTests.debug.xcconfig"; sourceTree = "<group>"; };
6C3E26B903A9FBC8FEAD0366 /* Pods-RNBareExample.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-RNBareExample.release.xcconfig"; path = "Target Support Files/Pods-RNBareExample/Pods-RNBareExample.release.xcconfig"; sourceTree = "<group>"; };
7BA646F9875F4FCEBAB2D80B /* Roboto-Light.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Roboto-Light.ttf"; path = "../assets/fonts/Roboto-Light.ttf"; sourceTree = "<group>"; };
81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.storyboard; name = LaunchScreen.storyboard; path = RNBareExample/LaunchScreen.storyboard; sourceTree = "<group>"; };
BE9748D91138D25975CC7644 /* Pods-RNBareExample-RNBareExampleTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-RNBareExample-RNBareExampleTests.release.xcconfig"; path = "Target Support Files/Pods-RNBareExample-RNBareExampleTests/Pods-RNBareExample-RNBareExampleTests.release.xcconfig"; sourceTree = "<group>"; };
D54F1726BC514FD686C64532 /* Roboto-Regular.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Roboto-Regular.ttf"; path = "../assets/fonts/Roboto-Regular.ttf"; sourceTree = "<group>"; };
DC9506A1E7FC0D9474DB233B /* Pods-RNBareExample.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-RNBareExample.debug.xcconfig"; path = "Target Support Files/Pods-RNBareExample/Pods-RNBareExample.debug.xcconfig"; sourceTree = "<group>"; };
ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };
EE3CE23D43B345559A3E9B05 /* Roboto-Bold.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Roboto-Bold.ttf"; path = "../assets/fonts/Roboto-Bold.ttf"; sourceTree = "<group>"; };
/* End PBXFileReference section */
/* Begin PBXFrameworksBuildPhase section */
00E356EB1AD99517003FC87E /* Frameworks */ = {
isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647;
files = (
DE9675BE0B1F7B1E29B249D0 /* libPods-RNBareExample-RNBareExampleTests.a in Frameworks */,
);
runOnlyForDeploymentPostprocessing = 0;
};
13B07F8C1A680F5B00A75B9A /* Frameworks */ = {
isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647;
files = (
CC958B3576C25F72C64CD117 /* libPods-RNBareExample.a in Frameworks */,
);
runOnlyForDeploymentPostprocessing = 0;
};
/* End PBXFrameworksBuildPhase section */
/* Begin PBXGroup section */
00E356EF1AD99517003FC87E /* RNBareExampleTests */ = {
isa = PBXGroup;
children = (
00E356F21AD99517003FC87E /* RNBareExampleTests.m */,
00E356F01AD99517003FC87E /* Supporting Files */,
);
path = RNBareExampleTests;
sourceTree = "<group>";
};
00E356F01AD99517003FC87E /* Supporting Files */ = {
isa = PBXGroup;
children = (
00E356F11AD99517003FC87E /* Info.plist */,
);
name = "Supporting Files";
sourceTree = "<group>";
};
13B07FAE1A68108700A75B9A /* RNBareExample */ = {
isa = PBXGroup;
children = (
13B07FAF1A68108700A75B9A /* AppDelegate.h */,
13B07FB01A68108700A75B9A /* AppDelegate.m */,
13B07FB51A68108700A75B9A /* Images.xcassets */,
13B07FB61A68108700A75B9A /* Info.plist */,
81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */,
13B07FB71A68108700A75B9A /* main.m */,
);
name = RNBareExample;
sourceTree = "<group>";
};
159055EDF32C537E1DD2EA56 /* Pods */ = {
isa = PBXGroup;
children = (
DC9506A1E7FC0D9474DB233B /* Pods-RNBareExample.debug.xcconfig */,
6C3E26B903A9FBC8FEAD0366 /* Pods-RNBareExample.release.xcconfig */,
48A3F3B34B71A627C36D23AE /* Pods-RNBareExample-RNBareExampleTests.debug.xcconfig */,
BE9748D91138D25975CC7644 /* Pods-RNBareExample-RNBareExampleTests.release.xcconfig */,
);
name = Pods;
path = Pods;
sourceTree = "<group>";
};
2D16E6871FA4F8E400B85C8A /* Frameworks */ = {
isa = PBXGroup;
children = (
ED297162215061F000B7C4FE /* JavaScriptCore.framework */,
11C0BDDBE1B1045431ABC4E5 /* libPods-RNBareExample.a */,
41168D7081D471981F679225 /* libPods-RNBareExample-RNBareExampleTests.a */,
);
name = Frameworks;
sourceTree = "<group>";
};
42CCD72C7CF4497793037815 /* Resources */ = {
isa = PBXGroup;
children = (
EE3CE23D43B345559A3E9B05 /* Roboto-Bold.ttf */,
3DF03166C76248F88B6F59F2 /* Roboto-Italic.ttf */,
7BA646F9875F4FCEBAB2D80B /* Roboto-Light.ttf */,
3E1CF7D40B1D414988D3CC15 /* Roboto-Medium.ttf */,
D54F1726BC514FD686C64532 /* Roboto-Regular.ttf */,
4509DF3E719D42139C6957FB /* Merriweather-Regular.ttf */,
);
name = Resources;
path = "";
sourceTree = "<group>";
};
832341AE1AAA6A7D00B99B32 /* Libraries */ = {
isa = PBXGroup;
children = (
);
name = Libraries;
sourceTree = "<group>";
};
83CBB9F61A601CBA00E9B192 = {
isa = PBXGroup;
children = (
13B07FAE1A68108700A75B9A /* RNBareExample */,
832341AE1AAA6A7D00B99B32 /* Libraries */,
00E356EF1AD99517003FC87E /* RNBareExampleTests */,
83CBBA001A601CBA00E9B192 /* Products */,
2D16E6871FA4F8E400B85C8A /* Frameworks */,
159055EDF32C537E1DD2EA56 /* Pods */,
42CCD72C7CF4497793037815 /* Resources */,
);
indentWidth = 2;
sourceTree = "<group>";
tabWidth = 2;
usesTabs = 0;
};
83CBBA001A601CBA00E9B192 /* Products */ = {
isa = PBXGroup;
children = (
13B07F961A680F5B00A75B9A /* RNBareExample.app */,
00E356EE1AD99517003FC87E /* RNBareExampleTests.xctest */,
);
name = Products;
sourceTree = "<group>";
};
/* End PBXGroup section */
/* Begin PBXNativeTarget section */
00E356ED1AD99517003FC87E /* RNBareExampleTests */ = {
isa = PBXNativeTarget;
buildConfigurationList = 00E357021AD99517003FC87E /* Build configuration list for PBXNativeTarget "RNBareExampleTests" */;
buildPhases = (
1E250219C895BEA3A3B522F8 /* [CP] Check Pods Manifest.lock */,
00E356EA1AD99517003FC87E /* Sources */,
00E356EB1AD99517003FC87E /* Frameworks */,
00E356EC1AD99517003FC87E /* Resources */,
80A9B916640DA44574A6BFE9 /* [CP] Embed Pods Frameworks */,
4064C66412A1431AEB98707F /* [CP] Copy Pods Resources */,
);
buildRules = (
);
dependencies = (
00E356F51AD99517003FC87E /* PBXTargetDependency */,
);
name = RNBareExampleTests;
productName = RNBareExampleTests;
productReference = 00E356EE1AD99517003FC87E /* RNBareExampleTests.xctest */;
productType = "com.apple.product-type.bundle.unit-test";
};
13B07F861A680F5B00A75B9A /* RNBareExample */ = {
isa = PBXNativeTarget;
buildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "RNBareExample" */;
buildPhases = (
817A1C3BBB37E467A160595B /* [CP] Check Pods Manifest.lock */,
FD10A7F022414F080027D42C /* Start Packager */,
13B07F871A680F5B00A75B9A /* Sources */,
13B07F8C1A680F5B00A75B9A /* Frameworks */,
13B07F8E1A680F5B00A75B9A /* Resources */,
00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,
3461A323C30894E61CCBE9AB /* [CP] Embed Pods Frameworks */,
5025BCA1300C603C2631117B /* [CP] Copy Pods Resources */,
);
buildRules = (
);
dependencies = (
);
name = RNBareExample;
productName = RNBareExample;
productReference = 13B07F961A680F5B00A75B9A /* RNBareExample.app */;
productType = "com.apple.product-type.application";
};
/* End PBXNativeTarget section */
/* Begin PBXProject section */
83CBB9F71A601CBA00E9B192 /* Project object */ = {
isa = PBXProject;
attributes = {
LastUpgradeCheck = 1210;
TargetAttributes = {
00E356ED1AD99517003FC87E = {
CreatedOnToolsVersion = 6.2;
TestTargetID = 13B07F861A680F5B00A75B9A;
};
13B07F861A680F5B00A75B9A = {
LastSwiftMigration = 1120;
};
};
};
buildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "RNBareExample" */;
compatibilityVersion = "Xcode 12.0";
developmentRegion = en;
hasScannedForEncodings = 0;
knownRegions = (
en,
Base,
);
mainGroup = 83CBB9F61A601CBA00E9B192;
productRefGroup = 83CBBA001A601CBA00E9B192 /* Products */;
projectDirPath = "";
projectRoot = "";
targets = (
13B07F861A680F5B00A75B9A /* RNBareExample */,
00E356ED1AD99517003FC87E /* RNBareExampleTests */,
);
};
/* End PBXProject section */
/* Begin PBXResourcesBuildPhase section */
00E356EC1AD99517003FC87E /* Resources */ = {
isa = PBXResourcesBuildPhase;
buildActionMask = 2147483647;
files = (
);
runOnlyForDeploymentPostprocessing = 0;
};
13B07F8E1A680F5B00A75B9A /* Resources */ = {
isa = PBXResourcesBuildPhase;
buildActionMask = 2147483647;
files = (
81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */,
13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,
8EC97A0012A44B37A239430B /* Roboto-Bold.ttf in Resources */,
A407EFB79BE54725A37F6732 /* Roboto-Italic.ttf in Resources */,
F8E98893793F4862BBC06E24 /* Roboto-Light.ttf in Resources */,
4A2BEF80E0F0453CB2500790 /* Roboto-Medium.ttf in Resources */,
38BE891D962D4F349AF2917E /* Roboto-Regular.ttf in Resources */,
4664335C02E54CEEA39B7112 /* Merriweather-Regular.ttf in Resources */,
);
runOnlyForDeploymentPostprocessing = 0;
};
/* End PBXResourcesBuildPhase section */
/* Begin PBXShellScriptBuildPhase section */
00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
);
inputPaths = (
);
name = "Bundle React Native code and images";
outputPaths = (
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "set -e\n\nexport NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh\n";
};
1E250219C895BEA3A3B522F8 /* [CP] Check Pods Manifest.lock */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
);
inputFileListPaths = (
);
inputPaths = (
"${PODS_PODFILE_DIR_PATH}/Podfile.lock",
"${PODS_ROOT}/Manifest.lock",
);
name = "[CP] Check Pods Manifest.lock";
outputFileListPaths = (
);
outputPaths = (
"$(DERIVED_FILE_DIR)/Pods-RNBareExample-RNBareExampleTests-checkManifestLockResult.txt",
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n # print error to STDERR\n echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
showEnvVarsInLog = 0;
};
3461A323C30894E61CCBE9AB /* [CP] Embed Pods Frameworks */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
);
inputFileListPaths = (
"${PODS_ROOT}/Target Support Files/Pods-RNBareExample/Pods-RNBareExample-frameworks-${CONFIGURATION}-input-files.xcfilelist",
);
name = "[CP] Embed Pods Frameworks";
outputFileListPaths = (
"${PODS_ROOT}/Target Support Files/Pods-RNBareExample/Pods-RNBareExample-frameworks-${CONFIGURATION}-output-files.xcfilelist",
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-RNBareExample/Pods-RNBareExample-frameworks.sh\"\n";
showEnvVarsInLog = 0;
};
4064C66412A1431AEB98707F /* [CP] Copy Pods Resources */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
);
inputFileListPaths = (
"${PODS_ROOT}/Target Support Files/Pods-RNBareExample-RNBareExampleTests/Pods-RNBareExample-RNBareExampleTests-resources-${CONFIGURATION}-input-files.xcfilelist",
);
name = "[CP] Copy Pods Resources";
outputFileListPaths = (
"${PODS_ROOT}/Target Support Files/Pods-RNBareExample-RNBareExampleTests/Pods-RNBareExample-RNBareExampleTests-resources-${CONFIGURATION}-output-files.xcfilelist",
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-RNBareExample-RNBareExampleTests/Pods-RNBareExample-RNBareExampleTests-resources.sh\"\n";
showEnvVarsInLog = 0;
};
5025BCA1300C603C2631117B /* [CP] Copy Pods Resources */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
);
inputFileListPaths = (
"${PODS_ROOT}/Target Support Files/Pods-RNBareExample/Pods-RNBareExample-resources-${CONFIGURATION}-input-files.xcfilelist",
);
name = "[CP] Copy Pods Resources";
outputFileListPaths = (
"${PODS_ROOT}/Target Support Files/Pods-RNBareExample/Pods-RNBareExample-resources-${CONFIGURATION}-output-files.xcfilelist",
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-RNBareExample/Pods-RNBareExample-resources.sh\"\n";
showEnvVarsInLog = 0;
};
80A9B916640DA44574A6BFE9 /* [CP] Embed Pods Frameworks */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
);
inputFileListPaths = (
"${PODS_ROOT}/Target Support Files/Pods-RNBareExample-RNBareExampleTests/Pods-RNBareExample-RNBareExampleTests-frameworks-${CONFIGURATION}-input-files.xcfilelist",
);
name = "[CP] Embed Pods Frameworks";
outputFileListPaths = (
"${PODS_ROOT}/Target Support Files/Pods-RNBareExample-RNBareExampleTests/Pods-RNBareExample-RNBareExampleTests-frameworks-${CONFIGURATION}-output-files.xcfilelist",
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-RNBareExample-RNBareExampleTests/Pods-RNBareExample-RNBareExampleTests-frameworks.sh\"\n";
showEnvVarsInLog = 0;
};
817A1C3BBB37E467A160595B /* [CP] Check Pods Manifest.lock */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
);
inputFileListPaths = (
);
inputPaths = (
"${PODS_PODFILE_DIR_PATH}/Podfile.lock",
"${PODS_ROOT}/Manifest.lock",
);
name = "[CP] Check Pods Manifest.lock";
outputFileListPaths = (
);
outputPaths = (
"$(DERIVED_FILE_DIR)/Pods-RNBareExample-checkManifestLockResult.txt",
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n # print error to STDERR\n echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
showEnvVarsInLog = 0;
};
FD10A7F022414F080027D42C /* Start Packager */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
);
inputFileListPaths = (
);
inputPaths = (
);
name = "Start Packager";
outputFileListPaths = (
);
outputPaths = (
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "export RCT_METRO_PORT=\"${RCT_METRO_PORT:=8081}\"\necho \"export RCT_METRO_PORT=${RCT_METRO_PORT}\" > \"${SRCROOT}/../node_modules/react-native/scripts/.packager.env\"\nif [ -z \"${RCT_NO_LAUNCH_PACKAGER+xxx}\" ] ; then\n if nc -w 5 -z localhost ${RCT_METRO_PORT} ; then\n if ! curl -s \"http://localhost:${RCT_METRO_PORT}/status\" | grep -q \"packager-status:running\" ; then\n echo \"Port ${RCT_METRO_PORT} already in use, packager is either not running or not running correctly\"\n exit 2\n fi\n else\n open \"$SRCROOT/../node_modules/react-native/scripts/launchPackager.command\" || echo \"Can't start packager automatically\"\n fi\nfi\n";
showEnvVarsInLog = 0;
};
/* End PBXShellScriptBuildPhase section */
/* Begin PBXSourcesBuildPhase section */
00E356EA1AD99517003FC87E /* Sources */ = {
isa = PBXSourcesBuildPhase;
buildActionMask = 2147483647;
files = (
00E356F31AD99517003FC87E /* RNBareExampleTests.m in Sources */,
);
runOnlyForDeploymentPostprocessing = 0;
};
13B07F871A680F5B00A75B9A /* Sources */ = {
isa = PBXSourcesBuildPhase;
buildActionMask = 2147483647;
files = (
13B07FBC1A68108700A75B9A /* AppDelegate.m in Sources */,
13B07FC11A68108700A75B9A /* main.m in Sources */,
);
runOnlyForDeploymentPostprocessing = 0;
};
/* End PBXSourcesBuildPhase section */
/* Begin PBXTargetDependency section */
00E356F51AD99517003FC87E /* PBXTargetDependency */ = {
isa = PBXTargetDependency;
target = 13B07F861A680F5B00A75B9A /* RNBareExample */;
targetProxy = 00E356F41AD99517003FC87E /* PBXContainerItemProxy */;
};
/* End PBXTargetDependency section */
/* Begin XCBuildConfiguration section */
00E356F61AD99517003FC87E /* Debug */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = 48A3F3B34B71A627C36D23AE /* Pods-RNBareExample-RNBareExampleTests.debug.xcconfig */;
buildSettings = {
BUNDLE_LOADER = "$(TEST_HOST)";
GCC_PREPROCESSOR_DEFINITIONS = (
"DEBUG=1",
"$(inherited)",
);
INFOPLIST_FILE = RNBareExampleTests/Info.plist;
IPHONEOS_DEPLOYMENT_TARGET = 10.0;
LD_RUNPATH_SEARCH_PATHS = (
"$(inherited)",
"@executable_path/Frameworks",
"@loader_path/Frameworks",
);
OTHER_LDFLAGS = (
"-ObjC",
"-lc++",
"$(inherited)",
);
PRODUCT_BUNDLE_IDENTIFIER = "org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)";
PRODUCT_NAME = "$(TARGET_NAME)";
TEST_HOST = "$(BUILT_PRODUCTS_DIR)/RNBareExample.app/RNBareExample";
};
name = Debug;
};
00E356F71AD99517003FC87E /* Release */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = BE9748D91138D25975CC7644 /* Pods-RNBareExample-RNBareExampleTests.release.xcconfig */;
buildSettings = {
BUNDLE_LOADER = "$(TEST_HOST)";
COPY_PHASE_STRIP = NO;
INFOPLIST_FILE = RNBareExampleTests/Info.plist;
IPHONEOS_DEPLOYMENT_TARGET = 10.0;
LD_RUNPATH_SEARCH_PATHS = (
"$(inherited)",
"@executable_path/Frameworks",
"@loader_path/Frameworks",
);
OTHER_LDFLAGS = (
"-ObjC",
"-lc++",
"$(inherited)",
);
PRODUCT_BUNDLE_IDENTIFIER = "org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)";
PRODUCT_NAME = "$(TARGET_NAME)";
TEST_HOST = "$(BUILT_PRODUCTS_DIR)/RNBareExample.app/RNBareExample";
};
name = Release;
};
13B07F941A680F5B00A75B9A /* Debug */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = DC9506A1E7FC0D9474DB233B /* Pods-RNBareExample.debug.xcconfig */;
buildSettings = {
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
CLANG_ENABLE_MODULES = YES;
CURRENT_PROJECT_VERSION = 1;
ENABLE_BITCODE = NO;
INFOPLIST_FILE = RNBareExample/Info.plist;
LD_RUNPATH_SEARCH_PATHS = (
"$(inherited)",
"@executable_path/Frameworks",
);
OTHER_LDFLAGS = (
"$(inherited)",
"-ObjC",
"-lc++",
);
PRODUCT_BUNDLE_IDENTIFIER = "org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)";
PRODUCT_NAME = RNBareExample;
SWIFT_OPTIMIZATION_LEVEL = "-Onone";
SWIFT_VERSION = 5.0;
VERSIONING_SYSTEM = "apple-generic";
};
name = Debug;
};
13B07F951A680F5B00A75B9A /* Release */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = 6C3E26B903A9FBC8FEAD0366 /* Pods-RNBareExample.release.xcconfig */;
buildSettings = {
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
CLANG_ENABLE_MODULES = YES;
CURRENT_PROJECT_VERSION = 1;
INFOPLIST_FILE = RNBareExample/Info.plist;
LD_RUNPATH_SEARCH_PATHS = (
"$(inherited)",
"@executable_path/Frameworks",
);
OTHER_LDFLAGS = (
"$(inherited)",
"-ObjC",
"-lc++",
);
PRODUCT_BUNDLE_IDENTIFIER = "org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)";
PRODUCT_NAME = RNBareExample;
SWIFT_VERSION = 5.0;
VERSIONING_SYSTEM = "apple-generic";
};
name = Release;
};
83CBBA201A601CBA00E9B192 /* Debug */ = {
isa = XCBuildConfiguration;
buildSettings = {
ALWAYS_SEARCH_USER_PATHS = NO;
CLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;
CLANG_CXX_LANGUAGE_STANDARD = "gnu++0x";
CLANG_CXX_LIBRARY = "libc++";
CLANG_ENABLE_MODULES = YES;
CLANG_ENABLE_OBJC_ARC = YES;
CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;
CLANG_WARN_BOOL_CONVERSION = YES;
CLANG_WARN_COMMA = YES;
CLANG_WARN_CONSTANT_CONVERSION = YES;
CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
CLANG_WARN_EMPTY_BODY = YES;
CLANG_WARN_ENUM_CONVERSION = YES;
CLANG_WARN_INFINITE_RECURSION = YES;
CLANG_WARN_INT_CONVERSION = YES;
CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;
CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
CLANG_WARN_STRICT_PROTOTYPES = YES;
CLANG_WARN_SUSPICIOUS_MOVE = YES;
CLANG_WARN_UNREACHABLE_CODE = YES;
CLANG_WARN__DUPLICATE_METHOD_MATCH = YES;
"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
COPY_PHASE_STRIP = NO;
ENABLE_STRICT_OBJC_MSGSEND = YES;
ENABLE_TESTABILITY = YES;
"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "arm64 ";
GCC_C_LANGUAGE_STANDARD = gnu99;
GCC_DYNAMIC_NO_PIC = NO;
GCC_NO_COMMON_BLOCKS = YES;
GCC_OPTIMIZATION_LEVEL = 0;
GCC_PREPROCESSOR_DEFINITIONS = (
"DEBUG=1",
"$(inherited)",
);
GCC_SYMBOLS_PRIVATE_EXTERN = NO;
GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
GCC_WARN_UNDECLARED_SELECTOR = YES;
GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
GCC_WARN_UNUSED_FUNCTION = YES;
GCC_WARN_UNUSED_VARIABLE = YES;
IPHONEOS_DEPLOYMENT_TARGET = 10.0;
LD_RUNPATH_SEARCH_PATHS = (
/usr/lib/swift,
"$(inherited)",
);
LIBRARY_SEARCH_PATHS = (
"\"$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)\"",
"\"$(TOOLCHAIN_DIR)/usr/lib/swift-5.0/$(PLATFORM_NAME)\"",
"\"$(inherited)\"",
);
MTL_ENABLE_DEBUG_INFO = YES;
ONLY_ACTIVE_ARCH = YES;
SDKROOT = iphoneos;
};
name = Debug;
};
83CBBA211A601CBA00E9B192 /* Release */ = {
isa = XCBuildConfiguration;
buildSettings = {
ALWAYS_SEARCH_USER_PATHS = NO;
CLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;
CLANG_CXX_LANGUAGE_STANDARD = "gnu++0x";
CLANG_CXX_LIBRARY = "libc++";
CLANG_ENABLE_MODULES = YES;
CLANG_ENABLE_OBJC_ARC = YES;
CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;
CLANG_WARN_BOOL_CONVERSION = YES;
CLANG_WARN_COMMA = YES;
CLANG_WARN_CONSTANT_CONVERSION = YES;
CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
CLANG_WARN_EMPTY_BODY = YES;
CLANG_WARN_ENUM_CONVERSION = YES;
CLANG_WARN_INFINITE_RECURSION = YES;
CLANG_WARN_INT_CONVERSION = YES;
CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;
CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
CLANG_WARN_STRICT_PROTOTYPES = YES;
CLANG_WARN_SUSPICIOUS_MOVE = YES;
CLANG_WARN_UNREACHABLE_CODE = YES;
CLANG_WARN__DUPLICATE_METHOD_MATCH = YES;
"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
COPY_PHASE_STRIP = YES;
ENABLE_NS_ASSERTIONS = NO;
ENABLE_STRICT_OBJC_MSGSEND = YES;
"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "arm64 ";
GCC_C_LANGUAGE_STANDARD = gnu99;
GCC_NO_COMMON_BLOCKS = YES;
GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
GCC_WARN_UNDECLARED_SELECTOR = YES;
GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
GCC_WARN_UNUSED_FUNCTION = YES;
GCC_WARN_UNUSED_VARIABLE = YES;
IPHONEOS_DEPLOYMENT_TARGET = 10.0;
LD_RUNPATH_SEARCH_PATHS = (
/usr/lib/swift,
"$(inherited)",
);
LIBRARY_SEARCH_PATHS = (
"\"$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)\"",
"\"$(TOOLCHAIN_DIR)/usr/lib/swift-5.0/$(PLATFORM_NAME)\"",
"\"$(inherited)\"",
);
MTL_ENABLE_DEBUG_INFO = NO;
SDKROOT = iphoneos;
VALIDATE_PRODUCT = YES;
};
name = Release;
};
/* End XCBuildConfiguration section */
/* Begin XCConfigurationList section */
00E357021AD99517003FC87E /* Build configuration list for PBXNativeTarget "RNBareExampleTests" */ = {
isa = XCConfigurationList;
buildConfigurations = (
00E356F61AD99517003FC87E /* Debug */,
00E356F71AD99517003FC87E /* Release */,
);
defaultConfigurationIsVisible = 0;
defaultConfigurationName = Release;
};
13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "RNBareExample" */ = {
isa = XCConfigurationList;
buildConfigurations = (
13B07F941A680F5B00A75B9A /* Debug */,
13B07F951A680F5B00A75B9A /* Release */,
);
defaultConfigurationIsVisible = 0;
defaultConfigurationName = Release;
};
83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "RNBareExample" */ = {
isa = XCConfigurationList;
buildConfigurations = (
83CBBA201A601CBA00E9B192 /* Debug */,
83CBBA211A601CBA00E9B192 /* Release */,
);
defaultConfigurationIsVisible = 0;
defaultConfigurationName = Release;
};
/* End XCConfigurationList section */
};
rootObject = 83CBB9F71A601CBA00E9B192 /* Project object */;
}
================================================
FILE: RNBareExample/ios/RNBareExample.xcodeproj/xcshareddata/xcschemes/RNBareExample.xcscheme
================================================
<?xml version="1.0" encoding="UTF-8"?>
<Scheme
LastUpgradeVersion = "1210"
version = "1.3">
<BuildAction
parallelizeBuildables = "YES"
buildImplicitDependencies = "YES">
<BuildActionEntries>
<BuildActionEntry
buildForTesting = "YES"
buildForRunning = "YES"
buildForProfiling = "YES"
buildForArchiving = "YES"
buildForAnalyzing = "YES">
<BuildableReference
BuildableIdentifier = "primary"
BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
BuildableName = "RNBareExample.app"
BlueprintName = "RNBareExample"
ReferencedContainer = "container:RNBareExample.xcodeproj">
</BuildableReference>
</BuildActionEntry>
</BuildActionEntries>
</BuildAction>
<TestAction
buildConfiguration = "Debug"
selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
shouldUseLaunchSchemeArgsEnv = "YES">
<Testables>
<TestableReference
skipped = "NO">
<BuildableReference
BuildableIdentifier = "primary"
BlueprintIdentifier = "00E356ED1AD99517003FC87E"
BuildableName = "RNBareExampleTests.xctest"
BlueprintName = "RNBareExampleTests"
ReferencedContainer = "container:RNBareExample.xcodeproj">
</BuildableReference>
</TestableReference>
</Testables>
</TestAction>
<LaunchAction
buildConfiguration = "Debug"
selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
launchStyle = "0"
useCustomWorkingDirectory = "NO"
ignoresPersistentStateOnLaunch = "NO"
debugDocumentVersioning = "YES"
debugServiceExtension = "internal"
allowLocationSimulation = "YES">
<BuildableProductRunnable
runnableDebuggingMode = "0">
<BuildableReference
BuildableIdentifier = "primary"
BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
BuildableName = "RNBareExample.app"
BlueprintName = "RNBareExample"
ReferencedContainer = "container:RNBareExample.xcodeproj">
</BuildableReference>
</BuildableProductRunnable>
</LaunchAction>
<ProfileAction
buildConfiguration = "Release"
shouldUseLaunchSchemeArgsEnv = "YES"
savedToolIdentifier = ""
useCustomWorkingDirectory = "NO"
debugDocumentVersioning = "YES">
<BuildableProductRunnable
runnableDebuggingMode = "0">
<BuildableReference
BuildableIdentifier = "primary"
BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
BuildableName = "RNBareExample.app"
BlueprintName = "RNBareExample"
ReferencedContainer = "container:RNBareExample.xcodeproj">
</BuildableReference>
</BuildableProductRunnable>
</ProfileAction>
<AnalyzeAction
buildConfiguration = "Debug">
</AnalyzeAction>
<ArchiveAction
buildConfiguration = "Release"
revealArchiveInOrganizer = "YES">
</ArchiveAction>
</Scheme>
================================================
FILE: RNBareExample/ios/RNBareExample.xcworkspace/contents.xcworkspacedata
================================================
<?xml version="1.0" encoding="UTF-8"?>
<Workspace
version = "1.0">
<FileRef
location = "group:RNBareExample.xcodeproj">
</FileRef>
<FileRef
location = "group:Pods/Pods.xcodeproj">
</FileRef>
</Workspace>
================================================
FILE: RNBareExample/ios/RNBareExample.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist
================================================
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>IDEDidComputeMac32BitWarning</key>
<true/>
</dict>
</plist>
================================================
FILE: RNBareExample/ios/RNBareExampleTests/Info.plist
================================================
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>CFBundleDevelopmentRegion</key>
<string>en</string>
<key>CFBundleExecutable</key>
<string>$(EXECUTABLE_NAME)</string>
<key>CFBundleIdentifier</key>
<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
<key>CFBundleInfoDictionaryVersion</key>
<string>6.0</string>
<key>CFBundleName</key>
<string>$(PRODUCT_NAME)</string>
<key>CFBundlePackageType</key>
<string>BNDL</string>
<key>CFBundleShortVersionString</key>
<string>1.0</string>
<key>CFBundleSignature</key>
<string>????</string>
<key>CFBundleVersion</key>
<string>1</string>
</dict>
</plist>
================================================
FILE: RNBareExample/ios/RNBareExampleTests/RNBareExampleTests.m
================================================
#import <UIKit/UIKit.h>
#import <XCTest/XCTest.h>
#import <React/RCTLog.h>
#import <React/RCTRootView.h>
#define TIMEOUT_SECONDS 600
#define TEXT_TO_LOOK_FOR @"Welcome to React"
@interface RNBareExampleTests : XCTestCase
@end
@implementation RNBareExampleTests
- (BOOL)findSubviewInView:(UIView *)view matching:(BOOL(^)(UIView *view))test
{
if (test(view)) {
return YES;
}
for (UIView *subview in [view subviews]) {
if ([self findSubviewInView:subview matching:test]) {
return YES;
}
}
return NO;
}
- (void)testRendersWelcomeScreen
{
UIViewController *vc = [[[RCTSharedApplication() delegate] window] rootViewController];
NSDate *date = [NSDate dateWithTimeIntervalSinceNow:TIMEOUT_SECONDS];
BOOL foundElement = NO;
__block NSString *redboxError = nil;
#ifdef DEBUG
RCTSetLogFunction(^(RCTLogLevel level, RCTLogSource source, NSString *fileName, NSNumber *lineNumber, NSString *message) {
if (level >= RCTLogLevelError) {
redboxError = message;
}
});
#endif
while ([date timeIntervalSinceNow] > 0 && !foundElement && !redboxError) {
[[NSRunLoop mainRunLoop] runMode:NSDefaultRunLoopMode beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]];
[[NSRunLoop mainRunLoop] runMode:NSRunLoopCommonModes beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]];
foundElement = [self findSubviewInView:vc.view matching:^BOOL(UIView *view) {
if ([view.accessibilityLabel isEqualToString:TEXT_TO_LOOK_FOR]) {
return YES;
}
return NO;
}];
}
#ifdef DEBUG
RCTSetLogFunction(RCTDefaultLogFunction);
#endif
XCTAssertNil(redboxError, @"RedBox error: %@", redboxError);
XCTAssertTrue(foundElement, @"Couldn't find element with text '%@' in %d seconds", TEXT_TO_LOOK_FOR, TIMEOUT_SECONDS);
}
@end
================================================
FILE: RNBareExample/metro.config.js
================================================
const path = require('path');
const blacklist = require('metro-config/src/defaults/blacklist');
const escape = require('escape-string-regexp');
const pak = require('../package.json');
const root = path.resolve(__dirname, '..');
const modules = Object.keys({
...pak.peerDependencies,
});
module.exports = {
projectRoot: __dirname,
watchFolders: [root],
// We need to make sure that only one version is loaded for peerDependencies
// So we blacklist them at the root, and alias them to the versions in example's node_modules
resolver: {
blacklistRE: blacklist(
modules.map(
m => new RegExp(`^${escape(path.join(root, 'node_modules', m))}\\/.*$`),
),
),
extraNodeModules: modules.reduce((acc, name) => {
acc[name] = path.join(__dirname, 'node_modules', name);
return acc;
}, {}),
},
transformer: {
getTransformOptions: async () => ({
transform: {
experimentalImportSupport: false,
inlineRequires: false,
},
}),
},
};
================================================
FILE: RNBareExample/package.json
================================================
{
"name": "RNBareExample",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint . --ext .js,.jsx,.ts,.tsx"
},
"dependencies": {
"react": "17.0.1",
"react-native": "0.64.1",
"react-native-linear-gradient": "^2.5.6",
"react-native-safe-area-context": "^3.2.0",
"react-native-svg": "^12.1.1"
},
"devDependencies": {
"@babel/core": "^7.12.9",
"@babel/runtime": "^7.12.5",
"@react-native-community/eslint-config": "^2.0.0",
"@types/jest": "^26.0.23",
"@types/react-native": "^0.64.5",
"@types/react-test-renderer": "^16.9.2",
"babel-jest": "^26.6.3",
"babel-plugin-module-resolver": "^4.1.0",
"eslint": "^7.14.0",
"jest": "^26.6.3",
"metro-react-native-babel-preset": "^0.64.0",
"react-test-renderer": "17.0.1",
"typescript": "^3.8.3"
},
"resolutions": {
"@types/react": "^17"
},
"jest": {
"preset": "react-native",
"moduleFileExtensions": [
"ts",
"tsx",
"js",
"jsx",
"json",
"node"
]
}
}
================================================
FILE: RNBareExample/react-native.config.js
================================================
module.exports = {
project: {
ios: {},
android: {},
},
assets: ['./assets/fonts'],
};
================================================
FILE: RNBareExample/tsconfig.json
================================================
{
"compilerOptions": {
"paths": {
"native-base": ["../src/index"]
},
/* Basic Options */
"target": "esnext" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */,
"module": "commonjs" /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */,
"lib": [
"es2017"
] /* Specify library files to be included in the compilation. */,
"allowJs": true /* Allow javascript files to be compiled. */,
// "checkJs": true, /* Report errors in .js files. */
"jsx": "react-native" /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */,
// "declaration": true, /* Generates corresponding '.d.ts' file. */
// "sourceMap": true, /* Generates corresponding '.map' file. */
// "outFile": "./", /* Concatenate and emit output to single file. */
// "outDir": "./", /* Redirect output structure to the directory. */
// "rootDir": "./", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
// "removeComments": true, /* Do not emit comments to output. */
"noEmit": true /* Do not emit outputs. */,
// "incremental": true, /* Enable incremental compilation */
// "importHelpers": true, /* Import emit helpers from 'tslib'. */
// "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
"isolatedModules": true /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */,
/* Strict Type-Checking Options */
"strict": true /* Enable all strict type-checking options. */,
// "noImplicitAny": true, /* Raise error on expressions and declarations with an implied 'any' type. */
// "strictNullChecks": true, /* Enable strict null checks. */
// "strictFunctionTypes": true, /* Enable strict checking of function types. */
// "strictPropertyInitialization": true, /* Enable strict checking of property initialization in classes. */
// "noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */
// "alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */
/* Additional Checks */
// "noUnusedLocals": true, /* Report errors on unused locals. */
// "noUnusedParameters": true, /* Report errors on unused parameters. */
// "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
// "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
/* Module Resolution Options */
"moduleResolution": "node" /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */,
// "baseUrl": "./", /* Base directory to resolve non-absolute module names. */
// "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
// "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */
// "typeRoots": [], /* List of folders to include type definitions from. */
// "types": [], /* Type declaration files to be included in compilation. */
"allowSyntheticDefaultImports": true /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */,
"esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */,
// "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */
"skipLibCheck": false /* Skip type checking of declaration files. */
/* Source Map Options */
// "sourceRoot": "./", /* Specify the location where debugger should locate TypeScript files instead of source locations. */
// "mapRoot": "./", /* Specify the location where debugger should locate map files instead of generated locations. */
// "inlineSourceMap": true, /* Emit a single file with source maps instead of having a separate file. */
// "inlineSources": true, /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
/* Experimental Options */
// "experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
// "emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */
},
"exclude": [
"node_modules",
"babel.config.js",
"metro.config.js",
"jest.config.js"
]
}
================================================
FILE: babel.config.js
================================================
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
plugins:
process.env.NODE_ENV === 'production' ? ['transform-remove-console'] : [],
};
================================================
FILE: cli.js
================================================
const { exec } = require('child_process');
const path = require('path');
const fs = require('fs');
// Copy directory
function copyDir(src, dest) {
fs.mkdirSync(dest, { recursive: true });
let entries = fs.readdirSync(src, { withFileTypes: true });
for (let entry of entries) {
let srcPath = path.join(src, entry.name);
let destPath = path.join(dest, entry.name);
entry.isDirectory()
? copyDir(srcPath, destPath)
: fs.copyFileSync(srcPath, destPath);
}
}
const themeFolder = path.join(__dirname, 'src', 'theme');
const outDirectory = path.join(process.cwd(), 'theme');
const themeTemp = path.join(process.cwd(), 'theme-temp');
const transpileScript = `tsc ${themeTemp}/index.ts --target esnext --moduleResolution node --outDir ${outDirectory} --skipLibCheck true --allowSyntheticDefaultImports true`;
const VALID_ARGS = ['eject:theme'];
const ejectTheme = async () => {
await copyDir(themeFolder, themeTemp);
await promisifyExec(transpileScript);
fs.rmSync(themeTemp, { recursive: true, force: true });
console.log('Theme ejected successfully!');
console.log('Theme folder is placed in ' + process.cwd() + ' directory.');
};
const main = () => {
const myArgs = process.argv.slice(2);
invokeFunctionBasedOnArgs(myArgs[0]);
};
const invokeFunctionBasedOnArgs = (arg) => {
switch (arg) {
case VALID_ARGS[0]: {
ejectTheme();
break;
}
default: {
console.log('No arguments matched. Valid arguments are ', VALID_ARGS);
break;
}
}
};
const promisifyExec = (command) => {
return new Promise((resolve, reject) => {
exec(command, (error, stdout, stderr) => {
console.log(stdout);
console.log(stderr);
if (error !== null) {
reject(error);
console.log(`exec error: ${error}`);
}
resolve();
});
});
};
main();
================================================
FILE: example/.eslintrc.json
================================================
{
"extends": ["@react-native-community", "prettier"],
"rules": {
"prettier/prettier": [
"error",
{
"quoteProps": "preserve",
"singleQuote": true,
"tabWidth": 2,
"trailingComma": "es5",
"useTabs": false
}
],
"no-bitwise": 0,
"prefer-const": "warn",
"no-console": "off"
},
"plugins": ["prettier"]
}
================================================
FILE: example/.nvmrc
================================================
v14.19.0
================================================
FILE: example/App.tsx
================================================
import React from 'react';
import StoryBookUI from './storybook';
import { useFonts } from 'expo-font';
export default () => {
const [loaded] = useFonts({
'Roboto-Bold': require('./assets/fonts/Roboto-Bold.ttf'),
'Roboto-Italic': require('./assets/fonts/Roboto-Italic.ttf'),
'Roboto-Light': require('./assets/fonts/Roboto-Light.ttf'),
'Roboto-Regular': require('./assets/fonts/Roboto-Regular.ttf'),
'Roboto-Medium': require('./assets/fonts/Roboto-Medium.ttf'),
'Montserrat-Bold': require('./assets/fonts/Montserrat-Bold.ttf'),
'Montserrat-Italic': require('./assets/fonts/Montserrat-Italic.ttf'),
'Montserrat-Light': require('./assets/fonts/Montserrat-Light.ttf'),
'Montserrat-Regular': require('./assets/fonts/Montserrat-Regular.ttf'),
'Montserrat-Medium': require('./assets/fonts/Montserrat-Medium.ttf'),
'Montserrat-MediumItalic': require('./assets/fonts/Montserrat-MediumItalic.ttf'),
'Montserrat-Black': require('./assets/fonts/Montserrat-Black.ttf'),
'Montserrat-BlackItalic': require('./assets/fonts/Montserrat-BlackItalic.ttf'),
'Montserrat-ExtraBold': require('./assets/fonts/Montserrat-ExtraBold.ttf'),
'Montserrat-ExtraBoldItalic': require('./assets/fonts/Montserrat-ExtraBoldItalic.ttf'),
'Montserrat-SemiBold': require('./assets/fonts/Montserrat-SemiBold.ttf'),
'Montserrat-SemiBoldItalic': require('./assets/fonts/Montserrat-SemiBoldItalic.ttf'),
});
if (!loaded) return null;
return <StoryBookUI />;
};
================================================
FILE: example/__mocks__/@react-native-async-storage/async-storage.js
================================================
import DefaultValue from '@react-native-async-storage/async-storage/jest/async-storage-mock';
export default DefaultValue;
================================================
FILE: example/__mocks__/globalMock.js
================================================
jest.mock('global', () => ({
...global,
WebSocket: function WebSocket() {},
}));
jest.mock('react-native-keyboard-aware-scroll-view', () => {
const KeyboardAwareScrollView = ({ children }) => children;
return { KeyboardAwareScrollView };
});
import mockAsyncStorage from '@react-native-async-storage/async-storage/jest/async-storage-mock';
jest.mock('@react-native-async-storage/async-storage', () => mockAsyncStorage);
================================================
FILE: example/app.json
================================================
{
"name": "NativeBaseExample",
"displayName": "NativeBase Example",
"packagerOpts": {
"config": "metro.config.js"
},
"expo": {
"name": "NativeBase Example",
"slug": "native-base-example",
"description": "Example app for Nativebase",
"privacy": "public",
"version": "1.0.0",
"platforms": ["ios", "android", "web"],
"ios": {
"supportsTablet": true
},
"assetBundlePatterns": ["**/*"]
}
}
================================================
FILE: example/babel.config.js
================================================
const path = require('path');
const pak = require('../package.json');
module.exports = function (api) {
api.cache(true);
return {
presets: [['babel-preset-expo', { jsxRuntime: 'classic' }]],
plugins: [
[
'module-resolver',
{
alias: {
// For development, we want to alias the library to the source
[pak.name]: path.join(__dirname, '..', pak.source),
},
},
],
],
};
};
================================================
FILE: example/jest-android.config.js
================================================
const config = {
preset: 'jest-expo/android',
transformIgnorePatterns: [
'<rootDir>/../node_modules/(?!(jest-)?react-native|react-clone-referenced-element|@react-native-community|expo(nent)?|@expo(nent)?/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|@sentry/.*)',
],
setupFilesAfterEnv: ['<rootDir>/__mocks__/globalMock.js'],
};
module.exports = config;
================================================
FILE: example/jest-ios.config.js
================================================
const config = {
preset: 'jest-expo/ios',
transformIgnorePatterns: [
'<rootDir>/../node_modules/(?!(jest-)?react-native|react-clone-referenced-element|@react-native-community|expo(nent)?|@expo(nent)?/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|@sentry/.*)',
],
setupFilesAfterEnv: ['<rootDir>/__mocks__/globalMock.js'],
};
module.exports = config;
================================================
FILE: example/jest.config.js
================================================
const config = {
projects: [{ preset: 'jest-expo/web' }, { preset: 'jest-expo/node' }],
transformIgnorePatterns: [
'<rootDir>/../node_modules/(?!(jest-)?react-native|react-clone-referenced-element|@react-native-community|expo(nent)?|@expo(nent)?/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|@sentry/.*)',
],
setupFilesAfterEnv: ['<rootDir>/__mocks__/globalMock.js'],
globals: {
window: {},
},
moduleNameMapper: {
'^.+\\.(css|less)$': '<rootDir>/__mocks__/styleMock.js', // replaces .css imports with an empty object
'\\.(jpg|png|gif|ttf|eot|svg)$': '<rootDir>/__mocks__/fileMock.js', // replaces file imports with a useless string
'^react($|/.+)': '<rootDir>/node_modules/react$1', // makes sure all React imports are running off of the one in this package.
},
};
module.exports = config;
================================================
FILE: example/metro.config.js
================================================
const path = require('path');
const blacklist = require('metro-config/src/defaults/exclusionList');
const escape = require('escape-string-regexp');
const pak = require('../package.json');
const root = path.resolve(__dirname, '..');
const modules = Object.keys({
...pak.peerDependencies,
});
module.exports = {
projectRoot: __dirname,
watchFolders: [root],
// We need to make sure that only one version is loaded for peerDependencies
// So we blacklist them at the root, and alias them to the versions in example's node_modules
resolver: {
blacklistRE: blacklist(
modules.map(
(m) =>
new RegExp(`^${escape(path.join(root, 'node_modules', m))}\\/.*$`)
)
),
extraNodeModules: modules.reduce((acc, name) => {
acc[name] = path.join(__dirname, 'node_modules', name);
return acc;
}, {}),
},
transformer: {
getTransformOptions: async () => ({
transform: {
experimentalImportSupport: false,
inlineRequires: false,
},
}),
},
};
================================================
FILE: example/nativebase.config.ts
================================================
import { INativebaseConfig } from 'native-base';
export default {
dependencies: {
'linear-gradient': require('expo-linear-gradient').LinearGradient,
},
// strictMode: 'warn',
} as INativebaseConfig;
================================================
FILE: example/package.json
================================================
{
"name": "native-base-example",
"description": "Example app for NativeBase",
"version": "0.0.3",
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject",
"storybook": "start-storybook -p 7007",
"build-storybook": "build-storybook",
"postinstall": "patch-package",
"test": "bash scripts/test.sh",
"update-test": "yarn test -u"
},
"dependencies": {
"@expo/vector-icons": "^13.0.0",
"@react-native-aria/overlays": "^0.2.9",
"@react-native-async-storage/async-storage": "~1.17.3",
"expo": "^46.0.0",
"expo-font": "~10.2.0",
"expo-linear-gradient": "~11.4.0",
"expo-splash-screen": "~0.16.2",
"expo-status-bar": "~1.4.0",
"formik": "^2.2.6",
"react": "18.0.0",
"react-hook-form": "^6.14.0",
"react-native": "0.69.6",
"react-native-keyboard-aware-scroll-view": "^0.9.4",
"react-native-safe-area-context": "4.3.1",
"react-native-svg": "12.3.0",
"react-native-web": "~0.18.7",
"webpack-dev-server": "3"
},
"devDependencies": {
"@babel/core": "^7.18.6",
"@babel/runtime": "^7.12.5",
"@expo/webpack-config": "^0.17.0",
"@storybook/addon-actions": "^5.3",
"@storybook/addon-knobs": "^5.3",
"@storybook/addon-links": "^5.3",
"@storybook/addon-ondevice-actions": "^5.3.23",
"@storybook/addon-ondevice-knobs": "^5.3.23",
"@storybook/addon-storyshots": "6.3",
"@storybook/react-native": "^5.3.23",
"@storybook/react-native-server": "^5.3.23",
"@types/react": "~18.0.0",
"@types/react-dom": "~18.0.0",
"@types/react-native": "~0.69.1",
"babel-loader": "^8.2.2",
"babel-plugin-module-resolver": "^4.0.0",
"core-js": "3.6.5",
"jest": "^26.6.3",
"jest-expo": "^46.0.0",
"metro-react-native-babel-preset": "^0.64.0",
"patch-package": "^6.2.2",
"postinstall-postinstall": "^2.1.0",
"react-dom": "18.0.0",
"react-test-renderer": "17.0.1",
"typescript": "^4.6.3"
},
"private": false
}
================================================
FILE: example/patches/core-js+3.6.5.patch
================================================
diff --git a/node_modules/core-js/modules/es.promise.js b/node_modules/core-js/modules/es.promise.js
index b79d2bc..e69de29 100644
--- a/node_modules/core-js/modules/es.promise.js
+++ b/node_modules/core-js/modules/es.promise.js
@@ -1,379 +0,0 @@
-'use strict';
-var $ = require('../internals/export');
-var IS_PURE = require('../internals/is-pure');
-var global = require('../internals/global');
-var getBuiltIn = require('../internals/get-built-in');
-var NativePromise = require('../internals/native-promise-constructor');
-var redefine = require('../internals/redefine');
-var redefineAll = require('../internals/redefine-all');
-var setToStringTag = require('../internals/set-to-string-tag');
-var setSpecies = require('../internals/set-species');
-var isObject = require('../internals/is-object');
-var aFunction = require('../internals/a-function');
-var anInstance = require('../internals/an-instance');
-var classof = require('../internals/classof-raw');
-var inspectSource = require('../internals/inspect-source');
-var iterate = require('../internals/iterate');
-var checkCorrectnessOfIteration = require('../internals/check-correctness-of-iteration');
-var speciesConstructor = require('../internals/species-constructor');
-var task = require('../internals/task').set;
-var microtask = require('../internals/microtask');
-var promiseResolve = require('../internals/promise-resolve');
-var hostReportErrors = require('../internals/host-report-errors');
-var newPromiseCapabilityModule = require('../internals/new-promise-capability');
-var perform = require('../internals/perform');
-var InternalStateModule = require('../internals/internal-state');
-var isForced = require('../internals/is-forced');
-var wellKnownSymbol = require('../internals/well-known-symbol');
-var V8_VERSION = require('../internals/engine-v8-version');
-
-var SPECIES = wellKnownSymbol('species');
-var PROMISE = 'Promise';
-var getInternalState = InternalStateModule.get;
-var setInternalState = InternalStateModule.set;
-var getInternalPromiseState = InternalStateModule.getterFor(PROMISE);
-var PromiseConstructor = NativePromise;
-var TypeError = global.TypeError;
-var document = global.document;
-var process = global.process;
-var $fetch = getBuiltIn('fetch');
-var newPromiseCapability = newPromiseCapabilityModule.f;
-var newGenericPromiseCapability = newPromiseCapability;
-var IS_NODE = classof(process) == 'process';
-var DISPATCH_EVENT = !!(document && document.createEvent && global.dispatchEvent);
-var UNHANDLED_REJECTION = 'unhandledrejection';
-var REJECTION_HANDLED = 'rejectionhandled';
-var PENDING = 0;
-var FULFILLED = 1;
-var REJECTED = 2;
-var HANDLED = 1;
-var UNHANDLED = 2;
-var Internal, OwnPromiseCapability, PromiseWrapper, nativeThen;
-
-var FORCED = isForced(PROMISE, function () {
- var GLOBAL_CORE_JS_PROMISE = inspectSource(PromiseConstructor) !== String(PromiseConstructor);
- if (!GLOBAL_CORE_JS_PROMISE) {
- // V8 6.6 (Node 10 and Chrome 66) have a bug with resolving custom thenables
- // https://bugs.chromium.org/p/chromium/issues/detail?id=830565
- // We can't detect it synchronously, so just check versions
- if (V8_VERSION === 66) return true;
- // Unhandled rejections tracking support, NodeJS Promise without it fails @@species test
- if (!IS_NODE && typeof PromiseRejectionEvent != 'function') return true;
- }
- // We need Promise#finally in the pure version for preventing prototype pollution
- if (IS_PURE && !PromiseConstructor.prototype['finally']) return true;
- // We can't use @@species feature detection in V8 since it causes
- // deoptimization and performance degradation
- // https://github.com/zloirock/core-js/issues/679
- if (V8_VERSION >= 51 && /native code/.test(PromiseConstructor)) return false;
- // Detect correctness of subclassing with @@species support
- var promise = PromiseConstructor.resolve(1);
- var FakePromise = function (exec) {
- exec(function () { /* empty */ }, function () { /* empty */ });
- };
- var constructor = promise.constructor = {};
- constructor[SPECIES] = FakePromise;
- return !(promise.then(function () { /* empty */ }) instanceof FakePromise);
-});
-
-var INCORRECT_ITERATION = FORCED || !checkCorrectnessOfIteration(function (iterable) {
- PromiseConstructor.all(iterable)['catch'](function () { /* empty */ });
-});
-
-// helpers
-var isThenable = function (it) {
- var then;
- return isObject(it) && typeof (then = it.then) == 'function' ? then : false;
-};
-
-var notify = function (promise, state, isReject) {
- if (state.notified) return;
- state.notified = true;
- var chain = state.reactions;
- microtask(function () {
- var value = state.value;
- var ok = state.state == FULFILLED;
- var index = 0;
- // variable length - can't use forEach
- while (chain.length > index) {
- var reaction = chain[index++];
- var handler = ok ? reaction.ok : reaction.fail;
- var resolve = reaction.resolve;
- var reject = reaction.reject;
- var domain = reaction.domain;
- var result, then, exited;
- try {
- if (handler) {
- if (!ok) {
- if (state.rejection === UNHANDLED) onHandleUnhandled(promise, state);
- state.rejection = HANDLED;
- }
- if (handler === true) result = value;
- else {
- if (domain) domain.enter();
- result = handler(value); // can throw
- if (domain) {
- domain.exit();
- exited = true;
- }
- }
- if (result === reaction.promise) {
- reject(TypeError('Promise-chain cycle'));
- } else if (then = isThenable(result)) {
- then.call(result, resolve, reject);
- } else resolve(result);
- } else reject(value);
- } catch (error) {
- if (domain && !exited) domain.exit();
- reject(error);
- }
- }
- state.reactions = [];
- state.notified = false;
- if (isReject && !state.rejection) onUnhandled(promise, state);
- });
-};
-
-var dispatchEvent = function (name, promise, reason) {
- var event, handler;
- if (DISPATCH_EVENT) {
- event = document.createEvent('Event');
- event.promise = promise;
- event.reason = reason;
- event.initEvent(name, false, true);
- global.dispatchEvent(event);
- } else event = { promise: promise, reason: reason };
- if (handler = global['on' + name]) handler(event);
- else if (name === UNHANDLED_REJECTION) hostReportErrors('Unhandled promise rejection', reason);
-};
-
-var onUnhandled = function (promise, state) {
- task.call(global, function () {
- var value = state.value;
- var IS_UNHANDLED = isUnhandled(state);
- var result;
- if (IS_UNHANDLED) {
- result = perform(function () {
- if (IS_NODE) {
- process.emit('unhandledRejection', value, promise);
- } else dispatchEvent(UNHANDLED_REJECTION, promise, value);
- });
- // Browsers should not trigger `rejectionHandled` event if it was handled here, NodeJS - should
- state.rejection = IS_NODE || isUnhandled(state) ? UNHANDLED : HANDLED;
- if (result.error) throw result.value;
- }
- });
-};
-
-var isUnhandled = function (state) {
- return state.rejection !== HANDLED && !state.parent;
-};
-
-var onHandleUnhandled = function (promise, state) {
- task.call(global, function () {
- if (IS_NODE) {
- process.emit('rejectionHandled', promise);
- } else dispatchEvent(REJECTION_HANDLED, promise, state.value);
- });
-};
-
-var bind = function (fn, promise, state, unwrap) {
- return function (value) {
- fn(promise, state, value, unwrap);
- };
-};
-
-var internalReject = function (promise, state, value, unwrap) {
- if (state.done) return;
- state.done = true;
- if (unwrap) state = unwrap;
- state.value = value;
- state.state = REJECTED;
- notify(promise, state, true);
-};
-
-var internalResolve = function (promise, state, value, unwrap) {
- if (state.done) return;
- state.done = true;
- if (unwrap) state = unwrap;
- try {
- if (promise === value) throw TypeError("Promise can't be resolved itself");
- var then = isThenable(value);
- if (then) {
- microtask(function () {
- var wrapper = { done: false };
- try {
- then.call(value,
- bind(internalResolve, promise, wrapper, state),
- bind(internalReject, promise, wrapper, state)
- );
- } catch (error) {
- internalReject(promise, wrapper, error, state);
- }
- });
- } else {
- state.value = value;
- state.state = FULFILLED;
- notify(promise, state, false);
- }
- } catch (error) {
- internalReject(promise, { done: false }, error, state);
- }
-};
-
-// constructor polyfill
-if (FORCED) {
- // 25.4.3.1 Promise(executor)
- PromiseConstructor = function Promise(executor) {
- anInstance(this, PromiseConstructor, PROMISE);
- aFunction(executor);
- Internal.call(this);
- var state = getInternalState(this);
- try {
- executor(bind(internalResolve, this, state), bind(internalReject, this, state));
- } catch (error) {
- internalReject(this, state, error);
- }
- };
- // eslint-disable-next-line no-unused-vars
- Internal = function Promise(executor) {
- setInternalState(this, {
- type: PROMISE,
- done: false,
- notified: false,
- parent: false,
- reactions: [],
- rejection: false,
- state: PENDING,
- value: undefined
- });
- };
- Internal.prototype = redefineAll(PromiseConstructor.prototype, {
- // `Promise.prototype.then` method
- // https://tc39.github.io/ecma262/#sec-promise.prototype.then
- then: function then(onFulfilled, onRejected) {
- var state = getInternalPromiseState(this);
- var reaction = newPromiseCapability(speciesConstructor(this, PromiseConstructor));
- reaction.ok = typeof onFulfilled == 'function' ? onFulfilled : true;
- reaction.fail = typeof onRejected == 'function' && onRejected;
- reaction.domain = IS_NODE ? process.domain : undefined;
- state.parent = true;
- state.reactions.push(reaction);
- if (state.state != PENDING) notify(this, state, false);
- return reaction.promise;
- },
- // `Promise.prototype.catch` method
- // https://tc39.github.io/ecma262/#sec-promise.prototype.catch
- 'catch': function (onRejected) {
- return this.then(undefined, onRejected);
- }
- });
- OwnPromiseCapability = function () {
- var promise = new Internal();
- var state = getInternalState(promise);
- this.promise = promise;
- this.resolve = bind(internalResolve, promise, state);
- this.reject = bind(internalReject, promise, state);
- };
- newPromiseCapabilityModule.f = newPromiseCapability = function (C) {
- return C === PromiseConstructor || C === PromiseWrapper
- ? new OwnPromiseCapability(C)
- : newGenericPromiseCapability(C);
- };
-
- if (!IS_PURE && typeof NativePromise == 'function') {
- nativeThen = NativePromise.prototype.then;
-
- // wrap native Promise#then for native async functions
- redefine(NativePromise.prototype, 'then', function then(onFulfilled, onRejected) {
- var that = this;
- return new PromiseConstructor(function (resolve, reject) {
- nativeThen.call(that, resolve, reject);
- }).then(onFulfilled, onRejected);
- // https://github.com/zloirock/core-js/issues/640
- }, { unsafe: true });
-
- // wrap fetch result
- if (typeof $fetch == 'function') $({ global: true, enumerable: true, forced: true }, {
- // eslint-disable-next-line no-unused-vars
- fetch: function fetch(input /* , init */) {
- return promiseResolve(PromiseConstructor, $fetch.apply(global, arguments));
- }
- });
- }
-}
-
-$({ global: true, wrap: true, forced: FORCED }, {
- Promise: PromiseConstructor
-});
-
-setToStringTag(PromiseConstructor, PROMISE, false, true);
-setSpecies(PROMISE);
-
-PromiseWrapper = getBuiltIn(PROMISE);
-
-// statics
-$({ target: PROMISE, stat: true, forced: FORCED }, {
- // `Promise.reject` method
- // https://tc39.github.io/ecma262/#sec-promise.reject
- reject: function reject(r) {
- var capability = newPromiseCapability(this);
- capability.reject.call(undefined, r);
- return capability.promise;
- }
-});
-
-$({ target: PROMISE, stat: true, forced: IS_PURE || FORCED }, {
- // `Promise.resolve` method
- // https://tc39.github.io/ecma262/#sec-promise.resolve
- resolve: function resolve(x) {
- return promiseResolve(IS_PURE && this === PromiseWrapper ? PromiseConstructor : this, x);
- }
-});
-
-$({ target: PROMISE, stat: true, forced: INCORRECT_ITERATION }, {
- // `Promise.all` method
- // https://tc39.github.io/ecma262/#sec-promise.all
- all: function all(iterable) {
- var C = this;
- var capability = newPromiseCapability(C);
- var resolve = capability.resolve;
- var reject = capability.reject;
- var result = perform(function () {
- var $promiseResolve = aFunction(C.resolve);
- var values = [];
- var counter = 0;
- var remaining = 1;
- iterate(iterable, function (promise) {
- var index = counter++;
- var alreadyCalled = false;
- values.push(undefined);
- remaining++;
- $promiseResolve.call(C, promise).then(function (value) {
- if (alreadyCalled) return;
- alreadyCalled = true;
- values[index] = value;
- --remaining || resolve(values);
- }, reject);
- });
- --remaining || resolve(values);
- });
- if (result.error) reject(result.value);
- return capability.promise;
- },
- // `Promise.race` method
- // https://tc39.github.io/ecma262/#sec-promise.race
- race: function race(iterable) {
- var C = this;
- var capability = newPromiseCapability(C);
- var reject = capability.reject;
- var result = perform(function () {
- var $promiseResolve = aFunction(C.resolve);
- iterate(iterable, function (promise) {
- $promiseResolve.call(C, promise).then(capability.resolve, reject);
- });
- });
- if (result.error) reject(result.value);
- return capability.promise;
- }
-});
================================================
FILE: example/scripts/test.sh
================================================
#!/bin/bash
lowercase(){
echo "$1" | sed "y/ABCDEFGHIJKLMNOPQRSTUVWXYZ/abcdefghijklmnopqrstuvwxyz/"
}
OS=`lowercase \`uname\``
case "$OS" in
msys*) rmdir /s /q node_modules/react node_modules/react-native ;;
cygwin*) rmdir /s /q node_modules/react node_modules/react-native ;;
*) rm -fR node_modules/react node_modules/react-native ;;
esac
red=`tput setaf 1`
green=`tput setaf 2`
reset=`tput sgr0`
#TODO:- run script with nvm use/ facing issues with yarn test working with npm run test
# script to be added
#unset PREFIX
# . ~/.nvm/nvm.sh
# nvm install v14.19.0
# nvm use
if [ $# -eq 0 ]
then
jest --config jest-ios.config.js --silent
jest --config jest-android.config.js --silent
NODEVERSION=$(node -v)
echo "you are using node version $NODEVERSION"
if [ $NODEVERSION != "v14.19.0" ]
then
echo "${red}Error! Node module v14.19.0 is not present or nvm is not installed
${green}If you have node v14.19.0 run 'nvm use'
Else run 'nvm install v14.19.0'${reset} "
else
jest --silent
fi
else
echo "Tests will be updated!"
jest --config jest-ios.config.js -u --silent
jest --config jest-android.config.js -u --silent
NODEVERSION=$(node -v)
echo "you are using node version $NODEVERSION"
if [ $NODEVERSION != "v14.19.0" ]
then
jest -u --silent
echo "${red}Error! Node module v14.19.0 is not present or nvm is not installed
${green}If you have node v14.19.0 run 'nvm use'
Else run 'nvm install v14.19.0'${reset} "
else
jest -u --silent
fi
fi
yarn install --check-files
================================================
FILE: example/storybook/addons.ts
================================================
import '@storybook/addon-actions/register';
import '@storybook/addon-links/register';
import '@storybook/addon-knobs/register';
import '@storybook/addon-ondevice-actions/register';
================================================
FILE: example/storybook/index.ts
================================================
// if you use expo remove this line
import { AppRegistry } from 'react-native';
import {
getStorybookUI,
configure,
addDecorator,
} from '@storybook/react-native';
import { withKnobs } from '@storybook/addon-knobs';
import './rn-addons';
import AsyncStorage from '@react-native-async-storage/async-storage';
// enables knobs for all stories
addDecorator(withKnobs);
// import stories
configure(() => {
require('./stories');
}, module);
// Refer to https://github.com/storybookjs/storybook/tree/master/app/react-native#start-command-parameters
// To find allowed options for getStorybookUI
const StorybookUIRoot = getStorybookUI({
// DOC: Uncomment this to get normal app view
// onDeviceUI: false,
asyncStorage: AsyncStorage,
});
// If you are using React Native vanilla and after installation you don't see your app name here, write it manually.
// If you use Expo you should remove this line.
AppRegistry.registerComponent('%APP_NAME%', () => StorybookUIRoot);
export default StorybookUIRoot;
================================================
FILE: example/storybook/rn-addons.ts
================================================
import '@storybook/addon-ondevice-actions/register';
import '@storybook/addon-ondevice-knobs/register';
================================================
FILE: example/storybook/stories/community-integrations/Formik/Basic.tsx
================================================
import { Input, Button, FormControl } from 'native-base';
import React from 'react';
import { useFormik, FormikErrors } from 'formik';
type IFormFields = {
firstName?: string;
lastName?: string;
email?: string;
};
function validateEmail(email: string) {
var re = /\S+@\S+\.\S+/;
return re.test(email);
}
export const Example = () => {
const formik = useFormik<IFormFields>({
initialValues: {
firstName: '',
lastName: '',
email: '',
},
onSubmit: async (values) => {
console.log('Handle submit', values);
},
validate: (values) => {
let errors: FormikErrors<IFormFields> = {};
if (!values.firstName) {
errors.firstName = 'Required';
} else if (values.firstName.length > 15) {
errors.firstName = 'Max allowed characters 15';
}
if (!values.email) {
errors.email = 'Required';
} else if (!validateEmail(values.email)) {
errors.email = 'Please enter a valid email address';
}
return errors;
},
});
const { handleChange, handleSubmit, errors, values } = formik;
console.log(values);
return (
<>
<FormControl isRequired isInvalid={'firstName' in errors}>
<FormControl.Label>First Name</FormControl.Label>
<Input
p={2}
placeholder="John"
onChangeText={handleChange('firstName')}
/>
<FormControl.ErrorMessage>{errors.firstName}</FormControl.ErrorMessage>
</FormControl>
<FormControl>
<FormControl.Label>Last Name</FormControl.Label>
<Input
p={2}
placeholder="Doe"
onChangeText={handleChange('lastName')}
/>
</FormControl>
<FormControl isRequired isInvalid={'email' in errors}>
<FormControl.Label>Email</FormControl.Label>
<Input
p={2}
placeholder="jon.doe@abc.com"
onChangeText={handleChange('email')}
/>
<FormControl.ErrorMessage>{errors.email}</FormControl.ErrorMessage>
</FormControl>
<Button onPress={() => handleSubmit}>Submit</Button>
</>
);
};
================================================
FILE: example/storybook/stories/community-integrations/Formik/index.tsx
================================================
import React from 'react';
import { storiesOf } from '@storybook/react-native';
import { withKnobs } from '@storybook/addon-knobs';
import Wrapper from './../../components/Wrapper';
import { Example as Basic } from './Basic';
storiesOf('Formik', module)
.addDecorator(withKnobs)
.addDecorator((getStory: any) => <Wrapper>{getStory()}</Wrapper>)
.add('Basic', () => <Basic />);
================================================
FILE: example/storybook/stories/community-integrations/ReactHookForm/DemoForm.tsx
================================================
import {
VStack,
Input,
Button,
FormControl,
Heading,
Box,
Text,
Divider,
HStack,
TextArea,
Avatar,
Select,
Checkbox,
Icon,
} from 'native-base';
import React from 'react';
import { Ionicons, EvilIcons, AntDesign } from '@expo/vector-icons';
export const Example = () => {
const [language, setLanguage] = React.useState('eng');
const [currency, setCurrency] = React.useState('usd');
return (
<VStack width="60%" space={4} my={6}>
<Heading bold fontSize="2xl" pb={4}>
Account Settings
</Heading>
<Divider />
<Box py={4}>
<HStack space={6}>
<Box flex={1}>
<Text fontSize="lg" fontWeight="semibold">
Personal Info
</Text>
</Box>
<Box flex={2}>
<VStack space={6}>
<FormControl>
<FormControl.Label
_text={{ fontWeight: 'medium', fontSize: 'md' }}
>
Name
</FormControl.Label>
<Input />
</FormControl>
<FormControl>
<FormControl.Label
_text={{ fontWeight: 'medium', fontSize: 'md' }}
>
Email
</FormControl.Label>
<Input editable={false} value="joe@nativebase.io" />
</FormControl>
<FormControl>
<FormControl.Label
_text={{ fontWeight: 'medium', fontSize: 'md' }}
>
Bio
</FormControl.Label>
<TextArea resize="vertical" />
<FormControl.HelperText>
Brief description for your profile. URLs are hyperlinked.
</FormControl.HelperText>
</FormControl>
</VStack>
</Box>
</HStack>
</Box>
<Divider />
<Box py={4}>
<HStack space={6}>
<Box flex={1}>
<Text fontSize="lg" fontWeight="semibold">
Profile Photo
</Text>
</Box>
<Box flex={2}>
<HStack alignItems="center" space={6}>
<Avatar
source={{
uri:
'https://images.unsplash.com/photo-1488282396544-0212eea56a21?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80',
}}
size={'24'}
>
JD
</Avatar>
<FormControl>
<Button.Group space={5}>
<Button
startIcon={
<Icon
as={Ionicons}
name="md-cloud-upload-sharp"
size={5}
/>
}
colorScheme="light"
>
Change photo
</Button>
<Button colorScheme="red" variant="ghost">
Delete
</Button>
</Button.Group>
<FormControl.HelperText>
.jpg, .gif, or .png. Max file size 700K.
</FormControl.HelperText>
</FormControl>
</HStack>
</Box>
</HStack>
</Box>
<Divider />
<Box py={4}>
<HStack space={6}>
<Box flex={1}>
<Text fontSize="lg" fontWeight="semibold">
Language
</Text>
</Box>
<Box flex={2}>
<VStack space={6}>
<FormControl>
<FormControl.Label
_text={{ fontWeight: 'medium', fontSize: 'md' }}
>
Display Language
</FormControl.Label>
<Select
w={64}
selectedValue={language}
accessibilityLabel="Select your Language"
placeholder="Select your Language"
onValueChange={(itemValue: string) => {
setLanguage(itemValue);
}}
>
<Select.Item label="English" value="eng" />
<Select.Item label="Hebrew" value="heb" />
<Select.Item label="Arabic" value="arb" />
</Select>
</FormControl>
<FormControl>
<FormControl.Label
_text={{ fontWeight: 'medium', fontSize: 'md' }}
>
Display currency
</FormControl.Label>
<Select
w={64}
selectedValue={currency}
accessibilityLabel="Select your Currency"
placeholder="Select your Currency"
onValueChange={(itemValue: string) => {
setCurrency(itemValue);
}}
>
<Select.Item label="USD ($)" value="usd" />
<Select.Item label="AED (dh)" value="aed" />
<Select.Item label="EUR (€)" value="eur" />
</Select>
</FormControl>
</VStack>
</Box>
</HStack>
</Box>
<Divider />
<Box py={4}>
<HStack space={6}>
<Box flex={1}>
<Text fontSize="lg" fontWeight="semibold">
Notifications
</Text>
</Box>
<Box flex={2}>
<VStack space={6}>
<Checkbox value="updates">
Get updates about the latest meetups.
</Checkbox>
<Checkbox value="notifications">
Get notifications about your account activites.
</Checkbox>
</VStack>
</Box>
</HStack>
</Box>
<Divider />
<Box py={4}>
<HStack space={6}>
<Box flex={1}>
<Text fontSize="lg" fontWeight="semibold">
Connect accounts
</Text>
</Box>
<Box flex={2}>
<Button.Group variant="outline" colorScheme="light" space={2}>
<Button startIcon={<Icon as={EvilIcons} name="sc-github" />}>
Connect Github
</Button>
<Button
startIcon={
<Icon as={AntDesign} name="google" color="red.400" size={5} />
}
>
Connect Google
</Button>
</Button.Group>
</Box>
</HStack>
</Box>
<Box py={4}>
<HStack space={6}>
<Box flex={1}></Box>
<Box flex={2}>
<Button.Group space={2}>
<Button _text={{ color: 'white' }}>Save Changes</Button>
<Button variant="outline" colorScheme="light">
Cancel
</Button>
</Button.Group>
</Box>
</HStack>
</Box>
</VStack>
);
};
================================================
FILE: example/storybook/stories/community-integrations/ReactHookForm/NumberInput.tsx
================================================
import {
VStack,
Button,
FormControl,
NumberInput,
NumberInputField,
NumberInputStepper,
NumberIncrementStepper,
NumberDecrementStepper,
} from 'native-base';
import React from 'react';
import { useForm, Controller } from 'react-hook-form';
interface IFormInput {
version: boolean;
}
export const Example = () => {
const { control, handleSubmit, errors } = useForm<IFormInput>();
const onSubmit = (data: IFormInput) => {
console.log('submiting with ', data);
};
return (
<VStack width="80%" space={4}>
<FormControl isRequired isInvalid={'version' in errors}>
<FormControl.Label>Current Native Base Version:</FormControl.Label>
<Controller
control={control}
render={({ onChange, value }) => (
<NumberInput
onChange={(val: any) => onChange(val)}
defaultValue={value}
>
<NumberInputField />
<NumberInputStepper>
<NumberIncrementStepper />
<NumberDecrementStepper />
</NumberInputStepper>
</NumberInput>
)}
name="version"
rules={{ required: 'Field is required' }}
defaultValue={3}
/>
<FormControl.ErrorMessage>
{errors.version?.message}
</FormControl.ErrorMessage>
</FormControl>
<Button onPress={handleSubmit(onSubmit)} colorScheme="pink">
Submit
</Button>
</VStack>
);
};
================================================
FILE: example/storybook/stories/community-integrations/ReactHookForm/PinInput.tsx
================================================
import { VStack, Button, FormControl, PinInput } from 'native-base';
import React from 'react';
import { useForm, Controller } from 'react-hook-form';
interface IFormInput {
otp: string;
}
export const Example = () => {
const { control, handleSubmit, errors } = useForm<IFormInput>();
const onSubmit = (data: IFormInput) => {
console.log('submiting with ', data);
};
return (
<VStack width="80%" space={4}>
<FormControl isRequired isInvalid={'otp' in errors}>
<FormControl.Label>OTP:</FormControl.Label>
<Controller
control={control}
render={({ onChange, value }) => (
<PinInput onChange={(val: any) => onChange(val)} value={value}>
<PinInput.Field />
<PinInput.Field />
<PinInput.Field />
<PinInput.Field />
</PinInput>
)}
name="otp"
rules={{ required: 'Field is required', minLength: 4, maxLength: 4 }}
/>
<FormControl.ErrorMessage>
{errors.otp?.message}
</FormControl.ErrorMessage>
</FormControl>
<Button onPress={handleSubmit(onSubmit)} colorScheme="pink">
Submit
</Button>
</VStack>
);
};
================================================
FILE: example/storybook/stories/community-integrations/ReactHookForm/RadioAndCheckbox.tsx
================================================
import {
VStack,
Button,
FormControl,
Radio,
Checkbox,
Text,
Icon,
} from 'native-base';
import React from 'react';
import { useForm, Controller } from 'react-hook-form';
import { MaterialCommunityIcons } from '@expo/vector-icons';
interface IFormInput {
hobbies: string;
gender: number;
}
export const Example = () => {
const { control, handleSubmit, errors } = useForm<IFormInput>();
const onSubmit = (data: IFormInput) => {
console.log('submiting with ', data);
};
return (
<VStack width="80%" space={4}>
<FormControl isRequired isInvalid={'hobbies' in errors}>
<FormControl.Label>Hobbies</FormControl.Label>
<Controller
control={control}
render={({ onChange }) => (
<Checkbox.Group
onChange={(values) => {
onChange(values);
}}
flexDirection="row"
>
<Checkbox
value="dart"
colorScheme="orange"
icon={<Icon as={MaterialCommunityIcons} name="bullseye" />}
>
<Text mx={2}>Darts</Text>
</Checkbox>
<Checkbox
value="movie"
colorScheme="dark"
icon={<Icon as={MaterialCommunityIcons} name="bat" />}
>
<Text mx={2}>Movie</Text>
</Checkbox>
<Checkbox
colorScheme="red"
value="camping"
icon={<Icon as={MaterialCommunityIcons} name="campfire" />}
>
<Text mx={2}>Camping</Text>
</Checkbox>
<Checkbox
value="chess"
colorScheme="blue"
icon={<Icon as={MaterialCommunityIcons} name="chess-knight" />}
>
<Text mx={2}>Chess</Text>
</Checkbox>
</Checkbox.Group>
)}
rules={{ required: 'Atleast 1 hobbie needed' }}
name="hobbies"
defaultValue=""
/>
<FormControl.ErrorMessage>
{errors.hobbies?.message}
</FormControl.ErrorMessage>
</FormControl>
<FormControl isRequired isInvalid={'gender' in errors}>
<FormControl.Label>Gender</FormControl.Label>
<Controller
control={control}
render={({ onChange }) => (
<Radio.Group
name="gender"
flexDirection="row"
onChange={(val) => onChange(val)}
>
<Radio value="male" colorScheme="blue">
<Text mx={2}>Male</Text>
</Radio>
<Radio value="female" colorScheme="pink">
<Text mx={2}>Female</Text>
</Radio>
</Radio.Group>
)}
name="gender"
rules={{ required: 'Gender is required' }}
/>
<FormControl.ErrorMessage>
{errors.gender?.message}
</FormControl.ErrorMessage>
</FormControl>
<Button onPress={handleSubmit(onSubmit)} colorScheme="pink">
Submit
</Button>
</VStack>
);
};
================================================
FILE: example/storybook/stories/community-integrations/ReactHookForm/Select.tsx
================================================
import { VStack, Button, FormControl, Select, Icon } from 'native-base';
import React from 'react';
import { useForm, Controller } from 'react-hook-form';
import { MaterialIcons } from '@expo/vector-icons';
interface IFormInput {
language: number;
}
export const Example = () => {
const { control, handleSubmit, errors } = useForm<IFormInput>();
const onSubmit = (data: IFormInput) => {
console.log('submiting with ', data);
};
return (
<VStack width="80%" space={4}>
<FormControl isRequired isInvalid={'language' in errors}>
<FormControl.Label>Fav language:</FormControl.Label>
<Controller
control={control}
render={({ onChange, value }) => (
<Select
placeholder="Pick language"
selectedValue={value}
width={150}
onValueChange={(itemValue: string) => {
onChange(itemValue);
}}
dropdownOpenIcon={
<Icon as={MaterialIcons} name="arrow-drop-up" size={6} />
}
dropdownCloseIcon={
<Icon as={MaterialIcons} name="arrow-drop-down" size={6} />
}
>
<Select.Item label="JavaScript" value="js" />
<Select.Item label="TypeScript" value="ts" />
<Select.Item label="Java" value="java" />
</Select>
)}
name="language"
rules={{ required: 'Field is required' }}
defaultValue="js"
/>
<FormControl.ErrorMessage>
{errors.language?.message}
</FormControl.ErrorMessage>
</FormControl>
<Button onPress={handleSubmit(onSubmit)} colorScheme="pink">
Submit
</Button>
</VStack>
);
};
================================================
FILE: example/storybook/stories/community-integrations/ReactHookForm/Slider.tsx
================================================
import { VStack, Button, FormControl, Slider } from 'native-base';
import React from 'react';
import { useForm, Controller } from 'react-hook-form';
interface IFormInput {
like: number;
}
export const Example = () => {
const { control, handleSubmit, errors } = useForm<IFormInput>();
const onSubmit = (data: IFormInput) => {
console.log('submiting with ', data);
};
return (
<VStack width="80%" space={4}>
<FormControl isRequired isInvalid={'like' in errors}>
<FormControl.Label>Amount you like NativeBase</FormControl.Label>
<Controller
control={control}
render={({ onChange, value }) => (
<Slider onChange={(val) => onChange(val)} defaultValue={value}>
<Slider.Track>
<Slider.FilledTrack />
</Slider.Track>
<Slider.Thumb />
</Slider>
)}
name="like"
rules={{ required: 'Field is required', minLength: 3 }}
defaultValue={100}
/>
<FormControl.ErrorMessage>
{errors.like?.message}
</FormControl.ErrorMessage>
</FormControl>
<Button onPress={handleSubmit(onSubmit)} colorScheme="pink">
Submit
</Button>
</VStack>
);
};
================================================
FILE: example/storybook/stories/community-integrations/ReactHookForm/Switch.tsx
================================================
import { VStack, Button, FormControl, Switch } from 'native-base';
import React from 'react';
import { useForm, Controller } from 'react-hook-form';
interface IFormInput {
rememberMe: boolean;
}
export const Example = () => {
const { control, handleSubmit, errors } = useForm<IFormInput>();
const onSubmit = (data: IFormInput) => {
console.log('submiting with ', data);
};
return (
<VStack width="80%" space={4}>
<FormControl isInvalid={'rememberMe' in errors}>
<FormControl.Label>Remenber me:</FormControl.Label>
<Controller
control={control}
render={({ onChange, value }) => (
<Switch
onToggle={(val: boolean) => onChange(val)}
isChecked={value}
/>
)}
name="rememberMe"
defaultValue={true}
/>
<FormControl.ErrorMessage>
{errors.rememberMe?.message}
</FormControl.ErrorMessage>
</FormControl>
<Button onPress={handleSubmit(onSubmit)} colorScheme="pink">
Submit
</Button>
</VStack>
);
};
================================================
FILE: example/storybook/stories/community-integrations/ReactHookForm/Textarea.tsx
================================================
import { VStack, Button, FormControl, TextArea } from 'native-base';
import React from 'react';
import { useForm, Controller } from 'react-hook-form';
interface IFormInput {
thought: string;
}
export const Example = () => {
const { control, handleSubmit, errors } = useForm<IFormInput>();
const onSubmit = (data: IFormInput) => {
console.log('submiting with ', data);
};
return (
<VStack width="80%" space={4}>
<FormControl isRequired isInvalid={'thought' in errors}>
<FormControl.Label>What do you think?</FormControl.Label>
<Controller
control={control}
render={({ onChange, value }) => (
<TextArea
placeholder="TextArea"
onChangeText={(val) => onChange(val)}
defaultValue={value}
/>
)}
name="thought"
rules={{ required: 'Field is required', minLength: 3 }}
defaultValue="I love Nativebase."
/>
<FormControl.ErrorMessage>
{errors.thought?.message}
</FormControl.ErrorMessage>
</FormControl>
<Button onPress={handleSubmit(onSubmit)} colorScheme="pink">
Submit
</Button>
</VStack>
);
};
================================================
FILE: example/storybook/stories/community-integrations/ReactHookForm/Usage.tsx
================================================
import { VStack, Input, Button, FormControl } from 'native-base';
import React from 'react';
import { useForm, Controller } from 'react-hook-form';
interface IFormInput {
firstName: string;
lastName: string;
age: number;
}
export const Example = () => {
const { control, handleSubmit, errors } = useForm<IFormInput>();
const onSubmit = (data: IFormInput) => {
console.log('submiting with ', data);
};
return (
<VStack width="80%" space={4}>
<FormControl isRequired isInvalid={'firstName' in errors}>
<FormControl.Label>First Name</FormControl.Label>
<Controller
control={control}
render={({ onChange, onBlur, value }) => (
<Input
onBlur={onBlur}
placeholder="John"
onChangeText={(val) => onChange(val)}
value={value}
/>
)}
name="firstName"
rules={{ required: 'Field is required', minLength: 3 }}
defaultValue=""
/>
<FormControl.ErrorMessage>
{errors.firstName?.message}
</FormControl.ErrorMessage>
</FormControl>
<FormControl isInvalid={'lastName' in errors}>
<FormControl.Label>Last Name</FormControl.Label>
<Controller
control={control}
render={({ onChange, onBlur, value }) => (
<Input
onBlur={onBlur}
placeholder="Doe"
onChangeText={(val) => onChange(val)}
value={value}
/>
)}
name="lastName"
defaultValue=""
/>
<FormControl.ErrorMessage>
{errors.lastName?.message}
</FormControl.ErrorMessage>
</FormControl>
<FormControl isRequired isInvalid={'age' in errors}>
<FormControl.Label>Age</FormControl.Label>
<Controller
control={control}
render={({ onChange, onBlur, value }) => (
<Input
onBlur={onBlur}
placeholder="24"
onChangeText={(val) => onChange(val)}
value={value}
/>
)}
name="age"
rules={{ min: 18, required: 'Age is required' }}
defaultValue=""
/>
<FormControl.ErrorMessage>
{errors.age?.type === 'required'
? errors.age?.message
: errors.age?.type === 'min' ?? 'Under age'}
</FormControl.ErrorMessage>
</FormControl>
<Button onPress={handleSubmit(onSubmit)} colorScheme="pink">
Submit
</Button>
</VStack>
);
};
================================================
FILE: example/storybook/stories/community-integrations/ReactHookForm/index.tsx
================================================
import React from 'react';
import { storiesOf } from '@storybook/react-native';
import { withKnobs } from '@storybook/addon-knobs';
import Wrapper from './../../components/Wrapper';
import { Example as RadioAndCheckbox } from './RadioAndCheckbox';
import { Example as PinInput } from './PinInput';
import { Example as Textarea } from './Textarea';
import { Example as Select } from './Select';
import { Example as NumberInput } from './NumberInput';
import { Example as Switch } from './Switch';
import { Example as Slider } from './Slider';
import { Example as DemoForm } from './DemoForm';
import { Example as Usage } from './Usage';
storiesOf('React Hook Form', module)
.addDecorator(withKnobs)
.addDecorator((getStory: any) => <Wrapper>{getStory()}</Wrapper>)
.add('Usage', () => <Usage />)
.add('DemoForm', () => <DemoForm />) // Todo: Remove to somewhere else
.add('Radio And Checkbox', () => <RadioAndCheckbox />)
.add('Select', () => <Select />)
.add('Slider', () => <Slider />)
.add('Textarea', () => <Textarea />)
.add('Switch', () => <Switch />)
.add('NumberInput', () => <NumberInput />)
.add('PinInput', () => <PinInput />);
================================================
FILE: example/storybook/stories/components/Allcomponents.tsx
================================================
//@ts-nocheck
//uncomment above line to test typing of components
import {
Badge,
IconButton,
Alert,
AspectRatio,
Avatar,
Breadcrumb,
Card,
Container,
Divider,
Kbd,
Progress,
Accordion,
FormControl,
Center,
Square,
Circle,
Fade,
ScaleFade,
PresenceTransition,
Slide,
SlideFade,
Popover,
AlertDialog,
Menu,
SimpleGrid,
Actionsheet,
Fab,
Modal,
Backdrop,
Tooltip,
} from 'native-base';
import {
Text,
Checkbox,
Radio,
Hidden,
Button,
Column,
Row,
Box,
Stack,
VStack,
HStack,
ZStack,
Slider,
Icon,
Input,
InputGroup,
InputLeftAddon,
InputRightAddon,
Image,
Spinner,
Heading,
Flex,
Switch,
TextArea,
Link,
Select,
Pressable,
Overlay,
Skeleton,
} from 'native-base';
export const Example = () => {
return (
<>
<Input aaa></Input>
<Badge sss="1"></Badge>
<IconButton sss="1"></IconButton>
<Alert sss="1"></Alert>
<AspectRatio sss="1"></AspectRatio>
<Avatar sss="1"></Avatar>
<Breadcrumb sss="1"></Breadcrumb>
<Card sss="1"></Card>
<Container sss="1"></Container>
<Divider sss="1"></Divider>
<Kbd sss="1"></Kbd>
<Progress sss="1"></Progress>
<Accordion sss="1"></Accordion>
<Skeleton sss="1"></Skeleton>
<FormControl sss="1"></FormControl>
<Center sss="1"></Center>
<Square sss="1"></Square>
<Circle sss="1"></Circle>
<Fade sss="1"></Fade>
<ScaleFade sss="1"></ScaleFade>
<PresenceTransition sss="1"></PresenceTransition>
<Slide sss="1"></Slide>
<SlideFade sss="1"></SlideFade>
<Popover sss="1" trigger={() => <Box sss="1"></Box>}>
<Box sss="1"></Box>
</Popover>
<AlertDialog sss="1"></AlertDialog>
<Menu sss="1" trigger={() => <Box></Box>}></Menu>
<SimpleGrid sss="1"></SimpleGrid>
<Actionsheet sss="1"></Actionsheet>
<Fab sss="1"></Fab>
<Modal sss="1"></Modal>
<Backdrop sss="1"></Backdrop>
<Tooltip label="hell" sss="1">
Hello
</Tooltip>
<Text sss="1"></Text>
<Checkbox sss="1" value="1"></Checkbox>
<Radio sss="1" value="1"></Radio>
<Hidden sss="1">
<Box sss="1"></Box>
</Hidden>
<Button sss="1"></Button>
<Column sss="1"></Column>
<Row sss="1"></Row>
<Box sss="1"></Box>
<Stack sss="1"></Stack>
<VStack sss="1"></VStack>
<HStack sss="1"></HStack>
<ZStack sss="1"></ZStack>
<Slider sss="1"></Slider>
<Icon sss="1"></Icon>
<Input sss="1"></Input>
<InputGroup sss="1"></InputGroup>
<InputLeftAddon sss="1"></InputLeftAddon>
<InputRightAddon sss="1"></InputRightAddon>
<Image sss="1"></Image>
<Spinner sss="1"></Spinner>
<Heading sss="1"></Heading>
<Flex sss="1"></Flex>
<Switch sss="1"></Switch>
<TextArea sss="1"></TextArea>
<Link sss="1"></Link>
<Select sss="1"></Select>
<Pressable sss="1"></Pressable>
<Overlay sss="1"></Overlay>
</>
);
};
================================================
FILE: example/storybook/stories/components/Wrapper.tsx
================================================
import React from 'react';
import {
Box,
NativeBaseProvider,
useColorMode,
IconButton,
MoonIcon,
ColorMode,
useColorModeValue,
Tooltip,
SunIcon,
extendTheme,
Button,
Input,
} from 'native-base';
import type { StorageManager } from 'native-base';
import AsyncStorage from '@react-native-async-storage/async-storage';
import Config from '../../../nativebase.config';
const myTheme = extendTheme({
space: {
mySpace: '29px',
},
colors: {
blue1: {
'100': 'blue',
},
},
components: {
Link: {
sizes: {
mysize: 10,
},
},
Button: {
variants: {
myBtn: {
padding: 10,
},
myNewButton: ({ myPaddingX }: { myPaddingX: number }) => {
return {
padding: myPaddingX,
};
},
// myNewButton1: (props: any) => {
// return {
// padding: props.padding,
// };
// },
},
sizes: {
newsize: ({ mySize }: { mySize: number }) => {
return {
padding: mySize,
};
},
},
},
Input: {
variants: {
newsize: ({ mySize }: { mySize: number }) => {
return {
padding: mySize,
};
},
newsize1: (props: any) => {
return {
padding: props.padding,
};
},
},
sizes: {
'my-size': {
padding: 2,
},
},
},
Checkbox: {
sizes: {
myBtn: {
padding: 10,
},
myNewButton: ({ myPadding }: { myPadding: any }) => {
return {
padding: myPadding,
};
},
},
},
Box: {
variants: {
myBtn: {
padding: 10,
},
},
},
},
});
type MyThemeType = typeof myTheme;
declare module 'native-base' {
interface ICustomTheme extends MyThemeType {}
}
function MyWrapper({ children }: any) {
const { colorMode, toggleColorMode } = useColorMode();
const bgColor = useColorModeValue(`gray.50`, `gray.800`);
return (
<Box
flex={1}
px="3"
justifyContent="center"
alignItems="center"
bg={bgColor}
safeAreaY
>
<Tooltip
label={colorMode === 'dark' ? 'Enable light mode' : 'Enable dark mode'}
placement="bottom right"
openDelay={300}
closeOnClick={false}
>
<IconButton
position="absolute"
top={12}
right={8}
zIndex={4}
onPress={toggleColorMode}
icon={colorMode === 'dark' ? <SunIcon /> : <MoonIcon />}
size="lg"
/>
</Tooltip>
{children}
</Box>
);
}
export function RenderTestButton() {
const [state, setState] = React.useState(1);
return (
<Box style={{ position: 'absolute', top: 10, left: 20 }} m={2} bg="red.100">
<Input m={2} size="my-size" />
<Button
size=""
variant={'myNewButton'}
// title={state.toString()}
onPress={() => setState(state + 1)}
/>
</Box>
);
}
export default ({ children, theme }: any) => {
const colorModeManager: StorageManager = {
get: async () => {
try {
const val = await AsyncStorage.getItem('@example-wrapper-mode');
return val === 'dark' ? 'dark' : 'light';
} catch (e) {
console.log(e);
return 'light';
}
},
set: async (value: ColorMode) => {
try {
await AsyncStorage.setItem('@example-wrapper-mode', value);
} catch (e) {
console.log(e);
}
},
};
return (
<NativeBaseProvider
theme={theme}
config={Config}
colorModeManager={colorModeManager}
initialWindowMetrics={{
frame: { x: 0, y: 0, width: 0, height: 0 },
insets: { top: 0, left: 0, right: 0, bottom: 0 },
}}
isSSR
>
<MyWrapper>{children}</MyWrapper>
</NativeBaseProvider>
);
};
================================================
FILE: example/storybook/stories/components/basic/FlatList/Basic.tsx
================================================
import React from 'react';
import {
Box,
FlatList,
Heading,
Avatar,
HStack,
VStack,
Text,
Spacer,
} from 'native-base';
export const Example = () => {
const data = [
{
id: 'bd7acbea-c1b1-46c2-aed5-3ad53abb28ba',
fullName: 'Aafreen Khan',
timeStamp: '12:47 PM',
recentText: 'Good Day!',
avatarUrl:
'https://images.pexels.com/photos/220453/pexels-photo-220453.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500',
},
{
id: '3ac68afc-c605-48d3-a4f8-fbd91aa97f63',
fullName: 'Sujitha Mathur',
timeStamp: '11:11 PM',
recentText: 'Cheer up, there!',
avatarUrl:
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTyEaZqT3fHeNrPGcnjLLX1v_W4mvBlgpwxnA&usqp=CAU',
},
{
id: '58694a0f-3da1-471f-bd96-145571e29d72',
fullName: 'Anci Barroco',
timeStamp: '6:22 PM',
recentText: 'Good Day!',
avatarUrl: 'https://miro.medium.com/max/1400/0*0fClPmIScV5pTLoE.jpg',
},
{
id: '68694a0f-3da1-431f-bd56-142371e29d
gitextract__kwg0xgp/ ├── .editorconfig ├── .eslintrc.json ├── .github/ │ ├── ISSUE_TEMPLATE/ │ │ ├── bug_report.yml │ │ ├── config.yml │ │ └── feature_request.yml │ ├── auto_assign.yml │ ├── pull_request_template.md │ └── workflows/ │ └── build.yml ├── .gitignore ├── .npmignore ├── .nvmrc ├── .prettierrc ├── .vscode/ │ └── settings.json ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── RNBareExample/ │ ├── .buckconfig │ ├── .eslintrc.js │ ├── .gitattributes │ ├── .gitignore │ ├── .prettierrc.js │ ├── .watchmanconfig │ ├── App.tsx │ ├── _editorconfig │ ├── android/ │ │ ├── app/ │ │ │ ├── _BUCK │ │ │ ├── build.gradle │ │ │ ├── build_defs.bzl │ │ │ ├── debug.keystore │ │ │ ├── proguard-rules.pro │ │ │ └── src/ │ │ │ ├── debug/ │ │ │ │ ├── AndroidManifest.xml │ │ │ │ └── java/ │ │ │ │ └── com/ │ │ │ │ └── rnbareexample/ │ │ │ │ └── ReactNativeFlipper.java │ │ │ └── main/ │ │ │ ├── AndroidManifest.xml │ │ │ ├── java/ │ │ │ │ └── com/ │ │ │ │ └── rnbareexample/ │ │ │ │ ├── MainActivity.java │ │ │ │ └── MainApplication.java │ │ │ └── res/ │ │ │ └── values/ │ │ │ ├── strings.xml │ │ │ └── styles.xml │ │ ├── build.gradle │ │ ├── gradle/ │ │ │ └── wrapper/ │ │ │ ├── gradle-wrapper.jar │ │ │ └── gradle-wrapper.properties │ │ ├── gradle.properties │ │ ├── gradlew │ │ ├── gradlew.bat │ │ └── settings.gradle │ ├── app.json │ ├── babel.config.js │ ├── index.js │ ├── ios/ │ │ ├── Podfile │ │ ├── RNBareExample/ │ │ │ ├── AppDelegate.h │ │ │ ├── AppDelegate.m │ │ │ ├── Images.xcassets/ │ │ │ │ ├── AppIcon.appiconset/ │ │ │ │ │ └── Contents.json │ │ │ │ └── Contents.json │ │ │ ├── Info.plist │ │ │ ├── LaunchScreen.storyboard │ │ │ └── main.m │ │ ├── RNBareExample.xcodeproj/ │ │ │ ├── project.pbxproj │ │ │ └── xcshareddata/ │ │ │ └── xcschemes/ │ │ │ └── RNBareExample.xcscheme │ │ ├── RNBareExample.xcworkspace/ │ │ │ ├── contents.xcworkspacedata │ │ │ └── xcshareddata/ │ │ │ └── IDEWorkspaceChecks.plist │ │ └── RNBareExampleTests/ │ │ ├── Info.plist │ │ └── RNBareExampleTests.m │ ├── metro.config.js │ ├── package.json │ ├── react-native.config.js │ └── tsconfig.json ├── babel.config.js ├── cli.js ├── example/ │ ├── .eslintrc.json │ ├── .nvmrc │ ├── App.tsx │ ├── __mocks__/ │ │ ├── @react-native-async-storage/ │ │ │ └── async-storage.js │ │ └── globalMock.js │ ├── app.json │ ├── babel.config.js │ ├── jest-android.config.js │ ├── jest-ios.config.js │ ├── jest.config.js │ ├── metro.config.js │ ├── nativebase.config.ts │ ├── package.json │ ├── patches/ │ │ └── core-js+3.6.5.patch │ ├── scripts/ │ │ └── test.sh │ ├── storybook/ │ │ ├── addons.ts │ │ ├── index.ts │ │ ├── rn-addons.ts │ │ └── stories/ │ │ ├── community-integrations/ │ │ │ ├── Formik/ │ │ │ │ ├── Basic.tsx │ │ │ │ └── index.tsx │ │ │ └── ReactHookForm/ │ │ │ ├── DemoForm.tsx │ │ │ ├── NumberInput.tsx │ │ │ ├── PinInput.tsx │ │ │ ├── RadioAndCheckbox.tsx │ │ │ ├── Select.tsx │ │ │ ├── Slider.tsx │ │ │ ├── Switch.tsx │ │ │ ├── Textarea.tsx │ │ │ ├── Usage.tsx │ │ │ └── index.tsx │ │ ├── components/ │ │ │ ├── Allcomponents.tsx │ │ │ ├── Wrapper.tsx │ │ │ ├── basic/ │ │ │ │ ├── FlatList/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── KeyboardAvoidingView/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── Kitchensink-Basic.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── ScrollView/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── SectionList/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── StatusBar/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ └── index.tsx │ │ │ │ └── View/ │ │ │ │ ├── Basic.tsx │ │ │ │ └── index.tsx │ │ │ ├── composites/ │ │ │ │ ├── Accordion/ │ │ │ │ │ ├── AccessingInternalState.tsx │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── DefaultIndex.tsx │ │ │ │ │ ├── ExpandedStyle.tsx │ │ │ │ │ ├── Multiple.tsx │ │ │ │ │ ├── Playground.tsx │ │ │ │ │ ├── Toggle.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Actionsheet/ │ │ │ │ │ ├── Composition.tsx │ │ │ │ │ ├── CustomBackdrop.tsx │ │ │ │ │ ├── DisableOverlay.tsx │ │ │ │ │ ├── Icon.tsx │ │ │ │ │ ├── Usage.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Alert/ │ │ │ │ │ ├── action.tsx │ │ │ │ │ ├── basic.tsx │ │ │ │ │ ├── colorScheme.tsx │ │ │ │ │ ├── composition.tsx │ │ │ │ │ ├── index.tsx │ │ │ │ │ ├── knobEnabled.tsx │ │ │ │ │ ├── status.tsx │ │ │ │ │ ├── usage.tsx │ │ │ │ │ └── variant.tsx │ │ │ │ ├── AlertDialog/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── Transition.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── AppBar/ │ │ │ │ │ ├── AppBarExamples.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── AspectRatio/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── EmbedImage.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Avatar/ │ │ │ │ │ ├── AvatarBadge.tsx │ │ │ │ │ ├── AvatarGroup.tsx │ │ │ │ │ ├── Fallback.tsx │ │ │ │ │ ├── index.tsx │ │ │ │ │ ├── knobEnabled.tsx │ │ │ │ │ ├── size.tsx │ │ │ │ │ └── usage.tsx │ │ │ │ ├── Badge/ │ │ │ │ │ ├── color.tsx │ │ │ │ │ ├── composition.tsx │ │ │ │ │ ├── icons.tsx │ │ │ │ │ ├── index.tsx │ │ │ │ │ ├── knobEnabled.tsx │ │ │ │ │ ├── usage.tsx │ │ │ │ │ └── variants.tsx │ │ │ │ ├── Breadcrumb/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── Collapsible.tsx │ │ │ │ │ ├── ComponentSeparator.tsx │ │ │ │ │ ├── Composition.tsx │ │ │ │ │ ├── Separators.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Card/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Center/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── SquareCircle.tsx │ │ │ │ │ ├── WithIcons.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── CircularProgress/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── ColorScheme.tsx │ │ │ │ │ ├── Colors.tsx │ │ │ │ │ ├── Indeterminate.tsx │ │ │ │ │ ├── Label.tsx │ │ │ │ │ ├── MinMax.tsx │ │ │ │ │ ├── Sizes.tsx │ │ │ │ │ ├── Thickness.tsx │ │ │ │ │ ├── TrackColor.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── CloseButton/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── Sizes.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Code/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── colors.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Collapse/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── Callback.tsx │ │ │ │ │ ├── Duration.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Container/ │ │ │ │ │ ├── Playground.tsx │ │ │ │ │ ├── centeringChildren.tsx │ │ │ │ │ ├── index.tsx │ │ │ │ │ └── usage.tsx │ │ │ │ ├── Divider/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── Composition.tsx │ │ │ │ │ ├── Orientation.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Drawer/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Fab/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── CustomPosition.tsx │ │ │ │ │ ├── DocsBasic.tsx │ │ │ │ │ ├── DocsCustomPosition.tsx │ │ │ │ │ ├── DocsPlacement.tsx │ │ │ │ │ ├── Kitchensink-Basic.tsx │ │ │ │ │ ├── Kitchensink-CustomPosition.tsx │ │ │ │ │ ├── Kitchensink-Placement.tsx │ │ │ │ │ ├── Placement.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── FormControl/ │ │ │ │ │ ├── CustomStyle.tsx │ │ │ │ │ ├── Playground.tsx │ │ │ │ │ ├── Usage.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── IconButton/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── SVGIcon.tsx │ │ │ │ │ ├── Sizes.tsx │ │ │ │ │ ├── Variant.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Kbd/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Menu/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── Group.tsx │ │ │ │ │ ├── MenuOptionsGroup.tsx │ │ │ │ │ ├── MenuPositions.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Modal/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── CustomBackdrop.tsx │ │ │ │ │ ├── ModalPlacement.tsx │ │ │ │ │ ├── ModalRefEg.tsx │ │ │ │ │ ├── ModalWithAvoidKeyboard.tsx │ │ │ │ │ ├── MultipleModal.tsx │ │ │ │ │ ├── Size.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── NumberInput/ │ │ │ │ │ ├── Combination.tsx │ │ │ │ │ ├── DefaultValue.tsx │ │ │ │ │ ├── FormControlled.tsx │ │ │ │ │ ├── MinMax.tsx │ │ │ │ │ ├── Playground.tsx │ │ │ │ │ ├── Steps.tsx │ │ │ │ │ ├── Usage.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── PinInput/ │ │ │ │ │ ├── DefaultValue.tsx │ │ │ │ │ ├── FormControlled.tsx │ │ │ │ │ ├── ManageFocus.tsx │ │ │ │ │ ├── Placeholder.tsx │ │ │ │ │ ├── Playground.tsx │ │ │ │ │ ├── Size.tsx │ │ │ │ │ ├── Usage.tsx │ │ │ │ │ ├── Variants.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Popover/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── PopoverPositions.tsx │ │ │ │ │ ├── RefEg.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Progress/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── ColorScheme.tsx │ │ │ │ │ ├── Composition.tsx │ │ │ │ │ ├── CustomBgColor.tsx │ │ │ │ │ ├── Flat.tsx │ │ │ │ │ ├── Sizes.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── SimpleGrid/ │ │ │ │ │ ├── MinWidthColumns.tsx │ │ │ │ │ ├── NumberOfColumns.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Skeleton/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── Color.tsx │ │ │ │ │ ├── Composition.tsx │ │ │ │ │ ├── FadeDuration.tsx │ │ │ │ │ ├── index.tsx │ │ │ │ │ └── isLoaded.tsx │ │ │ │ ├── Stat/ │ │ │ │ │ ├── Example.tsx │ │ │ │ │ ├── Indicator.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Tabs/ │ │ │ │ │ ├── Colors.tsx │ │ │ │ │ ├── Composition.tsx │ │ │ │ │ ├── Controlled.tsx │ │ │ │ │ ├── FittedTab.tsx │ │ │ │ │ ├── IconTabs.tsx │ │ │ │ │ ├── Size.tsx │ │ │ │ │ ├── TabAlignment.tsx │ │ │ │ │ ├── TabBarOnly.tsx │ │ │ │ │ ├── Usage.tsx │ │ │ │ │ ├── Variants.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Tag/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── Custom.tsx │ │ │ │ │ ├── Size.tsx │ │ │ │ │ ├── Variants.tsx │ │ │ │ │ ├── WithIcon.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── TextField/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── Invalid.tsx │ │ │ │ │ ├── Select.tsx │ │ │ │ │ ├── Textarea.tsx │ │ │ │ │ ├── WithIcon.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Toast/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── CloseToast.tsx │ │ │ │ │ ├── CustomComponent.tsx │ │ │ │ │ ├── CustomComponentWithCustomId.tsx │ │ │ │ │ ├── PreventDuplicate.tsx │ │ │ │ │ ├── StandaloneToast.tsx │ │ │ │ │ ├── StatusRecipies.tsx │ │ │ │ │ ├── ToastPositions.tsx │ │ │ │ │ ├── VariantRecipies.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Tooltip/ │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── CustomTooltip.tsx │ │ │ │ │ ├── TooltipPositions.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Transitions/ │ │ │ │ │ ├── Fade.tsx │ │ │ │ │ ├── ScaleFade.tsx │ │ │ │ │ ├── Slide.tsx │ │ │ │ │ ├── SlideComposition.tsx │ │ │ │ │ ├── SlideFade.tsx │ │ │ │ │ ├── SlideWrapped.tsx │ │ │ │ │ ├── Stagger.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Typeahead/ │ │ │ │ │ ├── UsingComponent.tsx │ │ │ │ │ ├── UsingComponentWithRenderItem.tsx │ │ │ │ │ ├── UsingControlledInput.tsx │ │ │ │ │ ├── UsingHook.tsx │ │ │ │ │ ├── UsingWithAPI.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── Wrap/ │ │ │ │ │ ├── AlignmentAlign.tsx │ │ │ │ │ ├── AlignmentJustify.tsx │ │ │ │ │ ├── Basic.tsx │ │ │ │ │ ├── Spacing.tsx │ │ │ │ │ └── index.tsx │ │ │ │ └── factory/ │ │ │ │ ├── index.tsx │ │ │ │ ├── modes.tsx │ │ │ │ ├── ref.tsx │ │ │ │ ├── theme.tsx │ │ │ │ └── usage.tsx │ │ │ ├── perf/ │ │ │ │ ├── NBButton.tsx │ │ │ │ ├── RNButton.tsx │ │ │ │ └── index.tsx │ │ │ └── primitives/ │ │ │ ├── Box/ │ │ │ │ ├── LinearGrad.tsx │ │ │ │ ├── WithRef.tsx │ │ │ │ ├── basic.tsx │ │ │ │ ├── composition-card.tsx │ │ │ │ ├── composition-card1.tsx │ │ │ │ ├── composition-card2.tsx │ │ │ │ ├── composition-card3.tsx │ │ │ │ ├── composition-shoes-card.tsx │ │ │ │ ├── composition.tsx │ │ │ │ └── index.tsx │ │ │ ├── Button/ │ │ │ │ ├── Composition.tsx │ │ │ │ ├── WithRef.tsx │ │ │ │ ├── basic.tsx │ │ │ │ ├── icons.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── loading.tsx │ │ │ │ ├── sizes.tsx │ │ │ │ └── variants.tsx │ │ │ ├── ButtonGroup/ │ │ │ │ ├── basic.tsx │ │ │ │ ├── direction.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── isAttached.tsx │ │ │ │ ├── sizes.tsx │ │ │ │ └── variants.tsx │ │ │ ├── Checkbox/ │ │ │ │ ├── FormControlled.tsx │ │ │ │ ├── basic.tsx │ │ │ │ ├── checkboxGroup.tsx │ │ │ │ ├── controlledCheckbox.tsx │ │ │ │ ├── customColor.tsx │ │ │ │ ├── customIcon.tsx │ │ │ │ ├── disabled.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── invalid.tsx │ │ │ │ ├── playground.tsx │ │ │ │ ├── size.tsx │ │ │ │ ├── uncontrolledCheckbox.tsx │ │ │ │ └── withRef.tsx │ │ │ ├── Column/ │ │ │ │ ├── Basic.tsx │ │ │ │ └── index.tsx │ │ │ ├── Flex/ │ │ │ │ ├── basic.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── spacer.tsx │ │ │ ├── HStack/ │ │ │ │ ├── basic.tsx │ │ │ │ └── index.tsx │ │ │ ├── Heading/ │ │ │ │ ├── Basic.tsx │ │ │ │ ├── Composition.tsx │ │ │ │ ├── OverridenStyle.tsx │ │ │ │ ├── Sizes.tsx │ │ │ │ ├── Truncate.tsx │ │ │ │ └── index.tsx │ │ │ ├── Hidden/ │ │ │ │ ├── basic.tsx │ │ │ │ ├── hiddenFromAndToBreakpoints.tsx │ │ │ │ ├── hiddenOnColorModes.tsx │ │ │ │ ├── hiddenOnPlatforms.tsx │ │ │ │ ├── hiddenOnlyOnBreakPoints.tsx │ │ │ │ └── index.tsx │ │ │ ├── Icon/ │ │ │ │ ├── AllIcons.tsx │ │ │ │ ├── Basic.tsx │ │ │ │ ├── CreateIcon.tsx │ │ │ │ ├── CustomIcon.tsx │ │ │ │ ├── Sizes.tsx │ │ │ │ ├── ThirdPartyIcons.tsx │ │ │ │ └── index.tsx │ │ │ ├── Image/ │ │ │ │ ├── Basic.tsx │ │ │ │ ├── BorderRadius.tsx │ │ │ │ ├── FallbackElement.tsx │ │ │ │ ├── FallbackSupport.tsx │ │ │ │ ├── Sizes.tsx │ │ │ │ ├── WithRef.tsx │ │ │ │ └── index.tsx │ │ │ ├── Input/ │ │ │ │ ├── Addons.tsx │ │ │ │ ├── Basic.tsx │ │ │ │ ├── Controlled.tsx │ │ │ │ ├── Elements.tsx │ │ │ │ ├── FormControlled.tsx │ │ │ │ ├── Masked.tsx │ │ │ │ ├── Size.tsx │ │ │ │ ├── Variant.tsx │ │ │ │ └── index.tsx │ │ │ ├── Link/ │ │ │ │ ├── Basic.tsx │ │ │ │ ├── CompositeLink.tsx │ │ │ │ ├── CustomOnPress.tsx │ │ │ │ ├── ExternalLink.tsx │ │ │ │ ├── UnderlineLink.tsx │ │ │ │ └── index.tsx │ │ │ ├── List/ │ │ │ │ ├── Basic.tsx │ │ │ │ ├── ListWithIcon.tsx │ │ │ │ ├── OrderedList.tsx │ │ │ │ ├── PressableList.tsx │ │ │ │ ├── StylingList.tsx │ │ │ │ ├── UnorderedList.tsx │ │ │ │ ├── VirtualizedList.tsx │ │ │ │ └── index.tsx │ │ │ ├── Pressable/ │ │ │ │ ├── Basic.tsx │ │ │ │ ├── Events.tsx │ │ │ │ └── index.tsx │ │ │ ├── Radio/ │ │ │ │ ├── controlledRadio.tsx │ │ │ │ ├── customColor.tsx │ │ │ │ ├── customIcon.tsx │ │ │ │ ├── disabled.tsx │ │ │ │ ├── formControlled.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── invalid.tsx │ │ │ │ ├── playground.tsx │ │ │ │ ├── size.tsx │ │ │ │ ├── uncontrolledRadio.tsx │ │ │ │ └── withRef.tsx │ │ │ ├── Row/ │ │ │ │ ├── Basic.tsx │ │ │ │ └── index.tsx │ │ │ ├── Select/ │ │ │ │ ├── Basic.tsx │ │ │ │ ├── FormControlled.tsx │ │ │ │ ├── SelectLongList.tsx │ │ │ │ └── index.tsx │ │ │ ├── Slider/ │ │ │ │ ├── Customized.tsx │ │ │ │ ├── FormControlled.tsx │ │ │ │ ├── Playground.tsx │ │ │ │ ├── Size.tsx │ │ │ │ ├── Value.tsx │ │ │ │ ├── Vertical.tsx │ │ │ │ ├── color.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── isDisabled.tsx │ │ │ │ ├── isReadOnly.tsx │ │ │ │ └── usage.tsx │ │ │ ├── Spinner/ │ │ │ │ ├── color.tsx │ │ │ │ ├── duration.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── size.tsx │ │ │ │ ├── usage.tsx │ │ │ │ ├── variant.tsx │ │ │ │ └── withKnob.tsx │ │ │ ├── Stack/ │ │ │ │ ├── basic.tsx │ │ │ │ ├── divider.tsx │ │ │ │ └── index.tsx │ │ │ ├── Switch/ │ │ │ │ ├── Accessibility.tsx │ │ │ │ ├── Basic.tsx │ │ │ │ ├── ColorSchemes.tsx │ │ │ │ ├── Sizes.tsx │ │ │ │ ├── SwitchBgColor.tsx │ │ │ │ ├── example.tsx │ │ │ │ └── index.tsx │ │ │ ├── Text/ │ │ │ │ ├── Basic.tsx │ │ │ │ ├── ChangingFontSize.tsx │ │ │ │ ├── Nested.tsx │ │ │ │ ├── Overriden.tsx │ │ │ │ ├── Truncated.tsx │ │ │ │ └── index.tsx │ │ │ ├── TextArea/ │ │ │ │ ├── basic.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── invalid.tsx │ │ │ │ ├── size-kitchensink.tsx │ │ │ │ ├── size.tsx │ │ │ │ └── value.tsx │ │ │ ├── VStack/ │ │ │ │ ├── basic.tsx │ │ │ │ └── index.tsx │ │ │ ├── View/ │ │ │ │ ├── Basic.tsx │ │ │ │ └── index.tsx │ │ │ └── ZStack/ │ │ │ ├── CenterStack.tsx │ │ │ ├── example.tsx │ │ │ └── index.tsx │ │ ├── examples/ │ │ │ ├── Signin.tsx │ │ │ ├── Signup.tsx │ │ │ ├── TodoApp.tsx │ │ │ └── index.tsx │ │ ├── hooks/ │ │ │ ├── useAccessibleColors/ │ │ │ │ ├── Basic.tsx │ │ │ │ └── index.tsx │ │ │ ├── useBreakpointValue/ │ │ │ │ ├── index.tsx │ │ │ │ └── usage.tsx │ │ │ ├── useClipboard/ │ │ │ │ ├── Usage.tsx │ │ │ │ └── index.tsx │ │ │ ├── useColorMode/ │ │ │ │ ├── Basic.tsx │ │ │ │ └── index.tsx │ │ │ ├── useColorModeValue/ │ │ │ │ ├── Basic.tsx │ │ │ │ └── index.tsx │ │ │ ├── useContrastText/ │ │ │ │ ├── Basic.tsx │ │ │ │ ├── Variations.tsx │ │ │ │ └── index.tsx │ │ │ ├── useDisclose/ │ │ │ │ ├── Usage.tsx │ │ │ │ └── index.tsx │ │ │ ├── useMediaQuery/ │ │ │ │ ├── index.tsx │ │ │ │ ├── max-height.tsx │ │ │ │ ├── min-width.tsx │ │ │ │ └── orientation.tsx │ │ │ ├── useSafeArea/ │ │ │ │ ├── Fixed.tsx │ │ │ │ ├── Flexible.tsx │ │ │ │ ├── Hook.tsx │ │ │ │ └── index.tsx │ │ │ └── useSx/ │ │ │ ├── Basic.tsx │ │ │ └── index.tsx │ │ ├── index.ts │ │ └── theme/ │ │ ├── Custom/ │ │ │ ├── Basic.tsx │ │ │ ├── Content.tsx │ │ │ ├── CustomizingBase.tsx │ │ │ ├── CustomizingComponents.tsx │ │ │ ├── CustomizingTheme.tsx │ │ │ ├── CustomizingVariant.tsx │ │ │ └── index.tsx │ │ ├── Mode/ │ │ │ ├── Basic.tsx │ │ │ ├── Content.tsx │ │ │ ├── DefaultMode.tsx │ │ │ ├── Persistence.tsx │ │ │ └── index.tsx │ │ └── Responsive/ │ │ ├── Basic.tsx │ │ ├── Demo.tsx │ │ ├── Direction.tsx │ │ ├── FontSize.tsx │ │ ├── More.tsx │ │ └── index.tsx │ ├── tests/ │ │ ├── storybook.test.js │ │ ├── storybook.test.js.snap.android │ │ ├── storybook.test.js.snap.ios │ │ ├── storybook.test.js.snap.node │ │ └── storybook.test.js.snap.web │ ├── tsconfig.json │ ├── web-build/ │ │ └── register-service-worker.js │ └── webpack.config.js ├── expo-example/ │ ├── App.tsx │ ├── app.json │ ├── babel.config.js │ ├── components/ │ │ ├── button.tsx │ │ └── index.ts │ ├── custompressablescreen.tsx │ ├── metro.config.js │ ├── nativebase.tsx │ ├── package.json │ ├── reactnativescreen.tsx │ ├── test-babel 11.40.04 AM.js │ ├── tsconfig.json │ └── webpack.config.js ├── next-example/ │ ├── .eslintrc.json │ ├── .gitignore │ ├── README.md │ ├── babel.config.js │ ├── next-env.d.ts │ ├── next.config.js │ ├── package.json │ ├── pages/ │ │ ├── _app.tsx │ │ ├── _document.js │ │ ├── api/ │ │ │ └── hello.ts │ │ └── index.tsx │ ├── styles/ │ │ ├── Home.module.css │ │ └── globals.css │ └── tsconfig.json ├── package.json ├── sonar-project.properties ├── src/ │ ├── components/ │ │ ├── basic/ │ │ │ ├── FlatList/ │ │ │ │ ├── FlatList.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── KeyboardAvoidingView/ │ │ │ │ ├── KeyboardAvoidingView.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── ScrollView/ │ │ │ │ ├── ScrollView.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── SectionList/ │ │ │ │ ├── SectionList.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── StatusBar/ │ │ │ │ ├── StatusBar.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── View/ │ │ │ │ ├── View.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ └── index.tsx │ │ ├── composites/ │ │ │ ├── Accordion/ │ │ │ │ ├── Accordion.tsx │ │ │ │ ├── AccordionDetails.tsx │ │ │ │ ├── AccordionIcon.tsx │ │ │ │ ├── AccordionItem.tsx │ │ │ │ ├── AccordionSummary.tsx │ │ │ │ ├── Context.ts │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Actionsheet/ │ │ │ │ ├── ActionSheetContext.ts │ │ │ │ ├── Actionsheet.tsx │ │ │ │ ├── ActionsheetContent.tsx │ │ │ │ ├── ActionsheetFooter.tsx │ │ │ │ ├── ActionsheetHeader.tsx │ │ │ │ ├── ActionsheetItem.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── Alert/ │ │ │ │ ├── Alert.tsx │ │ │ │ ├── AlertIcon.tsx │ │ │ │ ├── Context.ts │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── AlertDialog/ │ │ │ │ ├── AlertDialog.tsx │ │ │ │ ├── AlertDialogBody.tsx │ │ │ │ ├── AlertDialogCloseButton.tsx │ │ │ │ ├── AlertDialogContent.tsx │ │ │ │ ├── AlertDialogFooter.tsx │ │ │ │ ├── AlertDialogHeader.tsx │ │ │ │ ├── Context.ts │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── AppBar/ │ │ │ │ ├── AppBar.tsx │ │ │ │ ├── AppBarContent.tsx │ │ │ │ ├── AppBarLeft.tsx │ │ │ │ ├── AppBarRight.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── types.tsx │ │ │ │ └── utils.ts │ │ │ ├── AspectRatio/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Avatar/ │ │ │ │ ├── Avatar.tsx │ │ │ │ ├── Badge.tsx │ │ │ │ ├── Group.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── Backdrop/ │ │ │ │ └── index.tsx │ │ │ ├── Badge/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── Breadcrumb/ │ │ │ │ ├── Breadcrumb.tsx │ │ │ │ ├── BreadcrumbIcon.tsx │ │ │ │ ├── BreadcrumbItem.tsx │ │ │ │ ├── BreadcrumbLink.tsx │ │ │ │ ├── BreadcrumbText.tsx │ │ │ │ ├── Context.ts │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Card/ │ │ │ │ ├── Card.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Center/ │ │ │ │ ├── Center.tsx │ │ │ │ ├── Circle.tsx │ │ │ │ ├── Square.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── CircularProgress/ │ │ │ │ ├── CircularProgress.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Code/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Collapse/ │ │ │ │ └── index.tsx │ │ │ ├── Container/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── Divider/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Drawer/ │ │ │ │ └── index.tsx │ │ │ ├── Fab/ │ │ │ │ ├── Fab.tsx │ │ │ │ ├── FabItem.tsx │ │ │ │ ├── FabList.tsx │ │ │ │ ├── context.ts │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── FormControl/ │ │ │ │ ├── FormControl.tsx │ │ │ │ ├── FormControlErrorMessage.tsx │ │ │ │ ├── FormControlHelperText.tsx │ │ │ │ ├── FormControlLabel.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── test/ │ │ │ │ │ └── FormControl.test.tsx │ │ │ │ ├── types.tsx │ │ │ │ └── useFormControl.tsx │ │ │ ├── IconButton/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── KBD/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Menu/ │ │ │ │ ├── Menu.tsx │ │ │ │ ├── MenuContext.ts │ │ │ │ ├── MenuGroup.tsx │ │ │ │ ├── MenuItem.tsx │ │ │ │ ├── MenuItemOption.tsx │ │ │ │ ├── MenuOptionGroup.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── types.ts │ │ │ │ └── useMenu.tsx │ │ │ ├── Modal/ │ │ │ │ ├── Context.ts │ │ │ │ ├── Modal.tsx │ │ │ │ ├── ModalBody.tsx │ │ │ │ ├── ModalCloseButton.tsx │ │ │ │ ├── ModalContent.tsx │ │ │ │ ├── ModalFooter.tsx │ │ │ │ ├── ModalHeader.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── NumberInput/ │ │ │ │ ├── Context.ts │ │ │ │ ├── NumberDecrementStepper.tsx │ │ │ │ ├── NumberIncrementStepper.tsx │ │ │ │ ├── NumberInput.tsx │ │ │ │ ├── NumberInputField.tsx │ │ │ │ ├── NumberInputStepper.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── PinInput/ │ │ │ │ ├── Context.ts │ │ │ │ ├── PinInput.tsx │ │ │ │ ├── PinInputField.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── Popover/ │ │ │ │ ├── Popover.tsx │ │ │ │ ├── PopoverArrow.tsx │ │ │ │ ├── PopoverBody.tsx │ │ │ │ ├── PopoverCloseButton.tsx │ │ │ │ ├── PopoverContent.tsx │ │ │ │ ├── PopoverContext.ts │ │ │ │ ├── PopoverFooter.tsx │ │ │ │ ├── PopoverHeader.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Popper/ │ │ │ │ ├── Popper.tsx │ │ │ │ ├── index.ts │ │ │ │ └── types.ts │ │ │ ├── Progress/ │ │ │ │ └── index.tsx │ │ │ ├── SimpleGrid/ │ │ │ │ ├── SimpleGrid.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Skeleton/ │ │ │ │ ├── Skeleton.tsx │ │ │ │ ├── SkeletonText.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── Stat/ │ │ │ │ └── index.tsx │ │ │ ├── Tabs/ │ │ │ │ ├── Context.ts │ │ │ │ ├── Tab.tsx │ │ │ │ ├── TabBar.tsx │ │ │ │ ├── TabIcon.tsx │ │ │ │ ├── TabView.tsx │ │ │ │ ├── TabViews.tsx │ │ │ │ ├── Tabs.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── Tag/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── TextField/ │ │ │ │ ├── TextField.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── Toast/ │ │ │ │ ├── Toast.tsx │ │ │ │ ├── ToastDummy.tsx │ │ │ │ ├── index.ts │ │ │ │ ├── types.ts │ │ │ │ └── utils.ts │ │ │ ├── Tooltip/ │ │ │ │ ├── Tooltip.tsx │ │ │ │ ├── index.ts │ │ │ │ └── types.ts │ │ │ ├── Transitions/ │ │ │ │ ├── Fade.tsx │ │ │ │ ├── PresenceTransition.tsx │ │ │ │ ├── ScaleFade.tsx │ │ │ │ ├── Slide.tsx │ │ │ │ ├── SlideFade.tsx │ │ │ │ ├── Stagger.tsx │ │ │ │ ├── Transition.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── Typeahead/ │ │ │ │ ├── Typeahead.tsx │ │ │ │ ├── index.ts │ │ │ │ ├── types.ts │ │ │ │ └── useTypeahead/ │ │ │ │ ├── index.ts │ │ │ │ ├── reducer.tsx │ │ │ │ ├── types.tsx │ │ │ │ ├── useTypeahead.ts │ │ │ │ └── utils.ts │ │ │ ├── Wrap/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ └── index.ts │ │ ├── primitives/ │ │ │ ├── Box/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Button/ │ │ │ │ ├── Button.tsx │ │ │ │ ├── ButtonGroup.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Checkbox/ │ │ │ │ ├── Checkbox.tsx │ │ │ │ ├── Checkbox.web.tsx │ │ │ │ ├── CheckboxGroup.tsx │ │ │ │ ├── SizedIcon.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── test/ │ │ │ │ │ └── checkbox.test.tsx │ │ │ │ └── types.tsx │ │ │ ├── Column/ │ │ │ │ └── index.tsx │ │ │ ├── Flex/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── GridItem/ │ │ │ │ └── props.ts │ │ │ ├── Heading/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Hidden/ │ │ │ │ ├── HiddenSSR.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Icon/ │ │ │ │ ├── Icon.tsx │ │ │ │ ├── Icons/ │ │ │ │ │ ├── Add.tsx │ │ │ │ │ ├── Arrow.tsx │ │ │ │ │ ├── Check.tsx │ │ │ │ │ ├── Chevron.tsx │ │ │ │ │ ├── Circle.tsx │ │ │ │ │ ├── Close.tsx │ │ │ │ │ ├── Delete.tsx │ │ │ │ │ ├── Favourite.tsx │ │ │ │ │ ├── Hamburger.tsx │ │ │ │ │ ├── Info.tsx │ │ │ │ │ ├── Minus.tsx │ │ │ │ │ ├── Moon.tsx │ │ │ │ │ ├── Play.tsx │ │ │ │ │ ├── Question.tsx │ │ │ │ │ ├── Search.tsx │ │ │ │ │ ├── Share.tsx │ │ │ │ │ ├── Sun.tsx │ │ │ │ │ ├── ThreeDots.tsx │ │ │ │ │ ├── Warning.tsx │ │ │ │ │ ├── WarningOutline.tsx │ │ │ │ │ ├── index.tsx │ │ │ │ │ └── questionIconPath.tsx │ │ │ │ ├── SVGIcon.tsx │ │ │ │ ├── createIcon.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── nbSvg.tsx │ │ │ │ ├── nbSvg.web.tsx │ │ │ │ └── types.ts │ │ │ ├── Image/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Input/ │ │ │ │ ├── Input.tsx │ │ │ │ ├── InputAddons.tsx │ │ │ │ ├── InputAdvanced.tsx │ │ │ │ ├── InputBase.tsx │ │ │ │ ├── InputGroup.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Link/ │ │ │ │ ├── index.tsx │ │ │ │ ├── types.ts │ │ │ │ └── useLink.ts │ │ │ ├── List/ │ │ │ │ ├── List.tsx │ │ │ │ ├── ListIcon.tsx │ │ │ │ ├── ListItem.tsx │ │ │ │ ├── Ordered.tsx │ │ │ │ ├── Unordered.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── types.ts │ │ │ │ └── utils.ts │ │ │ ├── Overlay/ │ │ │ │ ├── ExitAnimationContext.ts │ │ │ │ ├── Overlay.tsx │ │ │ │ └── index.ts │ │ │ ├── Pressable/ │ │ │ │ ├── Pressable.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Radio/ │ │ │ │ ├── Radio.tsx │ │ │ │ ├── Radio.web.tsx │ │ │ │ ├── RadioGroup.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── test/ │ │ │ │ │ └── radio.test.tsx │ │ │ │ └── types.tsx │ │ │ ├── Row/ │ │ │ │ └── index.tsx │ │ │ ├── Select/ │ │ │ │ ├── Select.tsx │ │ │ │ ├── SelectItem.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── Slider/ │ │ │ │ ├── Context.ts │ │ │ │ ├── Slider.tsx │ │ │ │ ├── SliderFilledTrack.tsx │ │ │ │ ├── SliderThumb.tsx │ │ │ │ ├── SliderTrack.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── Spinner/ │ │ │ │ ├── index.tsx │ │ │ │ ├── types.tsx │ │ │ │ ├── useSpinner.tsx │ │ │ │ └── variants/ │ │ │ │ ├── default.tsx │ │ │ │ ├── dotted.tsx │ │ │ │ ├── index.ts │ │ │ │ ├── multiColorDotted.tsx │ │ │ │ ├── squareDotted.tsx │ │ │ │ └── stroked.tsx │ │ │ ├── Stack/ │ │ │ │ ├── HStack.tsx │ │ │ │ ├── Stack.tsx │ │ │ │ ├── VStack.tsx │ │ │ │ └── index.tsx │ │ │ ├── Switch/ │ │ │ │ ├── index.tsx │ │ │ │ ├── test/ │ │ │ │ │ └── switch.test.tsx │ │ │ │ └── types.ts │ │ │ ├── Text/ │ │ │ │ ├── __test__/ │ │ │ │ │ └── Text.test.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── types.tsx │ │ │ ├── TextArea/ │ │ │ │ └── index.tsx │ │ │ ├── TouchableItem/ │ │ │ │ └── index.tsx │ │ │ ├── View/ │ │ │ │ ├── index.tsx │ │ │ │ └── types.ts │ │ │ ├── VisuallyHidden/ │ │ │ │ └── index.tsx │ │ │ ├── ZStack/ │ │ │ │ └── index.tsx │ │ │ └── index.ts │ │ └── types/ │ │ ├── ExtraProps.ts │ │ ├── PlatformProps.ts │ │ ├── index.tsx │ │ ├── responsiveValue.ts │ │ └── utils.ts │ ├── core/ │ │ ├── NativeBaseContext.ts │ │ ├── NativeBaseProvider.tsx │ │ ├── RobotoSlab.otf │ │ ├── StrictMode.ts │ │ ├── color-mode/ │ │ │ ├── hooks.tsx │ │ │ ├── index.tsx │ │ │ └── types.ts │ │ ├── extendTheme.tsx │ │ ├── hybrid-overlay/ │ │ │ ├── Context.ts │ │ │ ├── HybridProvider.tsx │ │ │ ├── index.ts │ │ │ └── types.ts │ │ └── index.ts │ ├── factory/ │ │ ├── component.tsx │ │ ├── index.tsx │ │ └── types.ts │ ├── hooks/ │ │ ├── index.ts │ │ ├── tests/ │ │ │ └── useBreakpointValue.test.tsx │ │ ├── useBreakpointResolvedProps.ts │ │ ├── useBreakpointValue.ts │ │ ├── useClipboard.ts │ │ ├── useColorModeProps.ts │ │ ├── useContrastText.ts │ │ ├── useControllableProp.ts │ │ ├── useDisclose.ts │ │ ├── useHasResponsiveProps.ts │ │ ├── useKeyboardDismissable.ts │ │ ├── useLayout.tsx │ │ ├── useMediaQuery.ts │ │ ├── useNativeBase.tsx │ │ ├── usePlatformProps.ts │ │ ├── useResolvedFontFamily.ts │ │ ├── useResponsiveSSRProps.ts │ │ ├── useSafeArea/ │ │ │ ├── index.ts │ │ │ └── utils.ts │ │ ├── useScreenReaderEnabled.ts │ │ ├── useStyledSystemPropsResolver.ts │ │ ├── useSx/ │ │ │ └── index.ts │ │ ├── useTheme.ts │ │ ├── useThemeProps/ │ │ │ ├── index.ts │ │ │ ├── propsFlattener.tsx │ │ │ ├── propsFlattenerTest.tsx │ │ │ ├── useProps.tsx │ │ │ ├── usePropsResolution.test.tsx │ │ │ ├── usePropsResolution.tsx │ │ │ ├── usePropsResolutionTest.tsx │ │ │ ├── usePropsWithComponentTheme.ts │ │ │ └── utils.ts │ │ └── useToken.ts │ ├── index.tsx │ ├── theme/ │ │ ├── base/ │ │ │ ├── borders.ts │ │ │ ├── breakpoints.ts │ │ │ ├── colors.ts │ │ │ ├── index.ts │ │ │ ├── opacity.ts │ │ │ ├── radius.ts │ │ │ ├── shadows.ts │ │ │ ├── sizes.ts │ │ │ ├── space.ts │ │ │ ├── types.ts │ │ │ └── typography.ts │ │ ├── components/ │ │ │ ├── accordion.ts │ │ │ ├── actionsheet.ts │ │ │ ├── alert-dialog.ts │ │ │ ├── alert.ts │ │ │ ├── app-bar.ts │ │ │ ├── aspect-ratio.ts │ │ │ ├── avatar-badge.ts │ │ │ ├── avatar-group.ts │ │ │ ├── avatar.ts │ │ │ ├── badge.ts │ │ │ ├── box.ts │ │ │ ├── breadcrumb.ts │ │ │ ├── button.ts │ │ │ ├── card.ts │ │ │ ├── center.ts │ │ │ ├── checkbox-group.ts │ │ │ ├── checkbox.ts │ │ │ ├── circle.ts │ │ │ ├── circular-progress.ts │ │ │ ├── code.ts │ │ │ ├── container.ts │ │ │ ├── divider.ts │ │ │ ├── fab.ts │ │ │ ├── flatList.ts │ │ │ ├── flex.ts │ │ │ ├── form-control.ts │ │ │ ├── heading.ts │ │ │ ├── hstack.ts │ │ │ ├── icon-button.ts │ │ │ ├── icon.ts │ │ │ ├── image.ts │ │ │ ├── index.ts │ │ │ ├── input.ts │ │ │ ├── inputleftaddon.ts │ │ │ ├── inputrightaddon.ts │ │ │ ├── kbd.ts │ │ │ ├── keyboardAvoidingView.ts │ │ │ ├── link.ts │ │ │ ├── list.ts │ │ │ ├── menu.ts │ │ │ ├── modal.ts │ │ │ ├── number-input.ts │ │ │ ├── pin-input.ts │ │ │ ├── popover.ts │ │ │ ├── pressable.ts │ │ │ ├── progress.ts │ │ │ ├── radio-group.ts │ │ │ ├── radio.ts │ │ │ ├── scrollView.ts │ │ │ ├── sectionList.ts │ │ │ ├── select.ts │ │ │ ├── simple-grid.ts │ │ │ ├── skeleton.ts │ │ │ ├── slider.ts │ │ │ ├── spinner.ts │ │ │ ├── square.ts │ │ │ ├── stack.ts │ │ │ ├── stat.ts │ │ │ ├── statusBar.ts │ │ │ ├── switch.ts │ │ │ ├── tabs.ts │ │ │ ├── tag.ts │ │ │ ├── text.ts │ │ │ ├── textField.ts │ │ │ ├── textarea.ts │ │ │ ├── toast.ts │ │ │ ├── tooltip.ts │ │ │ ├── transitions.ts │ │ │ ├── typeahead.ts │ │ │ ├── view.ts │ │ │ ├── vstack.ts │ │ │ ├── wrap.ts │ │ │ └── zstack.ts │ │ ├── index.ts │ │ ├── styled-system.ts │ │ ├── tests/ │ │ │ ├── findLastValidBreakpoint.test.tsx │ │ │ ├── getClosestBreakpoint.test.tsx │ │ │ ├── hasValidBreakpointFormat.test.tsx │ │ │ └── mode.test.tsx │ │ ├── tools/ │ │ │ ├── colors.ts │ │ │ ├── index.ts │ │ │ ├── platformUnits.test.js │ │ │ └── utils.ts │ │ ├── types.ts │ │ ├── v3-compatible-theme/ │ │ │ └── index.ts │ │ └── v33x-theme/ │ │ ├── base/ │ │ │ ├── borders.ts │ │ │ ├── breakpoints.ts │ │ │ ├── colors.ts │ │ │ ├── index.ts │ │ │ ├── opacity.ts │ │ │ ├── radius.ts │ │ │ ├── shadows.ts │ │ │ ├── sizes.ts │ │ │ ├── space.ts │ │ │ ├── types.ts │ │ │ └── typography.ts │ │ ├── components/ │ │ │ ├── accordion.ts │ │ │ ├── actionsheet.ts │ │ │ ├── alert-dialog.ts │ │ │ ├── alert.ts │ │ │ ├── app-bar.ts │ │ │ ├── aspect-ratio.ts │ │ │ ├── avatar-badge.ts │ │ │ ├── avatar-group.ts │ │ │ ├── avatar.ts │ │ │ ├── badge.ts │ │ │ ├── box.ts │ │ │ ├── breadcrumb.ts │ │ │ ├── button.ts │ │ │ ├── card.ts │ │ │ ├── center.ts │ │ │ ├── checkbox-group.ts │ │ │ ├── checkbox.ts │ │ │ ├── circle.ts │ │ │ ├── circular-progress.ts │ │ │ ├── code.ts │ │ │ ├── container.ts │ │ │ ├── divider.ts │ │ │ ├── fab.ts │ │ │ ├── flatList.ts │ │ │ ├── flex.ts │ │ │ ├── form-control.ts │ │ │ ├── heading.ts │ │ │ ├── hstack.ts │ │ │ ├── icon-button.ts │ │ │ ├── icon.ts │ │ │ ├── image.ts │ │ │ ├── index.ts │ │ │ ├── input.ts │ │ │ ├── inputleftaddon.ts │ │ │ ├── inputrightaddon.ts │ │ │ ├── kbd.ts │ │ │ ├── keyboardAvoidingView.ts │ │ │ ├── link.ts │ │ │ ├── list.ts │ │ │ ├── menu.ts │ │ │ ├── modal.ts │ │ │ ├── number-input.ts │ │ │ ├── pin-input.ts │ │ │ ├── popover.ts │ │ │ ├── pressable.ts │ │ │ ├── progress.ts │ │ │ ├── radio-group.ts │ │ │ ├── radio.ts │ │ │ ├── scrollView.ts │ │ │ ├── sectionList.ts │ │ │ ├── select.ts │ │ │ ├── simple-grid.ts │ │ │ ├── skeleton.ts │ │ │ ├── slider.ts │ │ │ ├── spinner.ts │ │ │ ├── square.ts │ │ │ ├── stack.ts │ │ │ ├── stat.ts │ │ │ ├── statusBar.ts │ │ │ ├── switch.ts │ │ │ ├── tabs.ts │ │ │ ├── tag.ts │ │ │ ├── text.ts │ │ │ ├── textField.ts │ │ │ ├── textarea.ts │ │ │ ├── toast.ts │ │ │ ├── tooltip.ts │ │ │ ├── transitions.ts │ │ │ ├── typeahead.ts │ │ │ ├── view.ts │ │ │ ├── vstack.ts │ │ │ ├── wrap.ts │ │ │ └── zstack.ts │ │ ├── index.ts │ │ └── tools/ │ │ ├── colors.ts │ │ ├── index.ts │ │ ├── platformUnits.test.js │ │ └── utils.ts │ └── utils/ │ ├── accessibilityTypes.ts │ ├── accessibilityUtils.ts │ ├── addTextAndPropsToStrings.tsx │ ├── canUseDom.ts │ ├── combineContextAndProps.ts │ ├── convertStringNumberToNumber.ts │ ├── createContext.tsx │ ├── filterShadowProps.ts │ ├── getAbsoluteChildren.ts │ ├── getAttachedChildren.ts │ ├── getIndexedChildren.ts │ ├── getRNKeyAndStyleValue.ts │ ├── getSpacedChildren.tsx │ ├── getStyledFromProps.ts │ ├── getStyledSystemPropsAndRestProps.ts │ ├── getUnit.ts │ ├── index.ts │ ├── isEmptyObj.ts │ ├── mergeRefs.ts │ ├── react-native-web-fucntions/ │ │ ├── atomic.ts │ │ ├── createReactDOMStyle.ts │ │ ├── hyphenateStyleName.ts │ │ ├── normalizeColor.ts │ │ ├── normalizeValueWithProperty.ts │ │ ├── prefixStyles.ts │ │ ├── preprocess.ts │ │ ├── staticData.ts │ │ └── unitlessNumbers.ts │ ├── resolveStackStyleInput.ts │ ├── styled.tsx │ ├── test-utils.tsx │ ├── tests/ │ │ └── filterShadow.test.tsx │ ├── useKeyboardBottomInset.ts │ ├── useResponsiveQuery/ │ │ ├── ResponsiveQueryProvider.tsx │ │ ├── common.ts │ │ ├── hash.ts │ │ ├── index.ts │ │ ├── types.ts │ │ ├── useResponsiveQuery.tsx │ │ ├── useResponsiveQuery.web.tsx │ │ └── useStableMemo.ts │ └── wrapStringChild.tsx └── tsconfig.json
SYMBOL INDEX (711 symbols across 305 files)
FILE: RNBareExample/android/app/src/debug/java/com/rnbareexample/ReactNativeFlipper.java
class ReactNativeFlipper (line 27) | public class ReactNativeFlipper {
method initializeFlipper (line 28) | public static void initializeFlipper(Context context, ReactInstanceMan...
FILE: RNBareExample/android/app/src/main/java/com/rnbareexample/MainActivity.java
class MainActivity (line 5) | public class MainActivity extends ReactActivity {
method getMainComponentName (line 11) | @Override
FILE: RNBareExample/android/app/src/main/java/com/rnbareexample/MainApplication.java
class MainApplication (line 15) | public class MainApplication extends Application implements ReactApplica...
method getUseDeveloperSupport (line 19) | @Override
method getPackages (line 24) | @Override
method getJSMainModuleName (line 33) | @Override
method getReactNativeHost (line 39) | @Override
method onCreate (line 44) | @Override
method initializeFlipper (line 58) | private static void initializeFlipper(
FILE: cli.js
function copyDir (line 6) | function copyDir(src, dest) {
constant VALID_ARGS (line 26) | const VALID_ARGS = ['eject:theme'];
FILE: example/storybook/stories/community-integrations/Formik/Basic.tsx
type IFormFields (line 5) | type IFormFields = {
function validateEmail (line 11) | function validateEmail(email: string) {
FILE: example/storybook/stories/community-integrations/ReactHookForm/NumberInput.tsx
type IFormInput (line 14) | interface IFormInput {
FILE: example/storybook/stories/community-integrations/ReactHookForm/PinInput.tsx
type IFormInput (line 5) | interface IFormInput {
FILE: example/storybook/stories/community-integrations/ReactHookForm/RadioAndCheckbox.tsx
type IFormInput (line 14) | interface IFormInput {
FILE: example/storybook/stories/community-integrations/ReactHookForm/Select.tsx
type IFormInput (line 6) | interface IFormInput {
FILE: example/storybook/stories/community-integrations/ReactHookForm/Slider.tsx
type IFormInput (line 5) | interface IFormInput {
FILE: example/storybook/stories/community-integrations/ReactHookForm/Switch.tsx
type IFormInput (line 5) | interface IFormInput {
FILE: example/storybook/stories/community-integrations/ReactHookForm/Textarea.tsx
type IFormInput (line 5) | interface IFormInput {
FILE: example/storybook/stories/community-integrations/ReactHookForm/Usage.tsx
type IFormInput (line 5) | interface IFormInput {
FILE: example/storybook/stories/components/Wrapper.tsx
type MyThemeType (line 107) | type MyThemeType = typeof myTheme;
type ICustomTheme (line 109) | interface ICustomTheme extends MyThemeType {}
function MyWrapper (line 112) | function MyWrapper({ children }: any) {
function RenderTestButton (line 147) | function RenderTestButton() {
FILE: example/storybook/stories/components/composites/Actionsheet/Composition.tsx
function Example (line 11) | function Example() {
FILE: example/storybook/stories/components/composites/Actionsheet/CustomBackdrop.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Actionsheet/DisableOverlay.tsx
function Example (line 11) | function Example() {
FILE: example/storybook/stories/components/composites/Actionsheet/Icon.tsx
function Example (line 14) | function Example() {
FILE: example/storybook/stories/components/composites/Actionsheet/Usage.tsx
function Example (line 11) | function Example() {
FILE: example/storybook/stories/components/composites/Alert/action.tsx
function Example (line 14) | function Example() {
FILE: example/storybook/stories/components/composites/Alert/colorScheme.tsx
function Example (line 13) | function Example() {
FILE: example/storybook/stories/components/composites/Alert/composition.tsx
function Example (line 13) | function Example() {
FILE: example/storybook/stories/components/composites/Alert/status.tsx
function Example (line 12) | function Example() {
FILE: example/storybook/stories/components/composites/Alert/usage.tsx
function Example (line 12) | function Example() {
FILE: example/storybook/stories/components/composites/Alert/variant.tsx
function Example (line 12) | function Example() {
FILE: example/storybook/stories/components/composites/AppBar/AppBarExamples.tsx
function Examples (line 13) | function Examples() {
function Material (line 24) | function Material() {
function IOSLike (line 51) | function IOSLike() {
function Customized (line 87) | function Customized() {
function CustomizedWithBorder (line 109) | function CustomizedWithBorder() {
FILE: example/storybook/stories/components/composites/Badge/color.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Badge/composition.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Badge/knobEnabled.tsx
function Example (line 5) | function Example() {
FILE: example/storybook/stories/components/composites/Badge/usage.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Badge/variants.tsx
function Example (line 5) | function Example() {
FILE: example/storybook/stories/components/composites/Card/Basic.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Center/Basic.tsx
function Example (line 3) | function Example() {
FILE: example/storybook/stories/components/composites/Center/SquareCircle.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Center/WithIcons.tsx
function Example (line 5) | function Example() {
FILE: example/storybook/stories/components/composites/Container/usage.tsx
function Example (line 3) | function Example() {
FILE: example/storybook/stories/components/composites/Menu/Basic.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Menu/Group.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Menu/MenuOptionsGroup.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Menu/MenuPositions.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Modal/ModalRefEg.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Modal/ModalWithAvoidKeyboard.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Modal/Size.tsx
function Example (line 5) | function Example() {
FILE: example/storybook/stories/components/composites/Popover/Basic.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Popover/PopoverPositions.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Popover/RefEg.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/SimpleGrid/MinWidthColumns.tsx
function MinChildWidthSimpleGrid (line 7) | function MinChildWidthSimpleGrid() {
FILE: example/storybook/stories/components/composites/SimpleGrid/NumberOfColumns.tsx
function NumberOfColumnsSimpleGrid (line 7) | function NumberOfColumnsSimpleGrid() {
FILE: example/storybook/stories/components/composites/Toast/CloseToast.tsx
function close (line 8) | function close() {
function closeAll (line 14) | function closeAll() {
function addToast (line 18) | function addToast() {
FILE: example/storybook/stories/components/composites/Toast/PreventDuplicate.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Tooltip/Basic.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Tooltip/CustomTooltip.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Tooltip/TooltipPositions.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/composites/Typeahead/UsingComponent.tsx
function UsingComponent (line 14) | function UsingComponent() {
FILE: example/storybook/stories/components/composites/Typeahead/UsingComponentWithRenderItem.tsx
function UsingComponentWithRenderItem (line 14) | function UsingComponentWithRenderItem() {
FILE: example/storybook/stories/components/composites/Typeahead/UsingControlledInput.tsx
function UsingControlledInput (line 14) | function UsingControlledInput() {
FILE: example/storybook/stories/components/composites/Typeahead/UsingHook.tsx
function UsingHook (line 29) | function UsingHook() {
FILE: example/storybook/stories/components/composites/Typeahead/UsingWithAPI.tsx
function UsingWithAPI (line 20) | function UsingWithAPI() {
FILE: example/storybook/stories/components/perf/NBButton.tsx
function NBButtons (line 3) | function NBButtons() {
FILE: example/storybook/stories/components/perf/RNButton.tsx
function RNButtons (line 3) | function RNButtons() {
FILE: example/storybook/stories/components/primitives/Flex/basic.tsx
function Example (line 12) | function Example() {
FILE: example/storybook/stories/components/primitives/HStack/basic.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Heading/Basic.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Heading/Composition.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Heading/OverridenStyle.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Heading/Sizes.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Heading/Truncate.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Hidden/basic.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Hidden/hiddenFromAndToBreakpoints.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Hidden/hiddenOnPlatforms.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Hidden/hiddenOnlyOnBreakPoints.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Image/Basic.tsx
function Example (line 3) | function Example() {
FILE: example/storybook/stories/components/primitives/Image/BorderRadius.tsx
function Example (line 3) | function Example() {
FILE: example/storybook/stories/components/primitives/Image/FallbackElement.tsx
function Example (line 3) | function Example() {
FILE: example/storybook/stories/components/primitives/Image/FallbackSupport.tsx
function Example (line 3) | function Example() {
FILE: example/storybook/stories/components/primitives/Image/Sizes.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Image/WithRef.tsx
function Example (line 5) | function Example() {
FILE: example/storybook/stories/components/primitives/List/VirtualizedList.tsx
constant DATA (line 5) | const DATA = [];
FILE: example/storybook/stories/components/primitives/Pressable/Basic.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Pressable/Events.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/Stack/basic.tsx
function Example (line 12) | function Example() {
FILE: example/storybook/stories/components/primitives/Stack/divider.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/components/primitives/VStack/basic.tsx
function Example (line 4) | function Example() {
FILE: example/storybook/stories/hooks/useColorMode/Basic.tsx
function UseColorMode (line 11) | function UseColorMode() {
FILE: example/storybook/stories/hooks/useColorModeValue/Basic.tsx
function UseColorMode (line 12) | function UseColorMode() {
FILE: example/storybook/stories/hooks/useSafeArea/Fixed.tsx
function MyComponent (line 3) | function MyComponent() {
FILE: example/storybook/stories/hooks/useSafeArea/Flexible.tsx
function MyComponent (line 3) | function MyComponent() {
FILE: example/storybook/stories/hooks/useSafeArea/Hook.tsx
function MyComponent (line 3) | function MyComponent() {
FILE: expo-example/App.tsx
function App (line 28) | function App() {
FILE: expo-example/test-babel 11.40.04 AM.js
method Program (line 7) | Program(path) {
FILE: next-example/pages/_app.tsx
function MyApp (line 5) | function MyApp({ Component, pageProps }: AppProps) {
FILE: next-example/pages/api/hello.ts
type Data (line 4) | type Data = {
function handler (line 8) | function handler(
FILE: src/components/basic/FlatList/types.ts
type InterfaceFlatListProps (line 6) | interface InterfaceFlatListProps<ItemT>
type IFlatListProps (line 17) | type IFlatListProps<ItemT> = InterfaceFlatListProps<ItemT> &
FILE: src/components/basic/KeyboardAvoidingView/types.ts
type InterfaceKeyboardAvoidingViewProps (line 5) | interface InterfaceKeyboardAvoidingViewProps
type IKeyboardAvoidingViewProps (line 14) | type IKeyboardAvoidingViewProps = InterfaceKeyboardAvoidingViewProps &
FILE: src/components/basic/ScrollView/types.ts
type InterfaceScrollViewProps (line 5) | interface InterfaceScrollViewProps
type IScrollViewProps (line 18) | type IScrollViewProps = InterfaceScrollViewProps &
FILE: src/components/basic/SectionList/types.ts
type DefaultSectionT (line 5) | type DefaultSectionT = {
type InterfaceSectionListProps (line 9) | interface InterfaceSectionListProps<ItemT, sectionT = DefaultSectionT>
type ISectionListProps (line 16) | type ISectionListProps<
FILE: src/components/basic/StatusBar/types.ts
type InterfaceStatusBarProps (line 4) | interface InterfaceStatusBarProps extends StatusBarProps {}
type IStatusBarProps (line 5) | type IStatusBarProps = InterfaceStatusBarProps &
type IStatusBarComponentType (line 8) | type IStatusBarComponentType = (props: IStatusBarProps) => JSX.Element;
FILE: src/components/basic/View/types.ts
type InterfaceViewProps (line 5) | interface InterfaceViewProps
type IViewProps (line 14) | type IViewProps = InterfaceViewProps & CustomProps<'View'>;
FILE: src/components/composites/Accordion/types.ts
type IAccordionProps (line 6) | type IAccordionProps = ICollapseProps & {
type IAccordionItemProps (line 13) | type IAccordionItemProps = InterfaceBoxProps<IAccordionItemProps> & {
type IAccordionSummaryProps (line 19) | type IAccordionSummaryProps = InterfaceBoxProps<IAccordionSummaryProps> & {
type IAccordionDetailsProps (line 24) | type IAccordionDetailsProps = ICollapseProps & {};
type IAccordionContextProps (line 25) | type IAccordionContextProps = {
type IAccordionItemContextProps (line 30) | type IAccordionItemContextProps = {
type IAccordionIconProps (line 37) | type IAccordionIconProps = IIconProps;
type IAccordionComponentType (line 39) | type IAccordionComponentType = ((
FILE: src/components/composites/Actionsheet/types.tsx
type InterfaceActionsheetProps (line 6) | interface InterfaceActionsheetProps
type IActionsheetContentProps (line 36) | interface IActionsheetContentProps
type IActionsheetFooterProps (line 51) | interface IActionsheetFooterProps
type IActionsheetHeaderProps (line 53) | interface IActionsheetHeaderProps
type IActionsheetItemProps (line 55) | interface IActionsheetItemProps
type IActionsheetComponentType (line 58) | type IActionsheetComponentType = ((
type IActionsheetProps (line 83) | type IActionsheetProps = InterfaceActionsheetProps &
FILE: src/components/composites/Alert/types.tsx
type InterfaceAlertProps (line 6) | interface InterfaceAlertProps extends InterfaceBoxProps<IAlertProps> {
type IAlertContext (line 20) | type IAlertContext = {
type IAlertIconProps (line 26) | interface IAlertIconProps extends IIconProps {}
type IAlertComponentType (line 28) | type IAlertComponentType = ((
type IAlertProps (line 36) | type IAlertProps = InterfaceAlertProps & CustomProps<'Alert'>;
FILE: src/components/composites/AlertDialog/types.ts
type InterfaceAlertDialogProps (line 10) | interface InterfaceAlertDialogProps
type IAlertDialogComponentType (line 92) | type IAlertDialogComponentType = ((
type IAlertDialogProps (line 112) | type IAlertDialogProps = InterfaceAlertDialogProps &
FILE: src/components/composites/AppBar/AppBarContent.tsx
type IAppBarContentProps (line 5) | type IAppBarContentProps = IBoxProps;
FILE: src/components/composites/AppBar/types.tsx
type IAppBarProps (line 4) | type IAppBarProps = InterfaceStackProps & {
type IAppBarComponentType (line 10) | type IAppBarComponentType = ((props: IAppBarProps) => JSX.Element) & {
FILE: src/components/composites/AppBar/utils.ts
constant IOS_STATUS_BAR_HEIGHT (line 6) | const IOS_STATUS_BAR_HEIGHT = 20;
constant DEFAULT_STATUSBAR_HEIGHT_EXPO (line 8) | const DEFAULT_STATUSBAR_HEIGHT_EXPO = 0;
constant APPROX_STATUSBAR_HEIGHT (line 13) | const APPROX_STATUSBAR_HEIGHT = Platform.select({
FILE: src/components/composites/AspectRatio/types.ts
type InterfaceAspectRatioProps (line 4) | interface InterfaceAspectRatioProps
type IAspectRatioProps (line 13) | type IAspectRatioProps = InterfaceAspectRatioProps &
FILE: src/components/composites/Avatar/types.tsx
type InterfaceAvatarProps (line 7) | interface InterfaceAvatarProps extends InterfaceBoxProps<IAvatarProps> {
type IAvatarBadgeProps (line 27) | interface IAvatarBadgeProps
type IAvatarGroupProps (line 30) | interface IAvatarGroupProps extends IAvatarProps {
type IAvatarComponentType (line 59) | type IAvatarComponentType = ((
type IAvatarProps (line 70) | type IAvatarProps = InterfaceAvatarProps & CustomProps<'Avatar'>;
FILE: src/components/composites/Badge/index.tsx
type IBadgeComponentType (line 68) | type IBadgeComponentType = (props: IBadgeProps) => JSX.Element;
FILE: src/components/composites/Badge/types.tsx
type InterfaceBadgeProps (line 7) | interface InterfaceBadgeProps extends InterfaceBoxProps<IBadgeProps> {
type IBadgeProps (line 43) | type IBadgeProps = InterfaceBadgeProps & CustomProps<'Badge'>;
FILE: src/components/composites/Breadcrumb/types.ts
type IBreadcrumbItemContext (line 5) | interface IBreadcrumbItemContext {
type InterfaceBreadcrumbProps (line 10) | interface InterfaceBreadcrumbProps extends IHStackProps {
type IBreadcrumbItemProps (line 18) | interface IBreadcrumbItemProps extends IHStackProps {
type IBreadcrumbIconProps (line 22) | interface IBreadcrumbIconProps extends IIconProps {
type IBreadcrumbTextProps (line 25) | interface IBreadcrumbTextProps extends ITextProps {
type IBreadcrumbComponentType (line 28) | type IBreadcrumbComponentType = ((
type IBreadcrumbProps (line 47) | type IBreadcrumbProps = InterfaceBreadcrumbProps &
FILE: src/components/composites/Card/types.ts
type InterfaceCardProps (line 4) | interface InterfaceCardProps extends InterfaceBoxProps<ICardProps> {}
type ICardProps (line 5) | type ICardProps = InterfaceCardProps & CustomProps<'Card'>;
FILE: src/components/composites/Center/types.ts
type InterfaceCenterProps (line 4) | interface InterfaceCenterProps extends InterfaceBoxProps<ICenterProps> {}
type ICircleProps (line 5) | type ICircleProps = InterfaceBoxProps<ICircleProps> & {
type ISquareProps (line 8) | type ISquareProps = InterfaceBoxProps<ISquareProps> & {
type ICenterProps (line 12) | type ICenterProps = InterfaceCenterProps & CustomProps<'Center'>;
FILE: src/components/composites/CircularProgress/types.ts
type InterfaceCircularProgressProps (line 9) | type InterfaceCircularProgressProps = InterfaceBoxProps<ICircularProgres...
type ICircularProgressProps (line 24) | type ICircularProgressProps = InterfaceCircularProgressProps &
FILE: src/components/composites/Code/types.ts
type InterfaceCodeProps (line 5) | type InterfaceCodeProps = InterfaceBoxProps<ICodeProps> & {
type ICodeProps (line 9) | type ICodeProps = InterfaceCodeProps & CustomProps<'Code'>;
FILE: src/components/composites/Collapse/index.tsx
type InterfaceCollapseProps (line 8) | type InterfaceCollapseProps = InterfaceBoxProps<ICollapseProps> & {
type ICollapseProps (line 19) | type ICollapseProps = InterfaceCollapseProps & CustomProps<'Box'>;
function usePrevious (line 21) | function usePrevious(value: any) {
FILE: src/components/composites/Container/types.tsx
type InterfaceContainerProps (line 4) | type InterfaceContainerProps = InterfaceBoxProps<IContainerProps> & {
type IContainerProps (line 8) | type IContainerProps = InterfaceContainerProps &
FILE: src/components/composites/Divider/types.ts
type InterfaceDividerProps (line 4) | interface InterfaceDividerProps
type IDividerProps (line 16) | type IDividerProps = InterfaceDividerProps & CustomProps<'Divider'>;
FILE: src/components/composites/Drawer/index.tsx
type IDrawerProps (line 6) | type IDrawerProps = {
FILE: src/components/composites/Fab/types.tsx
type InterfaceFabProps (line 4) | interface InterfaceFabProps extends InterfaceButtonProps {
type IFabProps (line 27) | type IFabProps = InterfaceFabProps & CustomProps<'FAB'>;
FILE: src/components/composites/FormControl/types.tsx
type InterfaceFormControlProps (line 6) | interface InterfaceFormControlProps
type IFormControlLabelProps (line 30) | interface IFormControlLabelProps extends IFormControlProps {
type IFormControlErrorMessageProps (line 49) | interface IFormControlErrorMessageProps extends IFormControlProps {
type IFormControlHelperTextProps (line 75) | interface IFormControlHelperTextProps extends IFormControlProps {
type FormControlComponentType (line 87) | type FormControlComponentType = ((
type IFormControlProps (line 101) | type IFormControlProps = InterfaceFormControlProps &
FILE: src/components/composites/FormControl/useFormControl.tsx
type IFormControlContext (line 9) | type IFormControlContext = Omit<
function useFormControlProvider (line 16) | function useFormControlProvider(props: IFormControlProps) {
function useFormControl (line 83) | function useFormControl(props: IFormControlProps) {
FILE: src/components/composites/IconButton/types.ts
type InterfaceIconButtonProps (line 7) | interface InterfaceIconButtonProps
type IIconButtonProps (line 78) | type IIconButtonProps = InterfaceIconButtonProps & CustomProps<'Icon'>;
FILE: src/components/composites/KBD/types.ts
type IKbdProps (line 3) | type IKbdProps = InterfaceBoxProps<IKbdProps> & CustomProps<'Kbd'>;
FILE: src/components/composites/Menu/types.ts
type InterfaceMenuProps (line 11) | interface InterfaceMenuProps extends InterfaceBoxProps<IMenuProps> {
type IMenuItemProps (line 86) | interface IMenuItemProps extends IPressableProps {
type IMenuItemOptionProps (line 105) | interface IMenuItemOptionProps extends IMenuItemProps {
type IMenuGroupProps (line 123) | interface IMenuGroupProps {
type IMenuOptionGroupProps (line 138) | interface IMenuOptionGroupProps extends IMenuGroupProps {
type IMenuOptionContextProps (line 157) | type IMenuOptionContextProps = {
type IMenuComponent (line 163) | type IMenuComponent = ((
type IMenuContextProps (line 184) | type IMenuContextProps = {
type IMenuProps (line 189) | type IMenuProps = InterfaceMenuProps & CustomProps<'Menu'>;
FILE: src/components/composites/Menu/useMenu.tsx
type IMenuTriggerProps (line 8) | type IMenuTriggerProps = {
constant ITEM_ATTR (line 99) | const ITEM_ATTR = 'data-nativebase-menu-item';
method onKeyDown (line 104) | onKeyDown(event: KeyboardEvent) {
FILE: src/components/composites/Modal/types.ts
type InterfaceModalProps (line 9) | interface InterfaceModalProps extends InterfaceBoxProps<IModalProps> {
type IModalComponentType (line 91) | type IModalComponentType = ((
type IModalProps (line 123) | type IModalProps = InterfaceModalProps & CustomProps<'Modal'>;
FILE: src/components/composites/NumberInput/types.tsx
type INumberInputProps (line 6) | type INumberInputProps = (InterfaceInputProps &
type INumberInputFieldProps (line 25) | type INumberInputFieldProps = IInputProps & {};
type INumberInputSteppersProps (line 26) | type INumberInputSteppersProps = IStackProps & {
type INumberInputStepperProps (line 29) | type INumberInputStepperProps = InterfaceBoxProps<INumberInputStepperPro...
type INumberInputContext (line 34) | type INumberInputContext = INumberInputProps & {
FILE: src/components/composites/PinInput/types.tsx
type IPinInputProps (line 6) | type IPinInputProps = (InterfaceInputProps & {
type IPinInputFieldProps (line 13) | type IPinInputFieldProps = InterfaceInputProps & {
type IPinInputComponentType (line 17) | type IPinInputComponentType = ((
type IPinInputContext (line 26) | type IPinInputContext = IPinInputProps & {
FILE: src/components/composites/Popover/types.ts
type IPopoverArrowProps (line 6) | type IPopoverArrowProps = {
type IPopoverArrowImplProps (line 12) | type IPopoverArrowImplProps = {
type IArrowProps (line 19) | type IArrowProps = {
type InterfacePopoverProps (line 23) | interface InterfacePopoverProps {
type IPopoverContentImpl (line 116) | type IPopoverContentImpl = {
type IPopoverImplProps (line 124) | type IPopoverImplProps = IPopoverProps & {
type IArrowStyles (line 128) | type IArrowStyles = {
type IScrollContentStyle (line 134) | type IScrollContentStyle = {
type IPopoverContentProps (line 140) | interface IPopoverContentProps
type IPopoverComponentType (line 143) | type IPopoverComponentType = ((
type IPopoverProps (line 178) | type IPopoverProps = InterfacePopoverProps;
FILE: src/components/composites/Popper/Popper.tsx
type PopperContext (line 22) | type PopperContext = IPopperProps & {
FILE: src/components/composites/Popper/types.ts
type IPopoverArrowProps (line 3) | type IPopoverArrowProps = {
type IPlacement (line 11) | type IPlacement =
type IPopperProps (line 25) | type IPopperProps = {
type IArrowStyles (line 35) | type IArrowStyles = {
type IScrollContentStyle (line 41) | type IScrollContentStyle = {
FILE: src/components/composites/Progress/index.tsx
type InterfaceProgressProps (line 12) | interface InterfaceProgressProps
type IProgressProps (line 51) | type IProgressProps = InterfaceProgressProps & CustomProps<'Progress'>;
FILE: src/components/composites/SimpleGrid/SimpleGrid.tsx
constant DEBUG_STYLES (line 8) | const DEBUG_STYLES = false
FILE: src/components/composites/SimpleGrid/types.ts
type ISimpleGridProps (line 3) | type ISimpleGridProps = InterfaceBoxProps<ISimpleGridProps> & {
FILE: src/components/composites/Skeleton/types.tsx
type InterfaceSkeletonProps (line 7) | interface InterfaceSkeletonProps
type ISkeletonTextProps (line 36) | interface ISkeletonTextProps extends IStackProps {
type ISkeletonComponentType (line 72) | type ISkeletonComponentType = ((
type ISkeletonProps (line 83) | type ISkeletonProps = InterfaceSkeletonProps & CustomProps<'Skeleton'>;
FILE: src/components/composites/Stat/index.tsx
type IStatArrowProps (line 58) | type IStatArrowProps = IIconProps & { type?: 'increase' | 'decrease' };
type IStatComponentType (line 84) | type IStatComponentType = ((
FILE: src/components/composites/Tabs/types.tsx
type ITabsProps (line 7) | type ITabsProps = InterfaceBoxProps<ITabsProps> & {
type ITabBarProps (line 23) | type ITabBarProps = InterfaceBoxProps<ITabBarProps> & {
type ITabProps (line 30) | type ITabProps = InterfaceBoxProps<ITabProps> & {
type ITabViewsProps (line 38) | type ITabViewsProps = IBoxProps;
type ITabViewProps (line 39) | type ITabViewProps = IBoxProps & {
type ITabsContextProps (line 43) | type ITabsContextProps = {
type ITabContextProps (line 53) | type ITabContextProps = {
type ITabsComponentType (line 57) | type ITabsComponentType = ((
FILE: src/components/composites/Tag/types.ts
type InterfaceTagProps (line 5) | interface InterfaceTagProps extends InterfaceBoxProps<ITagProps> {
type IInputComponentType (line 11) | type IInputComponentType = (props: ITagProps) => JSX.Element;
type ITagProps (line 13) | type ITagProps = InterfaceTagProps & CustomProps<'Tag'>;
FILE: src/components/composites/TextField/types.tsx
type componentsSpecificProps (line 7) | type componentsSpecificProps =
type ITextFieldProps (line 12) | type ITextFieldProps = (componentsSpecificProps &
FILE: src/components/composites/Toast/Toast.tsx
constant INSET (line 16) | const INSET = 50;
constant POSITIONS (line 18) | const POSITIONS = {
type IToastService (line 322) | type IToastService = ReturnType<typeof useToast>;
FILE: src/components/composites/Toast/types.ts
type InterfaceToastProps (line 6) | interface InterfaceToastProps extends InterfaceBoxProps<IToastProps> {
type IToast (line 66) | type IToast = {
type IToastInfo (line 72) | type IToastInfo = {
type IToastContext (line 76) | type IToastContext = {
type IToastProps (line 88) | type IToastProps = InterfaceToastProps & CustomProps<'Toast'>;
FILE: src/components/composites/Toast/utils.ts
constant INSET (line 1) | let INSET = 0;
constant POSITIONS (line 2) | const POSITIONS = {
FILE: src/components/composites/Tooltip/types.ts
type InterfaceTooltipProps (line 4) | interface InterfaceTooltipProps
type ITooltipProps (line 82) | type ITooltipProps = InterfaceTooltipProps & CustomProps<'Tooltip'>;
FILE: src/components/composites/Transitions/Stagger.tsx
type IStaggerConfig (line 7) | interface IStaggerConfig {
type IStaggerStyleProps (line 12) | interface IStaggerStyleProps extends ISupportedTransitions {
type IStaggerProps (line 16) | interface IStaggerProps {
FILE: src/components/composites/Transitions/types.tsx
type IFadeProps (line 6) | type IFadeProps = InterfaceBoxProps<IFadeProps> & {
type IScaleFadeProps (line 15) | type IScaleFadeProps = InterfaceBoxProps<IScaleFadeProps> & {
type ISlideProps (line 24) | type ISlideProps = InterfaceBoxProps<ISlideProps> & {
type ISlideFadeProps (line 35) | type ISlideFadeProps = InterfaceBoxProps<ISlideFadeProps> & {
type ISupportedTransitions (line 43) | interface ISupportedTransitions {
type ITransitionConfig (line 53) | interface ITransitionConfig {
type ITransitionStyleProps (line 72) | interface ITransitionStyleProps extends ISupportedTransitions {
type ITransitionProps (line 75) | interface ITransitionProps extends ViewProps {
type IPresenceTransitionProps (line 102) | interface IPresenceTransitionProps extends ViewProps {
FILE: src/components/composites/Typeahead/Typeahead.tsx
type IListBoxProps (line 151) | type IListBoxProps = {
function ListBoxPopup (line 159) | function ListBoxPopup(props: IListBoxProps) {
function Option (line 195) | function Option({ item, state }: { item: any; state: ComboBoxState<any> ...
FILE: src/components/composites/Typeahead/types.ts
type ITypeaheadProps (line 3) | type ITypeaheadProps = InterfaceBoxProps<ITypeaheadProps> & {
type IComboBoxProps (line 18) | type IComboBoxProps = {
FILE: src/components/composites/Typeahead/useTypeahead/reducer.tsx
type IState (line 4) | type IState = {
function useTypeaheadReducer (line 10) | function useTypeaheadReducer(state: IState, action: any) {
FILE: src/components/composites/Typeahead/useTypeahead/types.tsx
type IItem (line 19) | type IItem = any;
type IUseTypeaheadProps (line 20) | type IUseTypeaheadProps = {
FILE: src/components/composites/Typeahead/useTypeahead/useTypeahead.ts
function isControlledProp (line 8) | function isControlledProp(props: any, key: string) {
function useTypeahead (line 14) | function useTypeahead(props: IUseTypeaheadProps) {
FILE: src/components/composites/Typeahead/useTypeahead/utils.ts
function capitalizeString (line 8) | function capitalizeString(string: string) {
function getDefaultValue (line 12) | function getDefaultValue(
FILE: src/components/composites/Wrap/types.ts
type IWrapProps (line 3) | type IWrapProps = IFlexProps & {
FILE: src/components/primitives/Box/types.ts
type ILinearGradientProps (line 12) | interface ILinearGradientProps {
type InterfaceBoxProps (line 21) | interface InterfaceBoxProps<T = null>
type IBoxProps (line 49) | type IBoxProps<T = null> = InterfaceBoxProps<T> & CustomProps<'Box'>;
FILE: src/components/primitives/Button/types.ts
type InterfaceButtonProps (line 32) | interface InterfaceButtonProps
type IButtonGroupProps (line 139) | interface IButtonGroupProps extends IStackProps {
type IButtonComponentType (line 177) | type IButtonComponentType = ((
type IButtonProps (line 185) | type IButtonProps = InterfaceButtonProps & CustomProps<'Button'>;
FILE: src/components/primitives/Checkbox/CheckboxGroup.tsx
function CheckboxGroup (line 14) | function CheckboxGroup(
FILE: src/components/primitives/Checkbox/test/checkbox.test.tsx
function CheckBoxGroup (line 7) | function CheckBoxGroup() {
function CheckBox (line 33) | function CheckBox(group: any) {
FILE: src/components/primitives/Checkbox/types.tsx
type ICheckboxValue (line 15) | type ICheckboxValue = string;
type InterfaceCheckbox (line 17) | interface InterfaceCheckbox extends InterfaceBoxProps<ICheckboxProps> {
type ICheckboxGroupProps (line 141) | interface ICheckboxGroupProps
type ICheckboxContext (line 172) | interface ICheckboxContext extends IFormControlContext {
type IUseCheckboxReturnType (line 178) | interface IUseCheckboxReturnType {
type IUseCheckboxGroupReturnType (line 184) | interface IUseCheckboxGroupReturnType {
type ICheckboxComponentType (line 191) | type ICheckboxComponentType = ((
type ICheckboxProps (line 199) | type ICheckboxProps = InterfaceCheckbox & CustomProps<'Checkbox'>;
FILE: src/components/primitives/Flex/types.ts
type IFlexProps (line 15) | type IFlexProps = (InterfaceBoxProps<IFlexProps> & {
FILE: src/components/primitives/GridItem/props.ts
type IGridItemProps (line 17) | type IGridItemProps = (InterfaceBoxProps<IGridItemProps> & {
FILE: src/components/primitives/Heading/types.ts
type IterfaceHeadingProps (line 5) | interface IterfaceHeadingProps
type IHeadingProps (line 14) | type IHeadingProps = IterfaceHeadingProps & CustomProps<'Heading'>;
FILE: src/components/primitives/Hidden/index.tsx
function Hidden (line 10) | function Hidden({ isSSR, ...props }: IHiddenProps) {
FILE: src/components/primitives/Hidden/types.ts
type LiteralUnion (line 1) | type LiteralUnion<T extends U, U = string> = T | (U & {});
type InterfaceHiddenProps (line 3) | interface InterfaceHiddenProps {
type IHiddenProps (line 39) | type IHiddenProps = InterfaceHiddenProps;
FILE: src/components/primitives/Icon/SVGIcon.tsx
constant SVG (line 9) | const SVG = makeStyledComponent(Svg);
FILE: src/components/primitives/Icon/types.ts
type InterfaceIconProps (line 9) | interface InterfaceIconProps
type IcreateIconProps (line 58) | interface IcreateIconProps {
type IIconProps (line 73) | type IIconProps = InterfaceIconProps & CustomProps<'Icon'>;
FILE: src/components/primitives/Image/index.tsx
type ImageStatics (line 99) | interface ImageStatics {
FILE: src/components/primitives/Image/types.ts
type InterfaceImageProps (line 6) | interface InterfaceImageProps
type IImageProps (line 50) | type IImageProps = InterfaceImageProps & CustomProps<'Image'>;
FILE: src/components/primitives/Input/types.ts
type InterfaceInputProps (line 15) | interface InterfaceInputProps
type IInputGroupProps (line 117) | interface IInputGroupProps extends InterfaceBoxProps<IInputGroupProps> {
type IInputComponentType (line 130) | type IInputComponentType = (props: IInputProps) => JSX.Element;
type IInputProps (line 132) | type IInputProps = InterfaceInputProps & CustomProps<'Input'>;
FILE: src/components/primitives/Link/types.ts
type InterfaceLinkProps (line 6) | interface InterfaceLinkProps extends InterfaceBoxProps<ILinkProps> {
type IUseLinkProp (line 41) | type IUseLinkProp = {
type ILinkProps (line 48) | type ILinkProps = InterfaceLinkProps & CustomProps<'Link'>;
FILE: src/components/primitives/Link/useLink.ts
function useLink (line 14) | function useLink(props: IUseLinkProp) {
FILE: src/components/primitives/List/types.ts
type IListProps (line 7) | interface IListProps extends IStackProps {
type IListItemProps (line 51) | interface IListItemProps extends IPressableProps {
type IListComponentType (line 78) | type IListComponentType = ((
FILE: src/components/primitives/List/utils.ts
function findProps (line 2) | function findProps(props: any) {
FILE: src/components/primitives/Overlay/Overlay.tsx
type IOverlayProps (line 9) | interface IOverlayProps {
function Overlay (line 22) | function Overlay({
FILE: src/components/primitives/Pressable/types.ts
type InterfacePressableProps (line 4) | interface InterfacePressableProps<T = IPressableProps>
type IPressableProps (line 84) | type IPressableProps = InterfacePressableProps<IPressableProps> &
FILE: src/components/primitives/Radio/test/radio.test.tsx
function RadiosGroup (line 6) | function RadiosGroup() {
FILE: src/components/primitives/Radio/types.tsx
type IRadioValue (line 9) | type IRadioValue = string;
type IRadioGroupOnChangeHandler (line 14) | type IRadioGroupOnChangeHandler = (value: IRadioValue) => any;
type InterfaceRadioProps (line 16) | interface InterfaceRadioProps extends InterfaceBoxProps<IRadioProps> {
type IRadioGroupProps (line 112) | interface IRadioGroupProps extends IStackProps {
type IRadioContext (line 150) | interface IRadioContext extends IFormControlContext {
type IUseRadioGroupReturnType (line 156) | type IUseRadioGroupReturnType = {
type IRadioComponentType (line 165) | type IRadioComponentType = ((props: IRadioProps) => JSX.Element) & {
type IRadioProps (line 171) | type IRadioProps = InterfaceRadioProps & CustomProps<'Radio'>;
FILE: src/components/primitives/Select/types.ts
type InterfaceSelectProps (line 13) | interface InterfaceSelectProps extends InterfaceBoxProps<ISelectProps> {
type ISelectItemProps (line 105) | interface ISelectItemProps extends InterfaceButtonProps {
type ISelectComponentType (line 116) | type ISelectComponentType = ((
type ISelectProps (line 123) | type ISelectProps = InterfaceSelectProps & CustomProps<'Select'>;
FILE: src/components/primitives/Slider/Slider.tsx
function Slider (line 11) | function Slider({ isDisabled, isReadOnly, ...props }: ISliderProps, ref?...
FILE: src/components/primitives/Slider/SliderThumb.tsx
function SliderThumb (line 17) | function SliderThumb(props: ISliderThumbProps, ref: any) {
FILE: src/components/primitives/Slider/types.tsx
type InterfaceSliderProps (line 8) | interface InterfaceSliderProps extends InterfaceBoxProps<ISliderProps> {
type ISliderTrackProps (line 67) | interface ISliderTrackProps
type ISliderTrackFilledProps (line 79) | interface ISliderTrackFilledProps
type ISliderThumbProps (line 89) | interface ISliderThumbProps
type ISliderComponentType (line 118) | type ISliderComponentType = ((
type ISliderProps (line 134) | type ISliderProps = InterfaceSliderProps & CustomProps<'Slider'>;
FILE: src/components/primitives/Spinner/types.tsx
type InterfaceSpinnerProps (line 7) | interface InterfaceSpinnerProps
type ISpinnerProps (line 25) | type ISpinnerProps = InterfaceSpinnerProps & CustomProps<'Spinner'>;
FILE: src/components/primitives/Spinner/useSpinner.tsx
function useSpinner (line 3) | function useSpinner(props: ISpinnerProps) {
FILE: src/components/primitives/Spinner/variants/default.tsx
function Default (line 5) | function Default(props: any) {
FILE: src/components/primitives/Spinner/variants/dotted.tsx
function Dotted (line 5) | function Dotted(props: any) {
FILE: src/components/primitives/Spinner/variants/multiColorDotted.tsx
function MultiColorDotted (line 5) | function MultiColorDotted(props: any) {
FILE: src/components/primitives/Spinner/variants/squareDotted.tsx
function SquareDotted (line 5) | function SquareDotted(props: any) {
FILE: src/components/primitives/Spinner/variants/stroked.tsx
function Stroked (line 5) | function Stroked(props: any) {
FILE: src/components/primitives/Stack/HStack.tsx
type InterfaceHStackProps (line 10) | interface InterfaceHStackProps extends InterfaceStackProps {
type IHStackProps (line 20) | type IHStackProps = InterfaceHStackProps & CustomProps<'HStack'>;
FILE: src/components/primitives/Stack/Stack.tsx
type InterfaceStackProps (line 9) | interface InterfaceStackProps extends InterfaceBoxProps<IStackProps> {
type IStackProps (line 53) | type IStackProps = InterfaceStackProps & CustomProps<'Stack'>;
FILE: src/components/primitives/Stack/VStack.tsx
type InterfaceVStackProps (line 6) | interface InterfaceVStackProps extends InterfaceStackProps {
type IVStackProps (line 16) | type IVStackProps = InterfaceVStackProps & CustomProps<'VStack'>;
FILE: src/components/primitives/Switch/types.ts
type InterfaceSwitchProps (line 11) | interface InterfaceSwitchProps
type ISwitchProps (line 73) | type ISwitchProps = InterfaceSwitchProps & CustomProps<'Switch'>;
FILE: src/components/primitives/Text/types.tsx
type InterfaceTextProps (line 12) | interface InterfaceTextProps<T = ITextProps>
type ITextProps (line 82) | type ITextProps = InterfaceTextProps & CustomProps<'Text'>;
FILE: src/components/primitives/TextArea/index.tsx
type ITextAreaProps (line 9) | interface ITextAreaProps
FILE: src/components/primitives/View/types.ts
type IViewProps (line 5) | type IViewProps = (ViewProps &
FILE: src/components/primitives/VisuallyHidden/index.tsx
function VisuallyHidden (line 4) | function VisuallyHidden({
FILE: src/components/primitives/ZStack/index.tsx
type InterfaceZStackProps (line 8) | interface InterfaceZStackProps extends InterfaceBoxProps<IZStackProps> {
type IZStackProps (line 15) | type IZStackProps = InterfaceZStackProps & CustomProps<'ZStack'>;
FILE: src/components/types/ExtraProps.ts
type SafeAreaProps (line 1) | interface SafeAreaProps {
FILE: src/components/types/PlatformProps.ts
type PlatformProps (line 2) | interface PlatformProps<T> {
FILE: src/components/types/responsiveValue.ts
type ResponsiveValue (line 3) | type ResponsiveValue<T> =
FILE: src/components/types/utils.ts
type VariantType (line 5) | type VariantType<
type SpaceType (line 13) | type SpaceType = ResponsiveValue<
type SizeType (line 17) | type SizeType = ResponsiveValue<
type ThemeComponentSizeType (line 21) | type ThemeComponentSizeType<
type CombinedSizeType (line 29) | type CombinedSizeType<Component extends keyof ITheme['components']> =
type ColorType (line 33) | type ColorType = ResponsiveValue<
type ColorSchemeType (line 37) | type ColorSchemeType = ResponsiveValue<
type ComponentType (line 41) | type ComponentType<T extends keyof ITheme['components']> = {
type ParametersOf (line 45) | type ParametersOf<T> = {
type ParameterType (line 62) | type ParameterType<T, Key> = ParametersOf<
type CustomPropType (line 66) | type CustomPropType<T extends keyof ITheme['components'], Key> = Extract<
type CustomComponentProps (line 77) | type CustomComponentProps<
type CustomPropsTemp (line 87) | type CustomPropsTemp<
type UnionToIntersection (line 95) | type UnionToIntersection<U> = (
type VariantSizeColorScheme (line 101) | type VariantSizeColorScheme<T extends keyof ITheme['components']> = {
type CustomProps (line 115) | type CustomProps<
FILE: src/core/NativeBaseContext.ts
type INativebaseConfig (line 5) | interface INativebaseConfig {
FILE: src/core/NativeBaseProvider.tsx
type NativeBaseProviderProps (line 39) | interface NativeBaseProviderProps {
FILE: src/core/StrictMode.ts
type IModeType (line 1) | type IModeType = 'off' | 'warn' | 'error';
FILE: src/core/color-mode/hooks.tsx
function useColorModeValue (line 26) | function useColorModeValue(light: any, dark: any) {
function useModeManager (line 82) | function useModeManager(
function useAccessibleColors (line 126) | function useAccessibleColors(): [
FILE: src/core/color-mode/types.ts
type ColorMode (line 1) | type ColorMode = 'light' | 'dark' | null | undefined;
type StorageManager (line 2) | interface StorageManager {
type ColorModeOptions (line 7) | interface ColorModeOptions {
type IColorModeProviderProps (line 13) | type IColorModeProviderProps = {
type IColorModeContextProps (line 19) | interface IColorModeContextProps {
FILE: src/core/extendTheme.tsx
function isFunction (line 4) | function isFunction(value: any): boolean {
type ThemeUtil (line 8) | type ThemeUtil = Theme | (Record<string, any> & {});
function extendTheme (line 10) | function extendTheme<T extends ThemeUtil>(
FILE: src/core/hybrid-overlay/types.ts
type IHybridContextProps (line 3) | type IHybridContextProps = {
FILE: src/factory/component.tsx
function Factory (line 7) | function Factory<P>(
FILE: src/factory/types.ts
type FactoryComponentProps (line 5) | type FactoryComponentProps = StyledProps &
FILE: src/hooks/useBreakpointResolvedProps.ts
type IProps (line 7) | type IProps = {
type INewProps (line 11) | type INewProps = {
FILE: src/hooks/useBreakpointValue.ts
type UseBreakpointValueParam (line 10) | type UseBreakpointValueParam =
function useBreakpointValue (line 14) | function useBreakpointValue(values: UseBreakpointValueParam) {
FILE: src/hooks/useClipboard.ts
function useClipboard (line 4) | function useClipboard() {
FILE: src/hooks/useContrastText.ts
function useContrastText (line 6) | function useContrastText(bg: string, color?: string) {
function getContrastThemeColor (line 55) | function getContrastThemeColor(bgThemeColorVariant: string, bgShade: str...
function getAccessibleContrastColor (line 67) | function getAccessibleContrastColor(
function getContrastRatio (line 115) | function getContrastRatio(foreground: string, background: string) {
FILE: src/hooks/useControllableProp.ts
function useControllableProp (line 3) | function useControllableProp<T>(prop: T | undefined, state: T) {
type UseControllableStateProps (line 9) | interface UseControllableStateProps<T> {
function useControllableState (line 32) | function useControllableState<T>(props: UseControllableStateProps<T>) {
FILE: src/hooks/useDisclose.ts
function useDisclose (line 3) | function useDisclose(initState?: boolean) {
FILE: src/hooks/useHasResponsiveProps.ts
function useHasResponsiveProps (line 5) | function useHasResponsiveProps(props: any) {
FILE: src/hooks/useKeyboardDismissable.ts
type IParams (line 5) | type IParams = {
function useBackHandler (line 45) | function useBackHandler({ enabled, callback }: IParams) {
FILE: src/hooks/useMediaQuery.ts
type QueryKeys (line 4) | type QueryKeys =
type SubQuery (line 11) | type SubQuery = {
type Query (line 14) | type Query = Array<SubQuery>;
function useMediaQuery (line 16) | function useMediaQuery(query: SubQuery | Query) {
function queryResolver (line 24) | function queryResolver(query: any, width?: number, height?: number) {
function iterateQuery (line 33) | function iterateQuery(
function calculateQuery (line 49) | function calculateQuery(
FILE: src/hooks/useNativeBase.tsx
function useNativeBase (line 8) | function useNativeBase() {
FILE: src/hooks/useResolvedFontFamily.ts
function useResolvedFontFamily (line 12) | function useResolvedFontFamily(props: {
FILE: src/hooks/useResponsiveSSRProps.ts
function useResponsiveSSRProps (line 6) | function useResponsiveSSRProps(incomingProps: any) {
FILE: src/hooks/useSafeArea/index.ts
function useSafeArea (line 5) | function useSafeArea(props: any) {
FILE: src/hooks/useSafeArea/utils.ts
function calculatePaddingProps (line 6) | function calculatePaddingProps(
function getValueInPixels (line 19) | function getValueInPixels(
function calculatePaddingTop (line 59) | function calculatePaddingTop(
function calculatePaddingBottom (line 102) | function calculatePaddingBottom(
function calculatePaddingLeft (line 145) | function calculatePaddingLeft(
function calculatePaddingRight (line 188) | function calculatePaddingRight(
function getRelatedPaddingProps (line 233) | function getRelatedPaddingProps(props: any, relatedKeys: Array<any>) {
function getSortedProps (line 236) | function getSortedProps(props: any) {
FILE: src/hooks/useScreenReaderEnabled.ts
function useScreenReaderEnabled (line 4) | function useScreenReaderEnabled() {
FILE: src/hooks/useTheme.ts
function useTheme (line 3) | function useTheme() {
FILE: src/hooks/useThemeProps/propsFlattener.tsx
constant SPECIFICITY_1000 (line 3) | const SPECIFICITY_1000 = 1000;
constant SPECIFICITY_110 (line 4) | const SPECIFICITY_110 = 110;
constant SPECIFICITY_100 (line 5) | const SPECIFICITY_100 = 100;
constant SPECIFICITY_70 (line 6) | const SPECIFICITY_70 = 70;
constant SPECIFICITY_60 (line 7) | const SPECIFICITY_60 = 60;
constant SPECIFICITY_55 (line 8) | const SPECIFICITY_55 = 55;
constant SPECIFICITY_50 (line 9) | const SPECIFICITY_50 = 50;
constant SPECIFICITY_40 (line 10) | const SPECIFICITY_40 = 40;
constant SPECIFICITY_30 (line 11) | const SPECIFICITY_30 = 30;
constant SPECIFICITY_20 (line 13) | const SPECIFICITY_20 = 20;
constant SPECIFICITY_10 (line 14) | const SPECIFICITY_10 = 10;
constant INITIAL_PROP_SPECIFICITY (line 28) | const INITIAL_PROP_SPECIFICITY = {
type IPseudoPropsMap (line 109) | type IPseudoPropsMap = typeof pseudoPropsMap;
type ExtractState (line 110) | type ExtractState<T extends IPseudoPropsMap> = {
type IStateProps (line 114) | type IStateProps = ExtractState<IPseudoPropsMap>;
FILE: src/hooks/useThemeProps/propsFlattenerTest.tsx
constant SPECIFICITY_100 (line 3) | const SPECIFICITY_100 = 100;
constant SPECIFICITY_70 (line 4) | const SPECIFICITY_70 = 70;
constant SPECIFICITY_60 (line 5) | const SPECIFICITY_60 = 60;
constant SPECIFICITY_55 (line 6) | const SPECIFICITY_55 = 55;
constant SPECIFICITY_50 (line 7) | const SPECIFICITY_50 = 50;
constant SPECIFICITY_40 (line 8) | const SPECIFICITY_40 = 40;
constant SPECIFICITY_30 (line 9) | const SPECIFICITY_30 = 30;
constant SPECIFICITY_10 (line 10) | const SPECIFICITY_10 = 10;
constant SPECIFICITY_1 (line 11) | const SPECIFICITY_1 = 1;
constant INITIAL_PROP_SPECIFICITY (line 23) | const INITIAL_PROP_SPECIFICITY = {
FILE: src/hooks/useThemeProps/useProps.tsx
function useThemeProps (line 38) | function useThemeProps(component: string, propsReceived: any) {
FILE: src/hooks/useThemeProps/usePropsResolution.test.tsx
function CheckBoxGroup (line 40) | function CheckBoxGroup() {
FILE: src/hooks/useThemeProps/usePropsResolution.tsx
constant SPREAD_PROP_SPECIFICITY_ORDER (line 19) | const SPREAD_PROP_SPECIFICITY_ORDER = [
constant FINAL_SPREAD_PROPS (line 46) | const FINAL_SPREAD_PROPS = [
constant MARGIN_MAP (line 57) | const MARGIN_MAP: any = {
constant PADDING_MAP (line 73) | const PADDING_MAP: any = {
constant SPREAD_PROP_SPECIFICITY_MAP (line 89) | const SPREAD_PROP_SPECIFICITY_MAP: any = {
function propsSpreader (line 94) | function propsSpreader(incomingProps: any, incomingSpecifity: any) {
function usePropsResolution (line 126) | function usePropsResolution(
FILE: src/hooks/useThemeProps/usePropsResolutionTest.tsx
constant SPREAD_PROP_SPECIFICITY_ORDER (line 11) | const SPREAD_PROP_SPECIFICITY_ORDER = [
constant FINAL_SPREAD_PROPS (line 38) | const FINAL_SPREAD_PROPS = [
constant MARGIN_MAP (line 49) | const MARGIN_MAP: any = {
constant PADDING_MAP (line 65) | const PADDING_MAP: any = {
constant SPREAD_PROP_SPECIFICITY_MAP (line 81) | const SPREAD_PROP_SPECIFICITY_MAP: any = {
function propsSpreader (line 86) | function propsSpreader(incomingProps: any, incomingSpecifity: any) {
function usePropsResolutionTest (line 118) | function usePropsResolutionTest(
FILE: src/hooks/useThemeProps/usePropsWithComponentTheme.ts
function usePropsWithComponentTheme (line 5) | function usePropsWithComponentTheme(
FILE: src/hooks/useThemeProps/utils.ts
function extractProps (line 26) | function extractProps(
function filterDefaultProps (line 81) | function filterDefaultProps(props: any, defaultProps: any) {
function mergeUnderscoreProps (line 132) | function mergeUnderscoreProps(newProps: any, props: any) {
function calculateProps (line 190) | function calculateProps(
FILE: src/hooks/useToken.ts
function useToken (line 4) | function useToken<T extends string | number>(
FILE: src/theme/base/borders.ts
type IBorderWidth (line 9) | type IBorderWidth = keyof typeof borderWidths;
FILE: src/theme/base/breakpoints.ts
type IBreakpoint (line 9) | type IBreakpoint = keyof typeof breakpoints;
FILE: src/theme/base/colors.ts
type IColorHues (line 4) | interface IColorHues {
type IColors (line 351) | type IColors = Leaves<typeof colors>;
FILE: src/theme/base/opacity.ts
type IOpacity (line 18) | type IOpacity = keyof typeof opacity;
FILE: src/theme/base/radius.ts
type IRadii (line 13) | type IRadii = keyof typeof radii;
FILE: src/theme/base/shadows.ts
type IShadow (line 115) | type IShadow = keyof typeof shadow;
FILE: src/theme/base/sizes.ts
type ISizes (line 25) | type ISizes = keyof typeof sizes;
FILE: src/theme/base/space.ts
type ISpacing (line 48) | type ISpacing = keyof typeof spacing;
FILE: src/theme/base/types.ts
type Join (line 3) | type Join<K, P> = K extends string | number
type Leaves (line 9) | type Leaves<T> = T extends object
FILE: src/theme/base/typography.ts
type ITypography (line 135) | type ITypography = typeof typography;
type IFontSize (line 136) | type IFontSize = keyof typeof typography.fontSizes;
type ILetterSpacing (line 137) | type ILetterSpacing = keyof typeof typography.letterSpacings;
type ILineHeight (line 138) | type ILineHeight = keyof typeof typography.lineHeights;
type IFontWeight (line 139) | type IFontWeight = keyof typeof typography.fontWeights;
type IFont (line 141) | interface IFont {
FILE: src/theme/components/alert.ts
function getBg (line 3) | function getBg(
FILE: src/theme/components/avatar-badge.ts
function baseStyle (line 1) | function baseStyle() {
FILE: src/theme/components/avatar-group.ts
function baseStyle (line 2) | function baseStyle({ isVertical }: IAvatarGroupProps) {
FILE: src/theme/components/avatar.ts
function getSize (line 36) | function getSize(size: any, fontSize: string, badgeSize: any) {
FILE: src/theme/components/badge.ts
function variantSolid (line 13) | function variantSolid(props: InterfaceBadgeProps & { colorScheme: any }) {
function variantSubtle (line 29) | function variantSubtle(props: InterfaceBadgeProps & { colorScheme: any }) {
function variantOutline (line 42) | function variantOutline(props: InterfaceBadgeProps & { colorScheme: any ...
FILE: src/theme/components/button.ts
function variantGhost (line 52) | function variantGhost({ colorScheme }: InterfaceButtonProps) {
function variantOutline (line 90) | function variantOutline({ colorScheme }: InterfaceButtonProps) {
function variantSolid (line 131) | function variantSolid({ colorScheme }: InterfaceButtonProps) {
function variantSubtle (line 162) | function variantSubtle({ colorScheme }: InterfaceButtonProps) {
function variantLink (line 193) | function variantLink({ colorScheme }: InterfaceButtonProps) {
FILE: src/theme/components/circular-progress.ts
function baseStyle (line 35) | function baseStyle(props: Record<string, any>) {
FILE: src/theme/components/divider.ts
function baseStyle (line 1) | function baseStyle(props: Record<string, any>) {
FILE: src/theme/components/icon-button.ts
function variantGhost (line 52) | function variantGhost({ colorScheme }: Record<string, any>) {
function variantOutline (line 77) | function variantOutline({ colorScheme }: Record<string, any>) {
function variantSolid (line 129) | function variantSolid({ colorScheme }: Record<string, any>) {
function variantSubtle (line 159) | function variantSubtle({ colorScheme }: Record<string, any>) {
function variantLink (line 186) | function variantLink({ colorScheme }: Record<string, any>) {
function variantUnstyled (line 223) | function variantUnstyled() {
FILE: src/theme/components/input.ts
function roundedStyle (line 136) | function roundedStyle(props: InterfaceInputProps & { theme: any }) {
function outlineStyle (line 146) | function outlineStyle(props: InterfaceInputProps & { theme: any }) {
function filledStyle (line 155) | function filledStyle(props: InterfaceInputProps & { theme: any }) {
function unstyledStyle (line 177) | function unstyledStyle() {
function underlinedStyle (line 199) | function underlinedStyle(props: InterfaceInputProps & { theme: any }) {
FILE: src/theme/components/kbd.ts
function baseStyle (line 4) | function baseStyle(props: Record<string, any>) {
FILE: src/theme/components/progress.ts
function baseStyle (line 11) | function baseStyle(props: Record<string, any>) {
FILE: src/theme/components/tabs.ts
function baseStyle (line 3) | function baseStyle(props: Record<string, any>) {
function variantOutline (line 75) | function variantOutline(props: Record<string, any>) {
function variantFilled (line 107) | function variantFilled(props: Record<string, any>) {
function variantFilledOutline (line 155) | function variantFilledOutline(props: Record<string, any>) {
FILE: src/theme/index.ts
type ComponentTheme (line 7) | interface ComponentTheme {
type Theme (line 25) | type Theme = typeof theme & { fontConfig: any };
type ICustomTheme (line 27) | interface ICustomTheme {}
type ITheme (line 29) | interface ITheme extends ICustomTheme, Omit<Theme, keyof ICustomTheme> {}
FILE: src/theme/styled-system.ts
type StyledPropConfig (line 655) | type StyledPropConfig = typeof propConfig;
FILE: src/theme/tools/colors.ts
function mode (line 6) | function mode(light: any, dark: any) {
type RandomColorOptions (line 35) | interface RandomColorOptions {
function randomColor (line 46) | function randomColor(opts?: RandomColorOptions) {
function randomFromList (line 68) | function randomFromList(list: string[]) {
function randomColorFromList (line 72) | function randomColorFromList(str: string, list: string[]) {
function randomColorFromString (line 83) | function randomColorFromString(str: string) {
FILE: src/theme/tools/utils.ts
type Dict (line 111) | type Dict = Record<string, any>;
function omitUndefined (line 112) | function omitUndefined(obj: any) {
function getRandomString (line 115) | function getRandomString(length: number) {
function orderedPick (line 126) | function orderedPick(obj: any, values: any) {
function orderedExtractInObject (line 135) | function orderedExtractInObject(parent: any, values: Array<string>) {
function extractInObject (line 147) | function extractInObject(parent: any, values: Array<string>) {
function getColorFormColorScheme (line 153) | function getColorFormColorScheme(props: Record<string, any>) {
function getColorScheme (line 166) | function getColorScheme(
function hasValidBreakpointFormat (line 178) | function hasValidBreakpointFormat(
function findLastValidBreakpoint (line 200) | function findLastValidBreakpoint(
function getClosestBreakpoint (line 216) | function getClosestBreakpoint(
function isResponsiveAnyProp (line 323) | function isResponsiveAnyProp(props: Record<string, any>, theme: any) {
FILE: src/theme/types.ts
type RNStyles (line 8) | type RNStyles = ViewStyle & ImageStyle & TextStyle;
type GetThemeScaleValues (line 10) | type GetThemeScaleValues<T extends keyof ITheme> = 'colors' extends T
type GetRNStyles (line 14) | type GetRNStyles<key, scale = null> = scale extends keyof ITheme
type AllProps (line 22) | type AllProps<T extends StyledPropConfig> = {
type StyledProps (line 36) | type StyledProps = Omit<
FILE: src/theme/v33x-theme/base/borders.ts
type IBorderWidth (line 9) | type IBorderWidth = keyof typeof borderWidths;
FILE: src/theme/v33x-theme/base/breakpoints.ts
type IBreakpoint (line 9) | type IBreakpoint = keyof typeof breakpoints;
FILE: src/theme/v33x-theme/base/colors.ts
type IColorHues (line 4) | interface IColorHues {
type IColors (line 351) | type IColors = Leaves<typeof colors>;
FILE: src/theme/v33x-theme/base/opacity.ts
type IOpacity (line 18) | type IOpacity = keyof typeof opacity;
FILE: src/theme/v33x-theme/base/radius.ts
type IRadii (line 13) | type IRadii = keyof typeof radii;
FILE: src/theme/v33x-theme/base/shadows.ts
type IShadow (line 115) | type IShadow = keyof typeof shadow;
FILE: src/theme/v33x-theme/base/sizes.ts
type ISizes (line 25) | type ISizes = keyof typeof sizes;
FILE: src/theme/v33x-theme/base/space.ts
type ISpacing (line 48) | type ISpacing = keyof typeof spacing;
FILE: src/theme/v33x-theme/base/types.ts
type Join (line 3) | type Join<K, P> = K extends string | number
type Leaves (line 9) | type Leaves<T> = T extends object
FILE: src/theme/v33x-theme/base/typography.ts
type ITypography (line 135) | type ITypography = typeof typography;
type IFontSize (line 136) | type IFontSize = keyof typeof typography.fontSizes;
type ILetterSpacing (line 137) | type ILetterSpacing = keyof typeof typography.letterSpacings;
type ILineHeight (line 138) | type ILineHeight = keyof typeof typography.lineHeights;
type IFontWeight (line 139) | type IFontWeight = keyof typeof typography.fontWeights;
type IFont (line 141) | interface IFont {
FILE: src/theme/v33x-theme/components/alert.ts
function getBg (line 3) | function getBg(props: Record<string, any>) {
FILE: src/theme/v33x-theme/components/avatar-badge.ts
function baseStyle (line 3) | function baseStyle(props: Record<string, any>) {
FILE: src/theme/v33x-theme/components/avatar-group.ts
function baseStyle (line 3) | function baseStyle({ isVertical, ...props }: Record<string, any>) {
FILE: src/theme/v33x-theme/components/avatar.ts
function getSize (line 33) | function getSize(size: any, fontSize: string) {
FILE: src/theme/v33x-theme/components/badge.ts
function variantSolid (line 10) | function variantSolid(props: Record<string, any>) {
function variantSubtle (line 21) | function variantSubtle(props: Record<string, any>) {
function variantOutline (line 32) | function variantOutline(props: Record<string, any>) {
FILE: src/theme/v33x-theme/components/button.ts
function variantGhost (line 50) | function variantGhost(props: Dict) {
function variantOutline (line 88) | function variantOutline(props: Dict) {
function variantSolid (line 103) | function variantSolid(props: Dict) {
function variantSubtle (line 154) | function variantSubtle(props: Dict) {
function variantLink (line 185) | function variantLink(props: Dict) {
function variantUnstyled (line 220) | function variantUnstyled() {
FILE: src/theme/v33x-theme/components/circular-progress.ts
function baseStyle (line 35) | function baseStyle(props: Record<string, any>) {
FILE: src/theme/v33x-theme/components/divider.ts
function baseStyle (line 3) | function baseStyle(props: Record<string, any>) {
FILE: src/theme/v33x-theme/components/icon-button.ts
function variantGhost (line 29) | function variantGhost(props: Dict) {
function variantOutline (line 57) | function variantOutline(props: Dict) {
function variantSolid (line 89) | function variantSolid(props: Dict) {
function variantUnstyled (line 114) | function variantUnstyled() {
FILE: src/theme/v33x-theme/components/input.ts
function getSelectionColor (line 4) | function getSelectionColor(props: Record<string, any>) {
function roundedStyle (line 72) | function roundedStyle(props: Record<string, any>) {
function outlineStyle (line 81) | function outlineStyle(props: Record<string, any>) {
function filledStyle (line 89) | function filledStyle(props: Record<string, any>) {
function unstyledStyle (line 99) | function unstyledStyle() {
function underlinedStyle (line 104) | function underlinedStyle() {
FILE: src/theme/v33x-theme/components/kbd.ts
function baseStyle (line 4) | function baseStyle(props: Record<string, any>) {
FILE: src/theme/v33x-theme/components/menu.ts
function baseStyle (line 4) | function baseStyle(props: Record<string, any>) {
FILE: src/theme/v33x-theme/components/progress.ts
function baseStyle (line 13) | function baseStyle(props: Record<string, any>) {
FILE: src/theme/v33x-theme/components/tabs.ts
function baseStyle (line 3) | function baseStyle(props: Record<string, any>) {
function variantOutline (line 75) | function variantOutline(props: Record<string, any>) {
function variantFilled (line 107) | function variantFilled(props: Record<string, any>) {
function variantFilledOutline (line 155) | function variantFilledOutline(props: Record<string, any>) {
FILE: src/theme/v33x-theme/index.ts
type V33xTheme (line 19) | type V33xTheme = typeof v33xTheme & { fontConfig: any };
type ICustomTheme (line 21) | interface ICustomTheme {}
type IV33xTheme (line 23) | interface IV33xTheme
FILE: src/theme/v33x-theme/tools/colors.ts
function mode (line 6) | function mode(light: any, dark: any) {
type RandomColorOptions (line 35) | interface RandomColorOptions {
function randomColor (line 46) | function randomColor(opts?: RandomColorOptions) {
function randomFromList (line 68) | function randomFromList(list: string[]) {
function randomColorFromList (line 72) | function randomColorFromList(str: string, list: string[]) {
function randomColorFromString (line 83) | function randomColorFromString(str: string) {
FILE: src/theme/v33x-theme/tools/utils.ts
type Dict (line 109) | type Dict = Record<string, any>;
function omitUndefined (line 110) | function omitUndefined(obj: any) {
function getRandomString (line 113) | function getRandomString(length: number) {
function orderedPick (line 124) | function orderedPick(obj: any, values: any) {
function orderedExtractInObject (line 133) | function orderedExtractInObject(parent: any, values: Array<string>) {
function extractInObject (line 145) | function extractInObject(parent: any, values: Array<string>) {
function getColorFormColorScheme (line 151) | function getColorFormColorScheme(props: Record<string, any>) {
function getColorScheme (line 164) | function getColorScheme(
function hasValidBreakpointFormat (line 176) | function hasValidBreakpointFormat(
function findLastValidBreakpoint (line 198) | function findLastValidBreakpoint(
function getClosestBreakpoint (line 214) | function getClosestBreakpoint(
function isResponsiveAnyProp (line 321) | function isResponsiveAnyProp(props: Record<string, any>, theme: any) {
FILE: src/utils/accessibilityTypes.ts
type IAccessibilityProps (line 3) | type IAccessibilityProps = {
FILE: src/utils/canUseDom.ts
function canUseDom (line 3) | function canUseDom() {
FILE: src/utils/createContext.tsx
function createContext (line 3) | function createContext<ContextValueType extends object>(
FILE: src/utils/getSpacedChildren.tsx
type SpaceType (line 6) | type SpaceType =
type ReactChildArray (line 19) | type ReactChildArray = ReturnType<typeof React.Children.toArray>;
function flattenChildren (line 20) | function flattenChildren(
FILE: src/utils/isEmptyObj.ts
function isEmptyObj (line 1) | function isEmptyObj(obj: Object) {
FILE: src/utils/mergeRefs.ts
function mergeRefs (line 1) | function mergeRefs<T = any>(
function composeEventHandlers (line 15) | function composeEventHandlers<E>(
FILE: src/utils/react-native-web-fucntions/atomic.ts
type Value (line 10) | type Value = Object | Array<any> | string | number;
type Style (line 11) | type Style = { [key: string]: Value };
type Rule (line 12) | type Rule = string;
type Rules (line 13) | type Rules = Array<Rule>;
type RulesData (line 14) | type RulesData = [Rules, number];
type CompiledStyle (line 15) | type CompiledStyle = {
constant PROPERTIES_VALUE (line 38) | const PROPERTIES_VALUE: any = ['clear', 'float', 'textAlign'];
constant PROPERTIES_FLIP (line 40) | const PROPERTIES_FLIP: { [key: string]: string } = {
constant PROPERTIES_I18N (line 59) | const PROPERTIES_I18N: any = {
type CompilerOutput (line 77) | type CompilerOutput = [CompiledStyle, Array<RulesData>];
function atomic (line 96) | function atomic(style: Style): CompilerOutput {
function stringifyValueWithProperty (line 190) | function stringifyValueWithProperty(
function createIdentifier (line 204) | function createIdentifier(prefix: string, name: string, value: Value): s...
function createAtomicRules (line 215) | function createAtomicRules(
function createDeclarationBlock (line 293) | function createDeclarationBlock(style: Style): string {
function processKeyframesValue (line 320) | function processKeyframesValue(keyframesValue: any) {
function createKeyframes (line 349) | function createKeyframes(keyframes: any): [string, Rules] {
FILE: src/utils/react-native-web-fucntions/createReactDOMStyle.ts
type Style (line 7) | type Style = { [key: string]: any };
constant MONOSPACE_FONT_STACK (line 46) | const MONOSPACE_FONT_STACK = 'monospace,monospace';
constant SYSTEM_FONT_STACK (line 48) | const SYSTEM_FONT_STACK =
constant STYLE_SHORT_FORM_EXPANSIONS (line 51) | const STYLE_SHORT_FORM_EXPANSIONS: any = {
FILE: src/utils/react-native-web-fucntions/hyphenateStyleName.ts
function toHyphenLower (line 9) | function toHyphenLower(match: any) {
function hyphenateStyleName (line 13) | function hyphenateStyleName(name: string): string {
FILE: src/utils/react-native-web-fucntions/normalizeValueWithProperty.ts
function normalizeValueWithProperty (line 21) | function normalizeValueWithProperty(
FILE: src/utils/react-native-web-fucntions/prefixStyles.ts
type StyleModifier (line 8) | type StyleModifier = (style: Object) => Object;
FILE: src/utils/useKeyboardBottomInset.ts
function onKeyboardChange (line 9) | function onKeyboardChange(e: KeyboardEvent) {
FILE: src/utils/useResponsiveQuery/ResponsiveQueryProvider.tsx
type ResponsiveQueryContextType (line 3) | type ResponsiveQueryContextType = {
FILE: src/utils/useResponsiveQuery/common.ts
function handleChange (line 65) | function handleChange({ window }: { window: ScaledSize }) {
FILE: src/utils/useResponsiveQuery/hash.ts
function murmurhash2_32_gc (line 16) | function murmurhash2_32_gc(str: string, seed: number) {
FILE: src/utils/useResponsiveQuery/types.ts
type StyleSheetStyle (line 3) | type StyleSheetStyle = Parameters<typeof StyleSheet.create>[0]['initial'];
type Query (line 5) | type Query = {
type UseResponsiveQueryParams (line 11) | type UseResponsiveQueryParams = {
type DataSet (line 17) | type DataSet = { [key: string]: string };
type GetResponsiveStylesParams (line 19) | type GetResponsiveStylesParams = Omit<
type GetResponsiveStylesReturnType (line 24) | type GetResponsiveStylesReturnType = {
type UseResponsiveQueryReturnType (line 29) | type UseResponsiveQueryReturnType = GetResponsiveStylesReturnType & {
FILE: src/utils/useResponsiveQuery/useStableMemo.ts
function useStableMemo (line 5) | function useStableMemo<T>(factory: () => T, deps: any[]) {
Copy disabled (too large)
Download .json
Condensed preview — 1192 files, each showing path, character count, and a content snippet. Download the .json file for the full structured content (14,977K chars).
[
{
"path": ".editorconfig",
"chars": 283,
"preview": "# EditorConfig helps developers define and maintain consistent\n# coding styles between different editors and IDEs\n# edit"
},
{
"path": ".eslintrc.json",
"chars": 419,
"preview": "{\n \"extends\": [\"@react-native-community\", \"prettier\"],\n \"rules\": {\n \"prettier/prettier\": [\n \"error\",\n {\n "
},
{
"path": ".github/ISSUE_TEMPLATE/bug_report.yml",
"chars": 2814,
"preview": "name: 'Bug Report'\ndescription: 'File a bug report'\nlabels: ['v3', 'bug', 'triage']\nbody:\n - type: 'markdown'\n attri"
},
{
"path": ".github/ISSUE_TEMPLATE/config.yml",
"chars": 149,
"preview": "blank_issues_enabled: false\ncontact_links:\n - name: Join us on Discord\n url: https://discord.gg/kcbuQWQv\n about: "
},
{
"path": ".github/ISSUE_TEMPLATE/feature_request.yml",
"chars": 1864,
"preview": "name: 'Feature Request'\ndescription: 'Request a feature or enhancement'\nlabels: ['v3', 'feature request', 'triage']\nbody"
},
{
"path": ".github/auto_assign.yml",
"chars": 715,
"preview": "# Set to true to add reviewers to pull requests\naddReviewers: true\n\n# Set to true to add assignees to pull requests\naddA"
},
{
"path": ".github/pull_request_template.md",
"chars": 734,
"preview": "<!-- Thanks for submitting a pull request! We appreciate you spending the time to work on these changes. Please provide "
},
{
"path": ".github/workflows/build.yml",
"chars": 762,
"preview": "name: Build\n\non:\n push:\n branches:\n - master\n\n\njobs:\n build:\n name: Build\n runs-on: ubuntu-latest\n st"
},
{
"path": ".gitignore",
"chars": 607,
"preview": "# OSX\n#\n.DS_Store\n\n# XDE\n.expo/\n\n# Xcode\n#\nbuild/\n*.pbxuser\n!default.pbxuser\n*.mode1v3\n!default.mode1v3\n*.mode2v3\n!defau"
},
{
"path": ".npmignore",
"chars": 230,
"preview": "# Dotfiles\n.babelrc\n.eslintignore\n.eslintrc.json\n.gitattributes\n_config.yml\n\n# Documents\nCONTRIBUTING.md\nISSUE_TEMPLATE."
},
{
"path": ".nvmrc",
"chars": 9,
"preview": "v16.13.0\n"
},
{
"path": ".prettierrc",
"chars": 236,
"preview": "{\n \"singleQuote\": true,\n \"jsxBracketSameLine\": false,\n \"useTabs\": false,\n \"eslintIntegration\": false,\n \"t"
},
{
"path": ".vscode/settings.json",
"chars": 645,
"preview": "{\n \"javascript.validate.enable\": true,\n \"eslint.format.enable\": false,\n \"eslint.run\": \"onType\",\n \"tslint.enable\": fa"
},
{
"path": "CODE_OF_CONDUCT.md",
"chars": 3231,
"preview": "# Contributor Covenant Code of Conduct\n\n## Our Pledge\n\nIn the interest of fostering an open and welcoming environment, w"
},
{
"path": "CONTRIBUTING.md",
"chars": 8185,
"preview": "# Contributing to NativeBase\n\nWe'd love for you to contribute to our source code and to make NativeBase even better than"
},
{
"path": "LICENSE",
"chars": 1090,
"preview": "The MIT License (MIT)\n\nCopyright (c) 2021 GeekyAnts India Pvt Ltd\n\nPermission is hereby granted, free of charge, to any "
},
{
"path": "README.md",
"chars": 13205,
"preview": "# ⛔️ DEPRECATED\n# NativeBase ↔ gluestack\n\n> 🚀 NativeBase is evolving into gluestack-ui! What was planned as NativeBase v"
},
{
"path": "RNBareExample/.buckconfig",
"chars": 114,
"preview": "\n[android]\n target = Google Inc.:Google APIs:23\n\n[maven_repositories]\n central = https://repo1.maven.org/maven2\n"
},
{
"path": "RNBareExample/.eslintrc.js",
"chars": 74,
"preview": "module.exports = {\n root: true,\n extends: '@react-native-community',\n};\n"
},
{
"path": "RNBareExample/.gitattributes",
"chars": 127,
"preview": "# Windows files should use crlf line endings\n# https://help.github.com/articles/dealing-with-line-endings/\n*.bat text eo"
},
{
"path": "RNBareExample/.gitignore",
"chars": 813,
"preview": "# OSX\n#\n.DS_Store\n\n# Xcode\n#\nbuild/\n*.pbxuser\n!default.pbxuser\n*.mode1v3\n!default.mode1v3\n*.mode2v3\n!default.mode2v3\n*.p"
},
{
"path": "RNBareExample/.prettierrc.js",
"chars": 144,
"preview": "module.exports = {\n bracketSpacing: false,\n jsxBracketSameLine: true,\n singleQuote: true,\n trailingComma: 'all',\n a"
},
{
"path": "RNBareExample/.watchmanconfig",
"chars": 2,
"preview": "{}"
},
{
"path": "RNBareExample/App.tsx",
"chars": 742,
"preview": "import React from 'react';\nimport {NativeBaseProvider, Box, Center} from 'native-base';\n\nconst config = {\n dependencies"
},
{
"path": "RNBareExample/_editorconfig",
"chars": 43,
"preview": "# Windows files\n[*.bat]\nend_of_line = crlf\n"
},
{
"path": "RNBareExample/android/app/_BUCK",
"chars": 1320,
"preview": "# To learn about Buck see [Docs](https://buckbuild.com/).\n# To run your application with Buck:\n# - install Buck\n# - `npm"
},
{
"path": "RNBareExample/android/app/build.gradle",
"chars": 8794,
"preview": "apply plugin: \"com.android.application\"\n\nimport com.android.build.OutputFile\n\n/**\n * The react.gradle file registers a t"
},
{
"path": "RNBareExample/android/app/build_defs.bzl",
"chars": 602,
"preview": "\"\"\"Helper definitions to glob .aar and .jar targets\"\"\"\n\ndef create_aar_targets(aarfiles):\n for aarfile in aarfiles:\n "
},
{
"path": "RNBareExample/android/app/proguard-rules.pro",
"chars": 435,
"preview": "# Add project specific ProGuard rules here.\n# By default, the flags in this file are appended to flags specified\n# in /u"
},
{
"path": "RNBareExample/android/app/src/debug/AndroidManifest.xml",
"chars": 495,
"preview": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<manifest xmlns:android=\"http://schemas.android.com/apk/res/android\"\n xmlns:to"
},
{
"path": "RNBareExample/android/app/src/debug/java/com/rnbareexample/ReactNativeFlipper.java",
"chars": 3268,
"preview": "/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * <p>This source code is licensed under the MIT license foun"
},
{
"path": "RNBareExample/android/app/src/main/AndroidManifest.xml",
"chars": 937,
"preview": "<manifest xmlns:android=\"http://schemas.android.com/apk/res/android\"\n package=\"com.rnbareexample\">\n\n <uses-permissio"
},
{
"path": "RNBareExample/android/app/src/main/java/com/rnbareexample/MainActivity.java",
"chars": 353,
"preview": "package com.rnbareexample;\n\nimport com.facebook.react.ReactActivity;\n\npublic class MainActivity extends ReactActivity {\n"
},
{
"path": "RNBareExample/android/app/src/main/java/com/rnbareexample/MainApplication.java",
"chars": 2661,
"preview": "package com.rnbareexample;\n\nimport android.app.Application;\nimport android.content.Context;\nimport com.facebook.react.Pa"
},
{
"path": "RNBareExample/android/app/src/main/res/values/strings.xml",
"chars": 76,
"preview": "<resources>\n <string name=\"app_name\">RNBareExample</string>\n</resources>\n"
},
{
"path": "RNBareExample/android/app/src/main/res/values/styles.xml",
"chars": 249,
"preview": "<resources>\n\n <!-- Base application theme. -->\n <style name=\"AppTheme\" parent=\"Theme.AppCompat.DayNight.NoActionBa"
},
{
"path": "RNBareExample/android/build.gradle",
"chars": 1038,
"preview": "// Top-level build file where you can add configuration options common to all sub-projects/modules.\n\nbuildscript {\n e"
},
{
"path": "RNBareExample/android/gradle/wrapper/gradle-wrapper.properties",
"chars": 200,
"preview": "distributionBase=GRADLE_USER_HOME\ndistributionPath=wrapper/dists\ndistributionUrl=https\\://services.gradle.org/distributi"
},
{
"path": "RNBareExample/android/gradle.properties",
"chars": 1277,
"preview": "# Project-wide Gradle settings.\n\n# IDE (e.g. Android Studio) users:\n# Gradle settings configured through the IDE *will o"
},
{
"path": "RNBareExample/android/gradlew",
"chars": 5766,
"preview": "#!/usr/bin/env sh\n\n#\n# Copyright 2015 the original author or authors.\n#\n# Licensed under the Apache License, Version 2.0"
},
{
"path": "RNBareExample/android/gradlew.bat",
"chars": 2763,
"preview": "@rem\r\n@rem Copyright 2015 the original author or authors.\r\n@rem\r\n@rem Licensed under the Apache License, Version 2.0 (th"
},
{
"path": "RNBareExample/android/settings.gradle",
"chars": 380,
"preview": "rootProject.name = 'RNBareExample'\ninclude ':react-native-linear-gradient'\nproject(':react-native-linear-gradient').proj"
},
{
"path": "RNBareExample/app.json",
"chars": 63,
"preview": "{\n \"name\": \"RNBareExample\",\n \"displayName\": \"RNBareExample\"\n}"
},
{
"path": "RNBareExample/babel.config.js",
"chars": 458,
"preview": "const path = require('path');\nconst pak = require('../package.json');\n\nmodule.exports = function (api) {\n api.cache(tru"
},
{
"path": "RNBareExample/index.js",
"chars": 183,
"preview": "/**\n * @format\n */\n\nimport {AppRegistry} from 'react-native';\nimport App from './App';\nimport {name as appName} from './"
},
{
"path": "RNBareExample/ios/Podfile",
"chars": 826,
"preview": "require_relative '../node_modules/react-native/scripts/react_native_pods'\nrequire_relative '../node_modules/@react-nativ"
},
{
"path": "RNBareExample/ios/RNBareExample/AppDelegate.h",
"chars": 196,
"preview": "#import <React/RCTBridgeDelegate.h>\n#import <UIKit/UIKit.h>\n\n@interface AppDelegate : UIResponder <UIApplicationDelegate"
},
{
"path": "RNBareExample/ios/RNBareExample/AppDelegate.m",
"chars": 2320,
"preview": "#import \"AppDelegate.h\"\n\n#import <React/RCTBridge.h>\n#import <React/RCTBundleURLProvider.h>\n#import <React/RCTRootView.h"
},
{
"path": "RNBareExample/ios/RNBareExample/Images.xcassets/AppIcon.appiconset/Contents.json",
"chars": 585,
"preview": "{\n \"images\" : [\n {\n \"idiom\" : \"iphone\",\n \"size\" : \"29x29\",\n \"scale\" : \"2x\"\n },\n {\n \"idiom\""
},
{
"path": "RNBareExample/ios/RNBareExample/Images.xcassets/Contents.json",
"chars": 63,
"preview": "{\n \"info\" : {\n \"version\" : 1,\n \"author\" : \"xcode\"\n }\n}\n"
},
{
"path": "RNBareExample/ios/RNBareExample/Info.plist",
"chars": 1814,
"preview": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/P"
},
{
"path": "RNBareExample/ios/RNBareExample/LaunchScreen.storyboard",
"chars": 4237,
"preview": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<document type=\"com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB\" version=\"3"
},
{
"path": "RNBareExample/ios/RNBareExample/main.m",
"chars": 200,
"preview": "#import <UIKit/UIKit.h>\n\n#import \"AppDelegate.h\"\n\nint main(int argc, char * argv[]) {\n @autoreleasepool {\n return UI"
},
{
"path": "RNBareExample/ios/RNBareExample.xcodeproj/project.pbxproj",
"chars": 32537,
"preview": "// !$*UTF8*$!\n{\n\tarchiveVersion = 1;\n\tclasses = {\n\t};\n\tobjectVersion = 54;\n\tobjects = {\n\n/* Begin PBXBuildFile section *"
},
{
"path": "RNBareExample/ios/RNBareExample.xcodeproj/xcshareddata/xcschemes/RNBareExample.xcscheme",
"chars": 3342,
"preview": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<Scheme\n LastUpgradeVersion = \"1210\"\n version = \"1.3\">\n <BuildAction\n "
},
{
"path": "RNBareExample/ios/RNBareExample.xcworkspace/contents.xcworkspacedata",
"chars": 231,
"preview": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<Workspace\n version = \"1.0\">\n <FileRef\n location = \"group:RNBareExample."
},
{
"path": "RNBareExample/ios/RNBareExample.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist",
"chars": 238,
"preview": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/P"
},
{
"path": "RNBareExample/ios/RNBareExampleTests/Info.plist",
"chars": 733,
"preview": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/P"
},
{
"path": "RNBareExample/ios/RNBareExampleTests/RNBareExampleTests.m",
"chars": 1795,
"preview": "#import <UIKit/UIKit.h>\n#import <XCTest/XCTest.h>\n\n#import <React/RCTLog.h>\n#import <React/RCTRootView.h>\n\n#define TIMEO"
},
{
"path": "RNBareExample/metro.config.js",
"chars": 1021,
"preview": "const path = require('path');\nconst blacklist = require('metro-config/src/defaults/blacklist');\nconst escape = require('"
},
{
"path": "RNBareExample/package.json",
"chars": 1184,
"preview": "{\n \"name\": \"RNBareExample\",\n \"version\": \"0.0.1\",\n \"private\": true,\n \"scripts\": {\n \"android\": \"react-native run-an"
},
{
"path": "RNBareExample/react-native.config.js",
"chars": 100,
"preview": "module.exports = {\n project: {\n ios: {},\n android: {},\n },\n assets: ['./assets/fonts'],\n};\n"
},
{
"path": "RNBareExample/tsconfig.json",
"chars": 5261,
"preview": "{\n \"compilerOptions\": {\n \"paths\": {\n \"native-base\": [\"../src/index\"]\n },\n /* Basic Options */\n \"target"
},
{
"path": "babel.config.js",
"chars": 167,
"preview": "module.exports = {\n presets: ['module:metro-react-native-babel-preset'],\n plugins:\n process.env.NODE_ENV === 'produ"
},
{
"path": "cli.js",
"chars": 1855,
"preview": "const { exec } = require('child_process');\nconst path = require('path');\nconst fs = require('fs');\n\n// Copy directory\nfu"
},
{
"path": "example/.eslintrc.json",
"chars": 383,
"preview": "{\n \"extends\": [\"@react-native-community\", \"prettier\"],\n \"rules\": {\n \"prettier/prettier\": [\n \"error\",\n {\n "
},
{
"path": "example/.nvmrc",
"chars": 8,
"preview": "v14.19.0"
},
{
"path": "example/App.tsx",
"chars": 1498,
"preview": "import React from 'react';\nimport StoryBookUI from './storybook';\nimport { useFonts } from 'expo-font';\n\nexport default "
},
{
"path": "example/__mocks__/@react-native-async-storage/async-storage.js",
"chars": 123,
"preview": "import DefaultValue from '@react-native-async-storage/async-storage/jest/async-storage-mock';\nexport default DefaultValu"
},
{
"path": "example/__mocks__/globalMock.js",
"chars": 430,
"preview": "jest.mock('global', () => ({\n ...global,\n WebSocket: function WebSocket() {},\n}));\n\njest.mock('react-native-keyboard-a"
},
{
"path": "example/app.json",
"chars": 500,
"preview": "{\n \"name\": \"NativeBaseExample\",\n \"displayName\": \"NativeBase Example\",\n \"packagerOpts\": {\n \"config\": \"met"
},
{
"path": "example/babel.config.js",
"chars": 466,
"preview": "const path = require('path');\nconst pak = require('../package.json');\n\nmodule.exports = function (api) {\n api.cache(tru"
},
{
"path": "example/jest-android.config.js",
"chars": 412,
"preview": "const config = {\n preset: 'jest-expo/android',\n transformIgnorePatterns: [\n '<rootDir>/../node_modules/(?!(jest-)?r"
},
{
"path": "example/jest-ios.config.js",
"chars": 408,
"preview": "const config = {\n preset: 'jest-expo/ios',\n transformIgnorePatterns: [\n '<rootDir>/../node_modules/(?!(jest-)?react"
},
{
"path": "example/jest.config.js",
"chars": 872,
"preview": "const config = {\n projects: [{ preset: 'jest-expo/web' }, { preset: 'jest-expo/node' }],\n transformIgnorePatterns: [\n "
},
{
"path": "example/metro.config.js",
"chars": 1035,
"preview": "const path = require('path');\nconst blacklist = require('metro-config/src/defaults/exclusionList');\nconst escape = requi"
},
{
"path": "example/nativebase.config.ts",
"chars": 210,
"preview": "import { INativebaseConfig } from 'native-base';\n\nexport default {\n dependencies: {\n 'linear-gradient': require('exp"
},
{
"path": "example/package.json",
"chars": 2125,
"preview": "{\n \"name\": \"native-base-example\",\n \"description\": \"Example app for NativeBase\",\n \"version\": \"0.0.3\",\n \"main\": \"node_"
},
{
"path": "example/patches/core-js+3.6.5.patch",
"chars": 14223,
"preview": "diff --git a/node_modules/core-js/modules/es.promise.js b/node_modules/core-js/modules/es.promise.js\nindex b79d2bc..e69d"
},
{
"path": "example/scripts/test.sh",
"chars": 1654,
"preview": "#!/bin/bash\n\nlowercase(){\n echo \"$1\" | sed \"y/ABCDEFGHIJKLMNOPQRSTUVWXYZ/abcdefghijklmnopqrstuvwxyz/\"\n}\n\nOS=`lowercas"
},
{
"path": "example/storybook/addons.ts",
"chars": 181,
"preview": "import '@storybook/addon-actions/register';\nimport '@storybook/addon-links/register';\nimport '@storybook/addon-knobs/reg"
},
{
"path": "example/storybook/index.ts",
"chars": 1016,
"preview": "// if you use expo remove this line\nimport { AppRegistry } from 'react-native';\n\nimport {\n getStorybookUI,\n configure,"
},
{
"path": "example/storybook/rn-addons.ts",
"chars": 104,
"preview": "import '@storybook/addon-ondevice-actions/register';\nimport '@storybook/addon-ondevice-knobs/register';\n"
},
{
"path": "example/storybook/stories/community-integrations/Formik/Basic.tsx",
"chars": 2128,
"preview": "import { Input, Button, FormControl } from 'native-base';\nimport React from 'react';\nimport { useFormik, FormikErrors } "
},
{
"path": "example/storybook/stories/community-integrations/Formik/index.tsx",
"chars": 384,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/community-integrations/ReactHookForm/DemoForm.tsx",
"chars": 7074,
"preview": "import {\n VStack,\n Input,\n Button,\n FormControl,\n Heading,\n Box,\n Text,\n Divider,\n HStack,\n TextArea,\n Avatar"
},
{
"path": "example/storybook/stories/community-integrations/ReactHookForm/NumberInput.tsx",
"chars": 1492,
"preview": "import {\n VStack,\n Button,\n FormControl,\n NumberInput,\n NumberInputField,\n NumberInputStepper,\n NumberIncrementSt"
},
{
"path": "example/storybook/stories/community-integrations/ReactHookForm/PinInput.tsx",
"chars": 1232,
"preview": "import { VStack, Button, FormControl, PinInput } from 'native-base';\nimport React from 'react';\nimport { useForm, Contro"
},
{
"path": "example/storybook/stories/community-integrations/ReactHookForm/RadioAndCheckbox.tsx",
"chars": 3169,
"preview": "import {\n VStack,\n Button,\n FormControl,\n Radio,\n Checkbox,\n Text,\n Icon,\n} from 'native-base';\nimport React from"
},
{
"path": "example/storybook/stories/community-integrations/ReactHookForm/Select.tsx",
"chars": 1778,
"preview": "import { VStack, Button, FormControl, Select, Icon } from 'native-base';\nimport React from 'react';\nimport { useForm, Co"
},
{
"path": "example/storybook/stories/community-integrations/ReactHookForm/Slider.tsx",
"chars": 1266,
"preview": "import { VStack, Button, FormControl, Slider } from 'native-base';\nimport React from 'react';\nimport { useForm, Controll"
},
{
"path": "example/storybook/stories/community-integrations/ReactHookForm/Switch.tsx",
"chars": 1098,
"preview": "import { VStack, Button, FormControl, Switch } from 'native-base';\nimport React from 'react';\nimport { useForm, Controll"
},
{
"path": "example/storybook/stories/community-integrations/ReactHookForm/Textarea.tsx",
"chars": 1221,
"preview": "import { VStack, Button, FormControl, TextArea } from 'native-base';\nimport React from 'react';\nimport { useForm, Contro"
},
{
"path": "example/storybook/stories/community-integrations/ReactHookForm/Usage.tsx",
"chars": 2593,
"preview": "import { VStack, Input, Button, FormControl } from 'native-base';\nimport React from 'react';\nimport { useForm, Controlle"
},
{
"path": "example/storybook/stories/community-integrations/ReactHookForm/index.tsx",
"chars": 1161,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/Allcomponents.tsx",
"chars": 3073,
"preview": "//@ts-nocheck\n//uncomment above line to test typing of components\nimport {\n Badge,\n IconButton,\n Alert,\n AspectRatio"
},
{
"path": "example/storybook/stories/components/Wrapper.tsx",
"chars": 4001,
"preview": "import React from 'react';\nimport {\n Box,\n NativeBaseProvider,\n useColorMode,\n IconButton,\n MoonIcon,\n ColorMode,\n"
},
{
"path": "example/storybook/stories/components/basic/FlatList/Basic.tsx",
"chars": 3184,
"preview": "import React from 'react';\nimport {\n Box,\n FlatList,\n Heading,\n Avatar,\n HStack,\n VStack,\n Text,\n Spacer,\n} from"
},
{
"path": "example/storybook/stories/components/basic/FlatList/index.tsx",
"chars": 373,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/basic/KeyboardAvoidingView/Basic.tsx",
"chars": 881,
"preview": "import React from 'react';\nimport {\n Input,\n KeyboardAvoidingView,\n Text,\n Button,\n VStack,\n Heading,\n Center,\n} "
},
{
"path": "example/storybook/stories/components/basic/KeyboardAvoidingView/Kitchensink-Basic.tsx",
"chars": 1017,
"preview": "import React from 'react';\nimport {\n Input,\n KeyboardAvoidingView,\n Text,\n Button,\n VStack,\n useBreakpointValue,\n}"
},
{
"path": "example/storybook/stories/components/basic/KeyboardAvoidingView/index.tsx",
"chars": 385,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/basic/ScrollView/Basic.tsx",
"chars": 1369,
"preview": "import React from 'react';\nimport { ScrollView, VStack, Center, useTheme, Heading } from 'native-base';\nexport const Exa"
},
{
"path": "example/storybook/stories/components/basic/ScrollView/index.tsx",
"chars": 377,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/basic/SectionList/Basic.tsx",
"chars": 1144,
"preview": "import React from 'react';\nimport { SectionList, Heading, Center } from 'native-base';\nexport const Example = () => {\n "
},
{
"path": "example/storybook/stories/components/basic/SectionList/index.tsx",
"chars": 378,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/basic/StatusBar/Basic.tsx",
"chars": 732,
"preview": "import React, { useState } from 'react';\nimport { StatusBar, Box, Text, Button } from 'native-base';\n\nexport const Examp"
},
{
"path": "example/storybook/stories/components/basic/StatusBar/index.tsx",
"chars": 374,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/basic/View/Basic.tsx",
"chars": 467,
"preview": "import React from 'react';\nimport { View, Text, Heading } from 'native-base';\nexport const Example = () => {\n return (\n"
},
{
"path": "example/storybook/stories/components/basic/View/index.tsx",
"chars": 369,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Accordion/AccessingInternalState.tsx",
"chars": 1641,
"preview": "import React from 'react';\nimport { Accordion, Box, Icon } from 'native-base';\nimport { MaterialCommunityIcons } from '@"
},
{
"path": "example/storybook/stories/components/composites/Accordion/Basic.tsx",
"chars": 1738,
"preview": "import React from 'react';\nimport { Accordion, Box } from 'native-base';\nexport const Example = () => {\n return (\n <"
},
{
"path": "example/storybook/stories/components/composites/Accordion/DefaultIndex.tsx",
"chars": 1759,
"preview": "import React from 'react';\nimport { Accordion, Box } from 'native-base';\nexport const Example = () => {\n return (\n <"
},
{
"path": "example/storybook/stories/components/composites/Accordion/ExpandedStyle.tsx",
"chars": 1306,
"preview": "import React from 'react';\nimport { Accordion, Box } from 'native-base';\nexport const Example = () => {\n return (\n <"
},
{
"path": "example/storybook/stories/components/composites/Accordion/Multiple.tsx",
"chars": 1737,
"preview": "import React from 'react';\nimport { Accordion, Box } from 'native-base';\nexport const Example = () => {\n return (\n <"
},
{
"path": "example/storybook/stories/components/composites/Accordion/Playground.tsx",
"chars": 1888,
"preview": "import React from 'react';\nimport { Accordion, Box } from 'native-base';\nimport { boolean } from '@storybook/addon-knobs"
},
{
"path": "example/storybook/stories/components/composites/Accordion/Toggle.tsx",
"chars": 1754,
"preview": "import React from 'react';\nimport { Accordion, Box } from 'native-base';\nexport const Example = () => {\n return (\n <"
},
{
"path": "example/storybook/stories/components/composites/Accordion/index.tsx",
"chars": 902,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Actionsheet/Composition.tsx",
"chars": 947,
"preview": "import React from 'react';\nimport {\n Button,\n Actionsheet,\n useDisclose,\n Box,\n Text,\n Center,\n} from 'native-base"
},
{
"path": "example/storybook/stories/components/composites/Actionsheet/CustomBackdrop.tsx",
"chars": 971,
"preview": "import React from 'react';\nimport { Button, Actionsheet, useDisclose, Box, Text } from 'native-base';\n\nexport function E"
},
{
"path": "example/storybook/stories/components/composites/Actionsheet/DisableOverlay.tsx",
"chars": 925,
"preview": "import React from 'react';\nimport {\n Button,\n Actionsheet,\n useDisclose,\n Box,\n Text,\n Center,\n} from 'native-base"
},
{
"path": "example/storybook/stories/components/composites/Actionsheet/Icon.tsx",
"chars": 1869,
"preview": "import React from 'react';\nimport {\n Button,\n Actionsheet,\n useDisclose,\n Icon,\n Box,\n Text,\n Center,\n} from 'nat"
},
{
"path": "example/storybook/stories/components/composites/Actionsheet/Usage.tsx",
"chars": 920,
"preview": "import React from 'react';\nimport {\n Button,\n Actionsheet,\n useDisclose,\n Text,\n Box,\n Center,\n} from 'native-base"
},
{
"path": "example/storybook/stories/components/composites/Actionsheet/index.tsx",
"chars": 777,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Alert/action.tsx",
"chars": 1539,
"preview": "import React from 'react';\nimport {\n Alert,\n Collapse,\n Button,\n VStack,\n HStack,\n IconButton,\n CloseIcon,\n Box,"
},
{
"path": "example/storybook/stories/components/composites/Alert/basic.tsx",
"chars": 1163,
"preview": "import React from 'react';\nimport {\n Alert,\n VStack,\n HStack,\n IconButton,\n CloseIcon,\n Box,\n Heading,\n Center,\n"
},
{
"path": "example/storybook/stories/components/composites/Alert/colorScheme.tsx",
"chars": 1256,
"preview": "import React from 'react';\nimport {\n Stack,\n Alert,\n Text,\n HStack,\n VStack,\n IconButton,\n Box,\n CloseIcon,\n} fr"
},
{
"path": "example/storybook/stories/components/composites/Alert/composition.tsx",
"chars": 2052,
"preview": "import React from 'react';\nimport {\n Alert,\n Box,\n IconButton,\n CloseIcon,\n HStack,\n VStack,\n Text,\n Center,\n} f"
},
{
"path": "example/storybook/stories/components/composites/Alert/index.tsx",
"chars": 1002,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Alert/knobEnabled.tsx",
"chars": 766,
"preview": "import React from 'react';\nimport { Alert, Box, CloseIcon, IconButton, Text } from 'native-base';\nimport { select } from"
},
{
"path": "example/storybook/stories/components/composites/Alert/status.tsx",
"chars": 1371,
"preview": "import React from 'react';\nimport {\n Stack,\n Alert,\n IconButton,\n HStack,\n VStack,\n CloseIcon,\n Text,\n} from 'nat"
},
{
"path": "example/storybook/stories/components/composites/Alert/usage.tsx",
"chars": 1163,
"preview": "import React from 'react';\nimport {\n Alert,\n VStack,\n HStack,\n IconButton,\n CloseIcon,\n Box,\n Text,\n Center,\n} f"
},
{
"path": "example/storybook/stories/components/composites/Alert/variant.tsx",
"chars": 1935,
"preview": "import React from 'react';\nimport {\n Stack,\n Alert,\n HStack,\n VStack,\n Text,\n Divider,\n ScrollView,\n} from 'nativ"
},
{
"path": "example/storybook/stories/components/composites/AlertDialog/Basic.tsx",
"chars": 1370,
"preview": "import React from 'react';\nimport { AlertDialog, Button, Center } from 'native-base';\n\nexport const Example = () => {\n "
},
{
"path": "example/storybook/stories/components/composites/AlertDialog/Transition.tsx",
"chars": 1429,
"preview": "import React from 'react';\nimport { AlertDialog, Button, Center } from 'native-base';\nimport type { TouchableOpacity } f"
},
{
"path": "example/storybook/stories/components/composites/AlertDialog/index.tsx",
"chars": 475,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/AppBar/AppBarExamples.tsx",
"chars": 3809,
"preview": "import React from 'react';\nimport {\n AppBar,\n IconButton,\n Icon,\n Text,\n HStack,\n VStack,\n Button,\n} from 'native"
},
{
"path": "example/storybook/stories/components/composites/AppBar/index.tsx",
"chars": 377,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/AspectRatio/Basic.tsx",
"chars": 239,
"preview": "import React from 'react';\nimport { AspectRatio, Box } from 'native-base';\n\nexport const Example = () => {\n return (\n "
},
{
"path": "example/storybook/stories/components/composites/AspectRatio/EmbedImage.tsx",
"chars": 511,
"preview": "import React from 'react';\nimport { AspectRatio, Image } from 'native-base';\nexport const Example = () => {\n return (\n "
},
{
"path": "example/storybook/stories/components/composites/AspectRatio/index.tsx",
"chars": 475,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Avatar/AvatarBadge.tsx",
"chars": 2269,
"preview": "import React from 'react';\nimport { Avatar, VStack } from 'native-base';\n\nexport const Example = () => {\n return (\n "
},
{
"path": "example/storybook/stories/components/composites/Avatar/AvatarGroup.tsx",
"chars": 2687,
"preview": "import React from 'react';\nimport { Avatar, Center } from 'native-base';\n\nexport const Example = () => {\n return (\n "
},
{
"path": "example/storybook/stories/components/composites/Avatar/Fallback.tsx",
"chars": 570,
"preview": "import React from 'react';\nimport { Avatar, HStack } from 'native-base';\n\nexport const Example = () => {\n return (\n "
},
{
"path": "example/storybook/stories/components/composites/Avatar/index.tsx",
"chars": 835,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Avatar/knobEnabled.tsx",
"chars": 632,
"preview": "import React from 'react';\nimport { Avatar } from 'native-base';\nimport { select, number, text } from '@storybook/addon-"
},
{
"path": "example/storybook/stories/components/composites/Avatar/size.tsx",
"chars": 2390,
"preview": "import React from 'react';\nimport { Avatar, VStack, Center } from 'native-base';\n\nexport const Example = () => {\n retur"
},
{
"path": "example/storybook/stories/components/composites/Avatar/usage.tsx",
"chars": 1343,
"preview": "import React from 'react';\nimport { Avatar, HStack } from 'native-base';\n\nexport const Example = () => {\n return (\n "
},
{
"path": "example/storybook/stories/components/composites/Badge/color.tsx",
"chars": 396,
"preview": "import React from 'react';\nimport { Badge, HStack } from 'native-base';\n\nexport function Example() {\n return (\n <HSt"
},
{
"path": "example/storybook/stories/components/composites/Badge/composition.tsx",
"chars": 671,
"preview": "import React from 'react';\nimport { Badge, Button, VStack, Box } from 'native-base';\n\nexport function Example() {\n retu"
},
{
"path": "example/storybook/stories/components/composites/Badge/icons.tsx",
"chars": 459,
"preview": "import React from 'react';\nimport { Badge, Stack, AddIcon } from 'native-base';\n\nexport const Example = () => {\n return"
},
{
"path": "example/storybook/stories/components/composites/Badge/index.tsx",
"chars": 811,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Badge/knobEnabled.tsx",
"chars": 343,
"preview": "import React from 'react';\nimport { Badge } from 'native-base';\nimport { select, text } from '@storybook/addon-knobs';\n\n"
},
{
"path": "example/storybook/stories/components/composites/Badge/usage.tsx",
"chars": 190,
"preview": "import React from 'react';\nimport { Badge, Box } from 'native-base';\n\nexport function Example() {\n return (\n <Box al"
},
{
"path": "example/storybook/stories/components/composites/Badge/variants.tsx",
"chars": 943,
"preview": "//@ts-nocheck\nimport React from 'react';\nimport { Badge, HStack, VStack, Box } from 'native-base';\n\nexport function Exam"
},
{
"path": "example/storybook/stories/components/composites/Breadcrumb/Basic.tsx",
"chars": 1016,
"preview": "import React from 'react';\nimport { Breadcrumb, Box, Heading } from 'native-base';\nexport const Example = () => {\n retu"
},
{
"path": "example/storybook/stories/components/composites/Breadcrumb/Collapsible.tsx",
"chars": 3050,
"preview": "import React, { useState } from 'react';\nimport { Breadcrumb, Box, Heading, HStack, Button } from 'native-base';\nimport "
},
{
"path": "example/storybook/stories/components/composites/Breadcrumb/ComponentSeparator.tsx",
"chars": 981,
"preview": "import React from 'react';\nimport { Breadcrumb, Box, Heading, Icon } from 'native-base';\nimport { Ionicons } from '@expo"
},
{
"path": "example/storybook/stories/components/composites/Breadcrumb/Composition.tsx",
"chars": 1932,
"preview": "import React from 'react';\nimport { Breadcrumb, Box, Heading, HStack } from 'native-base';\nimport {\n MaterialCommunityI"
},
{
"path": "example/storybook/stories/components/composites/Breadcrumb/Separators.tsx",
"chars": 929,
"preview": "import React from 'react';\nimport { Breadcrumb, Box, Heading } from 'native-base';\nexport const Example = () => {\n retu"
},
{
"path": "example/storybook/stories/components/composites/Breadcrumb/index.tsx",
"chars": 805,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Card/Basic.tsx",
"chars": 864,
"preview": "import React from 'react';\nimport { Card, HStack, Heading, Text, Spacer, Flex } from 'native-base';\n\nexport function Exa"
},
{
"path": "example/storybook/stories/components/composites/Card/index.tsx",
"chars": 371,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Center/Basic.tsx",
"chars": 343,
"preview": "import React from 'react';\nimport { Center } from 'native-base';\nexport function Example() {\n return (\n <Center>\n "
},
{
"path": "example/storybook/stories/components/composites/Center/SquareCircle.tsx",
"chars": 535,
"preview": "import React from 'react';\nimport { Circle, Square, Box, HStack, Icon } from 'native-base';\nimport { MaterialIcons } fro"
},
{
"path": "example/storybook/stories/components/composites/Center/WithIcons.tsx",
"chars": 540,
"preview": "import React from 'react';\nimport { Center, Box, HStack, Icon } from 'native-base';\nimport { MaterialIcons } from '@expo"
},
{
"path": "example/storybook/stories/components/composites/Center/index.tsx",
"chars": 571,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/CircularProgress/Basic.tsx",
"chars": 264,
"preview": "import React from 'react';\nimport { CircularProgress, Heading, Center } from 'native-base';\nexport const Example = () =>"
},
{
"path": "example/storybook/stories/components/composites/CircularProgress/ColorScheme.tsx",
"chars": 485,
"preview": "import React from 'react';\nimport { CircularProgress, Heading, Center, VStack } from 'native-base';\nexport const Example"
},
{
"path": "example/storybook/stories/components/composites/CircularProgress/Colors.tsx",
"chars": 344,
"preview": "import React from 'react';\nimport { CircularProgress, Heading, Center } from 'native-base';\nimport { text } from '@story"
},
{
"path": "example/storybook/stories/components/composites/CircularProgress/Indeterminate.tsx",
"chars": 328,
"preview": "import React from 'react';\nimport { CircularProgress, Center, Heading } from 'native-base';\nexport const Example = () =>"
},
{
"path": "example/storybook/stories/components/composites/CircularProgress/Label.tsx",
"chars": 272,
"preview": "import React from 'react';\nimport { CircularProgress, Heading, Center } from 'native-base';\nexport const Example = () =>"
},
{
"path": "example/storybook/stories/components/composites/CircularProgress/MinMax.tsx",
"chars": 556,
"preview": "import React from 'react';\nimport { CircularProgress, Heading, Center, Box, Text } from 'native-base';\nimport { number }"
},
{
"path": "example/storybook/stories/components/composites/CircularProgress/Sizes.tsx",
"chars": 443,
"preview": "import React from 'react';\nimport { CircularProgress, Heading, Center, VStack } from 'native-base';\nexport const Example"
},
{
"path": "example/storybook/stories/components/composites/CircularProgress/Thickness.tsx",
"chars": 276,
"preview": "import React from 'react';\nimport { CircularProgress, Heading, Center } from 'native-base';\nexport const Example = () =>"
},
{
"path": "example/storybook/stories/components/composites/CircularProgress/TrackColor.tsx",
"chars": 382,
"preview": "import React from 'react';\nimport { CircularProgress, Heading, Center } from 'native-base';\nimport { text } from '@story"
},
{
"path": "example/storybook/stories/components/composites/CircularProgress/index.tsx",
"chars": 969,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/CloseButton/Basic.tsx",
"chars": 130,
"preview": "import React from 'react';\nimport { CloseButton } from 'native-base';\nexport const Example = () => {\n return <CloseButt"
},
{
"path": "example/storybook/stories/components/composites/CloseButton/Sizes.tsx",
"chars": 312,
"preview": "import React from 'react';\nimport { CloseButton, HStack } from 'native-base';\nexport const Example = () => {\n return (\n"
},
{
"path": "example/storybook/stories/components/composites/CloseButton/index.tsx",
"chars": 425,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Code/Basic.tsx",
"chars": 133,
"preview": "import React from 'react';\nimport { Code } from 'native-base';\nexport const Example = () => {\n return <Code>Hello World"
},
{
"path": "example/storybook/stories/components/composites/Code/colors.tsx",
"chars": 377,
"preview": "import React from 'react';\nimport { Code, Stack } from 'native-base';\nexport const Example = () => {\n return (\n <Sta"
},
{
"path": "example/storybook/stories/components/composites/Code/index.tsx",
"chars": 423,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Collapse/Basic.tsx",
"chars": 846,
"preview": "import React from 'react';\nimport { Collapse, Stack, Heading, Button, Text } from 'native-base';\nexport const Example = "
},
{
"path": "example/storybook/stories/components/composites/Collapse/Callback.tsx",
"chars": 1386,
"preview": "import React from 'react';\nimport { Collapse, Stack, Heading, Button, Text } from 'native-base';\nexport const Example = "
},
{
"path": "example/storybook/stories/components/composites/Collapse/Duration.tsx",
"chars": 868,
"preview": "import React from 'react';\nimport { Collapse, Stack, Heading, Text, Button } from 'native-base';\n\nexport const Example ="
},
{
"path": "example/storybook/stories/components/composites/Collapse/index.tsx",
"chars": 546,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Container/Playground.tsx",
"chars": 766,
"preview": "import React from 'react';\nimport { Heading, Container, Text } from 'native-base';\nimport { boolean, text } from '@story"
},
{
"path": "example/storybook/stories/components/composites/Container/centeringChildren.tsx",
"chars": 565,
"preview": "import React from 'react';\nimport { Container, Text, Heading } from 'native-base';\nexport const Example = () => {\n retu"
},
{
"path": "example/storybook/stories/components/composites/Container/index.tsx",
"chars": 473,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Container/usage.tsx",
"chars": 543,
"preview": "import React from 'react';\nimport { Container, Text, Heading, Center } from 'native-base';\nexport function Example() {\n "
},
{
"path": "example/storybook/stories/components/composites/Divider/Basic.tsx",
"chars": 529,
"preview": "import React from 'react';\nimport { Divider, Heading, Box } from 'native-base';\n\nexport const Example = () => {\n return"
},
{
"path": "example/storybook/stories/components/composites/Divider/Composition.tsx",
"chars": 477,
"preview": "import React from 'react';\nimport { Divider, Flex, Text, Box } from 'native-base';\n\nexport const Example = () => {\n ret"
},
{
"path": "example/storybook/stories/components/composites/Divider/Orientation.tsx",
"chars": 708,
"preview": "import React from 'react';\nimport { Divider, Flex, Box, Heading } from 'native-base';\n\nexport const Example = () => {\n "
},
{
"path": "example/storybook/stories/components/composites/Divider/index.tsx",
"chars": 576,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Drawer/Basic.tsx",
"chars": 640,
"preview": "import React from 'react';\nimport { Box, Button, Drawer } from 'native-base';\nimport { useState } from 'react';\nimport {"
},
{
"path": "example/storybook/stories/components/composites/Drawer/index.tsx",
"chars": 356,
"preview": "import React from 'react';\nimport { storiesOf } from '@storybook/react-native';\nimport { withKnobs } from '@storybook/ad"
},
{
"path": "example/storybook/stories/components/composites/Fab/Basic.tsx",
"chars": 375,
"preview": "import { Fab, Icon, Box } from 'native-base';\nimport React from 'react';\nimport { AntDesign } from '@expo/vector-icons';"
},
{
"path": "example/storybook/stories/components/composites/Fab/CustomPosition.tsx",
"chars": 358,
"preview": "import { Fab, Icon, Box } from 'native-base';\nimport React from 'react';\nimport { AntDesign } from '@expo/vector-icons';"
},
{
"path": "example/storybook/stories/components/composites/Fab/DocsBasic.tsx",
"chars": 600,
"preview": "import { Fab, Icon, Box, Center } from 'native-base';\nimport React from 'react';\nimport { AntDesign } from '@expo/vector"
}
]
// ... and 992 more files (download for full content)
About this extraction
This page contains the full source code of the GeekyAnts/NativeBase GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 1192 files (13.2 MB), approximately 3.5M tokens, and a symbol index with 711 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.