uikit 3.13.3 → 3.13.5-dev.fdb50d317

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/css/uikit-core-rtl.css +1 -1
  3. package/dist/css/uikit-core-rtl.min.css +1 -1
  4. package/dist/css/uikit-core.css +1 -1
  5. package/dist/css/uikit-core.min.css +1 -1
  6. package/dist/css/uikit-rtl.css +1 -1
  7. package/dist/css/uikit-rtl.min.css +1 -1
  8. package/dist/css/uikit.css +1 -1
  9. package/dist/css/uikit.min.css +1 -1
  10. package/dist/js/components/countdown.js +1 -1
  11. package/dist/js/components/countdown.min.js +1 -1
  12. package/dist/js/components/filter.js +1 -1
  13. package/dist/js/components/filter.min.js +1 -1
  14. package/dist/js/components/lightbox-panel.js +1 -1
  15. package/dist/js/components/lightbox-panel.min.js +1 -1
  16. package/dist/js/components/lightbox.js +1 -1
  17. package/dist/js/components/lightbox.min.js +1 -1
  18. package/dist/js/components/notification.js +1 -1
  19. package/dist/js/components/notification.min.js +1 -1
  20. package/dist/js/components/parallax.js +1 -1
  21. package/dist/js/components/parallax.min.js +1 -1
  22. package/dist/js/components/slider-parallax.js +1 -1
  23. package/dist/js/components/slider-parallax.min.js +1 -1
  24. package/dist/js/components/slider.js +1 -1
  25. package/dist/js/components/slider.min.js +1 -1
  26. package/dist/js/components/slideshow-parallax.js +1 -1
  27. package/dist/js/components/slideshow-parallax.min.js +1 -1
  28. package/dist/js/components/slideshow.js +1 -1
  29. package/dist/js/components/slideshow.min.js +1 -1
  30. package/dist/js/components/sortable.js +1 -1
  31. package/dist/js/components/sortable.min.js +1 -1
  32. package/dist/js/components/tooltip.js +51 -17
  33. package/dist/js/components/tooltip.min.js +1 -1
  34. package/dist/js/components/upload.js +1 -1
  35. package/dist/js/components/upload.min.js +1 -1
  36. package/dist/js/uikit-core.js +176 -143
  37. package/dist/js/uikit-core.min.js +1 -1
  38. package/dist/js/uikit-icons.js +1 -1
  39. package/dist/js/uikit-icons.min.js +1 -1
  40. package/dist/js/uikit.js +175 -142
  41. package/dist/js/uikit.min.js +1 -1
  42. package/package.json +1 -1
  43. package/src/js/mixin/position.js +48 -15
  44. package/src/js/util/dimensions.js +2 -2
  45. package/src/js/util/observer.js +6 -3
  46. package/src/js/util/position.js +125 -129
  47. package/src/less/components/tooltip.less +1 -1
  48. package/src/scss/components/tooltip.scss +1 -1
  49. package/tests/drop.html +1 -1
  50. package/tests/position.html +38 -39
