react-ui-basics 0.0.155 → 0.0.158

package/ImageGallery.js

@@ -1,4 +1,5 @@
 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 {clientHeight as __clientHeight, clientWidth as __clientWidth, getBoundingClientRect as __getBoundingClientRect, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, top as __top, value as __value, width as __width} from "./CommonFields";
 import {toConsumableArray as __toConsumableArray} from "./_virtual/_rollupPluginBabelHelpers";
 import {extends as __extends} from "./_virtual/_rollupPluginBabelHelpers";
 import {inherits as __inherits} 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 ? container[__clientWidth] : min(DOCUMENT.body[__clientWidth], WINDOW.innerWidth);
+  var windowHeight = embedded ? container[__clientHeight] : 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 = images[__length];
     var nextState = _objectSpread2({}, state);
     nextState.images = images.map(function (item) {
       var image = state.images.find(function (it) {
@@ -126,14 +127,14 @@ Actions.replaceImages = function (images) {
       var it = _objectSpread2({}, item);
       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 rect = el[__getBoundingClientRect]();
+        var fromWidth = el[__clientWidth];
+        var fromHeight = el[__clientHeight];
+        it.fromLeftPx = toPx(rect[__left]);
+        it.fromTopPx = toPx(rect[__top]);
         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 || el[__width], el.naturalHeight || el[__height], withPreviews ? previewsHeight : 0, embedded, container);
       } else {
         it.toLeft = 100;
         it.toTop = 100;
@@ -141,7 +142,7 @@ Actions.replaceImages = function (images) {
       if (!it.toWidth || !it.toHeight || !el) Actions.loadPreview(it)(dispatch);
       return it;
     });
-    nextState.previews.width = min(length, 5) * previewWidth + min(length - 1, 4) * previewPadding;
+    nextState.previews[__width] = min(length, 5) * previewWidth + min(length - 1, 4) * previewPadding;
     nextState.previews.totalWidth = toPx(length * previewWidth + (length - 1) * previewPadding);
     nextState.previews.images = nextState.images.map(function (item) {
       var preview = state.previews.images.find(function (it) {
@@ -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 = el[__clientWidth];
+      var height = el[__clientHeight];
       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 = images[__length];
     var withPreviews = length > 1 && (gallery.withPreviews === UNDEFINED || !!gallery.withPreviews);
     var container = gallery.container;
     var embedded = gallery.embedded;
@@ -177,14 +178,14 @@ Actions.show = function (gallery) {
         var it = _objectSpread2({}, item);
         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 rect = el[__getBoundingClientRect]();
+          var fromWidth = el[__clientWidth];
+          var fromHeight = el[__clientHeight];
+          it.fromLeftPx = toPx(rect[__left]);
+          it.fromTopPx = toPx(rect[__top]);
           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 || el[__width], el.naturalHeight || el[__height], 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 = el[__clientWidth];
+          var height = el[__clientHeight];
           return calculatePreview(width, height, el.src);
         })
       }
@@ -218,7 +219,7 @@ Actions.show = function (gallery) {
         }
       }
     });
-    data.previews.scroll = calculatePreviewsScroll(index, length, data.previews.width);
+    data.previews.scroll = calculatePreviewsScroll(index, length, data.previews[__width]);
     dispatch({
       type: ACTION_IMAGE_GALLERY_SHOW,
       data: data
@@ -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++) {
-    if (!images[i].width && !images[i].fromWidthPx) continue;
+  for (var i = 0; i < images[__length]; 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 = it[__width] || Number.parseInt(it.fromWidthPx);
+    var height = it[__height] || 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 = image[__width];
+  var height = image[__height];
   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, image[__width] / image[__height], image[__width], image[__height], 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(image[__width], image[__height], image.src);
   previewImages[index] = preview;
   return result;
 }), _reducers);
@@ -353,7 +354,7 @@ var big = function big(it, index, i, shift, length, previous) {
   if (index !== i) {
     var width = WINDOW.innerWidth;
     var additionalOffset = it.toLeft < 0 ? -it.toLeft : 0;
-    if (i < index) styles.left = toPx(it.toLeft - width - additionalOffset + (i + 1 === index ? shift : 0));else styles.left = toPx(it.toLeft + width + additionalOffset + (i - 1 === index ? shift : 0));
+    if (i < index) styles[__left] = toPx(it.toLeft - width - additionalOffset + (i + 1 === index ? shift : 0));else styles[__left] = toPx(it.toLeft + width + additionalOffset + (i - 1 === index ? shift : 0));
   }
   return styles;
 };
@@ -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 = images[__length] - 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;
+      zoomedImage[__style][__width] = defaultWidth;
+      zoomedImage[__style][__left] = defaultLeft;
+      zoomedImage[__style][__top] = defaultTop;
+      zoomedImage[__style].transition = null;
       touchpadStarted = null;
     };
     var initZoom = function initZoom() {
       zoomed(true);
-      defaultWidth = zoomedImage.style.width;
-      defaultLeft = zoomedImage.style.left;
-      defaultTop = zoomedImage.style.top;
+      defaultWidth = zoomedImage[__style][__width];
+      defaultLeft = zoomedImage[__style][__left];
+      defaultTop = zoomedImage[__style][__top];
     };
     var initTouchpadDragging = function initTouchpadDragging() {
-      oldLeft = Number.parseFloat(zoomedImage.style.left);
-      oldTop = Number.parseFloat(zoomedImage.style.top);
-      zoomedImage.style.transition = 'none';
+      oldLeft = Number.parseFloat(zoomedImage[__style][__left]);
+      oldTop = Number.parseFloat(zoomedImage[__style][__top]);
+      zoomedImage[__style].transition = 'none';
       touchpadStarted = true;
     };
     var onWheel = function onWheel(e) {
@@ -478,43 +479,43 @@ 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 = e[__pageX];
         oldLeft = zoomX - (zoomX - oldLeft) * newZoom / zoomValue;
-        var zoomY = e.pageY;
+        var zoomY = e[__pageY];
         oldTop = zoomY - (zoomY - oldTop) * newZoom / zoomValue;
         zoomValue = newZoom;
-        zoomedImage.style.width = zoomValue * 100 + '%';
+        zoomedImage[__style][__width] = zoomValue * 100 + '%';
       } else {
         oldLeft += e.deltaX * 0.5;
         oldTop += e.deltaY * 0.5;
       }
-      zoomedImage.style.left = oldLeft + 'px';
-      zoomedImage.style.top = oldTop + 'px';
+      zoomedImage[__style][__left] = oldLeft + 'px';
+      zoomedImage[__style][__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: e[__pageX],
+        pageY: e[__pageY]
       }];
       zoomedImage = e.target;
       zoomedImage = zoomedImage.tagName.toLowerCase() === 'img' ? zoomedImage.parentElement : zoomedImage;
