glints-aries 4.0.249 → 4.0.251

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

@@ -1,6 +1,6 @@
 import React from 'react';
 import { IconNames } from '../Icon/icons/icons';
-export declare type BannerProps = {
+export interface BannerProps extends React.HTMLAttributes<HTMLDivElement> {
     title?: string;
     /** If set will take precedent of status */
     iconName?: IconNames;
@@ -10,5 +10,7 @@ export declare type BannerProps = {
     secondaryAction?: React.ReactNode;
     dismissable?: boolean;
     onDismiss?: () => void;
-};
+    type?: 'static' | 'fixed';
+    showIcon?: boolean;
+}
 export declare const Banner: React.ForwardRefExoticComponent<BannerProps & React.RefAttributes<HTMLDivElement>>;

package/es/@next/Banner/Banner.js

@@ -1,11 +1,12 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
-var _excluded = ["title", "status", "iconName", "children", "action", "secondaryAction", "dismissable", "onDismiss"];
+var _excluded = ["title", "status", "iconName", "children", "action", "secondaryAction", "dismissable", "onDismiss", "type", "showIcon"];
 import React from 'react';
 import { ButtonGroup } from '../ButtonGroup';
 import { Icon } from '../Icon';
 import { Typography } from '../Typography';
 import { StyledBanner, StyledBannerContentContainer, StyledBannerTitle, StyledBannerTitleContainer, StyledCloseIconWrapper } from './BannerStyle';
+import { StyledFixedBanner, StyledFixedIconWrapper, StyledFixedBannerContentContainer, StyledFixedBannerButtonContainer, StyledFixedCloseIconWrapper } from './FixedBannerStyle';
 var iconNameStatusMap = {
   success: 'ri-checkbox-circle-fill',
   info: 'ri-information-fill',
@@ -22,13 +23,18 @@ export var Banner = /*#__PURE__*/React.forwardRef(function Banner(_ref, ref) {
     _ref$dismissable = _ref.dismissable,
     dismissable = _ref$dismissable === void 0 ? true : _ref$dismissable,
     onDismiss = _ref.onDismiss,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'static' : _ref$type,
+    _ref$showIcon = _ref.showIcon,
+    showIcon = _ref$showIcon === void 0 ? true : _ref$showIcon,
     props = _objectWithoutPropertiesLoose(_ref, _excluded);
   var iconByStatus = iconNameStatusMap[status];
   if (!iconByStatus) {
     console.warn("Status " + status + " is not valid, default style will be used");
   }
   var iconNameValue = iconName ? iconName : iconByStatus || iconNameStatusMap['info'];
-  return /*#__PURE__*/React.createElement(StyledBanner, _extends({
+  var actionComponent = /*#__PURE__*/React.createElement(React.Fragment, null, (action || secondaryAction) && /*#__PURE__*/React.createElement(ButtonGroup, null, action, secondaryAction));
+  if (type === 'static') return /*#__PURE__*/React.createElement(StyledBanner, _extends({
     ref: ref,
     "data-titled": !!title,
     "data-status": status
@@ -47,5 +53,28 @@ export var Banner = /*#__PURE__*/React.forwardRef(function Banner(_ref, ref) {
   }))), /*#__PURE__*/React.createElement(StyledBannerContentContainer, null, /*#__PURE__*/React.createElement(Typography, {
     as: "div",
     variant: "body1"
-  }, children)), /*#__PURE__*/React.createElement(StyledBannerContentContainer, null, action || secondaryAction && /*#__PURE__*/React.createElement(ButtonGroup, null, action, secondaryAction)));
+  }, children)), /*#__PURE__*/React.createElement(StyledBannerContentContainer, null, actionComponent));
+  return /*#__PURE__*/React.createElement(StyledFixedBanner, _extends({
+    ref: ref,
+    "data-status": status,
+    "data-nobutton": action ? '' : 'true'
+  }, props), showIcon && /*#__PURE__*/React.createElement(StyledFixedIconWrapper, {
+    "data-status": status
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: iconNameValue
+  })), /*#__PURE__*/React.createElement(StyledFixedBannerContentContainer, {
+    "data-noicon": showIcon ? '' : 'true'
+  }, /*#__PURE__*/React.createElement(Typography, {
+    as: "div",
+    variant: "body1"
+  }, children)), /*#__PURE__*/React.createElement(StyledFixedBannerButtonContainer, {
+    "data-noicon": showIcon ? '' : 'true'
+  }, actionComponent), dismissable && /*#__PURE__*/React.createElement(StyledFixedCloseIconWrapper, {
+    role: "button",
+    onClick: function onClick() {
+      return onDismiss == null ? void 0 : onDismiss();
+    }
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: "ri-close"
+  })));
 });

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