@@ -1,4 +1,4 @@
1
- /*! UIkit 3.13.3 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
1
+ /*! UIkit 3.13.5-dev.fdb50d317 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
2
2
 
3
3
  (function (global, factory) {
4
4
  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@@ -1014,8 +1014,8 @@
1014
1014
  const offsetBy = { height: scrollY, width: scrollX };
1015
1015
 
1016
1016
  for (const dir in dirs$1) {
1017
- for (const i in dirs$1[dir]) {
1018
- currentOffset[dirs$1[dir][i]] += offsetBy[dir];
1017
+ for (const prop of dirs$1[dir]) {
1018
+ currentOffset[prop] += offsetBy[dir];
1019
1019
  }
1020
1020
  }
1021
1021
  }
@@ -1459,9 +1459,7 @@
1459
1459
  }
1460
1460
 
1461
1461
  function observeIntersection(targets, cb, options, intersecting) {if (intersecting === void 0) {intersecting = true;}
1462
- return observe(
1463
- IntersectionObserver,
1464
- targets,
1462
+ const observer = new IntersectionObserver(
1465
1463
  intersecting ?
1466
1464
  (entries, observer) => {
1467
1465
  if (entries.some((entry) => entry.isIntersecting)) {
@@ -1471,6 +1469,11 @@
1471
1469
  cb,
1472
1470
  options);
1473
1471
 
1472
+ for (const el of toNodes(targets)) {
1473
+ observer.observe(el);
1474
+ }
1475
+
1476
+ return observer;
1474
1477
  }
1475
1478
 
1476
1479
  const hasResizeObserver = inBrowser && window.ResizeObserver;
@@ -1930,157 +1933,153 @@
1930
1933
  return document.scrollingElement || document.documentElement;
1931
1934
  }
1932
1935
 
1933
- const dirs = {
1934
- width: ['x', 'left', 'right'],
1935
- height: ['y', 'top', 'bottom'] };
1936
-
1936
+ const dirs = [
1937
+ ['width', 'x', 'left', 'right'],
1938
+ ['height', 'y', 'top', 'bottom']];
1937
1939
 
1938
- function positionAt(
1939
- element,
1940
- target,
1941
- elAttach,
1942
- targetAttach,
1943
- elOffset,
1944
- targetOffset,
1945
- flip,
1946
- boundary)
1947
- {
1948
- elAttach = getPos(elAttach);
1949
- targetAttach = getPos(targetAttach);
1950
1940
 
1951
- const flipped = { element: elAttach, target: targetAttach };
1941
+ function positionAt(element, target, options) {
1942
+ options = {
1943
+ attach: {
1944
+ element: ['left', 'top'],
1945
+ target: ['left', 'top'],
1946
+ ...options.attach },
1952
1947
 
1953
- if (!element || !target) {
1954
- return flipped;
1955
- }
1948
+ offset: [0, 0],
1949
+ ...options };
1956
1950
 
1957
- const dim = offset(element);
1958
- const targetDim = offset(target);
1959
- const position = targetDim;
1960
1951
 
1961
- moveTo(position, elAttach, dim, -1);
1962
- moveTo(position, targetAttach, targetDim, 1);
1952
+ const dim = options.flip ?
1953
+ attachToWithFlip(element, target, options) :
1954
+ attachTo(element, target, options);
1963
1955
 
1964
- elOffset = getOffsets(elOffset, dim.width, dim.height);
1965
- targetOffset = getOffsets(targetOffset, targetDim.width, targetDim.height);
1956
+ offset(element, dim);
1957
+ }
1966
1958
 
1967
- elOffset['x'] += targetOffset['x'];
1968
- elOffset['y'] += targetOffset['y'];
1959
+ function attachTo(element, target, options) {
1960
+ let { attach, offset: offsetBy } = {
1961
+ attach: {
1962
+ element: ['left', 'top'],
1963
+ target: ['left', 'top'],
1964
+ ...options.attach },
1969
1965
 
1970
- position.left += elOffset['x'];
1971
- position.top += elOffset['y'];
1966
+ offset: [0, 0],
1967
+ ...options };
1972
1968
 
1973
- if (flip) {
1974
- let boundaries = scrollParents(element).map(getViewport$1);
1975
1969
 
1976
- if (boundary && !includes(boundaries, boundary)) {
1977
- boundaries.unshift(boundary);
1978
- }
1970
+ const position = offset(element);
1971
+ const targetOffset = offset(target);
1972
+ for (const i in dirs) {
1973
+ const [prop, dir, start, end] = dirs[i];
1974
+ position[start] = position[dir] =
1975
+ targetOffset[start] +
1976
+ moveBy(attach.target[i], end, targetOffset[prop]) -
1977
+ moveBy(attach.element[i], end, position[prop]) +
1978
+ +offsetBy[i];
1979
+ position[end] = position[start] + position[prop];
1980
+ }
1981
+ return position;
1982
+ }
1979
1983
 
1980
- boundaries = boundaries.map((el) => offset(el));
1984
+ function attachToWithFlip(element, target, options) {
1985
+ const position = attachTo(element, target, options);
1986
+ const targetDim = offset(target);
1987
+ const viewports = scrollParents(element).map(getViewport$1);
1981
1988
 
1982
- each(dirs, (_ref, prop) => {let [dir, align, alignFlip] = _ref;
1983
- if (!(flip === true || includes(flip, dir))) {
1984
- return;
1985
- }
1989
+ let {
1990
+ flip,
1991
+ attach: { element: elAttach, target: targetAttach },
1992
+ offset: elOffset,
1993
+ boundary,
1994
+ viewport } =
1995
+ options;
1986
1996
 
1987
- boundaries.some((boundary) => {
1988
- const elemOffset =
1989
- elAttach[dir] === align ?
1990
- -dim[prop] :
1991
- elAttach[dir] === alignFlip ?
1992
- dim[prop] :
1993
- 0;
1997
+ viewports.push(viewport);
1994
1998
 
1995
- const targetOffset =
1996
- targetAttach[dir] === align ?
1997
- targetDim[prop] :
1998
- targetAttach[dir] === alignFlip ?
1999
- -targetDim[prop] :
2000
- 0;
1999
+ for (const i in dirs) {
2000
+ const [prop, dir, start, end] = dirs[i];
2001
2001
 
2002
- if (
2003
- position[align] < boundary[align] ||
2004
- position[align] + dim[prop] > boundary[alignFlip])
2005
- {
2006
- const centerOffset = dim[prop] / 2;
2007
- const centerTargetOffset =
2008
- targetAttach[dir] === 'center' ? -targetDim[prop] / 2 : 0;
2002
+ if (flip !== true && !includes(flip, dir)) {
2003
+ continue;
2004
+ }
2009
2005
 
2010
- return (
2011
- elAttach[dir] === 'center' && (
2012
- apply(centerOffset, centerTargetOffset) ||
2013
- apply(-centerOffset, -centerTargetOffset)) ||
2014
- apply(elemOffset, targetOffset));
2006
+ const willFlip =
2007
+ !intersectLine(position, targetDim, i) && intersectLine(position, targetDim, 1 - i);
2015
2008
 
2016
- }
2009
+ viewport = getIntersectionArea(...viewports, willFlip ? null : boundary);
2010
+ const isInStartBoundary = position[start] >= viewport[start];
2011
+ const isInEndBoundary = position[end] <= viewport[end];
2017
2012
 
2018
- function apply(elemOffset, targetOffset) {
2019
- const newVal = toFloat(
2020
- (position[align] + elemOffset + targetOffset - elOffset[dir] * 2).toFixed(4));
2013
+ if (isInStartBoundary && isInEndBoundary) {
2014
+ continue;
2015
+ }
2021
2016
 
2017
+ let offsetBy;
2022
2018
 
2023
- if (newVal >= boundary[align] && newVal + dim[prop] <= boundary[alignFlip]) {
2024
- position[align] = newVal;
2019
+ // Flip
2020
+ if (willFlip) {
2021
+ if (
2022
+ elAttach[i] === end && isInStartBoundary ||
2023
+ elAttach[i] === start && isInEndBoundary)
2024
+ {
2025
+ continue;
2026
+ }
2025
2027
 
2026
- for (const el of ['element', 'target']) {
2027
- if (elemOffset) {
2028
- flipped[el][dir] =
2029
- flipped[el][dir] === dirs[prop][1] ?
2030
- dirs[prop][2] :
2031
- dirs[prop][1];
2032
- }
2033
- }
2028
+ offsetBy =
2029
+ (elAttach[i] === start ?
2030
+ -position[prop] :
2031
+ elAttach[i] === end ?
2032
+ position[prop] :
2033
+ 0) + (
2034
+ targetAttach[i] === start ?
2035
+ targetDim[prop] :
2036
+ targetAttach[i] === end ?
2037
+ -targetDim[prop] :
2038
+ 0) -
2039
+ elOffset[i] * 2;
2040
+
2041
+ // Move
2042
+ } else {
2043
+ offsetBy =
2044
+ clamp(
2045
+ clamp(position[start], viewport[start], viewport[end] - position[prop]),
2046
+ targetDim[start] - position[prop] + elOffset[i],
2047
+ targetDim[end] - elOffset[i]) -
2048
+ position[start];
2049
+ }
2034
2050
 
2035
- return true;
2036
- }
2037
- }
2038
- });
2039
- });
2051
+ position[start] = position[dir] = position[start] + offsetBy;
2052
+ position[end] += offsetBy;
2040
2053
  }
2041
2054
 
2042
- offset(element, position);
2043
-
2044
- return flipped;
2055
+ return position;
2045
2056
  }
2046
2057
 
2047
- function moveTo(position, attach, dim, factor) {
2048
- each(dirs, (_ref2, prop) => {let [dir, align, alignFlip] = _ref2;
2049
- if (attach[dir] === alignFlip) {
2050
- position[align] += dim[prop] * factor;
2051
- } else if (attach[dir] === 'center') {
2052
- position[align] += dim[prop] * factor / 2;
2053
- }
2054
- });
2058
+ function moveBy(start, end, dim) {
2059
+ return start === 'center' ? dim / 2 : start === end ? dim : 0;
2055
2060
  }
2056
2061
 
2057
- function getPos(pos) {
2058
- const x = /left|center|right/;
2059
- const y = /top|center|bottom/;
2060
-
2061
- pos = (pos || '').split(' ');
2062
-
2063
- if (pos.length === 1) {
2064
- pos = x.test(pos[0]) ?
2065
- pos.concat('center') :
2066
- y.test(pos[0]) ?
2067
- ['center'].concat(pos) :
2068
- ['center', 'center'];
2062
+ function getIntersectionArea() {
2063
+ let intersection;for (var _len = arguments.length, elements = new Array(_len), _key = 0; _key < _len; _key++) {elements[_key] = arguments[_key];}
2064
+ for (const el of elements.filter(Boolean)) {
2065
+ const rect = offset(el);
2066
+ if (!intersection) {
2067
+ intersection = rect;
2068
+ continue;
2069
+ }
2070
+ for (const prop of ['left', 'top']) {
2071
+ intersection[prop] = Math.max(rect[prop], intersection[prop]);
2072
+ }
2073
+ for (const prop of ['right', 'bottom']) {
2074
+ intersection[prop] = Math.min(rect[prop], intersection[prop]);
2075
+ }
2069
2076
  }
2070
-
2071
- return {
2072
- x: x.test(pos[0]) ? pos[0] : 'center',
2073
- y: y.test(pos[1]) ? pos[1] : 'center' };
2074
-
2077
+ return intersection;
2075
2078
  }
2076
2079
 
2077
- function getOffsets(offsets, width, height) {
2078
- const [x, y] = (offsets || '').split(' ');
2079
-
2080
- return {
2081
- x: x ? toFloat(x) * (endsWith(x, '%') ? width / 100 : 1) : 0,
2082
- y: y ? toFloat(y) * (endsWith(y, '%') ? height / 100 : 1) : 0 };
2083
-
2080
+ function intersectLine(dimA, dimB, dir) {
2081
+ const [,, start, end] = dirs[dir];
2082
+ return dimA[end] > dimB[start] && dimB[end] > dimA[start];
2084
2083
  }
2085
2084
 
2086
2085
  var util = /*#__PURE__*/Object.freeze({
@@ -2889,7 +2888,7 @@
2889
2888
  UIkit.data = '__uikit__';
2890
2889
  UIkit.prefix = 'uk-';
2891
2890
  UIkit.options = {};
2892
- UIkit.version = '3.13.3';
2891
+ UIkit.version = '3.13.5-dev.fdb50d317';
2893
2892
 
2894
2893
  globalAPI(UIkit);
2895
2894
  hooksAPI(UIkit);
@@ -3523,27 +3522,61 @@
3523
3522
  }
3524
3523
  offset$1 += toPx(getCssVar('position-margin-offset', element));
3525
3524
 
3526
- const { x, y } = positionAt(
3527
- element,
3528
- target,
3529
- axis === 'x' ? flipPosition(dir) + " " + align : align + " " + flipPosition(dir),
3530
- axis === 'x' ? dir + " " + align : align + " " + dir,
3531
- axis === 'x' ? "" + (
3532
- dir === 'left' ? -offset$1 : offset$1) : " " + (
3533
- dir === 'top' ? -offset$1 : offset$1),
3534
- null,
3535
- this.flip,
3536
- boundary).
3537
- target;
3538
-
3539
- this.dir = axis === 'x' ? x : y;
3540
- this.align = axis === 'x' ? y : x;
3525
+ positionAt(element, target, {
3526
+ boundary,
3527
+ flip: this.flip,
3528
+ attach: {
3529
+ element: axis === 'x' ? [flipPosition(dir), align] : [align, flipPosition(dir)],
3530
+ target: axis === 'x' ? [dir, align] : [align, dir] },
3531
+
3532
+ offset:
3533
+ axis === 'x' ?
3534
+ [dir === 'left' ? -offset$1 : +offset$1, 0] :
3535
+ [0, dir === 'top' ? -offset$1 : +offset$1] });
3536
+
3537
+
3538
+ [this.dir, this.align] = getAlignment(element, target);
3541
3539
  },