-      oldLeft = Number.parseFloat(zoomedImage.style.left);
-      oldTop = Number.parseFloat(zoomedImage.style.top);
+      oldLeft = Number.parseFloat(zoomedImage[__style][__left]);
+      oldTop = Number.parseFloat(zoomedImage[__style][__top]);
       if (zoomed()) {
-        zoomedImage.style.transition = 'none';
+        zoomedImage[__style].transition = 'none';
       }
       if (!moveListenerAdded) {
         addEventListener(_this.gallery, 'touchmove', onTouchMove, false);
         moveListenerAdded = true;
       }
-      if (touches.length === 2) {
+      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;
+          zoomedImage[__style].transition = 'none';
+          zoomValueStarted = zoomValue = Number.parseFloat(zoomedImage[__style][__width]) / WINDOW.innerWidth;
         }
       }
       touchesStart = touches;
@@ -525,25 +526,25 @@ 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(a[__pageX] - b[__pageX]) + power2(a[__pageY] - b[__pageY]));
     };
     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: (a[__pageX] + b[__pageX]) / 2,
+        y: (a[__pageY] + b[__pageY]) / 2
       };
     };
     var onTouchMove = function onTouchMove(e) {
       if (!touchesStart) return;
       var touches = e.touches || [{
-        pageX: e.pageX,
-        pageY: e.pageY
+        pageX: e[__pageX],
+        pageY: e[__pageY]
       }];
       if (zoomed()) {
         preventDefault(e);
-        if (touches.length === 2) {
+        if (touches[__length] === 2) {
           var diff = distance(touches) / distance(touchesStart);
           zoomValue = Math.min(Math.max(zoomValueStarted * diff, 0.5), 10);
           var zoomedAt = center(touchesStart);
@@ -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 + '%';
+          zoomedImage[__style][__left] = newLeft + 'px';
+          zoomedImage[__style][__top] = newTop + 'px';
+          zoomedImage[__style][__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 + _touch[__pageX] - _touchStart[__pageX];
+          var _newTop = oldTop + _touch[__pageY] - _touchStart[__pageY];
+          zoomedImage[__style][__left] = _newLeft + 'px';
+          zoomedImage[__style][__top] = _newTop + 'px';
           return;
         }
       }
-      if (touches.length > 1 || zoomed()) return;
+      if (touches[__length] > 1 || zoomed()) return;
       var touch = touches[0];
       var touchStart = touchesStart[0];
-      shift(touch.pageX - touchStart.pageX);
+      shift(touch[__pageX] - touchStart[__pageX]);
     };
     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: e[__pageX],
+        pageY: e[__pageY]
       }];
       var touchEnd = touches[0];
       var touchStart = touchesStart[0];
