uikit 3.11.2-dev.57792c7e7 → 3.11.2-dev.bbaa4362f

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 (54) hide show
  1. package/CHANGELOG.md +13 -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 +37 -41
  21. package/dist/js/components/parallax.min.js +1 -1
  22. package/dist/js/components/slider-parallax.js +32 -25
  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 +32 -25
  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 -3
  31. package/dist/js/components/sortable.min.js +1 -1
  32. package/dist/js/components/tooltip.js +1 -1
  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 +146 -75
  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 +209 -143
  41. package/dist/js/uikit.min.js +1 -1
  42. package/package.json +1 -1
  43. package/src/js/components/parallax.js +5 -16
  44. package/src/js/components/sortable.js +1 -2
  45. package/src/js/core/core.js +2 -2
  46. package/src/js/core/height-viewport.js +2 -2
  47. package/src/js/core/navbar.js +5 -1
  48. package/src/js/core/sticky.js +82 -50
  49. package/src/js/mixin/parallax.js +32 -21
  50. package/src/js/util/dimensions.js +28 -12
  51. package/src/js/util/fastdom.js +2 -2
  52. package/src/js/util/viewport.js +7 -3
  53. package/tests/sticky-parallax.html +44 -41
  54. package/tests/sticky.html +56 -24
@@ -1,4 +1,4 @@
1
- /*! UIkit 3.11.2-dev.57792c7e7 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
1
+ /*! UIkit 3.11.2-dev.bbaa4362f | 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() :
@@ -1750,19 +1750,35 @@
1750
1750
  if ( element === void 0 ) element = window;
1751
1751
  if ( offsetDim === void 0 ) offsetDim = false;
1752
1752
 
1753
- return isNumeric(value)
1754
- ? +value
1755
- : endsWith(value, 'vh')
1756
- ? percent(height(toWindow(element)), value)
1757
- : endsWith(value, 'vw')
1758
- ? percent(width(toWindow(element)), value)
1759
- : endsWith(value, '%')
1760
- ? percent(offsetDim
1761
- ? element[("offset" + (ucfirst(property)))]
1762
- : dimensions(element)[property], value)
1763
- : toFloat(value);
1753
+
1754
+ if (!isString(value)) {
1755
+ return toFloat(value);
1756
+ }
1757
+
1758
+ return parseCalc(value).reduce(function (result, value) {
1759
+ var unit = parseUnit(value);
1760
+ if (unit) {
1761
+ value = percent(
1762
+ unit === 'vh'
1763
+ ? height(toWindow(element))
1764
+ : unit === 'vw'
1765
+ ? width(toWindow(element))
1766
+ : offsetDim
1767
+ ? element[("offset" + (ucfirst(property)))]
1768
+ : dimensions(element)[property],
1769
+ value
1770
+ );
1771
+ }
1772
+
1773
+ return result + toFloat(value);
1774
+ }, 0);
1764
1775
  }
1765
1776
 
1777
+ var calcRe = /-?\d+(?:\.\d+)?(?:v[wh]|%|px)?/g;
1778
+ var parseCalc = memoize(function (calc) { return calc.toString().replace(/\s/g, '').match(calcRe) || []; });
1779
+ var unitRe = /(?:v[hw]|%)$/;
1780
+ var parseUnit = memoize(function (str) { return (str.match(unitRe) || [])[0]; });
1781
+
1766
1782
  function percent(base, value) {
1767
1783
  return base * toFloat(value) / 100;
1768
1784
  }
@@ -1800,8 +1816,6 @@
1800
1816
  };
1801
1817
 
1802
1818
  function flush(recursion) {
1803
- if ( recursion === void 0 ) recursion = 1;
1804
-
1805
1819
  runTasks(fastdom.reads);
1806
1820
  runTasks(fastdom.writes.splice(0));
1807
1821
 
@@ -1823,7 +1837,7 @@
1823
1837
  if (recursion && recursion < RECURSION_LIMIT) {
1824
1838
  Promise$1.resolve().then(function () { return flush(recursion); });
1825
1839
  } else {
1826
- requestAnimationFrame(function () { return flush(); });
1840
+ requestAnimationFrame(function () { return flush(1); });
1827
1841
  }
1828
1842
 
1829
1843
  }
@@ -2241,7 +2255,11 @@
2241
2255
  element = toNode(element);
2242
2256
  }
2243
2257
 
2244
- element.scrollTop = top;
2258
+ if (isUndefined(top)) {
2259
+ return element.scrollTop;
2260
+ } else {
2261
+ element.scrollTop = top;
2262
+ }
2245
2263
  }
2246
2264
 
2247
2265
  function scrollIntoView(element, ref) {
@@ -2673,7 +2691,8 @@
2673
2691
  scrolledOver: scrolledOver,
2674
2692
  scrollParents: scrollParents,
2675
2693
  getViewport: getViewport$1,
2676
- getViewportClientHeight: getViewportClientHeight
2694
+ getViewportClientHeight: getViewportClientHeight,
2695
+ getScrollingElement: getScrollingElement
2677
2696
  });
2678
2697
 
2679
2698
  function globalAPI (UIkit) {
@@ -3462,7 +3481,7 @@
3462
3481
  UIkit.data = '__uikit__';
3463
3482
  UIkit.prefix = 'uk-';
3464
3483
  UIkit.options = {};
3465
- UIkit.version = '3.11.2-dev.57792c7e7';
3484
+ UIkit.version = '3.11.2-dev.bbaa4362f';
3466
3485
 
3467
3486
  globalAPI(UIkit);
3468
3487
  hooksAPI(UIkit);
@@ -3483,7 +3502,7 @@
3483
3502
  return;
3484
3503
  }
3485
3504
  pendingResize = true;
3486
- fastdom.write(function () { return pendingResize = false; });
3505
+ fastdom.read(function () { return pendingResize = false; });
3487
3506
  UIkit.update(null, 'resize');
3488
3507
  };
3489
3508
 
@@ -3502,7 +3521,7 @@
3502
3521
  return;
3503
3522
  }
3504
3523
  pending = true;
3505
- fastdom.write(function () { return pending = false; });
3524
+ fastdom.read(function () { return pending = false; });
3506
3525
 
3507
3526
  UIkit.update(null, e.type);
3508
3527
 
@@ -5312,7 +5331,7 @@
5312
5331
  css(this.$el, {minHeight: minHeight});
5313
5332
 
5314
5333
  if (minHeight !== prev) {
5315
- this.$update(this.$el, 'resize');
5334
+ trigger(this.$el, 'resize');
5316
5335
  }
5317
5336
 
5318
5337
  if (this.minHeight && toFloat(css(this.$el, 'minHeight')) < this.minHeight) {
@@ -6895,7 +6914,11 @@
6895
6914
 
6896
6915
  var active = this.getActive();
6897
6916
 
6898
- if (matches(this.dropbar, ':hover') && active && active.$el === $el) {
6917
+ if (matches(this.dropbar, ':hover')
6918
+ && active
6919
+ && active.$el === $el
6920
+ && !this.toggles.some(function (el) { return active.target !== el && matches(el, ':focus'); })
6921
+ ) {
6899
6922
  e.preventDefault();
6900
6923
  }
6901
6924
  }
@@ -7687,6 +7710,7 @@
7687
7710
  mixins: [Class, Media],
7688
7711
 
7689
7712
  props: {
7713
+ position: String,
7690
7714
  top: null,
7691
7715
  bottom: Boolean,
7692
7716
  offset: String,
@@ -7702,6 +7726,7 @@
7702
7726
  },
7703
7727
 
7704
7728
  data: {
7729
+ position: 'top',
7705
7730
  top: 0,
7706
7731
  bottom: false,
7707
7732
  offset: 0,
@@ -7718,10 +7743,23 @@
7718
7743
 
7719
7744
  computed: {
7720
7745
 
7721
- offset: function(ref) {
7746
+ position: function(ref, $el) {
7747
+ var position = ref.position;
7748
+
7749
+ return position === 'auto'
7750
+ ? (this.isFixed ? this.placeholder : $el).offsetHeight > height(window)
7751
+ ? 'bottom'
7752
+ : 'top'
7753
+ : position;
7754
+ },
7755
+
7756
+ offset: function(ref, $el) {
7722
7757
  var offset = ref.offset;
7723
7758
 
7724
- return toPx(offset);
7759
+ if (this.position === 'bottom') {
7760
+ offset += '+100vh-100%';
7761
+ }
7762
+ return toPx(offset, 'height', $el);
7725
7763
  },
7726
7764
 
7727
7765
  selTarget: function(ref, $el) {
@@ -7788,7 +7826,7 @@
7788
7826
  var this$1$1 = this;
7789
7827
 
7790
7828
 
7791
- if (!(this.targetOffset !== false && location.hash && window.pageYOffset > 0)) {
7829
+ if (!(this.targetOffset !== false && location.hash && scrollTop(window) > 0)) {
7792
7830
  return;
7793
7831
  }
7794
7832
 
@@ -7821,6 +7859,7 @@
7821
7859
 
7822
7860
  read: function(ref, types) {
7823
7861
  var height$1 = ref.height;
7862
+ var margin = ref.margin;
7824
7863
 
7825
7864
 
7826
7865
  this.inactive = !this.matchMedia || !isVisible(this.$el);
@@ -7829,46 +7868,56 @@
7829
7868
  return false;
7830
7869
  }
7831
7870
 
7832
- if (this.isActive && types.has('resize')) {
7871
+ var hide = this.isActive && types.has('resize');
7872
+ if (hide) {
7833
7873
  this.hide();
7834
- height$1 = this.$el.offsetHeight;
7835
- this.show();
7836
7874
  }
7837
7875
 
7838
- height$1 = this.isActive ? height$1 : this.$el.offsetHeight;
7876
+ if (!this.isActive) {
7877
+ height$1 = this.$el.offsetHeight;
7878
+ margin = css(this.$el, 'margin');
7879
+ }
7839
7880
 
7840
- if (height$1 + this.offset > height(window)) {
7841
- this.inactive = true;
7842
- return false;
7881
+ if (hide) {
7882
+ this.show();
7843
7883
  }
7844
7884
 
7885
+ var overflow = Math.max(0, height$1 + this.offset - height(window));
7886
+
7845
7887
  var referenceElement = this.isFixed ? this.placeholder : this.$el;
7846
- this.topOffset = offset(referenceElement).top;
7847
- this.bottomOffset = this.topOffset + height$1;
7848
- this.offsetParentTop = offset(referenceElement.offsetParent).top;
7888
+ var topOffset = offset(referenceElement).top;
7889
+ var offsetParentTop = offset(referenceElement.offsetParent).top;
7849
7890
 
7850
- var bottom = parseProp('bottom', this);
7891
+ var top = parseProp(this.top, this.$el, topOffset);
7892
+ var bottom = parseProp(this.bottom, this.$el, topOffset + height$1);
7851
7893
 
7852
- this.top = Math.max(toFloat(parseProp('top', this)), this.topOffset) - this.offset;
7853
- this.bottom = bottom && bottom - this.$el.offsetHeight;
7854
- this.width = dimensions(isVisible(this.widthElement) ? this.widthElement : this.$el).width;
7894
+ var start = Math.max(top, topOffset) - this.offset;
7895
+ var end = bottom
7896
+ ? bottom - this.$el.offsetHeight + overflow - this.offset
7897
+ : getScrollingElement(this.$el).scrollHeight - height(window);
7855
7898
 
7856
7899
  return {
7900
+ start: start,
7901
+ end: end,
7902
+ overflow: overflow,
7903
+ topOffset: topOffset,
7904
+ offsetParentTop: offsetParentTop,
7857
7905
  height: height$1,
7858
- top: offsetPosition(this.placeholder)[0],
7859
- margins: css(this.$el, ['marginTop', 'marginBottom', 'marginLeft', 'marginRight'])
7906
+ margin: margin,
7907
+ width: dimensions(isVisible(this.widthElement) ? this.widthElement : this.$el).width,
7908
+ top: offsetPosition(this.placeholder)[0]
7860
7909
  };
7861
7910
  },
7862
7911
 
7863
7912
  write: function(ref) {
7864
7913
  var height = ref.height;
7865
- var margins = ref.margins;
7914
+ var margin = ref.margin;
7866
7915
 
7867
7916
 
7868
7917
  var ref$1 = this;
7869
7918
  var placeholder = ref$1.placeholder;
7870
7919
 
7871
- css(placeholder, assign({height: height}, margins));
7920
+ css(placeholder, {height: height, margin: margin});
7872
7921
 
7873
7922
  if (!within(placeholder, document)) {
7874
7923
  after(this.$el, placeholder);
@@ -7886,14 +7935,29 @@
7886
7935
  {
7887
7936
 
7888
7937
  read: function(ref) {
7889
- var scroll = ref.scroll; if ( scroll === void 0 ) scroll = 0;
7938
+ var prevScroll = ref.scroll; if ( prevScroll === void 0 ) prevScroll = 0;
7939
+ var prevDir = ref.dir; if ( prevDir === void 0 ) prevDir = 'down';
7940
+ var overflow = ref.overflow;
7941
+ var overflowScroll = ref.overflowScroll; if ( overflowScroll === void 0 ) overflowScroll = 0;
7942
+ var start = ref.start;
7943
+ var end = ref.end;
7890
7944
 
7891
7945
 
7892
- this.scroll = window.pageYOffset;
7946
+ var scroll = scrollTop(window);
7947
+ var dir = prevScroll <= scroll ? 'down' : 'up';
7893
7948
 
7894
7949
  return {
7895
- dir: scroll <= this.scroll ? 'down' : 'up',
7896
- scroll: this.scroll
7950
+ dir: dir,
7951
+ prevDir: prevDir,
7952
+ scroll: scroll,
7953
+ prevScroll: prevScroll,
7954
+ overflowScroll: clamp(
7955
+ overflowScroll
7956
+ + clamp(scroll, start, end)
7957
+ - clamp(prevScroll, start, end),
7958
+ 0,
7959
+ overflow
7960
+ )
7897
7961
  };
7898
7962
  },
7899
7963
 
@@ -7901,35 +7965,34 @@
7901
7965
  var this$1$1 = this;
7902
7966
 
7903
7967
 
7904
- var now = Date.now();
7905
7968
  var isScrollUpdate = types.has('scroll');
7906
7969
  var initTimestamp = data.initTimestamp; if ( initTimestamp === void 0 ) initTimestamp = 0;
7907
7970
  var dir = data.dir;
7908
- var lastDir = data.lastDir;
7909
- var lastScroll = data.lastScroll;
7971
+ var prevDir = data.prevDir;
7910
7972
  var scroll = data.scroll;
7973
+ var prevScroll = data.prevScroll; if ( prevScroll === void 0 ) prevScroll = 0;
7911
7974
  var top = data.top;
7975
+ var start = data.start;
7976
+ var topOffset = data.topOffset;
7977
+ var height = data.height;
7912
7978
 
7913
- data.lastScroll = scroll;
7914
-
7915
- if (scroll < 0 || scroll === lastScroll && isScrollUpdate || this.showOnUp && !isScrollUpdate && !this.isFixed) {
7979
+ if (scroll < 0 || scroll === prevScroll && isScrollUpdate || this.showOnUp && !isScrollUpdate && !this.isFixed) {
7916
7980
  return;
7917
7981
  }
7918
7982
 
7919
- if (now - initTimestamp > 300 || dir !== lastDir) {
7983
+ var now = Date.now();
7984
+ if (now - initTimestamp > 300 || dir !== prevDir) {
7920
7985
  data.initScroll = scroll;
7921
7986
  data.initTimestamp = now;
7922
7987
  }
7923
7988
 
7924
- data.lastDir = dir;
7925
-
7926
- if (this.showOnUp && !this.isFixed && Math.abs(data.initScroll - scroll) <= 30 && Math.abs(lastScroll - scroll) <= 10) {
7989
+ if (this.showOnUp && !this.isFixed && Math.abs(data.initScroll - scroll) <= 30 && Math.abs(prevScroll - scroll) <= 10) {
7927
7990
  return;
7928
7991
  }
7929
7992
 
7930
7993
  if (this.inactive
7931
- || scroll < this.top
7932
- || this.showOnUp && (scroll <= this.top || dir === 'down' && isScrollUpdate || dir === 'up' && !this.isFixed && scroll <= this.bottomOffset)
7994
+ || scroll < start
7995
+ || this.showOnUp && (scroll <= start || dir === 'down' && isScrollUpdate || dir === 'up' && !this.isFixed && scroll <= topOffset + height)
7933
7996
  ) {
7934
7997
 
7935
7998
  if (!this.isFixed) {
@@ -7944,7 +8007,7 @@
7944
8007
 
7945
8008
  this.isFixed = false;
7946
8009
 
7947
- if (this.animation && scroll > this.topOffset) {
8010
+ if (this.animation && scroll > topOffset) {
7948
8011
  Animation.cancel(this.$el);
7949
8012
  Animation.out(this.$el, this.animation).then(function () { return this$1$1.hide(); }, noop);
7950
8013
  } else {
@@ -7994,23 +8057,37 @@
7994
8057
 
7995
8058
  update: function() {
7996
8059
 
7997
- var active = this.top !== 0 || this.scroll > this.top;
7998
- var top = Math.max(0, this.offset);
8060
+ var ref = this._data;
8061
+ var width = ref.width;
8062
+ var scroll = ref.scroll; if ( scroll === void 0 ) scroll = 0;
8063
+ var overflow = ref.overflow;
8064
+ var overflowScroll = ref.overflowScroll; if ( overflowScroll === void 0 ) overflowScroll = 0;
8065
+ var start = ref.start;
8066
+ var end = ref.end;
8067
+ var topOffset = ref.topOffset;
8068
+ var height = ref.height;
8069
+ var offsetParentTop = ref.offsetParentTop;
8070
+ var active = start !== 0 || scroll > start;
8071
+ var top = this.offset;
7999
8072
  var position = 'fixed';
8000
8073
 
8001
- if (isNumeric(this.bottom) && this.scroll > this.bottom - this.offset) {
8002
- top = this.bottom - this.offsetParentTop;
8074
+ if (scroll > end) {
8075
+ top = end + this.offset - offsetParentTop;
8003
8076
  position = 'absolute';
8004
8077
  }
8005
8078
 
8079
+ if (overflow) {
8080
+ top -= overflowScroll;
8081
+ }
8082
+
8006
8083
  css(this.$el, {
8007
8084
  position: position,
8008
8085
  top: (top + "px"),
8009
- width: this.width
8086
+ width: width
8010
8087
  });
8011
8088
 
8012
8089
  this.isActive = active;
8013
- toggleClass(this.$el, this.clsBelow, this.scroll > this.bottomOffset);
8090
+ toggleClass(this.$el, this.clsBelow, scroll > topOffset + height);
8014
8091
  addClass(this.$el, this.clsFixed);
8015
8092
 
8016
8093
  }
@@ -8019,16 +8096,10 @@
8019
8096
 
8020
8097
  };
8021
8098
 
8022
- function parseProp(prop, ref) {
8023
- var $props = ref.$props;
8024
- var $el = ref.$el;
8025
- var propOffset = ref[(prop + "Offset")];
8026
-
8027
-
8028
- var value = $props[prop];
8099
+ function parseProp(value, el, propOffset) {
8029
8100
 
8030
8101
  if (!value) {
8031
- return;
8102
+ return 0;
8032
8103
  }
8033
8104
 
8034
8105
  if (isString(value) && value.match(/^-?\d/)) {
@@ -8037,7 +8108,7 @@
8037
8108
 
8038
8109
  } else {
8039
8110
 
8040
- return offset(value === true ? parent($el) : query(value, $el)).bottom;
8111
+ return offset(value === true ? parent(el) : query(value, el)).bottom;
8041
8112
 
8042
8113
  }
8043
8114
  }