@@ -3,3 +3,6 @@ declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
 export declare const Interactive: any;
 export declare const WithButtons: any;
+export declare const WithTwoButtons: any;
+export declare const FixedBanner: any;
+export declare const FixedBannerWithButtons: any;

package/es/@next/Banner/FixedBannerStyle.d.ts

@@ -0,0 +1,5 @@
+export declare const StyledFixedBanner: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledFixedIconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledFixedBannerContentContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledFixedBannerButtonContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledFixedCloseIconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;

package/es/@next/Banner/FixedBannerStyle.js

@@ -0,0 +1,23 @@
+import styled from 'styled-components';
+import * as Breakpoints from '../utilities/breakpoints';
+import { Blue, Green, Neutral, Orange, Red } from '../utilities/colors';
+export var StyledFixedBanner = styled.div.withConfig({
+  displayName: "FixedBannerStyle__StyledFixedBanner",
+  componentId: "sc-1clh4a2-0"
+})(["position:fixed;left:0;right:0;height:56px;display:flex;justify-content:center;align-items:center;padding-inline:48px;background:", ";color:", ";svg{position:static;fill:", ";height:20px;width:20px;margin-top:4px;}&[data-status='success']{background:", ";}&[data-status='info']{background:", ";}&[data-status='warning']{background:", ";}&[data-status='critical']{background:", ";}@media (max-width:", "){padding:16px;height:100px;svg{margin-top:0px;}&[data-nobutton='true']{height:52px;}}"], Neutral.B99, Neutral.B18, Neutral.B40, Green.B89, Blue.S08, Orange.S21, Red.B100, Breakpoints.large);
+export var StyledFixedIconWrapper = styled.div.withConfig({
+  displayName: "FixedBannerStyle__StyledFixedIconWrapper",
+  componentId: "sc-1clh4a2-1"
+})(["padding-right:12px;&[data-status='success'] svg{fill:", ";}&[data-status='info'] svg{fill:", ";}&[data-status='warning'] svg{fill:", ";}&[data-status='critical'] svg{fill:", ";}@media (max-width:", "){position:absolute;left:16px;top:16px;}"], Green.B61, Blue.S99, Orange.S87, Red.B93, Breakpoints.large);
+export var StyledFixedBannerContentContainer = styled.div.withConfig({
+  displayName: "FixedBannerStyle__StyledFixedBannerContentContainer",
+  componentId: "sc-1clh4a2-2"
+})(["padding-right:16px;@media (max-width:", "){position:absolute;top:16px;left:52px;&[data-noicon='true']{left:16px;}}"], Breakpoints.large);
+export var StyledFixedBannerButtonContainer = styled.div.withConfig({
+  displayName: "FixedBannerStyle__StyledFixedBannerButtonContainer",
+  componentId: "sc-1clh4a2-3"
+})(["@media (max-width:", "){position:absolute;top:48px;left:52px;&[data-noicon='true']{left:16px;}}"], Breakpoints.large);
+export var StyledFixedCloseIconWrapper = styled.div.withConfig({
+  displayName: "FixedBannerStyle__StyledFixedCloseIconWrapper",
+  componentId: "sc-1clh4a2-4"
+})(["cursor:pointer;position:absolute;color:", ";right:48px;padding-left:16px;svg{fill:", ";}@media (max-width:", "){top:16px;right:16px;}"], Neutral.B40, Neutral.B40, Breakpoints.large);

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

