@mw-kit/mw-ui 1.7.74 → 1.7.76

package/dist/index.modern.js

@@ -1,5 +1,5 @@
 import 'semantic-ui-css/semantic.min.css';
-import React__default, { useState, useEffect, useImperativeHandle, createElement, useCallback } from 'react';
+import React__default, { useState, useEffect, useCallback, useImperativeHandle, createElement } from 'react';
 import styled, { css, keyframes, createGlobalStyle, ThemeProvider as ThemeProvider$1 } from 'styled-components';
 import { Icon as Icon$1, Popup } from 'semantic-ui-react';
 export * from 'semantic-ui-react';
@@ -640,7 +640,8 @@ var Container = styled.div(_templateObject17 || (_templateObject17 = _taggedTemp
 });
 
 var AbsoluteContainer = React__default.forwardRef(function (props, fowardedRef) {
-  var open = props.open;
+  var open = props.open,
+      boundRef = props.boundRef;
   var center = props.center || {
     x: 50,
     y: 75
@@ -651,15 +652,28 @@ var AbsoluteContainer = React__default.forwardRef(function (props, fowardedRef)
       ref = _useState[0],
       setRef = _useState[1];
 
-  var getPosition = function getPosition() {
+  var getPosition = useCallback(function () {
     if (!ref) return null;
-    var width = window.innerWidth;
-    var height = window.innerHeight;
-
-    var _ref$getBoundingClien = ref.getBoundingClientRect(),
-        top = _ref$getBoundingClien.top,
-        left = _ref$getBoundingClien.left;
 
+    var _ref = boundRef ? {
+      offsetTop: boundRef.offsetTop,
+      offsetLeft: boundRef.offsetLeft,
+      width: boundRef.offsetWidth,
+      height: boundRef.offsetHeight
+    } : {
+      offsetTop: 0,
+      offsetLeft: 0,
+      width: window.innerWidth,
+      height: window.innerHeight
+    },
+        width = _ref.width,
+        height = _ref.height,
+        offsetTop = _ref.offsetTop,
+        offsetLeft = _ref.offsetLeft;
+
+    var rect = ref.getBoundingClientRect();
+    var top = rect.top - offsetTop;
+    var left = rect.left - offsetLeft;
     var x = left * 100 / width;
     var y = top * 100 / height;
 
@@ -677,7 +691,7 @@ var AbsoluteContainer = React__default.forwardRef(function (props, fowardedRef)
 
       return _newPosition;
     }
-  };
+  }, [ref, boundRef]);
 
   var _useState2 = useState(props.position || getPosition),
       position = _useState2[0],
@@ -689,7 +703,7 @@ var AbsoluteContainer = React__default.forwardRef(function (props, fowardedRef)
   useEffect(function () {
     if (props.position) return;
     setPosition(getPosition);
-  }, [ref]);
+  }, [getPosition]);
   var htmlProps = filterObject(props, ['center', 'position', 'children', 'content']);
   var cssKeys = {
     width: 'width',
@@ -12208,7 +12222,7 @@ var EllipsisContainer$1 = function EllipsisContainer$1(props) {
   }));
 };
 
-var _templateObject$5, _templateObject2$5, _templateObject3$5, _templateObject4$3, _templateObject5$3, _templateObject6$2, _templateObject7$2, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1, _templateObject20$1, _templateObject21$1;
+var _templateObject$5, _templateObject2$5, _templateObject3$5, _templateObject4$3, _templateObject5$3, _templateObject6$2, _templateObject7$2, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1, _templateObject20$1, _templateObject21$1, _templateObject22$1;
 var IconContainer = styled.button(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 17px;\n\n  background-color: transparent;\n  border: none;\n  box-shadow: none;\n  padding: 0;\n\n  ", "\n"])), function (_ref) {
   var onClick = _ref.onClick,
       disabled = _ref.disabled;
@@ -12286,8 +12300,9 @@ var Label = styled.label(_templateObject13$1 || (_templateObject13$1 = _taggedTe
   var width = _ref16.$width;
   return width || '100%';
 }, function (_ref17) {
-  var disabled = _ref17.$disabled;
-  if (!disabled) return;
+  var disabled = _ref17.$disabled,
+      viewMode = _ref17.$viewMode;
+  if (!disabled || viewMode) return;
   return css(_templateObject14$1 || (_templateObject14$1 = _taggedTemplateLiteralLoose(["\n      opacity: 0.5;\n    "])));
 }, InputContainer, IconContainer, function (_ref18) {
   var theme = _ref18.theme,
@@ -12314,20 +12329,24 @@ var Label = styled.label(_templateObject13$1 || (_templateObject13$1 = _taggedTe
 
   return css(_templateObject17$1 || (_templateObject17$1 = _taggedTemplateLiteralLoose(["\n      > ", " > ", " {\n        width: ", ";\n        left: calc(", " / 2);\n      }\n\n      > ", " > ", " {\n        padding-left: calc(", " + ", ");\n        ~ ", " {\n          padding-left: calc(", " + ", ");\n        }\n      }\n    "])), InputContainer, IconContainer, width, padding, InputContainer, Input, padding, width, ChildrenContainer, padding, width);
 });
-var LabelText = styled.div(_templateObject18$1 || (_templateObject18$1 = _taggedTemplateLiteralLoose(["\n  display: inline-block;\n  margin-bottom: ", ";\n\n  ", "\n"])), function (_ref21) {
-  var theme = _ref21.theme,
-      viewMode = _ref21.$viewMode;
-  return theme.spacings[viewMode ? 's3' : 's1'];
+var LabelText = styled.div(_templateObject18$1 || (_templateObject18$1 = _taggedTemplateLiteralLoose(["\n  display: inline-block;\n\n  ", "\n\n  margin-bottom: ", ";\n\n  ", "\n"])), function (_ref21) {
+  var viewMode = _ref21.$viewMode;
+  if (!viewMode) return;
+  return css(_templateObject19$1 || (_templateObject19$1 = _taggedTemplateLiteralLoose(["\n      font-weight: bold;\n    "])));
 }, function (_ref22) {
-  var required = _ref22.$required,
+  var theme = _ref22.theme,
       viewMode = _ref22.$viewMode;
+  return theme.spacings[viewMode ? 's3' : 's1'];
+}, function (_ref23) {
+  var required = _ref23.$required,
+      viewMode = _ref23.$viewMode;
   if (!required || viewMode) return;
-  return css(_templateObject19$1 || (_templateObject19$1 = _taggedTemplateLiteralLoose(["\n      :after {\n        content: ' *';\n      }\n    "])));
+  return css(_templateObject20$1 || (_templateObject20$1 = _taggedTemplateLiteralLoose(["\n      :after {\n        content: ' *';\n      }\n    "])));
 });
-var ViewModeContainer = styled.div(_templateObject20$1 || (_templateObject20$1 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref23) {
-  var children = _ref23.children;
+var ViewModeContainer = styled.div(_templateObject21$1 || (_templateObject21$1 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref24) {
+  var children = _ref24.children;
   if (children) return;
-  return css(_templateObject21$1 || (_templateObject21$1 = _taggedTemplateLiteralLoose(["\n      :before {\n        content: ' ';\n        white-space: pre;\n      }\n    "])));
+  return css(_templateObject22$1 || (_templateObject22$1 = _taggedTemplateLiteralLoose(["\n      :before {\n        content: ' ';\n        white-space: pre;\n      }\n    "])));
 });
 
 var defaultValue = {
@@ -12549,7 +12568,8 @@ var Input$1 = React__default.forwardRef(function (props, ref) {
     "$invalid": invalid,
     "$paddingless": paddingless,
     "$icon": iconProps,
-    "$width": width
+    "$width": width,
+    "$viewMode": viewMode
   }, label && React__default.createElement(LabelText, {
     "$required": required,
     "$viewMode": viewMode