-      var distX = touchEnd.pageX - touchStart.pageX;
-      var distY = touchEnd.pageY - touchStart.pageY;
+      var distX = touchEnd[__pageX] - touchStart[__pageX];
+      var distY = touchEnd[__pageY] - touchStart[__pageY];
       touchesStart = UNDEFINED;
       shift(0);
       var minDistance = 20;
@@ -603,14 +604,14 @@ 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], previews[__width]));
     };
     var left = function left(e) {
       if (zoomed()) return;
       preventDefault(e);
       stopPropagation(e);
       var indexValue = index() !== UNDEFINED ? index() : props().index;
-      if (indexValue > 0) scrollTo(indexValue - 1, indexValue);else if (props().loop) scrollTo(props().images.length - 1, indexValue);
+      if (indexValue > 0) scrollTo(indexValue - 1, indexValue);else if (props().loop) scrollTo(props().images[__length] - 1, indexValue);
     };
     var right = function right(e) {
       if (zoomed()) return;
@@ -619,10 +620,10 @@ 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 < images[__length] - 1) scrollTo(indexValue + 1, indexValue);else if (props().loop) scrollTo(0, indexValue);
     };
     that.scrollTo = scrollTo;
-    that.left = left;
+    that[__left] = left;
     that.right = right;
     var animatedRoundButton = function animatedRoundButton(show, className, onClick, icon) {
       return ReactCreateElement(Animated, {
@@ -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 = images[__length];
       var isZoomed = zoomed();
       var shiftValue = shift() || 0;
       previous();
@@ -687,23 +688,23 @@ var ImageGallery = function (_React$Component) {
           draggable: false,
           onDoubleClick: function onDoubleClick(e) {
             var img = e.target;
-            if (img.naturalWidth === img.clientWidth && img.naturalHeight === img.clientHeight) return;
+            if (img.naturalWidth === img[__clientWidth] && img.naturalHeight === img[__clientHeight]) 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(zoomedImage[__style][__width]);
+              var _oldLeft = Number.parseFloat(zoomedImage[__style][__left]);
+              var zoomX = e[__pageX];
               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(zoomedImage[__style][__top]);
+              var zoomY = e[__pageY];
               var newTop = zoomY - (zoomY - _oldTop) * diff;
-              zoomedImage.style.width = '200%';
-              zoomedImage.style.left = newLeft + 'px';
-              zoomedImage.style.top = newTop + 'px';
+              zoomedImage[__style][__width] = '200%';
+              zoomedImage[__style][__left] = newLeft + 'px';
+              zoomedImage[__style][__top] = newTop + 'px';
             } else {
               resetZoom();
             }
@@ -737,7 +738,7 @@ var ImageGallery = function (_React$Component) {
       }, ReactCreateElement("div", {
         [__className]: "previews",
         style: {
-          width: previews.width
+          width: previews[__width]
         }
       }, 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] = galleryRef()[__left];
       that.right = galleryRef().right;
     };
     that[componentDidUpdate] = function (prevProps, prevState) {

package/MaterialIcon.js

@@ -1,4 +1,5 @@
 import 'react';
+import {clientHeight as __clientHeight, clientWidth as __clientWidth, getBoundingClientRect as __getBoundingClientRect, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, top as __top, value as __value, width as __width} from "./CommonFields";
 import {toConsumableArray as __toConsumableArray} from "./_virtual/_rollupPluginBabelHelpers";
 import {extends as __extends} from "./_virtual/_rollupPluginBabelHelpers";
 import {inherits as __inherits} 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,4 +1,5 @@
 import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, assertThisInitialized as _assertThisInitialized, slicedToArray as _slicedToArray, createClass as _createClass } from './_virtual/_rollupPluginBabelHelpers.js';
+import {clientHeight as __clientHeight, clientWidth as __clientWidth, getBoundingClientRect as __getBoundingClientRect, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, top as __top, value as __value, width as __width} from "./CommonFields";
 import {toConsumableArray as __toConsumableArray} from "./_virtual/_rollupPluginBabelHelpers";
 import {extends as __extends} from "./_virtual/_rollupPluginBabelHelpers";
 import {inherits as __inherits} from "./_virtual/_rollupPluginBabelHelpers";
@@ -52,7 +53,7 @@ var Modal = function (_PureComponent) {
       if (!bc || bc(that.close)) that.close(e);
     };
     var shouldClose = function shouldClose(e) {
-      var isSameModal = el().style.zIndex == zIndex - 1;
+      var isSameModal = el()[__style].zIndex == zIndex - 1;
       !(e && content().contains(e.target)) && isSameModal && beforeClose(e);
     };
     var addTransitionListener = function addTransitionListener() {
@@ -60,17 +61,17 @@ var Modal = function (_PureComponent) {
       var listener = function listener() {
         removeEventListener(overlay(), transitionend, listener);
         orNoop(isShow() ? props().onOpen : orNoop(props().onClose))();
-        el() && (el().style.paddingBottom = isShow() ? '1px' : '0px');
+        el() && (el()[__style].paddingBottom = isShow() ? '1px' : '0px');
       };
       addEventListener(overlay(), transitionend, listener);
     };
     that[render] = function () {
       var _props2 = props(),
-          className = _props2.className,
-          top = _props2.top,
+          className = _props2[__className],
+          top = _props2[__top],
           _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() && (el()[__style].zIndex = zIndex++);
       addTransitionListener();
       isShow(true);
       var listener = function listener(event) {

package/ModalMenu.js

@@ -1,4 +1,5 @@
 import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, assertThisInitialized as _assertThisInitialized, createClass as _createClass } from './_virtual/_rollupPluginBabelHelpers.js';
+import {clientHeight as __clientHeight, clientWidth as __clientWidth, getBoundingClientRect as __getBoundingClientRect, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, scrollLeft as __scrollLeft, scrollTop as __scrollTop, style as __style, top as __top, value as __value, width as __width} from "./CommonFields";
 import {toConsumableArray as __toConsumableArray} from "./_virtual/_rollupPluginBabelHelpers";
 import {extends as __extends} from "./_virtual/_rollupPluginBabelHelpers";
 import {inherits as __inherits} from "./_virtual/_rollupPluginBabelHelpers";
@@ -29,7 +30,7 @@ var ModalMenu = function (_PureComponent) {
       var filtered = (items || []).filter(function (it) {
         return !!it;
       });
-      if (filtered.length === 0) return null;
+      if (filtered[__length] === 0) return null;
       var open = isOpen();
       return ReactCreateElement("div", {
         [__className]: classNames("ModalMenu", 'row', open && 'open')
@@ -40,10 +41,10 @@ var ModalMenu = function (_PureComponent) {
           mounting: 200,
           unmounting: 200,
           mountingDelay: i * 50,
-          unmountingDelay: (filtered.length - i - 1) * 50,
+          unmountingDelay: (filtered[__length] - i - 1) * 50,
           styles: {
             mounting: {
-              right: (filtered.length - i) * 36 + 5 + (filtered.length - i) * 5 + "px"
+              right: (filtered[__length] - i) * 36 + 5 + (filtered[__length] - i) * 5 + "px"
             }
           }
         }, ReactCreateElement(Button, {

package/ReactConstants.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+export declare const props: <P>(that: React.Component<P>) => P;
+export declare const propsGetter: <P>(that: React.Component<P>) => (() => P);
+export declare const state: <P, S>(that: React.Component<P, S>) => S;
+export declare const setState: (that: any, data: any, cb?: any) => void;
+export declare const stateFieldSetter: (that: any, key: any, cb?: any) => (value: any, cb2?: any) => void;
+export declare const stateGS: (that: any) => {
+    (): any;
+    toString(): string;
+};
+export declare const stateGSs: (that: any, num: any) => any[];
+export declare const componentDidMount = "componentDidMount";
+export declare const componentWillUnmount = "componentWillUnmount";
+export declare const componentDidUpdate = "componentDidUpdate";
+export declare const render = "render";
+export declare const children = "children";
+export declare const className = "className";
+export declare const PureComponent: typeof React.PureComponent;

package/ReactConstants.js

@@ -1,44 +1,33 @@
-import { defineProperty as _defineProperty } from './_virtual/_rollupPluginBabelHelpers.js';
 import React from 'react';
 
 var EMPTY = {};
-var props = function props(that) {
-  return that.props;
+var props = function (that) { 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; };
+var setState = function (that, data, cb) {
+    that.setState(data, cb);
 };
-var propsGetter = function propsGetter(that) {
-  return function () {
-    return props(that);
-  };
+var stateFieldSetter = function (that, key, cb) { return function (value, cb2) {
+    var _a;
+    setState(that, (_a = {}, _a[key] = value, _a), cb2 || cb);
+}; };
+var stateGS = function (that) {
+    !that.sfc && (that.sfc = 0);
+    var key = '_' + (that.sfc++);
+    var setter = stateFieldSetter(that, key);
+    var result = function () {
+        return !arguments.length ? state(that)[key] : setter.apply(null, arguments);
+    };
+    result.toString = function () { return key; };
+    return result;
 };
-var state = function state(that) {
-  return that.state || EMPTY;
-};
-var setState = function setState(that, data, cb) {
-  that.setState(data, cb);
-};
-var stateFieldSetter = function stateFieldSetter(that, key, cb) {
-  return function (value, cb2) {
-    setState(that, _defineProperty({}, key, value), cb2 || cb);
-  };
-};
-var stateGS = function stateGS(that) {
-  !that.sfc && (that.sfc = 0);
-  var key = '_' + that.sfc++;
-  var setter = stateFieldSetter(that, key);
-  var result = function result() {
-    return !arguments.length ? state(that)[key] : setter.apply(null, arguments);
-  };
-  result.toString = function () {
-    return key;
-  };
-  return result;
-};
-var stateGSs = function stateGSs(that, num) {
-  var result = [];
-  for (var i = 0; i < num; i++) {
-    result.push(stateGS(that));
-  }
-  return result;
+var stateGSs = function (that, num) {
+    var result = [];
+    for (var i = 0; i < num; i++) {
+        result.push(stateGS(that));
+    }
+    return result;
 };
 var componentDidMount = 'componentDidMount';
 var componentWillUnmount = 'componentWillUnmount';

package/ReactConstants.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReactConstants.js","sources":["../../../src/react-ui-basics/ReactConstants.js"],"sourcesContent":["import React from 'react';\n\nconst EMPTY = {};\nexport const props = that => that.props;\nexport const propsGetter = that => () => props(that);\nexport const state = that => that.state || EMPTY;\nexport const setState = (that, data, cb) => {\n    that.setState(data, cb);\n};\nexport const stateFieldSetter = (that, key, cb) => (value, cb2) => {\n    setState(that, {[key]: value}, cb2 || cb);\n};\nexport const stateGS = (that) => {\n    !that.sfc && (that.sfc = 0);\n    const key = '_' + (that.sfc++);\n    const setter = stateFieldSetter(that, key);\n    const result = function () {\n        return !arguments.length ? state(that)[key] : setter.apply(null, arguments);\n    };\n    result.toString = () => key;\n    return result;\n};\nexport const stateGSs = (that, num) => {\n    const result = [];\n    for (let i = 0; i < num; i++) {\n        result.push(stateGS(that));\n    }\n    return result;\n};\n\nexport const componentDidMount = 'componentDidMount';\nexport const componentWillUnmount = 'componentWillUnmount';\nexport const componentDidUpdate = 'componentDidUpdate';\nexport const render = 'render';\nexport const children = 'children';\nexport const className = 'className';\nexport const PureComponent = React.PureComponent;"],"names":["EMPTY","props","that","propsGetter","state","setState","data","cb","stateFieldSetter","key","value","cb2","stateGS","sfc","setter","result","arguments","length","apply","toString","stateGSs","num","i","push","componentDidMount","componentWillUnmount","componentDidUpdate","render","children","className","PureComponent","React"],"mappings":";;;AAEA,IAAMA,KAAK,GAAG,EAAd,CAAA;IACaC,KAAK,GAAG,SAARA,KAAQ,CAAAC,IAAI,EAAA;AAAA,EAAIA,OAAAA,IAAI,CAACD,KAAT,CAAA;AAAA,EAAlB;IACME,WAAW,GAAG,SAAdA,WAAc,CAAAD,IAAI,EAAA;AAAA,EAAI,OAAA,YAAA;AAAA,IAAMD,OAAAA,KAAK,CAACC,IAAD,CAAX,CAAA;AAAA,GAAJ,CAAA;AAAA,EAAxB;IACME,KAAK,GAAG,SAARA,KAAQ,CAAAF,IAAI,EAAA;AAAA,EAAA,OAAIA,IAAI,CAACE,KAAL,IAAcJ,KAAlB,CAAA;AAAA,EAAlB;AACA,IAAMK,QAAQ,GAAG,SAAXA,QAAW,CAACH,IAAD,EAAOI,IAAP,EAAaC,EAAb,EAAoB;AACxCL,EAAAA,IAAI,CAACG,QAAL,CAAcC,IAAd,EAAoBC,EAApB,CAAA,CAAA;AACH,EAFM;AAGA,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACN,IAAD,EAAOO,GAAP,EAAYF,EAAZ,EAAA;AAAA,EAAA,OAAmB,UAACG,KAAD,EAAQC,GAAR,EAAgB;AAC/DN,IAAAA,QAAQ,CAACH,IAAD,EAASO,eAAAA,CAAAA,EAAAA,EAAAA,GAAT,EAAeC,KAAf,CAAuBC,EAAAA,GAAG,IAAIJ,EAA9B,CAAR,CAAA;AACH,GAF+B,CAAA;AAAA,EAAzB;IAGMK,OAAO,GAAG,SAAVA,OAAU,CAACV,IAAD,EAAU;AAC7B,EAACA,CAAAA,IAAI,CAACW,GAAN,KAAcX,IAAI,CAACW,GAAL,GAAW,CAAzB,CAAA,CAAA;AACA,EAAA,IAAMJ,GAAG,GAAG,GAAA,GAAOP,IAAI,CAACW,GAAL,EAAnB,CAAA;AACA,EAAA,IAAMC,MAAM,GAAGN,gBAAgB,CAACN,IAAD,EAAOO,GAAP,CAA/B,CAAA;AACA,EAAA,IAAMM,MAAM,GAAG,SAATA,MAAS,GAAY;AACvB,IAAO,OAAA,CAACC,SAAS,CAACC,MAAX,GAAoBb,KAAK,CAACF,IAAD,CAAL,CAAYO,GAAZ,CAApB,GAAuCK,MAAM,CAACI,KAAP,CAAa,IAAb,EAAmBF,SAAnB,CAA9C,CAAA;AACH,GAFD,CAAA;AAGAD,EAAAA,MAAM,CAACI,QAAP,GAAkB,YAAA;AAAA,IAAA,OAAMV,GAAN,CAAA;AAAA,GAAlB,CAAA;AACA,EAAA,OAAOM,MAAP,CAAA;AACH,EATM;AAUA,IAAMK,QAAQ,GAAG,SAAXA,QAAW,CAAClB,IAAD,EAAOmB,GAAP,EAAe;AACnC,EAAMN,IAAAA,MAAM,GAAG,EAAf,CAAA;AACA,EAAK,KAAA,IAAIO,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGD,GAApB,EAAyBC,CAAC,EAA1B,EAA8B;AAC1BP,IAAAA,MAAM,CAACQ,IAAP,CAAYX,OAAO,CAACV,IAAD,CAAnB,CAAA,CAAA;AACH,GAAA;AACD,EAAA,OAAOa,MAAP,CAAA;AACH,EANM;AAQA,IAAMS,iBAAiB,GAAG,oBAA1B;AACA,IAAMC,oBAAoB,GAAG,uBAA7B;AACA,IAAMC,kBAAkB,GAAG,qBAA3B;AACA,IAAMC,MAAM,GAAG,SAAf;AACA,IAAMC,QAAQ,GAAG,WAAjB;AACA,IAAMC,SAAS,GAAG,YAAlB;AACMC,IAAAA,aAAa,GAAGC,KAAK,CAACD;;;;"}
+{"version":3,"file":"ReactConstants.js","sources":["../../../src/src/react-ui-basics/ReactConstants.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAEA,IAAM,KAAK,GAAG,EAAE,CAAC;AACV,IAAM,KAAK,GAAuC,UAAA,IAAI,EAAI,EAAA,OAAA,IAAI,CAAC,KAAK,CAAA,GAAC;AAC/D,IAAA,WAAW,GAA+C,UAAA,IAAI,IAAI,OAAA,YAAA,EAAM,OAAA,KAAK,CAAC,IAAI,CAAC,GAAA,CAAA,GAAC;AACjG;AACO,IAAM,KAAK,GAA6C,UAAA,IAAI,EAAA,EAAI,OAAA,IAAI,CAAC,KAAK,IAAI,KAAK,CAAA,GAAC;IAC9E,QAAQ,GAAG,UAAC,IAAI,EAAE,IAAI,EAAE,EAAG,EAAA;AACpC,IAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;AAC5B,EAAE;AACK,IAAM,gBAAgB,GAAG,UAAC,IAAI,EAAE,GAAG,EAAE,EAAG,EAAK,EAAA,OAAA,UAAC,KAAK,EAAE,GAAI,EAAA;;AAC5D,IAAA,QAAQ,CAAC,IAAI,GAAG,EAAA,GAAA,EAAA,EAAA,EAAA,CAAC,GAAG,CAAA,GAAG,KAAK,EAAA,EAAA,GAAG,GAAG,IAAI,EAAE,CAAC,CAAC;AAC9C,CAAC,CAAA,GAAC;AACK,IAAM,OAAO,GAAG,UAAC,IAAI,EAAA;IACxB,CAAC,IAAI,CAAC,GAAG,KAAK,IAAI,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC;IAC5B,IAAM,GAAG,GAAG,GAAG,IAAI,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;IAC/B,IAAM,MAAM,GAAG,gBAAgB,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;AAC3C,IAAA,IAAM,MAAM,GAAG,YAAA;QACX,OAAO,CAAC,SAAS,CAAC,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;AAChF,KAAC,CAAC;IACF,MAAM,CAAC,QAAQ,GAAG,YAAA,EAAM,OAAA,GAAG,CAAA,EAAA,CAAC;AAC5B,IAAA,OAAO,MAAM,CAAC;AAClB,EAAE;AACW,IAAA,QAAQ,GAAG,UAAC,IAAI,EAAE,GAAG,EAAA;IAC9B,IAAM,MAAM,GAAG,EAAE,CAAC;IAClB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,EAAE,CAAC,EAAE,EAAE;QAC1B,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;AAC9B,KAAA;AACD,IAAA,OAAO,MAAM,CAAC;AAClB,EAAE;AAEK,IAAM,iBAAiB,GAAG,oBAAoB;AAC9C,IAAM,oBAAoB,GAAG,uBAAuB;AACpD,IAAM,kBAAkB,GAAG,qBAAqB;AAChD,IAAM,MAAM,GAAG,SAAS;AACxB,IAAM,QAAQ,GAAG,WAAW;AAC5B,IAAM,SAAS,GAAG,YAAY;AACxB,IAAA,aAAa,GAAG,KAAK,CAAC;;;;"}