@@ -7,3 +7,4 @@ export declare const WithOverflowContent: any;
 export declare const WithLockedScrollableBackdrop: any;
 export declare const WithSpinner: any;
 export declare const WithCustomActions: any;
+export declare const WithNumberInputAndTooltip: any;

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

@@ -5,6 +5,7 @@ export declare type TooltipProps = {
     preferredPosition?: TooltipPosition;
     children: React.ReactNode;
     content: React.ReactNode;
+    zIndex?: number;
 };
-export declare const Tooltip: ({ children, content, preferredPosition, }: TooltipProps) => JSX.Element;
+export declare const Tooltip: ({ children, content, preferredPosition, zIndex, }: TooltipProps) => JSX.Element;
 export {};

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

@@ -52,7 +52,8 @@ 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;
+    preferredPosition = _ref$preferredPositio === void 0 ? defaultPosition : _ref$preferredPositio,
+    zIndex = _ref.zIndex;
   var tooltipRef = useRef(null);
   var elRef = useRef(null);
   var tooltipPositionsHandlerRef = useRef(null);
@@ -122,6 +123,7 @@ export var Tooltip = function Tooltip(_ref) {
   }, children), isActive && /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(StyledTooltip, {
     "data-position": position,
     ref: tooltipRef,
+    zIndex: zIndex,
     style: {
       top: (toolTipCoord == null ? void 0 : toolTipCoord.top) + 'px',
       left: (toolTipCoord == null ? void 0 : toolTipCoord.left) + 'px',

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

@@ -1,3 +1,5 @@
 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 StyledTooltip: import("styled-components").StyledComponent<"div", any, {
+    zIndex?: number;
+}, never>;
 export declare const StyledTooltipArrow: import("styled-components").StyledComponent<"div", any, {}, never>;

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

@@ -11,11 +11,13 @@ var background = Neutral.B18;
 export var StyledTooltipContainer = styled.div.withConfig({
   displayName: "TooltipStyle__StyledTooltipContainer",
   componentId: "sc-37e5z7-0"
-})(["display:inline-block;position:relative;*{display:block;}"]);
+})(["display:inline-block;position:relative;> svg{display:block;}"]);
 export var StyledTooltip = styled.div.withConfig({
   displayName: "TooltipStyle__StyledTooltip",
   componentId: "sc-37e5z7-1"
-})(["position:fixed;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);
+})(["position:fixed;text-align:left;height:fit-content;width:fit-content;max-width:320px;border-radius:", ";gap:10px;left:50%;transform:translateX(-50%);padding:", " ", ";color:", ";background:", ";overflow-wrap:break-word;line-height:1;z-index:", ";&[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, function (props) {
+  return props.zIndex ? props.zIndex : 100;
+}, 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"

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

@@ -1,6 +1,6 @@
 import React from 'react';
 import { IconNames } from '../Icon/icons/icons';
-export declare type BannerProps = {
+export interface BannerProps extends React.HTMLAttributes<HTMLDivElement> {
     title?: string;
     /** If set will take precedent of status */
     iconName?: IconNames;
@@ -10,5 +10,7 @@ export declare type BannerProps = {
     secondaryAction?: React.ReactNode;
     dismissable?: boolean;
     onDismiss?: () => void;
-};
+    type?: 'static' | 'fixed';
+    showIcon?: boolean;
+}
 export declare const Banner: React.ForwardRefExoticComponent<BannerProps & React.RefAttributes<HTMLDivElement>>;

package/lib/@next/Banner/Banner.js

@@ -10,7 +10,8 @@ var _ButtonGroup = require("../ButtonGroup");
 var _Icon = require("../Icon");
 var _Typography = require("../Typography");
 var _BannerStyle = require("./BannerStyle");
-var _excluded = ["title", "status", "iconName", "children", "action", "secondaryAction", "dismissable", "onDismiss"];
+var _FixedBannerStyle = require("./FixedBannerStyle");
+var _excluded = ["title", "status", "iconName", "children", "action", "secondaryAction", "dismissable", "onDismiss", "type", "showIcon"];
 var iconNameStatusMap = {
   success: 'ri-checkbox-circle-fill',
   info: 'ri-information-fill',
@@ -27,13 +28,18 @@ var Banner = /*#__PURE__*/_react["default"].forwardRef(function Banner(_ref, ref
     _ref$dismissable = _ref.dismissable,
     dismissable = _ref$dismissable === void 0 ? true : _ref$dismissable,
     onDismiss = _ref.onDismiss,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'static' : _ref$type,
+    _ref$showIcon = _ref.showIcon,
+    showIcon = _ref$showIcon === void 0 ? true : _ref$showIcon,
     props = (0, _objectWithoutPropertiesLoose2["default"])(_ref, _excluded);
   var iconByStatus = iconNameStatusMap[status];
   if (!iconByStatus) {
     console.warn("Status " + status + " is not valid, default style will be used");
   }
   var iconNameValue = iconName ? iconName : iconByStatus || iconNameStatusMap['info'];
-  return /*#__PURE__*/_react["default"].createElement(_BannerStyle.StyledBanner, (0, _extends2["default"])({
+  var actionComponent = /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, (action || secondaryAction) && /*#__PURE__*/_react["default"].createElement(_ButtonGroup.ButtonGroup, null, action, secondaryAction));
+  if (type === 'static') return /*#__PURE__*/_react["default"].createElement(_BannerStyle.StyledBanner, (0, _extends2["default"])({
     ref: ref,
     "data-titled": !!title,
     "data-status": status
@@ -52,6 +58,29 @@ var Banner = /*#__PURE__*/_react["default"].forwardRef(function Banner(_ref, ref
   }))), /*#__PURE__*/_react["default"].createElement(_BannerStyle.StyledBannerContentContainer, null, /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
     as: "div",
     variant: "body1"
-  }, children)), /*#__PURE__*/_react["default"].createElement(_BannerStyle.StyledBannerContentContainer, null, action || secondaryAction && /*#__PURE__*/_react["default"].createElement(_ButtonGroup.ButtonGroup, null, action, secondaryAction)));
+  }, children)), /*#__PURE__*/_react["default"].createElement(_BannerStyle.StyledBannerContentContainer, null, actionComponent));
+  return /*#__PURE__*/_react["default"].createElement(_FixedBannerStyle.StyledFixedBanner, (0, _extends2["default"])({
+    ref: ref,
+    "data-status": status,
+    "data-nobutton": action ? '' : 'true'
+  }, props), showIcon && /*#__PURE__*/_react["default"].createElement(_FixedBannerStyle.StyledFixedIconWrapper, {
+    "data-status": status
+  }, /*#__PURE__*/_react["default"].createElement(_Icon.Icon, {
+    name: iconNameValue
+  })), /*#__PURE__*/_react["default"].createElement(_FixedBannerStyle.StyledFixedBannerContentContainer, {
+    "data-noicon": showIcon ? '' : 'true'
+  }, /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
+    as: "div",
+    variant: "body1"
+  }, children)), /*#__PURE__*/_react["default"].createElement(_FixedBannerStyle.StyledFixedBannerButtonContainer, {
+    "data-noicon": showIcon ? '' : 'true'
+  }, actionComponent), dismissable && /*#__PURE__*/_react["default"].createElement(_FixedBannerStyle.StyledFixedCloseIconWrapper, {
+    role: "button",
+    onClick: function onClick() {
+      return onDismiss == null ? void 0 : onDismiss();
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_Icon.Icon, {
+    name: "ri-close"
+  })));
 });
 exports.Banner = Banner;

