getBreakpoint.js 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. import { getWindow } from 'ssr-window';
  2. export default function getBreakpoint(breakpoints, base, containerEl) {
  3. if (base === void 0) {
  4. base = 'window';
  5. }
  6. if (!breakpoints || base === 'container' && !containerEl) return undefined;
  7. let breakpoint = false;
  8. const window = getWindow();
  9. const currentHeight = base === 'window' ? window.innerHeight : containerEl.clientHeight;
  10. const points = Object.keys(breakpoints).map(point => {
  11. if (typeof point === 'string' && point.indexOf('@') === 0) {
  12. const minRatio = parseFloat(point.substr(1));
  13. const value = currentHeight * minRatio;
  14. return {
  15. value,
  16. point
  17. };
  18. }
  19. return {
  20. value: point,
  21. point
  22. };
  23. });
  24. points.sort((a, b) => parseInt(a.value, 10) - parseInt(b.value, 10));
  25. for (let i = 0; i < points.length; i += 1) {
  26. const {
  27. point,
  28. value
  29. } = points[i];
  30. if (base === 'window') {
  31. if (window.matchMedia(`(min-width: ${value}px)`).matches) {
  32. breakpoint = point;
  33. }
  34. } else if (value <= containerEl.clientWidth) {
  35. breakpoint = point;
  36. }
  37. }
  38. return breakpoint || 'max';
  39. }