From c60d0e7392fc708e961614d6b756a045de74f458 Mon Sep 17 00:00:00 2001 From: Shin'ya Ueoka Date: Tue, 30 Apr 2019 14:00:07 +0900 Subject: Rename .js/.jsx to .ts/.tsx --- src/settings/components/form/BlacklistForm.jsx | 63 ----------------- src/settings/components/form/BlacklistForm.tsx | 63 +++++++++++++++++ src/settings/components/form/KeymapsForm.jsx | 51 -------------- src/settings/components/form/KeymapsForm.tsx | 51 ++++++++++++++ src/settings/components/form/PropertiesForm.jsx | 65 ----------------- src/settings/components/form/PropertiesForm.tsx | 65 +++++++++++++++++ src/settings/components/form/SearchForm.jsx | 92 ------------------------- src/settings/components/form/SearchForm.tsx | 92 +++++++++++++++++++++++++ 8 files changed, 271 insertions(+), 271 deletions(-) delete mode 100644 src/settings/components/form/BlacklistForm.jsx create mode 100644 src/settings/components/form/BlacklistForm.tsx delete mode 100644 src/settings/components/form/KeymapsForm.jsx create mode 100644 src/settings/components/form/KeymapsForm.tsx delete mode 100644 src/settings/components/form/PropertiesForm.jsx create mode 100644 src/settings/components/form/PropertiesForm.tsx delete mode 100644 src/settings/components/form/SearchForm.jsx create mode 100644 src/settings/components/form/SearchForm.tsx (limited to 'src/settings/components/form') diff --git a/src/settings/components/form/BlacklistForm.jsx b/src/settings/components/form/BlacklistForm.jsx deleted file mode 100644 index c470758..0000000 --- a/src/settings/components/form/BlacklistForm.jsx +++ /dev/null @@ -1,63 +0,0 @@ -import './BlacklistForm.scss'; -import AddButton from '../ui/AddButton'; -import DeleteButton from '../ui/DeleteButton'; -import React from 'react'; -import PropTypes from 'prop-types'; - -class BlacklistForm extends React.Component { - - render() { - return
- { - this.props.value.map((url, index) => { - return
- - -
; - }) - } - -
; - } - - bindValue(e) { - let name = e.target.name; - let index = e.target.getAttribute('data-index'); - let next = this.props.value ? this.props.value.slice() : []; - - if (name === 'url') { - next[index] = e.target.value; - } else if (name === 'add') { - next.push(''); - } else if (name === 'delete') { - next.splice(index, 1); - } - - this.props.onChange(next); - if (name === 'delete') { - this.props.onBlur(); - } - } -} - -BlacklistForm.propTypes = { - value: PropTypes.arrayOf(PropTypes.string), - onChange: PropTypes.func, - onBlur: PropTypes.func, -}; - -BlacklistForm.defaultProps = { - value: [], - onChange: () => {}, - onBlur: () => {}, -}; - -export default BlacklistForm; diff --git a/src/settings/components/form/BlacklistForm.tsx b/src/settings/components/form/BlacklistForm.tsx new file mode 100644 index 0000000..c470758 --- /dev/null +++ b/src/settings/components/form/BlacklistForm.tsx @@ -0,0 +1,63 @@ +import './BlacklistForm.scss'; +import AddButton from '../ui/AddButton'; +import DeleteButton from '../ui/DeleteButton'; +import React from 'react'; +import PropTypes from 'prop-types'; + +class BlacklistForm extends React.Component { + + render() { + return
+ { + this.props.value.map((url, index) => { + return
+ + +
; + }) + } + +
; + } + + bindValue(e) { + let name = e.target.name; + let index = e.target.getAttribute('data-index'); + let next = this.props.value ? this.props.value.slice() : []; + + if (name === 'url') { + next[index] = e.target.value; + } else if (name === 'add') { + next.push(''); + } else if (name === 'delete') { + next.splice(index, 1); + } + + this.props.onChange(next); + if (name === 'delete') { + this.props.onBlur(); + } + } +} + +BlacklistForm.propTypes = { + value: PropTypes.arrayOf(PropTypes.string), + onChange: PropTypes.func, + onBlur: PropTypes.func, +}; + +BlacklistForm.defaultProps = { + value: [], + onChange: () => {}, + onBlur: () => {}, +}; + +export default BlacklistForm; diff --git a/src/settings/components/form/KeymapsForm.jsx b/src/settings/components/form/KeymapsForm.jsx deleted file mode 100644 index 01acf61..0000000 --- a/src/settings/components/form/KeymapsForm.jsx +++ /dev/null @@ -1,51 +0,0 @@ -import './KeymapsForm.scss'; -import React from 'react'; -import PropTypes from 'prop-types'; -import Input from '../ui/Input'; -import keymaps from '../../keymaps'; - -class KeymapsForm extends React.Component { - - render() { - return
- { - keymaps.fields.map((group, index) => { - return
- { - group.map((field) => { - let name = field[0]; - let label = field[1]; - let value = this.props.value[name] || ''; - return ; - }) - } -
; - }) - } -
; - } - - bindValue(e) { - let next = { ...this.props.value }; - next[e.target.name] = e.target.value; - - this.props.onChange(next); - } -} - -KeymapsForm.propTypes = { - value: PropTypes.objectOf(PropTypes.string), - onChange: PropTypes.func, -}; - -KeymapsForm.defaultProps = { - value: {}, - onChange: () => {}, -}; - -export default KeymapsForm; diff --git a/src/settings/components/form/KeymapsForm.tsx b/src/settings/components/form/KeymapsForm.tsx new file mode 100644 index 0000000..01acf61 --- /dev/null +++ b/src/settings/components/form/KeymapsForm.tsx @@ -0,0 +1,51 @@ +import './KeymapsForm.scss'; +import React from 'react'; +import PropTypes from 'prop-types'; +import Input from '../ui/Input'; +import keymaps from '../../keymaps'; + +class KeymapsForm extends React.Component { + + render() { + return
+ { + keymaps.fields.map((group, index) => { + return
+ { + group.map((field) => { + let name = field[0]; + let label = field[1]; + let value = this.props.value[name] || ''; + return ; + }) + } +
; + }) + } +
; + } + + bindValue(e) { + let next = { ...this.props.value }; + next[e.target.name] = e.target.value; + + this.props.onChange(next); + } +} + +KeymapsForm.propTypes = { + value: PropTypes.objectOf(PropTypes.string), + onChange: PropTypes.func, +}; + +KeymapsForm.defaultProps = { + value: {}, + onChange: () => {}, +}; + +export default KeymapsForm; diff --git a/src/settings/components/form/PropertiesForm.jsx b/src/settings/components/form/PropertiesForm.jsx deleted file mode 100644 index 979fdd8..0000000 --- a/src/settings/components/form/PropertiesForm.jsx +++ /dev/null @@ -1,65 +0,0 @@ -import './PropertiesForm.scss'; -import React from 'react'; -import PropTypes from 'prop-types'; - -class PropertiesForm extends React.Component { - - render() { - let types = this.props.types; - let value = this.props.value; - - return
- { - Object.keys(types).map((name) => { - let type = types[name]; - let inputType = null; - if (type === 'string') { - inputType = 'text'; - } else if (type === 'number') { - inputType = 'number'; - } else if (type === 'boolean') { - inputType = 'checkbox'; - } - return
- -
; - }) - } -
; - } - - bindValue(e) { - let name = e.target.name; - let next = { ...this.props.value }; - if (e.target.type.toLowerCase() === 'checkbox') { - next[name] = e.target.checked; - } else if (e.target.type.toLowerCase() === 'number') { - next[name] = Number(e.target.value); - } else { - next[name] = e.target.value; - } - - this.props.onChange(next); - } -} - -PropertiesForm.propTypes = { - value: PropTypes.objectOf(PropTypes.any), - onChange: PropTypes.func, -}; - -PropertiesForm.defaultProps = { - value: {}, - onChange: () => {}, -}; - -export default PropertiesForm; diff --git a/src/settings/components/form/PropertiesForm.tsx b/src/settings/components/form/PropertiesForm.tsx new file mode 100644 index 0000000..979fdd8 --- /dev/null +++ b/src/settings/components/form/PropertiesForm.tsx @@ -0,0 +1,65 @@ +import './PropertiesForm.scss'; +import React from 'react'; +import PropTypes from 'prop-types'; + +class PropertiesForm extends React.Component { + + render() { + let types = this.props.types; + let value = this.props.value; + + return
+ { + Object.keys(types).map((name) => { + let type = types[name]; + let inputType = null; + if (type === 'string') { + inputType = 'text'; + } else if (type === 'number') { + inputType = 'number'; + } else if (type === 'boolean') { + inputType = 'checkbox'; + } + return
+ +
; + }) + } +
; + } + + bindValue(e) { + let name = e.target.name; + let next = { ...this.props.value }; + if (e.target.type.toLowerCase() === 'checkbox') { + next[name] = e.target.checked; + } else if (e.target.type.toLowerCase() === 'number') { + next[name] = Number(e.target.value); + } else { + next[name] = e.target.value; + } + + this.props.onChange(next); + } +} + +PropertiesForm.propTypes = { + value: PropTypes.objectOf(PropTypes.any), + onChange: PropTypes.func, +}; + +PropertiesForm.defaultProps = { + value: {}, + onChange: () => {}, +}; + +export default PropertiesForm; diff --git a/src/settings/components/form/SearchForm.jsx b/src/settings/components/form/SearchForm.jsx deleted file mode 100644 index 6b0bd01..0000000 --- a/src/settings/components/form/SearchForm.jsx +++ /dev/null @@ -1,92 +0,0 @@ -import './SearchForm.scss'; -import React from 'react'; -import PropTypes from 'prop-types'; -import AddButton from '../ui/AddButton'; -import DeleteButton from '../ui/DeleteButton'; - -class SearchForm extends React.Component { - - render() { - let value = this.props.value; - if (!value.engines) { - value.engines = []; - } - - return
-
-
Name
-
URL
-
Default
-
- { - value.engines.map((engine, index) => { - return
- - -
- - -
-
; - }) - } - -
; - } - - bindValue(e) { - let value = this.props.value; - let name = e.target.name; - let index = e.target.getAttribute('data-index'); - let next = { - default: value.default, - engines: value.engines ? value.engines.slice() : [], - }; - - if (name === 'name') { - next.engines[index][0] = e.target.value; - next.default = this.props.value.engines[index][0]; - } else if (name === 'url') { - next.engines[index][1] = e.target.value; - } else if (name === 'default') { - next.default = this.props.value.engines[index][0]; - } else if (name === 'add') { - next.engines.push(['', '']); - } else if (name === 'delete') { - next.engines.splice(index, 1); - } - - this.props.onChange(next); - if (name === 'delete' || name === 'default') { - this.props.onBlur(); - } - } -} - -SearchForm.propTypes = { - value: PropTypes.shape({ - default: PropTypes.string, - engines: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.string)), - }), - onChange: PropTypes.func, -}; - -SearchForm.defaultProps = { - value: { default: '', engines: []}, - onChange: () => {}, -}; - -export default SearchForm; diff --git a/src/settings/components/form/SearchForm.tsx b/src/settings/components/form/SearchForm.tsx new file mode 100644 index 0000000..6b0bd01 --- /dev/null +++ b/src/settings/components/form/SearchForm.tsx @@ -0,0 +1,92 @@ +import './SearchForm.scss'; +import React from 'react'; +import PropTypes from 'prop-types'; +import AddButton from '../ui/AddButton'; +import DeleteButton from '../ui/DeleteButton'; + +class SearchForm extends React.Component { + + render() { + let value = this.props.value; + if (!value.engines) { + value.engines = []; + } + + return
+
+
Name
+
URL
+
Default
+
+ { + value.engines.map((engine, index) => { + return
+ + +
+ + +
+
; + }) + } + +
; + } + + bindValue(e) { + let value = this.props.value; + let name = e.target.name; + let index = e.target.getAttribute('data-index'); + let next = { + default: value.default, + engines: value.engines ? value.engines.slice() : [], + }; + + if (name === 'name') { + next.engines[index][0] = e.target.value; + next.default = this.props.value.engines[index][0]; + } else if (name === 'url') { + next.engines[index][1] = e.target.value; + } else if (name === 'default') { + next.default = this.props.value.engines[index][0]; + } else if (name === 'add') { + next.engines.push(['', '']); + } else if (name === 'delete') { + next.engines.splice(index, 1); + } + + this.props.onChange(next); + if (name === 'delete' || name === 'default') { + this.props.onBlur(); + } + } +} + +SearchForm.propTypes = { + value: PropTypes.shape({ + default: PropTypes.string, + engines: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.string)), + }), + onChange: PropTypes.func, +}; + +SearchForm.defaultProps = { + value: { default: '', engines: []}, + onChange: () => {}, +}; + +export default SearchForm; -- cgit v1.2.3