Initial commit

.gitignore

@@ -0,0 +1,102 @@
+# Xcode
+#
+# gitignore contributors: remember to update Global/Xcode.gitignore, Objective-C.gitignore & Swift.gitignore
+
+## Build generated
+build/
+DerivedData/
+
+## Various settings
+*.pbxuser
+!default.pbxuser
+*.mode1v3
+!default.mode1v3
+*.mode2v3
+!default.mode2v3
+*.perspectivev3
+!default.perspectivev3
+xcuserdata/
+
+## Other
+*.moved-aside
+*.xcuserstate
+
+## Obj-C/Swift specific
+*.hmap
+*.ipa
+*.dSYM.zip
+*.dSYM
+
+# CocoaPods
+#
+# We recommend against adding the Pods directory to your .gitignore. However
+# you should judge for yourself, the pros and cons are mentioned at:
+# https://guides.cocoapods.org/using/using-cocoapods.html#should-i-check-the-pods-directory-into-source-control
+#
+# Pods/
+
+# Carthage
+#
+# Add this line if you want to avoid checking in source code from Carthage dependencies.
+# Carthage/Checkouts
+
+Carthage/Build
+
+# 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://github.com/fastlane/fastlane/blob/master/fastlane/docs/Gitignore.md
+
+fastlane/report.xml
+fastlane/screenshots
+
+#Code Injection
+#
+# After new code Injection tools there's a generated folder /iOSInjectionProject
+# https://github.com/johnno1962/injectionforxcode
+
+iOSInjectionProject/
+
+# 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
+project.xcworkspace
+
+# Android/IJ
+#
+*.iml
+.idea
+.gradle
+local.properties
+
+# node.js
+#
+node_modules/
+npm-debug.log
+
+# BUCK
+buck-out/
+\.buckd/
+android/app/libs
+*.keystore

.npmignore

@@ -0,0 +1 @@
+examples/

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2016 Wix.com
+
+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.

README.md

@@ -0,0 +1,25 @@
+# React Native Custom Input Controller
+
+Presents a React component as input view of text elements.
+
+<img src="Supplementals/example.gif" />
+
+##Using
+
+Add the project to your `package.json`, run `npm install` and link the iOS project in your own project.
+
+```js
+<TextInput
+	ref='myTextInput'
+	style={{height: 40, borderColor: 'gray', borderWidth: 1, padding: 8, margin: 20}}
+/>
+```
+
+Obtain the react tag of your text input, and call `CustomInputController.presentCustomInputView` with the react tag and the name of your custom input component:
+
+```js
+const reactTag = ReactNative.findNodeHandle(this.refs['myTextInput']);
+CustomInputController.presentCustomInputView(reactTag, 'CustomInput');
+```
+
+See `examples/AwesomeProject_Chat` for an example.

examples/AwesomeProject_Chat/.babelrc

@@ -0,0 +1,3 @@
+{
+"presets": ["react-native"]
+}

examples/AwesomeProject_Chat/.buckconfig

@@ -0,0 +1,6 @@
+
+[android]
+  target = Google Inc.:Google APIs:23
+
+[maven_repositories]
+  central = https://repo1.maven.org/maven2

examples/AwesomeProject_Chat/.flowconfig

@@ -0,0 +1,59 @@
+[ignore]
+
+# We fork some components by platform.
+.*/*[.]android.js
+
+# Ignore templates with `@flow` in header
+.*/local-cli/generator.*
+
+# Ignore malformed json
+.*/node_modules/y18n/test/.*\.json
+
+# Ignore the website subdir
+<PROJECT_ROOT>/website/.*
+
+# Ignore BUCK generated dirs
+<PROJECT_ROOT>/\.buckd/
+
+# Ignore unexpected extra @providesModule
+.*/node_modules/commoner/test/source/widget/share.js
+.*/node_modules/.*/node_modules/fbjs/.*
+
+# Ignore duplicate module providers
+# For RN Apps installed via npm, "Libraries" folder is inside node_modules/react-native but in the source repo it is in the root
+.*/Libraries/react-native/React.js
+.*/Libraries/react-native/ReactNative.js
+.*/node_modules/jest-runtime/build/__tests__/.*
+
+[include]
+
+[libs]
+node_modules/react-native/Libraries/react-native/react-native-interface.js
+node_modules/react-native/flow
+flow/
+
+[options]
+module.system=haste
+
+esproposal.class_static_fields=enable
+esproposal.class_instance_fields=enable
+
+experimental.strict_type_args=true
+
+munge_underscores=true
+
+module.name_mapper='^image![a-zA-Z0-9$_-]+$' -> 'GlobalImageStub'
+module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
+
+suppress_type=$FlowIssue
+suppress_type=$FlowFixMe
+suppress_type=$FixMe
+
+suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(3[0-3]\\|[1-2][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
+suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(3[0-3]\\|1[0-9]\\|[1-2][0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
+suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
+
+unsafe.enable_getters_and_setters=true
+
+[version]
+^0.33.0

examples/AwesomeProject_Chat/.watchmanconfig

@@ -0,0 +1 @@
+{}

examples/AwesomeProject_Chat/__tests__/index.android.js

@@ -0,0 +1,12 @@
+import 'react-native';
+import React from 'react';
+import Index from '../index.android.js';
+
+// Note: test renderer must be required after react-native.
+import renderer from 'react-test-renderer';
+
+it('renders correctly', () => {
+  const tree = renderer.create(
+    <Index />
+  );
+});

examples/AwesomeProject_Chat/__tests__/index.ios.js

@@ -0,0 +1,12 @@
+import 'react-native';
+import React from 'react';
+import Index from '../index.ios.js';
+
+// Note: test renderer must be required after react-native.
+import renderer from 'react-test-renderer';
+
+it('renders correctly', () => {
+  const tree = renderer.create(
+    <Index />
+  );
+});

examples/AwesomeProject_Chat/index.ios.js

@@ -0,0 +1,70 @@
+/**
+ * Sample React Native App
+ * https://github.com/facebook/react-native
+ * @flow
+ */
+
+import _ from 'lodash';
+import React, { Component } from 'react';
+import ReactNative, {
+  AppRegistry,
+  StyleSheet,
+  Text,
+  View,
+  TextInput,
+  TouchableOpacity
+} from 'react-native';
+
+import CustomInputController from 'react-native-custom-input-controller';
+
+export default class AwesomeProject extends Component {
+  render() {
+    return (
+      <View style={styles.container}>
+        <TextInput
+          ref='myTextInput'
+          style={{height: 40, borderColor: 'gray', borderWidth: 1, padding: 8, margin: 20}}
+        />
+        <TouchableOpacity onPress={() => this._onPressButton() }>
+          <Text>Change</Text>
+        </TouchableOpacity>
+      </View>
+    );
+  }
+
+  _onPressButton() {
+    const reactTag = ReactNative.findNodeHandle(this.refs['myTextInput']);
+    CustomInputController.presentCustomInputView(reactTag, 'CustomInput');
+  }
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: '#F5FCFF',
+  }
+});
+
+class CustomInput extends Component {
+  getRandomColor() {
+    const letters = '0123456789ABCDEF'.split('');
+    let color = '#';
+
+    for (var i = 0; i < 6; i++ ) {
+      color += letters[Math.floor(Math.random() * 16)];
+    }
+
+    return color;
+  };
+
+  render() {
+    return (
+      <View style={{flex: 1, backgroundColor: this.getRandomColor()}} />
+    )
+  }
+}
+
+AppRegistry.registerComponent('CustomInput', () => CustomInput);
+AppRegistry.registerComponent('AwesomeProject', () => AwesomeProject);