kui-complex 0.0.29 → 0.0.31

package/dist/index.d.ts

@@ -290,6 +290,7 @@ declare const Tooltip: React.ForwardRefExoticComponent<{
     placement?: PopperPlacements | undefined;
     withArrow?: boolean | undefined;
     cursor?: "auto" | "pointer" | undefined;
+    spacing?: string | undefined;
 } & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 
 type ButtonSelectProps = InputSelectProps

package/dist/index.es.js

@@ -865,7 +865,7 @@ var placementsPositions = {
 };
 
 var Popper = forwardRef(function (props, ref) {
-    var placement = props.placement; props.withArrow; var open = props.open, children = props.children, contentRef = props.contentRef, other = __rest(props, ["placement", "withArrow", "open", "children", "contentRef"]);
+    var placement = props.placement; props.withArrow; var open = props.open, children = props.children, contentRef = props.contentRef, spacing = props.spacing, other = __rest(props, ["placement", "withArrow", "open", "children", "contentRef", "spacing"]);
     var popperRef = useRef(null);
     var _a = useState(null), coords = _a[0], setCoords = _a[1];
     var _b = useState(null), size = _b[0], setSize = _b[1];
@@ -906,9 +906,12 @@ var Popper = forwardRef(function (props, ref) {
     // TODO подумать как реализовать правильное расположение подсказки под contentRef в зависимости от placement
     // Автоматом менять положение (верх-низ) в зависимости от того помещается или нет
     // Распожить стрелочку к контенту посередине контента
-    return ReactDOM.createPortal(jsxs$1(Fragment$1, { children: [jsx(Global, { styles: css(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n            body {\n              position: relative;\n            }\n          "], ["\n            body {\n              position: relative;\n            }\n          "]))) }), jsx(StyledPopperWrapper, __assign({ ref: forwardedRef, style: position, className: "KUI-Popper" }, { children: jsx(StyledPopper, __assign({ open: !!open }, other, { children: children })) }))] }), document.body);
+    return ReactDOM.createPortal(jsxs$1(Fragment$1, { children: [jsx(Global, { styles: css(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n            body {\n              position: relative;\n            }\n          "], ["\n            body {\n              position: relative;\n            }\n          "]))) }), jsx(StyledPopperWrapper, __assign({ ref: forwardedRef, style: position, className: "KUI-Popper", spacing: spacing }, { children: jsx(StyledPopper, __assign({ open: !!open }, other, { children: children })) }))] }), document.body);
 });
-var StyledPopperWrapper = styled.div(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n  position: absolute;\n  max-width: 215px;\n  @media (max-width: ", "px) {\n    position: fixed;\n    bottom: 24px;\n    top: auto !important;\n    left: 16px !important;\n    width: calc(100vw - 32px);\n    max-width: unset;\n  }\n"], ["\n  position: absolute;\n  max-width: 215px;\n  @media (max-width: ", "px) {\n    position: fixed;\n    bottom: 24px;\n    top: auto !important;\n    left: 16px !important;\n    width: calc(100vw - 32px);\n    max-width: unset;\n  }\n"])), theme.breakpoints.xxs);
+var StyledPopperWrapper = styled.div(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n  position: absolute;\n  max-width: 215px;\n  padding: ", ";\n  z-index: 10;\n  @media (max-width: ", "px) {\n    position: fixed;\n    bottom: 24px;\n    top: auto !important;\n    left: 16px !important;\n    width: calc(100vw - 32px);\n    max-width: unset;\n  }\n"], ["\n  position: absolute;\n  max-width: 215px;\n  padding: ", ";\n  z-index: 10;\n  @media (max-width: ", "px) {\n    position: fixed;\n    bottom: 24px;\n    top: auto !important;\n    left: 16px !important;\n    width: calc(100vw - 32px);\n    max-width: unset;\n  }\n"])), function (_a) {
+    var spacing = _a.spacing;
+    return spacing || 0;
+}, theme.breakpoints.xxs);
 var StyledPopper = styled.div(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n  padding: 16px;\n  border-radius: 12px;\n  background: white;\n  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);\n  transition: opacity 0.3s ease-out;\n  opacity: ", ";\n"], ["\n  padding: 16px;\n  border-radius: 12px;\n  background: white;\n  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);\n  transition: opacity 0.3s ease-out;\n  opacity: ", ";\n"])), function (_a) {
     var open = _a.open;
     return (open ? 1 : 0);