package/lib/@next/Banner/Banner.stories.d.ts

@@ -3,3 +3,6 @@ declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
 export declare const Interactive: any;
 export declare const WithButtons: any;
+export declare const WithTwoButtons: any;
+export declare const FixedBanner: any;
+export declare const FixedBannerWithButtons: any;

package/lib/@next/Banner/FixedBannerStyle.d.ts

@@ -0,0 +1,5 @@
+export declare const StyledFixedBanner: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledFixedIconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledFixedBannerContentContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledFixedBannerButtonContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledFixedCloseIconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;

package/lib/@next/Banner/FixedBannerStyle.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.StyledFixedIconWrapper = exports.StyledFixedCloseIconWrapper = exports.StyledFixedBannerContentContainer = exports.StyledFixedBannerButtonContainer = exports.StyledFixedBanner = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var Breakpoints = _interopRequireWildcard(require("../utilities/breakpoints"));
+var _colors = require("../utilities/colors");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+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 StyledFixedBanner = _styledComponents["default"].div.withConfig({
+  displayName: "FixedBannerStyle__StyledFixedBanner",
+  componentId: "sc-1clh4a2-0"
+})(["position:fixed;left:0;right:0;height:56px;display:flex;justify-content:center;align-items:center;padding-inline:48px;background:", ";color:", ";svg{position:static;fill:", ";height:20px;width:20px;margin-top:4px;}&[data-status='success']{background:", ";}&[data-status='info']{background:", ";}&[data-status='warning']{background:", ";}&[data-status='critical']{background:", ";}@media (max-width:", "){padding:16px;height:100px;svg{margin-top:0px;}&[data-nobutton='true']{height:52px;}}"], _colors.Neutral.B99, _colors.Neutral.B18, _colors.Neutral.B40, _colors.Green.B89, _colors.Blue.S08, _colors.Orange.S21, _colors.Red.B100, Breakpoints.large);
+exports.StyledFixedBanner = StyledFixedBanner;
+var StyledFixedIconWrapper = _styledComponents["default"].div.withConfig({
+  displayName: "FixedBannerStyle__StyledFixedIconWrapper",
+  componentId: "sc-1clh4a2-1"
+})(["padding-right:12px;&[data-status='success'] svg{fill:", ";}&[data-status='info'] svg{fill:", ";}&[data-status='warning'] svg{fill:", ";}&[data-status='critical'] svg{fill:", ";}@media (max-width:", "){position:absolute;left:16px;top:16px;}"], _colors.Green.B61, _colors.Blue.S99, _colors.Orange.S87, _colors.Red.B93, Breakpoints.large);
+exports.StyledFixedIconWrapper = StyledFixedIconWrapper;
+var StyledFixedBannerContentContainer = _styledComponents["default"].div.withConfig({
+  displayName: "FixedBannerStyle__StyledFixedBannerContentContainer",
+  componentId: "sc-1clh4a2-2"
+})(["padding-right:16px;@media (max-width:", "){position:absolute;top:16px;left:52px;&[data-noicon='true']{left:16px;}}"], Breakpoints.large);
+exports.StyledFixedBannerContentContainer = StyledFixedBannerContentContainer;
+var StyledFixedBannerButtonContainer = _styledComponents["default"].div.withConfig({
+  displayName: "FixedBannerStyle__StyledFixedBannerButtonContainer",
+  componentId: "sc-1clh4a2-3"
+})(["@media (max-width:", "){position:absolute;top:48px;left:52px;&[data-noicon='true']{left:16px;}}"], Breakpoints.large);
+exports.StyledFixedBannerButtonContainer = StyledFixedBannerButtonContainer;
+var StyledFixedCloseIconWrapper = _styledComponents["default"].div.withConfig({
+  displayName: "FixedBannerStyle__StyledFixedCloseIconWrapper",
+  componentId: "sc-1clh4a2-4"
+})(["cursor:pointer;position:absolute;color:", ";right:48px;padding-left:16px;svg{fill:", ";}@media (max-width:", "){top:16px;right:16px;}"], _colors.Neutral.B40, _colors.Neutral.B40, Breakpoints.large);
+exports.StyledFixedCloseIconWrapper = StyledFixedCloseIconWrapper;

