uikit 3.13.10 → 3.13.11-dev.eb080f280

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 (92) hide show
  1. package/CHANGELOG.md +29 -1
  2. package/dist/css/uikit-core-rtl.css +46 -8
  3. package/dist/css/uikit-core-rtl.min.css +1 -1
  4. package/dist/css/uikit-core.css +46 -8
  5. package/dist/css/uikit-core.min.css +1 -1
  6. package/dist/css/uikit-rtl.css +46 -6
  7. package/dist/css/uikit-rtl.min.css +1 -1
  8. package/dist/css/uikit.css +46 -6
  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 +7 -3
  15. package/dist/js/components/lightbox-panel.min.js +1 -1
  16. package/dist/js/components/lightbox.js +7 -3
  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 +18 -11
  21. package/dist/js/components/parallax.min.js +1 -1
  22. package/dist/js/components/slider-parallax.js +18 -11
  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 +18 -11
  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 +2 -2
  31. package/dist/js/components/sortable.min.js +1 -1
  32. package/dist/js/components/tooltip.js +62 -30
  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 +349 -253
  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 +392 -259
  41. package/dist/js/uikit.min.js +1 -1
  42. package/package.json +1 -1
  43. package/src/js/components/sortable.js +2 -3
  44. package/src/js/components/tooltip.js +38 -3
  45. package/src/js/core/drop.js +20 -10
  46. package/src/js/core/navbar.js +18 -6
  47. package/src/js/core/scrollspy-nav.js +4 -9
  48. package/src/js/core/sticky.js +55 -21
  49. package/src/js/mixin/media.js +12 -9
  50. package/src/js/mixin/modal.js +6 -2
  51. package/src/js/mixin/parallax.js +5 -1
  52. package/src/js/mixin/position.js +24 -24
  53. package/src/js/uikit-core.js +0 -4
  54. package/src/js/util/lang.js +0 -4
  55. package/src/js/util/position.js +180 -125
  56. package/src/js/util/viewport.js +42 -22
  57. package/src/less/components/drop.less +0 -1
  58. package/src/less/components/dropdown.less +11 -1
  59. package/src/less/components/icon.less +3 -0
  60. package/src/less/components/nav.less +22 -0
  61. package/src/less/components/navbar.less +26 -2
  62. package/src/less/components/search.less +2 -0
  63. package/src/less/components/sticky.less +8 -3
  64. package/src/less/theme/dropdown.less +4 -0
  65. package/src/less/theme/nav.less +6 -0
  66. package/src/less/theme/navbar.less +4 -0
  67. package/src/less/theme/search.less +6 -0
  68. package/src/scss/components/drop.scss +0 -1
  69. package/src/scss/components/dropdown.scss +11 -1
  70. package/src/scss/components/icon.scss +3 -0
  71. package/src/scss/components/nav.scss +22 -0
  72. package/src/scss/components/navbar.scss +26 -2
  73. package/src/scss/components/search.scss +2 -0
  74. package/src/scss/components/sticky.scss +8 -3
  75. package/src/scss/mixins-theme.scss +5 -0
  76. package/src/scss/mixins.scss +5 -0
  77. package/src/scss/theme/dropdown.scss +4 -0
  78. package/src/scss/theme/nav.scss +6 -0
  79. package/src/scss/theme/navbar.scss +4 -0
  80. package/src/scss/theme/search.scss +6 -0
  81. package/src/scss/variables-theme.scss +5 -1
  82. package/src/scss/variables.scss +5 -1
  83. package/tests/animation.html +216 -214
  84. package/tests/dropdown.html +16 -2
  85. package/tests/nav.html +27 -0
  86. package/tests/navbar.html +55 -4
  87. package/tests/parallax.html +4 -4
  88. package/tests/position.html +38 -39
  89. package/tests/sticky-navbar.html +6 -6
  90. package/tests/sticky-parallax.html +23 -7
  91. package/tests/sticky.html +300 -49
  92. package/src/js/core/core.js +0 -25
