{"action":"created","comment":{"url":"https://api.github.com/repos/text-mask/text-mask/pulls/comments/79292416","id":79292416,"diff_hunk":"@@ -0,0 +1,128 @@\n+import React, {PropTypes, Component} from 'react'\n+import {TextInput} from 'react-native'\n+import createTextMaskInputElement from '../../core/src/createTextMaskInputElement.js'\n+import createTextInputProxy from './createTextInputProxy.js'\n+\n+class MaskedInput extends Component {\n+  constructor(props, context) {\n+    super(props, context)\n+\n+    this.textInputProxy = createTextInputProxy()\n+    this.textMaskInputElement = createTextMaskInputElement({\n+      inputElement: this.textInputProxy,\n+      ...props\n+    })\n+\n+    this.textMaskInputElement.update()\n+\n+    this.onSelectionChange = this.onSelectionChange.bind(this)\n+    this.onChange = this.onChange.bind(this)\n+    this.onChangeText = this.onChangeText.bind(this)\n+  }\n+\n+  render() {\n+    const props = {...this.props}\n+\n+    delete props.mask\n+    delete props.guide\n+    delete props.pipe\n+    delete props.placeholderChar\n+    delete props.onAccept\n+    delete props.onReject\n+    delete props.keepCharPositions\n+    delete props.value\n+\n+    return (\n+      <TextInput\n+        {...props}\n+        ref={(ref) => (this._inputRef = ref)}\n+        defaultValue={this.textInputProxy.value}\n+        onSelectionChange={this.onSelectionChange}\n+        onChange={this.onChange}\n+      />\n+    )\n+  }\n+\n+  onSelectionChange(event) {\n+    // We do all the work here because we don't have the new cursor selection in the onChange event\n+    // This is different than how the web works where the new cursor position is sync\n+    const {nativeEvent: {selection}} = event\n+\n+    this.textInputProxy.selectionStart = selection.start\n+\n+    if (typeof this.props.onSelectionChange === 'function') {\n+      this.props.onSelectionChange(event)\n+    }\n+    // When we set the new selection this callback is called but to the wrong selection\n+    // We want to skip it\n+    if (this.skipNext) {\n+      this.skipNext = false\n+      return\n+    }\n+\n+    // If someone highlights we need to set it and update our new selection\n+    if (this.changeValue === undefined) {\n+      this.nextSelection = selection\n+      this._inputRef._inputRef.setNativeProps({\n+        selection\n+      })\n+      return\n+    }\n+\n+\n+    this.textMaskInputElement.update() // Will mutate `this.textInputProxy`\n+\n+    this.nextSelection = {\n+      start: this.textInputProxy.selectionStart,\n+      end: this.textInputProxy.selectionStart,\n+    }\n+\n+    this._inputRef._inputRef.setNativeProps({\n+      text: this.textInputProxy.value,\n+      selection: {\n+        start: this.textInputProxy.selectionStart,\n+        end: this.textInputProxy.selectionStart\n+      }\n+    })\n+\n+    this.skipNext = true\n+    this.changeValue = undefined\n+  }\n+\n+  onChange(event) {\n+    // This will drive new value being set and selection set in onSelectionChange\n+    this.changeValue = event.nativeEvent.text\n+\n+    this.textMaskInputElement.update()\n+\n+    event.nativeEvent.text = this.textInputProxy.value\n+\n+    if (typeof this.props.onChange === 'function') {\n+      this.props.onChange(event)\n+    }\n+\n+    if (typeof this.props.onChangeText === 'function') {\n+      this.props.onChangeText(this.textInputProxy.value)\n+    }","path":"reactNative/src/reactNativeTextMask.jsx","position":106,"original_position":106,"commit_id":"5796df36a94418bb7464ecaa3f26beb5a2894636","original_commit_id":"5796df36a94418bb7464ecaa3f26beb5a2894636","user":{"login":"browniefed","id":1714673,"avatar_url":"https://avatars.githubusercontent.com/u/1714673?v=3","gravatar_id":"","url":"https://api.github.com/users/browniefed","html_url":"https://github.com/browniefed","followers_url":"https://api.github.com/users/browniefed/followers","following_url":"https://api.github.com/users/browniefed/following{/other_user}","gists_url":"https://api.github.com/users/browniefed/gists{/gist_id}","starred_url":"https://api.github.com/users/browniefed/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/browniefed/subscriptions","organizations_url":"https://api.github.com/users/browniefed/orgs","repos_url":"https://api.github.com/users/browniefed/repos","events_url":"https://api.github.com/users/browniefed/events{/privacy}","received_events_url":"https://api.github.com/users/browniefed/received_events","type":"User","site_admin":false},"body":"This should be called first.","created_at":"2016-09-17T21:29:26Z","updated_at":"2016-09-17T21:29:26Z","html_url":"https://github.com/text-mask/text-mask/pull/222#discussion_r79292416","pull_request_url":"https://api.github.com/repos/text-mask/text-mask/pulls/222","_links":{"self":{"href":"https://api.github.com/repos/text-mask/text-mask/pulls/comments/79292416"},"html":{"href":"https://github.com/text-mask/text-mask/pull/222#discussion_r79292416"},"pull_request":{"href":"https://api.github.com/repos/text-mask/text-mask/pulls/222"}}},"pull_request":{"url":"https://api.github.com/repos/text-mask/text-mask/pulls/222","id":85685215,"html_url":"https://github.com/text-mask/text-mask/pull/222","diff_url":"https://github.com/text-mask/text-mask/pull/222.diff","patch_url":"https://github.com/text-mask/text-mask/pull/222.patch","issue_url":"https://api.github.com/repos/text-mask/text-mask/issues/222","number":222,"state":"open","locked":false,"title":"React Native input proxy","user":{"login":"msafi","id":4027731,"avatar_url":"https://avatars.githubusercontent.com/u/4027731?v=3","gravatar_id":"","url":"https://api.github.com/users/msafi","html_url":"https://github.com/msafi","followers_url":"https://api.github.com/users/msafi/followers","following_url":"https://api.github.com/users/msafi/following{/other_user}","gists_url":"https://api.github.com/users/msafi/gists{/gist_id}","starred_url":"https://api.github.com/users/msafi/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/msafi/subscriptions","organizations_url":"https://api.github.com/users/msafi/orgs","repos_url":"https://api.github.com/users/msafi/repos","events_url":"https://api.github.com/users/msafi/events{/privacy}","received_events_url":"https://api.github.com/users/msafi/received_events","type":"User","site_admin":false},"body":"@browniefed Here's kinda what I mean. Again, this is inspired by what you said about the `inputElement` being a state vehicle.","created_at":"2016-09-17T19:53:39Z","updated_at":"2016-09-17T21:29:26Z","closed_at":null,"merged_at":null,"merge_commit_sha":"c0cd73039c6f0797eddd17949bdd4ba723b20387","assignee":null,"assignees":[],"milestone":null,"commits_url":"https://api.github.com/repos/text-mask/text-mask/pulls/222/commits","review_comments_url":"https://api.github.com/repos/text-mask/text-mask/pulls/222/comments","review_comment_url":"https://api.github.com/repos/text-mask/text-mask/pulls/comments{/number}","comments_url":"https://api.github.com/repos/text-mask/text-mask/issues/222/comments","statuses_url":"https://api.github.com/repos/text-mask/text-mask/statuses/5796df36a94418bb7464ecaa3f26beb5a2894636","head":{"label":"text-mask:react-native-input-proxy","ref":"react-native-input-proxy","sha":"5796df36a94418bb7464ecaa3f26beb5a2894636","user":{"login":"text-mask","id":21117230,"avatar_url":"https://avatars.githubusercontent.com/u/21117230?v=3","gravatar_id":"","url":"https://api.github.com/users/text-mask","html_url":"https://github.com/text-mask","followers_url":"https://api.github.com/users/text-mask/followers","following_url":"https://api.github.com/users/text-mask/following{/other_user}","gists_url":"https://api.github.com/users/text-mask/gists{/gist_id}","starred_url":"https://api.github.com/users/text-mask/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/text-mask/subscriptions","organizations_url":"https://api.github.com/users/text-mask/orgs","repos_url":"https://api.github.com/users/text-mask/repos","events_url":"https://api.github.com/users/text-mask/events{/privacy}","received_events_url":"https://api.github.com/users/text-mask/received_events","type":"Organization","site_admin":false},"repo":{"id":50213667,"name":"text-mask","full_name":"text-mask/text-mask","owner":{"login":"text-mask","id":21117230,"avatar_url":"https://avatars.githubusercontent.com/u/21117230?v=3","gravatar_id":"","url":"https://api.github.com/users/text-mask","html_url":"https://github.com/text-mask","followers_url":"https://api.github.com/users/text-mask/followers","following_url":"https://api.github.com/users/text-mask/following{/other_user}","gists_url":"https://api.github.com/users/text-mask/gists{/gist_id}","starred_url":"https://api.github.com/users/text-mask/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/text-mask/subscriptions","organizations_url":"https://api.github.com/users/text-mask/orgs","repos_url":"https://api.github.com/users/text-mask/repos","events_url":"https://api.github.com/users/text-mask/events{/privacy}","received_events_url":"https://api.github.com/users/text-mask/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/text-mask/text-mask","description":"Input mask for React, Angular, Ember, Vue, & plain JavaScript","fork":false,"url":"https://api.github.com/repos/text-mask/text-mask","forks_url":"https://api.github.com/repos/text-mask/text-mask/forks","keys_url":"https://api.github.com/repos/text-mask/text-mask/keys{/key_id}","collaborators_url":"https://api.github.com/repos/text-mask/text-mask/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/text-mask/text-mask/teams","hooks_url":"https://api.github.com/repos/text-mask/text-mask/hooks","issue_events_url":"https://api.github.com/repos/text-mask/text-mask/issues/events{/number}","events_url":"https://api.github.com/repos/text-mask/text-mask/events","assignees_url":"https://api.github.com/repos/text-mask/text-mask/assignees{/user}","branches_url":"https://api.github.com/repos/text-mask/text-mask/branches{/branch}","tags_url":"https://api.github.com/repos/text-mask/text-mask/tags","blobs_url":"https://api.github.com/repos/text-mask/text-mask/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/text-mask/text-mask/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/text-mask/text-mask/git/refs{/sha}","trees_url":"https://api.github.com/repos/text-mask/text-mask/git/trees{/sha}","statuses_url":"https://api.github.com/repos/text-mask/text-mask/statuses/{sha}","languages_url":"https://api.github.com/repos/text-mask/text-mask/languages","stargazers_url":"https://api.github.com/repos/text-mask/text-mask/stargazers","contributors_url":"https://api.github.com/repos/text-mask/text-mask/contributors","subscribers_url":"https://api.github.com/repos/text-mask/text-mask/subscribers","subscription_url":"https://api.github.com/repos/text-mask/text-mask/subscription","commits_url":"https://api.github.com/repos/text-mask/text-mask/commits{/sha}","git_commits_url":"https://api.github.com/repos/text-mask/text-mask/git/commits{/sha}","comments_url":"https://api.github.com/repos/text-mask/text-mask/comments{/number}","issue_comment_url":"https://api.github.com/repos/text-mask/text-mask/issues/comments{/number}","contents_url":"https://api.github.com/repos/text-mask/text-mask/contents/{+path}","compare_url":"https://api.github.com/repos/text-mask/text-mask/compare/{base}...{head}","merges_url":"https://api.github.com/repos/text-mask/text-mask/merges","archive_url":"https://api.github.com/repos/text-mask/text-mask/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/text-mask/text-mask/downloads","issues_url":"https://api.github.com/repos/text-mask/text-mask/issues{/number}","pulls_url":"https://api.github.com/repos/text-mask/text-mask/pulls{/number}","milestones_url":"https://api.github.com/repos/text-mask/text-mask/milestones{/number}","notifications_url":"https://api.github.com/repos/text-mask/text-mask/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/text-mask/text-mask/labels{/name}","releases_url":"https://api.github.com/repos/text-mask/text-mask/releases{/id}","deployments_url":"https://api.github.com/repos/text-mask/text-mask/deployments","created_at":"2016-01-22T23:19:59Z","updated_at":"2016-09-17T20:03:22Z","pushed_at":"2016-09-17T21:10:40Z","git_url":"git://github.com/text-mask/text-mask.git","ssh_url":"git@github.com:text-mask/text-mask.git","clone_url":"https://github.com/text-mask/text-mask.git","svn_url":"https://github.com/text-mask/text-mask","homepage":"https://text-mask.github.io/text-mask/","size":3393,"stargazers_count":923,"watchers_count":923,"language":"JavaScript","has_issues":true,"has_downloads":true,"has_wiki":true,"has_pages":true,"forks_count":50,"mirror_url":null,"open_issues_count":10,"forks":50,"open_issues":10,"watchers":923,"default_branch":"master"}},"base":{"label":"text-mask:master","ref":"master","sha":"97930cc1bd7d0b5aab6fdb97514cd2b48e9c53b5","user":{"login":"text-mask","id":21117230,"avatar_url":"https://avatars.githubusercontent.com/u/21117230?v=3","gravatar_id":"","url":"https://api.github.com/users/text-mask","html_url":"https://github.com/text-mask","followers_url":"https://api.github.com/users/text-mask/followers","following_url":"https://api.github.com/users/text-mask/following{/other_user}","gists_url":"https://api.github.com/users/text-mask/gists{/gist_id}","starred_url":"https://api.github.com/users/text-mask/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/text-mask/subscriptions","organizations_url":"https://api.github.com/users/text-mask/orgs","repos_url":"https://api.github.com/users/text-mask/repos","events_url":"https://api.github.com/users/text-mask/events{/privacy}","received_events_url":"https://api.github.com/users/text-mask/received_events","type":"Organization","site_admin":false},"repo":{"id":50213667,"name":"text-mask","full_name":"text-mask/text-mask","owner":{"login":"text-mask","id":21117230,"avatar_url":"https://avatars.githubusercontent.com/u/21117230?v=3","gravatar_id":"","url":"https://api.github.com/users/text-mask","html_url":"https://github.com/text-mask","followers_url":"https://api.github.com/users/text-mask/followers","following_url":"https://api.github.com/users/text-mask/following{/other_user}","gists_url":"https://api.github.com/users/text-mask/gists{/gist_id}","starred_url":"https://api.github.com/users/text-mask/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/text-mask/subscriptions","organizations_url":"https://api.github.com/users/text-mask/orgs","repos_url":"https://api.github.com/users/text-mask/repos","events_url":"https://api.github.com/users/text-mask/events{/privacy}","received_events_url":"https://api.github.com/users/text-mask/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/text-mask/text-mask","description":"Input mask for React, Angular, Ember, Vue, & plain JavaScript","fork":false,"url":"https://api.github.com/repos/text-mask/text-mask","forks_url":"https://api.github.com/repos/text-mask/text-mask/forks","keys_url":"https://api.github.com/repos/text-mask/text-mask/keys{/key_id}","collaborators_url":"https://api.github.com/repos/text-mask/text-mask/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/text-mask/text-mask/teams","hooks_url":"https://api.github.com/repos/text-mask/text-mask/hooks","issue_events_url":"https://api.github.com/repos/text-mask/text-mask/issues/events{/number}","events_url":"https://api.github.com/repos/text-mask/text-mask/events","assignees_url":"https://api.github.com/repos/text-mask/text-mask/assignees{/user}","branches_url":"https://api.github.com/repos/text-mask/text-mask/branches{/branch}","tags_url":"https://api.github.com/repos/text-mask/text-mask/tags","blobs_url":"https://api.github.com/repos/text-mask/text-mask/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/text-mask/text-mask/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/text-mask/text-mask/git/refs{/sha}","trees_url":"https://api.github.com/repos/text-mask/text-mask/git/trees{/sha}","statuses_url":"https://api.github.com/repos/text-mask/text-mask/statuses/{sha}","languages_url":"https://api.github.com/repos/text-mask/text-mask/languages","stargazers_url":"https://api.github.com/repos/text-mask/text-mask/stargazers","contributors_url":"https://api.github.com/repos/text-mask/text-mask/contributors","subscribers_url":"https://api.github.com/repos/text-mask/text-mask/subscribers","subscription_url":"https://api.github.com/repos/text-mask/text-mask/subscription","commits_url":"https://api.github.com/repos/text-mask/text-mask/commits{/sha}","git_commits_url":"https://api.github.com/repos/text-mask/text-mask/git/commits{/sha}","comments_url":"https://api.github.com/repos/text-mask/text-mask/comments{/number}","issue_comment_url":"https://api.github.com/repos/text-mask/text-mask/issues/comments{/number}","contents_url":"https://api.github.com/repos/text-mask/text-mask/contents/{+path}","compare_url":"https://api.github.com/repos/text-mask/text-mask/compare/{base}...{head}","merges_url":"https://api.github.com/repos/text-mask/text-mask/merges","archive_url":"https://api.github.com/repos/text-mask/text-mask/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/text-mask/text-mask/downloads","issues_url":"https://api.github.com/repos/text-mask/text-mask/issues{/number}","pulls_url":"https://api.github.com/repos/text-mask/text-mask/pulls{/number}","milestones_url":"https://api.github.com/repos/text-mask/text-mask/milestones{/number}","notifications_url":"https://api.github.com/repos/text-mask/text-mask/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/text-mask/text-mask/labels{/name}","releases_url":"https://api.github.com/repos/text-mask/text-mask/releases{/id}","deployments_url":"https://api.github.com/repos/text-mask/text-mask/deployments","created_at":"2016-01-22T23:19:59Z","updated_at":"2016-09-17T20:03:22Z","pushed_at":"2016-09-17T21:10:40Z","git_url":"git://github.com/text-mask/text-mask.git","ssh_url":"git@github.com:text-mask/text-mask.git","clone_url":"https://github.com/text-mask/text-mask.git","svn_url":"https://github.com/text-mask/text-mask","homepage":"https://text-mask.github.io/text-mask/","size":3393,"stargazers_count":923,"watchers_count":923,"language":"JavaScript","has_issues":true,"has_downloads":true,"has_wiki":true,"has_pages":true,"forks_count":50,"mirror_url":null,"open_issues_count":10,"forks":50,"open_issues":10,"watchers":923,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/text-mask/text-mask/pulls/222"},"html":{"href":"https://github.com/text-mask/text-mask/pull/222"},"issue":{"href":"https://api.github.com/repos/text-mask/text-mask/issues/222"},"comments":{"href":"https://api.github.com/repos/text-mask/text-mask/issues/222/comments"},"review_comments":{"href":"https://api.github.com/repos/text-mask/text-mask/pulls/222/comments"},"review_comment":{"href":"https://api.github.com/repos/text-mask/text-mask/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/text-mask/text-mask/pulls/222/commits"},"statuses":{"href":"https://api.github.com/repos/text-mask/text-mask/statuses/5796df36a94418bb7464ecaa3f26beb5a2894636"}}}}
{"actor":{"display_login":"browniefed"}}