123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185 |
- "use strict";
- Object.defineProperty(exports, "__esModule", {
- value: true
- });
- exports.default = getPlacements;
- exports.getOverflowOptions = getOverflowOptions;
- var _placementArrow = require("../style/placementArrow");
- function getOverflowOptions(placement, arrowOffset, arrowWidth, autoAdjustOverflow) {
- if (autoAdjustOverflow === false) {
- return {
- adjustX: false,
- adjustY: false
- };
- }
- const overflow = autoAdjustOverflow && typeof autoAdjustOverflow === 'object' ? autoAdjustOverflow : {};
- const baseOverflow = {};
- switch (placement) {
- case 'top':
- case 'bottom':
- baseOverflow.shiftX = arrowOffset.arrowOffsetHorizontal * 2 + arrowWidth;
- baseOverflow.shiftY = true;
- baseOverflow.adjustY = true;
- break;
- case 'left':
- case 'right':
- baseOverflow.shiftY = arrowOffset.arrowOffsetVertical * 2 + arrowWidth;
- baseOverflow.shiftX = true;
- baseOverflow.adjustX = true;
- break;
- }
- const mergedOverflow = Object.assign(Object.assign({}, baseOverflow), overflow);
- // Support auto shift
- if (!mergedOverflow.shiftX) {
- mergedOverflow.adjustX = true;
- }
- if (!mergedOverflow.shiftY) {
- mergedOverflow.adjustY = true;
- }
- return mergedOverflow;
- }
- const PlacementAlignMap = {
- left: {
- points: ['cr', 'cl']
- },
- right: {
- points: ['cl', 'cr']
- },
- top: {
- points: ['bc', 'tc']
- },
- bottom: {
- points: ['tc', 'bc']
- },
- topLeft: {
- points: ['bl', 'tl']
- },
- leftTop: {
- points: ['tr', 'tl']
- },
- topRight: {
- points: ['br', 'tr']
- },
- rightTop: {
- points: ['tl', 'tr']
- },
- bottomRight: {
- points: ['tr', 'br']
- },
- rightBottom: {
- points: ['bl', 'br']
- },
- bottomLeft: {
- points: ['tl', 'bl']
- },
- leftBottom: {
- points: ['br', 'bl']
- }
- };
- const ArrowCenterPlacementAlignMap = {
- topLeft: {
- points: ['bl', 'tc']
- },
- leftTop: {
- points: ['tr', 'cl']
- },
- topRight: {
- points: ['br', 'tc']
- },
- rightTop: {
- points: ['tl', 'cr']
- },
- bottomRight: {
- points: ['tr', 'bc']
- },
- rightBottom: {
- points: ['bl', 'cr']
- },
- bottomLeft: {
- points: ['tl', 'bc']
- },
- leftBottom: {
- points: ['br', 'cl']
- }
- };
- const DisableAutoArrowList = new Set(['topLeft', 'topRight', 'bottomLeft', 'bottomRight', 'leftTop', 'leftBottom', 'rightTop', 'rightBottom']);
- function getPlacements(config) {
- const {
- arrowWidth,
- autoAdjustOverflow,
- arrowPointAtCenter,
- offset,
- borderRadius,
- visibleFirst
- } = config;
- const halfArrowWidth = arrowWidth / 2;
- const placementMap = {};
- // Dynamic offset
- const arrowOffset = (0, _placementArrow.getArrowOffsetToken)({
- contentRadius: borderRadius,
- limitVerticalRadius: true
- });
- Object.keys(PlacementAlignMap).forEach(key => {
- const template = arrowPointAtCenter && ArrowCenterPlacementAlignMap[key] || PlacementAlignMap[key];
- const placementInfo = Object.assign(Object.assign({}, template), {
- offset: [0, 0],
- dynamicInset: true
- });
- placementMap[key] = placementInfo;
- // Disable autoArrow since design is fixed position
- if (DisableAutoArrowList.has(key)) {
- placementInfo.autoArrow = false;
- }
- // Static offset
- switch (key) {
- case 'top':
- case 'topLeft':
- case 'topRight':
- placementInfo.offset[1] = -halfArrowWidth - offset;
- break;
- case 'bottom':
- case 'bottomLeft':
- case 'bottomRight':
- placementInfo.offset[1] = halfArrowWidth + offset;
- break;
- case 'left':
- case 'leftTop':
- case 'leftBottom':
- placementInfo.offset[0] = -halfArrowWidth - offset;
- break;
- case 'right':
- case 'rightTop':
- case 'rightBottom':
- placementInfo.offset[0] = halfArrowWidth + offset;
- break;
- }
- if (arrowPointAtCenter) {
- switch (key) {
- case 'topLeft':
- case 'bottomLeft':
- placementInfo.offset[0] = -arrowOffset.arrowOffsetHorizontal - halfArrowWidth;
- break;
- case 'topRight':
- case 'bottomRight':
- placementInfo.offset[0] = arrowOffset.arrowOffsetHorizontal + halfArrowWidth;
- break;
- case 'leftTop':
- case 'rightTop':
- placementInfo.offset[1] = -arrowOffset.arrowOffsetHorizontal * 2 + halfArrowWidth;
- break;
- case 'leftBottom':
- case 'rightBottom':
- placementInfo.offset[1] = arrowOffset.arrowOffsetHorizontal * 2 - halfArrowWidth;
- break;
- }
- }
- // Overflow
- placementInfo.overflow = getOverflowOptions(key, arrowOffset, arrowWidth, autoAdjustOverflow);
- // VisibleFirst
- if (visibleFirst) {
- placementInfo.htmlRegion = 'visibleFirst';
- }
- });
- return placementMap;
- }
|