@@ -1,4 +1,4 @@
1
- /*! UIkit 3.13.10 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
1
+ /*! UIkit 3.13.11-dev.eb080f280 | 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() :
@@ -141,10 +141,6 @@
141
141
  return (document == null ? void 0 : document.defaultView) || window;
142
142
  }
143
143
 
144
- function toMs(time) {
145
- return time ? endsWith(time, 'ms') ? toFloat(time) : toFloat(time) * 1000 : 0;
146
- }
147
-
148
144
  function isEqual(value, other) {
149
145
  return (
150
146
  value === other ||
@@ -1788,7 +1784,7 @@
1788
1784
  return intersectRect(
1789
1785
  ...scrollParents(element).
1790
1786
  map((parent) => {
1791
- const { top, left, bottom, right } = offset(getViewport$1(parent));
1787
+ const { top, left, bottom, right } = offsetViewport(parent);
1792
1788
 
1793
1789
  return {
1794
1790
  top: top - offsetTop,
@@ -1803,7 +1799,7 @@
1803
1799
 
1804
1800
  function scrollTop(element, top) {
1805
1801
  if (isWindow(element) || isDocument(element)) {
1806
- element = getScrollingElement(element);
1802
+ element = scrollingElement(element);
1807
1803
  } else {
1808
1804
  element = toNode(element);
1809
1805
  }
@@ -1820,12 +1816,13 @@
1820
1816
  return parents.reduce(
1821
1817
  (fn, scrollElement, i) => {
1822
1818
  const { scrollTop, scrollHeight, offsetHeight } = scrollElement;
1823
- const maxScroll = scrollHeight - getViewportClientHeight(scrollElement);
1824
- const { height: elHeight, top: elTop } = offset(parents[i - 1] || element);
1825
-
1826
- let top = Math.ceil(
1827
- elTop - offset(getViewport$1(scrollElement)).top - offsetBy + scrollTop);
1819
+ const viewport = offsetViewport(scrollElement);
1820
+ const maxScroll = scrollHeight - viewport.height;
1821
+ const { height: elHeight, top: elTop } = parents[i - 1] ?
1822
+ offsetViewport(parents[i - 1]) :
1823
+ offset(element);
1828
1824
 
1825
+ let top = Math.ceil(elTop - viewport.top - offsetBy + scrollTop);
1829
1826
 
1830
1827
  if (offsetBy > 0 && offsetHeight < elHeight + offsetBy) {
1831
1828
  top += offsetBy;
@@ -1883,7 +1880,7 @@
1883
1880
 
1884
1881
  const [scrollElement] = scrollParents(element, /auto|scroll/, true);
1885
1882
  const { scrollHeight, scrollTop } = scrollElement;
1886
- const viewportHeight = getViewportClientHeight(scrollElement);
1883
+ const { height: viewportHeight } = offsetViewport(scrollElement);
1887
1884
  const maxScroll = scrollHeight - viewportHeight;
1888
1885
  const elementOffsetTop = offsetPosition(element)[0] - offsetPosition(scrollElement)[0];
1889
1886
 
@@ -1894,7 +1891,7 @@
1894
1891
  }
1895
1892
 
1896
1893
  function scrollParents(element, overflowRe, scrollable) {if (overflowRe === void 0) {overflowRe = /auto|scroll|hidden/;}if (scrollable === void 0) {scrollable = false;}
1897
- const scrollEl = getScrollingElement(element);
1894
+ const scrollEl = scrollingElement(element);
1898
1895
 
1899
1896
  let ancestors = parents(element).reverse();
1900
1897
  ancestors = ancestors.slice(ancestors.indexOf(scrollEl) + 1);
@@ -1909,181 +1906,253 @@
1909
1906
  ancestors.filter(
1910
1907
  (parent) =>
1911
1908
  overflowRe.test(css(parent, 'overflow')) && (
1912
- !scrollable || parent.scrollHeight > getViewportClientHeight(parent)))).
1909
+ !scrollable || parent.scrollHeight > offsetViewport(parent).height))).
1913
1910
 
1914
1911
 
1915
1912
  reverse();
1916
1913
  }
1917
1914
 
1918
- function getViewport$1(scrollElement) {
1919
- return scrollElement === getScrollingElement(scrollElement) ? window : scrollElement;
1915
+ function offsetViewport(scrollElement) {
1916
+ let viewportElement = getViewport$1(scrollElement);
1917
+
1918
+ // iOS 12 returns <body> as scrollingElement
1919
+ if (viewportElement === scrollingElement(viewportElement)) {
1920
+ viewportElement = document.documentElement;
1921
+ }
1922
+
1923
+ let rect = offset(viewportElement);
1924
+ for (let [prop, dir, start, end] of [
1925
+ ['width', 'x', 'left', 'right'],
1926
+ ['height', 'y', 'top', 'bottom']])
1927
+ {
1928
+ if (!isWindow(getViewport$1(viewportElement))) {
1929
+ rect[start] += toFloat(css(viewportElement, "border" + ucfirst(start) + "Width"));
1930
+ }
1931
+ rect[prop] = rect[dir] = (
1932
+ isWindow(viewportElement) ? scrollingElement(viewportElement) : viewportElement)["client" +
1933
+ ucfirst(prop)];
1934
+ rect[end] = rect[prop] + rect[start];
1935
+ }
1936
+ return rect;
1920
1937
  }
1921
1938
 
1922
- // iOS 12 returns <body> as scrollingElement
1923
- function getViewportClientHeight(scrollElement) {
1924
- return (
1925
- scrollElement === getScrollingElement(scrollElement) ?
1926
- document.documentElement :
1927
- scrollElement).
1928
- clientHeight;
1939
+ function scrollingElement(element) {
1940
+ const {
1941
+ document: { scrollingElement } } =
1942
+ toWindow(element);
1943
+ return scrollingElement;
1929
1944
  }
1930
1945
 
1931
- function getScrollingElement(element) {
1932
- const { document } = toWindow(element);
1933
- return document.scrollingElement || document.documentElement;
1946
+ function getViewport$1(scrollElement) {
1947
+ return scrollElement === scrollingElement(scrollElement) ? window : scrollElement;
1934
1948
  }
1935
1949
 
1936
- const dirs = {
1937
- width: ['x', 'left', 'right'],
1938
- height: ['y', 'top', 'bottom'] };
1950
+ const dirs = [
1951
+ ['width', 'x', 'left', 'right'],
1952
+ ['height', 'y', 'top', 'bottom']];
1953
+
1954
+
1955
+ function positionAt(element, target, options) {
1956
+ options = {
1957
+ attach: {
1958
+ element: ['left', 'top'],
1959
+ target: ['left', 'top'],
1960
+ ...options.attach },
1961
+
1962
+ offset: [0, 0],
1963
+ ...options };
1939
1964
 
1940
1965
 
1941
- function positionAt(
1942
- element,
1943
- target,
1944
- elAttach,
1945
- targetAttach,
1946
- elOffset,
1947
- targetOffset,
1948
- flip,
1949
- boundary)
1950
- {
1951
- elAttach = getPos(elAttach);
1952
- targetAttach = getPos(targetAttach);
1966
+ const dim = options.flip ?
1967
+ attachToWithFlip(element, target, options) :
1968
+ attachTo(element, target, options);
1953
1969
 
1954
- const flipped = { element: elAttach, target: targetAttach };
1970
+ offset(element, dim);
1971
+ }
1955
1972
 
1956
- if (!element || !target) {
1957
- return flipped;
1973
+ function attachTo(element, target, options) {
1974
+ let { attach, offset: offsetBy } = {
1975
+ attach: {
1976
+ element: ['left', 'top'],
1977
+ target: ['left', 'top'],
1978
+ ...options.attach },
1979
+
1980
+ offset: [0, 0],
1981
+ ...options };
1982
+
1983
+
1984
+ const position = offset(element);
1985
+ const targetOffset = offset(target);
1986
+ for (const i in dirs) {
1987
+ const [prop, dir, start, end] = dirs[i];
1988
+ position[start] = position[dir] =
1989
+ targetOffset[start] +
1990
+ moveBy(attach.target[i], end, targetOffset[prop]) -
1991
+ moveBy(attach.element[i], end, position[prop]) +
1992
+ +offsetBy[i];
1993
+ position[end] = position[start] + position[prop];
1958
1994
  }
1995
+ return position;
1996
+ }
1959
1997
 
1960
- const dim = offset(element);
1998
+ function attachToWithFlip(element, target, options) {
1999
+ const position = attachTo(element, target, options);
1961
2000
  const targetDim = offset(target);
1962
- const position = targetDim;
2001
+ const viewports = scrollParents(element, /auto|scroll/);
2002
+ const [scrollElement] = viewports;
1963
2003
 
1964
- moveTo(position, elAttach, dim, -1);
1965
- moveTo(position, targetAttach, targetDim, 1);
2004
+ let {
2005
+ flip,
2006
+ attach: { element: elAttach, target: targetAttach },
2007
+ offset: elOffset,
2008
+ boundary,
2009
+ viewport,
2010
+ viewportPadding } =
2011
+ options;
1966
2012
 
1967
- elOffset = getOffsets(elOffset, dim.width, dim.height);
1968
- targetOffset = getOffsets(targetOffset, targetDim.width, targetDim.height);
2013
+ viewports.push(viewport);
1969
2014
 
1970
- elOffset['x'] += targetOffset['x'];
1971
- elOffset['y'] += targetOffset['y'];
2015
+ const offsetPosition = { ...position };
2016
+ for (const i in dirs) {
2017
+ const [prop, dir, start, end] = dirs[i];
1972
2018
 
1973
- position.left += elOffset['x'];
1974
- position.top += elOffset['y'];
2019
+ if (flip !== true && !includes(flip, dir)) {
2020
+ continue;
2021
+ }
2022
+
2023
+ const willFlip =
2024
+ !intersectLine(position, targetDim, i) && intersectLine(position, targetDim, 1 - i);
1975
2025
 
1976
- if (flip) {
1977
- let boundaries = scrollParents(element).map(getViewport$1);
2026
+ viewport = getIntersectionArea(...viewports.filter(Boolean).map(offsetViewport));
1978
2027
 
1979
- if (boundary && !includes(boundaries, boundary)) {
1980
- boundaries.unshift(boundary);
2028
+ if (viewportPadding) {
2029
+ viewport[start] += viewportPadding;
2030
+ viewport[end] -= viewportPadding;
1981
2031
  }
1982
2032
 
1983
- boundaries = boundaries.map((el) => offset(el));
2033
+ if (boundary && !(willFlip || position[prop] > offset(boundary)[prop])) {
2034
+ viewport = getIntersectionArea(viewport, offset(boundary));
2035
+ }
1984
2036
 
1985
- each(dirs, (_ref, prop) => {let [dir, align, alignFlip] = _ref;
1986
- if (!(flip === true || includes(flip, dir))) {
1987
- return;
1988
- }
2037
+ const isInStartBoundary = position[start] >= viewport[start];
2038
+ const isInEndBoundary = position[end] <= viewport[end];
1989
2039
 
1990
- boundaries.some((boundary) => {
1991
- const elemOffset =
1992
- elAttach[dir] === align ?
1993
- -dim[prop] :
1994
- elAttach[dir] === alignFlip ?
1995
- dim[prop] :
1996
- 0;
2040
+ if (isInStartBoundary && isInEndBoundary) {
2041
+ continue;
2042
+ }
1997
2043
 
1998
- const targetOffset =
1999
- targetAttach[dir] === align ?
2000
- targetDim[prop] :
2001
- targetAttach[dir] === alignFlip ?
2002
- -targetDim[prop] :
2003
- 0;
2044
+ let offsetBy;
2004
2045
 
2005
- if (
2006
- position[align] < boundary[align] ||
2007
- position[align] + dim[prop] > boundary[alignFlip])
2008
- {
2009
- const centerOffset = dim[prop] / 2;
2010
- const centerTargetOffset =
2011
- targetAttach[dir] === 'center' ? -targetDim[prop] / 2 : 0;
2046
+ // Flip
2047
+ if (willFlip) {
2048
+ if (
2049
+ elAttach[i] === end && isInStartBoundary ||
2050
+ elAttach[i] === start && isInEndBoundary)
2051
+ {
2052
+ continue;
2053
+ }
2054
+
2055
+ offsetBy =
2056
+ (elAttach[i] === start ?
2057
+ -position[prop] :
2058
+ elAttach[i] === end ?
2059
+ position[prop] :
2060
+ 0) + (
2061
+ targetAttach[i] === start ?
2062
+ targetDim[prop] :
2063
+ targetAttach[i] === end ?
2064
+ -targetDim[prop] :
2065
+ 0) -
2066
+ elOffset[i] * 2;
2012
2067
 
2013
- return (
2014
- elAttach[dir] === 'center' && (
2015
- apply(centerOffset, centerTargetOffset) ||
2016
- apply(-centerOffset, -centerTargetOffset)) ||
2017
- apply(elemOffset, targetOffset));
2068
+ if (
2069
+ !isInScrollArea(
2070
+ {
2071
+ ...position,
2072
+ [start]: position[start] + offsetBy,
2073
+ [end]: position[end] + offsetBy },
2018
2074
 
2075
+ scrollElement,
2076
+ i))
2077
+
2078
+ {
2079
+ if (isInScrollArea(position, scrollElement, i)) {
2080
+ continue;
2019
2081
  }
2020
2082
 
2021
- function apply(elemOffset, targetOffset) {
2022
- const newVal = toFloat(
2023
- (position[align] + elemOffset + targetOffset - elOffset[dir] * 2).toFixed(4));
2083
+ if (options.recursion) {
2084
+ return false;
2085
+ }
2024
2086
 
2087
+ const newPos = attachToWithFlip(element, target, {
2088
+ ...options,
2089
+ attach: {
2090
+ element: elAttach.map(flipDir).reverse(),
2091
+ target: targetAttach.map(flipDir).reverse() },
2025
2092
 
2026
- if (newVal >= boundary[align] && newVal + dim[prop] <= boundary[alignFlip]) {
2027
- position[align] = newVal;
2093
+ offset: elOffset.reverse(),
2094
+ flip: flip === true ? flip : [...flip, dirs[1 - i][1]],
2095
+ recursion: true });
2028
2096
 
2029
- for (const el of ['element', 'target']) {
2030
- if (elemOffset) {
2031
- flipped[el][dir] =
2032
- flipped[el][dir] === dirs[prop][1] ?
2033
- dirs[prop][2] :
2034
- dirs[prop][1];
2035
- }
2036
- }
2037
2097
 
2038
- return true;
2039
- }
2098
+ if (newPos && isInScrollArea(newPos, scrollElement, 1 - i)) {
2099
+ return newPos;
2040
2100
  }
2041
- });
2042
- });
2043
- }
2101
+ }
2044
2102
 
2045
- offset(element, position);
2103
+ // Move
2104
+ } else {
2105
+ offsetBy =
2106
+ clamp(
2107
+ clamp(position[start], viewport[start], viewport[end] - position[prop]),
2108
+ targetDim[start] - position[prop] + elOffset[i],
2109
+ targetDim[end] - elOffset[i]) -
2110
+ position[start];
2111
+ }
2046
2112
 
2047
- return flipped;
2048
- }
2113
+ offsetPosition[start] = position[dir] = position[start] + offsetBy;
2114
+ offsetPosition[end] += offsetBy;
2115
+ }
2049
2116
 
2050
- function moveTo(position, attach, dim, factor) {
2051
- each(dirs, (_ref2, prop) => {let [dir, align, alignFlip] = _ref2;
2052
- if (attach[dir] === alignFlip) {
2053
- position[align] += dim[prop] * factor;
2054
- } else if (attach[dir] === 'center') {
2055
- position[align] += dim[prop] * factor / 2;
2056
- }
2057
- });
2117
+ return offsetPosition;
2058
2118
  }
2059
2119
 
2060
- function getPos(pos) {
2061
- const x = /left|center|right/;
2062
- const y = /top|center|bottom/;
2063
-
2064
- pos = (pos || '').split(' ');
2120
+ function moveBy(start, end, dim) {
2121
+ return start === 'center' ? dim / 2 : start === end ? dim : 0;
2122
+ }
2065
2123
 
2066
- if (pos.length === 1) {
2067
- pos = x.test(pos[0]) ?
2068
- pos.concat('center') :
2069
- y.test(pos[0]) ?
2070
- ['center'].concat(pos) :
2071
- ['center', 'center'];
2124
+ function getIntersectionArea() {
2125
+ let area = {};for (var _len = arguments.length, rects = new Array(_len), _key = 0; _key < _len; _key++) {rects[_key] = arguments[_key];}
2126
+ for (const rect of rects) {
2127
+ for (const [,, start, end] of dirs) {
2128
+ area[start] = Math.max(area[start] || 0, rect[start]);
2129
+ area[end] = Math.min(...[area[end], rect[end]].filter(Boolean));
2130
+ }
2072
2131
  }
2132
+ return area;
2133
+ }
2073
2134
 
2074
- return {
2075
- x: x.test(pos[0]) ? pos[0] : 'center',
2076
- y: y.test(pos[1]) ? pos[1] : 'center' };
2135
+ function isInScrollArea(position, scrollElement, dir) {
2136
+ const viewport = offsetViewport(scrollElement);
2137
+ const [prop,, start, end] = dirs[dir];
2138
+ viewport[start] -= scrollElement["scroll" + ucfirst(start)];
2139
+ viewport[end] = viewport[start] + scrollElement["scroll" + ucfirst(prop)];
2077
2140
 
2141
+ return position[start] >= viewport[start] && position[end] <= viewport[end];
2078
2142
  }
2079
2143
 
2080
- function getOffsets(offsets, width, height) {
2081
- const [x, y] = (offsets || '').split(' ');
2082
-
2083
- return {
2084
- x: x ? toFloat(x) * (endsWith(x, '%') ? width / 100 : 1) : 0,
2085
- y: y ? toFloat(y) * (endsWith(y, '%') ? height / 100 : 1) : 0 };
2144
+ function intersectLine(dimA, dimB, dir) {
2145
+ const [,, start, end] = dirs[dir];
2146
+ return dimA[end] > dimB[start] && dimB[end] > dimA[start];
2147
+ }
2086
2148
 
2149
+ function flipDir(prop) {
2150
+ for (const i in dirs) {
2151
+ const index = dirs[i].indexOf(prop);
2152
+ if (~index) {
2153
+ return dirs[1 - i][index % 2 + 2];
2154
+ }
2155
+ }
2087
2156
  }
2088
2157
 
2089
2158
  var util = /*#__PURE__*/Object.freeze({
@@ -2192,7 +2261,6 @@
2192
2261
  toNode: toNode,
2193
2262
  toNodes: toNodes,
2194
2263
  toWindow: toWindow,
2195
- toMs: toMs,
2196
2264
  isEqual: isEqual,
2197
2265
  swap: swap,
2198
2266
  last: last,
@@ -2231,9 +2299,7 @@
2231
2299
  scrollIntoView: scrollIntoView,
2232
2300
  scrolledOver: scrolledOver,
2233
2301
  scrollParents: scrollParents,
2234
- getViewport: getViewport$1,
2235
- getViewportClientHeight: getViewportClientHeight,
2236
- getScrollingElement: getScrollingElement
2302
+ offsetViewport: offsetViewport
2237
2303
  });
