UNPKG

@nex-ui/react

Version:

🎉 A beautiful, modern, and reliable React component library.

73 lines (69 loc) • 2.73 kB
'use strict'; var utils = require('../utils.cjs'); var detectOverflow = require('../detectOverflow.cjs'); const flip = (options = { mainAxis: true, crossAxis: true })=>{ return { name: 'flip', fn: (state)=>{ const { mainAxis = false, crossAxis = false } = options; const { placement, middlewareData, initialPlacement, rects } = state; const side = utils.getSide(placement); const overflow = detectOverflow.detectOverflow(state); const fallbackPlacements = utils.getFallbackPlacements(initialPlacement, crossAxis); const placements = [ initialPlacement, ...fallbackPlacements ]; // The index represents the priority for determining the overflow direction. const overflowsToCheck = []; if (mainAxis) { overflowsToCheck.push(overflow[side]); } let overflows = middlewareData.flip?.overflows || []; if (crossAxis) { const sides = utils.getAlignmentSides(placement, rects); overflowsToCheck.push(overflow[sides[0]], overflow[sides[1]]); } overflows = [ ...overflows, { placement: placement, overflowsToCheck } ]; if (!overflowsToCheck.every((side)=>side <= 0)) { const nextIndex = (middlewareData.flip?.index || 0) + 1; const nextPlacement = placements[nextIndex]; if (nextPlacement) { return { overrides: { placement: nextPlacement }, data: { overflows, index: nextIndex } }; } // First, find the candidates that fit on the mainAxis side of overflow, // then find the placement that fits the best on the main crossAxis side. let resetPlacement = overflows.filter((d)=>d.overflowsToCheck[0] <= 0).sort((a, b)=>a.overflowsToCheck[1] - b.overflowsToCheck[1])[0]?.placement; if (!resetPlacement) { resetPlacement = initialPlacement; } if (resetPlacement !== placement) { return { overrides: { placement: resetPlacement } }; } } return {}; } }; }; exports.flip = flip;