diff --git a/demo/.env b/demo/.env
index 7bd14f3..2438218 100644
--- a/demo/.env
+++ b/demo/.env
@@ -1,2 +1,2 @@
-REACT_APP_PACKAGE_NAME=$npm_package_name
+REACT_APP_PACKAGE_NAME=@cahil/snowfall
REACT_APP_GITHUB_URL=$npm_package_homepage
\ No newline at end of file
diff --git a/demo/package-lock.json b/demo/package-lock.json
index cc502f7..56dbc5d 100644
--- a/demo/package-lock.json
+++ b/demo/package-lock.json
@@ -1,6 +1,6 @@
{
"name": "@cahil/snowfall-demo",
- "version": "0.1.3",
+ "version": "1.0.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
@@ -893,9 +893,9 @@
}
},
"@cahil/snowfall": {
- "version": "0.3.0",
- "resolved": "https://registry.npmjs.org/@cahil/snowfall/-/snowfall-0.3.0.tgz",
- "integrity": "sha512-fXcpDAGTjOobN/7QcAf4Y3C+qvL2imEEMx7Q0IKbe6WfIeAVhdkEkmxUStHP+lfwuaQEaiPObqkvp7soEkdOKA=="
+ "version": "1.0.0",
+ "resolved": "https://registry.npmjs.org/@cahil/snowfall/-/snowfall-1.0.0.tgz",
+ "integrity": "sha512-WwxV/se1ELndDR8fKHAxoizUNH4nww8D0qgEulKSDZPeiYhsaLfVPB/mwSpcy78ehU0+DKwFlwY+pR0uEqD/3g=="
},
"@cnakazawa/watch": {
"version": "1.0.3",
@@ -916,6 +916,11 @@
"resolved": "https://registry.npmjs.org/@csstools/normalize.css/-/normalize.css-9.0.1.tgz",
"integrity": "sha512-6It2EVfGskxZCQhuykrfnALg7oVeiI6KclWSmGDqB0AiInVrTGB9Jp9i4/Ad21u9Jde/voVQz6eFX/eSg/UsPA=="
},
+ "@emotion/hash": {
+ "version": "0.7.1",
+ "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.7.1.tgz",
+ "integrity": "sha512-OYpa/Sg+2GDX+jibUfpZVn1YqSVRpYmTLF2eyAfrFTIJSbwyIrc+YscayoykvaOME/wV4BV0Sa0yqdMrgse6mA=="
+ },
"@hapi/address": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/@hapi/address/-/address-2.0.0.tgz",
@@ -944,6 +949,11 @@
"@hapi/hoek": "6.x.x"
}
},
+ "@icons/material": {
+ "version": "0.2.4",
+ "resolved": "https://registry.npmjs.org/@icons/material/-/material-0.2.4.tgz",
+ "integrity": "sha512-QPcGmICAPbGLGb6F/yNf/KzKqvFx8z5qx3D1yFqVAjoFmXK35EgyW+cJ57Te3CNsmzblwtzakLGFqHPqrfb4Tw=="
+ },
"@jest/console": {
"version": "24.7.1",
"resolved": "https://registry.npmjs.org/@jest/console/-/console-24.7.1.tgz",
@@ -1153,6 +1163,109 @@
"@types/yargs": "^12.0.9"
}
},
+ "@material-ui/core": {
+ "version": "4.0.2",
+ "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.0.2.tgz",
+ "integrity": "sha512-k7o95UIupTp14lsO9hejmswuPZsmWUafOBNaptHN+Pv8CBp/vW+hD6peuThgUpeGesrCuL2/yTpHB/9JkO9rNg==",
+ "requires": {
+ "@babel/runtime": "^7.2.0",
+ "@material-ui/styles": "^4.0.2",
+ "@material-ui/system": "^4.0.2",
+ "@material-ui/types": "^4.0.1",
+ "@material-ui/utils": "^4.0.1",
+ "@types/react-transition-group": "^2.0.16",
+ "clsx": "^1.0.2",
+ "convert-css-length": "^2.0.0",
+ "csstype": "^2.5.2",
+ "debounce": "^1.1.0",
+ "deepmerge": "^3.0.0",
+ "hoist-non-react-statics": "^3.2.1",
+ "is-plain-object": "^3.0.0",
+ "normalize-scroll-left": "^0.2.0",
+ "popper.js": "^1.14.1",
+ "prop-types": "^15.7.2",
+ "react-event-listener": "^0.6.6",
+ "react-transition-group": "^4.0.0",
+ "warning": "^4.0.1"
+ },
+ "dependencies": {
+ "is-plain-object": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-3.0.0.tgz",
+ "integrity": "sha512-tZIpofR+P05k8Aocp7UI/2UTa9lTJSebCXpFFoR9aibpokDj/uXBsJ8luUu0tTVYKkMU6URDUuOfJZ7koewXvg==",
+ "requires": {
+ "isobject": "^4.0.0"
+ }
+ },
+ "isobject": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/isobject/-/isobject-4.0.0.tgz",
+ "integrity": "sha512-S/2fF5wH8SJA/kmwr6HYhK/RI/OkhD84k8ntalo0iJjZikgq1XFvR5M8NPT1x5F7fBwCG3qHfnzeP/Vh/ZxCUA=="
+ }
+ }
+ },
+ "@material-ui/lab": {
+ "version": "4.0.0-alpha.15",
+ "resolved": "https://registry.npmjs.org/@material-ui/lab/-/lab-4.0.0-alpha.15.tgz",
+ "integrity": "sha512-ixO6YxO0fFro2mt9C0dwrcgbpaNQEVszaDxWgKXaTFHIkXZDV4cY+XM0otV2o7DZVVfjvB5aAvyNsb0+db1JPA==",
+ "requires": {
+ "@babel/runtime": "^7.2.0",
+ "@material-ui/utils": "^4.0.1",
+ "clsx": "^1.0.2",
+ "keycode": "^2.1.9",
+ "prop-types": "^15.7.2"
+ }
+ },
+ "@material-ui/styles": {
+ "version": "4.0.2",
+ "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.0.2.tgz",
+ "integrity": "sha512-RUM+2G++2X4M6cbZ/K/PzAdxdSdqIU4zhZ82YYIcEz/OgCx72HC68+VrYxoy7nEjZ9E6R+9JmPPS7CO8O1oPmw==",
+ "requires": {
+ "@babel/runtime": "^7.2.0",
+ "@emotion/hash": "^0.7.1",
+ "@material-ui/types": "^4.0.1",
+ "@material-ui/utils": "^4.0.1",
+ "clsx": "^1.0.2",
+ "deepmerge": "^3.0.0",
+ "hoist-non-react-statics": "^3.2.1",
+ "jss": "^10.0.0-alpha.16",
+ "jss-plugin-camel-case": "^10.0.0-alpha.16",
+ "jss-plugin-default-unit": "^10.0.0-alpha.16",
+ "jss-plugin-global": "^10.0.0-alpha.16",
+ "jss-plugin-nested": "^10.0.0-alpha.16",
+ "jss-plugin-props-sort": "^10.0.0-alpha.16",
+ "jss-plugin-rule-value-function": "^10.0.0-alpha.16",
+ "jss-plugin-vendor-prefixer": "^10.0.0-alpha.16",
+ "prop-types": "^15.7.2",
+ "warning": "^4.0.1"
+ }
+ },
+ "@material-ui/system": {
+ "version": "4.0.2",
+ "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.0.2.tgz",
+ "integrity": "sha512-gpLYcDycJjK8tvWI9ZKrVLdGjFQ/YJM74TvhIMkP5ML453ZtPuFzMLt6FVEKp8okWxFEgYXVBNNSB4IF3Yig8g==",
+ "requires": {
+ "@babel/runtime": "^7.2.0",
+ "deepmerge": "^3.0.0",
+ "prop-types": "^15.7.2",
+ "warning": "^4.0.1"
+ }
+ },
+ "@material-ui/types": {
+ "version": "4.0.1",
+ "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-4.0.1.tgz",
+ "integrity": "sha512-FGhogU9l4s+ycMcC3hhOAvu5hcWa5TVSCCGUf4NOUF904ythroWSAvcCHn92NjftXZ8WZqmtPjL1K/d90Pq/3Q=="
+ },
+ "@material-ui/utils": {
+ "version": "4.0.1",
+ "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.0.1.tgz",
+ "integrity": "sha512-mWRcMQIrqsXGze73tx3hNfB1NUu+BL/oIQI7TImyuhsia1EQXw3bPVBjgwTzqM6MqfXw6eh1fR45Di+WN5hASA==",
+ "requires": {
+ "@babel/runtime": "^7.2.0",
+ "prop-types": "^15.7.2",
+ "react-is": "^16.8.0"
+ }
+ },
"@mrmlnc/readdir-enhanced": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/@mrmlnc/readdir-enhanced/-/readdir-enhanced-2.2.1.tgz",
@@ -1374,6 +1487,15 @@
"csstype": "^2.2.0"
}
},
+ "@types/react-color": {
+ "version": "3.0.1",
+ "resolved": "https://registry.npmjs.org/@types/react-color/-/react-color-3.0.1.tgz",
+ "integrity": "sha512-J6mYm43Sid9y+OjZ7NDfJ2VVkeeuTPNVImNFITgQNXodHteKfl/t/5pAR5Z9buodZ2tCctsZjgiMlQOpfntakw==",
+ "dev": true,
+ "requires": {
+ "@types/react": "*"
+ }
+ },
"@types/react-dom": {
"version": "16.8.4",
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-16.8.4.tgz",
@@ -1382,6 +1504,14 @@
"@types/react": "*"
}
},
+ "@types/react-transition-group": {
+ "version": "2.9.2",
+ "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-2.9.2.tgz",
+ "integrity": "sha512-5Fv2DQNO+GpdPZcxp2x/OQG/H19A01WlmpjVD9cKvVFmoVLOZ9LvBgSWG6pSXIU4og5fgbvGPaCV5+VGkWAEHA==",
+ "requires": {
+ "@types/react": "*"
+ }
+ },
"@types/stack-utils": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-1.0.1.tgz",
@@ -1771,7 +1901,7 @@
},
"array-equal": {
"version": "1.0.0",
- "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
+ "resolved": "http://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
"integrity": "sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM="
},
"array-filter": {
@@ -1865,7 +1995,7 @@
},
"util": {
"version": "0.10.3",
- "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
+ "resolved": "http://registry.npmjs.org/util/-/util-0.10.3.tgz",
"integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
"requires": {
"inherits": "2.0.1"
@@ -1975,7 +2105,7 @@
},
"chalk": {
"version": "1.1.3",
- "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+ "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
"integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
"requires": {
"ansi-styles": "^2.2.1",
@@ -2105,7 +2235,7 @@
},
"babel-plugin-syntax-object-rest-spread": {
"version": "6.13.0",
- "resolved": "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
+ "resolved": "http://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
"integrity": "sha1-/WU28rzhODb/o6VFjEkDpZe7O/U="
},
"babel-plugin-transform-object-rest-spread": {
@@ -2502,7 +2632,7 @@
},
"browserify-aes": {
"version": "1.2.0",
- "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
+ "resolved": "http://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
"integrity": "sha512-+7CHXqGuspUn/Sl5aO7Ea0xWGAtETPXNSAjHo48JfLdPWcMng33Xe4znFvQweqc/uzk5zSOI3H52CYnjCfb5hA==",
"requires": {
"buffer-xor": "^1.0.3",
@@ -2536,7 +2666,7 @@
},
"browserify-rsa": {
"version": "4.0.1",
- "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
+ "resolved": "http://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
"integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ=",
"requires": {
"bn.js": "^4.1.0",
@@ -2585,7 +2715,7 @@
},
"buffer": {
"version": "4.9.1",
- "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
+ "resolved": "http://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
"integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg=",
"requires": {
"base64-js": "^1.0.2",
@@ -2678,7 +2808,7 @@
},
"callsites": {
"version": "2.0.0",
- "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
+ "resolved": "http://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
"integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA="
},
"camel-case": {
@@ -3344,7 +3474,7 @@
},
"clone-deep": {
"version": "0.2.4",
- "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz",
+ "resolved": "http://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz",
"integrity": "sha1-TnPdCen7lxzDhnDF3O2cGJZIHMY=",
"requires": {
"for-own": "^0.1.3",
@@ -3354,6 +3484,11 @@
"shallow-clone": "^0.1.2"
}
},
+ "clsx": {
+ "version": "1.0.4",
+ "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.0.4.tgz",
+ "integrity": "sha512-1mQ557MIZTrL/140j+JVdRM6e31/OA4vTYxXgqIIZlndyfjHpyawKZia1Im05Vp9BWmImkcNrNtFYQMyFcgJDg=="
+ },
"co": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
@@ -3518,6 +3653,11 @@
"date-now": "^0.1.4"
}
},
+ "console-polyfill": {
+ "version": "0.1.2",
+ "resolved": "https://registry.npmjs.org/console-polyfill/-/console-polyfill-0.1.2.tgz",
+ "integrity": "sha1-ls/tUcr3gYn2mVcubxgnHcN8DjA="
+ },
"constants-browserify": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
@@ -3541,6 +3681,15 @@
"resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.4.tgz",
"integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA=="
},
+ "convert-css-length": {
+ "version": "2.0.0",
+ "resolved": "https://registry.npmjs.org/convert-css-length/-/convert-css-length-2.0.0.tgz",
+ "integrity": "sha512-ygBgHNzImHJ/kjgqdzC0oaY2+EMID3s88/CZD2C9O1stM3PwsOwXzzlFTTkZy/bPZe0wjyt1UoYjilfunQGjlw==",
+ "requires": {
+ "console-polyfill": "^0.1.2",
+ "parse-unit": "^1.0.1"
+ }
+ },
"convert-source-map": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.6.0.tgz",
@@ -3631,7 +3780,7 @@
},
"create-hash": {
"version": "1.2.0",
- "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
+ "resolved": "http://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
"integrity": "sha512-z00bCGNHDG8mHAkP7CtT1qVu+bFQUPjYq/4Iv3C3kWjTFV10zIjfSoeqXo9Asws8gwSHDGj/hl2u4OGIjapeCg==",
"requires": {
"cipher-base": "^1.0.1",
@@ -3643,7 +3792,7 @@
},
"create-hmac": {
"version": "1.1.7",
- "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
+ "resolved": "http://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
"integrity": "sha512-MJG9liiZ+ogc4TzUwuvbER1JRdgvUFSB5+VR/g5h82fGaIRWMWddtKBHi7/sVhfjQZ6SehlyhvQYrcYkaUIpLg==",
"requires": {
"cipher-base": "^1.0.3",
@@ -3701,7 +3850,7 @@
},
"css-color-names": {
"version": "0.0.4",
- "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
+ "resolved": "http://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
"integrity": "sha1-gIrcLnnPhHOAabZGyyDsJ762KeA="
},
"css-declaration-sorter": {
@@ -3807,6 +3956,15 @@
"resolved": "https://registry.npmjs.org/css-url-regex/-/css-url-regex-1.1.0.tgz",
"integrity": "sha1-g4NCMMyfdMRX3lnuvRVD/uuDt+w="
},
+ "css-vendor": {
+ "version": "2.0.2",
+ "resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-2.0.2.tgz",
+ "integrity": "sha512-Xn5ZAlI00d8HaQ8/oQ8d+iBzSF//NCc77LPzsucM32X/R/yTqmXy6otVsAM0XleXk6HjPuXoVZwXsayky/fsFQ==",
+ "requires": {
+ "@babel/runtime": "^7.3.1",
+ "is-in-browser": "^1.0.2"
+ }
+ },
"css-what": {
"version": "2.1.3",
"resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.3.tgz",
@@ -3975,6 +4133,11 @@
"resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz",
"integrity": "sha1-6vQ5/U1ISK105cx9vvIAZyueNFs="
},
+ "debounce": {
+ "version": "1.2.0",
+ "resolved": "https://registry.npmjs.org/debounce/-/debounce-1.2.0.tgz",
+ "integrity": "sha512-mYtLl1xfZLi1m4RtQYlZgJUNQjl4ZxVnHzIR8nLLgi4q1YT8o/WM+MK/f8yfcc9s5Ir5zRaPZyZU6xs1Syoocg=="
+ },
"debug": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
@@ -4003,6 +4166,11 @@
"resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
"integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
},
+ "deepmerge": {
+ "version": "3.2.0",
+ "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-3.2.0.tgz",
+ "integrity": "sha512-6+LuZGU7QCNUnAJyX8cIrlzoEgggTM6B7mm+znKOX4t5ltluT9KLjN6g61ECMS0LTsLW7yDpNoxhix5FZcrIow=="
+ },
"default-gateway": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/default-gateway/-/default-gateway-4.2.0.tgz",
@@ -4077,7 +4245,7 @@
"dependencies": {
"globby": {
"version": "6.1.0",
- "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
+ "resolved": "http://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
"integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
"requires": {
"array-union": "^1.0.1",
@@ -4089,7 +4257,7 @@
"dependencies": {
"pify": {
"version": "2.3.0",
- "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+ "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
}
}
@@ -4166,7 +4334,7 @@
},
"diffie-hellman": {
"version": "5.0.3",
- "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
+ "resolved": "http://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
"integrity": "sha512-kqag/Nl+f3GwyK25fhUMYj81BUOrZ9IuJsjIcDE5icNM9FJHAVm3VcUDxdLPoQtTuUylWm6ZIknYJwwaPxsUzg==",
"requires": {
"bn.js": "^4.1.0",
@@ -4221,6 +4389,14 @@
"utila": "~0.4"
}
},
+ "dom-helpers": {
+ "version": "3.4.0",
+ "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.4.0.tgz",
+ "integrity": "sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA==",
+ "requires": {
+ "@babel/runtime": "^7.1.2"
+ }
+ },
"dom-serializer": {
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.1.tgz",
@@ -4285,7 +4461,7 @@
},
"duplexer": {
"version": "0.1.1",
- "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
+ "resolved": "http://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
"integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
},
"duplexify": {
@@ -4662,7 +4838,7 @@
},
"doctrine": {
"version": "1.5.0",
- "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-1.5.0.tgz",
+ "resolved": "http://registry.npmjs.org/doctrine/-/doctrine-1.5.0.tgz",
"integrity": "sha1-N53Ocw9hZvds76TmcHoVmwLFpvo=",
"requires": {
"esutils": "^2.0.2",
@@ -4679,7 +4855,7 @@
},
"load-json-file": {
"version": "2.0.0",
- "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
+ "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
"integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg=",
"requires": {
"graceful-fs": "^4.1.2",
@@ -5017,7 +5193,7 @@
"dependencies": {
"array-flatten": {
"version": "1.1.1",
- "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
+ "resolved": "http://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
"integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
},
"debug": {
@@ -5849,6 +6025,14 @@
"minimalistic-crypto-utils": "^1.0.1"
}
},
+ "hoist-non-react-statics": {
+ "version": "3.3.0",
+ "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.0.tgz",
+ "integrity": "sha512-0XsbTXxgiaCDYDIWFcwkmerZPSwywfUqYmwT4jzewKTQSWoE6FCMoUVOeBJWK3E/CrWbxRG3m5GzY4lnIwGRBA==",
+ "requires": {
+ "react-is": "^16.7.0"
+ }
+ },
"hosted-git-info": {
"version": "2.7.1",
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.7.1.tgz",
@@ -6032,6 +6216,11 @@
}
}
},
+ "hyphenate-style-name": {
+ "version": "1.0.3",
+ "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.3.tgz",
+ "integrity": "sha512-EcuixamT82oplpoJ2XU4pDtKGWQ7b00CD9f1ug9IaQ3p1bkHMiKCZ9ut9QDI6qsa6cpUuB+A/I+zLtdNK4n2DQ=="
+ },
"iconv-lite": {
"version": "0.4.24",
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
@@ -6341,6 +6530,11 @@
"is-extglob": "^2.1.1"
}
},
+ "is-in-browser": {
+ "version": "1.1.3",
+ "resolved": "https://registry.npmjs.org/is-in-browser/-/is-in-browser-1.1.3.tgz",
+ "integrity": "sha1-Vv9NtoOgeMYILrldrX3GLh0E+DU="
+ },
"is-number": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
@@ -6351,7 +6545,7 @@
},
"is-obj": {
"version": "1.0.1",
- "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
+ "resolved": "http://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
"integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8="
},
"is-path-cwd": {
@@ -7724,6 +7918,82 @@
"verror": "1.10.0"
}
},
+ "jss": {
+ "version": "10.0.0-alpha.17",
+ "resolved": "https://registry.npmjs.org/jss/-/jss-10.0.0-alpha.17.tgz",
+ "integrity": "sha512-egGIUg+YRu0+U+XXlD0gmVtU/gW5sn7+qmDv7opwK5s8emZBE/VoN55X6CaMrAa0kLeGMldnI43KOWea6M9/mA==",
+ "requires": {
+ "@babel/runtime": "^7.3.1",
+ "is-in-browser": "^1.1.3",
+ "tiny-warning": "^1.0.2"
+ }
+ },
+ "jss-plugin-camel-case": {
+ "version": "10.0.0-alpha.17",
+ "resolved": "https://registry.npmjs.org/jss-plugin-camel-case/-/jss-plugin-camel-case-10.0.0-alpha.17.tgz",
+ "integrity": "sha512-aPY4kr6MwliH7KToLRzeSk1NxXUo9n7MQsAa0Hghwj01x9UnMkDkGAKENMKUtPjGkQZfiJpB9tTLFrSJ/6VrIQ==",
+ "requires": {
+ "@babel/runtime": "^7.3.1",
+ "hyphenate-style-name": "^1.0.3",
+ "jss": "10.0.0-alpha.17"
+ }
+ },
+ "jss-plugin-default-unit": {
+ "version": "10.0.0-alpha.17",
+ "resolved": "https://registry.npmjs.org/jss-plugin-default-unit/-/jss-plugin-default-unit-10.0.0-alpha.17.tgz",
+ "integrity": "sha512-KQgiXczvzJ9AlFdD8NS7FZLub0NSctSrCA9Yi/GqdsfJg4ZCriU4DzIybCZBHCi/INFGJmLIESYWSxnuhAzgSQ==",
+ "requires": {
+ "@babel/runtime": "^7.3.1",
+ "jss": "10.0.0-alpha.17"
+ }
+ },
+ "jss-plugin-global": {
+ "version": "10.0.0-alpha.17",
+ "resolved": "https://registry.npmjs.org/jss-plugin-global/-/jss-plugin-global-10.0.0-alpha.17.tgz",
+ "integrity": "sha512-WYxiwwI+CLk0ozW8loeceqXBAZXBMsLBEZeRwVf9WX+FljdJkGwVZpRCk6LBX4aXnqAGyKqCxIAIJ3KP2yBdEg==",
+ "requires": {
+ "@babel/runtime": "^7.3.1",
+ "jss": "10.0.0-alpha.17"
+ }
+ },
+ "jss-plugin-nested": {
+ "version": "10.0.0-alpha.17",
+ "resolved": "https://registry.npmjs.org/jss-plugin-nested/-/jss-plugin-nested-10.0.0-alpha.17.tgz",
+ "integrity": "sha512-onpFqv904KCujryf2t6IIV1/QoB7cSF7ojrd4UujcN5TPvYOvXF5bchi7jnHG5U0SLlRSDGMLJ9fhtoCknhEbw==",
+ "requires": {
+ "@babel/runtime": "^7.3.1",
+ "jss": "10.0.0-alpha.17",
+ "tiny-warning": "^1.0.2"
+ }
+ },
+ "jss-plugin-props-sort": {
+ "version": "10.0.0-alpha.17",
+ "resolved": "https://registry.npmjs.org/jss-plugin-props-sort/-/jss-plugin-props-sort-10.0.0-alpha.17.tgz",
+ "integrity": "sha512-KnbyrxCbtQTqpDx2mSZU/r/E5QnDPIVfIxRi8K+W/q4gZpomBvqWC+xgvAk9hbpmA6QBoQaOilV8o12w2IZ6fg==",
+ "requires": {
+ "@babel/runtime": "^7.3.1",
+ "jss": "10.0.0-alpha.17"
+ }
+ },
+ "jss-plugin-rule-value-function": {
+ "version": "10.0.0-alpha.17",
+ "resolved": "https://registry.npmjs.org/jss-plugin-rule-value-function/-/jss-plugin-rule-value-function-10.0.0-alpha.17.tgz",
+ "integrity": "sha512-8AuJB44Q+ehfkWVRi2XlRbUf6SrLmrHTa5EXd6dgQRCCRuvGmqX8Dl4fZvNeKRFjTLPZgzg9+31rqeOMhKa2vA==",
+ "requires": {
+ "@babel/runtime": "^7.3.1",
+ "jss": "10.0.0-alpha.17"
+ }
+ },
+ "jss-plugin-vendor-prefixer": {
+ "version": "10.0.0-alpha.17",
+ "resolved": "https://registry.npmjs.org/jss-plugin-vendor-prefixer/-/jss-plugin-vendor-prefixer-10.0.0-alpha.17.tgz",
+ "integrity": "sha512-wDq9EL0QaoMGSGifPEBb+/SA9LBcqPEW0jpL9ht+Z2t+lV7NNz0j7uCEOuE6FvNWqHzUKTsiATs1rTHPkzNBEQ==",
+ "requires": {
+ "@babel/runtime": "^7.3.1",
+ "css-vendor": "^2.0.1",
+ "jss": "10.0.0-alpha.17"
+ }
+ },
"jsx-ast-utils": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-2.1.0.tgz",
@@ -7732,6 +8002,11 @@
"array-includes": "^3.0.3"
}
},
+ "keycode": {
+ "version": "2.2.0",
+ "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.2.0.tgz",
+ "integrity": "sha1-PQr1bce4uOXLqNCpfxByBO7CKwQ="
+ },
"killable": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/killable/-/killable-1.0.1.tgz",
@@ -8029,6 +8304,11 @@
"object-visit": "^1.0.0"
}
},
+ "material-colors": {
+ "version": "1.2.6",
+ "resolved": "https://registry.npmjs.org/material-colors/-/material-colors-1.2.6.tgz",
+ "integrity": "sha512-6qE4B9deFBIa9YSpOc9O0Sgc43zTeVYbgDT5veRKSlB2+ZuHNoVVxA1L/ckMUayV9Ay9y7Z/SZCLcGteW9i7bg=="
+ },
"md5.js": {
"version": "1.3.5",
"resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
@@ -8046,7 +8326,7 @@
},
"media-typer": {
"version": "0.3.0",
- "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
+ "resolved": "http://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
"integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g="
},
"mem": {
@@ -8259,7 +8539,7 @@
},
"mkdirp": {
"version": "0.5.1",
- "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
+ "resolved": "http://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
"integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
"requires": {
"minimist": "0.0.8"
@@ -8485,6 +8765,11 @@
"resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz",
"integrity": "sha1-LRDAa9/TEuqXd2laTShDlFa3WUI="
},
+ "normalize-scroll-left": {
+ "version": "0.2.0",
+ "resolved": "https://registry.npmjs.org/normalize-scroll-left/-/normalize-scroll-left-0.2.0.tgz",
+ "integrity": "sha512-t5oCENZJl8TGusJKoCJm7+asaSsPuNmK6+iEjrZ5TyBj2f02brCRsd4c83hwtu+e5d4LCSBZ0uoDlMjBo+A8yA=="
+ },
"normalize-url": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-3.3.0.tgz",
@@ -8729,7 +9014,7 @@
},
"os-tmpdir": {
"version": "1.0.2",
- "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
+ "resolved": "http://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
"integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ="
},
"p-defer": {
@@ -8846,6 +9131,11 @@
"json-parse-better-errors": "^1.0.1"
}
},
+ "parse-unit": {
+ "version": "1.0.1",
+ "resolved": "https://registry.npmjs.org/parse-unit/-/parse-unit-1.0.1.tgz",
+ "integrity": "sha1-fhu21b7zh0wo45JSaiVBFwKR7s8="
+ },
"parse5": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.0.tgz",
@@ -9028,6 +9318,11 @@
"ts-pnp": "^1.0.0"
}
},
+ "popper.js": {
+ "version": "1.15.0",
+ "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.15.0.tgz",
+ "integrity": "sha512-w010cY1oCUmI+9KwwlWki+r5jxKfTFDVoadl7MSrIujHU5MJ5OR6HTDj6Xo8aoR/QsA56x8jKjA59qGH4ELtrA=="
+ },
"portfinder": {
"version": "1.0.20",
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.20.tgz",
@@ -9040,7 +9335,7 @@
"dependencies": {
"async": {
"version": "1.5.2",
- "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
+ "resolved": "http://registry.npmjs.org/async/-/async-1.5.2.tgz",
"integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
},
"debug": {
@@ -10173,6 +10468,19 @@
"whatwg-fetch": "3.0.0"
}
},
+ "react-color": {
+ "version": "2.17.3",
+ "resolved": "https://registry.npmjs.org/react-color/-/react-color-2.17.3.tgz",
+ "integrity": "sha512-1dtO8LqAVotPIChlmo6kLtFS1FP89ll8/OiA8EcFRDR+ntcK+0ukJgByuIQHRtzvigf26dV5HklnxDIvhON9VQ==",
+ "requires": {
+ "@icons/material": "^0.2.4",
+ "lodash": "^4.17.11",
+ "material-colors": "^1.2.1",
+ "prop-types": "^15.5.10",
+ "reactcss": "^1.2.0",
+ "tinycolor2": "^1.4.1"
+ }
+ },
"react-dev-utils": {
"version": "9.0.1",
"resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-9.0.1.tgz",
@@ -10266,6 +10574,16 @@
"resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-5.1.6.tgz",
"integrity": "sha512-X1Y+0jR47ImDVr54Ab6V9eGk0Hnu7fVWGeHQSOXHf/C2pF9c6uy3gef8QUeuUiWlNb0i08InPSE5a/KJzNzw1Q=="
},
+ "react-event-listener": {
+ "version": "0.6.6",
+ "resolved": "https://registry.npmjs.org/react-event-listener/-/react-event-listener-0.6.6.tgz",
+ "integrity": "sha512-+hCNqfy7o9wvO6UgjqFmBzARJS7qrNoda0VqzvOuioEpoEXKutiKuv92dSz6kP7rYLmyHPyYNLesi5t/aH1gfw==",
+ "requires": {
+ "@babel/runtime": "^7.2.0",
+ "prop-types": "^15.6.0",
+ "warning": "^4.0.1"
+ }
+ },
"react-is": {
"version": "16.8.6",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.8.6.tgz",
@@ -10343,6 +10661,24 @@
}
}
},
+ "react-transition-group": {
+ "version": "4.1.0",
+ "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.1.0.tgz",
+ "integrity": "sha512-/OITbogb3emGN49WaP7468QGSde7er5w6eIHldIDCSQBq/9QTSCzs8OgpgmOnaUXCXzBUcK1zoZ6DqRlM8CJtA==",
+ "requires": {
+ "dom-helpers": "^3.4.0",
+ "loose-envify": "^1.4.0",
+ "prop-types": "^15.6.2"
+ }
+ },
+ "reactcss": {
+ "version": "1.2.3",
+ "resolved": "https://registry.npmjs.org/reactcss/-/reactcss-1.2.3.tgz",
+ "integrity": "sha512-KiwVUcFu1RErkI97ywr8nvx8dNOpT03rbnma0SSalTYjkrPYaEajR4a/MRt6DZ46K6arDRbWMNHF+xH7G7n/8A==",
+ "requires": {
+ "lodash": "^4.0.1"
+ }
+ },
"read-pkg": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-3.0.0.tgz",
@@ -10364,7 +10700,7 @@
},
"readable-stream": {
"version": "2.3.6",
- "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
+ "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
"integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
"requires": {
"core-util-is": "~1.0.0",
@@ -10475,7 +10811,7 @@
"dependencies": {
"jsesc": {
"version": "0.5.0",
- "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+ "resolved": "http://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
"integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0="
}
}
@@ -10519,7 +10855,7 @@
},
"css-select": {
"version": "1.2.0",
- "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
+ "resolved": "http://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
"integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg=",
"requires": {
"boolbase": "~1.0.0",
@@ -10695,7 +11031,7 @@
},
"rgba-regex": {
"version": "1.0.0",
- "resolved": "https://registry.npmjs.org/rgba-regex/-/rgba-regex-1.0.0.tgz",
+ "resolved": "http://registry.npmjs.org/rgba-regex/-/rgba-regex-1.0.0.tgz",
"integrity": "sha1-QzdOLiyglosO8VI0YLfXMP8i7rM="
},
"rimraf": {
@@ -10751,7 +11087,7 @@
},
"safe-regex": {
"version": "1.1.0",
- "resolved": "https://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz",
+ "resolved": "http://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz",
"integrity": "sha1-QKNmnzsHfR6UPURinhV91IAjvy4=",
"requires": {
"ret": "~0.1.10"
@@ -11040,7 +11376,7 @@
},
"sha.js": {
"version": "2.4.11",
- "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
+ "resolved": "http://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
"integrity": "sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==",
"requires": {
"inherits": "^2.0.1",
@@ -11065,7 +11401,7 @@
},
"kind-of": {
"version": "2.0.1",
- "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz",
+ "resolved": "http://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz",
"integrity": "sha1-AY7HpM5+OobLkUG+UZ0kyPqpgbU=",
"requires": {
"is-buffer": "^1.0.2"
@@ -11551,7 +11887,7 @@
},
"string_decoder": {
"version": "1.1.1",
- "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+ "resolved": "http://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
"integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
"requires": {
"safe-buffer": "~5.1.0"
@@ -11591,7 +11927,7 @@
},
"strip-eof": {
"version": "1.0.0",
- "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
+ "resolved": "http://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
"integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8="
},
"strip-json-comments": {
@@ -11780,7 +12116,7 @@
},
"through": {
"version": "2.3.8",
- "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
+ "resolved": "http://registry.npmjs.org/through/-/through-2.3.8.tgz",
"integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU="
},
"through2": {
@@ -11810,6 +12146,16 @@
"resolved": "https://registry.npmjs.org/timsort/-/timsort-0.3.0.tgz",
"integrity": "sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q="
},
+ "tiny-warning": {
+ "version": "1.0.2",
+ "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.2.tgz",
+ "integrity": "sha512-rru86D9CpQRLvsFG5XFdy0KdLAvjdQDyZCsRcuu60WtzFylDM3eAWSxEVz5kzL2Gp544XiUvPbVKtOA/txLi9Q=="
+ },
+ "tinycolor2": {
+ "version": "1.4.1",
+ "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.4.1.tgz",
+ "integrity": "sha1-9PrTM0R7wLB9TcjpIJ2POaisd+g="
+ },
"tmp": {
"version": "0.0.33",
"resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
@@ -12348,6 +12694,14 @@
"makeerror": "1.0.x"
}
},
+ "warning": {
+ "version": "4.0.3",
+ "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
+ "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
+ "requires": {
+ "loose-envify": "^1.0.0"
+ }
+ },
"watchpack": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.0.tgz",
@@ -12802,7 +13156,7 @@
},
"wrap-ansi": {
"version": "2.1.0",
- "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
+ "resolved": "http://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
"integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
"requires": {
"string-width": "^1.0.1",
diff --git a/demo/package.json b/demo/package.json
index cf064cd..3bf9742 100644
--- a/demo/package.json
+++ b/demo/package.json
@@ -1,16 +1,19 @@
{
- "name": "@cahil/snowfall",
+ "name": "@cahil/snowfall-demo",
"version": "1.0.0",
"private": true,
"homepage": "https://github.com/cahilfoley/snowfall",
"dependencies": {
"@cahil/snowfall": "latest",
+ "@material-ui/core": "^4.0.2",
+ "@material-ui/lab": "^4.0.0-alpha.15",
"@types/jest": "^24.0.13",
"@types/node": "^12.0.7",
"@types/react": "^16.8.19",
"@types/react-dom": "^16.8.4",
"gh-pages": "^2.0.1",
"react": "^16.8.6",
+ "react-color": "^2.17.3",
"react-dom": "^16.8.6",
"react-scripts": "3.0.1",
"typescript": "^3.5.1"
@@ -31,5 +34,8 @@
"not dead",
"not ie <= 11",
"not op_mini all"
- ]
+ ],
+ "devDependencies": {
+ "@types/react-color": "^3.0.1"
+ }
}
diff --git a/demo/public/index.html b/demo/public/index.html
index a0741c1..57df60b 100644
--- a/demo/public/index.html
+++ b/demo/public/index.html
@@ -3,17 +3,11 @@
-
-
+
+
- Snowfall Demo | @cahil/snowfall
+ Snowfall Demo | %REACT_APP_PACKAGE_NAME%
diff --git a/demo/src/App.css b/demo/src/App.css
index 6b25a1a..1429dcd 100644
--- a/demo/src/App.css
+++ b/demo/src/App.css
@@ -15,7 +15,7 @@ body {
.app {
position: relative;
background-color: #282c34;
- background-image: url(./128.jpg);
+ background-image: url(./assets/128.jpg);
background-size: cover;
background-position: center center;
min-height: 100vh;
@@ -33,11 +33,12 @@ body {
h1 {
font-weight: 600;
- font-size: 6rem;
+ font-size: 5rem;
margin: 16px;
}
a {
- color: rgba(33, 150, 243, 0.87);
+ color: inherit;
+ text-decoration: none;
font-size: 2rem;
}
diff --git a/demo/src/App.tsx b/demo/src/App.tsx
index 73cc379..a703c25 100644
--- a/demo/src/App.tsx
+++ b/demo/src/App.tsx
@@ -1,22 +1,38 @@
-import React, { Component } from 'react'
+import React, { useContext } from 'react'
import Snowfall from '@cahil/snowfall'
-import GithubLink from './GithubLink'
+import GithubLink from './components/GithubLink/GithubLink'
+import Settings from './components/Settings'
+import { SettingsContext, StateProvider } from './context/settings'
import './App.css'
const githubURL = process.env.REACT_APP_GITHUB_URL as string
const packageName = process.env.REACT_APP_PACKAGE_NAME as string
-class App extends Component {
- render() {
- return (
-
- )
- }
+const Demo = () => {
+ const settings = useContext(SettingsContext)
+
+ return
}
+const Title = () => {
+ const settings = useContext(SettingsContext)
+
+ return (
+
+ {packageName}
+
+ )
+}
+
+const App = () => (
+
+
+
+
+
+
+
+
+)
+
export default App
diff --git a/demo/src/128.jpg b/demo/src/assets/128.jpg
similarity index 100%
rename from demo/src/128.jpg
rename to demo/src/assets/128.jpg
diff --git a/demo/src/GithubLink.css b/demo/src/components/GithubLink/GithubLink.css
similarity index 100%
rename from demo/src/GithubLink.css
rename to demo/src/components/GithubLink/GithubLink.css
diff --git a/demo/src/GithubLink.tsx b/demo/src/components/GithubLink/GithubLink.tsx
similarity index 100%
rename from demo/src/GithubLink.tsx
rename to demo/src/components/GithubLink/GithubLink.tsx
diff --git a/demo/src/components/Settings/Settings.css b/demo/src/components/Settings/Settings.css
new file mode 100644
index 0000000..b988401
--- /dev/null
+++ b/demo/src/components/Settings/Settings.css
@@ -0,0 +1,6 @@
+.settings-container {
+ background-color: rgba(66, 66, 66, 0.7) !important;
+ width: 100%;
+ max-width: 400px;
+ padding: 32px;
+}
diff --git a/demo/src/components/Settings/Settings.tsx b/demo/src/components/Settings/Settings.tsx
new file mode 100644
index 0000000..b8f647a
--- /dev/null
+++ b/demo/src/components/Settings/Settings.tsx
@@ -0,0 +1,61 @@
+import React, { useContext } from 'react'
+import { CirclePicker } from 'react-color'
+import Box from '@material-ui/core/Box'
+import Paper from '@material-ui/core/Paper'
+import Typography from '@material-ui/core/Typography'
+import Slider from '@material-ui/lab/Slider'
+import { SettingsContext, SnowfallSettings } from 'context/settings'
+import { ThemeProvider } from './theme'
+
+import './Settings.css'
+
+const colors = [
+ '#dee4fd',
+ '#e91e63',
+ '#9c27b0',
+ '#673ab7',
+ '#3f51b5',
+ '#2196f3',
+ '#03a9f4',
+ '#00bcd4',
+ '#009688',
+ '#4caf50',
+ '#8bc34a',
+ '#cddc39',
+ '#ffeb3b',
+ '#ffc107',
+ '#ff9800',
+ '#ff5722',
+ '#795548',
+ '#607d8b',
+]
+
+const Settings = () => {
+ const settings = useContext(SettingsContext) as SnowfallSettings
+
+ return (
+
+
+ Snowflake Count - {settings.snowflakeCount}
+ settings.setSnowflakeCount(value)}
+ />
+
+ Color - {settings.color}
+ settings.setColor(value.hex)}
+ />
+
+
+
+ )
+}
+
+export default Settings
diff --git a/demo/src/components/Settings/index.ts b/demo/src/components/Settings/index.ts
new file mode 100644
index 0000000..6f08a3f
--- /dev/null
+++ b/demo/src/components/Settings/index.ts
@@ -0,0 +1 @@
+export { default } from './Settings'
diff --git a/demo/src/components/Settings/theme.tsx b/demo/src/components/Settings/theme.tsx
new file mode 100644
index 0000000..bb42b4f
--- /dev/null
+++ b/demo/src/components/Settings/theme.tsx
@@ -0,0 +1,15 @@
+import * as React from 'react'
+import { createMuiTheme, MuiThemeProvider } from '@material-ui/core/styles'
+
+export const theme = createMuiTheme({
+ palette: {
+ type: 'dark',
+ primary: {
+ main: 'rgba(33, 150, 243, 0.87)',
+ },
+ },
+})
+
+export const ThemeProvider: React.FC = ({ children }) => {
+ return {children}
+}
diff --git a/demo/src/context/settings.tsx b/demo/src/context/settings.tsx
new file mode 100644
index 0000000..4f23a2a
--- /dev/null
+++ b/demo/src/context/settings.tsx
@@ -0,0 +1,20 @@
+import React, { createContext, useState, FC } from 'react'
+import { SnowfallProps } from '@cahil/snowfall'
+
+export interface SnowfallSettings extends SnowfallProps {
+ setColor: (color: string) => void
+ setSnowflakeCount: (count: number) => void
+}
+
+export const SettingsContext = createContext>({})
+
+export const StateProvider: FC = ({ children }) => {
+ const [color, setColor] = useState('#dee4fd')
+ const [snowflakeCount, setSnowflakeCount] = useState(200)
+
+ return (
+
+ {children}
+
+ )
+}
diff --git a/demo/tsconfig.json b/demo/tsconfig.json
index 2095f20..38af766 100644
--- a/demo/tsconfig.json
+++ b/demo/tsconfig.json
@@ -7,19 +7,14 @@
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
+ "baseUrl": "src",
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "preserve",
- "lib": [
- "dom",
- "dom.iterable",
- "esnext"
- ]
+ "lib": ["dom", "dom.iterable", "esnext"]
},
- "include": [
- "src"
- ]
+ "include": ["src"]
}