uikit 3.11.1 → 3.11.2-dev.78e397546

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 +14 -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 +2 -2
  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 +127 -67
  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 +190 -135
  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/slider.js +1 -1
  45. package/src/js/components/sortable.js +1 -2
  46. package/src/js/core/core.js +2 -2
  47. package/src/js/core/height-viewport.js +2 -2
  48. package/src/js/core/sticky.js +68 -42
  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 +43 -40
  54. package/tests/sticky.html +45 -24
@@ -1,4 +1,4 @@
1
- /*! UIkit 3.11.1 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
1
+ /*! UIkit 3.11.2-dev.78e397546 | 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.1';
3484
+ UIkit.version = '3.11.2-dev.78e397546';
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) {
@@ -7687,6 +7706,7 @@
7687
7706
  mixins: [Class, Media],
7688
7707
 
7689
7708
  props: {
7709
+ position: String,
7690
7710
  top: null,
7691
7711
  bottom: Boolean,
7692
7712
  offset: String,
@@ -7702,6 +7722,7 @@
7702
7722
  },
7703
7723
 
7704
7724
  data: {
7725
+ position: 'top',
7705
7726
  top: 0,
7706
7727
  bottom: false,
7707
7728
  offset: 0,
@@ -7718,10 +7739,23 @@
7718
7739
 
7719
7740
  computed: {
7720
7741
 
7721
- offset: function(ref) {
7742
+ position: function(ref, $el) {
7743
+ var position = ref.position;
7744
+
7745
+ return position === 'auto'
7746
+ ? (this.isFixed ? this.placeholder : $el).offsetHeight > height(window)
7747
+ ? 'bottom'
7748
+ : 'top'
7749
+ : position;
7750
+ },
7751
+
7752
+ offset: function(ref, $el) {
7722
7753
  var offset = ref.offset;
7723
7754
 
7724
- return toPx(offset);
7755
+ if (this.position === 'bottom') {
7756
+ offset += '+100vh-100%';
7757
+ }
7758
+ return toPx(offset, 'height', $el);
7725
7759
  },
7726
7760
 
7727
7761
  selTarget: function(ref, $el) {
@@ -7788,7 +7822,7 @@
7788
7822
  var this$1$1 = this;
7789
7823
 
7790
7824
 
7791
- if (!(this.targetOffset !== false && location.hash && window.pageYOffset > 0)) {
7825
+ if (!(this.targetOffset !== false && location.hash && scrollTop(window) > 0)) {
7792
7826
  return;
7793
7827
  }
7794
7828
 
@@ -7837,24 +7871,28 @@
7837
7871
 
7838
7872
  height$1 = this.isActive ? height$1 : this.$el.offsetHeight;
7839
7873
 
7840
- if (height$1 + this.offset > height(window)) {
7841
- this.inactive = true;
7842
- return false;
7843
- }
7874
+ var overflow = Math.max(0, height$1 + this.offset - height(window));
7844
7875
 
7845
7876
  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;
7877
+ var topOffset = offset(referenceElement).top;
7878
+ var offsetParentTop = offset(referenceElement.offsetParent).top;
7849
7879
 
7850
- var bottom = parseProp('bottom', this);
7880
+ var top = parseProp(this.top, this.$el, topOffset);
7881
+ var bottom = parseProp(this.bottom, this.$el, topOffset + height$1);
7851
7882
 
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;
7883
+ var start = Math.max(top, topOffset) - this.offset;
7884
+ var end = bottom
7885
+ ? bottom - this.$el.offsetHeight + overflow - this.offset
7886
+ : getScrollingElement(this.$el).scrollHeight - height(window);
7855
7887
 
7856
7888
  return {
7889
+ start: start,
7890
+ end: end,
7891
+ overflow: overflow,
7892
+ topOffset: topOffset,
7893
+ offsetParentTop: offsetParentTop,
7857
7894
  height: height$1,
7895
+ width: dimensions(isVisible(this.widthElement) ? this.widthElement : this.$el).width,
7858
7896
  top: offsetPosition(this.placeholder)[0],
7859
7897
  margins: css(this.$el, ['marginTop', 'marginBottom', 'marginLeft', 'marginRight'])
7860
7898
  };
@@ -7886,14 +7924,29 @@
7886
7924
  {
7887
7925
 
7888
7926
  read: function(ref) {
7889
- var scroll = ref.scroll; if ( scroll === void 0 ) scroll = 0;
7927
+ var prevScroll = ref.scroll; if ( prevScroll === void 0 ) prevScroll = 0;
7928
+ var prevDir = ref.dir; if ( prevDir === void 0 ) prevDir = 'down';
7929
+ var overflow = ref.overflow;
7930
+ var overflowScroll = ref.overflowScroll; if ( overflowScroll === void 0 ) overflowScroll = 0;
7931
+ var start = ref.start;
7932
+ var end = ref.end;
7890
7933
 
7891
7934
 
7892
- this.scroll = window.pageYOffset;
7935
+ var scroll = scrollTop(window);
7936
+ var dir = prevScroll <= scroll ? 'down' : 'up';
7893
7937
 
7894
7938
  return {
7895
- dir: scroll <= this.scroll ? 'down' : 'up',
7896
- scroll: this.scroll
7939
+ dir: dir,
7940
+ prevDir: prevDir,
7941
+ scroll: scroll,
7942
+ prevScroll: prevScroll,
7943
+ overflowScroll: clamp(
7944
+ overflowScroll
7945
+ + clamp(scroll, start, end)
7946
+ - clamp(prevScroll, start, end),
7947
+ 0,
7948
+ overflow
7949
+ )
7897
7950
  };
7898
7951
  },
7899
7952
 
@@ -7901,35 +7954,34 @@
7901
7954
  var this$1$1 = this;
7902
7955
 
7903
7956
 
7904
- var now = Date.now();
7905
7957
  var isScrollUpdate = types.has('scroll');
7906
7958
  var initTimestamp = data.initTimestamp; if ( initTimestamp === void 0 ) initTimestamp = 0;
7907
7959
  var dir = data.dir;
7908
- var lastDir = data.lastDir;
7909
- var lastScroll = data.lastScroll;
7960
+ var prevDir = data.prevDir;
7910
7961
  var scroll = data.scroll;
7962
+ var prevScroll = data.prevScroll; if ( prevScroll === void 0 ) prevScroll = 0;
7911
7963
  var top = data.top;
7964
+ var start = data.start;
7965
+ var topOffset = data.topOffset;
7966
+ var height = data.height;
7912
7967
 
7913
- data.lastScroll = scroll;
7914
-
7915
- if (scroll < 0 || scroll === lastScroll && isScrollUpdate || this.showOnUp && !isScrollUpdate && !this.isFixed) {
7968
+ if (scroll < 0 || scroll === prevScroll && isScrollUpdate || this.showOnUp && !isScrollUpdate && !this.isFixed) {
7916
7969
  return;
7917
7970
  }
7918
7971
 
7919
- if (now - initTimestamp > 300 || dir !== lastDir) {
7972
+ var now = Date.now();
7973
+ if (now - initTimestamp > 300 || dir !== prevDir) {
7920
7974
  data.initScroll = scroll;
7921
7975
  data.initTimestamp = now;
7922
7976
  }
7923
7977
 
7924
- data.lastDir = dir;
7925
-
7926
- if (this.showOnUp && !this.isFixed && Math.abs(data.initScroll - scroll) <= 30 && Math.abs(lastScroll - scroll) <= 10) {
7978
+ if (this.showOnUp && !this.isFixed && Math.abs(data.initScroll - scroll) <= 30 && Math.abs(prevScroll - scroll) <= 10) {
7927
7979
  return;
7928
7980
  }
7929
7981
 
7930
7982
  if (this.inactive
7931
- || scroll < this.top
7932
- || this.showOnUp && (scroll <= this.top || dir === 'down' && isScrollUpdate || dir === 'up' && !this.isFixed && scroll <= this.bottomOffset)
7983
+ || scroll < start
7984
+ || this.showOnUp && (scroll <= start || dir === 'down' && isScrollUpdate || dir === 'up' && !this.isFixed && scroll <= topOffset + height)
7933
7985
  ) {
7934
7986
 
7935
7987
  if (!this.isFixed) {
@@ -7944,7 +7996,7 @@
7944
7996
 
7945
7997
  this.isFixed = false;
7946
7998
 
7947
- if (this.animation && scroll > this.topOffset) {
7999
+ if (this.animation && scroll > topOffset) {
7948
8000
  Animation.cancel(this.$el);
7949
8001
  Animation.out(this.$el, this.animation).then(function () { return this$1$1.hide(); }, noop);
7950
8002
  } else {
@@ -7994,23 +8046,37 @@
7994
8046
 
7995
8047
  update: function() {
7996
8048
 
7997
- var active = this.top !== 0 || this.scroll > this.top;
7998
- var top = Math.max(0, this.offset);
8049
+ var ref = this._data;
8050
+ var width = ref.width;
8051
+ var scroll = ref.scroll; if ( scroll === void 0 ) scroll = 0;
8052
+ var overflow = ref.overflow;
8053
+ var overflowScroll = ref.overflowScroll; if ( overflowScroll === void 0 ) overflowScroll = 0;
8054
+ var start = ref.start;
8055
+ var end = ref.end;
8056
+ var topOffset = ref.topOffset;
8057
+ var height = ref.height;
8058
+ var offsetParentTop = ref.offsetParentTop;
8059
+ var active = start !== 0 || scroll > start;
8060
+ var top = this.offset;
7999
8061
  var position = 'fixed';
8000
8062
 
8001
- if (isNumeric(this.bottom) && this.scroll > this.bottom - this.offset) {
8002
- top = this.bottom - this.offsetParentTop;
8063
+ if (scroll > end) {
8064
+ top = end + this.offset - offsetParentTop;
8003
8065
  position = 'absolute';
8004
8066
  }
8005
8067
 
8068
+ if (overflow) {
8069
+ top -= overflowScroll;
8070
+ }
8071
+
8006
8072
  css(this.$el, {
8007
8073
  position: position,
8008
8074
  top: (top + "px"),
8009
- width: this.width
8075
+ width: width
8010
8076
  });
8011
8077
 
8012
8078
  this.isActive = active;
8013
- toggleClass(this.$el, this.clsBelow, this.scroll > this.bottomOffset);
8079
+ toggleClass(this.$el, this.clsBelow, scroll > topOffset + height);
8014
8080
  addClass(this.$el, this.clsFixed);
8015
8081
 
8016
8082
  }
@@ -8019,16 +8085,10 @@
8019
8085
 
8020
8086
  };
8021
8087
 
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];
8088
+ function parseProp(value, el, propOffset) {
8029
8089
 
8030
8090
  if (!value) {
8031
- return;
8091
+ return 0;
8032
8092
  }
8033
8093
 
8034
8094
  if (isString(value) && value.match(/^-?\d/)) {
@@ -8037,7 +8097,7 @@
8037
8097
 
8038
8098
  } else {
8039
8099
 
8040
- return offset(value === true ? parent($el) : query(value, $el)).bottom;
8100
+ return offset(value === true ? parent(el) : query(value, el)).bottom;
8041
8101
 
8042
8102
  }
8043
8103
  }