2238
2304
 
2239
2305
  function globalAPI (UIkit) {
@@ -2550,7 +2616,7 @@
2550
2616
  continue;
2551
2617
  }
2552
2618
 
2553
- value = props[key] === Boolean && value === '' ? true : coerce(props[key], value);
2619
+ value = props[key] === Boolean && value === '' ? true : coerce$1(props[key], value);
2554
2620
 
2555
2621
  if (prop === 'target' && (!value || startsWith(value, '_'))) {
2556
2622
  continue;
@@ -2564,7 +2630,7 @@
2564
2630
  for (const key in options) {
2565
2631
  const prop = camelize(key);
2566
2632
  if (props[prop] !== undefined) {
2567
- data$1[prop] = coerce(props[prop], options[key]);
2633
+ data$1[prop] = coerce$1(props[prop], options[key]);
2568
2634
  }
2569
2635
  }
2570
2636
 
@@ -2629,7 +2695,7 @@
2629
2695
  return options.every((arr) => !arr || !hasOwn(arr, key));
2630
2696
  }
2631
2697
 
2632
- function coerce(type, value) {
2698
+ function coerce$1(type, value) {
2633
2699
  if (type === Boolean) {
2634
2700
  return toBoolean(value);
2635
2701
  } else if (type === Number) {
@@ -2667,7 +2733,7 @@
2667
2733
  if (isUndefined(data[key])) {
2668
2734
  delete data[key];
2669
2735
  } else if (props[key]) {
2670
- data[key] = coerce(props[key], data[key]);
2736
+ data[key] = coerce$1(props[key], data[key]);
2671
2737
  }
2672
2738
  }
2673
2739
 
@@ -2892,7 +2958,7 @@
2892
2958
  UIkit.data = '__uikit__';
2893
2959
  UIkit.prefix = 'uk-';
2894
2960
  UIkit.options = {};
2895
- UIkit.version = '3.13.10';
2961
+ UIkit.version = '3.13.11-dev.eb080f280';
2896
2962
 
2897
2963
  globalAPI(UIkit);
2898
2964
  hooksAPI(UIkit);
@@ -2900,30 +2966,6 @@
2900
2966
  componentAPI(UIkit);
2901
2967
  instanceAPI(UIkit);
2902
2968
 
2903
- function Core () {
2904
- if (!inBrowser) {
2905
- return;
2906
- }
2907
-
2908
- let started = 0;
2909
- on(
2910
- document,
2911
- 'animationstart',
2912
- (_ref) => {let { target } = _ref;
2913
- if ((css(target, 'animationName') || '').match(/^uk-.*(left|right)/)) {
2914
- started++;
2915
- css(document.documentElement, 'overflowX', 'hidden');
2916
- setTimeout(() => {
2917
- if (! --started) {
2918
- css(document.documentElement, 'overflowX', '');
2919
- }
2920
- }, toMs(css(target, 'animationDuration')) + 100);
2921
- }
2922
- },
2923
- true);
2924
-
2925
- }
2926
-
2927
2969
  function boot (UIkit) {
2928
2970
  const { connect, disconnect } = UIkit;
2929
2971
 
@@ -3501,50 +3543,49 @@
3501
3543
  data: {
3502
3544
  pos: "bottom-" + (isRtl ? 'right' : 'left'),
3503
3545
  flip: true,
3504
- offset: false },
3546
+ offset: false,
3547
+ viewportPadding: 10 },
3505
3548
 
3506
3549
 
3507
3550
  connected() {
3508
3551
  this.pos = this.$props.pos.split('-').concat('center').slice(0, 2);
3509
- this.dir = this.pos[0];
3510
- this.align = this.pos[1];
3552
+ this.axis = includes(['top', 'bottom'], this.pos[0]) ? 'y' : 'x';
3511
3553
  },
3512
3554
 
3513
3555
  methods: {
3514
3556
  positionAt(element, target, boundary) {
3515
- const axis = this.getAxis();
3516
- const dir = this.pos[0];
3517
- const align = this.pos[1];
3557
+ const [dir, align] = this.pos;
3518
3558
 
3519
3559
  let { offset: offset$1 } = this;
3520
3560
  if (!isNumeric(offset$1)) {
3521
3561
  const node = $(offset$1);
3522
3562
  offset$1 = node ?
3523
- offset(node)[axis === 'x' ? 'left' : 'top'] -
3524
- offset(target)[axis === 'x' ? 'right' : 'bottom'] :
3563
+ offset(node)[this.axis === 'x' ? 'left' : 'top'] -
3564
+ offset(target)[this.axis === 'x' ? 'right' : 'bottom'] :
3525
3565
  0;
3526
3566
  }
3527
3567
  offset$1 = toPx(offset$1) + toPx(getCssVar('position-offset', element));
3568
+ offset$1 = [includes(['left', 'top'], dir) ? -offset$1 : +offset$1, 0];
3528
3569
 
3529
- const { x, y } = positionAt(
3530
- element,
3531
- target,
3532
- axis === 'x' ? flipPosition(dir) + " " + align : align + " " + flipPosition(dir),
3533
- axis === 'x' ? dir + " " + align : align + " " + dir,
3534
- axis === 'x' ? "" + (
3535
- dir === 'left' ? -offset$1 : offset$1) : " " + (
3536
- dir === 'top' ? -offset$1 : offset$1),
3537
- null,
3538
- this.flip,
3539
- boundary).
3540
- target;
3541
-
3542
- this.dir = axis === 'x' ? x : y;
3543
- this.align = axis === 'x' ? y : x;
3544
- },
3570
+ const attach = {
3571
+ element: [flipPosition(dir), align],
3572
+ target: [dir, align] };
3573
+
3574
+
3575
+ if (this.axis === 'y') {
3576
+ for (const prop in attach) {
3577
+ attach[prop] = attach[prop].reverse();
3578
+ }
3579
+ offset$1 = offset$1.reverse();
3580
+ }
3581
+
3582
+ positionAt(element, target, {
3583
+ attach,
3584
+ offset: offset$1,
3585
+ boundary,
3586
+ viewportPadding: this.viewportPadding,
3587
+ flip: this.flip });
3545
3588
 
3546
- getAxis() {
3547
- return this.dir === 'top' || this.dir === 'bottom' ? 'y' : 'x';
3548
3589
  } } };
3549
3590
 
3550
3591
  let active$1;
@@ -3872,25 +3913,33 @@
3872
3913
  },
