glints-aries 4.0.194 → 4.0.196

package/es/@next/Alert/AlertProvider.js

@@ -3,7 +3,9 @@ import React, { useState } from 'react';
 import { AlertContext } from './AlertContext';
 export var AlertProvider = function AlertProvider(_ref) {
   var children = _ref.children;
-  var _useState = useState(undefined),
+  var _useState = useState({
+      show: false
+    }),
     state = _useState[0],
     setState = _useState[1];
   var open = function open(props) {

package/es/@next/Modal/ModalProvider.js

@@ -3,7 +3,9 @@ import React, { useState } from 'react';
 import { ModalContext } from './ModalContext';
 export var ModalProvider = function ModalProvider(_ref) {
   var children = _ref.children;
-  var _useState = useState(undefined),
+  var _useState = useState({
+      isOpen: false
+    }),
     state = _useState[0],
     setState = _useState[1];
   var open = function open(props) {

package/es/@next/Tooltip/Tooltip.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+declare const allPositions: readonly ["top-center", "top-left", "top-right", "bottom-center", "bottom-left", "bottom-right", "right-middle", "right-top", "right-bottom", "left-middle", "left-top", "left-bottom"];
+export declare type TooltipPosition = typeof allPositions[number];
+export declare type TooltipProps = {
+    preferredPosition?: TooltipPosition;
+    children: React.ReactNode;
+    content: React.ReactNode;
+};
+export declare const Tooltip: ({ children, content, preferredPosition, }: TooltipProps) => JSX.Element;
+export {};

package/es/@next/Tooltip/Tooltip.js

@@ -0,0 +1,133 @@
+import React, { useEffect, useRef, useState } from 'react';
+import { Portal } from '../Portal/Portal';
+import { Typography } from '../Typography';
+import { bottomPositionResolver, leftPositionResolver, rightPositionResolver, topPositionResolver } from './positionResolver';
+import { canAlignBottom, canAlignCenter, canAlignLeft, canAlignMiddle, canAlignRight, canAlignTop, horizontalBuffer, verticalBuffer } from './positionResolverHelper';
+import { StyledTooltip, StyledTooltipArrow, StyledTooltipContainer } from './TooltipStyle';
+var topPositions = ['top-center', 'top-left', 'top-right'];
+var bottomPositions = ['bottom-center', 'bottom-left', 'bottom-right'];
+var rightPositions = ['right-middle', 'right-top', 'right-bottom'];
+var leftPositions = ['left-middle', 'left-top', 'left-bottom'];
+var allPositions = [].concat(topPositions, bottomPositions, rightPositions, leftPositions);
+var tooltipPositionResolvers = {
+  'top-center': function topCenter(tooltipRect, elementRect) {
+    return topPositionResolver(tooltipRect, elementRect, [canAlignCenter, canAlignLeft, canAlignRight]);
+  },
+  'top-left': function topLeft(tooltipRect, elementRect) {
+    return topPositionResolver(tooltipRect, elementRect, [canAlignLeft, canAlignCenter, canAlignRight]);
+  },
+  'top-right': function topRight(tooltipRect, elementRect) {
+    return topPositionResolver(tooltipRect, elementRect, [canAlignRight, canAlignCenter, canAlignLeft]);
+  },
+  'bottom-center': function bottomCenter(tooltipRect, elementRect) {
+    return bottomPositionResolver(tooltipRect, elementRect, [canAlignCenter, canAlignLeft, canAlignRight]);
+  },
+  'bottom-left': function bottomLeft(tooltipRect, elementRect) {
+    return bottomPositionResolver(tooltipRect, elementRect, [canAlignLeft, canAlignCenter, canAlignRight]);
+  },
+  'bottom-right': function bottomRight(tooltipRect, elementRect) {
+    return bottomPositionResolver(tooltipRect, elementRect, [canAlignRight, canAlignCenter, canAlignLeft]);
+  },
+  'right-middle': function rightMiddle(tooltipRect, elementRect) {
+    return rightPositionResolver(tooltipRect, elementRect, [canAlignMiddle, canAlignTop, canAlignBottom]);
+  },
+  'right-top': function rightTop(tooltipRect, elementRect) {
+    return rightPositionResolver(tooltipRect, elementRect, [canAlignTop, canAlignMiddle, canAlignBottom]);
+  },
+  'right-bottom': function rightBottom(tooltipRect, elementRect) {
+    return rightPositionResolver(tooltipRect, elementRect, [canAlignBottom, canAlignMiddle, canAlignTop]);
+  },
+  'left-middle': function leftMiddle(tooltipRect, elementRect) {
+    return leftPositionResolver(tooltipRect, elementRect, [canAlignMiddle, canAlignTop, canAlignBottom]);
+  },
+  'left-top': function leftTop(tooltipRect, elementRect) {
+    return leftPositionResolver(tooltipRect, elementRect, [canAlignTop, canAlignMiddle, canAlignBottom]);
+  },
+  'left-bottom': function leftBottom(tooltipRect, elementRect) {
+    return leftPositionResolver(tooltipRect, elementRect, [canAlignBottom, canAlignMiddle, canAlignTop]);
+  }
+};
+var defaultPosition = 'top-center';
+export var Tooltip = function Tooltip(_ref) {
+  var children = _ref.children,
+    content = _ref.content,
+    _ref$preferredPositio = _ref.preferredPosition,
+    preferredPosition = _ref$preferredPositio === void 0 ? defaultPosition : _ref$preferredPositio;
+  var tooltipRef = useRef(null);
+  var elRef = useRef(null);
+  var tooltipPositionsHandlerRef = useRef(null);
+  var _useState = useState(null),
+    toolTipCoord = _useState[0],
+    setToolTipCoord = _useState[1];
+  var _useState2 = useState(false),
+    isActive = _useState2[0],
+    setIsActive = _useState2[1];
+  var _useState3 = useState(null),
+    overridePosition = _useState3[0],
+    setOverridePosition = _useState3[1];
+  if (!allPositions.includes(preferredPosition)) {
+    preferredPosition = defaultPosition;
+    console.warn("\"" + preferredPosition + "\" is not a valid tooltip positon, \"" + defaultPosition + "\" will be used instead");
+  }
+  var position = overridePosition || preferredPosition;
+  var handleTooltipPositions = function handleTooltipPositions(tooltipRect, elRect, currentPosition) {
+    var resolver = tooltipPositionResolvers[position] || tooltipPositionResolvers[defaultPosition];
+    var newLeft = 0;
+    var newTop = 0;
+    if (position.startsWith('top')) {
+      newTop = elRect.top - tooltipRect.height - verticalBuffer;
+      newLeft = elRect.left + elRect.width / 2;
+    }
+    if (position.startsWith('bottom')) {
+      newTop = elRect.top + elRect.height + verticalBuffer;
+      newLeft = elRect.left + elRect.width / 2;
+    }
+    if (position.startsWith('left')) {
+      newTop = elRect.top + elRect.height / 2;
+      newLeft = elRect.left - tooltipRect.width - horizontalBuffer;
+    }
+    if (position.startsWith('right')) {
+      newTop = elRect.top + elRect.height / 2;
+      newLeft = elRect.left + elRect.width + horizontalBuffer;
+    }
+    setToolTipCoord({
+      top: newTop,
+      left: newLeft
+    });
+    var tooltipRectNew = new DOMRect(newLeft, newTop, tooltipRect.width, tooltipRect.height);
+    var resolvedPosition = resolver(tooltipRectNew, elRect);
+    if (!overridePosition && resolvedPosition !== currentPosition) {
+      setOverridePosition(resolvedPosition);
+    }
+  };
+  tooltipPositionsHandlerRef.current = handleTooltipPositions;
+  useEffect(function () {
+    if (isActive) {
+      var _tooltipRef$current, _elRef$current;
+      tooltipPositionsHandlerRef.current(tooltipRef == null ? void 0 : (_tooltipRef$current = tooltipRef.current) == null ? void 0 : _tooltipRef$current.getClientRects()[0], elRef == null ? void 0 : (_elRef$current = elRef.current) == null ? void 0 : _elRef$current.getClientRects()[0], position);
+    }
+  }, [isActive, position]);
+  var contentMarkup = typeof content === 'string' ? /*#__PURE__*/React.createElement(Typography, {
+    as: "div",
+    variant: "body1"
+  }, content) : content;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledTooltipContainer, {
+    ref: elRef,
+    onMouseEnter: function onMouseEnter() {
+      return setIsActive(true);
+    },
+    onMouseLeave: function onMouseLeave() {
+      return setIsActive(false);
+    }
+  }, children), isActive && /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(StyledTooltip, {
+    "data-position": position,
+    ref: tooltipRef,
+    style: {
+      top: (toolTipCoord == null ? void 0 : toolTipCoord.top) + 'px',
+      left: (toolTipCoord == null ? void 0 : toolTipCoord.left) + 'px',
+      visibility: toolTipCoord ? 'visible' : 'hidden'
+    }
+  }, /*#__PURE__*/React.createElement(StyledTooltipArrow, {
+    className: "arrow"
+  }), contentMarkup)));
+};

package/es/@next/Tooltip/Tooltip.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Interactive: any;

package/es/@next/Tooltip/TooltipAdaptiveBottom.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const AdaptiveBottomCenter: any;
+export declare const AdaptiveBottomLeft: any;
+export declare const AdaptiveBottomRight: any;

package/es/@next/Tooltip/TooltipAdaptiveLeft.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const AdaptiveLeftMiddle: any;
+export declare const AdaptiveLeftTop: any;
+export declare const AdaptiveLeftBottom: any;

package/es/@next/Tooltip/TooltipAdaptiveRight.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const AdaptiveRightMiddle: any;
+export declare const AdaptiveRightTop: any;
+export declare const AdaptiveRightBottom: any;

package/es/@next/Tooltip/TooltipAdaptiveTop.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const AdaptiveTopCenter: any;
+export declare const AdaptiveTopLeft: any;
+export declare const AdaptiveTopRight: any;

package/es/@next/Tooltip/TooltipStyle.d.ts

@@ -0,0 +1,3 @@
+export declare const StyledTooltipContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledTooltip: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledTooltipArrow: import("styled-components").StyledComponent<"div", any, {}, never>;

package/es/@next/Tooltip/TooltipStyle.js

@@ -0,0 +1,22 @@
+import styled from 'styled-components';
+import * as Breakpoints from '../utilities/breakpoints';
+import { borderRadius2 } from '../utilities/borderRadius';
+import { Neutral } from '../utilities/colors';
+import { space12, space8 } from '../utilities/spacing';
+import { nonCenterArrowSpace, verticalBuffer } from './positionResolverHelper';
+var verticalMargin = verticalBuffer + "px";
+var arrowSize = '6px';
+var nonCentralArrowMargin = nonCenterArrowSpace + "px";
+var background = Neutral.B18;
+export var StyledTooltipContainer = styled.div.withConfig({
+  displayName: "TooltipStyle__StyledTooltipContainer",
+  componentId: "sc-37e5z7-0"
+})(["display:inline-block;position:relative;*{display:block;}"]);
+export var StyledTooltip = styled.div.withConfig({
+  displayName: "TooltipStyle__StyledTooltip",
+  componentId: "sc-37e5z7-1"
+})(["position:absolute;text-align:left;height:fit-content;width:fit-content;max-width:320px;border-radius:", ";gap:10px;left:50%;transform:translateX(-50%);padding:", " ", ";color:", ";background:", ";z-index:100;overflow-wrap:break-word;line-height:1;&[data-position='top-left'],&[data-position='bottom-left']{transform:translateX( calc(100% * -1 + ", " + ", ") );}&[data-position='top-right'],&[data-position='bottom-right']{transform:translateX(calc((", " + ", ") * -1));}&[data-position='right-middle']{transform:translateX(0) translateY(-50%);}&[data-position='left-bottom'],&[data-position='right-bottom']{transform:translateY(calc((", " + ", ") * -1));}&[data-position='left-top'],&[data-position='right-top']{transform:translateY( calc(100% * -1 + (", " + ", ")) );}&[data-position='bottom-center'],&[data-position='bottom-left'],&[data-position='bottom-right']{top:calc((100% + ", "));}&[data-position='left-middle']{transform:translateX(0) translateY(-50%);}&[data-position='top-center'] .arrow,&[data-position='top-left'] .arrow,&[data-position='top-right'] .arrow{top:100%;border-top-color:", ";}&[data-position='top-left'] .arrow,&[data-position='bottom-left'] .arrow{left:calc(100% - ", " - ", ");}&[data-position='top-right'] .arrow,&[data-position='bottom-right'] .arrow{left:calc(", " + ", ");}&[data-position='right-middle'] .arrow,&[data-position='right-top'] .arrow,&[data-position='right-bottom'] .arrow{top:50%;left:calc(", " * -1);border-right-color:", ";}&[data-position='right-middle'] .arrow{transform:translateX(0) translateY(-50%);}&[data-position='left-bottom'] .arrow,&[data-position='right-bottom'] .arrow{top:", ";}&[data-position='bottom-center'] .arrow,&[data-position='bottom-left'] .arrow,&[data-position='bottom-right'] .arrow{bottom:100%;border-bottom-color:", ";}&[data-position='left-middle'] .arrow,&[data-position='left-top'] .arrow,&[data-position='left-bottom'] .arrow{left:auto;right:calc(", " * -2);border-left-color:", ";}&[data-position='left-middle'] .arrow{top:50%;transform:translateX(0) translateY(-50%);}&[data-position='left-top'] .arrow,&[data-position='right-top'] .arrow{top:unset;bottom:", ";}@media (max-width:", "){min-width:69px;}"], borderRadius2, space8, space12, Neutral.B100, background, arrowSize, nonCentralArrowMargin, arrowSize, nonCentralArrowMargin, nonCentralArrowMargin, arrowSize, nonCentralArrowMargin, arrowSize, verticalMargin, background, arrowSize, nonCentralArrowMargin, arrowSize, nonCentralArrowMargin, arrowSize, background, nonCentralArrowMargin, background, arrowSize, background, nonCentralArrowMargin, Breakpoints.large);
+export var StyledTooltipArrow = styled.div.withConfig({
+  displayName: "TooltipStyle__StyledTooltipArrow",
+  componentId: "sc-37e5z7-2"
+})(["content:' ';left:50%;border:solid transparent;height:0;width:0;position:absolute;pointer-events:none;border-width:", ";margin-left:calc(", " * -1);"], arrowSize, arrowSize);

package/es/@next/Tooltip/index.d.ts

@@ -0,0 +1 @@
+export * from './Tooltip';

package/es/@next/Tooltip/index.js

@@ -0,0 +1 @@
+export * from './Tooltip';

package/es/@next/Tooltip/positionResolver.d.ts

@@ -0,0 +1,6 @@
+import { PreferredHorizontalAligmentFuncsType, PreferredVerticalAligmentFuncsType } from './positionResolverHelper';
+import { TooltipPosition } from './Tooltip';
+export declare const topPositionResolver: (tooltipRect: DOMRect, elRect: DOMRect, preferredAligmentFuncs: PreferredHorizontalAligmentFuncsType[]) => TooltipPosition;
+export declare const bottomPositionResolver: (tooltipRect: DOMRect, elRect: DOMRect, preferredAligmentFuncs: PreferredHorizontalAligmentFuncsType[]) => TooltipPosition;
+export declare const leftPositionResolver: (tooltipRect: DOMRect, elRect: DOMRect, preferredAligmentFuncs: PreferredVerticalAligmentFuncsType[]) => TooltipPosition;
+export declare const rightPositionResolver: (tooltipRect: DOMRect, elRect: DOMRect, preferredAligmentFuncs: PreferredVerticalAligmentFuncsType[]) => TooltipPosition;

package/es/@next/Tooltip/positionResolver.js

@@ -0,0 +1,181 @@
+import { canAlignLeft, canAlignRight, canAlignCenter, canStayOnTop, canFitOnTheLeft, horizontalBuffer, canFitOnTheRight, canFitBelow, verticalBuffer, tryCalculateAligment, canAlignMiddle, canAlignTop, canAlignBottom, canStayOnBottom, canFitOnTheTop, canStayOnLeft, canStayOnRight } from './positionResolverHelper';
+export var topPositionResolver = function topPositionResolver(tooltipRect, elRect, preferredAligmentFuncs) {
+  var horizontalPreferredAligmentFuncs = preferredAligmentFuncs;
+  var verticalPreferredAligmentFuncs = [canAlignMiddle, canAlignTop, canAlignBottom];
+  if (canStayOnTop(tooltipRect)) {
+    var alignResult = tryCalculateAligment({
+      preferredAlignmentFuncs: horizontalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (alignResult) {
+      return "top-" + alignResult;
+    }
+  }
+  if (canFitOnTheLeft(tooltipRect, elRect, horizontalBuffer)) {
+    var _alignResult = tryCalculateAligment({
+      preferredAlignmentFuncs: verticalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (_alignResult) {
+      return "left-" + _alignResult;
+    }
+  }
+  if (canFitOnTheRight(tooltipRect, elRect, horizontalBuffer)) {
+    var _alignResult2 = tryCalculateAligment({
+      preferredAlignmentFuncs: verticalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (_alignResult2) {
+      return "right-" + _alignResult2;
+    }
+  }
+  if (canFitBelow(tooltipRect, elRect, verticalBuffer)) {
+    var _alignResult3 = tryCalculateAligment({
+      preferredAlignmentFuncs: horizontalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (_alignResult3) {
+      return "bottom-" + _alignResult3;
+    }
+  }
+  return 'top-center';
+};
+export var bottomPositionResolver = function bottomPositionResolver(tooltipRect, elRect, preferredAligmentFuncs) {
+  var horizontalPreferredAligmentFuncs = preferredAligmentFuncs;
+  var verticalPreferredAligmentFuncs = [canAlignMiddle, canAlignTop, canAlignBottom];
+  if (canStayOnBottom(tooltipRect)) {
+    var alignResult = tryCalculateAligment({
+      preferredAlignmentFuncs: horizontalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (alignResult) {
+      return "bottom-" + alignResult;
+    }
+  }
+  if (canFitOnTheLeft(tooltipRect, elRect, horizontalBuffer)) {
+    var _alignResult4 = tryCalculateAligment({
+      preferredAlignmentFuncs: verticalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (_alignResult4) {
+      return "left-" + _alignResult4;
+    }
+  }
+  if (canFitOnTheRight(tooltipRect, elRect, horizontalBuffer)) {
+    var _alignResult5 = tryCalculateAligment({
+      preferredAlignmentFuncs: verticalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (_alignResult5) {
+      return "right-" + _alignResult5;
+    }
+  }
+  if (canFitOnTheTop(tooltipRect, elRect, verticalBuffer)) {
+    var _alignResult6 = tryCalculateAligment({
+      preferredAlignmentFuncs: horizontalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (_alignResult6) {
+      return "top-" + _alignResult6;
+    }
+  }
+  return 'bottom-center';
+};
+export var leftPositionResolver = function leftPositionResolver(tooltipRect, elRect, preferredAligmentFuncs) {
+  var horizontalPreferredAligmentFuncs = [canAlignCenter, canAlignLeft, canAlignRight];
+  var verticalPreferredAligmentFuncs = preferredAligmentFuncs;
+  if (canStayOnLeft(tooltipRect)) {
+    var alignResult = tryCalculateAligment({
+      preferredAlignmentFuncs: verticalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (alignResult) {
+      return "left-" + alignResult;
+    }
+  }
+  if (canFitOnTheTop(tooltipRect, elRect, horizontalBuffer)) {
+    var _alignResult7 = tryCalculateAligment({
+      preferredAlignmentFuncs: horizontalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (_alignResult7) {
+      return "top-" + _alignResult7;
+    }
+  }
+  if (canFitOnTheRight(tooltipRect, elRect, horizontalBuffer)) {
+    var _alignResult8 = tryCalculateAligment({
+      preferredAlignmentFuncs: verticalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (_alignResult8) {
+      return "right-" + _alignResult8;
+    }
+  }
+  if (canFitBelow(tooltipRect, elRect, verticalBuffer)) {
+    var _alignResult9 = tryCalculateAligment({
+      preferredAlignmentFuncs: horizontalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (_alignResult9) {
+      return "bottom-" + _alignResult9;
+    }
+  }
+  return 'left-middle';
+};
+export var rightPositionResolver = function rightPositionResolver(tooltipRect, elRect, preferredAligmentFuncs) {
+  var horizontalPreferredAligmentFuncs = [canAlignCenter, canAlignLeft, canAlignRight];
+  var verticalPreferredAligmentFuncs = preferredAligmentFuncs;
+  if (canStayOnRight(tooltipRect)) {
+    var alignResult = tryCalculateAligment({
+      preferredAlignmentFuncs: verticalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (alignResult) {
+      return "right-" + alignResult;
+    }
+  }
+  if (canFitOnTheTop(tooltipRect, elRect, horizontalBuffer)) {
+    var _alignResult10 = tryCalculateAligment({
+      preferredAlignmentFuncs: horizontalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (_alignResult10) {
+      return "top-" + _alignResult10;
+    }
+  }
+  if (canFitOnTheLeft(tooltipRect, elRect, horizontalBuffer)) {
+    var _alignResult11 = tryCalculateAligment({
+      preferredAlignmentFuncs: verticalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (_alignResult11) {
+      return "left-" + _alignResult11;
+    }
+  }
+  if (canFitBelow(tooltipRect, elRect, verticalBuffer)) {
+    var _alignResult12 = tryCalculateAligment({
+      preferredAlignmentFuncs: horizontalPreferredAligmentFuncs,
+      tooltipRect: tooltipRect,
+      elRect: elRect
+    });
+    if (_alignResult12) {
+      return "bottom-" + _alignResult12;
+    }
+  }
+  return 'right-middle';
+};

package/es/@next/Tooltip/positionResolverHelper.d.ts

@@ -0,0 +1,37 @@
+export declare const verticalBuffer = 8;
+export declare const horizontalBuffer = 8;
+export declare const nonCenterArrowSpace = 12;
+export declare type HorizontalAlignmentType = 'center' | 'left' | 'right';
+export declare type VerticalAlignmentType = 'middle' | 'top' | 'bottom';
+export declare type HorizontalAlignmentCalculatorResult = {
+    type: HorizontalAlignmentType;
+    result: boolean;
+};
+export declare type VerticalAlignmentCalculatorResult = {
+    type: VerticalAlignmentType;
+    result: boolean;
+};
+export declare type PreferredHorizontalAligmentFuncsType = (tooltipRect: DOMRect, elRect: DOMRect) => HorizontalAlignmentCalculatorResult;
+export declare type PreferredVerticalAligmentFuncsType = (tooltipRect: DOMRect, elRect: DOMRect) => VerticalAlignmentCalculatorResult;
+export declare type TryCalculateAlignmentArgs<T extends HorizontalAlignmentType | VerticalAlignmentType> = {
+    preferredAlignmentFuncs: T extends HorizontalAlignmentType ? PreferredHorizontalAligmentFuncsType[] : PreferredVerticalAligmentFuncsType[];
+    tooltipRect: DOMRect;
+    elRect: DOMRect;
+};
+export declare const getElementCenterPosition: (elRect: DOMRect) => number;
+export declare const getElementMiddlePosition: (elRect: DOMRect) => number;
+export declare const canFitOnTheTop: (tooltipRect: DOMRect, elRect: DOMRect, verticalMargin: number) => boolean;
+export declare const canFitBelow: (tooltipRect: DOMRect, elRect: DOMRect, verticalMargin: number) => boolean;
+export declare const canFitOnTheLeft: (tooltipRect: DOMRect, elRect: DOMRect, horizontalMargin: number) => boolean;
+export declare const canFitOnTheRight: (tooltipRect: DOMRect, elRect: DOMRect, horizontalMargin: number) => boolean;
+export declare const canAlignLeft: (tooltipRect: DOMRect, elRect: DOMRect) => HorizontalAlignmentCalculatorResult;
+export declare const canAlignRight: (tooltipRect: DOMRect, elRect: DOMRect) => HorizontalAlignmentCalculatorResult;
+export declare const canAlignCenter: (tooltipRect: DOMRect, elRect: DOMRect) => HorizontalAlignmentCalculatorResult;
+export declare const canAlignTop: (tooltipRect: DOMRect, elRect: DOMRect) => VerticalAlignmentCalculatorResult;
+export declare const canAlignBottom: (tooltipRect: DOMRect, elRect: DOMRect) => VerticalAlignmentCalculatorResult;
+export declare const canAlignMiddle: (tooltipRect: DOMRect, elRect: DOMRect) => VerticalAlignmentCalculatorResult;
+export declare const canStayOnTop: (tooltipRect: DOMRect) => boolean;
+export declare const canStayOnBottom: (tooltipRect: DOMRect) => boolean;
+export declare const canStayOnLeft: (tooltipRect: DOMRect) => boolean;
+export declare const canStayOnRight: (tooltipRect: DOMRect) => boolean;
+export declare const tryCalculateAligment: <T extends HorizontalAlignmentType | VerticalAlignmentType>(args: TryCalculateAlignmentArgs<T>) => HorizontalAlignmentType | VerticalAlignmentType;

package/es/@next/Tooltip/positionResolverHelper.js

@@ -0,0 +1,106 @@
+function _createForOfIteratorHelperLoose(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (it) return (it = it.call(o)).next.bind(it); if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; return function () { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+import { getViewportDimensions } from '../../helpers/viewPort';
+export var verticalBuffer = 8;
+export var horizontalBuffer = 8;
+export var nonCenterArrowSpace = 12;
+// for non center position the position of the arrow is 12px from the most left or right, setting it to 14 to make sure it's nicely visible
+var marginBuffer = nonCenterArrowSpace + 2;
+export var getElementCenterPosition = function getElementCenterPosition(elRect) {
+  return elRect.left + elRect.width / 2;
+};
+export var getElementMiddlePosition = function getElementMiddlePosition(elRect) {
+  return elRect.bottom + elRect.height / 2;
+};
+export var canFitOnTheTop = function canFitOnTheTop(tooltipRect, elRect, verticalMargin) {
+  return elRect.top - (verticalMargin + tooltipRect.height) > 0;
+};
+export var canFitBelow = function canFitBelow(tooltipRect, elRect, verticalMargin) {
+  return elRect.bottom + verticalMargin + tooltipRect.height < getViewportDimensions().height;
+};
+export var canFitOnTheLeft = function canFitOnTheLeft(tooltipRect, elRect, horizontalMargin) {
+  return elRect.left - (horizontalMargin + tooltipRect.width) > 0;
+};
+export var canFitOnTheRight = function canFitOnTheRight(tooltipRect, elRect, horizontalMargin) {
+  return elRect.right + horizontalMargin + tooltipRect.width < getViewportDimensions().width;
+};
+export var canAlignLeft = function canAlignLeft(tooltipRect, elRect) {
+  var centerPosition = getElementCenterPosition(elRect);
+  var hasSpaceOnTheLeftSideOfArrow = centerPosition - (tooltipRect.width - marginBuffer) > 0;
+  var hasSpaceOnTheRightSideOfArrow = centerPosition + marginBuffer < getViewportDimensions().width;
+  return {
+    type: 'left',
+    result: hasSpaceOnTheLeftSideOfArrow && hasSpaceOnTheRightSideOfArrow
+  };
+};
+export var canAlignRight = function canAlignRight(tooltipRect, elRect) {
+  var centerPosition = getElementCenterPosition(elRect);
+  var hasSpaceOnTheRightSideOfArrow = centerPosition + (tooltipRect.width - marginBuffer) < getViewportDimensions().width;
+  var hasSpaceOnTheLeftSideOfArrow = centerPosition - marginBuffer > 0;
+  return {
+    type: 'right',
+    result: hasSpaceOnTheLeftSideOfArrow && hasSpaceOnTheRightSideOfArrow
+  };
+};
+export var canAlignCenter = function canAlignCenter(tooltipRect, elRect) {
+  var centerPosition = elRect.left + elRect.width / 2;
+  return {
+    type: 'center',
+    result: centerPosition - tooltipRect.width / 2 > 0 && centerPosition + tooltipRect.width / 2 < getViewportDimensions().width
+  };
+};
+export var canAlignTop = function canAlignTop(tooltipRect, elRect) {
+  var middlePosition = getElementMiddlePosition(elRect);
+  var hasSpaceOnTheTopOfArrow = middlePosition - (tooltipRect.height - marginBuffer) > 0;
+  var hasSpaceBelowTheArrow = middlePosition + marginBuffer < getViewportDimensions().width;
+  return {
+    type: 'top',
+    result: hasSpaceOnTheTopOfArrow && hasSpaceBelowTheArrow
+  };
+};
+export var canAlignBottom = function canAlignBottom(tooltipRect, elRect) {
+  var middlePosition = getElementMiddlePosition(elRect);
+  var hasSpaceOnTopOfArrow = middlePosition + (tooltipRect.height - marginBuffer) < getViewportDimensions().height;
+  var hasSpaceBelowTheArrow = middlePosition - marginBuffer > 0;
+  return {
+    type: 'bottom',
+    result: hasSpaceBelowTheArrow && hasSpaceOnTopOfArrow
+  };
+};
+export var canAlignMiddle = function canAlignMiddle(tooltipRect, elRect) {
+  var middlePosition = elRect.top + elRect.height / 2;
+  return {
+    type: 'middle',
+    result: middlePosition - tooltipRect.height / 2 > 0 && middlePosition + tooltipRect.height / 2 < getViewportDimensions().height
+  };
+};
+export var canStayOnTop = function canStayOnTop(tooltipRect) {
+  return tooltipRect.top > 0;
+};
+export var canStayOnBottom = function canStayOnBottom(tooltipRect) {
+  console.log('tooltipRect:', tooltipRect);
+  console.log('getViewportDimensions().height: ', getViewportDimensions().height);
+  return tooltipRect.bottom < getViewportDimensions().height;
+};
+export var canStayOnLeft = function canStayOnLeft(tooltipRect) {
+  return tooltipRect.left > 0;
+};
+export var canStayOnRight = function canStayOnRight(tooltipRect) {
+  return tooltipRect.right < getViewportDimensions().width;
+};
+export var tryCalculateAligment = function tryCalculateAligment(args) {
+  var preferredAlignmentFuncs = args.preferredAlignmentFuncs,
+    tooltipRect = args.tooltipRect,
+    elRect = args.elRect;
+  for (var _iterator = _createForOfIteratorHelperLoose(preferredAlignmentFuncs), _step; !(_step = _iterator()).done;) {
+    var alignmentFunc = _step.value;
+    var _alignmentFunc = alignmentFunc(tooltipRect, elRect),
+      result = _alignmentFunc.result,
+      type = _alignmentFunc.type;
+    if (result) {
+      return type;
+    }
+  }
+  return null;
+};

package/es/@next/index.d.ts

@@ -25,5 +25,6 @@ export { Spinner, SpinnerProps } from './Spinner';
 export { Tab, TabModel, TabProps, Tabs, TabsProps } from './Tabs';
 export { Tag, TagProps } from './Tag';
 export { TextInput, TextInputProps } from './TextInput';
+export { Tooltip, TooltipPosition, TooltipProps } from './Tooltip';
 export { Typography, TypographyProps } from './Typography';
 export { Breakpoints, BorderRadius, Colors, DropShadow, Fonts, Spacing };

package/es/@next/index.js

@@ -26,5 +26,6 @@ export { Spinner, SpinnerProps } from './Spinner';
 export { Tab, TabModel, TabProps, Tabs, TabsProps } from './Tabs';
 export { Tag, TagProps } from './Tag';
 export { TextInput, TextInputProps } from './TextInput';
+export { Tooltip, TooltipPosition, TooltipProps } from './Tooltip';
 export { Typography, TypographyProps } from './Typography';
 export { Breakpoints, BorderRadius, Colors, DropShadow, Fonts, Spacing };

package/es/helpers/viewPort.d.ts

@@ -0,0 +1,4 @@
+export declare const getViewportDimensions: () => {
+    width: number;
+    height: number;
+};

package/es/helpers/viewPort.js

@@ -0,0 +1,8 @@
+export var getViewportDimensions = function getViewportDimensions() {
+  var width = Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0);
+  var height = Math.max(document.documentElement.clientHeight || 0, window.innerHeight || 0);
+  return {
+    width: width,
+    height: height
+  };
+};

package/lib/@next/Alert/AlertProvider.js

@@ -10,7 +10,9 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 var AlertProvider = function AlertProvider(_ref) {
   var children = _ref.children;
-  var _useState = (0, _react.useState)(undefined),
+  var _useState = (0, _react.useState)({
+      show: false
+    }),
     state = _useState[0],
     setState = _useState[1];
   var open = function open(props) {

package/lib/@next/Modal/ModalProvider.js

@@ -10,7 +10,9 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 var ModalProvider = function ModalProvider(_ref) {
   var children = _ref.children;
-  var _useState = (0, _react.useState)(undefined),
+  var _useState = (0, _react.useState)({
+      isOpen: false
+    }),
     state = _useState[0],
     setState = _useState[1];
   var open = function open(props) {

package/lib/@next/Tooltip/Tooltip.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+declare const allPositions: readonly ["top-center", "top-left", "top-right", "bottom-center", "bottom-left", "bottom-right", "right-middle", "right-top", "right-bottom", "left-middle", "left-top", "left-bottom"];
+export declare type TooltipPosition = typeof allPositions[number];
+export declare type TooltipProps = {
+    preferredPosition?: TooltipPosition;
+    children: React.ReactNode;
+    content: React.ReactNode;
+};
+export declare const Tooltip: ({ children, content, preferredPosition, }: TooltipProps) => JSX.Element;
+export {};