import maxSize from 'popper-max-size-modifier'

export function getModifiers({ matchWidths, offset, keepInView, shouldFlip }) {
  return [
    // https://popper.js.org/docs/v2/modifiers/community-modifiers/
    maxSize,
    {
      name: 'applyMaxSize',
      enabled: true,
      phase: 'beforeWrite',
      requires: ['maxSize'],
      fn({ state }) {
        const { height } = state.modifiersData.maxSize
        state.styles.popper.maxHeight = `${height}px`
      },
    },
    {
      name: 'matchWidths',
      enabled: Boolean(matchWidths),
      phase: 'write',
      requires: ['computeStyles'],
      effect: ({ state }) => {
        const { offsetWidth } = state.elements.reference
        if (matchWidths === 'minimum') {
          if (offsetWidth > state.elements.popper.offsetWidth) {
            state.elements.popper.style.minWidth = `${offsetWidth}px`
          }
        } else {
          state.elements.popper.style.width = `${offsetWidth}px`
        }
      },
    },
    {
      name: 'offset',
      options: {
        offset: [0, offset],
      },
    },
    {
      name: 'preventOverflow',
      enabled: keepInView,
    },
    {
      name: 'flip',
      enabled: shouldFlip,
    },
  ]
}

export function getFixedParent(node) {
  const { offsetParent } = node
  if (offsetParent) {
    const offsetParentStyles = getComputedStyle(offsetParent)
    if (offsetParentStyles.position !== 'fixed') {
      return getFixedParent(offsetParent)
    } else {
      return offsetParent
    }
  } else {
    return null
  }
}