3873
3914
 
3874
3915
  position() {
3875
- const boundary = query(this.boundary, this.$el) || window;
3876
3916
  removeClass(this.$el, this.clsDrop + "-stack");
3877
3917
  toggleClass(this.$el, this.clsDrop + "-boundary", this.boundaryAlign);
3878
3918
 
3879
- const boundaryOffset = offset(boundary);
3880
- const targetOffset = offset(this.target);
3881
- const alignTo = this.boundaryAlign ? boundaryOffset : targetOffset;
3919
+ const boundary = query(this.boundary, this.$el);
3920
+ const [scrollParent] = scrollParents(this.$el);
3921
+ const scrollParentOffset = offsetViewport(scrollParent);
3922
+ const boundaryOffset = boundary ? offset(boundary) : scrollParentOffset;
3923
+
3924
+ css(this.$el, 'maxWidth', '');
3925
+ const maxWidth = scrollParentOffset.width - (boundary ? 0 : 2 * this.viewportPadding);
3882
3926
 
3883
3927
  if (this.pos[1] === 'justify') {
3884
- const prop = this.getAxis() === 'y' ? 'width' : 'height';
3928
+ const prop = this.axis === 'y' ? 'width' : 'height';
3929
+ const targetOffset = offset(this.target);
3930
+ const alignTo = this.boundaryAlign ? boundaryOffset : targetOffset;
3885
3931
  css(this.$el, prop, alignTo[prop]);
3886
- } else if (
3887
- this.$el.offsetWidth >
3888
- Math.max(boundaryOffset.right - alignTo.left, alignTo.right - boundaryOffset.left))
3889
- {
3932
+ } else if (this.$el.offsetWidth > maxWidth) {
3890
3933
  addClass(this.$el, this.clsDrop + "-stack");
3891
3934
  }
3892
3935
 
3893
- this.positionAt(this.$el, this.boundaryAlign ? boundary : this.target, boundary);
3936
+ css(this.$el, 'maxWidth', maxWidth);
3937
+
3938
+ this.positionAt(
3939
+ this.$el,
3940
+ boundary && this.boundaryAlign ? boundary : this.target,
3941
+ boundary);
3942
+
3894
3943
  } } };
