various-ui/lib/utils/src/dispose/boundary/utils.js

This is a test version of the Vue 3 component library

'use strict';

var setting = require('./setting.js');

const disposeScrollSize = () => {
  const outer = document.createElement("div");
  const inner = document.createElement("div");
  outer.style.visibility = "hidden";
  outer.style.overflow = "scroll";
  outer.style.position = "absolute";
  outer.style.top = "-9999px";
  document.body.appendChild(outer);
  inner.style.width = "100%";
  outer.appendChild(inner);
  const size = outer.offsetWidth - inner.offsetWidth;
  const result = { width: 0, height: 0 };
  if (document.body.scrollHeight > innerHeight) result.width = size;
  if (document.body.scrollWidth > innerWidth) {
    result.height = size;
  }
  document.body.removeChild(outer);
  return result;
};
const disposeMainAxis = (size, option) => {
  if (option.strategy == "Disable") return { offset: option.offset, direction: option.direction };
  if (option.orientation > 0) {
    const offset = Math.floor(option.offset - size.container - size.view - size.space * 2);
    if (option.offset + size.view >= option.max && offset > option.min) {
      return { offset, direction: setting.default.DIRECTION[option.direction] };
    }
  } else {
    if (option.offset <= option.min && option.offset + size.container + size.view * 2 + size.space * 2 < option.max) {
      return {
        offset: Math.floor(option.offset + size.container + size.view + size.space * 2),
        direction: setting.default.DIRECTION[option.direction]
      };
    }
  }
  return { offset: option.offset, direction: option.direction };
};
const disposeSubAxis = (size, option) => {
  const result = { offset: option.offset + size.space, align: option.align };
  const difference = size.view - size.container;
  option.max -= 40;
  option.min += 40;
  switch (option.align) {
    case "center": {
      const offset = Math.floor(result.offset - difference / 2);
      if (option.strategy != "Disable" && offset + size.view >= option.max) {
        if (option.strategy == "Perfect") {
          result.offset = option.max - size.view;
          if (result.offset < option.min) result.offset = option.min;
          return result;
        } else if (result.offset - difference - size.space * 2 > option.min) {
          result.offset = result.offset - difference - size.space * 2;
          result.align = "end";
          return result;
        }
      }
      if (option.strategy != "Disable" && offset <= option.min) {
        if (option.strategy == "Perfect") {
          result.offset = option.min;
          if (result.offset + size.view > option.max) result.offset = option.max - size.view;
          return result;
        } else if (result.offset + size.view < option.max) {
          result.align = "start";
          return result;
        }
      }
      result.offset = offset;
      return result;
    }
    case "start": {
      if (option.strategy != "Disable" && result.offset + size.view >= option.max) {
        if (option.strategy == "Perfect") {
          result.offset = option.max - size.view;
          if (result.offset < option.min) {
            result.offset = option.min;
          }
        } else if (result.offset - difference - size.space * 2 > option.min) {
          result.offset = result.offset - difference - size.space * 2;
          result.align = "end";
        }
      }
      return result;
    }
    case "end": {
      const offset = result.offset - difference - size.space * 2;
      if (option.strategy != "Disable" && offset <= option.min) {
        if (option.strategy == "Perfect") {
          result.offset = option.min;
          if (result.offset + size.view > option.max) result.offset = option.max - size.view;
          return result;
        } else if (result.offset + size.view < option.max) {
          result.offset = result.offset;
          result.align = "start";
          return result;
        }
      }
      result.offset = offset;
      return result;
    }
  }
};
const setTriangleAttr = (node, direction, align) => {
  const attrs = setting.default.TRIGGER[`${direction}_${align}`];
  for (const i in attrs) {
    node.style[i] = attrs[i];
  }
};

exports.disposeMainAxis = disposeMainAxis;
exports.disposeScrollSize = disposeScrollSize;
exports.disposeSubAxis = disposeSubAxis;
exports.setTriangleAttr = setTriangleAttr;
//# sourceMappingURL=utils.js.map