react-ui-basics 0.0.157 → 0.0.160

package/FilteredList.js

@@ -1,3 +1,4 @@
+import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, target as __target, top as __top, value as __value, width as __width} from "./CommonFields";
 import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, createClass as _createClass, objectSpread2 as _objectSpread2 } from './_virtual/_rollupPluginBabelHelpers.js';
 import {toConsumableArray as __toConsumableArray} from "./_virtual/_rollupPluginBabelHelpers";
 import {extends as __extends} from "./_virtual/_rollupPluginBabelHelpers";
@@ -21,7 +22,7 @@ var FilteredList = function (_PureComponent) {
     _classCallCheck(this, FilteredList);
     _this = _super.call(this, _props);
     _this.updateList = function (props) {
-      var data = props.data;
+      var data = __data(props);
       var selected = _this.state.selected;
       _this.list = data || [];
       if (!_this.list.includes(selected)) _this.setState({
@@ -54,10 +55,10 @@ var FilteredList = function (_PureComponent) {
         return selected === id;
       });
       if (_this.hidden[list[position]]) position = -1;
-      while (++position < list.length) {
+      while (++position < __length(list)) {
         if (!_this.hidden[list[position]]) break;
       }
-      if (position < list.length) {
+      if (position < __length(list)) {
         var id = list[position];
         _this.setState({
           selected: id
@@ -71,7 +72,7 @@ var FilteredList = function (_PureComponent) {
       var position = list.findIndex(function (id) {
         return selected === id;
       });
-      if (_this.hidden[list[position]]) position = list.length;
+      if (_this.hidden[list[position]]) position = __length(list);
       while (--position >= 0) {
         if (!_this.hidden[list[position]]) break;
       }
@@ -88,9 +89,9 @@ var FilteredList = function (_PureComponent) {
       var container = _this.el;
       var scrollTop = container.getScroll();
       var height = container.getHeight();
-      var isVisible = scrollTop <= child.offsetTop && scrollTop + height >= child.offsetTop + child.clientHeight;
+      var isVisible = scrollTop <= child.offsetTop && scrollTop + height >= child.offsetTop + __clientHeight(child);
       if (!isVisible) {
-        var scrollToBottom = child.offsetTop + child.clientHeight - height;
+        var scrollToBottom = child.offsetTop + __clientHeight(child) - height;
         var scrollToTop = child.offsetTop;
         if (Math.abs(scrollTop - scrollToTop) < Math.abs(scrollTop - scrollToBottom)) {
           container.setScroll(scrollToTop);
@@ -127,7 +128,7 @@ var FilteredList = function (_PureComponent) {
   }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps, prevState, snapshot) {
-      if (this.props.data === prevProps.data) return;
+      if (this.props.data === __data(prevProps)) return;
       this.updateList(this.props);
     }
   }, {
@@ -135,15 +136,15 @@ var FilteredList = function (_PureComponent) {
     value: function render() {
       var _this2 = this;
       var _this$props = this.props,
-          data = _this$props.data,
+          data = __data(_this$props),
           labels = _this$props.labels,
           filter = _this$props.filter,
-          className = _this$props.className,
+          className = _this$props[__className],
           selected = _this$props.selected,
           inline = _this$props.inline,
           childComponent = _this$props.childComponent,
           childProps = _this$props.childProps,
-          style = _this$props.style,
+          style = __style(_this$props),
           scroll = _this$props.scroll;
       return ReactCreateElement(Scrollable, {
         [__className]: classNames('FilteredList', className, inline ? 'inline' : 'popup'),
@@ -216,7 +217,7 @@ var ItemWrapper = function (_React$Component) {
           onMouseEnter = _this$props2.onMouseEnter,
           onMouseLeave = _this$props2.onMouseLeave,
           classProvider = _this$props2.classProvider,
-          className = _this$props2.className,
+          className = _this$props2[__className],
           childComponent = _this$props2.childComponent,
           childProps = _this$props2.childProps;
       var child = React.createElement(childComponent, _objectSpread2(_objectSpread2({}, childProps), {}, {
@@ -226,7 +227,7 @@ var ItemWrapper = function (_React$Component) {
           return _this3.data = data;
         }
       }));
-      var cssClass = orNoop(classProvider)(this.data);
+      var cssClass = orNoop(classProvider)(__data(this));
       return ReactCreateElement("div", {
         [__className]: classNames('ItemWrapper', cssClass, className),
         onMouseEnter: onMouseEnter,

package/FloatingActionButton.js

@@ -1,3 +1,4 @@
+import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, target as __target, top as __top, value as __value, width as __width} from "./CommonFields";
 import 'react';
 import {toConsumableArray as __toConsumableArray} from "./_virtual/_rollupPluginBabelHelpers";
 import {extends as __extends} from "./_virtual/_rollupPluginBabelHelpers";
@@ -14,7 +15,7 @@ var FloatingActionButton = function FloatingActionButton(_ref) {
   var icon = _ref.icon,
       onClick = _ref.onClick,
       mini = _ref.mini,
-      className = _ref.className,
+      className = _ref[__className],
       hidden = _ref.hidden;
   return ReactCreateElement(Button, {
     onClick: onClick,

package/FormUploadProgress.js

@@ -1,3 +1,4 @@
+import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, target as __target, top as __top, value as __value, width as __width} from "./CommonFields";
 import React from 'react';
 import {toConsumableArray as __toConsumableArray} from "./_virtual/_rollupPluginBabelHelpers";
 import {extends as __extends} from "./_virtual/_rollupPluginBabelHelpers";
@@ -19,7 +20,7 @@ var defaultValueFormat = function defaultValueFormat(value, loaded, total) {
   return ReactCreateElement(React.Fragment, null, formatNumberWithMaxLength(loaded, 1, abbreviation, 4), "/", formatNumberWithMaxLength(total, 1, abbreviation, 4), ReactCreateElement("br", null), abbreviation);
 };
 var FormUploadProgress = function FormUploadProgress(_ref) {
-  var value = _ref.value,
+  var value = __value(_ref),
       cancel = _ref.cancel,
       loaded = _ref.loaded,
       total = _ref.total,

package/ImageGallery.js

@@ -1,3 +1,4 @@
+import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, target as __target, top as __top, value as __value, width as __width} from "./CommonFields";
 import { createClass as _createClass, classCallCheck as _classCallCheck, objectSpread2 as _objectSpread2, defineProperty as _defineProperty, inherits as _inherits, createSuper as _createSuper, assertThisInitialized as _assertThisInitialized, slicedToArray as _slicedToArray, extends as _extends, toConsumableArray as _toConsumableArray } from './_virtual/_rollupPluginBabelHelpers.js';
 import {toConsumableArray as __toConsumableArray} from "./_virtual/_rollupPluginBabelHelpers";
 import {extends as __extends} from "./_virtual/_rollupPluginBabelHelpers";
@@ -25,8 +26,8 @@ var previewWidth = previewRatio * previewHeight;
 var previewPadding = 8;
 var previewsHeight = previewHeight + 15;
 var calculatePosition = function calculatePosition(it, ratio, width, height, previewsHeight, embedded, container) {
-  var windowWidth = embedded ? container.clientWidth : min(DOCUMENT.body.clientWidth, WINDOW.innerWidth);
-  var windowHeight = embedded ? container.clientHeight : min(DOCUMENT.body.clientHeight, WINDOW.innerHeight);
+  var windowWidth = embedded ? __clientWidth(container) : min(DOCUMENT.body.clientWidth, WINDOW.innerWidth);
+  var windowHeight = embedded ? __clientHeight(container) : min(DOCUMENT.body.clientHeight, WINDOW.innerHeight);
   var offset = it.offset;
   if (offset == null) offset = embedded ? 0 : windowHeight * 0.03;
   var offsetTop = it.offsetTop;
@@ -116,7 +117,7 @@ var Actions = _createClass(function Actions() {
 Actions.replaceImages = function (images) {
   return function (dispatch, getState) {
     var state = getState();
-    var length = images.length;
+    var length = __length(images);
     var nextState = _objectSpread2({}, state);
     nextState.images = images.map(function (item) {
       var image = state.images.find(function (it) {
@@ -127,13 +128,13 @@ Actions.replaceImages = function (images) {
       var el = it.el;
       if (el) {
         var rect = el.getBoundingClientRect();
-        var fromWidth = el.clientWidth;
-        var fromHeight = el.clientHeight;
-        it.fromLeftPx = toPx(rect.left);
-        it.fromTopPx = toPx(rect.top);
+        var fromWidth = __clientWidth(el);
+        var fromHeight = __clientHeight(el);
+        it.fromLeftPx = toPx(__left(rect));
+        it.fromTopPx = toPx(__top(rect));
         it.fromWidthPx = toPx(fromWidth);
         var ratio = fromWidth / fromHeight;
-        calculatePosition(it, ratio, el.naturalWidth || el.width, el.naturalHeight || el.height, withPreviews ? previewsHeight : 0, embedded, container);
+        calculatePosition(it, ratio, el.naturalWidth || __width(el), el.naturalHeight || __height(el), withPreviews ? previewsHeight : 0, embedded, container);
       } else {
         it.toLeft = 100;
         it.toTop = 100;
@@ -150,8 +151,8 @@ Actions.replaceImages = function (images) {
       if (preview) return preview;
       var el = item.el;
       if (!el) return {};
-      var width = el.clientWidth;
-      var height = el.clientHeight;
+      var width = __clientWidth(el);
+      var height = __clientHeight(el);
       return calculatePreview(width, height, el.src);
     });
     dispatch({
@@ -163,7 +164,7 @@ Actions.replaceImages = function (images) {
 Actions.show = function (gallery) {
   return function (dispatch) {
     var images = gallery.images;
-    var length = images.length;
+    var length = __length(images);
     var withPreviews = length > 1 && (gallery.withPreviews === UNDEFINED || !!gallery.withPreviews);
     var container = gallery.container;
     var embedded = gallery.embedded;
@@ -178,13 +179,13 @@ Actions.show = function (gallery) {
         var el = it.el;
         if (el) {
           var rect = el.getBoundingClientRect();
-          var fromWidth = el.clientWidth;
-          var fromHeight = el.clientHeight;
-          it.fromLeftPx = toPx(rect.left);
-          it.fromTopPx = toPx(rect.top);
+          var fromWidth = __clientWidth(el);
+          var fromHeight = __clientHeight(el);
+          it.fromLeftPx = toPx(__left(rect));
+          it.fromTopPx = toPx(__top(rect));
           it.fromWidthPx = toPx(fromWidth);
           var ratio = fromWidth / fromHeight;
-          calculatePosition(it, ratio, el.naturalWidth || el.width, el.naturalHeight || el.height, withPreviews ? previewsHeight : 0, embedded, container);
+          calculatePosition(it, ratio, el.naturalWidth || __width(el), el.naturalHeight || __height(el), withPreviews ? previewsHeight : 0, embedded, container);
         } else {
           it.toLeft = 100;
           it.toTop = 100;
@@ -200,8 +201,8 @@ Actions.show = function (gallery) {
         images: images.map(function (it) {
           var el = it.el;
           if (!el) return {};
-          var width = el.clientWidth;
-          var height = el.clientHeight;
+          var width = __clientWidth(el);
+          var height = __clientHeight(el);
           return calculatePreview(width, height, el.src);
         })
       }
@@ -273,7 +274,7 @@ Actions.loadPreview = function (item) {
   };
 };
 var reducers = (_reducers = {}, _defineProperty(_reducers, ACTION_IMAGE_GALLERY_SHOW, function (state, action) {
-  return _objectSpread2(_objectSpread2({}, action.data), {}, {
+  return _objectSpread2(_objectSpread2({}, __data(action)), {}, {
     open: true
   });
 }), _defineProperty(_reducers, ACTION_IMAGE_GALLERY_CLOSE, function (state, action) {
@@ -285,11 +286,11 @@ var reducers = (_reducers = {}, _defineProperty(_reducers, ACTION_IMAGE_GALLERY_
   var result = _objectSpread2(_objectSpread2({}, state), {}, {
     images: images
   });
-  for (var i = 0; i < images.length; i++) {
+  for (var i = 0; i < __length(images); i++) {
     if (!images[i].width && !images[i].fromWidthPx) continue;
     var it = _objectSpread2({}, images[i]);
-    var width = it.width || Number.parseInt(it.fromWidthPx);
-    var height = it.height || Number.parseInt(it.fromHeightPx);
+    var width = __width(it) || Number.parseInt(it.fromWidthPx);
+    var height = __height(it) || Number.parseInt(it.fromHeightPx);
     calculatePosition(it, width / height, width, height, result.previews.show ? previewsHeight : 0, state.embedded, state.container);
     images[i] = it;
   }
@@ -304,8 +305,8 @@ var reducers = (_reducers = {}, _defineProperty(_reducers, ACTION_IMAGE_GALLERY_
   var index = images.findIndex(function (it) {
     return it.id === item.id;
   });
-  var width = image.width;
-  var height = image.height;
+  var width = __width(image);
+  var height = __height(image);
   var it = _objectSpread2(_objectSpread2({}, images[index]), {}, {
     loaded: true,
     width: width,
@@ -325,11 +326,11 @@ var reducers = (_reducers = {}, _defineProperty(_reducers, ACTION_IMAGE_GALLERY_
     return it.id === item.id;
   });
   var it = _objectSpread2({}, images[index]);
-  if (!it.toWidth || !it.toHeight) calculatePosition(it, image.width / image.height, image.width, image.height, result.previews.show ? previewsHeight : 0, state.embedded, state.container);
+  if (!it.toWidth || !it.toHeight) calculatePosition(it, __width(image) / __height(image), __width(image), __height(image), result.previews.show ? previewsHeight : 0, state.embedded, state.container);
   images[index] = it;
   var previewImages = _toConsumableArray(state.previews.images);
   result.previews.images = previewImages;
-  var preview = calculatePreview(image.width, image.height, image.src);
+  var preview = calculatePreview(__width(image), __height(image), image.src);
   previewImages[index] = preview;
   return result;
 }), _reducers);
@@ -387,7 +388,7 @@ var ImageGallery = function (_React$Component) {
       var indexValue = index() !== UNDEFINED ? index() : props().index;
       var image = images[indexValue];
       if (!image) {
-        var i = images.length - 1;
+        var i = __length(images) - 1;
         if (i === -1) {
           if (prevProps.images !== images) {
             onClose();
@@ -451,22 +452,22 @@ var ImageGallery = function (_React$Component) {
     var resetZoom = function resetZoom() {
       if (!zoomed()) return;
       zoomed(false);
-      zoomedImage.style.width = defaultWidth;
-      zoomedImage.style.left = defaultLeft;
-      zoomedImage.style.top = defaultTop;
-      zoomedImage.style.transition = null;
+      __style(zoomedImage).width = defaultWidth;
+      __style(zoomedImage).left = defaultLeft;
+      __style(zoomedImage).top = defaultTop;
+      __style(zoomedImage).transition = null;
       touchpadStarted = null;
     };
     var initZoom = function initZoom() {
       zoomed(true);
-      defaultWidth = zoomedImage.style.width;
-      defaultLeft = zoomedImage.style.left;
-      defaultTop = zoomedImage.style.top;
+      defaultWidth = __style(zoomedImage).width;
+      defaultLeft = __style(zoomedImage).left;
+      defaultTop = __style(zoomedImage).top;
     };
     var initTouchpadDragging = function initTouchpadDragging() {
-      oldLeft = Number.parseFloat(zoomedImage.style.left);
-      oldTop = Number.parseFloat(zoomedImage.style.top);
-      zoomedImage.style.transition = 'none';
+      oldLeft = Number.parseFloat(__style(zoomedImage).left);
+      oldTop = Number.parseFloat(__style(zoomedImage).top);
+      __style(zoomedImage).transition = 'none';
       touchpadStarted = true;
     };
     var onWheel = function onWheel(e) {
@@ -478,33 +479,33 @@ var ImageGallery = function (_React$Component) {
       if (e.ctrlKey) {
         var diff = e.deltaY * 0.005;
         var newZoom = Math.min(Math.max(zoomValue + diff, 0.5), 10);
-        var zoomX = e.pageX;
+        var zoomX = __pageX(e);
         oldLeft = zoomX - (zoomX - oldLeft) * newZoom / zoomValue;
-        var zoomY = e.pageY;
+        var zoomY = __pageY(e);
         oldTop = zoomY - (zoomY - oldTop) * newZoom / zoomValue;
         zoomValue = newZoom;
-        zoomedImage.style.width = zoomValue * 100 + '%';
+        __style(zoomedImage).width = zoomValue * 100 + '%';
       } else {
         oldLeft += e.deltaX * 0.5;
         oldTop += e.deltaY * 0.5;
       }
-      zoomedImage.style.left = oldLeft + 'px';
-      zoomedImage.style.top = oldTop + 'px';
+      __style(zoomedImage).left = oldLeft + 'px';
+      __style(zoomedImage).top = oldTop + 'px';
     };
     var moveListenerAdded;
     var onTouchStart = function onTouchStart(e) {
       e.swipeProcessed = false;
       if (e.button === 2) return;
       var touches = e.touches || [{
-        pageX: e.pageX,
-        pageY: e.pageY
+        pageX: __pageX(e),
+        pageY: __pageY(e)
       }];
-      zoomedImage = e.target;
+      zoomedImage = __target(e);
       zoomedImage = zoomedImage.tagName.toLowerCase() === 'img' ? zoomedImage.parentElement : zoomedImage;
-      oldLeft = Number.parseFloat(zoomedImage.style.left);
-      oldTop = Number.parseFloat(zoomedImage.style.top);
+      oldLeft = Number.parseFloat(__style(zoomedImage).left);
+      oldTop = Number.parseFloat(__style(zoomedImage).top);
       if (zoomed()) {
-        zoomedImage.style.transition = 'none';
+        __style(zoomedImage).transition = 'none';
       }
       if (!moveListenerAdded) {
         addEventListener(_this.gallery, 'touchmove', onTouchMove, false);
@@ -513,8 +514,8 @@ var ImageGallery = function (_React$Component) {
       if (touches.length === 2) {
         if (zoomed()) zoomValueStarted = zoomValue;else if (!props().embedded) {
           initZoom();
-          zoomedImage.style.transition = 'none';
-          zoomValueStarted = zoomValue = Number.parseFloat(zoomedImage.style.width) / WINDOW.innerWidth;
+          __style(zoomedImage).transition = 'none';
+          zoomValueStarted = zoomValue = Number.parseFloat(__style(zoomedImage).width) / WINDOW.innerWidth;
         }
       }
       touchesStart = touches;
@@ -525,21 +526,21 @@ var ImageGallery = function (_React$Component) {
     var distance = function distance(touches) {
       var a = touches[0];
       var b = touches[1];
-      return Math.sqrt(power2(a.pageX - b.pageX) + power2(a.pageY - b.pageY));
+      return Math.sqrt(power2(__pageX(a) - __pageX(b)) + power2(__pageY(a) - __pageY(b)));
     };
     var center = function center(touches) {
       var a = touches[0];
       var b = touches[1];
       return {
-        x: (a.pageX + b.pageX) / 2,
-        y: (a.pageY + b.pageY) / 2
+        x: (__pageX(a) + __pageX(b)) / 2,
+        y: (__pageY(a) + __pageY(b)) / 2
       };
     };
     var onTouchMove = function onTouchMove(e) {
       if (!touchesStart) return;
       var touches = e.touches || [{
-        pageX: e.pageX,
-        pageY: e.pageY
+        pageX: __pageX(e),
+        pageY: __pageY(e)
       }];
       if (zoomed()) {
         preventDefault(e);
@@ -551,24 +552,24 @@ var ImageGallery = function (_React$Component) {
           var newLeft = zoomX - (zoomX - oldLeft) * zoomValue / zoomValueStarted;
           var zoomY = zoomedAt.y;
           var newTop = zoomY - (zoomY - oldTop) * zoomValue / zoomValueStarted;
-          zoomedImage.style.left = newLeft + 'px';
-          zoomedImage.style.top = newTop + 'px';
-          zoomedImage.style.width = zoomValue * 100 + '%';
+          __style(zoomedImage).left = newLeft + 'px';
+          __style(zoomedImage).top = newTop + 'px';
+          __style(zoomedImage).width = zoomValue * 100 + '%';
           return;
         } else {
           var _touch = touches[0];
           var _touchStart = touchesStart[0];
-          var _newLeft = oldLeft + _touch.pageX - _touchStart.pageX;
-          var _newTop = oldTop + _touch.pageY - _touchStart.pageY;
-          zoomedImage.style.left = _newLeft + 'px';
-          zoomedImage.style.top = _newTop + 'px';
+          var _newLeft = oldLeft + __pageX(_touch) - __pageX(_touchStart);
+          var _newTop = oldTop + __pageY(_touch) - __pageY(_touchStart);
+          __style(zoomedImage).left = _newLeft + 'px';
+          __style(zoomedImage).top = _newTop + 'px';
           return;
         }
       }
-      if (touches.length > 1 || zoomed()) return;
+      if (__length(touches) > 1 || zoomed()) return;
       var touch = touches[0];
       var touchStart = touchesStart[0];
-      shift(touch.pageX - touchStart.pageX);
+      shift(__pageX(touch) - __pageX(touchStart));
     };
     var onTouchEnd = function onTouchEnd(e) {
       if (!touchesStart) return;
@@ -580,13 +581,13 @@ var ImageGallery = function (_React$Component) {
         return;
       }
       var touches = e.changedTouches || [{
-        pageX: e.pageX,
-        pageY: e.pageY
+        pageX: __pageX(e),
+        pageY: __pageY(e)
       }];
       var touchEnd = touches[0];
       var touchStart = touchesStart[0];
-      var distX = touchEnd.pageX - touchStart.pageX;
-      var distY = touchEnd.pageY - touchStart.pageY;
+      var distX = __pageX(touchEnd) - __pageX(touchStart);
+      var distY = __pageY(touchEnd) - __pageY(touchStart);
       touchesStart = UNDEFINED;
       shift(0);
       var minDistance = 20;
@@ -603,7 +604,7 @@ var ImageGallery = function (_React$Component) {
           previews = _props.previews;
       index(i);
       previous(prev);
-      previewScroll(calculatePreviewsScroll(i, previews.images.length, previews.width));
+      previewScroll(calculatePreviewsScroll(i, previews.images.length, __width(previews)));
     };
     var left = function left(e) {
       if (zoomed()) return;
@@ -619,7 +620,7 @@ var ImageGallery = function (_React$Component) {
       var _props2 = props(),
           images = _props2.images;
       var indexValue = index() !== UNDEFINED ? index() : props().index;
-      if (indexValue < images.length - 1) scrollTo(indexValue + 1, indexValue);else if (props().loop) scrollTo(0, indexValue);
+      if (indexValue < __length(images) - 1) scrollTo(indexValue + 1, indexValue);else if (props().loop) scrollTo(0, indexValue);
     };
     that.scrollTo = scrollTo;
     that.left = left;
@@ -647,9 +648,9 @@ var ImageGallery = function (_React$Component) {
           embedded = _props4.embedded,
           loop = _props4.loop,
           _onClick = _props4.onClick,
-          children = _props4.children;
+          children = _props4[__children];
       var indexValue = index() !== UNDEFINED ? index() : props().index;
-      var length = images.length;
+      var length = __length(images);
       var isZoomed = zoomed();
       var shiftValue = shift() || 0;
       previous();
@@ -686,24 +687,24 @@ var ImageGallery = function (_React$Component) {
         }, ReactCreateElement("div", {
           draggable: false,
           onDoubleClick: function onDoubleClick(e) {
-            var img = e.target;
-            if (img.naturalWidth === img.clientWidth && img.naturalHeight === img.clientHeight) return;
+            var img = __target(e);
+            if (img.naturalWidth === __clientWidth(img) && img.naturalHeight === __clientHeight(img)) return;
             if (!isZoomed) {
               zoomedImage = img.tagName.toLowerCase() === 'img' ? img.parentElement : img;
               initZoom();
               zoomValue = 2;
               var newWidth = WINDOW.innerWidth * 2;
-              var oldWidth = Number.parseFloat(zoomedImage.style.width);
-              var _oldLeft = Number.parseFloat(zoomedImage.style.left);
-              var zoomX = e.pageX;
+              var oldWidth = Number.parseFloat(__style(zoomedImage).width);
+              var _oldLeft = Number.parseFloat(__style(zoomedImage).left);
+              var zoomX = __pageX(e);
               var diff = newWidth / oldWidth;
               var newLeft = zoomX - (zoomX - _oldLeft) * diff;
-              var _oldTop = Number.parseFloat(zoomedImage.style.top);
-              var zoomY = e.pageY;
+              var _oldTop = Number.parseFloat(__style(zoomedImage).top);
+              var zoomY = __pageY(e);
               var newTop = zoomY - (zoomY - _oldTop) * diff;
-              zoomedImage.style.width = '200%';
-              zoomedImage.style.left = newLeft + 'px';
-              zoomedImage.style.top = newTop + 'px';
+              __style(zoomedImage).width = '200%';
+              __style(zoomedImage).left = newLeft + 'px';
+              __style(zoomedImage).top = newTop + 'px';
             } else {
               resetZoom();
             }
@@ -737,7 +738,7 @@ var ImageGallery = function (_React$Component) {
       }, ReactCreateElement("div", {
         [__className]: "previews",
         style: {
-          width: previews.width
+          width: __width(previews)
         }
       }, ReactCreateElement("div", {
         [__className]: "viewport"
@@ -827,12 +828,12 @@ var ImageGalleryContainer = function (_React$Component2) {
         load: load,
         close: close,
         recalculate: recalculate
-      }), that.props.children);
+      }), that.props[__children]);
     };
     that[componentDidMount] = function () {
       props()[embedded] && show(props()[embedded]);
       that.scrollTo = galleryRef().scrollTo;
-      that.left = galleryRef().left;
+      that.left = __left(galleryRef());
       that.right = galleryRef().right;
     };
     that[componentDidUpdate] = function (prevProps, prevState) {

package/MaterialIcon.js

@@ -1,3 +1,4 @@
+import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, target as __target, top as __top, value as __value, width as __width} from "./CommonFields";
 import 'react';
 import {toConsumableArray as __toConsumableArray} from "./_virtual/_rollupPluginBabelHelpers";
 import {extends as __extends} from "./_virtual/_rollupPluginBabelHelpers";
@@ -10,7 +11,7 @@ import PropTypes from 'prop-types';
 
 var MaterialIcon = function MaterialIcon(_ref) {
   var icon = _ref.icon,
-      className = _ref.className;
+      className = _ref[__className];
   return ReactCreateElement("i", {
     [__className]: classNames('MaterialIcon', 'material-icons', className)
   }, icon);

package/Modal.js

@@ -1,3 +1,4 @@
+import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, target as __target, top as __top, value as __value, width as __width} from "./CommonFields";
 import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, assertThisInitialized as _assertThisInitialized, slicedToArray as _slicedToArray, createClass as _createClass } from './_virtual/_rollupPluginBabelHelpers.js';
 import {toConsumableArray as __toConsumableArray} from "./_virtual/_rollupPluginBabelHelpers";
 import {extends as __extends} from "./_virtual/_rollupPluginBabelHelpers";
@@ -52,25 +53,25 @@ var Modal = function (_PureComponent) {
       if (!bc || bc(that.close)) that.close(e);
     };
     var shouldClose = function shouldClose(e) {
-      var isSameModal = el().style.zIndex == zIndex - 1;
-      !(e && content().contains(e.target)) && isSameModal && beforeClose(e);
+      var isSameModal = __style(el()).zIndex == zIndex - 1;
+      !(e && content().contains(__target(e))) && isSameModal && beforeClose(e);
     };
     var addTransitionListener = function addTransitionListener() {
       var transitionend = "transitionend";
       var listener = function listener() {
         removeEventListener(overlay(), transitionend, listener);
         orNoop(isShow() ? props().onOpen : orNoop(props().onClose))();
-        el() && (el().style.paddingBottom = isShow() ? '1px' : '0px');
+        el() && (__style(el()).paddingBottom = isShow() ? '1px' : '0px');
       };
       addEventListener(overlay(), transitionend, listener);
     };
     that[render] = function () {
       var _props2 = props(),
-          className = _props2.className,
-          top = _props2.top,
+          className = _props2[__className],
+          top = __top(_props2),
           _props2$container = _props2.container,
           container = _props2$container === void 0 ? Modal.defaultContainer : _props2$container,
-          children = _props2.children,
+          children = _props2[__children],
           closeIcon = _props2.closeIcon;
       var menu = getMenu();
       var show = isShow();
@@ -109,7 +110,7 @@ var Modal = function (_PureComponent) {
     };
     var open = that.open = function () {
       if (isShow()) return;
-      el() && (el().style.zIndex = zIndex++);
+      el() && (__style(el()).zIndex = zIndex++);
       addTransitionListener();
       isShow(true);
       var listener = function listener(event) {

package/ModalMenu.js

@@ -1,3 +1,4 @@
+import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, target as __target, top as __top, value as __value, width as __width} from "./CommonFields";
 import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, assertThisInitialized as _assertThisInitialized, createClass as _createClass } from './_virtual/_rollupPluginBabelHelpers.js';
 import {toConsumableArray as __toConsumableArray} from "./_virtual/_rollupPluginBabelHelpers";
 import {extends as __extends} from "./_virtual/_rollupPluginBabelHelpers";
@@ -40,10 +41,10 @@ var ModalMenu = function (_PureComponent) {
           mounting: 200,
           unmounting: 200,
           mountingDelay: i * 50,
-          unmountingDelay: (filtered.length - i - 1) * 50,
+          unmountingDelay: (__length(filtered) - i - 1) * 50,
           styles: {
             mounting: {
-              right: (filtered.length - i) * 36 + 5 + (filtered.length - i) * 5 + "px"
+              right: (__length(filtered) - i) * 36 + 5 + (__length(filtered) - i) * 5 + "px"
             }
           }
         }, ReactCreateElement(Button, {

package/ReactConstants.js

@@ -1,7 +1,12 @@
 import React from 'react';
 
 var EMPTY = {};
-var props = function (that) { return that.props; };
+var props = function (that) {
+    if (!that) {
+        debugger;
+    }
+    return that.props;
+};
 var propsGetter = function (that) { return function () { return props(that); }; };
 // @ts-ignore //ignore incompatible casting EMPTY to S
 var state = function (that) { return that.state || EMPTY; };

package/ReactCreateElement.js

@@ -1,3 +1,4 @@
+import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, target as __target, top as __top, value as __value, width as __width} from "./CommonFields";
 import React from 'react';
 
 var ReactCreateElement = React.createElement;

package/ReadyListener.js

@@ -1,3 +1,4 @@
+import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, target as __target, top as __top, value as __value, width as __width} from "./CommonFields";
 import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, assertThisInitialized as _assertThisInitialized, createClass as _createClass } from './_virtual/_rollupPluginBabelHelpers.js';
 import {toConsumableArray as __toConsumableArray} from "./_virtual/_rollupPluginBabelHelpers";
 import {extends as __extends} from "./_virtual/_rollupPluginBabelHelpers";

package/ResizeObserver.d.ts

@@ -0,0 +1 @@
+export {};