3542
3540
 
3543
3541
  getAxis() {
3544
- return this.dir === 'top' || this.dir === 'bottom' ? 'y' : 'x';
3542
+ return includes(['top', 'bottom'], this.dir) ? 'y' : 'x';
3545
3543
  } } };
3546
3544
 
3545
+
3546
+
3547
+ function getAlignment(el, target) {
3548
+ const elOffset = offset(el);
3549
+ const targetOffset = offset(target);
3550
+ const properties = [
3551
+ ['left', 'right'],
3552
+ ['top', 'bottom']];
3553
+
3554
+
3555
+ let dir;
3556
+ for (const props of properties) {
3557
+ if (elOffset[props[0]] >= targetOffset[props[1]]) {
3558
+ dir = props[1];
3559
+ break;
3560
+ }
3561
+ if (elOffset[props[1]] <= targetOffset[props[0]]) {
3562
+ dir = props[0];
3563
+ break;
3564
+ }
3565
+ }
3566
+
3567
+ let align;
3568
+ const props = includes(properties[0], dir) ? properties[1] : properties[0];
3569
+ if (elOffset[props[0]] === targetOffset[props[0]]) {
3570
+ align = props[0];
3571
+ } else if (elOffset[props[1]] === targetOffset[props[1]]) {
3572
+ align = props[1];
3573
+ } else {
3574
+ align = 'center';
3575
+ }
3576
+
3577
+ return [dir, align];
3578
+ }
3579
+
3547
3580
  let active$1;
3548
3581
 
3549
3582
  var drop = {