diff --git a/CHANGELOG.md b/CHANGELOG.md index 04bab6fd..61f01b1e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,13 @@ + +## [0.8.22](https://github.com/fivethree-team/component-library/compare/v0.8.21...v0.8.22) (2019-07-22) + + +### Features + +* **bottom-sheet:** remove hammer js dependency from library ([d68bc78](https://github.com/fivethree-team/component-library/commit/d68bc78)) + + + ## [0.8.21](https://github.com/fivethree-team/component-library/compare/v0.8.20...v0.8.21) (2019-07-20) diff --git a/README.md b/README.md index 02af614f..987a9702 100644 --- a/README.md +++ b/README.md @@ -8,12 +8,8 @@ Costumizable UI Components for Ionic 4. [Component Demos](https://fivethree-team.github.io/ionic-4-components/components) | [Getting Started](https://fivethree-team.github.io/ionic-4-components/getting-started) | [Get In Touch](https://fivethree.io/) - -![gallery](src/assets/gif/gallery.gif) -![pull-to-refresh](src/assets/gif/pulltorefresh.gif) -![feature discovery](src/assets/gif/feature-discovery.gif) -![dialog](src/assets/gif/dialog.gif) -![bottom-sheet](src/assets/gif/bottom-sheet.gif) +*** +gallerypullto refreshfeature discoverydialogbottom sheet # ✨ Features * Twitter inspired Image Gallery @@ -32,7 +28,7 @@ To get started, install the package from npm. The latest version supports Ionic You can use either npm or yarn to install `@fivethree/core` from npm. ```bash -npm install --save @fivethree/core @angular/animations hammerjs +npm install --save @fivethree/core @angular/animations ``` ## Step 2. Configure your Ionic App diff --git a/package-lock.json b/package-lock.json index bc0289c0..f45413c4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "fivethree", - "version": "0.8.21", + "version": "0.8.22", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -1242,14 +1242,14 @@ } }, "@babel/generator": { - "version": "7.4.0", - "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.4.0.tgz", - "integrity": "sha512-/v5I+a1jhGSKLgZDcmAUZ4K/VePi43eRkUs3yePW1HB1iANOD5tqJXwGSG4BZhSksP8J9ejSlwGeTiiOFZOrXQ==", + "version": "7.5.5", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.5.5.tgz", + "integrity": "sha512-ETI/4vyTSxTzGnU2c49XHv2zhExkv9JHLTwDAFz85kmcwuShvYG2H08FwgIguQf4JC75CBnXAUM5PqeF4fj0nQ==", "dev": true, "requires": { - "@babel/types": "^7.4.0", + "@babel/types": "^7.5.5", "jsesc": "^2.5.1", - "lodash": "^4.17.11", + "lodash": "^4.17.13", "source-map": "^0.5.0", "trim-right": "^1.0.1" }, @@ -1259,6 +1259,12 @@ "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz", "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==", "dev": true + }, + "lodash": { + "version": "4.17.15", + "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz", + "integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A==", + "dev": true } } }, @@ -1283,12 +1289,12 @@ } }, "@babel/helper-split-export-declaration": { - "version": "7.4.0", - "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.4.0.tgz", - "integrity": "sha512-7Cuc6JZiYShaZnybDmfwhY4UYHzI6rlqhWjaIqbsJGsIqPimEYy5uh3akSRLMg65LSdSEnJ8a8/bWQN6u2oMGw==", + "version": "7.4.4", + "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.4.4.tgz", + "integrity": "sha512-Ro/XkzLf3JFITkW6b+hNxzZ1n5OQ80NvIUdmHspih1XAhtN3vPTuUFT4eQnela+2MaZ5ulH+iyP513KJrxbN7Q==", "dev": true, "requires": { - "@babel/types": "^7.4.0" + "@babel/types": "^7.4.4" } }, "@babel/highlight": { @@ -1311,39 +1317,48 @@ } }, "@babel/parser": { - "version": "7.4.3", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.4.3.tgz", - "integrity": "sha512-gxpEUhTS1sGA63EGQGuA+WESPR/6tz6ng7tSHFCmaTJK/cGK8y37cBTspX+U2xCAue2IQVvF6Z0oigmjwD8YGQ==", + "version": "7.5.5", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.5.5.tgz", + "integrity": "sha512-E5BN68cqR7dhKan1SfqgPGhQ178bkVKpXTPEXnFJBrEt8/DKRZlybmy+IgYLTeN7tp1R5Ccmbm2rBk17sHYU3g==", "dev": true }, "@babel/template": { - "version": "7.4.0", - "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.4.0.tgz", - "integrity": "sha512-SOWwxxClTTh5NdbbYZ0BmaBVzxzTh2tO/TeLTbF6MO6EzVhHTnff8CdBXx3mEtazFBoysmEM6GU/wF+SuSx4Fw==", + "version": "7.4.4", + "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.4.4.tgz", + "integrity": "sha512-CiGzLN9KgAvgZsnivND7rkA+AeJ9JB0ciPOD4U59GKbQP2iQl+olF1l76kJOupqidozfZ32ghwBEJDhnk9MEcw==", "dev": true, "requires": { "@babel/code-frame": "^7.0.0", - "@babel/parser": "^7.4.0", - "@babel/types": "^7.4.0" + "@babel/parser": "^7.4.4", + "@babel/types": "^7.4.4" } }, "@babel/traverse": { - "version": "7.4.3", - "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.4.3.tgz", - "integrity": "sha512-HmA01qrtaCwwJWpSKpA948cBvU5BrmviAief/b3AVw936DtcdsTexlbyzNuDnthwhOQ37xshn7hvQaEQk7ISYQ==", + "version": "7.5.5", + "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.5.5.tgz", + "integrity": "sha512-MqB0782whsfffYfSjH4TM+LMjrJnhCNEDMDIjeTpl+ASaUvxcjoiVCo/sM1GhS1pHOXYfWVCYneLjMckuUxDaQ==", "dev": true, "requires": { - "@babel/code-frame": "^7.0.0", - "@babel/generator": "^7.4.0", + "@babel/code-frame": "^7.5.5", + "@babel/generator": "^7.5.5", "@babel/helper-function-name": "^7.1.0", - "@babel/helper-split-export-declaration": "^7.4.0", - "@babel/parser": "^7.4.3", - "@babel/types": "^7.4.0", + "@babel/helper-split-export-declaration": "^7.4.4", + "@babel/parser": "^7.5.5", + "@babel/types": "^7.5.5", "debug": "^4.1.0", "globals": "^11.1.0", - "lodash": "^4.17.11" + "lodash": "^4.17.13" }, "dependencies": { + "@babel/code-frame": { + "version": "7.5.5", + "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.5.5.tgz", + "integrity": "sha512-27d4lZoomVyo51VegxI20xZPuSHusqbQag/ztrBC7wegWoQ1nLREPVSKSW8byhTlzTKyNE4ifaTA6lCp7JjpFw==", + "dev": true, + "requires": { + "@babel/highlight": "^7.0.0" + } + }, "debug": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz", @@ -1354,30 +1369,42 @@ } }, "globals": { - "version": "11.11.0", - "resolved": "https://registry.npmjs.org/globals/-/globals-11.11.0.tgz", - "integrity": "sha512-WHq43gS+6ufNOEqlrDBxVEbb8ntfXrfAUU2ZOpCxrBdGKW3gyv8mCxAfIBD0DroPKGrJ2eSsXsLtY9MPntsyTw==", + "version": "11.12.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", + "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==", + "dev": true + }, + "lodash": { + "version": "4.17.15", + "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz", + "integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A==", "dev": true }, "ms": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz", - "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==", + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", + "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", "dev": true } } }, "@babel/types": { - "version": "7.4.0", - "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.4.0.tgz", - "integrity": "sha512-aPvkXyU2SPOnztlgo8n9cEiXW755mgyvueUPcpStqdzoSPm0fjO0vQBjLkt3JKJW7ufikfcnMTTPsN1xaTsBPA==", + "version": "7.5.5", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.5.5.tgz", + "integrity": "sha512-s63F9nJioLqOlW3UkyMd+BYhXt44YuaFm/VV0VwuteqjYwRrObkU7ra9pY4wAJR3oXi8hJrMcrcJdO/HH33vtw==", "dev": true, "requires": { "esutils": "^2.0.2", - "lodash": "^4.17.11", + "lodash": "^4.17.13", "to-fast-properties": "^2.0.0" }, "dependencies": { + "lodash": { + "version": "4.17.15", + "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz", + "integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A==", + "dev": true + }, "to-fast-properties": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz", @@ -3388,9 +3415,9 @@ "dev": true }, "compare-versions": { - "version": "3.4.0", - "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-3.4.0.tgz", - "integrity": "sha512-tK69D7oNXXqUW3ZNo/z7NXTEz22TCF0pTE+YF9cxvaAM9XnkLo1fV621xCLrRR6aevJlKxExkss0vWqUCUpqdg==", + "version": "3.5.0", + "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-3.5.0.tgz", + "integrity": "sha512-hX+4kt2Rcwu+x1U0SsEFCn1quURjEjPEGH/cPBlpME/IidGimAdwfMU+B+xDr7et/KTR7VH2+ZqWGerv4NGs2w==", "dev": true }, "component-bind": { @@ -3721,12 +3748,12 @@ }, "q": { "version": "1.5.1", - "resolved": false, + "resolved": "https://registry.npmjs.org/q/-/q-1.5.1.tgz", "integrity": "sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc=" }, "shelljs": { "version": "0.5.3", - "resolved": false, + "resolved": "https://registry.npmjs.org/shelljs/-/shelljs-0.5.3.tgz", "integrity": "sha1-xUmCuZbHbvDB5rWfvcWCX1txMRM=" } } @@ -6012,11 +6039,6 @@ "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU=", "dev": true }, - "hammerjs": { - "version": "2.0.8", - "resolved": "https://registry.npmjs.org/hammerjs/-/hammerjs-2.0.8.tgz", - "integrity": "sha1-BO93hiz/K7edMPdpIJWTAiK/YPE=" - }, "handle-thing": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-2.0.0.tgz", @@ -7007,57 +7029,47 @@ "dev": true }, "istanbul-api": { - "version": "2.1.5", - "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-2.1.5.tgz", - "integrity": "sha512-meYk1BwDp59Pfse1TvPrkKYgVqAufbdBLEVoqvu/hLLKSaQ054ZTksbNepyc223tMnWdm6AdK2URIJJRqdP87g==", + "version": "2.1.6", + "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-2.1.6.tgz", + "integrity": "sha512-x0Eicp6KsShG1k1rMgBAi/1GgY7kFGEBwQpw3PXGEmu+rBcBNhqU8g2DgY9mlepAsLPzrzrbqSgCGANnki4POA==", "dev": true, "requires": { - "async": "^2.6.1", - "compare-versions": "^3.2.1", + "async": "^2.6.2", + "compare-versions": "^3.4.0", "fileset": "^2.0.3", - "istanbul-lib-coverage": "^2.0.4", - "istanbul-lib-hook": "^2.0.6", - "istanbul-lib-instrument": "^3.2.0", - "istanbul-lib-report": "^2.0.7", - "istanbul-lib-source-maps": "^3.0.5", - "istanbul-reports": "^2.2.3", - "js-yaml": "^3.13.0", + "istanbul-lib-coverage": "^2.0.5", + "istanbul-lib-hook": "^2.0.7", + "istanbul-lib-instrument": "^3.3.0", + "istanbul-lib-report": "^2.0.8", + "istanbul-lib-source-maps": "^3.0.6", + "istanbul-reports": "^2.2.4", + "js-yaml": "^3.13.1", "make-dir": "^2.1.0", "minimatch": "^3.0.4", "once": "^1.4.0" }, "dependencies": { "istanbul-lib-coverage": { - "version": "2.0.4", - "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz", - "integrity": "sha512-LXTBICkMARVgo579kWDm8SqfB6nvSDKNqIOBEjmJRnL04JvoMHCYGWaMddQnseJYtkEuEvO/sIcOxPLk9gERug==", + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.5.tgz", + "integrity": "sha512-8aXznuEPCJvGnMSRft4udDRDtb1V3pkQkMMI5LI+6HuQz5oQ4J2UFn1H82raA3qJtyOLkkwVqICBQkjnGtn5mA==", "dev": true }, "istanbul-lib-instrument": { - "version": "3.2.0", - "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-3.2.0.tgz", - "integrity": "sha512-06IM3xShbNW4NgZv5AP4QH0oHqf1/ivFo8eFys0ZjPXHGldHJQWb3riYOKXqmOqfxXBfxu4B+g/iuhOPZH0RJg==", + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-3.3.0.tgz", + "integrity": "sha512-5nnIN4vo5xQZHdXno/YDXJ0G+I3dAm4XgzfSVTPLQpj/zAV2dV6Juy0yaf10/zrJOJeHoN3fraFe+XRq2bFVZA==", "dev": true, "requires": { - "@babel/generator": "^7.0.0", - "@babel/parser": "^7.0.0", - "@babel/template": "^7.0.0", - "@babel/traverse": "^7.0.0", - "@babel/types": "^7.0.0", - "istanbul-lib-coverage": "^2.0.4", + "@babel/generator": "^7.4.0", + "@babel/parser": "^7.4.3", + "@babel/template": "^7.4.0", + "@babel/traverse": "^7.4.3", + "@babel/types": "^7.4.0", + "istanbul-lib-coverage": "^2.0.5", "semver": "^6.0.0" } }, - "js-yaml": { - "version": "3.13.1", - "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.13.1.tgz", - "integrity": "sha512-YfbcO7jXDdyj0DGxYVSlSeQNHbD7XPWvrVWeVUujrQEoZzWJIRrCPoyk6kL6IAjAG2IolMK4T0hNUe0HOUs5Jw==", - "dev": true, - "requires": { - "argparse": "^1.0.7", - "esprima": "^4.0.0" - } - }, "make-dir": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz", @@ -7083,9 +7095,9 @@ "dev": true }, "semver": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.0.0.tgz", - "integrity": "sha512-0UewU+9rFapKFnlbirLi3byoOuhrSsli/z/ihNnvM24vgF+8sNBiI1LZPBSH9wJKUwaUbw+s3hToDLCXkrghrQ==", + "version": "6.3.0", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", + "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", "dev": true } } @@ -7144,9 +7156,9 @@ "dev": true }, "istanbul-lib-hook": { - "version": "2.0.6", - "resolved": "https://registry.npmjs.org/istanbul-lib-hook/-/istanbul-lib-hook-2.0.6.tgz", - "integrity": "sha512-829DKONApZ7UCiPXcOYWSgkFXa4+vNYoNOt3F+4uDJLKL1OotAoVwvThoEj1i8jmOj7odbYcR3rnaHu+QroaXg==", + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/istanbul-lib-hook/-/istanbul-lib-hook-2.0.7.tgz", + "integrity": "sha512-vrRztU9VRRFDyC+aklfLoeXyNdTfga2EI3udDGn4cZ6fpSXpHLV9X6CHvfoMCPtggg8zvDDmC4b9xfu0z6/llA==", "dev": true, "requires": { "append-transform": "^1.0.0" @@ -7168,20 +7180,20 @@ } }, "istanbul-lib-report": { - "version": "2.0.7", - "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-2.0.7.tgz", - "integrity": "sha512-wLH6beJBFbRBLiTlMOBxmb85cnVM1Vyl36N48e4e/aTKSM3WbOx7zbVIH1SQ537fhhsPbX0/C5JB4qsmyRXXyA==", + "version": "2.0.8", + "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-2.0.8.tgz", + "integrity": "sha512-fHBeG573EIihhAblwgxrSenp0Dby6tJMFR/HvlerBsrCTD5bkUuoNtn3gVh29ZCS824cGGBPn7Sg7cNk+2xUsQ==", "dev": true, "requires": { - "istanbul-lib-coverage": "^2.0.4", + "istanbul-lib-coverage": "^2.0.5", "make-dir": "^2.1.0", - "supports-color": "^6.0.0" + "supports-color": "^6.1.0" }, "dependencies": { "istanbul-lib-coverage": { - "version": "2.0.4", - "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz", - "integrity": "sha512-LXTBICkMARVgo579kWDm8SqfB6nvSDKNqIOBEjmJRnL04JvoMHCYGWaMddQnseJYtkEuEvO/sIcOxPLk9gERug==", + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.5.tgz", + "integrity": "sha512-8aXznuEPCJvGnMSRft4udDRDtb1V3pkQkMMI5LI+6HuQz5oQ4J2UFn1H82raA3qJtyOLkkwVqICBQkjnGtn5mA==", "dev": true }, "make-dir": { @@ -7218,15 +7230,15 @@ } }, "istanbul-lib-source-maps": { - "version": "3.0.5", - "resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-3.0.5.tgz", - "integrity": "sha512-eDhZ7r6r1d1zQPVZehLc3D0K14vRba/eBYkz3rw16DLOrrTzve9RmnkcwrrkWVgO1FL3EK5knujVe5S8QHE9xw==", + "version": "3.0.6", + "resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-3.0.6.tgz", + "integrity": "sha512-R47KzMtDJH6X4/YW9XTx+jrLnZnscW4VpNN+1PViSYTejLVPWv7oov+Duf8YQSPyVRUvueQqz1TcsC6mooZTXw==", "dev": true, "requires": { "debug": "^4.1.1", - "istanbul-lib-coverage": "^2.0.4", + "istanbul-lib-coverage": "^2.0.5", "make-dir": "^2.1.0", - "rimraf": "^2.6.2", + "rimraf": "^2.6.3", "source-map": "^0.6.1" }, "dependencies": { @@ -7240,9 +7252,9 @@ } }, "istanbul-lib-coverage": { - "version": "2.0.4", - "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz", - "integrity": "sha512-LXTBICkMARVgo579kWDm8SqfB6nvSDKNqIOBEjmJRnL04JvoMHCYGWaMddQnseJYtkEuEvO/sIcOxPLk9gERug==", + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.5.tgz", + "integrity": "sha512-8aXznuEPCJvGnMSRft4udDRDtb1V3pkQkMMI5LI+6HuQz5oQ4J2UFn1H82raA3qJtyOLkkwVqICBQkjnGtn5mA==", "dev": true }, "make-dir": { @@ -7256,9 +7268,9 @@ } }, "ms": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz", - "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==", + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", + "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", "dev": true }, "pify": { @@ -7267,6 +7279,15 @@ "integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==", "dev": true }, + "rimraf": { + "version": "2.6.3", + "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.3.tgz", + "integrity": "sha512-mwqeW5XsA2qAejG46gYdENaxXjx9onRNCfn7L0duuP4hCuTIi/QO7PDK07KJfp1d+izWPrzEJDcSqBa0OZQriA==", + "dev": true, + "requires": { + "glob": "^7.1.3" + } + }, "semver": { "version": "5.7.0", "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.0.tgz", @@ -7282,12 +7303,12 @@ } }, "istanbul-reports": { - "version": "2.2.3", - "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-2.2.3.tgz", - "integrity": "sha512-T6EbPuc8Cb620LWAYyZ4D8SSn06dY9i1+IgUX2lTH8gbwflMc9Obd33zHTyNX653ybjpamAHS9toKS3E6cGhTw==", + "version": "2.2.6", + "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-2.2.6.tgz", + "integrity": "sha512-SKi4rnMyLBKe0Jy2uUdx28h8oG7ph2PPuQPvIAh31d+Ci+lSiEu4C+h3oBPuJ9+mPKhOyW0M8gY4U5NM1WLeXA==", "dev": true, "requires": { - "handlebars": "^4.1.0" + "handlebars": "^4.1.2" } }, "jasmine": { @@ -7557,12 +7578,12 @@ } }, "karma-coverage-istanbul-reporter": { - "version": "2.0.5", - "resolved": "https://registry.npmjs.org/karma-coverage-istanbul-reporter/-/karma-coverage-istanbul-reporter-2.0.5.tgz", - "integrity": "sha512-yPvAlKtY3y+rKKWbOo0CzBMVTvJEeMOgbMXuVv3yWvS8YtYKC98AU9vFF0mVBZ2RP1E9SgS90+PT6Kf14P3S4w==", + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/karma-coverage-istanbul-reporter/-/karma-coverage-istanbul-reporter-2.1.0.tgz", + "integrity": "sha512-UH0mXPJFJyK5uiK7EkwGtQ8f30lCBAfqRResnZ4pzLJ04SOp4SPlYkmwbbZ6iVJ6sQFVzlDUXlntBEsLRdgZpg==", "dev": true, "requires": { - "istanbul-api": "^2.1.1", + "istanbul-api": "^2.1.6", "minimatch": "^3.0.4" } }, @@ -12369,7 +12390,7 @@ "dependencies": { "minimist": { "version": "1.2.0", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=", "dev": true }, @@ -12473,9 +12494,9 @@ "integrity": "sha512-0RNDbSdEokBeEAkgNbxJ+BLwSManFy9TeXz8uW+48j/xhEXv1ePME60olyzw2XzUqUBNAYFeJadIqAgNqIACwg==" }, "uglify-js": { - "version": "3.5.5", - "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.5.5.tgz", - "integrity": "sha512-e58FqZzPwaLODQetDQKlvErZaGkh1UmzP8YwU0aG65NLourKNtwVyDG8tkIyUU0vqWzxaikSvTaxrCSscmvqvQ==", + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.6.0.tgz", + "integrity": "sha512-W+jrUHJr3DXKhrsS7NUVxn3zqMOFn0hL/Ei6v0anCIMoKC93TjcflTagwIHLW7SfMFfiQuktQyFVCFHGUE0+yg==", "dev": true, "optional": true, "requires": { @@ -12483,13 +12504,6 @@ "source-map": "~0.6.1" }, "dependencies": { - "commander": { - "version": "2.20.0", - "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.0.tgz", - "integrity": "sha512-7j2y+40w61zy6YC2iRNpUe/NwhNyoXrYpHMrSunaMG64nRnaf96zO/KMQR4OyN/UnE5KLyEBnKHd4aG3rskjpQ==", - "dev": true, - "optional": true - }, "source-map": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", diff --git a/package.json b/package.json index 814665b0..d336072b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "fivethree", - "version": "0.8.21", + "version": "0.8.22", "author": "Fivethree Team", "homepage": "https://fivethree.io/", "description": "Fivethree Web Components", @@ -63,7 +63,6 @@ "cordova-plugin-splashscreen": "5.0.3", "cordova-plugin-whitelist": "1.3.4", "core-js": "2.6.5", - "hammerjs": "2.0.8", "intersection-observer": "0.5.1", "ng-lottie": "0.3.2", "ngx-markdown": "7.1.5", @@ -91,7 +90,7 @@ "jasmine-spec-reporter": "4.2.1", "karma": "4.1.0", "karma-chrome-launcher": "2.2.0", - "karma-coverage-istanbul-reporter": "2.0.5", + "karma-coverage-istanbul-reporter": "2.1.0", "karma-jasmine": "2.0.1", "karma-jasmine-html-reporter": "1.4.2", "ng-packagr": "5.3.0", diff --git a/projects/core/package.json b/projects/core/package.json index 03d81dd2..cb3e498e 100644 --- a/projects/core/package.json +++ b/projects/core/package.json @@ -1,6 +1,6 @@ { "name": "@fivethree/core", - "version": "0.8.21", + "version": "0.8.22", "description": "Fivethree Core Components", "keywords": [ "fivethree", @@ -22,7 +22,6 @@ "@angular/platform-browser": ">=7.2.1", "@angular/router": ">=7.2.1", "@ionic/angular": "^4.0.0", - "hammerjs": "^2.0.8", "rxjs": ">=6.4.0" }, "author": "Fivethree Team", diff --git a/projects/core/src/lib/bottom-sheet/bottom-sheet-content/bottom-sheet-content.component.html b/projects/core/src/lib/bottom-sheet/bottom-sheet-content/bottom-sheet-content.component.html index a9c7d87e..b9cc4f52 100644 --- a/projects/core/src/lib/bottom-sheet/bottom-sheet-content/bottom-sheet-content.component.html +++ b/projects/core/src/lib/bottom-sheet/bottom-sheet-content/bottom-sheet-content.component.html @@ -1,12 +1,12 @@
- +
- - - -
-
- - + + + + + + \ No newline at end of file diff --git a/projects/core/src/lib/bottom-sheet/bottom-sheet-content/bottom-sheet-content.component.scss b/projects/core/src/lib/bottom-sheet/bottom-sheet-content/bottom-sheet-content.component.scss index 544c36e1..06f56181 100644 --- a/projects/core/src/lib/bottom-sheet/bottom-sheet-content/bottom-sheet-content.component.scss +++ b/projects/core/src/lib/bottom-sheet/bottom-sheet-content/bottom-sheet-content.component.scss @@ -24,6 +24,6 @@ position: absolute; } -.content.margin { - margin-top: 24px; +.content { + height: 100%; } diff --git a/projects/core/src/lib/bottom-sheet/bottom-sheet-content/bottom-sheet-content.component.ts b/projects/core/src/lib/bottom-sheet/bottom-sheet-content/bottom-sheet-content.component.ts index 2dd054e9..5e54c475 100644 --- a/projects/core/src/lib/bottom-sheet/bottom-sheet-content/bottom-sheet-content.component.ts +++ b/projects/core/src/lib/bottom-sheet/bottom-sheet-content/bottom-sheet-content.component.ts @@ -1,3 +1,4 @@ +import { IonContent } from '@ionic/angular'; import { DomSanitizer, SafeStyle } from '@angular/platform-browser'; import { Component, @@ -5,7 +6,9 @@ import { Input, HostBinding, EventEmitter, - Output + Output, + ViewChild, + AfterViewInit } from '@angular/core'; import { DrawerState } from '../drawer-state'; @@ -14,15 +17,19 @@ import { DrawerState } from '../drawer-state'; templateUrl: './bottom-sheet-content.component.html', styleUrls: ['./bottom-sheet-content.component.scss'] }) -export class FivBottomSheetContent implements OnInit { +export class FivBottomSheetContent implements OnInit, AfterViewInit { @Input() rounded = true; @Input() handle = true; @Input() float = true; - @Output() fivHandleClick: EventEmitter = new EventEmitter(); + @Output() fivClick: EventEmitter = new EventEmitter(); + + @ViewChild(IonContent) content: IonContent; currentState: DrawerState; states = DrawerState; + shouldBounce = true; + panning: boolean = false; @HostBinding('class.rounded') get isRounded(): boolean { switch (this.currentState) { @@ -48,11 +55,15 @@ export class FivBottomSheetContent implements OnInit { ngOnInit() {} + ngAfterViewInit(): void { + this.content.scrollEvents = true; + } + updateState(state: DrawerState): any { this.currentState = state; } click() { - this.fivHandleClick.emit(); + this.fivClick.emit(); } } diff --git a/projects/core/src/lib/bottom-sheet/bottom-sheet.component.ts b/projects/core/src/lib/bottom-sheet/bottom-sheet.component.ts index 3e630533..75bfac70 100644 --- a/projects/core/src/lib/bottom-sheet/bottom-sheet.component.ts +++ b/projects/core/src/lib/bottom-sheet/bottom-sheet.component.ts @@ -9,29 +9,53 @@ import { ElementRef, Renderer2, SimpleChanges, - ContentChild + ContentChild, + OnDestroy } from '@angular/core'; import { DomController, Platform } from '@ionic/angular'; -import * as Hammer from 'hammerjs'; import { DrawerState } from './drawer-state'; +import { merge, Subject, fromEvent, from } from 'rxjs'; +import { + takeUntil, + map, + tap, + flatMap, + repeat, + withLatestFrom, + filter, + first, + take, + repeatWhen, + skipWhile +} from 'rxjs/operators'; + +export interface PanEvent { + currentOffset: number; + startOffset: number; + currentTop: number; + startTop: number; + distance: number; + touch: TouchEvent; +} @Component({ selector: 'fiv-bottom-sheet', templateUrl: './bottom-sheet.component.html', styleUrls: ['./bottom-sheet.component.scss'] }) -export class FivBottomSheet implements AfterViewInit, OnChanges { +export class FivBottomSheet implements AfterViewInit, OnChanges, OnDestroy { @Input() dockedHeight = 80; @Input() shouldBounce = true; @Input() distanceTop = 56; - @Input() transition = '0.25s ease-in-out'; + @Input() transition = '0.25s'; @Input() state: DrawerState = DrawerState.Bottom; - @Input() minimumHeight = 24; + @Input() bounceThreshold = 40; + @Input() panThreshold = 20; @Input() panEnabled = true; @@ -51,7 +75,10 @@ export class FivBottomSheet implements AfterViewInit, OnChanges { @ContentChild(FivBottomSheetContent) content: FivBottomSheetContent; private _startPositionTop: number; - private readonly _BOUNCE_DELTA = 30; + _startPositionOffset: number; + scrollTop = 0; + + $onDestroy = new Subject(); constructor( private _element: ElementRef, @@ -60,48 +87,100 @@ export class FivBottomSheet implements AfterViewInit, OnChanges { private _platform: Platform ) {} - // @HostBinding('style') get styles() { - // if (this.rounded) { - // return this.sanitizer - // .bypassSecurityTrustStyle(' border-top-left-radius: 12px; border-top-right-radius: 12px;'); - // } - - // } + ngOnDestroy(): void { + this.$onDestroy.next(); + } ngAfterViewInit() { - // this._renderer. - // setStyle(this._element.nativeElement.querySelector('.fiv-bottom-drawer-scrollable-content .scroll-y'), 'touch-action', 'none'); this._setDrawerState(this.state); + this.content.shouldBounce = this.shouldBounce; - const hammer = new Hammer(this._element.nativeElement); - hammer - .get('pan') - .set({ enable: true, direction: Hammer.DIRECTION_VERTICAL }); - hammer.on('pan panstart panend', (ev: any) => { - if (!this.panEnabled) { - return; + const touchmove = fromEvent( + this._element.nativeElement, + 'touchmove', + { + passive: true } + ); + const touchend = merge( + fromEvent(this._element.nativeElement, 'touchend', { + passive: true + }), + fromEvent(this._element.nativeElement, 'touchcancel', { + passive: true + }) + ); - switch (ev.type) { - case 'panstart': - this._handlePanStart(); - break; - case 'panend': - this._handlePanEnd(ev); - break; - default: - this._handlePan(ev); - } - }); + const getScrollContent = from(this.content.content.getScrollElement()); - this.content.fivHandleClick.subscribe(() => { - switch (this.state) { - case DrawerState.Bottom: - return this.dock(); - case DrawerState.Docked: - return this.open(); - } - }); + const scroll = this.content.content.ionScroll.pipe( + tap(el => (this.scrollTop = el.detail.scrollTop)), + takeUntil(this.$onDestroy) + ); + scroll.subscribe(); + + this.content.content.ionScrollEnd + .pipe( + filter(el => this.scrollTop === 0 && this.state === DrawerState.Top), + tap(() => this.content.content.scrollByPoint(0, 1, 0)), + takeUntil(this.$onDestroy) + ) + .subscribe(); + + const canStart = touchmove.pipe(filter(() => this.scrollTop === 0)); + + const start = canStart.pipe( + take(1), + tap((s: TouchEvent) => this._handlePanStart(s)) + ); + + const pan = start.pipe( + filter(() => this.panEnabled), + flatMap(() => touchmove), + map((tm: TouchEvent) => this.calculatePanEvent(tm)) + ); + + const handlePan = pan.pipe( + filter(p => Math.abs(p.distance) > this.panThreshold), + map(tm => this._handlePan(tm)), + takeUntil(touchend), + repeat(), + takeUntil(this.$onDestroy) + ); + + const handleBackPan = pan + .pipe( + filter( + p => Math.abs(p.distance) <= this.panThreshold && this.content.panning + ), + map(tm => this._handlePan(tm)), + takeUntil(touchend), + repeat(), + takeUntil(this.$onDestroy) + ) + .subscribe(); + + handlePan + .pipe( + first(), + tap(() => (this.content.panning = true)), + repeatWhen(() => touchend), + takeUntil(this.$onDestroy) + ) + .subscribe(); + + handlePan + .pipe( + flatMap(() => touchend), + first(), + withLatestFrom(pan), + tap(() => this.content.content.scrollByPoint(0, 1, 0)), + tap(() => (this.content.panning = false)), + map(ev => ev[1]), + repeat(), + takeUntil(this.$onDestroy) + ) + .subscribe(ev => this._handlePanEnd(ev)); } ngOnChanges(changes: SimpleChanges) { @@ -126,9 +205,11 @@ export class FivBottomSheet implements AfterViewInit, OnChanges { ); switch (state) { case DrawerState.Bottom: - this._setTranslateY('calc(100vh - ' + this.minimumHeight + 'px)'); + this.content.content.scrollToTop(0); + this._setTranslateY('100vh'); break; case DrawerState.Docked: + this.content.content.scrollToTop(0); this._setTranslateY(this._platform.height() - this.dockedHeight + 'px'); break; default: @@ -136,12 +217,17 @@ export class FivBottomSheet implements AfterViewInit, OnChanges { } } - private _handlePanStart() { - this._startPositionTop = this._element.nativeElement.getBoundingClientRect().top; + private _handlePanStart(event: TouchEvent) { + this._startPositionTop = this.getCurrentTop(); + this._startPositionOffset = event.touches[0].pageY; } - private _handlePanEnd(ev) { - if (this.shouldBounce && ev.isFinal) { + getCurrentTop() { + return this._element.nativeElement.getBoundingClientRect().top; + } + + private _handlePanEnd(ev: PanEvent) { + if (this.shouldBounce) { this._renderer.setStyle( this._element.nativeElement, 'transition', @@ -162,32 +248,25 @@ export class FivBottomSheet implements AfterViewInit, OnChanges { this.stateChange.emit(this.state); } - private _handleTopPanEnd(ev) { - if (ev.deltaY > this._BOUNCE_DELTA) { - if (this.minimumHeight === this.dockedHeight) { - if (this.state !== DrawerState.Bottom) { - this.state = DrawerState.Bottom; - this.fivClose.emit(this); - } - } else { - if (this.state !== DrawerState.Docked) { - this.state = DrawerState.Docked; - this.fivDocked.emit(this); - } + private _handleTopPanEnd(ev: PanEvent) { + if (ev.distance > this.bounceThreshold) { + if (this.state !== DrawerState.Docked) { + this.state = DrawerState.Docked; + this.fivDocked.emit(this); } } else { this._setTranslateY(this.distanceTop + 'px'); } } - private _handleDockedPanEnd(ev) { - const absDeltaY = Math.abs(ev.deltaY); - if (absDeltaY > this._BOUNCE_DELTA && ev.deltaY < 0) { + private _handleDockedPanEnd(ev: PanEvent) { + const absDeltaY = Math.abs(ev.distance); + if (absDeltaY > this.bounceThreshold && ev.distance < 0) { if (this.state !== DrawerState.Top) { this.state = DrawerState.Top; this.fivOpen.emit(); } - } else if (absDeltaY > this._BOUNCE_DELTA && ev.deltaY > 0) { + } else if (absDeltaY > this.bounceThreshold && ev.distance > 0) { if (this.state !== DrawerState.Bottom) { this.state = DrawerState.Bottom; this.fivClose.emit(); @@ -197,34 +276,39 @@ export class FivBottomSheet implements AfterViewInit, OnChanges { } } - private _handleBottomPanEnd(ev) { - if (-ev.deltaY > this._BOUNCE_DELTA) { + private _handleBottomPanEnd(ev: PanEvent) { + if (-ev.distance > this.bounceThreshold) { if (this.state !== DrawerState.Docked) { this.state = DrawerState.Docked; this.fivDocked.emit(); } } else { - this._setTranslateY('calc(100vh - ' + this.minimumHeight + 'px)'); + this._setTranslateY('100vh'); } } - private _handlePan(ev) { - const pointerY = ev.center.y; + calculatePanEvent(ev: TouchEvent): PanEvent { + return { + currentOffset: ev.touches[0].pageY, + startOffset: this._startPositionOffset, + startTop: this._startPositionTop, + currentTop: this.getCurrentTop(), + distance: ev.touches[0].pageY - this._startPositionOffset, + touch: ev + }; + } + + private _handlePan(event: PanEvent) { this._renderer.setStyle(this._element.nativeElement, 'transition', 'none'); - if (pointerY > 0 && pointerY < this._platform.height()) { - if (ev.additionalEvent === 'panup' || ev.additionalEvent === 'pandown') { - const newTop = this._startPositionTop + ev.deltaY; - if (newTop >= this.distanceTop) { - this._setTranslateY(newTop + 'px'); - } else if (newTop < this.distanceTop) { - this._setTranslateY(this.distanceTop + 'px'); - } - if (newTop > this._platform.height() - this.minimumHeight) { - this._setTranslateY( - this._platform.height() - this.minimumHeight + 'px' - ); - } + if (event.currentTop >= 0 && event.currentTop <= this._platform.height()) { + const newTop = this._startPositionTop + event.distance; + if (newTop >= this.distanceTop) { + this._setTranslateY(newTop + 'px'); + } else if (newTop <= this.distanceTop && this.content.panning) { + this._setTranslateY(this.distanceTop + 'px'); + this.content.content.scrollToPoint(0, 0 - newTop, 0); } + return event; } } diff --git a/projects/core/src/lib/bottom-sheet/bottom-sheet.module.ts b/projects/core/src/lib/bottom-sheet/bottom-sheet.module.ts index 2ac88d28..f720d082 100644 --- a/projects/core/src/lib/bottom-sheet/bottom-sheet.module.ts +++ b/projects/core/src/lib/bottom-sheet/bottom-sheet.module.ts @@ -1,3 +1,4 @@ +import { IonicModule } from '@ionic/angular'; import { FivBottomSheetContent } from './bottom-sheet-content/bottom-sheet-content.component'; import { FivBottomSheet } from './bottom-sheet.component'; import { NgModule } from '@angular/core'; @@ -6,7 +7,7 @@ import { FivCenterModule } from '../center/center.module'; @NgModule({ declarations: [FivBottomSheet, FivBottomSheetContent], - imports: [CommonModule, FivCenterModule], + imports: [CommonModule, FivCenterModule, IonicModule], exports: [FivBottomSheet, FivBottomSheetContent] }) export class FivBottomSheetModule {} diff --git a/projects/core/src/lib/fivethree.core.module.ts b/projects/core/src/lib/fivethree.core.module.ts index d11897ec..db409744 100644 --- a/projects/core/src/lib/fivethree.core.module.ts +++ b/projects/core/src/lib/fivethree.core.module.ts @@ -7,7 +7,6 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { IonicModule } from '@ionic/angular'; import { HammerGestureConfig } from '@angular/platform-browser'; -import { Hammer } from 'hammerjs'; import { FivPasswordInputModule } from './password-input/password-input.module'; import { FivExpandableModule } from './expandable/expandable.module'; import { FivStepperModule } from './stepper/stepper.module'; @@ -35,12 +34,6 @@ import { FivLazyImageModule } from './lazy-image/lazy-image.module'; import { FivFeatureDiscoveryModule } from './feature-discovery/feature-discovery.module'; import { FivSearchbarModule } from './searchbar/searchbar.module'; -export class MyHammerConfig extends HammerGestureConfig { - overrides = { - pan: { direction: Hammer.DIRECTION_VERTICAL, threshold: 3 } - }; -} - const componentModules = [ FivAppBarModule, FivBackButtonModule, diff --git a/src/app/pages/bottom-sheet/bottom-sheet.module.ts b/src/app/pages/bottom-sheet/bottom-sheet.module.ts index 6b61c03d..2c9dcd17 100644 --- a/src/app/pages/bottom-sheet/bottom-sheet.module.ts +++ b/src/app/pages/bottom-sheet/bottom-sheet.module.ts @@ -8,7 +8,7 @@ import { Routes, RouterModule } from '@angular/router'; import { IonicModule } from '@ionic/angular'; import { BottomSheetPage } from './bottom-sheet.page'; -import { FivBottomSheetModule } from '@fivethree/core'; +import { FivBottomSheetModule, FivIconModule } from '@fivethree/core'; const routes: Routes = [ { @@ -24,6 +24,7 @@ const routes: Routes = [ IonicModule, RouterModule.forChild(routes), FivBottomSheetModule, + FivIconModule, ComponentsModule, FivIfModule ], diff --git a/src/app/pages/bottom-sheet/bottom-sheet.page.html b/src/app/pages/bottom-sheet/bottom-sheet.page.html index d0377859..2fe07f7a 100644 --- a/src/app/pages/bottom-sheet/bottom-sheet.page.html +++ b/src/app/pages/bottom-sheet/bottom-sheet.page.html @@ -5,9 +5,10 @@ - + @@ -36,11 +37,6 @@ Top Distance - - Minimum Height - - - Bottom Sheet Content @@ -59,10 +55,11 @@ - - + this component only works on mobile. @@ -72,10 +69,144 @@ - + + + Bottom Sheet + + + Do Action + + + + +
+ + + Awesome Flex + Awesome Title + + + Awesome content + + +
+ + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + + + + Label + + + Label + +
+
\ No newline at end of file diff --git a/src/app/pages/bottom-sheet/bottom-sheet.page.scss b/src/app/pages/bottom-sheet/bottom-sheet.page.scss index b7a6e00d..211cc607 100644 --- a/src/app/pages/bottom-sheet/bottom-sheet.page.scss +++ b/src/app/pages/bottom-sheet/bottom-sheet.page.scss @@ -2,3 +2,12 @@ border-top: 0.5px solid #e5e5e5; padding: 10px; } + +.flex-scroll { + display: flex; + overflow-x: scroll; + width: 100%; + ion-card { + flex: 1 0 auto; + } +} diff --git a/src/app/pages/bottom-sheet/bottom-sheet.page.ts b/src/app/pages/bottom-sheet/bottom-sheet.page.ts index f20d61c1..5f363d97 100644 --- a/src/app/pages/bottom-sheet/bottom-sheet.page.ts +++ b/src/app/pages/bottom-sheet/bottom-sheet.page.ts @@ -8,11 +8,10 @@ import { DrawerState } from '@fivethree/core'; }) export class BottomSheetPage implements OnInit { shouldBounce = true; - dockedHeight = 170; - distanceTop = 56; + dockedHeight = 204; + distanceTop = 0; drawerState = DrawerState.Docked; states = DrawerState; - minimumHeight = 24; handle = true; float = true; diff --git a/src/assets/docs/installation/installation.md b/src/assets/docs/installation/installation.md index dac88f9d..73844a29 100644 --- a/src/assets/docs/installation/installation.md +++ b/src/assets/docs/installation/installation.md @@ -6,7 +6,7 @@ To get started, install the package from npm. The latest version supports Ionic You can use either npm or yarn to install `@fivethree/core` from npm. ```bash -npm install --save @fivethree/core @angular/animations hammerjs +npm install --save @fivethree/core @angular/animations ``` ## Step 2. Configure your Ionic App diff --git a/src/assets/gif/bottom-sheet.gif b/src/assets/gif/bottom-sheet.gif deleted file mode 100644 index 6ae85311..00000000 Binary files a/src/assets/gif/bottom-sheet.gif and /dev/null differ diff --git a/src/assets/gif/bottomsheet.gif b/src/assets/gif/bottomsheet.gif new file mode 100644 index 00000000..017851f9 Binary files /dev/null and b/src/assets/gif/bottomsheet.gif differ diff --git a/src/assets/gif/dialog.gif b/src/assets/gif/dialog.gif index 3d7fd689..3b325fc6 100644 Binary files a/src/assets/gif/dialog.gif and b/src/assets/gif/dialog.gif differ diff --git a/src/assets/gif/feature-discovery.gif b/src/assets/gif/feature-discovery.gif deleted file mode 100644 index 1c217c7b..00000000 Binary files a/src/assets/gif/feature-discovery.gif and /dev/null differ diff --git a/src/assets/gif/feature.gif b/src/assets/gif/feature.gif new file mode 100644 index 00000000..021b8b5a Binary files /dev/null and b/src/assets/gif/feature.gif differ diff --git a/src/assets/gif/gallery.gif b/src/assets/gif/gallery.gif index 4850e928..5e0ac55e 100644 Binary files a/src/assets/gif/gallery.gif and b/src/assets/gif/gallery.gif differ diff --git a/src/assets/gif/pulltorefresh.gif b/src/assets/gif/pulltorefresh.gif index 58f75dd5..328ed83c 100644 Binary files a/src/assets/gif/pulltorefresh.gif and b/src/assets/gif/pulltorefresh.gif differ diff --git a/src/main.ts b/src/main.ts index 009f200e..5aa3bf02 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,4 +1,3 @@ -import 'hammerjs'; import { enableProdMode } from '@angular/core'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; diff --git a/tsconfig.json b/tsconfig.json index 48f36e6a..a175f9de 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -18,9 +18,7 @@ "@services/*": ["src/app/services/*"], "@pipes/*": ["src/app/pipes/*"], "@components/*": ["src/app/components/*"], - "@fivethree/core": ["projects/core/src/public_api"], - "@fivethree/google-maps": ["dist/@fivethree/google-maps"], - "shared": ["projects/core/src/public_api"] + "@fivethree/core": ["projects/core/src/public_api"] } } }