package/lib/@next/Modal/Modal.stories.d.ts

@@ -7,3 +7,4 @@ export declare const WithOverflowContent: any;
 export declare const WithLockedScrollableBackdrop: any;
 export declare const WithSpinner: any;
 export declare const WithCustomActions: any;
+export declare const WithNumberInputAndTooltip: any;

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

@@ -5,6 +5,7 @@ export declare type TooltipProps = {
     preferredPosition?: TooltipPosition;
     children: React.ReactNode;
     content: React.ReactNode;
+    zIndex?: number;
 };
-export declare const Tooltip: ({ children, content, preferredPosition, }: TooltipProps) => JSX.Element;
+export declare const Tooltip: ({ children, content, preferredPosition, zIndex, }: TooltipProps) => JSX.Element;
 export {};

package/lib/@next/Tooltip/Tooltip.js

@@ -58,7 +58,8 @@ var Tooltip = function Tooltip(_ref) {
   var children = _ref.children,
     content = _ref.content,
     _ref$preferredPositio = _ref.preferredPosition,
-    preferredPosition = _ref$preferredPositio === void 0 ? defaultPosition : _ref$preferredPositio;
+    preferredPosition = _ref$preferredPositio === void 0 ? defaultPosition : _ref$preferredPositio,
+    zIndex = _ref.zIndex;
   var tooltipRef = (0, _react.useRef)(null);
   var elRef = (0, _react.useRef)(null);
   var tooltipPositionsHandlerRef = (0, _react.useRef)(null);
@@ -128,6 +129,7 @@ var Tooltip = function Tooltip(_ref) {
   }, children), isActive && /*#__PURE__*/_react["default"].createElement(_Portal.Portal, null, /*#__PURE__*/_react["default"].createElement(_TooltipStyle.StyledTooltip, {
     "data-position": position,
     ref: tooltipRef,
+    zIndex: zIndex,
     style: {
       top: (toolTipCoord == null ? void 0 : toolTipCoord.top) + 'px',
       left: (toolTipCoord == null ? void 0 : toolTipCoord.left) + 'px',

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

@@ -1,3 +1,5 @@
 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 StyledTooltip: import("styled-components").StyledComponent<"div", any, {
+    zIndex?: number;
+}, never>;
 export declare const StyledTooltipArrow: import("styled-components").StyledComponent<"div", any, {}, never>;

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

@@ -18,12 +18,14 @@ var background = _colors.Neutral.B18;
 var StyledTooltipContainer = _styledComponents["default"].div.withConfig({
   displayName: "TooltipStyle__StyledTooltipContainer",
   componentId: "sc-37e5z7-0"
-})(["display:inline-block;position:relative;*{display:block;}"]);
+})(["display:inline-block;position:relative;> svg{display:block;}"]);
 exports.StyledTooltipContainer = StyledTooltipContainer;
 var StyledTooltip = _styledComponents["default"].div.withConfig({
   displayName: "TooltipStyle__StyledTooltip",
   componentId: "sc-37e5z7-1"
-})(["position:fixed;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;}"], _borderRadius.borderRadius2, _spacing.space8, _spacing.space12, _colors.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);
+})(["position:fixed;text-align:left;height:fit-content;width:fit-content;max-width:320px;border-radius:", ";gap:10px;left:50%;transform:translateX(-50%);padding:", " ", ";color:", ";background:", ";overflow-wrap:break-word;line-height:1;z-index:", ";&[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;}"], _borderRadius.borderRadius2, _spacing.space8, _spacing.space12, _colors.Neutral.B100, background, function (props) {
+  return props.zIndex ? props.zIndex : 100;
+}, arrowSize, nonCentralArrowMargin, arrowSize, nonCentralArrowMargin, nonCentralArrowMargin, arrowSize, nonCentralArrowMargin, arrowSize, verticalMargin, background, arrowSize, nonCentralArrowMargin, arrowSize, nonCentralArrowMargin, arrowSize, background, nonCentralArrowMargin, background, arrowSize, background, nonCentralArrowMargin, Breakpoints.large);
 exports.StyledTooltip = StyledTooltip;
 var StyledTooltipArrow = _styledComponents["default"].div.withConfig({
   displayName: "TooltipStyle__StyledTooltipArrow",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "glints-aries",
-  "version": "4.0.249",
+  "version": "4.0.251",
   "description": "Glints ui-kit for frontend",
   "main": "./lib/index.js",
   "module": "./es/index.js",