From ff756d17b30f09d3f381e99fe70ba4853d00174b Mon Sep 17 00:00:00 2001 From: DIonysos Dajka Date: Wed, 21 Aug 2019 18:09:18 +0200 Subject: [PATCH] fix: Update popper.js for better PopOver positioning --- package.json | 207 ++++++++++++++++++++++--------------------- src/PopOver/index.js | 2 + yarn.lock | 30 +++---- 3 files changed, 121 insertions(+), 118 deletions(-) diff --git a/package.json b/package.json index 9e9b5ac5..d14ecfd0 100644 --- a/package.json +++ b/package.json @@ -1,105 +1,106 @@ { - "name": "base5-ui", - "version": "3.7.0", - "description": "5app's reusable UI component library", - "main": "index.js", - "scripts": { - "build-icons": "pixo src-icons/svg --out-dir src/icons --template src-icons/template.js", - "compile": "babel src --out-dir dist", - "copypackage": "cp -rf package.json README.md dist", - "predist": "npm run copypackage", - "dist": "cd dist && npm publish", - "docz:dev": "docz dev", - "docz:build": "docz build", - "deploy-docs": "npm run docz:build && gh-pages -d .docz/dist -m 'Update docs [skip ci]'", - "lint": "eslint ./", - "postversion": "pwd && cp -r package.json ../", - "semantic-release": "semantic-release", - "test": "jest /src && npm run lint", - "test:cover": "jest /src --coverage && npm run lint" - }, - "repository": { - "type": "git", - "url": "git+https://github.com/5app/base5-ui.git" - }, - "author": "Dionysos Dajka", - "license": "MIT", - "bugs": { - "url": "https://github.com/5app/base5-ui/issues" - }, - "homepage": "https://github.com/5app/base5-ui#readme", - "devDependencies": { - "@babel/cli": "^7.4.4", - "@babel/core": "^7.4.5", - "@babel/plugin-proposal-object-rest-spread": "^7.4.4", - "@babel/plugin-transform-react-jsx": "^7.3.0", - "@babel/preset-env": "^7.4.5", - "@semantic-release/changelog": "3.0.4", - "@semantic-release/git": "7.0.14", - "@testing-library/react": "8.0.4", - "babel-eslint": "^10.0.2", - "babel-plugin-styled-components": "^1.10.2", - "docz": "^1.2.0", - "docz-theme-default": "^1.2.0", - "eslint": "^6.1.0", - "eslint-config-5app": "^0.6.4", - "eslint-config-prettier": "^6.0.0", - "eslint-plugin-import": "^2.18.0", - "eslint-plugin-jsx-a11y": "^6.2.1", - "eslint-plugin-prettier": "^3.1.0", - "eslint-plugin-react": "^7.14.2", - "eslint-plugin-react-hooks": "^1.6.1", - "gh-pages": "2.0.1", - "jest": "23.1.0", - "jest-dom": "3.5.0", - "pixo": "^1.1.2", - "prettier": "^1.18.2", - "prop-types": "15.7.2", - "react": "16.8.6", - "react-dom": "16.8.6", - "semantic-release": "^15.13.12", - "styled-components": "4.3.2" - }, - "peerDependencies": { - "react": "16.8.6", - "styled-components": "4.3.2" - }, - "dependencies": { - "chartist": "^0.11.3", - "chroma-js": "^2.0.4", - "classnames": "^2.2.6", - "focus-visible": "^4.1.5", - "prop-types": "15.7.2", - "react-hook-size": "1.3.0", - "react-popper": "1.3.3" - }, - "release": { - "branch": "master", - "prepare": [ - "@semantic-release/changelog", - { - "path": "@semantic-release/npm", - "pkgRoot": "dist" - }, - { - "path": "@semantic-release/git", - "assets": [ - "package.json", - "CHANGELOG.md" - ], - "message": "chore(release): ${nextRelease.version} [skip ci]\n\n${nextRelease.notes}" - } - ], - "plugins": [ - "@semantic-release/commit-analyzer", - "@semantic-release/release-notes-generator", - [ - "@semantic-release/npm", - { - "pkgRoot": "dist" - } - ], - "@semantic-release/github" - ] - } + "name": "base5-ui", + "version": "3.7.0", + "description": "5app's reusable UI component library", + "main": "index.js", + "scripts": { + "build-icons": "pixo src-icons/svg --out-dir src/icons --template src-icons/template.js", + "compile": "babel src --out-dir dist", + "copypackage": "cp -rf package.json README.md dist", + "predist": "npm run copypackage", + "dist": "cd dist && npm publish", + "docz:dev": "docz dev", + "docz:build": "docz build", + "deploy-docs": "npm run docz:build && gh-pages -d .docz/dist -m 'Update docs [skip ci]'", + "lint": "eslint ./", + "postversion": "pwd && cp -r package.json ../", + "semantic-release": "semantic-release", + "test": "jest /src && npm run lint", + "test:cover": "jest /src --coverage && npm run lint" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/5app/base5-ui.git" + }, + "author": "Dionysos Dajka", + "license": "MIT", + "bugs": { + "url": "https://github.com/5app/base5-ui/issues" + }, + "homepage": "https://github.com/5app/base5-ui#readme", + "devDependencies": { + "@babel/cli": "^7.4.4", + "@babel/core": "^7.4.5", + "@babel/plugin-proposal-object-rest-spread": "^7.4.4", + "@babel/plugin-transform-react-jsx": "^7.3.0", + "@babel/preset-env": "^7.4.5", + "@semantic-release/changelog": "3.0.4", + "@semantic-release/git": "7.0.14", + "@testing-library/react": "8.0.4", + "babel-eslint": "^10.0.2", + "babel-plugin-styled-components": "^1.10.2", + "docz": "^1.2.0", + "docz-theme-default": "^1.2.0", + "eslint": "^6.1.0", + "eslint-config-5app": "^0.6.4", + "eslint-config-prettier": "^6.0.0", + "eslint-plugin-import": "^2.18.0", + "eslint-plugin-jsx-a11y": "^6.2.1", + "eslint-plugin-prettier": "^3.1.0", + "eslint-plugin-react": "^7.14.2", + "eslint-plugin-react-hooks": "^1.6.1", + "gh-pages": "2.0.1", + "jest": "23.1.0", + "jest-dom": "3.5.0", + "pixo": "^1.1.2", + "prettier": "^1.18.2", + "prop-types": "15.7.2", + "react": "16.8.6", + "react-dom": "16.8.6", + "semantic-release": "^15.13.12", + "styled-components": "4.3.2" + }, + "peerDependencies": { + "react": "16.8.6", + "styled-components": "4.3.2" + }, + "dependencies": { + "chartist": "^0.11.3", + "chroma-js": "^2.0.4", + "classnames": "^2.2.6", + "focus-visible": "^4.1.5", + "popper.js": "^1.15.0", + "prop-types": "15.7.2", + "react-hook-size": "1.3.0", + "react-popper": "1.3.4" + }, + "release": { + "branch": "master", + "prepare": [ + "@semantic-release/changelog", + { + "path": "@semantic-release/npm", + "pkgRoot": "dist" + }, + { + "path": "@semantic-release/git", + "assets": [ + "package.json", + "CHANGELOG.md" + ], + "message": "chore(release): ${nextRelease.version} [skip ci]\n\n${nextRelease.notes}" + } + ], + "plugins": [ + "@semantic-release/commit-analyzer", + "@semantic-release/release-notes-generator", + [ + "@semantic-release/npm", + { + "pkgRoot": "dist" + } + ], + "@semantic-release/github" + ] + } } diff --git a/src/PopOver/index.js b/src/PopOver/index.js index 1aeac28b..32100f23 100644 --- a/src/PopOver/index.js +++ b/src/PopOver/index.js @@ -32,6 +32,7 @@ function PopOver(props) { modifiers={{ offset: {offset: `${offset}, ${autoDistance}`}, computeStyle: {gpuAcceleration: false}, + flip: {flipVariations: true, flipVariationsByContent: true}, }} > {({ref, style, placement, arrowProps, scheduleUpdate}) => { @@ -83,6 +84,7 @@ function DefaultPopover({ color: 'white', borderRadius: '3px', padding: '5px 10px', + maxWidth: '100%', ...style, }} > diff --git a/yarn.lock b/yarn.lock index 9b0bc34f..523ec9ef 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3705,14 +3705,6 @@ create-hmac@^1.1.0, create-hmac@^1.1.2, create-hmac@^1.1.4: safe-buffer "^5.0.1" sha.js "^2.4.8" -create-react-context@<=0.2.2: - version "0.2.2" - resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.2.2.tgz#9836542f9aaa22868cd7d4a6f82667df38019dca" - integrity sha512-KkpaLARMhsTsgp0d2NA/R94F/eDLbhXERdIq3LvX2biCAXcDvHYoOqHfWCHf1+OLj+HKBotLG3KqaOOf+C1C+A== - dependencies: - fbjs "^0.8.0" - gud "^1.0.0" - create-react-context@^0.2.1, create-react-context@^0.2.3: version "0.2.3" resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.2.3.tgz#9ec140a6914a22ef04b8b09b7771de89567cb6f3" @@ -3721,6 +3713,14 @@ create-react-context@^0.2.1, create-react-context@^0.2.3: fbjs "^0.8.0" gud "^1.0.0" +create-react-context@^0.3.0: + version "0.3.0" + resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.3.0.tgz#546dede9dc422def0d3fc2fe03afe0bc0f4f7d8c" + integrity sha512-dNldIoSuNSvlTJ7slIKC/ZFGKexBMBrrcc+TTe1NdmROnaASuLPvqpwj9v4XS4uXZ8+YPu0sNmShX2rXI5LNsw== + dependencies: + gud "^1.0.0" + warning "^4.0.3" + cross-spawn@6.0.5, cross-spawn@^6.0.0, cross-spawn@^6.0.5: version "6.0.5" resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-6.0.5.tgz#4a5ec7c64dfae22c3a14124dbacdee846d80cbc4" @@ -9991,7 +9991,7 @@ polished@^3.3.0: dependencies: "@babel/runtime" "^7.4.5" -popper.js@^1.14.4, popper.js@^1.14.7: +popper.js@^1.14.4, popper.js@^1.14.7, popper.js@^1.15.0: version "1.15.0" resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.15.0.tgz#5560b99bbad7647e9faa475c6b8056621f5a4ff2" integrity sha512-w010cY1oCUmI+9KwwlWki+r5jxKfTFDVoadl7MSrIujHU5MJ5OR6HTDj6Xo8aoR/QsA56x8jKjA59qGH4ELtrA== @@ -10489,13 +10489,13 @@ react-perfect-scrollbar@^1.5.0: perfect-scrollbar "^1.4.0" prop-types "^15.6.1" -react-popper@1.3.3: - version "1.3.3" - resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-1.3.3.tgz#2c6cef7515a991256b4f0536cd4bdcb58a7b6af6" - integrity sha512-ynMZBPkXONPc5K4P5yFWgZx5JGAUIP3pGGLNs58cfAPgK67olx7fmLp+AdpZ0+GoQ+ieFDa/z4cdV6u7sioH6w== +react-popper@1.3.4: + version "1.3.4" + resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-1.3.4.tgz#f0cd3b0d30378e1f663b0d79bcc8614221652ced" + integrity sha512-9AcQB29V+WrBKk6X7p0eojd1f25/oJajVdMZkywIoAV6Ag7hzE1Mhyeup2Q1QnvFRtGQFQvtqfhlEoDAPfKAVA== dependencies: "@babel/runtime" "^7.1.2" - create-react-context "<=0.2.2" + create-react-context "^0.3.0" popper.js "^1.14.4" prop-types "^15.6.1" typed-styles "^0.0.7" @@ -13116,7 +13116,7 @@ warning@^3.0.0: dependencies: loose-envify "^1.0.0" -warning@^4.0.2: +warning@^4.0.2, warning@^4.0.3: version "4.0.3" resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3" integrity sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==