3895
3944
 
3896
3945
 
@@ -4994,16 +5043,19 @@
4994
5043
 
4995
5044
  connected() {
4996
5045
  const media = toMedia(this.media);
4997
- this.mediaObj = window.matchMedia(media);
4998
- const handler = () => {
4999
- this.matchMedia = this.mediaObj.matches;
5000
- trigger(this.$el, createEvent('mediachange', false, true, [this.mediaObj]));
5001
- };
5002
- this.offMediaObj = on(this.mediaObj, 'change', () => {
5046
+ this.matchMedia = true;
5047
+ if (media) {
5048
+ this.mediaObj = window.matchMedia(media);
5049
+ const handler = () => {
5050
+ this.matchMedia = this.mediaObj.matches;
5051
+ trigger(this.$el, createEvent('mediachange', false, true, [this.mediaObj]));
5052
+ };
5053
+ this.offMediaObj = on(this.mediaObj, 'change', () => {
5054
+ handler();
5055
+ this.$emit('resize');
5056
+ });
5003
5057
  handler();
5004
- this.$emit('resize');
5005
- });
5006
- handler();
5058
+ }
5007
5059
  },
5008
5060
 
5009
5061
  disconnected() {var _this$offMediaObj;
@@ -5292,7 +5344,7 @@
5292
5344
  return (el, show) =>
5293
5345
  new Promise((resolve, reject) =>
5294
5346
  once(el, 'show hide', () => {
5295
- el._reject && el._reject();
5347
+ el._reject == null ? void 0 : el._reject();
5296
5348
  el._reject = reject;
5297
5349
 
5298
5350
  _toggle(el, show);
@@ -5317,6 +5369,10 @@
5317
5369
  then(() => delete el._reject);
5318
5370
  }
5319
5371
 
5372
+ function toMs(time) {
5373
+ return time ? endsWith(time, 'ms') ? toFloat(time) : toFloat(time) * 1000 : 0;
5374
+ }
5375
+
5320
5376
  var modal = {
5321
5377
  install,
5322
5378
 
@@ -5470,8 +5526,6 @@
5470
5526
  toggle: '> a',
5471
5527
  content: '> ul' } };
5472
5528
 
5473
- const navItem = '.uk-navbar-nav > li > a, .uk-navbar-item, .uk-navbar-toggle';
5474
-
5475
5529
  var navbar = {
5476
5530
  mixins: [Class, Container],
5477
5531
 
@@ -5491,7 +5545,7 @@
5491
5545
 
5492
5546
 
5493
5547
  data: {
5494
- dropdown: navItem,
5548
+ dropdown: '.uk-navbar-nav > li > a, .uk-navbar-item, .uk-navbar-toggle',
5495
5549
  align: isRtl ? 'right' : 'left',
5496
5550
  clsDrop: 'uk-navbar-dropdown',
5497
5551
  mode: undefined,
@@ -5577,9 +5631,23 @@
5577
5631
  immediate: true },
5578
5632
 
5579
5633
 
5580
- toggles(_ref6, $el) {let { dropdown } = _ref6;
5581
- return $$(dropdown, $el);
5582
- } },
5634
+ toggles: {
5635
+ get(_ref6, $el) {let { dropdown } = _ref6;
5636
+ return $$(dropdown, $el);
5637
+ },
5638
+
5639
+ watch() {
5640
+ const justify = hasClass(this.$el, 'uk-navbar-justify');
5641
+ for (const container of $$(
5642
+ '.uk-navbar-nav, .uk-navbar-left, .uk-navbar-right',
5643
+ this.$el))
5644
+ {
5645
+ css(container, 'flexGrow', justify ? $$(this.dropdown, container).length : '');
5646
+ }
5647
+ },
5648
+
5649
+ immediate: true } },
5650
+
5583
5651
 
5584
5652
 
5585
5653
  disconnected() {
@@ -5740,7 +5808,7 @@
5740
5808
  return this.dropbar;
5741
5809
  },
5742
5810
 
5743
- handler(_, _ref10) {let { $el, dir } = _ref10;
5811
+ handler(_, _ref10) {let { $el, pos: [dir] = [] } = _ref10;
5744
5812
  if (!hasClass($el, this.clsDrop)) {
5745
5813
  return;
5746
5814
  }
@@ -6474,19 +6542,15 @@
6474
6542
 
6475
6543
  const [scrollElement] = scrollParents(targets, /auto|scroll/, true);
6476
6544
  const { scrollTop, scrollHeight } = scrollElement;
6477
- const max = scrollHeight - getViewportClientHeight(scrollElement);
6545
+ const viewport = offsetViewport(scrollElement);
6546
+ const max = scrollHeight - viewport.height;
6478
6547
  let active = false;
6479
6548
 
6480
6549
  if (scrollTop === max) {
6481
6550
  active = length - 1;
6482
6551
  } else {
6483
6552
  for (const i in targets) {
6484
- if (
6485
- offset(targets[i]).top -
6486
- offset(getViewport$1(scrollElement)).top -
6487
- this.offset >
6488
- 0)
6489
- {
6553
+ if (offset(targets[i]).top - viewport.top - this.offset > 0) {
6490
6554
  break;
6491
6555
  }
6492
6556
  active = +i;
@@ -6521,8 +6585,11 @@
6521
6585
  props: {
6522
6586
  position: String,
6523
6587
  top: null,
6524
- bottom: Boolean,
6588
+ bottom: null,
6589
+ start: null,
6590
+ end: null,
6525
6591
  offset: String,
6592
+ overflowFlip: Boolean,
6526
6593
  animation: String,
6527
6594
  clsActive: String,
6528
6595
  clsInactive: String,
@@ -6535,9 +6602,12 @@
6535
6602
 
6536
6603
  data: {
6537
6604
  position: 'top',
6538
- top: 0,
6605
+ top: false,
6539
6606
  bottom: false,
6607
+ start: false,
6608
+ end: false,
6540
6609
  offset: 0,
6610
+ overflowFlip: false,
6541
6611
  animation: '',
6542
6612
  clsActive: 'uk-active',
6543
6613
  clsInactive: '',
@@ -6559,6 +6629,9 @@
6559
6629
  },
6560
6630
 
6561
6631
  connected() {
6632
+ this.start = coerce(this.start || this.top);
6633
+ this.end = coerce(this.end || this.bottom);
6634
+
6562
6635
  this.placeholder =
6563
6636
  $('+ .uk-sticky-placeholder', this.$el) ||
6564
6637
  $('<div class="uk-sticky-placeholder"></div>');
@@ -6577,6 +6650,17 @@
6577
6650
  },
6578
6651
 
6579
6652
  events: [
6653
+ {
6654
+ name: 'resize',
6655
+
6656
+ el() {
6657
+ return window;
6658
+ },
6659
+
6660
+ handler() {
6661
+ this.$emit('resize');
6662
+ } },
6663
+
6580
6664
  {
6581
6665
  name: 'load hashchange popstate',
6582
6666
 
@@ -6593,7 +6677,7 @@
6593
6677
  return;
6594
6678
  }
6595
6679
 
6596
- fastdom.read(() => {
6680
+ setTimeout(() => {
6597
6681
  const targetOffset = offset($(location.hash));
6598
6682
  const elOffset = offset(this.$el);
6599
6683
 
@@ -6602,8 +6686,8 @@
6602
6686
  window,
6603
6687
  targetOffset.top -
6604
6688
  elOffset.height -
6605
- toPx(this.targetOffset, 'height') -
6606
- toPx(this.offset, 'height'));
6689
+ toPx(this.targetOffset, 'height', this.placeholder) -
6690
+ toPx(this.offset, 'height', this.placeholder));
6607
6691
 
6608
6692
  }
6609
6693
  });
@@ -6633,32 +6717,38 @@
6633
6717
 
6634
6718
  if (hide) {
6635
6719
  this.show();
6636
- fastdom.write(() => css(this.selTarget, 'transition', ''));
6720
+ requestAnimationFrame(() => css(this.selTarget, 'transition', ''));
6637
6721
  }
6638
6722
 
6639
6723
  const referenceElement = this.isFixed ? this.placeholder : this.$el;
6640
6724
  const windowHeight = height(window);
6641
6725
 
6642
6726
  let position = this.position;
6643
- if (position === 'auto' && height$1 > windowHeight) {
6644
- position = 'bottom';
6727
+ if (this.overflowFlip && height$1 > windowHeight) {
6728
+ position = position === 'top' ? 'bottom' : 'top';
6645
6729
  }
6646
6730
 
6647
6731
  let offset$1 = toPx(this.offset, 'height', referenceElement);
6648
- if (position === 'bottom') {
6732
+ if (position === 'bottom' && (height$1 < windowHeight || this.overflowFlip)) {
6649
6733
  offset$1 += windowHeight - height$1;
6650
6734
  }
6651
6735
 
6652
- const overflow = Math.max(0, height$1 + offset$1 - windowHeight);
6736
+ const overflow = this.overflowFlip ?
6737
+ 0 :
6738
+ Math.max(0, height$1 + offset$1 - windowHeight);
6653
6739
  const topOffset = offset(referenceElement).top;
6654
6740
 
6655
- const top = parseProp(this.top, this.$el, topOffset);
6656
- const bottom = parseProp(this.bottom, this.$el, topOffset + height$1, true);
6657
-
6658
- const start = Math.max(top, topOffset) - offset$1;
6659
- const end = bottom ?
6660
- bottom - offset(this.$el).height + overflow - offset$1 :
6661
- getScrollingElement(this.$el).scrollHeight - windowHeight;
6741
+ const start =
6742
+ (this.start === false ?
6743
+ topOffset :
6744
+ parseProp(this.start, this.$el, topOffset)) - offset$1;
6745
+ const end =
6746
+ this.end === false ?
6747
+ document.scrollingElement.scrollHeight - windowHeight :
6748
+ parseProp(this.end, this.$el, topOffset + height$1, true) -
6749
+ offset(this.$el).height +
6750
+ overflow -
6751
+ offset$1;
6662
6752
 
6663
6753
  return {
6664
6754
  start,
@@ -6861,8 +6951,8 @@
6861
6951
  return 0;
6862
6952
  }
6863
6953
 
6864
- if (isString(value) && value.match(/^-?\d/)) {
6865
- return propOffset + toPx(value);
6954
+ if (isNumeric(value) || isString(value) && value.match(/^-?\d/)) {
6955
+ return propOffset + toPx(value, 'height', el, true);
6866
6956
  } else {
6867
6957
  const refElement = value === true ? parent(el) : query(value, el);
6868
6958
  return (
@@ -6874,6 +6964,15 @@
6874
6964
  }
6875
6965
  }
6876
6966
 
6967
+ function coerce(value) {
6968
+ if (value === 'true') {
6969
+ return true;
6970
+ } else if (value === 'false') {
6971
+ return false;
6972
+ }
6973
+ return value;
6974
+ }
6975
+
6877
6976
  var Switcher = {
6878
6977
  mixins: [Lazyload, Swipe, Togglable],
6879
6978
 
@@ -7326,9 +7425,6 @@
7326
7425
  // register components
7327
7426
  each(components, (component, name) => UIkit.component(name, component));
7328
7427
 
7329
- // core functionality
7330
- UIkit.use(Core);
7331
-
7332
7428
  boot(UIkit);
7333
7429
 
7334
7430
  return UIkit;