Merge branch 'development' into feature/instant/buy-quote-heartbeat

This commit is contained in:
Steve Klebanoff 2018-11-09 10:06:22 -08:00
commit df91d34315
143 changed files with 1514 additions and 603 deletions

View File

@ -31,7 +31,7 @@ jobs:
- restore_cache:
keys:
- repo-{{ .Environment.CIRCLE_SHA1 }}
- run: cd packages/website && yarn build
- run: cd packages/website && yarn build:prod
test-contracts-ganache:
docker:
- image: circleci/node:9

View File

@ -1,4 +1,13 @@
[
{
"version": "2.0.1",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"version": "2.0.0",
"changes": [

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v2.0.1 - _November 9, 2018_
* Dependencies updated
## v2.0.0 - _October 18, 2018_
* Add support for `eth_signTypedData`. (#1102)

View File

@ -1,6 +1,6 @@
{
"name": "0x.js",
"version": "2.0.0",
"version": "2.0.1",
"engines": {
"node": ">=6.12"
},
@ -42,12 +42,12 @@
},
"license": "Apache-2.0",
"devDependencies": {
"@0x/abi-gen": "^1.0.14",
"@0x/abi-gen-wrappers": "^1.0.1",
"@0x/contract-addresses": "^1.0.1",
"@0x/dev-utils": "^1.0.13",
"@0x/migrations": "^2.0.0",
"@0x/tslint-config": "^1.0.9",
"@0x/abi-gen": "^1.0.15",
"@0x/abi-gen-wrappers": "^1.0.2",
"@0x/contract-addresses": "^1.1.0",
"@0x/dev-utils": "^1.0.14",
"@0x/migrations": "^2.0.1",
"@0x/tslint-config": "^1.0.10",
"@types/lodash": "4.14.104",
"@types/mocha": "^2.2.42",
"@types/node": "*",
@ -73,18 +73,18 @@
"webpack": "^4.20.2"
},
"dependencies": {
"@0x/assert": "^1.0.14",
"@0x/base-contract": "^3.0.2",
"@0x/contract-wrappers": "^3.0.0",
"@0x/order-utils": "^2.0.0",
"@0x/order-watcher": "^2.2.0",
"@0x/subproviders": "^2.1.0",
"@0x/types": "^1.2.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"@0x/assert": "^1.0.15",
"@0x/base-contract": "^3.0.3",
"@0x/contract-wrappers": "^3.0.1",
"@0x/order-utils": "^2.0.1",
"@0x/order-watcher": "^2.2.1",
"@0x/subproviders": "^2.1.1",
"@0x/types": "^1.2.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"@types/web3-provider-engine": "^14.0.0",
"ethereum-types": "^1.1.1",
"ethereum-types": "^1.1.2",
"ethers": "~4.0.4",
"lodash": "^4.17.5",
"web3-provider-engine": "14.0.6"

View File

@ -1,4 +1,13 @@
[
{
"version": "1.0.2",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"timestamp": 1539871071,
"version": "1.0.1",

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v1.0.2 - _November 9, 2018_
* Dependencies updated
## v1.0.1 - _October 18, 2018_
* Dependencies updated

View File

@ -1,6 +1,6 @@
{
"name": "@0x/abi-gen-wrappers",
"version": "1.0.1",
"version": "1.0.2",
"engines": {
"node": ">=6.12"
},
@ -30,17 +30,17 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/abi-gen-wrappers/README.md",
"devDependencies": {
"@0x/abi-gen": "^1.0.14",
"@0x/tslint-config": "^1.0.9",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"ethereum-types": "^1.1.1",
"@0x/abi-gen": "^1.0.15",
"@0x/tslint-config": "^1.0.10",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"ethereum-types": "^1.1.2",
"ethers": "~4.0.4",
"lodash": "^4.17.5",
"shx": "^0.2.2"
},
"dependencies": {
"@0x/base-contract": "^3.0.2"
"@0x/base-contract": "^3.0.3"
},
"publishConfig": {
"access": "public"

View File

@ -1,4 +1,13 @@
[
{
"version": "1.0.15",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"timestamp": 1539871071,
"version": "1.0.14",

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v1.0.15 - _November 9, 2018_
* Dependencies updated
## v1.0.14 - _October 18, 2018_
* Dependencies updated

View File

@ -1,6 +1,6 @@
{
"name": "@0x/abi-gen",
"version": "1.0.14",
"version": "1.0.15",
"engines": {
"node": ">=6.12"
},
@ -31,10 +31,10 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/abi-gen/README.md",
"dependencies": {
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"chalk": "^2.3.0",
"ethereum-types": "^1.1.1",
"ethereum-types": "^1.1.2",
"glob": "^7.1.2",
"handlebars": "^4.0.11",
"lodash": "^4.17.5",
@ -45,7 +45,7 @@
"yargs": "^10.0.3"
},
"devDependencies": {
"@0x/tslint-config": "^1.0.9",
"@0x/tslint-config": "^1.0.10",
"@types/glob": "5.0.35",
"@types/handlebars": "^4.0.36",
"@types/mkdirp": "^0.5.1",

View File

@ -1,4 +1,13 @@
[
{
"version": "1.0.15",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"timestamp": 1539871071,
"version": "1.0.14",

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v1.0.15 - _November 9, 2018_
* Dependencies updated
## v1.0.14 - _October 18, 2018_
* Dependencies updated

View File

@ -1,6 +1,6 @@
{
"name": "@0x/assert",
"version": "1.0.14",
"version": "1.0.15",
"engines": {
"node": ">=6.12"
},
@ -29,7 +29,7 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/assert/README.md",
"devDependencies": {
"@0x/tslint-config": "^1.0.9",
"@0x/tslint-config": "^1.0.10",
"@types/lodash": "4.14.104",
"@types/mocha": "^2.2.42",
"@types/valid-url": "^1.0.2",
@ -44,9 +44,9 @@
"typescript": "3.0.1"
},
"dependencies": {
"@0x/json-schemas": "^2.0.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/json-schemas": "^2.0.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"lodash": "^4.17.5",
"valid-url": "^1.0.9"
},

View File

@ -29,7 +29,8 @@
"note": "Lower default expiry buffer from 5 minutes to 2 minutes",
"pr": 1217
}
]
],
"timestamp": 1541740904
},
{
"version": "2.1.0",

View File

@ -5,6 +5,15 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v2.2.0 - _November 9, 2018_
* `getAssetBuyerForProvidedOrders` factory function now takes 3 args instead of 4 (#1187)
* the `OrderProvider` now requires a new method `getAvailableMakerAssetDatasAsync` and the `StandardRelayerAPIOrderProvider` requires the network id at init. (#1203)
* No longer require that provided orders all have the same maker and taker asset data (#1197)
* Fix bug where `BuyQuoteInfo` objects could return `totalEthAmount` and `feeEthAmount` that were not whole numbers (#1207)
* Fix bug where default values for `AssetBuyer` public facing methods could get overriden by `undefined` values (#1207)
* Lower default expiry buffer from 5 minutes to 2 minutes (#1217)
## v2.1.0 - _October 18, 2018_
* Add `gasLimit` and `gasPrice` as optional properties on `BuyQuoteExecutionOpts`
@ -13,6 +22,7 @@ CHANGELOG
* Add `gasLimit` and `gasPrice` as optional properties on `BuyQuoteExecutionOpts` (#1116)
* Add `docs:json` command to package.json (#1139)
* Add missing types to public interface (#1139)
* Throw `SignatureRequestDenied` and `TransactionValueTooLow` errors when executing buy (#1147)
## v2.0.0 - _October 4, 2018_

View File

@ -1,6 +1,6 @@
{
"name": "@0x/asset-buyer",
"version": "2.1.0",
"version": "2.2.0",
"engines": {
"node": ">=6.12"
},
@ -36,21 +36,21 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/asset-buyer/README.md",
"dependencies": {
"@0x/assert": "^1.0.14",
"@0x/connect": "^3.0.2",
"@0x/contract-wrappers": "^3.0.0",
"@0x/json-schemas": "^2.0.0",
"@0x/order-utils": "^2.0.0",
"@0x/subproviders": "^2.1.0",
"@0x/types": "^1.2.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"ethereum-types": "^1.1.1",
"@0x/assert": "^1.0.15",
"@0x/connect": "^3.0.3",
"@0x/contract-wrappers": "^3.0.1",
"@0x/json-schemas": "^2.0.1",
"@0x/order-utils": "^2.0.1",
"@0x/subproviders": "^2.1.1",
"@0x/types": "^1.2.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"ethereum-types": "^1.1.2",
"lodash": "^4.17.10"
},
"devDependencies": {
"@0x/tslint-config": "^1.0.9",
"@0x/tslint-config": "^1.0.10",
"@types/lodash": "^4.14.116",
"@types/mocha": "^2.2.42",
"@types/node": "*",

View File

@ -1,4 +1,13 @@
[
{
"version": "3.0.3",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"timestamp": 1539871071,
"version": "3.0.2",

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v3.0.3 - _November 9, 2018_
* Dependencies updated
## v3.0.2 - _October 18, 2018_
* Dependencies updated

View File

@ -1,6 +1,6 @@
{
"name": "@0x/base-contract",
"version": "3.0.2",
"version": "3.0.3",
"engines": {
"node": ">=6.12"
},
@ -29,7 +29,7 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/base-contract/README.md",
"devDependencies": {
"@0x/tslint-config": "^1.0.9",
"@0x/tslint-config": "^1.0.10",
"@types/lodash": "4.14.104",
"chai": "^4.0.1",
"make-promises-safe": "^1.1.0",
@ -40,10 +40,10 @@
"typescript": "3.0.1"
},
"dependencies": {
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"ethereum-types": "^1.1.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"ethereum-types": "^1.1.2",
"ethers": "~4.0.4",
"lodash": "^4.17.5"
},

View File

@ -1,4 +1,13 @@
[
{
"version": "3.0.3",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"timestamp": 1539871071,
"version": "3.0.2",

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v3.0.3 - _November 9, 2018_
* Dependencies updated
## v3.0.2 - _October 18, 2018_
* Dependencies updated

View File

@ -1,6 +1,6 @@
{
"name": "@0x/connect",
"version": "3.0.2",
"version": "3.0.3",
"engines": {
"node": ">=6.12"
},
@ -44,12 +44,12 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/connect/README.md",
"dependencies": {
"@0x/assert": "^1.0.14",
"@0x/json-schemas": "^2.0.0",
"@0x/order-utils": "^2.0.0",
"@0x/types": "^1.2.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/assert": "^1.0.15",
"@0x/json-schemas": "^2.0.1",
"@0x/order-utils": "^2.0.1",
"@0x/types": "^1.2.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"lodash": "^4.17.5",
"query-string": "^5.0.1",
"sinon": "^4.0.0",
@ -57,7 +57,7 @@
"websocket": "^1.0.25"
},
"devDependencies": {
"@0x/tslint-config": "^1.0.9",
"@0x/tslint-config": "^1.0.10",
"@types/fetch-mock": "^6.0.3",
"@types/lodash": "4.14.104",
"@types/mocha": "^2.2.42",

View File

@ -6,7 +6,8 @@
"pr": 1192,
"note": "Update Forwarder addresses"
}
]
],
"timestamp": 1541740904
},
{
"version": "1.0.1",

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v1.1.0 - _November 9, 2018_
* Update Forwarder addresses (#1192)
## v1.0.1 - _October 18, 2018_
* Initial release (#1105)

View File

@ -1,6 +1,6 @@
{
"name": "@0x/contract-addresses",
"version": "1.0.1",
"version": "1.1.0",
"engines": {
"node": ">=6.12"
},

View File

@ -6,7 +6,8 @@
"pr": 1192,
"note": "Update Forwarder artifact"
}
]
],
"timestamp": 1541740904
},
{
"version": "1.0.1",

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v1.1.0 - _November 9, 2018_
* Update Forwarder artifact (#1192)
## v1.0.1 - _October 18, 2018_
* Initial release (#1105)

View File

@ -1,6 +1,6 @@
{
"name": "@0x/contract-artifacts",
"version": "1.0.1",
"version": "1.1.0",
"engines": {
"node": ">=6.12"
},

View File

@ -6,7 +6,8 @@
"note": "Fix bug in `ForwarderWrapper` where `feeRecipientAddress` was not correctly normalized.",
"pr": 1178
}
]
],
"timestamp": 1541740904
},
{
"version": "3.0.0",

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v3.0.1 - _November 9, 2018_
* Fix bug in `ForwarderWrapper` where `feeRecipientAddress` was not correctly normalized. (#1178)
## v3.0.0 - _October 18, 2018_
* Add optional validation to the forwarder wrapper methods
@ -15,6 +19,8 @@ CHANGELOG
* Removed `setProvider` method in top-level `ContractWrapper` class and added new `unsubscribeAll` method. (#1105)
* Some properties and methods have been renamed. For example, some methods that previously could throw no longer can, and so their names have been updated accordingly. (#1105)
* Removed ContractNotFound errors. Checking for this error was somewhat ineffecient. Relevant methods/functions now return the default error from web3-wrapper, which we feel provides enough information. (#1105)
* Add `ForwarderWrapperError` to public interface (#1147)
* Add `ContractWrapperError.SignatureRequestDenied` to public interface (#1147)
## v2.0.2 - _October 4, 2018_

View File

@ -1,6 +1,6 @@
{
"name": "@0x/contract-wrappers",
"version": "3.0.0",
"version": "3.0.1",
"description": "Smart TS wrappers for 0x smart contracts",
"keywords": [
"0xproject",
@ -37,10 +37,10 @@
"node": ">=6.0.0"
},
"devDependencies": {
"@0x/dev-utils": "^1.0.13",
"@0x/migrations": "^2.0.0",
"@0x/subproviders": "^2.1.0",
"@0x/tslint-config": "^1.0.9",
"@0x/dev-utils": "^1.0.14",
"@0x/migrations": "^2.0.1",
"@0x/subproviders": "^2.1.1",
"@0x/tslint-config": "^1.0.10",
"@types/lodash": "4.14.104",
"@types/mocha": "^2.2.42",
"@types/node": "*",
@ -65,18 +65,18 @@
"web3-provider-engine": "14.0.6"
},
"dependencies": {
"@0x/abi-gen-wrappers": "^1.0.1",
"@0x/assert": "^1.0.14",
"@0x/contract-addresses": "^1.0.1",
"@0x/contract-artifacts": "^1.0.1",
"@0x/fill-scenarios": "^1.0.8",
"@0x/json-schemas": "^2.0.0",
"@0x/order-utils": "^2.0.0",
"@0x/types": "^1.2.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"ethereum-types": "^1.1.1",
"@0x/abi-gen-wrappers": "^1.0.2",
"@0x/assert": "^1.0.15",
"@0x/contract-addresses": "^1.1.0",
"@0x/contract-artifacts": "^1.1.0",
"@0x/fill-scenarios": "^1.0.9",
"@0x/json-schemas": "^2.0.1",
"@0x/order-utils": "^2.0.1",
"@0x/types": "^1.2.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"ethereum-types": "^1.1.2",
"ethereumjs-blockstream": "6.0.0",
"ethereumjs-util": "^5.1.1",
"ethers": "~4.0.4",

View File

@ -1,7 +1,7 @@
{
"private": true,
"name": "contracts",
"version": "2.1.50",
"version": "2.1.51",
"engines": {
"node": ">=6.12"
},
@ -45,12 +45,12 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/contracts/README.md",
"devDependencies": {
"@0x/abi-gen": "^1.0.14",
"@0x/dev-utils": "^1.0.13",
"@0x/sol-compiler": "^1.1.8",
"@0x/sol-cov": "^2.1.8",
"@0x/subproviders": "^2.1.0",
"@0x/tslint-config": "^1.0.9",
"@0x/abi-gen": "^1.0.15",
"@0x/dev-utils": "^1.0.14",
"@0x/sol-compiler": "^1.1.9",
"@0x/sol-cov": "^2.1.9",
"@0x/subproviders": "^2.1.1",
"@0x/tslint-config": "^1.0.10",
"@types/bn.js": "^4.11.0",
"@types/ethereumjs-abi": "^0.6.0",
"@types/lodash": "4.14.104",
@ -71,15 +71,15 @@
"yargs": "^10.0.3"
},
"dependencies": {
"@0x/base-contract": "^3.0.2",
"@0x/order-utils": "^2.0.0",
"@0x/types": "^1.2.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"@0x/base-contract": "^3.0.3",
"@0x/order-utils": "^2.0.1",
"@0x/types": "^1.2.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"@types/js-combinatorics": "^0.5.29",
"bn.js": "^4.11.8",
"ethereum-types": "^1.1.1",
"ethereum-types": "^1.1.2",
"ethereumjs-abi": "0.6.5",
"ethereumjs-util": "^5.1.1",
"ethers": "~4.0.4",

View File

@ -1,6 +1,6 @@
{
"name": "@0x/dev-tools-pages",
"version": "0.0.2",
"version": "0.0.3",
"engines": {
"node": ">=6.12"
},
@ -16,7 +16,7 @@
},
"license": "Apache-2.0",
"dependencies": {
"@0x/react-shared": "^1.0.17",
"@0x/react-shared": "^1.0.18",
"basscss": "^8.0.3",
"bowser": "^1.9.3",
"less": "^2.7.2",

View File

@ -1,4 +1,13 @@
[
{
"version": "1.0.14",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"version": "1.0.13",
"changes": [

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v1.0.14 - _November 9, 2018_
* Dependencies updated
## v1.0.13 - _October 18, 2018_
* Make web3-provider-engine types a 'dependency' so it's available to users of the library (#1105)

View File

@ -1,6 +1,6 @@
{
"name": "@0x/dev-utils",
"version": "1.0.13",
"version": "1.0.14",
"engines": {
"node": ">=6.12"
},
@ -29,7 +29,7 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/dev-utils/README.md",
"devDependencies": {
"@0x/tslint-config": "^1.0.9",
"@0x/tslint-config": "^1.0.10",
"@types/lodash": "4.14.104",
"@types/mocha": "^2.2.42",
"make-promises-safe": "^1.1.0",
@ -41,14 +41,14 @@
"typescript": "3.0.1"
},
"dependencies": {
"@0x/subproviders": "^2.1.0",
"@0x/types": "^1.2.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"@0x/subproviders": "^2.1.1",
"@0x/types": "^1.2.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"@types/web3-provider-engine": "^14.0.0",
"chai": "^4.0.1",
"ethereum-types": "^1.1.1",
"ethereum-types": "^1.1.2",
"lodash": "^4.17.5"
},
"publishConfig": {

View File

@ -1,4 +1,13 @@
[
{
"version": "1.1.2",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"version": "1.1.1",
"changes": [

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v1.1.2 - _November 9, 2018_
* Dependencies updated
## v1.1.1 - _October 18, 2018_
* Add `JSONRPCResponseError` and error field on `JSONRPCResponsePayload`. (#1102)

View File

@ -1,6 +1,6 @@
{
"name": "ethereum-types",
"version": "1.1.1",
"version": "1.1.2",
"engines": {
"node": ">=6.12"
},
@ -29,7 +29,7 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/ethereum-types/README.md",
"devDependencies": {
"@0x/tslint-config": "^1.0.9",
"@0x/tslint-config": "^1.0.10",
"make-promises-safe": "^1.1.0",
"shx": "^0.2.2",
"tslint": "5.11.0",

View File

@ -1,4 +1,13 @@
[
{
"version": "1.0.9",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"version": "1.0.8",
"changes": [

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v1.0.9 - _November 9, 2018_
* Dependencies updated
## v1.0.8 - _October 18, 2018_
* Updated to use new @0xproject/contract-artifacts and @0xproject/abi-gen-wrappers packages (#1105)

View File

@ -1,6 +1,6 @@
{
"name": "@0x/fill-scenarios",
"version": "1.0.8",
"version": "1.0.9",
"description": "0x order fill scenario generator",
"main": "lib/index.js",
"types": "lib/index.d.ts",
@ -20,7 +20,7 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/fill-scenarios/README.md",
"devDependencies": {
"@0x/tslint-config": "^1.0.9",
"@0x/tslint-config": "^1.0.10",
"@types/lodash": "4.14.104",
"make-promises-safe": "^1.1.0",
"shx": "^0.2.2",
@ -28,15 +28,15 @@
"typescript": "3.0.1"
},
"dependencies": {
"@0x/abi-gen-wrappers": "^1.0.1",
"@0x/base-contract": "^3.0.2",
"@0x/contract-artifacts": "^1.0.1",
"@0x/order-utils": "^2.0.0",
"@0x/types": "^1.2.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"ethereum-types": "^1.1.1",
"@0x/abi-gen-wrappers": "^1.0.2",
"@0x/base-contract": "^3.0.3",
"@0x/contract-artifacts": "^1.1.0",
"@0x/order-utils": "^2.0.1",
"@0x/types": "^1.2.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"ethereum-types": "^1.1.2",
"ethers": "~4.0.4",
"lodash": "^4.17.5"
},

View File

@ -1,6 +1,6 @@
{
"name": "@0x/instant",
"version": "0.0.3",
"version": "0.0.4",
"engines": {
"node": ">=6.12"
},
@ -45,16 +45,17 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/instant/README.md",
"dependencies": {
"@0x/assert": "^1.0.14",
"@0x/asset-buyer": "^2.1.0",
"@0x/json-schemas": "^2.0.0",
"@0x/order-utils": "^2.0.0",
"@0x/subproviders": "^2.1.0",
"@0x/types": "^1.2.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"ethereum-types": "^1.1.1",
"@0x/assert": "^1.0.15",
"@0x/asset-buyer": "^2.2.0",
"@0x/json-schemas": "^2.0.1",
"@0x/order-utils": "^2.0.1",
"@0x/subproviders": "^2.1.1",
"@0x/types": "^1.2.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"copy-to-clipboard": "^3.0.8",
"ethereum-types": "^1.1.2",
"lodash": "^4.17.10",
"polished": "^2.2.0",
"react": "^16.5.2",
@ -66,7 +67,7 @@
"ts-optchain": "^0.1.1"
},
"devDependencies": {
"@0x/tslint-config": "^1.0.9",
"@0x/tslint-config": "^1.0.10",
"@static/discharge": "https://github.com/0xProject/discharge.git",
"@types/enzyme": "^3.1.14",
"@types/enzyme-adapter-react-16": "^1.0.3",

View File

@ -0,0 +1,25 @@
/*
CSS file meant to represent an external (integrators) stylesheet and
help ensure that instant looks consistent across environments.
*/
button {
font-size: 50px;
height: 200px;
background-color: red;
}
input {
padding: 100px;
font-size: 50px;
height: 100px;
}
div {
padding: 3px;
}
p {
background-color: green;
margin: 10px;
}

View File

@ -5,6 +5,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>0x Instant Dev Environment</title>
<link rel="stylesheet" href="/external.css">
<script type="text/javascript" src="/main.bundle.js" charset="utf-8"></script>
<script type="text/javascript" src="https://unpkg.com/jsuri@1.3.1/Uri.js" charset="utf-8"></script>
<script type="text/javascript" src="https://unpkg.com/bignumber.js@4.1.0/bignumber.js" charset="utf-8"></script>

View File

@ -1,5 +1,6 @@
import { Keyframes } from 'styled-components';
import { InterpolationValue } from 'styled-components';
import { media, OptionallyScreenSpecific, stylesForMedia } from '../../style/media';
import { css, keyframes, styled } from '../../style/theme';
export interface TransitionInfo {
@ -51,30 +52,59 @@ export interface PositionAnimationSettings {
right?: TransitionInfo;
timingFunction: string;
duration?: string;
position?: string;
}
export interface PositionAnimationProps extends PositionAnimationSettings {
position: string;
const generatePositionAnimationCss = (positionSettings: PositionAnimationSettings) => {
return css`
animation-name: ${slideKeyframeGenerator(
positionSettings.position || 'relative',
positionSettings.top,
positionSettings.bottom,
positionSettings.left,
positionSettings.right,
)};
animation-duration: ${positionSettings.duration || '0.3s'};
animation-timing-function: ${positionSettings.timingFunction};
animation-delay: 0s;
animation-iteration-count: 1;
animation-fill-mode: forwards;
position: ${positionSettings.position || 'relative'};
width: 100%;
`;
};
export interface PositionAnimationProps {
positionSettings: OptionallyScreenSpecific<PositionAnimationSettings>;
zIndex?: OptionallyScreenSpecific<number>;
height?: string;
}
const defaultAnimation = (positionSettings: OptionallyScreenSpecific<PositionAnimationSettings>) => {
const bestDefault = 'default' in positionSettings ? positionSettings.default : positionSettings;
return generatePositionAnimationCss(bestDefault);
};
const animationForSize = (
positionSettings: OptionallyScreenSpecific<PositionAnimationSettings>,
sizeKey: 'sm' | 'md' | 'lg',
mediaFn: (...args: any[]) => InterpolationValue[],
) => {
// checking default makes sure we have a PositionAnimationSettings object
// and then we check to see if we have a setting for the specific `sizeKey`
const animationSettingsForSize = 'default' in positionSettings && positionSettings[sizeKey];
return animationSettingsForSize && mediaFn`${generatePositionAnimationCss(animationSettingsForSize)}`;
};
export const PositionAnimation =
styled.div <
PositionAnimationProps >
`
animation-name: ${props =>
css`
${slideKeyframeGenerator(props.position, props.top, props.bottom, props.left, props.right)};
`};
animation-duration: ${props => props.duration || '0.3s'};
animation-timing-function: ${props => props.timingFunction};
animation-delay: 0s;
animation-iteration-count: 1;
animation-fill-mode: forwards;
position: ${props => props.position};
height: 100%;
width: 100%;
&& {
${props => props.zIndex && stylesForMedia<number>('z-index', props.zIndex)}
${props => defaultAnimation(props.positionSettings)}
${props => animationForSize(props.positionSettings, 'sm', media.small)}
${props => animationForSize(props.positionSettings, 'md', media.medium)}
${props => animationForSize(props.positionSettings, 'lg', media.large)}
${props => (props.height ? `height: ${props.height};` : '')}
}
`;
PositionAnimation.defaultProps = {
position: 'relative',
};

View File

@ -1,22 +1,25 @@
import * as React from 'react';
import { OptionallyScreenSpecific } from '../../style/media';
import { PositionAnimation, PositionAnimationSettings } from './position_animation';
export type SlideAnimationState = 'slidIn' | 'slidOut' | 'none';
export interface SlideAnimationProps {
position: string;
animationState: SlideAnimationState;
slideInSettings: PositionAnimationSettings;
slideOutSettings: PositionAnimationSettings;
slideInSettings: OptionallyScreenSpecific<PositionAnimationSettings>;
slideOutSettings: OptionallyScreenSpecific<PositionAnimationSettings>;
zIndex?: OptionallyScreenSpecific<number>;
height?: string;
}
export const SlideAnimation: React.StatelessComponent<SlideAnimationProps> = props => {
if (props.animationState === 'none') {
return <React.Fragment>{props.children}</React.Fragment>;
}
const propsToUse = props.animationState === 'slidIn' ? props.slideInSettings : props.slideOutSettings;
const positionSettings = props.animationState === 'slidIn' ? props.slideInSettings : props.slideOutSettings;
return (
<PositionAnimation position={props.position} {...propsToUse}>
<PositionAnimation height={props.height} positionSettings={positionSettings} zIndex={props.zIndex}>
{props.children}
</PositionAnimation>
);

View File

@ -12,7 +12,6 @@ import { gasPriceEstimator } from '../util/gas_price_estimator';
import { util } from '../util/util';
import { Button } from './ui/button';
import { Text } from './ui/text';
export interface BuyButtonProps {
accountAddress?: string;
@ -39,10 +38,14 @@ export class BuyButton extends React.Component<BuyButtonProps> {
const { buyQuote, accountAddress } = this.props;
const shouldDisableButton = _.isUndefined(buyQuote) || _.isUndefined(accountAddress);
return (
<Button width="100%" onClick={this._handleClick} isDisabled={shouldDisableButton}>
<Text fontColor={ColorOption.white} fontWeight={600} fontSize="20px">
Buy
</Text>
<Button
width="100%"
onClick={this._handleClick}
isDisabled={shouldDisableButton}
fontColor={ColorOption.white}
fontSize="20px"
>
Buy
</Button>
);
}

View File

@ -12,7 +12,6 @@ import { SecondaryButton } from './secondary_button';
import { Button } from './ui/button';
import { Flex } from './ui/flex';
import { Text } from './ui/text';
export interface BuyOrderStateButtonProps {
accountAddress?: string;
@ -36,10 +35,8 @@ export const BuyOrderStateButtons: React.StatelessComponent<BuyOrderStateButtonP
if (props.buyOrderProcessingState === OrderProcessState.Failure) {
return (
<Flex justify="space-between">
<Button width="48%" onClick={props.onRetry}>
<Text fontColor={ColorOption.white} fontWeight={600} fontSize="16px">
Back
</Text>
<Button width="48%" onClick={props.onRetry} fontColor={ColorOption.white} fontSize="16px">
Back
</Button>
<SecondaryButton width="48%" onClick={props.onViewTransaction}>
Details

View File

@ -0,0 +1,32 @@
import { INJECTED_DIV_CLASS } from '../constants';
import { createGlobalStyle } from '../style/theme';
export interface CSSResetProps {}
/*
* Derived from
* https://github.com/jtrost/Complete-CSS-Reset
*/
export const CSSReset = createGlobalStyle`
.${INJECTED_DIV_CLASS} {
a, abbr, area, article, aside, audio, b, bdo, blockquote, body, button,
canvas, caption, cite, code, col, colgroup, command, datalist, dd, del,
details, dialog, dfn, div, dl, dt, em, embed, fieldset, figure, form,
h1, h2, h3, h4, h5, h6, head, header, hgroup, hr, html, i, iframe, img,
input, ins, keygen, kbd, label, legend, li, map, mark, menu, meter, nav,
noscript, object, ol, optgroup, option, output, p, param, pre, progress,
q, rp, rt, ruby, samp, section, select, small, span, strong, sub, sup,
table, tbody, td, textarea, tfoot, th, thead, time, tr, ul, var, video {
background: transparent;
border: 0;
font-size: 100%;
font: inherit;
margin: 0;
outline: none;
padding: 0;
text-align: left;
text-decoration: none;
vertical-align: baseline;
}
}
`;

View File

@ -113,7 +113,7 @@ export class ERC20AssetAmountInput extends React.Component<ERC20AssetAmountInput
}
return (
<Container marginLeft="5px">
<Icon icon="chevron" width={12} onClick={this._handleSelectAssetClick} />
<Icon icon="chevron" width={12} stroke={ColorOption.white} onClick={this._handleSelectAssetClick} />
</Container>
);
};

View File

@ -28,14 +28,14 @@ export class ERC20TokenSelector extends React.Component<ERC20TokenSelectorProps>
public render(): React.ReactNode {
const { tokens, onTokenSelect } = this.props;
return (
<Container>
<Container height="100%">
<SearchInput
placeholder="Search tokens..."
width="100%"
value={this.state.searchQuery}
onChange={this._handleSearchInputChange}
/>
<Container overflow="scroll" height={{ default: '275px', sm: '75vh' }} marginTop="10px">
<Container overflow="scroll" height="calc(100% - 80px)" marginTop="10px">
{_.map(tokens, token => {
if (!this._isTokenQueryMatch(token)) {
return null;
@ -85,7 +85,7 @@ class TokenSelectorRow extends React.Component<TokenSelectorRowProps> {
<Container marginLeft="5px">
<Flex justify="flex-start">
<Container marginRight="10px">
<Circle diameter={30} fillColor={token.metaData.primaryColor}>
<Circle diameter={30} rawColor={token.metaData.primaryColor}>
<Flex height="100%">
<Text fontColor={ColorOption.white} fontSize="8px">
{displaySymbol}

View File

@ -0,0 +1,45 @@
import { BigNumber } from '@0x/utils';
import * as _ from 'lodash';
import * as React from 'react';
import { ColorOption } from '../style/theme';
import { Network } from '../types';
import { PaymentMethodDropdown } from './payment_method_dropdown';
import { Circle } from './ui/circle';
import { Container } from './ui/container';
import { Flex } from './ui/flex';
import { Text } from './ui/text';
export interface PaymentMethodProps {}
export const PaymentMethod: React.StatelessComponent<PaymentMethodProps> = () => (
<Container padding="20px" width="100%">
<Container marginBottom="10px">
<Flex justify="space-between">
<Text
letterSpacing="1px"
fontColor={ColorOption.primaryColor}
fontWeight={600}
textTransform="uppercase"
fontSize="14px"
>
Payment Method
</Text>
<Flex>
<Circle color={ColorOption.green} diameter={8} />
<Container marginLeft="3px">
<Text fontColor={ColorOption.darkGrey} fontSize="12px">
MetaMask
</Text>
</Container>
</Flex>
</Flex>
</Container>
<PaymentMethodDropdown
accountAddress="0xa1b2c3d4e5f6g7h8j9k10"
accountEthBalanceInWei={new BigNumber(10500000000000000000)}
network={Network.Mainnet}
/>
</Container>
);

View File

@ -0,0 +1,44 @@
import { BigNumber } from '@0x/utils';
import copy from 'copy-to-clipboard';
import * as React from 'react';
import { Network } from '../types';
import { etherscanUtil } from '../util/etherscan';
import { format } from '../util/format';
import { Dropdown, DropdownItemConfig } from './ui/dropdown';
export interface PaymentMethodDropdownProps {
accountAddress: string;
accountEthBalanceInWei?: BigNumber;
network: Network;
}
export class PaymentMethodDropdown extends React.Component<PaymentMethodDropdownProps> {
public render(): React.ReactNode {
const { accountAddress, accountEthBalanceInWei } = this.props;
const value = format.ethAddress(accountAddress);
const label = format.ethBaseAmount(accountEthBalanceInWei, 4, '') as string;
return <Dropdown value={value} label={label} items={this._getDropdownItemConfigs()} />;
}
private readonly _getDropdownItemConfigs = (): DropdownItemConfig[] => {
const viewOnEtherscan = {
text: 'View on Etherscan',
onClick: this._handleEtherscanClick,
};
const copyAddressToClipboard = {
text: 'Copy address to clipboard',
onClick: this._handleCopyToClipboardClick,
};
return [viewOnEtherscan, copyAddressToClipboard];
};
private readonly _handleEtherscanClick = (): void => {
const { accountAddress, network } = this.props;
const etherscanUrl = etherscanUtil.getEtherScanEthAddressIfExists(accountAddress, network);
window.open(etherscanUrl, '_blank');
};
private readonly _handleCopyToClipboardClick = (): void => {
const { accountAddress } = this.props;
copy(accountAddress);
};
}

View File

@ -5,15 +5,12 @@ import { ColorOption } from '../style/theme';
import { Button } from './ui/button';
import { Container } from './ui/container';
import { Spinner } from './ui/spinner';
import { Text } from './ui/text';
export const PlacingOrderButton: React.StatelessComponent<{}> = props => (
<Button isDisabled={true} width="100%">
<Button isDisabled={true} width="100%" fontColor={ColorOption.white} fontSize="20px">
<Container display="inline-block" position="relative" top="3px" marginRight="8px">
<Spinner widthPx={20} heightPx={20} />
</Container>
<Text fontColor={ColorOption.white} fontWeight={600} fontSize="20px">
Placing Order&hellip;
</Text>
Placing Order&hellip;
</Button>
);

View File

@ -4,7 +4,6 @@ import * as React from 'react';
import { ColorOption } from '../style/theme';
import { Button, ButtonProps } from './ui/button';
import { Text } from './ui/text';
export interface SecondaryButtonProps extends ButtonProps {}
@ -16,11 +15,11 @@ export const SecondaryButton: React.StatelessComponent<SecondaryButtonProps> = p
borderColor={ColorOption.lightGrey}
width={props.width}
onClick={props.onClick}
fontColor={ColorOption.primaryColor}
fontSize="16px"
{...buttonProps}
>
<Text fontColor={ColorOption.primaryColor} fontWeight={600} fontSize="16px">
{props.children}
</Text>
{props.children}
</Button>
);
};

View File

@ -1,6 +1,8 @@
import * as React from 'react';
import { ScreenSpecification } from '../style/media';
import { ColorOption } from '../style/theme';
import { zIndex } from '../style/z_index';
import { PositionAnimationSettings } from './animations/position_animation';
import { SlideAnimation, SlideAnimationState } from './animations/slide_animation';
@ -21,6 +23,7 @@ export const Error: React.StatelessComponent<ErrorProps> = props => (
backgroundColor={ColorOption.lightOrange}
width="100%"
borderRadius="6px"
marginTop="10px"
marginBottom="10px"
>
<Flex justify="flex-start">
@ -39,25 +42,51 @@ export interface SlidingErrorProps extends ErrorProps {
}
export const SlidingError: React.StatelessComponent<SlidingErrorProps> = props => {
const slideAmount = '120px';
const slideUpSettings: PositionAnimationSettings = {
const desktopSlideIn: PositionAnimationSettings = {
timingFunction: 'ease-in',
top: {
from: slideAmount,
to: '0px',
},
position: 'relative',
};
const slideDownSettings: PositionAnimationSettings = {
const desktopSlideOut: PositionAnimationSettings = {
timingFunction: 'cubic-bezier(0.25, 0.1, 0.25, 1)',
top: {
from: '0px',
to: slideAmount,
},
position: 'relative',
};
const mobileSlideIn: PositionAnimationSettings = {
duration: '0.5s',
timingFunction: 'ease-in',
top: { from: '-120px', to: '0px' },
position: 'fixed',
};
const moblieSlideOut: PositionAnimationSettings = {
duration: '0.5s',
timingFunction: 'ease-in',
top: { from: '0px', to: '-120px' },
position: 'fixed',
};
const slideUpSettings: ScreenSpecification<PositionAnimationSettings> = {
default: desktopSlideIn,
sm: mobileSlideIn,
};
const slideOutSettings: ScreenSpecification<PositionAnimationSettings> = {
default: desktopSlideOut,
sm: moblieSlideOut,
};
return (
<SlideAnimation
position="relative"
slideInSettings={slideUpSettings}
slideOutSettings={slideDownSettings}
slideOutSettings={slideOutSettings}
zIndex={{ sm: zIndex.errorPopup, default: zIndex.errorPopBehind }}
animationState={props.animationState}
>
<Error icon={props.icon} message={props.message} />

View File

@ -30,7 +30,9 @@ export const Panel: React.StatelessComponent<PanelProps> = ({ title, children, o
<Icon width={12} color={ColorOption.lightGrey} icon="closeX" onClick={onClose} />
</Container>
</Flex>
<Container marginTop="10px">{children}</Container>
<Container marginTop="10px" height="100%">
{children}
</Container>
</Container>
);
@ -51,6 +53,7 @@ export const SlidingPanel: React.StatelessComponent<SlidingPanelProps> = props =
from: slideAmount,
to: '0px',
},
position: 'absolute',
};
const slideDownSettings: PositionAnimationSettings = {
duration: '0.3s',
@ -59,13 +62,14 @@ export const SlidingPanel: React.StatelessComponent<SlidingPanelProps> = props =
from: '0px',
to: slideAmount,
},
position: 'absolute',
};
return (
<SlideAnimation
position="absolute"
slideInSettings={slideUpSettings}
slideOutSettings={slideDownSettings}
animationState={animationState}
height="100%"
>
<Panel {...rest} />
</SlideAnimation>

View File

@ -70,9 +70,11 @@ export const TimedProgress =
styled.div <
TimedProgressProps >
`
background-color: ${props => props.theme[ColorOption.primaryColor]};
border-radius: 6px;
height: 6px;
animation: ${props => expandingWidthKeyframes(props.fromWidth, props.toWidth)}
${props => props.timeMs}ms linear 1 forwards;
`;
&& {
background-color: ${props => props.theme[ColorOption.primaryColor]};
border-radius: 6px;
height: 6px;
animation: ${props => expandingWidthKeyframes(props.fromWidth, props.toWidth)}
${props => props.timeMs}ms linear 1 forwards;
}
`;

View File

@ -6,6 +6,8 @@ import { ColorOption, styled } from '../../style/theme';
export interface ButtonProps {
backgroundColor?: ColorOption;
borderColor?: ColorOption;
fontColor?: ColorOption;
fontSize?: string;
width?: string;
padding?: string;
type?: string;
@ -24,29 +26,39 @@ const darkenOnHoverAmount = 0.1;
const darkenOnActiveAmount = 0.2;
const saturateOnFocusAmount = 0.2;
export const Button = styled(PlainButton)`
cursor: ${props => (props.isDisabled ? 'default' : 'pointer')};
transition: background-color, opacity 0.5s ease;
padding: ${props => props.padding};
border-radius: 3px;
outline: none;
width: ${props => props.width};
background-color: ${props => (props.backgroundColor ? props.theme[props.backgroundColor] : 'none')};
border: ${props => (props.borderColor ? `1px solid ${props.theme[props.borderColor]}` : 'none')};
&:hover {
background-color: ${props =>
!props.isDisabled
? darken(darkenOnHoverAmount, props.theme[props.backgroundColor || 'white'])
: ''} !important;
}
&:active {
background-color: ${props =>
!props.isDisabled ? darken(darkenOnActiveAmount, props.theme[props.backgroundColor || 'white']) : ''};
}
&:disabled {
opacity: 0.5;
}
&:focus {
background-color: ${props => saturate(saturateOnFocusAmount, props.theme[props.backgroundColor || 'white'])};
&& {
all: initial;
box-sizing: border-box;
font-size: ${props => props.fontSize};
font-family: 'Inter UI', sans-serif;
font-weight: 600;
color: ${props => props.fontColor && props.theme[props.fontColor]};
cursor: ${props => (props.isDisabled ? 'default' : 'pointer')};
transition: background-color, opacity 0.5s ease;
padding: ${props => props.padding};
border-radius: 3px;
text-align: center;
outline: none;
width: ${props => props.width};
background-color: ${props => (props.backgroundColor ? props.theme[props.backgroundColor] : 'none')};
border: ${props => (props.borderColor ? `1px solid ${props.theme[props.borderColor]}` : 'none')};
&:hover {
background-color: ${props =>
!props.isDisabled
? darken(darkenOnHoverAmount, props.theme[props.backgroundColor || 'white'])
: ''} !important;
}
&:active {
background-color: ${props =>
!props.isDisabled ? darken(darkenOnActiveAmount, props.theme[props.backgroundColor || 'white']) : ''};
}
&:disabled {
opacity: 0.5;
}
&:focus {
background-color: ${props =>
saturate(saturateOnFocusAmount, props.theme[props.backgroundColor || 'white'])};
}
}
`;
@ -55,7 +67,8 @@ Button.defaultProps = {
borderColor: ColorOption.primaryColor,
width: 'auto',
isDisabled: false,
padding: '1em 2.2em',
padding: '.6em 1.2em',
fontSize: '15px',
};
Button.displayName = 'Button';

View File

@ -1,22 +1,27 @@
import { styled } from '../../style/theme';
import { ColorOption, styled, Theme, withTheme } from '../../style/theme';
export interface CircleProps {
diameter: number;
fillColor?: string;
rawColor?: string;
color?: ColorOption;
theme: Theme;
}
export const Circle =
export const Circle = withTheme(
styled.div <
CircleProps >
`
width: ${props => props.diameter}px;
height: ${props => props.diameter}px;
background-color: ${props => props.fillColor};
border-radius: 50%;
`;
CircleProps >
`
&& {
width: ${props => props.diameter}px;
height: ${props => props.diameter}px;
background-color: ${props => (props.rawColor ? props.rawColor : props.theme[props.color || ColorOption.white])};
border-radius: 50%;
}
`,
);
Circle.displayName = 'Circle';
Circle.defaultProps = {
fillColor: 'white',
color: ColorOption.white,
};

View File

@ -34,6 +34,7 @@ export interface ContainerProps {
cursor?: string;
overflow?: string;
darkenOnHover?: boolean;
boxShadowOnHover?: boolean;
flexGrow?: string | number;
}
@ -41,42 +42,45 @@ export const Container =
styled.div <
ContainerProps >
`
box-sizing: border-box;
${props => cssRuleIfExists(props, 'flex-grow')}
${props => cssRuleIfExists(props, 'position')}
${props => cssRuleIfExists(props, 'top')}
${props => cssRuleIfExists(props, 'right')}
${props => cssRuleIfExists(props, 'bottom')}
${props => cssRuleIfExists(props, 'left')}
${props => cssRuleIfExists(props, 'max-width')}
${props => cssRuleIfExists(props, 'margin')}
${props => cssRuleIfExists(props, 'margin-top')}
${props => cssRuleIfExists(props, 'margin-right')}
${props => cssRuleIfExists(props, 'margin-bottom')}
${props => cssRuleIfExists(props, 'margin-left')}
${props => cssRuleIfExists(props, 'padding')}
${props => cssRuleIfExists(props, 'border-radius')}
${props => cssRuleIfExists(props, 'border')}
${props => cssRuleIfExists(props, 'border-top')}
${props => cssRuleIfExists(props, 'border-bottom')}
${props => cssRuleIfExists(props, 'z-index')}
${props => cssRuleIfExists(props, 'white-space')}
${props => cssRuleIfExists(props, 'opacity')}
${props => cssRuleIfExists(props, 'cursor')}
${props => cssRuleIfExists(props, 'overflow')}
${props => (props.hasBoxShadow ? `box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1)` : '')};
${props => props.display && stylesForMedia('display', props.display)}
${props => stylesForMedia('width', props.width || 'auto')}
${props => stylesForMedia('height', props.height || 'auto')}
background-color: ${props => (props.backgroundColor ? props.theme[props.backgroundColor] : 'none')};
border-color: ${props => (props.borderColor ? props.theme[props.borderColor] : 'none')};
&:hover {
${props =>
props.darkenOnHover
? `background-color: ${
props.backgroundColor ? darken(0.05, props.theme[props.backgroundColor]) : 'none'
}`
: ''};
&& {
box-sizing: border-box;
${props => cssRuleIfExists(props, 'flex-grow')}
${props => cssRuleIfExists(props, 'position')}
${props => cssRuleIfExists(props, 'top')}
${props => cssRuleIfExists(props, 'right')}
${props => cssRuleIfExists(props, 'bottom')}
${props => cssRuleIfExists(props, 'left')}
${props => cssRuleIfExists(props, 'max-width')}
${props => cssRuleIfExists(props, 'margin')}
${props => cssRuleIfExists(props, 'margin-top')}
${props => cssRuleIfExists(props, 'margin-right')}
${props => cssRuleIfExists(props, 'margin-bottom')}
${props => cssRuleIfExists(props, 'margin-left')}
${props => cssRuleIfExists(props, 'padding')}
${props => cssRuleIfExists(props, 'border-radius')}
${props => cssRuleIfExists(props, 'border')}
${props => cssRuleIfExists(props, 'border-top')}
${props => cssRuleIfExists(props, 'border-bottom')}
${props => cssRuleIfExists(props, 'z-index')}
${props => cssRuleIfExists(props, 'white-space')}
${props => cssRuleIfExists(props, 'opacity')}
${props => cssRuleIfExists(props, 'cursor')}
${props => cssRuleIfExists(props, 'overflow')}
${props => (props.hasBoxShadow ? `box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1)` : '')};
${props => props.display && stylesForMedia<string>('display', props.display)}
${props => props.width && stylesForMedia<string>('width', props.width)}
${props => props.height && stylesForMedia<string>('height', props.height)}
background-color: ${props => (props.backgroundColor ? props.theme[props.backgroundColor] : 'none')};
border-color: ${props => (props.borderColor ? props.theme[props.borderColor] : 'none')};
&:hover {
${props =>
props.darkenOnHover
? `background-color: ${
props.backgroundColor ? darken(0.05, props.theme[props.backgroundColor]) : 'none'
}`
: ''};
${props => (props.boxShadowOnHover ? 'box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1)' : '')};
}
}
`;

View File

@ -0,0 +1,134 @@
import * as _ from 'lodash';
import * as React from 'react';
import { ColorOption, completelyTransparent } from '../../style/theme';
import { zIndex } from '../../style/z_index';
import { Container } from './container';
import { Flex } from './flex';
import { Icon } from './icon';
import { Overlay } from './overlay';
import { Text } from './text';
export interface DropdownItemConfig {
text: string;
onClick?: () => void;
}
export interface DropdownProps {
value: string;
label?: string;
items: DropdownItemConfig[];
}
export interface DropdownState {
isOpen: boolean;
}
export class Dropdown extends React.Component<DropdownProps, DropdownState> {
public static defaultProps = {
items: [],
};
public state: DropdownState = {
isOpen: false,
};
public render(): React.ReactNode {
const { value, label, items } = this.props;
const { isOpen } = this.state;
const hasItems = !_.isEmpty(items);
const borderRadius = isOpen ? '4px 4px 0px 0px' : '4px';
return (
<React.Fragment>
{isOpen && (
<Overlay
zIndex={zIndex.dropdownItems - 1}
backgroundColor={completelyTransparent}
onClick={this._closeDropdown}
/>
)}
<Container position="relative">
<Container
cursor={hasItems ? 'pointer' : undefined}
onClick={this._handleDropdownClick}
hasBoxShadow={isOpen}
boxShadowOnHover={true}
borderRadius={borderRadius}
border="1px solid"
borderColor={ColorOption.feintGrey}
padding="0.8em"
>
<Flex justify="space-between">
<Text fontSize="16px" fontColor={ColorOption.darkGrey}>
{value}
</Text>
<Container>
{label && (
<Text fontSize="16px" fontColor={ColorOption.lightGrey}>
{label}
</Text>
)}
{hasItems && (
<Container marginLeft="5px" display="inline-block" position="relative" bottom="2px">
<Icon padding="3px" icon="chevron" width={12} stroke={ColorOption.grey} />
</Container>
)}
</Container>
</Flex>
</Container>
{isOpen && (
<Container
width="100%"
position="absolute"
onClick={this._closeDropdown}
backgroundColor={ColorOption.white}
hasBoxShadow={true}
zIndex={zIndex.dropdownItems}
>
{_.map(items, (item, index) => (
<DropdownItem key={item.text} {...item} isLast={index === items.length - 1} />
))}
</Container>
)}
</Container>
</React.Fragment>
);
}
private readonly _handleDropdownClick = (): void => {
if (_.isEmpty(this.props.items)) {
return;
}
this.setState({
isOpen: !this.state.isOpen,
});
};
private readonly _closeDropdown = (): void => {
this.setState({
isOpen: false,
});
};
}
export interface DropdownItemProps extends DropdownItemConfig {
text: string;
onClick?: () => void;
isLast: boolean;
}
export const DropdownItem: React.StatelessComponent<DropdownItemProps> = ({ text, onClick, isLast }) => (
<Container
onClick={onClick}
cursor="pointer"
darkenOnHover={true}
backgroundColor={ColorOption.white}
padding="0.8em"
borderTop="0"
border="1px solid"
borderRadius={isLast ? '0px 0px 4px 4px' : undefined}
width="100%"
borderColor={ColorOption.feintGrey}
>
<Text fontSize="14px" fontColor={ColorOption.darkGrey}>
{text}
</Text>
</Container>
);

View File

@ -18,15 +18,17 @@ export const Flex =
styled.div <
FlexProps >
`
display: ${props => (props.inline ? 'inline-flex' : 'flex')};
flex-direction: ${props => props.direction};
flex-wrap: ${props => props.flexWrap};
${props => cssRuleIfExists(props, 'flexGrow')}
justify-content: ${props => props.justify};
align-items: ${props => props.align};
background-color: ${props => (props.backgroundColor ? props.theme[props.backgroundColor] : 'none')};
${props => stylesForMedia('width', props.width || 'auto')}
${props => stylesForMedia('height', props.height || 'auto')}
&& {
display: ${props => (props.inline ? 'inline-flex' : 'flex')};
flex-direction: ${props => props.direction};
flex-wrap: ${props => props.flexWrap};
${props => cssRuleIfExists(props, 'flexGrow')}
justify-content: ${props => props.justify};
align-items: ${props => props.align};
background-color: ${props => (props.backgroundColor ? props.theme[props.backgroundColor] : 'none')};
${props => (props.width ? stylesForMedia('width', props.width) : '')}
${props => (props.height ? stylesForMedia('height', props.height) : '')}
}
`;
Flex.defaultProps = {

View File

@ -9,7 +9,6 @@ interface IconInfo {
path: string;
fillRule?: svgRule;
clipRule?: svgRule;
stroke?: string;
strokeOpacity?: number;
strokeWidth?: number;
strokeLinecap?: 'butt' | 'round' | 'square' | 'inherit';
@ -47,7 +46,6 @@ const ICONS: IconInfoMapping = {
chevron: {
viewBox: '0 0 12 7',
path: 'M11 1L6 6L1 1',
stroke: 'white',
strokeOpacity: 0.5,
strokeWidth: 1.5,
strokeLinecap: 'round',
@ -67,6 +65,7 @@ export interface IconProps {
width: number;
height?: number;
color?: ColorOption;
stroke?: ColorOption;
icon: keyof IconInfoMapping;
onClick?: (event: React.MouseEvent<HTMLElement>) => void;
padding?: string;
@ -75,6 +74,7 @@ export interface IconProps {
const PlainIcon: React.StatelessComponent<IconProps> = props => {
const iconInfo = ICONS[props.icon];
const colorValue = _.isUndefined(props.color) ? undefined : props.theme[props.color];
const strokeValue = _.isUndefined(props.stroke) ? undefined : props.theme[props.stroke];
return (
<div onClick={props.onClick} className={props.className}>
<svg
@ -89,7 +89,7 @@ const PlainIcon: React.StatelessComponent<IconProps> = props => {
fill={colorValue}
fillRule={iconInfo.fillRule || 'nonzero'}
clipRule={iconInfo.clipRule || 'nonzero'}
stroke={iconInfo.stroke}
stroke={strokeValue}
strokeOpacity={iconInfo.strokeOpacity}
strokeWidth={iconInfo.strokeWidth}
strokeLinecap={iconInfo.strokeLinecap}
@ -101,15 +101,18 @@ const PlainIcon: React.StatelessComponent<IconProps> = props => {
};
export const Icon = withTheme(styled(PlainIcon)`
cursor: ${props => (!_.isUndefined(props.onClick) ? 'pointer' : 'default')};
transition: opacity 0.5s ease;
padding: ${props => props.padding};
opacity: ${props => (!_.isUndefined(props.onClick) ? 0.7 : 1)};
&:hover {
opacity: 1;
}
&:active {
opacity: 1;
&& {
display: inline-block;
${props => (!_.isUndefined(props.onClick) ? 'cursor: pointer' : '')};
transition: opacity 0.5s ease;
padding: ${props => props.padding};
opacity: ${props => (!_.isUndefined(props.onClick) ? 0.7 : 1)};
&:hover {
opacity: 1;
}
&:active {
opacity: 1;
}
}
`);

View File

@ -16,17 +16,20 @@ export const Input =
styled.input <
InputProps >
`
font-size: ${props => props.fontSize};
width: ${props => props.width};
padding: 0.1em 0em;
font-family: 'Inter UI';
color: ${props => props.theme[props.fontColor || 'white']};
background: transparent;
outline: none;
border: none;
&::placeholder {
&& {
all: initial;
font-size: ${props => props.fontSize};
width: ${props => props.width};
padding: 0.1em 0em;
font-family: 'Inter UI';
color: ${props => props.theme[props.fontColor || 'white']};
opacity: 0.5;
background: transparent;
outline: none;
border: none;
&::placeholder {
color: ${props => props.theme[props.fontColor || 'white']};
opacity: 0.5;
}
}
`;

View File

@ -1,40 +1,31 @@
import * as _ from 'lodash';
import * as React from 'react';
import { ColorOption, overlayBlack, styled } from '../../style/theme';
import { Container } from './container';
import { Flex } from './flex';
import { Icon } from './icon';
import { overlayBlack, styled } from '../../style/theme';
import { zIndex } from '../../style/z_index';
export interface OverlayProps {
className?: string;
onClose?: () => void;
zIndex?: number;
backgroundColor?: string;
}
const PlainOverlay: React.StatelessComponent<OverlayProps> = ({ children, className, onClose }) => (
<Flex height="100vh" className={className}>
<Container position="absolute" top="0px" right="0px" display={{ default: 'initial', sm: 'none' }}>
<Icon height={18} width={18} color={ColorOption.white} icon="closeX" onClick={onClose} padding="2em 2em" />
</Container>
<Container width={{ default: 'auto', sm: '100%' }} height={{ default: 'auto', sm: '100%' }}>
{children}
</Container>
</Flex>
);
export const Overlay = styled(PlainOverlay)`
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: ${props => props.zIndex}
background-color: ${overlayBlack};
export const Overlay =
styled.div <
OverlayProps >
`
&& {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: ${props => props.zIndex}
background-color: ${props => props.backgroundColor};
}
`;
Overlay.defaultProps = {
zIndex: 100,
zIndex: zIndex.overlayDefault,
backgroundColor: overlayBlack,
};
Overlay.displayName = 'Overlay';

View File

@ -27,25 +27,27 @@ export const Text =
styled.div <
TextProps >
`
font-family: ${props => props.fontFamily};
font-style: ${props => props.fontStyle};
font-weight: ${props => props.fontWeight};
font-size: ${props => props.fontSize};
opacity: ${props => props.opacity};
text-decoration-line: ${props => props.textDecorationLine};
${props => (props.lineHeight ? `line-height: ${props.lineHeight}` : '')};
${props => (props.center ? 'text-align: center' : '')};
color: ${props => props.fontColor && props.theme[props.fontColor]};
${props => (props.minHeight ? `min-height: ${props.minHeight}` : '')};
${props => (props.onClick ? 'cursor: pointer' : '')};
transition: color 0.5s ease;
${props => (props.noWrap ? 'white-space: nowrap' : '')};
${props => (props.display ? `display: ${props.display}` : '')};
${props => (props.letterSpacing ? `letter-spacing: ${props.letterSpacing}` : '')};
${props => (props.textTransform ? `text-transform: ${props.textTransform}` : '')};
&:hover {
${props =>
props.onClick ? `color: ${darken(darkenOnHoverAmount, props.theme[props.fontColor || 'white'])}` : ''};
&& {
font-family: 'Inter UI', sans-serif;
font-style: ${props => props.fontStyle};
font-weight: ${props => props.fontWeight};
font-size: ${props => props.fontSize};
opacity: ${props => props.opacity};
text-decoration-line: ${props => props.textDecorationLine};
${props => (props.lineHeight ? `line-height: ${props.lineHeight}` : '')};
${props => (props.center ? 'text-align: center' : '')};
color: ${props => props.fontColor && props.theme[props.fontColor]};
${props => (props.minHeight ? `min-height: ${props.minHeight}` : '')};
${props => (props.onClick ? 'cursor: pointer' : '')};
transition: color 0.5s ease;
${props => (props.noWrap ? 'white-space: nowrap' : '')};
${props => (props.display ? `display: ${props.display}` : '')};
${props => (props.letterSpacing ? `letter-spacing: ${props.letterSpacing}` : '')};
${props => (props.textTransform ? `text-transform: ${props.textTransform}` : '')};
&:hover {
${props =>
props.onClick ? `color: ${darken(darkenOnHoverAmount, props.theme[props.fontColor || 'white'])}` : ''};
}
}
`;
@ -61,14 +63,3 @@ Text.defaultProps = {
};
Text.displayName = 'Text';
export const Title: React.StatelessComponent<TextProps> = props => <Text {...props} />;
Title.defaultProps = {
fontSize: '20px',
fontWeight: 600,
opacity: 1,
fontColor: ColorOption.primaryColor,
};
Title.displayName = 'Title';

View File

@ -1,5 +1,7 @@
import * as React from 'react';
import { INJECTED_DIV_CLASS } from '../constants';
import { ZeroExInstantContainer } from './zero_ex_instant_container';
import { ZeroExInstantProvider, ZeroExInstantProviderProps } from './zero_ex_instant_provider';
@ -7,8 +9,10 @@ export type ZeroExInstantProps = ZeroExInstantProviderProps;
export const ZeroExInstant: React.StatelessComponent<ZeroExInstantProps> = props => {
return (
<ZeroExInstantProvider {...props}>
<ZeroExInstantContainer />
</ZeroExInstantProvider>
<div className={INJECTED_DIV_CLASS}>
<ZeroExInstantProvider {...props}>
<ZeroExInstantContainer />
</ZeroExInstantProvider>
</div>
);
};

View File

@ -3,15 +3,14 @@ import * as React from 'react';
import { AvailableERC20TokenSelector } from '../containers/available_erc20_token_selector';
import { LatestBuyQuoteOrderDetails } from '../containers/latest_buy_quote_order_details';
import { LatestError } from '../containers/latest_error';
import { SelectedAssetBuyOrderProgress } from '../containers/selected_asset_buy_order_progress';
import { SelectedAssetBuyOrderStateButtons } from '../containers/selected_asset_buy_order_state_buttons';
import { SelectedAssetInstantHeading } from '../containers/selected_asset_instant_heading';
import { SelectedAssetBuyOrderProgress } from '../containers/selected_asset_buy_order_progress';
import { ColorOption } from '../style/theme';
import { zIndex } from '../style/z_index';
import { SlideAnimationState } from './animations/slide_animation';
import { CSSReset } from './css_reset';
import { SlidingPanel } from './sliding_panel';
import { Container } from './ui/container';
import { Flex } from './ui/flex';
@ -27,40 +26,43 @@ export class ZeroExInstantContainer extends React.Component<ZeroExInstantContain
};
public render(): React.ReactNode {
return (
<Container
width={{ default: '350px', sm: '100%' }}
height={{ default: 'auto', sm: '100%' }}
position="relative"
>
<Container zIndex={zIndex.errorPopup} position="relative">
<LatestError />
</Container>
<React.Fragment>
<CSSReset />
<Container
zIndex={zIndex.mainContainer}
width={{ default: '350px', sm: '100%' }}
height={{ default: 'auto', sm: '100%' }}
position="relative"
backgroundColor={ColorOption.white}
borderRadius="3px"
hasBoxShadow={true}
overflow="hidden"
height="100%"
>
<Flex direction="column" height="100%" justify="flex-start">
<SelectedAssetInstantHeading onSelectAssetClick={this._handleSymbolClick} />
<SelectedAssetBuyOrderProgress />
<LatestBuyQuoteOrderDetails />
<Container padding="20px" width="100%">
<SelectedAssetBuyOrderStateButtons />
</Container>
</Flex>
<SlidingPanel
title="Select Token"
animationState={this.state.tokenSelectionPanelAnimationState}
onClose={this._handlePanelClose}
<Container position="relative">
<LatestError />
</Container>
<Container
zIndex={zIndex.mainContainer}
position="relative"
backgroundColor={ColorOption.white}
borderRadius="3px"
hasBoxShadow={true}
overflow="hidden"
height="100%"
>
<AvailableERC20TokenSelector onTokenSelect={this._handlePanelClose} />
</SlidingPanel>
<Flex direction="column" justify="flex-start" height="100%">
<SelectedAssetInstantHeading onSelectAssetClick={this._handleSymbolClick} />
<SelectedAssetBuyOrderProgress />
<LatestBuyQuoteOrderDetails />
<Container padding="20px" width="100%">
<SelectedAssetBuyOrderStateButtons />
</Container>
</Flex>
<SlidingPanel
title="Select Token"
animationState={this.state.tokenSelectionPanelAnimationState}
onClose={this._handlePanelClose}
>
<AvailableERC20TokenSelector onTokenSelect={this._handlePanelClose} />
</SlidingPanel>
</Container>
</Container>
</Container>
</React.Fragment>
);
}
private readonly _handleSymbolClick = (): void => {

View File

@ -1,5 +1,10 @@
import * as React from 'react';
import { ColorOption } from '../style/theme';
import { Container } from './ui/container';
import { Flex } from './ui/flex';
import { Icon } from './ui/icon';
import { Overlay } from './ui/overlay';
import { ZeroExInstantContainer } from './zero_ex_instant_container';
import { ZeroExInstantProvider, ZeroExInstantProviderProps } from './zero_ex_instant_provider';
@ -13,8 +18,22 @@ export const ZeroExInstantOverlay: React.StatelessComponent<ZeroExInstantOverlay
const { onClose, zIndex, ...rest } = props;
return (
<ZeroExInstantProvider {...rest}>
<Overlay onClose={onClose} zIndex={zIndex}>
<ZeroExInstantContainer />
<Overlay zIndex={zIndex}>
<Flex height="100vh">
<Container position="absolute" top="0px" right="0px" display={{ default: 'initial', sm: 'none' }}>
<Icon
height={18}
width={18}
color={ColorOption.white}
icon="closeX"
onClick={onClose}
padding="2em 2em"
/>
</Container>
<Container width={{ default: 'auto', sm: '100%' }} height={{ default: 'auto', sm: '100%' }}>
<ZeroExInstantContainer />
</Container>
</Flex>
</Overlay>
</ZeroExInstantProvider>
);

View File

@ -5,6 +5,7 @@ import { AccountNotReady, AccountState, Network } from './types';
export const BIG_NUMBER_ZERO = new BigNumber(0);
export const ETH_DECIMALS = 18;
export const DEFAULT_ZERO_EX_CONTAINER_SELECTOR = '#zeroExInstantContainer';
export const INJECTED_DIV_CLASS = 'zeroExInstantResetRoot';
export const INJECTED_DIV_ID = 'zeroExInstant';
export const WEB_3_WRAPPER_TRANSACTION_FAILED_ERROR_MSG_PREFIX = 'Transaction failed';
export const GWEI_IN_WEI = new BigNumber(1000000000);

View File

@ -12,6 +12,7 @@ import { State } from '../redux/reducer';
import { ColorOption } from '../style/theme';
import { AffiliateInfo, ERC20Asset, OrderProcessState } from '../types';
import { updateBuyQuoteOrFlashErrorAsync } from '../util/buy_quote_fetcher';
import { buyQuoteUpdater } from '../util/buy_quote_updater';
export interface SelectedERC20AssetAmountInputProps {
fontColor?: ColorOption;
@ -67,20 +68,10 @@ const mapStateToProps = (state: State, _ownProps: SelectedERC20AssetAmountInputP
};
};
const updateBuyQuoteAsync = async (
assetBuyer: AssetBuyer,
dispatch: Dispatch<Action>,
asset: ERC20Asset,
assetAmount: BigNumber,
affiliateInfo?: AffiliateInfo,
): Promise<void> => {
// mark quote as pending
dispatch(actions.setQuoteRequestStatePending());
// kick of buy quote
updateBuyQuoteOrFlashErrorAsync(assetBuyer, asset, assetAmount, dispatch, affiliateInfo);
};
const debouncedUpdateBuyQuoteAsync = _.debounce(updateBuyQuoteAsync, 200, { trailing: true });
// TODO: change to set pending to true
const debouncedUpdateBuyQuoteAsync = _.debounce(buyQuoteUpdater.updateBuyQuoteAsync.bind(buyQuoteUpdater), 200, {
trailing: true,
});
const mapDispatchToProps = (
dispatch: Dispatch<Action>,

View File

@ -2,7 +2,7 @@ import * as _ from 'lodash';
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { DEFAULT_ZERO_EX_CONTAINER_SELECTOR, INJECTED_DIV_ID } from './constants';
import { DEFAULT_ZERO_EX_CONTAINER_SELECTOR, INJECTED_DIV_CLASS, INJECTED_DIV_ID } from './constants';
import { ZeroExInstantOverlay, ZeroExInstantOverlayProps } from './index';
import { assert } from './util/assert';
@ -41,6 +41,7 @@ export const render = (props: ZeroExInstantOverlayProps, selector: string = DEFA
const appendTo = appendToIfExists as Element;
const injectedDiv = document.createElement('div');
injectedDiv.setAttribute('id', INJECTED_DIV_ID);
injectedDiv.setAttribute('class', INJECTED_DIV_CLASS);
appendTo.appendChild(injectedDiv);
const instantOverlayProps = {
...props,

View File

@ -2,7 +2,7 @@ import { BuyQuote } from '@0x/asset-buyer';
import { BigNumber } from '@0x/utils';
import * as _ from 'lodash';
import { ActionsUnion, Asset } from '../types';
import { ActionsUnion, AddressAndEthBalanceInWei, Asset } from '../types';
export interface PlainAction<T extends string> {
type: T;
@ -49,7 +49,8 @@ export const actions = {
setAccountStateLocked: () => createAction(ActionTypes.SET_ACCOUNT_STATE_LOCKED),
setAccountStateError: () => createAction(ActionTypes.SET_ACCOUNT_STATE_ERROR),
setAccountStateReady: (address: string) => createAction(ActionTypes.SET_ACCOUNT_STATE_READY, address),
updateAccountEthBalance: (balance: BigNumber) => createAction(ActionTypes.UPDATE_ACCOUNT_ETH_BALANCE, balance),
updateAccountEthBalance: (addressAndBalance: AddressAndEthBalanceInWei) =>
createAction(ActionTypes.UPDATE_ACCOUNT_ETH_BALANCE, addressAndBalance),
updateEthUsdPrice: (price?: BigNumber) => createAction(ActionTypes.UPDATE_ETH_USD_PRICE, price),
updateSelectedAssetAmount: (amount?: BigNumber) => createAction(ActionTypes.UPDATE_SELECTED_ASSET_AMOUNT, amount),
setBuyOrderStateNone: () => createAction(ActionTypes.SET_BUY_ORDER_STATE_NONE),

View File

@ -1,8 +1,10 @@
import { AssetProxyId } from '@0x/types';
import * as _ from 'lodash';
import { BIG_NUMBER_ZERO } from '../constants';
import { AccountState } from '../types';
import { AccountState, ERC20Asset } from '../types';
import { assetUtils } from '../util/asset';
import { buyQuoteUpdater } from '../util/buy_quote_updater';
import { coinbaseApi } from '../util/coinbase_api';
import { errorFlasher } from '../util/error_flasher';
@ -50,7 +52,8 @@ export const asyncData = {
if (!_.isEmpty(availableAddresses)) {
const activeAddress = availableAddresses[0];
store.dispatch(actions.setAccountStateReady(activeAddress));
await asyncData.fetchAccountBalanceAndDispatchToStore(store);
// tslint:disable-next-line:no-floating-promises
asyncData.fetchAccountBalanceAndDispatchToStore(store);
} else {
store.dispatch(actions.setAccountStateLocked());
}
@ -63,11 +66,29 @@ export const asyncData = {
return;
}
try {
const ethBalanceInWei = await web3Wrapper.getBalanceInWeiAsync(account.address);
store.dispatch(actions.updateAccountEthBalance(ethBalanceInWei));
const address = account.address;
const ethBalanceInWei = await web3Wrapper.getBalanceInWeiAsync(address);
store.dispatch(actions.updateAccountEthBalance({ address, ethBalanceInWei }));
} catch (e) {
// leave balance as is
return;
}
},
fetchCurrentBuyQuoteAndDispatchToStore: async (store: Store) => {
const { providerState, selectedAsset, selectedAssetAmount, affiliateInfo } = store.getState();
const assetBuyer = providerState.assetBuyer;
if (
!_.isUndefined(selectedAssetAmount) &&
!_.isUndefined(selectedAsset) &&
selectedAsset.metaData.assetProxyId === AssetProxyId.ERC20
) {
await buyQuoteUpdater.updateBuyQuoteAsync(
assetBuyer,
store.dispatch,
selectedAsset as ERC20Asset,
selectedAssetAmount,
affiliateInfo,
);
}
},
};

View File

@ -75,13 +75,14 @@ export const createReducer = (initialState: State) => {
return reduceStateWithAccount(state, account);
}
case ActionTypes.UPDATE_ACCOUNT_ETH_BALANCE: {
const account = state.providerState.account;
if (account.state !== AccountState.Ready) {
const { address, ethBalanceInWei } = action.data;
const currentAccount = state.providerState.account;
if (currentAccount.state !== AccountState.Ready || currentAccount.address !== address) {
return state;
} else {
const newAccount: AccountReady = {
...account,
ethBalanceInWei: action.data,
...currentAccount,
ethBalanceInWei,
};
return reduceStateWithAccount(state, newAccount);
}

View File

@ -14,30 +14,38 @@ const generateMediaWrapper = (screenWidth: ScreenWidths) => (...args: any[]) =>
}
`;
const media = {
export const media = {
small: generateMediaWrapper(ScreenWidths.Sm),
medium: generateMediaWrapper(ScreenWidths.Md),
large: generateMediaWrapper(ScreenWidths.Lg),
};
export interface ScreenSpecifications {
default: string;
sm?: string;
md?: string;
lg?: string;
export interface ScreenSpecification<T> {
default: T;
sm?: T;
md?: T;
lg?: T;
}
export type MediaChoice = string | ScreenSpecifications;
export const stylesForMedia = (cssPropertyName: string, choice: MediaChoice): InterpolationValue[] => {
if (typeof choice === 'string') {
export type OptionallyScreenSpecific<T> = T | ScreenSpecification<T>;
export type MediaChoice = OptionallyScreenSpecific<string>;
/**
* Given a css property name and a OptionallyScreenSpecific value,
* generates css properties with screen-specific viewport styling
*/
export function stylesForMedia<T extends string | number>(
cssPropertyName: string,
choice: OptionallyScreenSpecific<T>,
): InterpolationValue[] {
if (typeof choice === 'object') {
return css`
${cssPropertyName}: ${choice};
`;
}
return css`
${cssPropertyName}: ${choice.default};
${choice.lg && media.large`${cssPropertyName}: ${choice.lg}`}
${choice.md && media.medium`${cssPropertyName}: ${choice.md}`}
${choice.sm && media.small`${cssPropertyName}: ${choice.sm}`}
`;
};
} else {
return css`
${cssPropertyName}: ${choice};
`;
}
}

View File

@ -1,6 +1,6 @@
import * as styledComponents from 'styled-components';
const { default: styled, css, keyframes, withTheme, ThemeProvider } = styledComponents;
const { default: styled, css, keyframes, withTheme, createGlobalStyle, ThemeProvider } = styledComponents;
export type Theme = { [key in ColorOption]: string };
@ -15,6 +15,8 @@ export enum ColorOption {
white = 'white',
lightOrange = 'lightOrange',
darkOrange = 'darkOrange',
green = 'green',
red = 'red',
}
export const theme: Theme = {
@ -28,9 +30,12 @@ export const theme: Theme = {
white: 'white',
lightOrange: '#F9F2ED',
darkOrange: '#F2994C',
green: '#3CB34F',
red: '#D00000',
};
export const transparentWhite = 'rgba(255,255,255,0.3)';
export const overlayBlack = 'rgba(0, 0, 0, 0.6)';
export const completelyTransparent = 'rga(0, 0, 0, 0)';
export { styled, css, keyframes, withTheme, ThemeProvider };
export { styled, css, keyframes, withTheme, createGlobalStyle, ThemeProvider };

View File

@ -1,5 +1,8 @@
export const zIndex = {
errorPopup: 1,
mainContainer: 2,
panel: 3,
errorPopBehind: 10,
mainContainer: 20,
dropdownItems: 30,
panel: 40,
errorPopup: 50,
overlayDefault: 100,
};

View File

@ -120,3 +120,8 @@ export interface AccountNotReady {
export type Account = AccountReady | AccountNotReady;
export type OrderSource = string | SignedOrder[];
export interface AddressAndEthBalanceInWei {
address: string;
ethBalanceInWei: BigNumber;
}

View File

@ -1,4 +1,6 @@
// TODO: rename file and export object
// TODO: delete this
import { AssetBuyer, AssetBuyerError, BuyQuote } from '@0x/asset-buyer';
import { AssetProxyId } from '@0x/types';
import { BigNumber } from '@0x/utils';

View File

@ -0,0 +1,56 @@
import { AssetBuyer, AssetBuyerError, BuyQuote } from '@0x/asset-buyer';
import { BigNumber } from '@0x/utils';
import { Web3Wrapper } from '@0x/web3-wrapper';
import * as _ from 'lodash';
import { Dispatch } from 'redux';
import { oc } from 'ts-optchain';
import { Action, actions } from '../redux/actions';
import { AffiliateInfo, ERC20Asset } from '../types';
import { assetUtils } from '../util/asset';
import { errorFlasher } from '../util/error_flasher';
export const buyQuoteUpdater = {
updateBuyQuoteAsync: async (
assetBuyer: AssetBuyer,
dispatch: Dispatch<Action>,
asset: ERC20Asset,
assetAmount: BigNumber,
affiliateInfo?: AffiliateInfo,
): Promise<void> => {
// get a new buy quote.
const baseUnitValue = Web3Wrapper.toBaseUnitAmount(assetAmount, asset.metaData.decimals);
// mark quote as pending
dispatch(actions.setQuoteRequestStatePending());
const feePercentage = oc(affiliateInfo).feePercentage();
let newBuyQuote: BuyQuote | undefined;
try {
newBuyQuote = await assetBuyer.getBuyQuoteAsync(asset.assetData, baseUnitValue, { feePercentage });
} catch (error) {
dispatch(actions.setQuoteRequestStateFailure());
let errorMessage;
if (error.message === AssetBuyerError.InsufficientAssetLiquidity) {
const assetName = assetUtils.bestNameForAsset(asset, 'of this asset');
errorMessage = `Not enough ${assetName} available`;
} else if (error.message === AssetBuyerError.InsufficientZrxLiquidity) {
errorMessage = 'Not enough ZRX available';
} else if (
error.message === AssetBuyerError.StandardRelayerApiError ||
error.message.startsWith(AssetBuyerError.AssetUnavailable)
) {
const assetName = assetUtils.bestNameForAsset(asset, 'This asset');
errorMessage = `${assetName} is currently unavailable`;
}
if (!_.isUndefined(errorMessage)) {
errorFlasher.flashNewErrorMessage(dispatch, errorMessage);
} else {
throw error;
}
return;
}
// We have a successful new buy quote
errorFlasher.clearError(dispatch);
// invalidate the last buy quote.
dispatch(actions.updateLatestBuyQuote(newBuyQuote));
},
};

View File

@ -21,4 +21,11 @@ export const etherscanUtil = {
}
return `https://${prefix}etherscan.io/tx/${txHash}`;
},
getEtherScanEthAddressIfExists: (ethAddress: string, networkId: number) => {
const prefix = etherscanPrefix(networkId);
if (_.isUndefined(prefix)) {
return;
}
return `https://${prefix}etherscan.io/address/${ethAddress}`;
},
};

View File

@ -50,4 +50,7 @@ export const format = {
}
return `$${ethUnitAmount.mul(ethUsdPrice).toFixed(decimalPlaces)}`;
},
ethAddress: (address: string): string => {
return `0x${address.slice(2, 7)}${address.slice(-5)}`;
},
};

View File

@ -7,7 +7,8 @@
"Improve schemas by enforcing that amounts that must be whole numbers (e.g Order asset amounts) no longer allow decimal amounts",
"pr": 1173
}
]
],
"timestamp": 1541740904
},
{
"version": "2.0.0",

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v2.0.1 - _November 9, 2018_
* Improve schemas by enforcing that amounts that must be whole numbers (e.g Order asset amounts) no longer allow decimal amounts (#1173)
## v2.0.0 - _October 18, 2018_
* Convert all schemas to JSON files so that they can be used with `json-schema` implemenations in other programming languages. (#1145)

View File

@ -1,6 +1,6 @@
{
"name": "@0x/json-schemas",
"version": "2.0.0",
"version": "2.0.1",
"engines": {
"node": ">=6.12"
},
@ -39,14 +39,14 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/json-schemas/README.md",
"dependencies": {
"@0x/typescript-typings": "^3.0.3",
"@0x/typescript-typings": "^3.0.4",
"@types/node": "*",
"jsonschema": "^1.2.0",
"lodash.values": "^4.3.0"
},
"devDependencies": {
"@0x/tslint-config": "^1.0.9",
"@0x/utils": "^2.0.3",
"@0x/tslint-config": "^1.0.10",
"@0x/utils": "^2.0.4",
"@types/lodash.foreach": "^4.5.3",
"@types/lodash.values": "^4.3.3",
"@types/mocha": "^2.2.42",

View File

@ -1,6 +1,6 @@
{
"name": "@0x/metacoin",
"version": "0.0.24",
"version": "0.0.25",
"engines": {
"node": ">=6.12"
},
@ -29,25 +29,25 @@
"author": "",
"license": "Apache-2.0",
"dependencies": {
"@0x/abi-gen": "^1.0.14",
"@0x/base-contract": "^3.0.2",
"@0x/sol-cov": "^2.1.8",
"@0x/subproviders": "^2.1.0",
"@0x/tslint-config": "^1.0.9",
"@0x/types": "^1.2.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"@0x/abi-gen": "^1.0.15",
"@0x/base-contract": "^3.0.3",
"@0x/sol-cov": "^2.1.9",
"@0x/subproviders": "^2.1.1",
"@0x/tslint-config": "^1.0.10",
"@0x/types": "^1.2.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"@types/mocha": "^5.2.2",
"copyfiles": "^2.0.0",
"ethereum-types": "^1.1.1",
"ethereum-types": "^1.1.2",
"ethers": "~4.0.4",
"lodash": "^4.17.5",
"run-s": "^0.0.0"
},
"devDependencies": {
"@0x/dev-utils": "^1.0.13",
"@0x/sol-compiler": "^1.1.8",
"@0x/dev-utils": "^1.0.14",
"@0x/sol-compiler": "^1.1.9",
"chai": "^4.0.1",
"chai-as-promised": "^7.1.0",
"chai-bignumber": "^2.0.1",

View File

@ -1,4 +1,13 @@
[
{
"version": "2.0.1",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"version": "2.0.0",
"changes": [

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v2.0.1 - _November 9, 2018_
* Dependencies updated
## v2.0.0 - _October 18, 2018_
* Contract artifacts have been moved to the new @0xproject/contract-artifacts package. v1 migrations have been removed. `runMigrationsAsync` returns the addresses of the contracts that were deployed. (#1105)

View File

@ -1,6 +1,6 @@
{
"name": "@0x/migrations",
"version": "2.0.0",
"version": "2.0.1",
"engines": {
"node": ">=6.12"
},
@ -17,9 +17,9 @@
},
"license": "Apache-2.0",
"devDependencies": {
"@0x/dev-utils": "^1.0.13",
"@0x/tslint-config": "^1.0.9",
"@0x/types": "^1.2.0",
"@0x/dev-utils": "^1.0.14",
"@0x/tslint-config": "^1.0.10",
"@0x/types": "^1.2.1",
"@types/yargs": "^10.0.0",
"make-promises-safe": "^1.1.0",
"npm-run-all": "^4.1.2",
@ -29,18 +29,18 @@
"yargs": "^10.0.3"
},
"dependencies": {
"@0x/abi-gen-wrappers": "^1.0.1",
"@0x/base-contract": "^3.0.2",
"@0x/contract-addresses": "^1.0.1",
"@0x/contract-artifacts": "^1.0.1",
"@0x/order-utils": "^2.0.0",
"@0x/sol-compiler": "^1.1.8",
"@0x/subproviders": "^2.1.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"@0x/abi-gen-wrappers": "^1.0.2",
"@0x/base-contract": "^3.0.3",
"@0x/contract-addresses": "^1.1.0",
"@0x/contract-artifacts": "^1.1.0",
"@0x/order-utils": "^2.0.1",
"@0x/sol-compiler": "^1.1.9",
"@0x/subproviders": "^2.1.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"@ledgerhq/hw-app-eth": "^4.3.0",
"ethereum-types": "^1.1.1",
"ethereum-types": "^1.1.2",
"ethers": "~4.0.4",
"lodash": "^4.17.5"
},

View File

@ -1,7 +1,7 @@
{
"private": true,
"name": "@0x/monorepo-scripts",
"version": "1.0.12",
"version": "1.0.13",
"engines": {
"node": ">=6.12"
},

View File

@ -1,4 +1,13 @@
[
{
"version": "2.0.1",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"version": "2.0.0",
"changes": [

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v2.0.1 - _November 9, 2018_
* Dependencies updated
## v2.0.0 - _October 18, 2018_
* Added `ecSignOrderAsync` to first sign an order using `eth_signTypedData` and fallback to `eth_sign`. (#1102)

View File

@ -1,6 +1,6 @@
{
"name": "@0x/order-utils",
"version": "2.0.0",
"version": "2.0.1",
"engines": {
"node": ">=6.12"
},
@ -35,8 +35,8 @@
},
"homepage": "https://github.com/0xProject/0x-monorepo/packages/order-utils/README.md",
"devDependencies": {
"@0x/dev-utils": "^1.0.13",
"@0x/tslint-config": "^1.0.9",
"@0x/dev-utils": "^1.0.14",
"@0x/tslint-config": "^1.0.10",
"@types/bn.js": "^4.11.0",
"@types/lodash": "4.14.104",
"chai": "^4.0.1",
@ -53,18 +53,18 @@
"typescript": "3.0.1"
},
"dependencies": {
"@0x/abi-gen-wrappers": "^1.0.1",
"@0x/assert": "^1.0.14",
"@0x/base-contract": "^3.0.2",
"@0x/contract-artifacts": "^1.0.1",
"@0x/json-schemas": "^2.0.0",
"@0x/types": "^1.2.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"@0x/abi-gen-wrappers": "^1.0.2",
"@0x/assert": "^1.0.15",
"@0x/base-contract": "^3.0.3",
"@0x/contract-artifacts": "^1.1.0",
"@0x/json-schemas": "^2.0.1",
"@0x/types": "^1.2.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"@types/node": "*",
"bn.js": "^4.11.8",
"ethereum-types": "^1.1.1",
"ethereum-types": "^1.1.2",
"ethereumjs-abi": "0.6.5",
"ethereumjs-util": "^5.1.1",
"ethers": "~4.0.4",

View File

@ -1,4 +1,13 @@
[
{
"version": "2.2.1",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"version": "2.2.0",
"changes": [

View File

@ -5,6 +5,10 @@ Edit the package's CHANGELOG.json file only.
CHANGELOG
## v2.2.1 - _November 9, 2018_
* Dependencies updated
## v2.2.0 - _October 18, 2018_
* Added getStats function and returns a Stats object (#1118)

View File

@ -1,6 +1,6 @@
{
"name": "@0x/order-watcher",
"version": "2.2.0",
"version": "2.2.1",
"description": "An order watcher daemon that watches for order validity",
"keywords": [
"0x",
@ -33,9 +33,9 @@
"node": ">=6.0.0"
},
"devDependencies": {
"@0x/dev-utils": "^1.0.13",
"@0x/migrations": "^2.0.0",
"@0x/tslint-config": "^1.0.9",
"@0x/dev-utils": "^1.0.14",
"@0x/migrations": "^2.0.1",
"@0x/tslint-config": "^1.0.10",
"@types/bintrees": "^1.0.2",
"@types/lodash": "4.14.104",
"@types/mocha": "^2.2.42",
@ -57,21 +57,21 @@
"typescript": "3.0.1"
},
"dependencies": {
"@0x/abi-gen-wrappers": "^1.0.1",
"@0x/assert": "^1.0.14",
"@0x/base-contract": "^3.0.2",
"@0x/contract-addresses": "^1.0.1",
"@0x/contract-artifacts": "^1.0.1",
"@0x/contract-wrappers": "^3.0.0",
"@0x/fill-scenarios": "^1.0.8",
"@0x/json-schemas": "^2.0.0",
"@0x/order-utils": "^2.0.0",
"@0x/types": "^1.2.0",
"@0x/typescript-typings": "^3.0.3",
"@0x/utils": "^2.0.3",
"@0x/web3-wrapper": "^3.1.0",
"@0x/abi-gen-wrappers": "^1.0.2",
"@0x/assert": "^1.0.15",
"@0x/base-contract": "^3.0.3",
"@0x/contract-addresses": "^1.1.0",
"@0x/contract-artifacts": "^1.1.0",
"@0x/contract-wrappers": "^3.0.1",
"@0x/fill-scenarios": "^1.0.9",
"@0x/json-schemas": "^2.0.1",
"@0x/order-utils": "^2.0.1",
"@0x/types": "^1.2.1",
"@0x/typescript-typings": "^3.0.4",
"@0x/utils": "^2.0.4",
"@0x/web3-wrapper": "^3.1.1",
"bintrees": "^1.0.2",
"ethereum-types": "^1.1.1",
"ethereum-types": "^1.1.2",
"ethereumjs-blockstream": "6.0.0",
"ethers": "~4.0.4",
"lodash": "^4.17.5"

View File

@ -1,4 +1,13 @@
[
{
"version": "1.0.15",
"changes": [
{
"note": "Dependencies updated"
}
],
"timestamp": 1541740904
},
{
"timestamp": 1539871071,
"version": "1.0.14",

Some files were not shown because too many files have changed in this diff Show More