feat: add AutoComplete component
This commit is contained in:
parent
3ee2588d4e
commit
dfa4df84bf
203
package-lock.json
generated
203
package-lock.json
generated
|
@ -1341,11 +1341,74 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"@emotion/babel-utils": {
|
||||||
|
"version": "0.6.10",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/babel-utils/-/babel-utils-0.6.10.tgz",
|
||||||
|
"integrity": "sha512-/fnkM/LTEp3jKe++T0KyTszVGWNKPNOUJfjNKLO17BzQ6QPxgbg3whayom1Qr2oLFH3V92tDymU+dT5q676uow==",
|
||||||
|
"requires": {
|
||||||
|
"@emotion/hash": "^0.6.6",
|
||||||
|
"@emotion/memoize": "^0.6.6",
|
||||||
|
"@emotion/serialize": "^0.9.1",
|
||||||
|
"convert-source-map": "^1.5.1",
|
||||||
|
"find-root": "^1.1.0",
|
||||||
|
"source-map": "^0.7.2"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@emotion/hash": {
|
||||||
|
"version": "0.6.6",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.6.6.tgz",
|
||||||
|
"integrity": "sha512-ojhgxzUHZ7am3D2jHkMzPpsBAiB005GF5YU4ea+8DNPybMk01JJUM9V9YRlF/GE95tcOm8DxQvWA2jq19bGalQ=="
|
||||||
|
},
|
||||||
|
"source-map": {
|
||||||
|
"version": "0.7.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.3.tgz",
|
||||||
|
"integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ=="
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"@emotion/hash": {
|
"@emotion/hash": {
|
||||||
"version": "0.7.1",
|
"version": "0.7.1",
|
||||||
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.7.1.tgz",
|
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.7.1.tgz",
|
||||||
"integrity": "sha512-OYpa/Sg+2GDX+jibUfpZVn1YqSVRpYmTLF2eyAfrFTIJSbwyIrc+YscayoykvaOME/wV4BV0Sa0yqdMrgse6mA=="
|
"integrity": "sha512-OYpa/Sg+2GDX+jibUfpZVn1YqSVRpYmTLF2eyAfrFTIJSbwyIrc+YscayoykvaOME/wV4BV0Sa0yqdMrgse6mA=="
|
||||||
},
|
},
|
||||||
|
"@emotion/memoize": {
|
||||||
|
"version": "0.6.6",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.6.6.tgz",
|
||||||
|
"integrity": "sha512-h4t4jFjtm1YV7UirAFuSuFGyLa+NNxjdkq6DpFLANNQY5rHueFZHVY+8Cu1HYVP6DrheB0kv4m5xPjo7eKT7yQ=="
|
||||||
|
},
|
||||||
|
"@emotion/serialize": {
|
||||||
|
"version": "0.9.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-0.9.1.tgz",
|
||||||
|
"integrity": "sha512-zTuAFtyPvCctHBEL8KZ5lJuwBanGSutFEncqLn/m9T1a6a93smBStK+bZzcNPgj4QS8Rkw9VTwJGhRIUVO8zsQ==",
|
||||||
|
"requires": {
|
||||||
|
"@emotion/hash": "^0.6.6",
|
||||||
|
"@emotion/memoize": "^0.6.6",
|
||||||
|
"@emotion/unitless": "^0.6.7",
|
||||||
|
"@emotion/utils": "^0.8.2"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@emotion/hash": {
|
||||||
|
"version": "0.6.6",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.6.6.tgz",
|
||||||
|
"integrity": "sha512-ojhgxzUHZ7am3D2jHkMzPpsBAiB005GF5YU4ea+8DNPybMk01JJUM9V9YRlF/GE95tcOm8DxQvWA2jq19bGalQ=="
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"@emotion/stylis": {
|
||||||
|
"version": "0.7.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.7.1.tgz",
|
||||||
|
"integrity": "sha512-/SLmSIkN13M//53TtNxgxo57mcJk/UJIDFRKwOiLIBEyBHEcipgR6hNMQ/59Sl4VjCJ0Z/3zeAZyvnSLPG/1HQ=="
|
||||||
|
},
|
||||||
|
"@emotion/unitless": {
|
||||||
|
"version": "0.6.7",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.6.7.tgz",
|
||||||
|
"integrity": "sha512-Arj1hncvEVqQ2p7Ega08uHLr1JuRYBuO5cIvcA+WWEQ5+VmkOE3ZXzl04NbQxeQpWX78G7u6MqxKuNX3wvYZxg=="
|
||||||
|
},
|
||||||
|
"@emotion/utils": {
|
||||||
|
"version": "0.8.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-0.8.2.tgz",
|
||||||
|
"integrity": "sha512-rLu3wcBWH4P5q1CGoSSH/i9hrXs7SlbRLkoq9IGuoPYNGQvDJ3pt/wmOM+XgYjIDRMVIdkUWt0RsfzF50JfnCw=="
|
||||||
|
},
|
||||||
"@firebase/app": {
|
"@firebase/app": {
|
||||||
"version": "0.3.8",
|
"version": "0.3.8",
|
||||||
"resolved": "https://registry.npmjs.org/@firebase/app/-/app-0.3.8.tgz",
|
"resolved": "https://registry.npmjs.org/@firebase/app/-/app-0.3.8.tgz",
|
||||||
|
@ -2790,6 +2853,37 @@
|
||||||
"babel-runtime": "^6.22.0"
|
"babel-runtime": "^6.22.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"babel-plugin-emotion": {
|
||||||
|
"version": "9.2.11",
|
||||||
|
"resolved": "https://registry.npmjs.org/babel-plugin-emotion/-/babel-plugin-emotion-9.2.11.tgz",
|
||||||
|
"integrity": "sha512-dgCImifnOPPSeXod2znAmgc64NhaaOjGEHROR/M+lmStb3841yK1sgaDYAYMnlvWNz8GnpwIPN0VmNpbWYZ+VQ==",
|
||||||
|
"requires": {
|
||||||
|
"@babel/helper-module-imports": "^7.0.0",
|
||||||
|
"@emotion/babel-utils": "^0.6.4",
|
||||||
|
"@emotion/hash": "^0.6.2",
|
||||||
|
"@emotion/memoize": "^0.6.1",
|
||||||
|
"@emotion/stylis": "^0.7.0",
|
||||||
|
"babel-plugin-macros": "^2.0.0",
|
||||||
|
"babel-plugin-syntax-jsx": "^6.18.0",
|
||||||
|
"convert-source-map": "^1.5.0",
|
||||||
|
"find-root": "^1.1.0",
|
||||||
|
"mkdirp": "^0.5.1",
|
||||||
|
"source-map": "^0.5.7",
|
||||||
|
"touch": "^2.0.1"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@emotion/hash": {
|
||||||
|
"version": "0.6.6",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.6.6.tgz",
|
||||||
|
"integrity": "sha512-ojhgxzUHZ7am3D2jHkMzPpsBAiB005GF5YU4ea+8DNPybMk01JJUM9V9YRlF/GE95tcOm8DxQvWA2jq19bGalQ=="
|
||||||
|
},
|
||||||
|
"source-map": {
|
||||||
|
"version": "0.5.7",
|
||||||
|
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
|
||||||
|
"integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"babel-plugin-import": {
|
"babel-plugin-import": {
|
||||||
"version": "1.11.0",
|
"version": "1.11.0",
|
||||||
"resolved": "https://registry.npmjs.org/babel-plugin-import/-/babel-plugin-import-1.11.0.tgz",
|
"resolved": "https://registry.npmjs.org/babel-plugin-import/-/babel-plugin-import-1.11.0.tgz",
|
||||||
|
@ -2813,6 +2907,15 @@
|
||||||
"require-package-name": "^2.0.1"
|
"require-package-name": "^2.0.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"babel-plugin-macros": {
|
||||||
|
"version": "2.4.5",
|
||||||
|
"resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-2.4.5.tgz",
|
||||||
|
"integrity": "sha512-+/9yteNQw3yuZ3krQUfjAeoT/f4EAdn3ELwhFfDj0rTMIaoHfIdrcLePOfIaL0qmFLpIcgPIL2Lzm58h+CGWaw==",
|
||||||
|
"requires": {
|
||||||
|
"cosmiconfig": "^5.0.5",
|
||||||
|
"resolve": "^1.8.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
"babel-plugin-react-transform": {
|
"babel-plugin-react-transform": {
|
||||||
"version": "3.0.0",
|
"version": "3.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/babel-plugin-react-transform/-/babel-plugin-react-transform-3.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/babel-plugin-react-transform/-/babel-plugin-react-transform-3.0.0.tgz",
|
||||||
|
@ -2849,6 +2952,11 @@
|
||||||
"resolved": "http://registry.npmjs.org/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz",
|
"resolved": "http://registry.npmjs.org/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz",
|
||||||
"integrity": "sha1-nufoM3KQ2pUoggGmpX9BcDF4MN4="
|
"integrity": "sha1-nufoM3KQ2pUoggGmpX9BcDF4MN4="
|
||||||
},
|
},
|
||||||
|
"babel-plugin-syntax-jsx": {
|
||||||
|
"version": "6.18.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
|
||||||
|
"integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY="
|
||||||
|
},
|
||||||
"babel-plugin-syntax-trailing-function-commas": {
|
"babel-plugin-syntax-trailing-function-commas": {
|
||||||
"version": "6.22.0",
|
"version": "6.22.0",
|
||||||
"resolved": "https://registry.npmjs.org/babel-plugin-syntax-trailing-function-commas/-/babel-plugin-syntax-trailing-function-commas-6.22.0.tgz",
|
"resolved": "https://registry.npmjs.org/babel-plugin-syntax-trailing-function-commas/-/babel-plugin-syntax-trailing-function-commas-6.22.0.tgz",
|
||||||
|
@ -4629,6 +4737,27 @@
|
||||||
"elliptic": "^6.0.0"
|
"elliptic": "^6.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"create-emotion": {
|
||||||
|
"version": "9.2.12",
|
||||||
|
"resolved": "https://registry.npmjs.org/create-emotion/-/create-emotion-9.2.12.tgz",
|
||||||
|
"integrity": "sha512-P57uOF9NL2y98Xrbl2OuiDQUZ30GVmASsv5fbsjF4Hlraip2kyAvMm+2PoYUvFFw03Fhgtxk3RqZSm2/qHL9hA==",
|
||||||
|
"requires": {
|
||||||
|
"@emotion/hash": "^0.6.2",
|
||||||
|
"@emotion/memoize": "^0.6.1",
|
||||||
|
"@emotion/stylis": "^0.7.0",
|
||||||
|
"@emotion/unitless": "^0.6.2",
|
||||||
|
"csstype": "^2.5.2",
|
||||||
|
"stylis": "^3.5.0",
|
||||||
|
"stylis-rule-sheet": "^0.0.10"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@emotion/hash": {
|
||||||
|
"version": "0.6.6",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.6.6.tgz",
|
||||||
|
"integrity": "sha512-ojhgxzUHZ7am3D2jHkMzPpsBAiB005GF5YU4ea+8DNPybMk01JJUM9V9YRlF/GE95tcOm8DxQvWA2jq19bGalQ=="
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"create-hash": {
|
"create-hash": {
|
||||||
"version": "1.2.0",
|
"version": "1.2.0",
|
||||||
"resolved": "http://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
|
"resolved": "http://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
|
||||||
|
@ -5705,6 +5834,15 @@
|
||||||
"resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz",
|
||||||
"integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k="
|
"integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k="
|
||||||
},
|
},
|
||||||
|
"emotion": {
|
||||||
|
"version": "9.2.12",
|
||||||
|
"resolved": "https://registry.npmjs.org/emotion/-/emotion-9.2.12.tgz",
|
||||||
|
"integrity": "sha512-hcx7jppaI8VoXxIWEhxpDW7I+B4kq9RNzQLmsrF6LY8BGKqe2N+gFAQr0EfuFucFlPs2A9HM4+xNj4NeqEWIOQ==",
|
||||||
|
"requires": {
|
||||||
|
"babel-plugin-emotion": "^9.2.11",
|
||||||
|
"create-emotion": "^9.2.12"
|
||||||
|
}
|
||||||
|
},
|
||||||
"encodeurl": {
|
"encodeurl": {
|
||||||
"version": "1.0.2",
|
"version": "1.0.2",
|
||||||
"resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
|
"resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
|
||||||
|
@ -6550,6 +6688,11 @@
|
||||||
"resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
|
"resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
|
||||||
"integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
|
"integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
|
||||||
},
|
},
|
||||||
|
"find-root": {
|
||||||
|
"version": "1.1.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
|
||||||
|
"integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng=="
|
||||||
|
},
|
||||||
"find-up": {
|
"find-up": {
|
||||||
"version": "2.1.0",
|
"version": "2.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
|
||||||
|
@ -10292,6 +10435,11 @@
|
||||||
"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
|
"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
|
||||||
"integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168="
|
"integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168="
|
||||||
},
|
},
|
||||||
|
"lodash.deburr": {
|
||||||
|
"version": "4.1.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-4.1.0.tgz",
|
||||||
|
"integrity": "sha1-3bG7s+8HRYwBd7oH3hRCLLAz/5s="
|
||||||
|
},
|
||||||
"lodash.differenceby": {
|
"lodash.differenceby": {
|
||||||
"version": "4.8.0",
|
"version": "4.8.0",
|
||||||
"resolved": "https://registry.npmjs.org/lodash.differenceby/-/lodash.differenceby-4.8.0.tgz",
|
"resolved": "https://registry.npmjs.org/lodash.differenceby/-/lodash.differenceby-4.8.0.tgz",
|
||||||
|
@ -10781,6 +10929,11 @@
|
||||||
"mimic-fn": "^1.0.0"
|
"mimic-fn": "^1.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"memoize-one": {
|
||||||
|
"version": "4.0.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-4.0.3.tgz",
|
||||||
|
"integrity": "sha512-QmpUu4KqDmX0plH4u+tf0riMc1KHE1+lw95cMrLlXQAFOx/xnBtwhZ52XJxd9X2O6kwKBqX32kmhbhlobD0cuw=="
|
||||||
|
},
|
||||||
"memory-fs": {
|
"memory-fs": {
|
||||||
"version": "0.4.1",
|
"version": "0.4.1",
|
||||||
"resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
|
"resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
|
||||||
|
@ -14689,6 +14842,14 @@
|
||||||
"prop-types": "^15.5.8"
|
"prop-types": "^15.5.8"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"react-input-autosize": {
|
||||||
|
"version": "2.2.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-input-autosize/-/react-input-autosize-2.2.1.tgz",
|
||||||
|
"integrity": "sha512-3+K4CD13iE4lQQ2WlF8PuV5htfmTRLH6MDnfndHM6LuBRszuXnuyIfE7nhSKt8AzRBZ50bu0sAhkNMeS5pxQQA==",
|
||||||
|
"requires": {
|
||||||
|
"prop-types": "^15.5.8"
|
||||||
|
}
|
||||||
|
},
|
||||||
"react-intl": {
|
"react-intl": {
|
||||||
"version": "2.8.0",
|
"version": "2.8.0",
|
||||||
"resolved": "https://registry.npmjs.org/react-intl/-/react-intl-2.8.0.tgz",
|
"resolved": "https://registry.npmjs.org/react-intl/-/react-intl-2.8.0.tgz",
|
||||||
|
@ -15008,6 +15169,20 @@
|
||||||
"react-prop-toggle": "^1.0.2"
|
"react-prop-toggle": "^1.0.2"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"react-select": {
|
||||||
|
"version": "2.3.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-select/-/react-select-2.3.0.tgz",
|
||||||
|
"integrity": "sha512-CD3jyZs5lwy/CHW3SdYU1d1FtmJxgvVPdKMwEE8dD6MyNANFtvW95P/V20StPsPppFY7oePv/i2Mun2C2+WgTA==",
|
||||||
|
"requires": {
|
||||||
|
"classnames": "^2.2.5",
|
||||||
|
"emotion": "^9.1.2",
|
||||||
|
"memoize-one": "^4.0.0",
|
||||||
|
"prop-types": "^15.6.0",
|
||||||
|
"raf": "^3.4.0",
|
||||||
|
"react-input-autosize": "^2.2.1",
|
||||||
|
"react-transition-group": "^2.2.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
"react-side-effect": {
|
"react-side-effect": {
|
||||||
"version": "1.1.5",
|
"version": "1.1.5",
|
||||||
"resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-1.1.5.tgz",
|
"resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-1.1.5.tgz",
|
||||||
|
@ -17041,6 +17216,16 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"stylis": {
|
||||||
|
"version": "3.5.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/stylis/-/stylis-3.5.4.tgz",
|
||||||
|
"integrity": "sha512-8/3pSmthWM7lsPBKv7NXkzn2Uc9W7NotcwGNpJaa3k7WMM1XDCA4MgT5k/8BIexd5ydZdboXtU90XH9Ec4Bv/Q=="
|
||||||
|
},
|
||||||
|
"stylis-rule-sheet": {
|
||||||
|
"version": "0.0.10",
|
||||||
|
"resolved": "https://registry.npmjs.org/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz",
|
||||||
|
"integrity": "sha512-nTbZoaqoBnmK+ptANthb10ZRZOGC+EmTLLUxeYIuHNkEKcmKgXX1XWKkUBT2Ac4es3NybooPe0SmvKdhKJZAuw=="
|
||||||
|
},
|
||||||
"supercluster": {
|
"supercluster": {
|
||||||
"version": "4.1.1",
|
"version": "4.1.1",
|
||||||
"resolved": "https://registry.npmjs.org/supercluster/-/supercluster-4.1.1.tgz",
|
"resolved": "https://registry.npmjs.org/supercluster/-/supercluster-4.1.1.tgz",
|
||||||
|
@ -17419,6 +17604,24 @@
|
||||||
"integrity": "sha1-LmhELZ9k7HILjMieZEOsbKqVACk=",
|
"integrity": "sha1-LmhELZ9k7HILjMieZEOsbKqVACk=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"touch": {
|
||||||
|
"version": "2.0.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/touch/-/touch-2.0.2.tgz",
|
||||||
|
"integrity": "sha512-qjNtvsFXTRq7IuMLweVgFxmEuQ6gLbRs2jQxL80TtZ31dEKWYIxRXquij6w6VimyDek5hD3PytljHmEtAs2u0A==",
|
||||||
|
"requires": {
|
||||||
|
"nopt": "~1.0.10"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"nopt": {
|
||||||
|
"version": "1.0.10",
|
||||||
|
"resolved": "https://registry.npmjs.org/nopt/-/nopt-1.0.10.tgz",
|
||||||
|
"integrity": "sha1-bd0hvSoxQXuScn3Vhfim83YI6+4=",
|
||||||
|
"requires": {
|
||||||
|
"abbrev": "1"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"tough-cookie": {
|
"tough-cookie": {
|
||||||
"version": "2.4.3",
|
"version": "2.4.3",
|
||||||
"resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.4.3.tgz",
|
"resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.4.3.tgz",
|
||||||
|
|
|
@ -45,6 +45,7 @@
|
||||||
"bind-decorator": "^1.0.11",
|
"bind-decorator": "^1.0.11",
|
||||||
"butter-toast": "^3.2.1",
|
"butter-toast": "^3.2.1",
|
||||||
"cinnamon-sugar": "^1.0.0",
|
"cinnamon-sugar": "^1.0.0",
|
||||||
|
"classnames": "^2.2.6",
|
||||||
"compression": "^1.7.1",
|
"compression": "^1.7.1",
|
||||||
"cors": "^2.8.4",
|
"cors": "^2.8.4",
|
||||||
"cross-spawn": "^6.0.5",
|
"cross-spawn": "^6.0.5",
|
||||||
|
@ -72,6 +73,7 @@
|
||||||
"less": "^3.8.1",
|
"less": "^3.8.1",
|
||||||
"load-google-maps-api": "^1.0.0",
|
"load-google-maps-api": "^1.0.0",
|
||||||
"lodash.capitalize": "^4.2.1",
|
"lodash.capitalize": "^4.2.1",
|
||||||
|
"lodash.deburr": "^4.1.0",
|
||||||
"lodash.differenceby": "^4.8.0",
|
"lodash.differenceby": "^4.8.0",
|
||||||
"lodash.get": "^4.4.2",
|
"lodash.get": "^4.4.2",
|
||||||
"lodash.omit": "^4.5.0",
|
"lodash.omit": "^4.5.0",
|
||||||
|
@ -88,6 +90,7 @@
|
||||||
"moment": "^2.24.0",
|
"moment": "^2.24.0",
|
||||||
"nwbuild": "0.0.5",
|
"nwbuild": "0.0.5",
|
||||||
"parcel-bundler": "^1.11.0",
|
"parcel-bundler": "^1.11.0",
|
||||||
|
"prop-types": "^15.6.2",
|
||||||
"raw-loader": "^0.5.1",
|
"raw-loader": "^0.5.1",
|
||||||
"rc-queue-anim": "^1.6.10",
|
"rc-queue-anim": "^1.6.10",
|
||||||
"rc-table": "^6.4.3",
|
"rc-table": "^6.4.3",
|
||||||
|
@ -124,6 +127,7 @@
|
||||||
"react-router": "^4.2.0",
|
"react-router": "^4.2.0",
|
||||||
"react-router-dom": "^4.2.2",
|
"react-router-dom": "^4.2.2",
|
||||||
"react-scroll-horizontal": "^1.6.2",
|
"react-scroll-horizontal": "^1.6.2",
|
||||||
|
"react-select": "^2.3.0",
|
||||||
"react-slick": "^0.23.2",
|
"react-slick": "^0.23.2",
|
||||||
"react-sortable-hoc": "^0.8.3",
|
"react-sortable-hoc": "^0.8.3",
|
||||||
"react-swipeable-views": "^0.13.1",
|
"react-swipeable-views": "^0.13.1",
|
||||||
|
|
|
@ -3,5 +3,5 @@ const spawn = require("cross-spawn");
|
||||||
require("./link-assets")();
|
require("./link-assets")();
|
||||||
|
|
||||||
// Spawn NPM synchronously
|
// Spawn NPM synchronously
|
||||||
const result = spawn.sync('parcel', 'public/index.parcel.html --log-level 4 --out-file index.html --global $'.split(" "), { stdio: 'inherit' });
|
const result = spawn.sync('parcel', 'public/index.parcel.html --out-file index.html --global $'.split(" "), { stdio: 'inherit' });
|
||||||
|
|
||||||
|
|
235
src/common/components/AutoComplete/index.js
Normal file
235
src/common/components/AutoComplete/index.js
Normal file
|
@ -0,0 +1,235 @@
|
||||||
|
/* eslint-disable react/prop-types, react/jsx-handler-names */
|
||||||
|
|
||||||
|
import React from 'react';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
import classNames from 'classnames';
|
||||||
|
import Select from 'react-select';
|
||||||
|
import { withStyles } from '@material-ui/core/styles';
|
||||||
|
import Typography from '@material-ui/core/Typography';
|
||||||
|
import NoSsr from '@material-ui/core/NoSsr';
|
||||||
|
import TextField from '@material-ui/core/TextField';
|
||||||
|
import Paper from '@material-ui/core/Paper';
|
||||||
|
import Chip from '@material-ui/core/Chip';
|
||||||
|
import MenuItem from '@material-ui/core/MenuItem';
|
||||||
|
import CancelIcon from '@material-ui/icons/Cancel';
|
||||||
|
import { emphasize } from '@material-ui/core/styles/colorManipulator';
|
||||||
|
|
||||||
|
const styles = theme => ({
|
||||||
|
root: {
|
||||||
|
flexGrow: 1,
|
||||||
|
// height: 250,
|
||||||
|
},
|
||||||
|
input: {
|
||||||
|
display: 'flex',
|
||||||
|
padding: 0,
|
||||||
|
},
|
||||||
|
valueContainer: {
|
||||||
|
display: 'flex',
|
||||||
|
flexWrap: 'wrap',
|
||||||
|
flex: 1,
|
||||||
|
alignItems: 'center',
|
||||||
|
overflow: 'hidden',
|
||||||
|
},
|
||||||
|
chip: {
|
||||||
|
margin: `${theme.spacing.unit / 2}px ${theme.spacing.unit / 4}px`,
|
||||||
|
},
|
||||||
|
chipFocused: {
|
||||||
|
backgroundColor: emphasize(
|
||||||
|
theme.palette.type === 'light' ? theme.palette.grey[300] : theme.palette.grey[700],
|
||||||
|
0.08,
|
||||||
|
),
|
||||||
|
},
|
||||||
|
noOptionsMessage: {
|
||||||
|
padding: `${theme.spacing.unit}px ${theme.spacing.unit * 2}px`,
|
||||||
|
},
|
||||||
|
singleValue: {
|
||||||
|
fontSize: 16,
|
||||||
|
},
|
||||||
|
placeholder: {
|
||||||
|
position: 'absolute',
|
||||||
|
left: 2,
|
||||||
|
fontSize: 16,
|
||||||
|
},
|
||||||
|
paper: {
|
||||||
|
position: 'absolute',
|
||||||
|
zIndex: 1,
|
||||||
|
marginTop: theme.spacing.unit,
|
||||||
|
left: 0,
|
||||||
|
right: 0,
|
||||||
|
},
|
||||||
|
divider: {
|
||||||
|
height: theme.spacing.unit * 2,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
function NoOptionsMessage(props) {
|
||||||
|
return (
|
||||||
|
<Typography
|
||||||
|
color="textSecondary"
|
||||||
|
className={props.selectProps.classes.noOptionsMessage}
|
||||||
|
{...props.innerProps}
|
||||||
|
>
|
||||||
|
{props.children}
|
||||||
|
</Typography>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function inputComponent({ inputRef, ...props }) {
|
||||||
|
return <div ref={inputRef} {...props} />;
|
||||||
|
}
|
||||||
|
|
||||||
|
function Control(props) {
|
||||||
|
return (
|
||||||
|
<TextField
|
||||||
|
margin="normal"
|
||||||
|
variant="outlined"
|
||||||
|
fullWidth
|
||||||
|
style={{padding: 5}}
|
||||||
|
InputProps={{
|
||||||
|
inputComponent,
|
||||||
|
inputProps: {
|
||||||
|
className: props.selectProps.classes.input,
|
||||||
|
inputRef: props.innerRef,
|
||||||
|
children: props.children,
|
||||||
|
...props.innerProps,
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
{...props.selectProps.textFieldProps}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function Option(props) {
|
||||||
|
return (
|
||||||
|
<MenuItem
|
||||||
|
buttonRef={props.innerRef}
|
||||||
|
selected={props.isFocused}
|
||||||
|
component="div"
|
||||||
|
style={{
|
||||||
|
fontWeight: props.isSelected ? 500 : 400,
|
||||||
|
}}
|
||||||
|
{...props.innerProps}
|
||||||
|
>
|
||||||
|
{props.children}
|
||||||
|
</MenuItem>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function Placeholder(props) {
|
||||||
|
return (
|
||||||
|
<Typography
|
||||||
|
color="textSecondary"
|
||||||
|
className={props.selectProps.classes.placeholder}
|
||||||
|
{...props.innerProps}
|
||||||
|
>
|
||||||
|
{props.children}
|
||||||
|
</Typography>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function SingleValue(props) {
|
||||||
|
return (
|
||||||
|
<Typography className={props.selectProps.classes.singleValue} {...props.innerProps}>
|
||||||
|
{props.children}
|
||||||
|
</Typography>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function ValueContainer(props) {
|
||||||
|
return <div className={props.selectProps.classes.valueContainer}>{props.children}</div>;
|
||||||
|
}
|
||||||
|
|
||||||
|
function MultiValue(props) {
|
||||||
|
return (
|
||||||
|
<Chip
|
||||||
|
tabIndex={-1}
|
||||||
|
label={props.children}
|
||||||
|
className={classNames(props.selectProps.classes.chip, {
|
||||||
|
[props.selectProps.classes.chipFocused]: props.isFocused,
|
||||||
|
})}
|
||||||
|
onDelete={props.removeProps.onClick}
|
||||||
|
deleteIcon={<CancelIcon {...props.removeProps} />}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function Menu(props) {
|
||||||
|
return (
|
||||||
|
<Paper square className={props.selectProps.classes.paper} {...props.innerProps}>
|
||||||
|
{props.children}
|
||||||
|
</Paper>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const components = {
|
||||||
|
Control,
|
||||||
|
Menu,
|
||||||
|
MultiValue,
|
||||||
|
NoOptionsMessage,
|
||||||
|
Option,
|
||||||
|
Placeholder,
|
||||||
|
SingleValue,
|
||||||
|
ValueContainer,
|
||||||
|
};
|
||||||
|
|
||||||
|
class IntegrationReactSelect extends React.Component {
|
||||||
|
state = {
|
||||||
|
single: null,
|
||||||
|
multi: null,
|
||||||
|
};
|
||||||
|
|
||||||
|
handleChange = name => value => {
|
||||||
|
|
||||||
|
const {onChange=()=>{}} = this.props;
|
||||||
|
|
||||||
|
onChange(value);
|
||||||
|
|
||||||
|
this.setState({
|
||||||
|
[name]: value,
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { classes, theme } = this.props;
|
||||||
|
|
||||||
|
const selectStyles = {
|
||||||
|
input: base => ({
|
||||||
|
...base,
|
||||||
|
color: theme.palette.text.primary,
|
||||||
|
'& input': {
|
||||||
|
font: 'inherit',
|
||||||
|
// padding: '15px'
|
||||||
|
},
|
||||||
|
padding: '15px'
|
||||||
|
}),
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className={classes.root} style={{
|
||||||
|
// backgroundColor: "red",
|
||||||
|
}}>
|
||||||
|
<NoSsr>
|
||||||
|
<Select
|
||||||
|
classes={classes}
|
||||||
|
styles={selectStyles}
|
||||||
|
options={this.props.suggestions}
|
||||||
|
components={components}
|
||||||
|
value={this.state.single}
|
||||||
|
onChange={this.handleChange('single')}
|
||||||
|
placeholder={this.props.placeholder || "Please select data"}
|
||||||
|
/>
|
||||||
|
</NoSsr>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
IntegrationReactSelect.propTypes = {
|
||||||
|
classes: PropTypes.object.isRequired,
|
||||||
|
theme: PropTypes.object.isRequired,
|
||||||
|
suggestions: PropTypes.array.isRequired,
|
||||||
|
placeholder: PropTypes.string,
|
||||||
|
onChange: PropTypes.func
|
||||||
|
};
|
||||||
|
|
||||||
|
export default withStyles(styles, { withTheme: true })(IntegrationReactSelect);
|
|
@ -30,7 +30,7 @@ imageUrl = "https://giift-api.asacreative.com";
|
||||||
type = 'localhost';
|
type = 'localhost';
|
||||||
if(window.location.href.includes("localhost") || window.location.href.includes("marketplace-store")){
|
if(window.location.href.includes("localhost") || window.location.href.includes("marketplace-store")){
|
||||||
// appUrl = 'http://localhost:7700';
|
// appUrl = 'http://localhost:7700';
|
||||||
// apiUrl = "http://localhost:4001/"
|
apiUrl = "http://localhost:4001/"
|
||||||
}else{
|
}else{
|
||||||
appUrl = 'https://sillyfish.asacreative.com';
|
appUrl = 'https://sillyfish.asacreative.com';
|
||||||
}
|
}
|
||||||
|
|
|
@ -20,19 +20,29 @@ import schema from 'async-validator'
|
||||||
import { startCase } from 'lodash';
|
import { startCase } from 'lodash';
|
||||||
import { Upload, Icon, message } from 'antd';
|
import { Upload, Icon, message } from 'antd';
|
||||||
|
|
||||||
|
import AutoComplete from './../../components/AutoComplete';
|
||||||
|
|
||||||
|
// const province = require("./../../../../assets/data/province.json");
|
||||||
|
// const city = require("./../../../../assets/data/city.json");
|
||||||
|
// const district = require("./../../../../assets/data/district.json");
|
||||||
|
// const subdistrict = require("./../../../../assets/data/subdistrict.json");
|
||||||
|
|
||||||
@inject('appstate')
|
@inject('appstate')
|
||||||
@observer
|
@observer
|
||||||
class RegisterPage extends React.Component {
|
class RegisterPage extends React.Component {
|
||||||
state = {
|
state = {
|
||||||
|
showPassword: false,
|
||||||
|
showConfirmPassword: false,
|
||||||
|
openDialog: false,
|
||||||
|
isLoading: false,
|
||||||
|
|
||||||
|
|
||||||
|
// form
|
||||||
phone_number: "",
|
phone_number: "",
|
||||||
email: "",
|
email: "",
|
||||||
password: "",
|
password: "",
|
||||||
confirmPassword: "",
|
confirmPassword: "",
|
||||||
full_name: "",
|
full_name: "",
|
||||||
showPassword: false,
|
|
||||||
showConfirmPassword: false,
|
|
||||||
openDialog: false,
|
|
||||||
isLoading: false,
|
|
||||||
no_ktp: '',
|
no_ktp: '',
|
||||||
upload_ktp: '',
|
upload_ktp: '',
|
||||||
upload_photo: '',
|
upload_photo: '',
|
||||||
|
@ -42,13 +52,16 @@ class RegisterPage extends React.Component {
|
||||||
district: '',
|
district: '',
|
||||||
sub_district: '',
|
sub_district: '',
|
||||||
zip_code: '',
|
zip_code: '',
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
this.authStore = props.appstate.auth;
|
this.authStore = props.appstate.auth;
|
||||||
// this.global_ui = props.store.global_ui;
|
this.http = props.appstate.http;
|
||||||
|
}
|
||||||
|
|
||||||
|
componentDidMount() {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
handleChange = name => event => {
|
handleChange = name => event => {
|
||||||
|
@ -76,50 +89,14 @@ class RegisterPage extends React.Component {
|
||||||
email: this.state.email,
|
email: this.state.email,
|
||||||
phone_number: this.state.phone_number,
|
phone_number: this.state.phone_number,
|
||||||
password: this.state.password
|
password: this.state.password
|
||||||
}
|
};
|
||||||
this.authStore.register(data).then(res => {
|
this.authStore.register(data).then(res => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.setState({ isLoading: false });
|
this.setState({ isLoading: false });
|
||||||
}, 1000);
|
}, 1000);
|
||||||
}).catch(err => {
|
}).catch(err => {
|
||||||
this.setState({ isLoading: false });
|
this.setState({ isLoading: false });
|
||||||
})
|
});
|
||||||
// let rules = {
|
|
||||||
// full_name : {
|
|
||||||
// type : 'string',
|
|
||||||
// required : true,
|
|
||||||
// min : 3
|
|
||||||
// },
|
|
||||||
// phone_number : {
|
|
||||||
// type : 'string',
|
|
||||||
// required : true,
|
|
||||||
// min : 8
|
|
||||||
// },
|
|
||||||
// email : {
|
|
||||||
// type : 'email',
|
|
||||||
// required : true
|
|
||||||
// }
|
|
||||||
// };
|
|
||||||
// const validator = new schema(rules);
|
|
||||||
// validator.validate(this.state, (errors, fields) => {
|
|
||||||
// if(errors) {
|
|
||||||
// this.global_ui.openAlert({
|
|
||||||
// type : 'error',
|
|
||||||
// title : startCase(errors[0].message),
|
|
||||||
// subtitle : 'Please validate the input'
|
|
||||||
// });
|
|
||||||
// return false;
|
|
||||||
// }
|
|
||||||
// this.global_ui.openLoader();
|
|
||||||
// setTimeout(()=>{
|
|
||||||
// this.global_ui.closeLoader();
|
|
||||||
// this.global_ui.openAlert({
|
|
||||||
// title : "Registration Succeed",
|
|
||||||
// subtitle : 'Thank you for register and enjoy your day',
|
|
||||||
// type : 'success'
|
|
||||||
// });
|
|
||||||
// },1000)
|
|
||||||
// });
|
|
||||||
};
|
};
|
||||||
|
|
||||||
handleChangeUploadKtp = (info) => {
|
handleChangeUploadKtp = (info) => {
|
||||||
|
@ -134,7 +111,7 @@ class RegisterPage extends React.Component {
|
||||||
loading: false,
|
loading: false,
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
handleChangeUploadPhoto = (info) => {
|
handleChangeUploadPhoto = (info) => {
|
||||||
if (info.file.status === 'uploading') {
|
if (info.file.status === 'uploading') {
|
||||||
|
@ -148,33 +125,37 @@ class RegisterPage extends React.Component {
|
||||||
loading: false,
|
loading: false,
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { classes } = this.props;
|
const { classes } = this.props;
|
||||||
|
|
||||||
const uploadButtonKtp = (
|
const uploadButtonKtp = (
|
||||||
<div>
|
<div>
|
||||||
<Icon type={this.state.loading ? 'loading' : 'plus'} />
|
<Icon type={this.state.loading ? 'loading' : 'plus'} />
|
||||||
<div className="ant-upload-text">Upload KTP</div>
|
<div className="ant-upload-text">Upload KTP</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
||||||
const uploadButtonPhoto = (
|
const uploadButtonPhoto = (
|
||||||
<div>
|
<div>
|
||||||
<Icon type={this.state.loading ? 'loading' : 'plus'} />
|
<Icon type={this.state.loading ? 'loading' : 'plus'} />
|
||||||
<div className="ant-upload-text">Upload Photo</div>
|
<div className="ant-upload-text">Upload Photo</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
||||||
const upload_ktp = this.state.upload_ktp;
|
const upload_ktp = this.state.upload_ktp;
|
||||||
const upload_photo = this.state.upload_photo;
|
const upload_photo = this.state.upload_photo;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={classes.container}>
|
<div className={classes.container}>
|
||||||
{/*<AlertSuccess open={appStore.global_ui.openSuccess} onClose={()=>appStore.global_ui.closeAlertSuccess()}/>*/}
|
{/*<AlertSuccess open={appStore.global_ui.openSuccess} onClose={()=>appStore.global_ui.closeAlertSuccess()}/>*/}
|
||||||
|
|
||||||
<Grid container spacing={0} className={classes.gridContainer}>
|
<Grid container spacing={0} className={classes.gridContainer}>
|
||||||
<Grid item xs={12} className={classes.logoContainer}>
|
<Grid item xs={16} className={classes.logoContainer}>
|
||||||
<img src={require('../../../../assets/images/logo_new.png')} className={classes.logo} />
|
<img src={require('../../../../assets/images/logo_new.png')} className={classes.logo} />
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12} sm={12} md={10} lg={10} className={classes.registerContainer}>
|
<Grid item xs={16} sm={16} md={10} lg={10} className={classes.registerContainer}>
|
||||||
<Grid container spacing={24} className={classes.registerPaper}>
|
<Grid container spacing={24} className={classes.registerPaper}>
|
||||||
<Hidden smDown>
|
<Hidden smDown>
|
||||||
<Grid item xs={5}>
|
<Grid item xs={5}>
|
||||||
|
@ -187,7 +168,7 @@ class RegisterPage extends React.Component {
|
||||||
</Typography>
|
</Typography>
|
||||||
</Grid>
|
</Grid>
|
||||||
</Hidden>
|
</Hidden>
|
||||||
<Grid item xs={12} sm={12} md={7} style={{ paddingLeft: 50, paddingRight: 50 }}>
|
<Grid item xs={16} sm={16} md={7} style={{ paddingLeft: 50, paddingRight: 50 }}>
|
||||||
<Paper className={classes.formRegister}>
|
<Paper className={classes.formRegister}>
|
||||||
<Typography variant="h6" gutterBottom>
|
<Typography variant="h6" gutterBottom>
|
||||||
Register Now
|
Register Now
|
||||||
|
@ -199,8 +180,8 @@ class RegisterPage extends React.Component {
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexDirection: 'row'
|
flexDirection: 'row'
|
||||||
}}>
|
}}>
|
||||||
<Grid container spacing={12}>
|
<Grid container spacing={16}>
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||||
<TextField
|
<TextField
|
||||||
id="name"
|
id="name"
|
||||||
label="Full name"
|
label="Full name"
|
||||||
|
@ -212,7 +193,7 @@ class RegisterPage extends React.Component {
|
||||||
fullWidth
|
fullWidth
|
||||||
/>
|
/>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||||
<TextField
|
<TextField
|
||||||
id="phone"
|
id="phone"
|
||||||
label="Phone Number"
|
label="Phone Number"
|
||||||
|
@ -225,7 +206,7 @@ class RegisterPage extends React.Component {
|
||||||
/>
|
/>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||||
<TextField
|
<TextField
|
||||||
id="email"
|
id="email"
|
||||||
label="Email"
|
label="Email"
|
||||||
|
@ -236,7 +217,7 @@ class RegisterPage extends React.Component {
|
||||||
fullWidth
|
fullWidth
|
||||||
/>
|
/>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||||
<TextField
|
<TextField
|
||||||
id="ktp"
|
id="ktp"
|
||||||
label="Nomor KTP"
|
label="Nomor KTP"
|
||||||
|
@ -249,7 +230,7 @@ class RegisterPage extends React.Component {
|
||||||
/>
|
/>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5,paddingTop:16 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5,paddingTop:16 }}>
|
||||||
<Upload
|
<Upload
|
||||||
name="avatar"
|
name="avatar"
|
||||||
listType="picture-card"
|
listType="picture-card"
|
||||||
|
@ -261,7 +242,7 @@ class RegisterPage extends React.Component {
|
||||||
{upload_ktp ? <img src={upload_ktp} alt="avatar" /> : uploadButtonKtp}
|
{upload_ktp ? <img src={upload_ktp} alt="avatar" /> : uploadButtonKtp}
|
||||||
</Upload>
|
</Upload>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5, paddingTop:16 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5, paddingTop:16 }}>
|
||||||
<Upload
|
<Upload
|
||||||
style={{ marginTop: 16, marginBottom: 8 }}
|
style={{ marginTop: 16, marginBottom: 8 }}
|
||||||
name="avatar"
|
name="avatar"
|
||||||
|
@ -275,7 +256,7 @@ class RegisterPage extends React.Component {
|
||||||
</Upload>
|
</Upload>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||||
<TextField
|
<TextField
|
||||||
id="address"
|
id="address"
|
||||||
label="Address"
|
label="Address"
|
||||||
|
@ -286,53 +267,90 @@ class RegisterPage extends React.Component {
|
||||||
fullWidth
|
fullWidth
|
||||||
/>
|
/>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||||
<TextField
|
{/*<TextField*/}
|
||||||
id="province"
|
{/*id="province"*/}
|
||||||
label="Province"
|
{/*label="Province"*/}
|
||||||
value={this.state.province}
|
{/*value={this.state.province}*/}
|
||||||
onChange={this.handleChange('province')}
|
{/*onChange={this.handleChange('province')}*/}
|
||||||
margin="normal"
|
{/*margin="normal"*/}
|
||||||
variant="outlined"
|
{/*variant="outlined"*/}
|
||||||
fullWidth
|
{/*fullWidth*/}
|
||||||
/>
|
{/*/>*/}
|
||||||
|
<AutoComplete
|
||||||
|
placeholder={"Province"}
|
||||||
|
onChange={val => console.log(val)}
|
||||||
|
suggestions={[
|
||||||
|
{
|
||||||
|
label: "Indonesia",
|
||||||
|
value: "ID"
|
||||||
|
}
|
||||||
|
]}/>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||||
<TextField
|
{/*<TextField*/}
|
||||||
id="city"
|
{/*id="city"*/}
|
||||||
label="City"
|
{/*label="City"*/}
|
||||||
value={this.state.city}
|
{/*value={this.state.city}*/}
|
||||||
onChange={this.handleChange('city')}
|
{/*onChange={this.handleChange('city')}*/}
|
||||||
margin="normal"
|
{/*margin="normal"*/}
|
||||||
variant="outlined"
|
{/*variant="outlined"*/}
|
||||||
fullWidth
|
{/*fullWidth*/}
|
||||||
/>
|
{/*/>*/}
|
||||||
|
<AutoComplete
|
||||||
|
placeholder={"City"}
|
||||||
|
onChange={val => console.log(val)}
|
||||||
|
suggestions={[
|
||||||
|
{
|
||||||
|
label: "Indonesia",
|
||||||
|
value: "ID"
|
||||||
|
}
|
||||||
|
]}/>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||||
<TextField
|
{/*<TextField*/}
|
||||||
id="district"
|
{/*id="district"*/}
|
||||||
label="District"
|
{/*label="District"*/}
|
||||||
value={this.state.district}
|
{/*value={this.state.district}*/}
|
||||||
onChange={this.handleChange('district')}
|
{/*onChange={this.handleChange('district')}*/}
|
||||||
margin="normal"
|
{/*margin="normal"*/}
|
||||||
variant="outlined"
|
{/*variant="outlined"*/}
|
||||||
fullWidth
|
{/*fullWidth*/}
|
||||||
/>
|
{/*/>*/}
|
||||||
|
<AutoComplete
|
||||||
|
placeholder={"District"}
|
||||||
|
onChange={val => console.log(val)}
|
||||||
|
suggestions={[
|
||||||
|
{
|
||||||
|
label: "Indonesia",
|
||||||
|
value: "ID"
|
||||||
|
}
|
||||||
|
]}/>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||||
<TextField
|
{/*<TextField*/}
|
||||||
id="sub_district"
|
{/*id="sub_district"*/}
|
||||||
label="Sub district"
|
{/*label="Sub district"*/}
|
||||||
value={this.state.sub_district}
|
{/*value={this.state.sub_district}*/}
|
||||||
onChange={this.handleChange('sub_district')}
|
{/*onChange={this.handleChange('sub_district')}*/}
|
||||||
margin="normal"
|
{/*margin="normal"*/}
|
||||||
variant="outlined"
|
{/*variant="outlined"*/}
|
||||||
fullWidth
|
{/*fullWidth*/}
|
||||||
/>
|
{/*/>*/}
|
||||||
|
|
||||||
|
<AutoComplete
|
||||||
|
placeholder={"Subdistrict"}
|
||||||
|
onChange={val => console.log(val)}
|
||||||
|
suggestions={[
|
||||||
|
{
|
||||||
|
label: "Indonesia",
|
||||||
|
value: "ID"
|
||||||
|
}
|
||||||
|
]}/>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||||
<TextField
|
<TextField
|
||||||
id="zip_code"
|
id="zip_code"
|
||||||
label="Zip Code"
|
label="Zip Code"
|
||||||
|
@ -344,7 +362,7 @@ class RegisterPage extends React.Component {
|
||||||
/>
|
/>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||||
<TextField
|
<TextField
|
||||||
id="password"
|
id="password"
|
||||||
label="Password"
|
label="Password"
|
||||||
|
@ -368,7 +386,7 @@ class RegisterPage extends React.Component {
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
<Grid item xs={16} sm={16} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||||
<TextField
|
<TextField
|
||||||
id="confirmPassword"
|
id="confirmPassword"
|
||||||
label="Re-type Password"
|
label="Re-type Password"
|
||||||
|
|
Loading…
Reference in New Issue
Block a user