@atlaskit/spotlight/dist/es2019/ui/popover-content/get-placement-with-offset.js

A spotlight introduces users to points of interest, from focused messages to multi-step tours.

import { placementMap } from './placement-map';
const DEFAULT_GAP = "var(--ds-space-050, 4px)";
function normalizeOffsetMember({
  value
}) {
  return value !== null && value !== void 0 ? value : 0;
}
function addCssLength({
  base,
  delta
}) {
  if (delta === 0) {
    return base;
  }
  if (typeof base === 'number') {
    return base + delta;
  }
  const operator = delta > 0 ? '+' : '-';
  return `calc(${base} ${operator} ${Math.abs(delta)}px)`;
}
function toSignedCrossAxisShiftValue({
  crossAxisShift
}) {
  var _crossAxisShift$value;
  const baseValue = (_crossAxisShift$value = crossAxisShift.value) !== null && _crossAxisShift$value !== void 0 ? _crossAxisShift$value : 0;
  if (crossAxisShift.direction === 'forwards') {
    return baseValue;
  }
  if (typeof baseValue === 'number') {
    return -baseValue;
  }
  return `calc(-1 * ${baseValue})`;
}
function getCrossAxisShiftWithOffset({
  baseCrossAxisShift,
  along
}) {
  if (!baseCrossAxisShift) {
    if (along === 0) {
      return undefined;
    }
    return {
      value: along,
      direction: 'forwards'
    };
  }
  if (along === 0) {
    return baseCrossAxisShift;
  }

  // Collapse sign into the CSS length so additive composition works even
  // when the existing shift is already expressed as a `calc(...)` string.
  return {
    value: addCssLength({
      base: toSignedCrossAxisShiftValue({
        crossAxisShift: baseCrossAxisShift
      }),
      delta: along
    }),
    direction: 'forwards'
  };
}
export function getPlacementWithOffset({
  placement,
  offset
}) {
  var _basePlacement$offset, _basePlacement$offset2, _basePlacement$offset3;
  const basePlacement = placementMap[placement];
  if (!offset) {
    return basePlacement;
  }
  const [alongRaw, awayRaw] = offset;
  const along = normalizeOffsetMember({
    value: alongRaw
  });
  const away = normalizeOffsetMember({
    value: awayRaw
  });
  if (along === 0 && away === 0) {
    return basePlacement;
  }
  const gap = addCssLength({
    base: (_basePlacement$offset = (_basePlacement$offset2 = basePlacement.offset) === null || _basePlacement$offset2 === void 0 ? void 0 : _basePlacement$offset2.gap) !== null && _basePlacement$offset !== void 0 ? _basePlacement$offset : DEFAULT_GAP,
    delta: away
  });
  const crossAxisShift = getCrossAxisShiftWithOffset({
    baseCrossAxisShift: (_basePlacement$offset3 = basePlacement.offset) === null || _basePlacement$offset3 === void 0 ? void 0 : _basePlacement$offset3.crossAxisShift,
    along
  });
  return {
    ...basePlacement,
    offset: {
      ...basePlacement.offset,
      gap,
      ...(crossAxisShift ? {
        crossAxisShift
      } : {})
    }
  };
}