@pingux/astro 2.197.0-alpha.0 → 2.198.8-alpha.0

package/lib/cjs/components/ComboBox/ComboBoxInput.js

@@ -103,8 +103,9 @@ var ComboBoxInput = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       transform: 'rotate(180deg)'
     } : null,
     title: {
-      name: 'Menu Down'
-    }
+      name: ''
+    },
+    "aria-hidden": "true"
   }))));
   return (0, _react2.jsx)(_reactAria.FocusRing, {
     within: true,

package/lib/cjs/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.js

@@ -285,7 +285,7 @@ var EnvironmentBreadcrumb = /*#__PURE__*/(0, _react.forwardRef)(function (props,
     onChange: function onChange(val) {
       return setSearchValue(val);
     },
-    p: "10px"
+    p: "sm"
   }, searchProps)), (0, _react2.jsx)(_visuallyHidden.VisuallyHidden, {
     role: "alert",
     "aria-live": "polite",

package/lib/cjs/components/HelpHint/HelpHint.js

@@ -19,29 +19,12 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactAria = require("react-aria");
 var _reactStately = require("react-stately");
 var _interactions = require("@react-aria/interactions");
-var _uuid = require("uuid");
 var _ = require("../..");
 var _hooks = require("../../hooks");
 var _safariAgent = require("../../styles/safariAgent");
 var _react2 = require("@emotion/react");
 var _excluded = ["align", "arrowCrossOffset", "children", "className", "closeDelay", "direction", "hasNoArrow", "iconButtonProps", "isDarkMode", "isNotFlippable", "popoverProps", "tooltipProps"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof _WeakMap) var r = new _WeakMap(), n = new _WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = _Object$defineProperty) && _Object$getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-var HelpIcon = function HelpIcon() {
-  var uid = (0, _uuid.v4)();
-  return (0, _react2.jsx)("svg", {
-    width: "7",
-    height: "9",
-    viewBox: "0 0 7 9",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    "aria-labelledby": uid
-  }, (0, _react2.jsx)("title", {
-    id: uid
-  }, "Help Icon"), (0, _react2.jsx)("path", {
-    d: "M2.56685 7.306V9H4.29385V7.306H2.56685ZM0.795848 3.676H2.41285C2.41285 3.478 2.43485 3.29467 2.47885 3.126C2.52285 2.95 2.58885 2.79967 2.67685 2.675C2.77218 2.543 2.88951 2.44033 3.02885 2.367C3.17551 2.28633 3.34785 2.246 3.54585 2.246C3.83918 2.246 4.06651 2.32667 4.22785 2.488C4.39651 2.64933 4.48085 2.89867 4.48085 3.236C4.48818 3.434 4.45151 3.599 4.37085 3.731C4.29751 3.863 4.19851 3.984 4.07385 4.094C3.94918 4.204 3.81351 4.314 3.66685 4.424C3.52018 4.534 3.38085 4.666 3.24885 4.82C3.11685 4.96667 2.99951 5.14633 2.89685 5.359C2.80151 5.57167 2.74285 5.83567 2.72085 6.151V6.646H4.20585V6.228C4.23518 6.008 4.30485 5.82467 4.41485 5.678C4.53218 5.53133 4.66418 5.403 4.81085 5.293C4.95751 5.17567 5.11151 5.062 5.27285 4.952C5.44151 4.83467 5.59185 4.69533 5.72385 4.534C5.86318 4.37267 5.97685 4.17833 6.06485 3.951C6.16018 3.72367 6.20785 3.434 6.20785 3.082C6.20785 2.86933 6.16018 2.642 6.06485 2.4C5.97685 2.15067 5.82651 1.91967 5.61385 1.707C5.40118 1.49433 5.11885 1.31833 4.76685 1.179C4.42218 1.03233 3.98951 0.959 3.46885 0.959C3.06551 0.959 2.69885 1.02867 2.36885 1.168C2.04618 1.3 1.76751 1.487 1.53285 1.729C1.30551 1.971 1.12585 2.257 0.993848 2.587C0.869181 2.917 0.803181 3.28 0.795848 3.676Z",
-    fill: "#3B4A58"
-  }));
-};
 var HelpHint = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var _context;
   var align = props.align,
@@ -57,6 +40,8 @@ var HelpHint = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     popoverProps = props.popoverProps,
     tooltipProps = props.tooltipProps,
     others = (0, _objectWithoutProperties2["default"])(props, _excluded);
+  var _useGetTheme = (0, _hooks.useGetTheme)(),
+    icons = _useGetTheme.icons;
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     isFocusWithinOverlay = _useState2[0],
@@ -145,7 +130,7 @@ var HelpHint = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     "data-testid": "help-hint__button",
     variant: "hintButton"
   }, (0, _reactAria.mergeProps)(triggerProps, iconButtonProps, focusProps, hoverProps)), (0, _react2.jsx)(_.Icon, {
-    icon: HelpIcon
+    icon: icons.helpHint
   })), (0, _react2.jsx)(_.PopoverContainer, (0, _extends2["default"])({
     arrowCrossOffset: arrowCrossOffset,
     arrowProps: {

package/lib/cjs/components/IconButton/IconButton.styles.d.ts

@@ -399,8 +399,6 @@ declare const _default: {
         top: number;
         right: number;
         alignSelf: string;
-        width: string;
-        height: string;
         justifyContent: string;
         appearance: string;
         alignItems: string;
@@ -411,6 +409,8 @@ declare const _default: {
         cursor: string;
         bg: string;
         p: string;
+        width: string;
+        height: string;
         path: {
             fill: string;
         };

package/lib/cjs/components/IconWrapper/IconWrapper.js

@@ -63,9 +63,7 @@ var IconWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     sx: _objectSpread({
       backgroundColor: "iconWrapper.wrapper.".concat(finalColor)
     }, sx),
-    className: classNames,
-    justifyContent: "center",
-    alignItems: "center"
+    className: classNames
   }, wrapperProps), (0, _react2.jsx)(_index.Icon, (0, _extends2["default"])({
     icon: icon,
     size: sizeProps.size,

package/lib/cjs/components/Modal/Modal.styles.d.ts

@@ -3,8 +3,6 @@ export declare const closeButton: {
     top: number;
     right: number;
     alignSelf: string;
-    width: string;
-    height: string;
 };
 export declare const modalCloseButton: {
     position: string;
@@ -110,8 +108,6 @@ declare const _default: {
         top: number;
         right: number;
         alignSelf: string;
-        width: string;
-        height: string;
     };
 };
 export default _default;

package/lib/cjs/components/Modal/Modal.styles.js

@@ -76,9 +76,7 @@ var closeButton = exports.closeButton = {
   position: 'absolute',
   top: 0,
   right: -14,
-  alignSelf: 'auto',
-  width: '22px',
-  height: '22px'
+  alignSelf: 'auto'
 };
 var bodyContainer = {
   px: 'lg'

package/lib/cjs/components/Modal/ModalHeader.js

@@ -19,13 +19,13 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/he
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
-var _CloseIcon = _interopRequireDefault(require("@pingux/mdi-react/CloseIcon"));
+var _hooks = require("../../hooks");
 var _Box = _interopRequireDefault(require("../Box"));
 var _Icon = _interopRequireDefault(require("../Icon"));
 var _IconButton = _interopRequireDefault(require("../IconButton"));
 var _Text = _interopRequireDefault(require("../Text"));
 var _react2 = require("@emotion/react");
-var _excluded = ["closeButton", "hasCloseButton", "title", "onClose", "containerProps", "titleProps", "hasNoSeparator"];
+var _excluded = ["closeButton", "hasCloseButton", "title", "onClose", "containerProps", "titleProps", "hasNoSeparator", "closeButtonProps"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof _WeakMap) var r = new _WeakMap(), n = new _WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = _Object$defineProperty) && _Object$getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -37,10 +37,17 @@ var ModalHeader = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     containerProps = props.containerProps,
     titleProps = props.titleProps,
     hasNoSeparator = props.hasNoSeparator,
+    closeButtonProps = props.closeButtonProps,
     rest = (0, _objectWithoutProperties2["default"])(props, _excluded);
+  var _useGetTheme = (0, _hooks.useGetTheme)(),
+    icons = _useGetTheme.icons,
+    modalCloseIconSize = _useGetTheme.modalCloseIconSize;
+  var ModalCloseIcon = icons.ModalCloseIcon;
   var titleContent = typeof title === 'string' && title ? (0, _react2.jsx)(_Box["default"], {
     flex: "1"
-  }, (0, _react2.jsx)(_Text["default"], (0, _extends2["default"])({}, titleProps, {
+  }, (0, _react2.jsx)(_Text["default"], (0, _extends2["default"])({
+    as: "h3"
+  }, titleProps, {
     variant: "modalTitle",
     role: "heading",
     "aria-level": 1
@@ -55,16 +62,17 @@ var ModalHeader = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     sx: _objectSpread({
       borderBottomWidth: hasNoSeparator ? '0px' : '1px'
     }, rest.sx)
-  }, containerProps, rest), titleContent, hasCloseButton && (closeButton !== null && closeButton !== void 0 ? closeButton : (0, _react2.jsx)(_IconButton["default"], {
+  }, containerProps, rest), titleContent, hasCloseButton && (closeButton !== null && closeButton !== void 0 ? closeButton : (0, _react2.jsx)(_IconButton["default"], (0, _extends2["default"])({
     "aria-label": "Close modal window",
     "data-id": "icon-button__close-modal-window",
     variant: "modalHeaderCloseButton",
     onPress: onClose
-  }, (0, _react2.jsx)(_Icon["default"], {
-    icon: _CloseIcon["default"],
+  }, closeButtonProps), (0, _react2.jsx)(_Icon["default"], {
+    icon: ModalCloseIcon,
     title: {
       name: 'Close Icon'
-    }
+    },
+    size: modalCloseIconSize
   }))));
 });
 ModalHeader.displayName = 'ModalHeader';

package/lib/cjs/components/MultivaluesField/CondensedMultivaluesField.js

@@ -393,15 +393,15 @@ var CondensedMultivaluesField = /*#__PURE__*/(0, _react.forwardRef)(function (pr
     onClick: handleButtonPress,
     sx: {
       border: 'none'
+    },
+    title: {
+      name: ''
     }
   }, (0, _react2.jsx)(_.Icon, (0, _extends2["default"])({
     icon: isOpen ? MenuUp : MenuDown
   }, isOnyx && {
     size: 'sm'
   }, {
-    title: {
-      name: ''
-    },
     "aria-hidden": "true"
   }))));
   return (0, _react2.jsx)(_MultivaluesContext.MultivaluesContext.Provider, {

package/lib/cjs/components/PanelHeader/PanelHeader.js

@@ -63,9 +63,9 @@ var PanelHeader = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var renderAvatar = (0, _react2.jsx)(_index.Avatar, (0, _extends2["default"])({
     src: image === null || image === void 0 ? void 0 : image.src,
     isSquare: !!(image !== null && image !== void 0 && image.src),
-    size: "avatar.lg",
+    size: "sm",
     defaultText: avatarDefaultText,
-    mr: "lg"
+    mr: "md"
   }, avatarProps));
   var renderImage = !icon && image && (0, _react2.jsx)(_index.Box, {
     variant: "panelHeader.iconWrapper"

package/lib/cjs/hooks/useGetTheme/useGetTheme.d.ts

@@ -58,6 +58,8 @@ declare const useGetTheme: () => {
         SuccessCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
         userExperienceIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
         WarningIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
+        helpHint: () => import("react/jsx-runtime").JSX.Element;
+        ModalCloseIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
     };
     styles: {
         navButtonEstHeight: number;
@@ -99,6 +101,7 @@ declare const useGetTheme: () => {
     };
     linkSelectFieldWidth: string;
     badgeTextFontSize: string;
+    modalCloseIconSize: import("../..").IconSize;
     themeState: {
         isAstro: boolean;
         isOnyx: boolean;
@@ -151,6 +154,8 @@ declare const useGetTheme: () => {
         SuccessCircle: string;
         userExperienceIcon: string;
         WarningIcon: string;
+        helpHint: string;
+        ModalCloseIcon: string;
     };
     defaultIconColor: string;
     badgeStyles: {
@@ -167,6 +172,7 @@ declare const useGetTheme: () => {
     pageHeaderAddIconMargin: string;
     pageHeaderAddIconSize: string;
     defaultLoaderSize: number;
+    modalCloseIconSize: import("../..").IconSize;
     accordionHoveredState: {
         '&.is-hovered': {
             color: string;

package/lib/cjs/styles/themeOverrides/nextGenDarkMode/colors.js

@@ -151,8 +151,8 @@ var colors = exports.colors = _objectSpread(_objectSpread({
   darkteal: _onyxTokens.astroTokensDark.color.teal[100],
   darkcyan: _onyxTokens.astroTokensDark.color.cyan[100],
   text: {
-    primary: _onyxTokens.astroTokensDark.color.gray[400],
-    secondary: _onyxTokens.astroTokensDark.color.gray[100],
+    primary: _onyxTokens.astroTokensDark.color.font.base,
+    secondary: _onyxTokens.astroTokensDark.color.font.light,
     message: 'white',
     fieldHelper: _onyxTokens.astroTokensDark.color.gray[400]
   },

package/lib/cjs/styles/themeOverrides/nextGenDarkMode/customProperties/icons.d.ts

@@ -40,5 +40,7 @@ declare const _default: {
     SuccessCircle: string;
     userExperienceIcon: string;
     WarningIcon: string;
+    helpHint: string;
+    ModalCloseIcon: string;
 };
 export default _default;

package/lib/cjs/styles/themeOverrides/nextGenDarkMode/customProperties/index.d.ts

@@ -43,6 +43,8 @@ export declare const nextGenDarkThemeValues: {
         SuccessCircle: string;
         userExperienceIcon: string;
         WarningIcon: string;
+        helpHint: string;
+        ModalCloseIcon: string;
     };
     defaultIconColor: string;
     badgeStyles: {
@@ -59,6 +61,7 @@ export declare const nextGenDarkThemeValues: {
     pageHeaderAddIconMargin: string;
     pageHeaderAddIconSize: string;
     defaultLoaderSize: number;
+    modalCloseIconSize: import("../../../..").IconSize;
     accordionHoveredState: {
         '&.is-hovered': {
             color: string;

package/lib/cjs/styles/themeOverrides/onyxSideNav.d.ts

@@ -318,6 +318,8 @@ declare const _default: {
         SuccessCircle: string;
         userExperienceIcon: string;
         WarningIcon: string;
+        helpHint: string;
+        ModalCloseIcon: string;
     };
     tShirtSizes: {
         xxs: number;

package/lib/cjs/styles/themes/astro/customProperties/icons.d.ts

@@ -41,5 +41,7 @@ declare const _default: {
     SuccessCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
     userExperienceIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
     WarningIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
+    helpHint: () => import("react/jsx-runtime").JSX.Element;
+    ModalCloseIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
 };
 export default _default;

package/lib/cjs/styles/themes/astro/customProperties/icons.js

@@ -10,6 +10,7 @@ _Object$defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
 var _AccountCogIcon = _interopRequireDefault(require("@pingux/mdi-react/AccountCogIcon"));
 var _AccountMultipleIcon = _interopRequireDefault(require("@pingux/mdi-react/AccountMultipleIcon"));
 var _AlertCircleIcon = _interopRequireDefault(require("@pingux/mdi-react/AlertCircleIcon"));
@@ -24,6 +25,7 @@ var _CheckboxBlankCircleOutlineIcon = _interopRequireDefault(require("@pingux/md
 var _CheckCircleIcon = _interopRequireDefault(require("@pingux/mdi-react/CheckCircleIcon"));
 var _CheckCircleOutlineIcon = _interopRequireDefault(require("@pingux/mdi-react/CheckCircleOutlineIcon"));
 var _ClipboardIcon = _interopRequireDefault(require("@pingux/mdi-react/ClipboardIcon"));
+var _CloseIcon = _interopRequireDefault(require("@pingux/mdi-react/CloseIcon"));
 var _CloseOctagonOutlineIcon = _interopRequireDefault(require("@pingux/mdi-react/CloseOctagonOutlineIcon"));
 var _ConnectionIcon = _interopRequireDefault(require("@pingux/mdi-react/ConnectionIcon"));
 var _CreateIcon = _interopRequireDefault(require("@pingux/mdi-react/CreateIcon"));
@@ -48,9 +50,27 @@ var _ShieldStarOutlineIcon = _interopRequireDefault(require("@pingux/mdi-react/S
 var _TransitConnectionVariantIcon = _interopRequireDefault(require("@pingux/mdi-react/TransitConnectionVariantIcon"));
 var _ViewDashboardIcon = _interopRequireDefault(require("@pingux/mdi-react/ViewDashboardIcon"));
 var _WebIcon = _interopRequireDefault(require("@pingux/mdi-react/WebIcon"));
+var _uuid = require("uuid");
 var _logos = require("../../../../utils/devUtils/constants/logos");
 var _statuses = _interopRequireWildcard(require("../../../../utils/devUtils/constants/statuses"));
 var _navBarIcons = require("./navBarIcons");
+var _react2 = require("@emotion/react");
 var _statuses$DEFAULT$sta;
 function _interopRequireWildcard(e, t) { if ("function" == typeof _WeakMap) var r = new _WeakMap(), n = new _WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = _Object$defineProperty) && _Object$getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-var _default = exports["default"] = (_statuses$DEFAULT$sta = {}, (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_statuses$DEFAULT$sta, _statuses["default"].DEFAULT, _InformationIcon["default"]), _statuses["default"].ERROR, _AlertCircleIcon["default"]), _statuses["default"].SUCCESS, _CheckCircleIcon["default"]), _statuses["default"].WARNING, _AlertIcon["default"]), _statuses.statusIcon.CRITICAL, _AlertCircleOutlineIcon["default"]), _statuses.statusIcon.FATAL, _CloseOctagonOutlineIcon["default"]), _statuses.statusIcon.INFO, _InformationOutlineIcon["default"]), _statuses.statusIcon.MAJOR, _ArrowUpIcon["default"]), _statuses.statusIcon.MINOR, _ArrowDownIcon["default"]), _statuses.statusIcon.WARNING_NEUTRAL, _AlertOutlineIcon["default"]), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_statuses$DEFAULT$sta, "aic", _navBarIcons.Aic), "applicationsIcon", _ApplicationOutlineIcon["default"]), "Ascending", _MenuUpIcon["default"]), "authenticationIcon", _CheckCircleOutlineIcon["default"]), "clipboard", _ClipboardIcon["default"]), "CreateIcon", _CreateIcon["default"]), "daVinci", _navBarIcons.DaVinci), "DefaultCircle", _CheckboxBlankCircleOutlineIcon["default"]), "Descending", _MenuDownIcon["default"]), "popoverMenuIcon", _MoreVertIcon["default"]), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_statuses$DEFAULT$sta, "ErrorCircle", _AlertCircleIcon["default"]), "integrationsIcon", _ConnectionIcon["default"]), "listViewMenu", _MoreVertIcon["default"]), "mdiAccountCog", _AccountCogIcon["default"]), "mdiAccountMultiple", _AccountMultipleIcon["default"]), "mdiEarth", _EarthIcon["default"]), "mdiEmoticonHappyOutline", _EmoticonHappyOutlineIcon["default"]), "mdiFingerprint", _FingerprintIcon["default"]), "mdiPlayCircleIcon", _PlayCircleIcon["default"]), "mdiScaleBalance", _ScaleBalanceIcon["default"]), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_statuses$DEFAULT$sta, "mdiShoCard", _navBarIcons.Credentials), "mdiTransitConnectionVariant", _TransitConnectionVariantIcon["default"]), "mdiViewDashboard", _ViewDashboardIcon["default"]), "mdiWeb", _GlobeIcon["default"]), "MenuDown", _MenuDownIcon["default"]), "MenuUp", _MenuUpIcon["default"]), "monitoringIcon", _PulseIcon["default"]), "openInNew", _OpenInNewIcon["default"]), "overviewIcon", _WebIcon["default"]), "p1verify", _navBarIcons.Verify), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_statuses$DEFAULT$sta, "pam", _navBarIcons.PamIcon), "PingAuthorize", _KeyChainVariantIcon["default"]), "HomeIcon", _HomeIcon["default"]), "pingLogoHorizontalSmall", _logos.pingLogoHorizontalSmallWhite), "protect", _navBarIcons.Protect), "rocketLaunchIcon", _RocketLaunchIcon["default"]), "shareFeedbackIcon", _ChatIcon["default"]), "shieldStar", _ShieldStarOutlineIcon["default"]), "SuccessCircle", _CheckCircleIcon["default"]), "userExperienceIcon", _MonitorScreenshotIcon["default"]), (0, _defineProperty2["default"])(_statuses$DEFAULT$sta, "WarningIcon", _AlertOutlineIcon["default"]));
+var HelpIcon = function HelpIcon() {
+  var uid = (0, _uuid.v4)();
+  return (0, _react2.jsx)("svg", {
+    width: "7",
+    height: "9",
+    viewBox: "0 0 7 9",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-labelledby": uid
+  }, (0, _react2.jsx)("title", {
+    id: uid
+  }, "Help Icon"), (0, _react2.jsx)("path", {
+    d: "M2.56685 7.306V9H4.29385V7.306H2.56685ZM0.795848 3.676H2.41285C2.41285 3.478 2.43485 3.29467 2.47885 3.126C2.52285 2.95 2.58885 2.79967 2.67685 2.675C2.77218 2.543 2.88951 2.44033 3.02885 2.367C3.17551 2.28633 3.34785 2.246 3.54585 2.246C3.83918 2.246 4.06651 2.32667 4.22785 2.488C4.39651 2.64933 4.48085 2.89867 4.48085 3.236C4.48818 3.434 4.45151 3.599 4.37085 3.731C4.29751 3.863 4.19851 3.984 4.07385 4.094C3.94918 4.204 3.81351 4.314 3.66685 4.424C3.52018 4.534 3.38085 4.666 3.24885 4.82C3.11685 4.96667 2.99951 5.14633 2.89685 5.359C2.80151 5.57167 2.74285 5.83567 2.72085 6.151V6.646H4.20585V6.228C4.23518 6.008 4.30485 5.82467 4.41485 5.678C4.53218 5.53133 4.66418 5.403 4.81085 5.293C4.95751 5.17567 5.11151 5.062 5.27285 4.952C5.44151 4.83467 5.59185 4.69533 5.72385 4.534C5.86318 4.37267 5.97685 4.17833 6.06485 3.951C6.16018 3.72367 6.20785 3.434 6.20785 3.082C6.20785 2.86933 6.16018 2.642 6.06485 2.4C5.97685 2.15067 5.82651 1.91967 5.61385 1.707C5.40118 1.49433 5.11885 1.31833 4.76685 1.179C4.42218 1.03233 3.98951 0.959 3.46885 0.959C3.06551 0.959 2.69885 1.02867 2.36885 1.168C2.04618 1.3 1.76751 1.487 1.53285 1.729C1.30551 1.971 1.12585 2.257 0.993848 2.587C0.869181 2.917 0.803181 3.28 0.795848 3.676Z",
+    fill: "#3B4A58"
+  }));
+};
+var _default = exports["default"] = (_statuses$DEFAULT$sta = {}, (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_statuses$DEFAULT$sta, _statuses["default"].DEFAULT, _InformationIcon["default"]), _statuses["default"].ERROR, _AlertCircleIcon["default"]), _statuses["default"].SUCCESS, _CheckCircleIcon["default"]), _statuses["default"].WARNING, _AlertIcon["default"]), _statuses.statusIcon.CRITICAL, _AlertCircleOutlineIcon["default"]), _statuses.statusIcon.FATAL, _CloseOctagonOutlineIcon["default"]), _statuses.statusIcon.INFO, _InformationOutlineIcon["default"]), _statuses.statusIcon.MAJOR, _ArrowUpIcon["default"]), _statuses.statusIcon.MINOR, _ArrowDownIcon["default"]), _statuses.statusIcon.WARNING_NEUTRAL, _AlertOutlineIcon["default"]), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_statuses$DEFAULT$sta, "aic", _navBarIcons.Aic), "applicationsIcon", _ApplicationOutlineIcon["default"]), "Ascending", _MenuUpIcon["default"]), "authenticationIcon", _CheckCircleOutlineIcon["default"]), "clipboard", _ClipboardIcon["default"]), "CreateIcon", _CreateIcon["default"]), "daVinci", _navBarIcons.DaVinci), "DefaultCircle", _CheckboxBlankCircleOutlineIcon["default"]), "Descending", _MenuDownIcon["default"]), "popoverMenuIcon", _MoreVertIcon["default"]), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_statuses$DEFAULT$sta, "ErrorCircle", _AlertCircleIcon["default"]), "integrationsIcon", _ConnectionIcon["default"]), "listViewMenu", _MoreVertIcon["default"]), "mdiAccountCog", _AccountCogIcon["default"]), "mdiAccountMultiple", _AccountMultipleIcon["default"]), "mdiEarth", _EarthIcon["default"]), "mdiEmoticonHappyOutline", _EmoticonHappyOutlineIcon["default"]), "mdiFingerprint", _FingerprintIcon["default"]), "mdiPlayCircleIcon", _PlayCircleIcon["default"]), "mdiScaleBalance", _ScaleBalanceIcon["default"]), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_statuses$DEFAULT$sta, "mdiShoCard", _navBarIcons.Credentials), "mdiTransitConnectionVariant", _TransitConnectionVariantIcon["default"]), "mdiViewDashboard", _ViewDashboardIcon["default"]), "mdiWeb", _GlobeIcon["default"]), "MenuDown", _MenuDownIcon["default"]), "MenuUp", _MenuUpIcon["default"]), "monitoringIcon", _PulseIcon["default"]), "openInNew", _OpenInNewIcon["default"]), "overviewIcon", _WebIcon["default"]), "p1verify", _navBarIcons.Verify), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_statuses$DEFAULT$sta, "pam", _navBarIcons.PamIcon), "PingAuthorize", _KeyChainVariantIcon["default"]), "HomeIcon", _HomeIcon["default"]), "pingLogoHorizontalSmall", _logos.pingLogoHorizontalSmallWhite), "protect", _navBarIcons.Protect), "rocketLaunchIcon", _RocketLaunchIcon["default"]), "shareFeedbackIcon", _ChatIcon["default"]), "shieldStar", _ShieldStarOutlineIcon["default"]), "SuccessCircle", _CheckCircleIcon["default"]), "userExperienceIcon", _MonitorScreenshotIcon["default"]), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_statuses$DEFAULT$sta, "WarningIcon", _AlertOutlineIcon["default"]), "helpHint", HelpIcon), "ModalCloseIcon", _CloseIcon["default"]));

package/lib/cjs/styles/themes/astro/customProperties/index.d.ts

@@ -52,6 +52,8 @@ export declare const astroThemeValues: {
         SuccessCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
         userExperienceIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
         WarningIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
+        helpHint: () => import("react/jsx-runtime").JSX.Element;
+        ModalCloseIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
     };
     styles: {
         navButtonEstHeight: number;
@@ -93,4 +95,5 @@ export declare const astroThemeValues: {
     };
     linkSelectFieldWidth: string;
     badgeTextFontSize: string;
+    modalCloseIconSize: IconSize;
 };

package/lib/cjs/styles/themes/astro/customProperties/index.js

@@ -35,6 +35,7 @@ var linkSelectFieldWidth = '10em';
 var calendarIconSize = 25;
 var navBarIconSize = 18;
 var badgeTextFontSize = '';
+var modalCloseIconSize = 'sm';
 var astroThemeValues = exports.astroThemeValues = {
   accordionHoveredState: _Accordion.hoveredState,
   accordionItemDefaultLabelTag: accordionItemDefaultLabelTag,
@@ -67,5 +68,6 @@ var astroThemeValues = exports.astroThemeValues = {
     greyText: '#FFFFFF'
   },
   linkSelectFieldWidth: linkSelectFieldWidth,
-  badgeTextFontSize: badgeTextFontSize
+  badgeTextFontSize: badgeTextFontSize,
+  modalCloseIconSize: modalCloseIconSize
 };

package/lib/cjs/styles/themes/next-gen/colors/colors.js

@@ -93,7 +93,7 @@ var info = exports.info = {
 };
 var text = {
   primary: _onyxTokens.astroTokens.color.font.base,
-  secondary: _onyxTokens.astroTokens.color.gray[500],
+  secondary: _onyxTokens.astroTokens.color.font.light,
   message: _onyxTokens.astroTokens.color.gray[700],
   fieldHelper: _onyxTokens.astroTokens.color.gray[500]
 };

package/lib/cjs/styles/themes/next-gen/customProperties/customSizes.d.ts

@@ -8,5 +8,6 @@ declare const _default: {
     pageHeaderAddIconMargin: string;
     pageHeaderAddIconSize: string;
     defaultLoaderSize: number;
+    modalCloseIconSize: IconSize;
 };
 export default _default;

package/lib/cjs/styles/themes/next-gen/customProperties/customSizes.js

@@ -13,6 +13,7 @@ var pageHeaderTitleMargin = 'sm';
 var pageHeaderAddIconMargin = 'md';
 var pageHeaderAddIconSize = 'md';
 var defaultLoaderSize = 32;
+var modalCloseIconSize = 'md';
 var _default = exports["default"] = {
   copyButtonSize: copyButtonSize,
   breadcrumbIconSize: breadcrumbIconSize,
@@ -21,5 +22,6 @@ var _default = exports["default"] = {
   pageHeaderTitleMargin: pageHeaderTitleMargin,
   pageHeaderAddIconMargin: pageHeaderAddIconMargin,
   pageHeaderAddIconSize: pageHeaderAddIconSize,
-  defaultLoaderSize: defaultLoaderSize
+  defaultLoaderSize: defaultLoaderSize,
+  modalCloseIconSize: modalCloseIconSize
 };

package/lib/cjs/styles/themes/next-gen/customProperties/icons.d.ts

@@ -41,5 +41,7 @@ declare const icons: {
     SuccessCircle: string;
     userExperienceIcon: string;
     WarningIcon: string;
+    helpHint: string;
+    ModalCloseIcon: string;
 };
 export default icons;

package/lib/cjs/styles/themes/next-gen/customProperties/icons.js

@@ -20,5 +20,5 @@ var _statuses = _interopRequireWildcard(require("../../../../utils/devUtils/cons
 var _navBarIcons = require("../../astro/customProperties/navBarIcons");
 var _icons;
 function _interopRequireWildcard(e, t) { if ("function" == typeof _WeakMap) var r = new _WeakMap(), n = new _WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = _Object$defineProperty) && _Object$getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-var icons = (_icons = {}, (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_icons, _statuses["default"].DEFAULT, 'info'), _statuses["default"].ERROR, 'error'), _statuses["default"].SUCCESS, 'check_circle'), _statuses["default"].WARNING, 'warning'), _statuses.statusIcon.CRITICAL, 'error'), _statuses.statusIcon.FATAL, 'dangerous'), _statuses.statusIcon.INFO, 'info'), _statuses.statusIcon.MAJOR, 'arrow_upward'), _statuses.statusIcon.MINOR, 'arrow_downward'), _statuses.statusIcon.WARNING_NEUTRAL, 'warning'), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_icons, "aic", _navBarIcons.Aic), "applicationsIcon", 'apps'), "Ascending", 'arrow_upward'), "authenticationIcon", 'check_circle'), "clipboard", 'content_paste'), "CreateIcon", 'edit'), "daVinci", 'account_tree'), "DefaultCircle", 'circle'), "Descending", 'arrow_downward'), "popoverMenuIcon", 'more_horiz'), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_icons, "ErrorCircle", 'error'), "HomeIcon", 'home'), "integrationsIcon", 'widgets'), "listViewMenu", 'more_horiz'), "mdiAccountCog", 'manage_accounts'), "mdiAccountMultiple", 'group'), "mdiEarth", _SettingsOutlineIcon["default"]), "mdiEmoticonHappyOutline", _EmoticonHappyOutlineIcon["default"]), "mdiFingerprint", 'fingerprint'), "mdiPlayCircleIcon", 'play_circle'), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_icons, "mdiScaleBalance", 'balance'), "mdiShoCard", 'id_card'), "mdiTransitConnectionVariant", _TransitConnectionVariantIcon["default"]), "mdiViewDashboard", 'dashboard'), "mdiWeb", 'globe'), "MenuDown", 'keyboard_arrow_down'), "MenuUp", 'keyboard_arrow_up'), "monitoringIcon", _ShowChartIcon["default"]), "openInNew", 'open_in_new'), "overviewIcon", 'dashboard'), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_icons, "p1verify", 'person_check'), "pam", _navBarIcons.PamIcon), "PingAuthorize", 'key'), "pingLogoHorizontalSmall", _logos.pingLogoHorizontalSmall), "protect", _navBarIcons.Protect), "rocketLaunchIcon", 'rocket_launch'), "shareFeedbackIcon", 'chat'), "shieldStar", _ShieldStarOutlineIcon["default"]), "SuccessCircle", 'check_circle'), "userExperienceIcon", 'palette'), (0, _defineProperty2["default"])(_icons, "WarningIcon", 'warning'));
+var icons = (_icons = {}, (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_icons, _statuses["default"].DEFAULT, 'info'), _statuses["default"].ERROR, 'error'), _statuses["default"].SUCCESS, 'check_circle'), _statuses["default"].WARNING, 'warning'), _statuses.statusIcon.CRITICAL, 'error'), _statuses.statusIcon.FATAL, 'dangerous'), _statuses.statusIcon.INFO, 'info'), _statuses.statusIcon.MAJOR, 'arrow_upward'), _statuses.statusIcon.MINOR, 'arrow_downward'), _statuses.statusIcon.WARNING_NEUTRAL, 'warning'), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_icons, "aic", _navBarIcons.Aic), "applicationsIcon", 'apps'), "Ascending", 'arrow_upward'), "authenticationIcon", 'check_circle'), "clipboard", 'content_paste'), "CreateIcon", 'edit'), "daVinci", 'account_tree'), "DefaultCircle", 'circle'), "Descending", 'arrow_downward'), "popoverMenuIcon", 'more_horiz'), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_icons, "ErrorCircle", 'error'), "HomeIcon", 'home'), "integrationsIcon", 'widgets'), "listViewMenu", 'more_horiz'), "mdiAccountCog", 'manage_accounts'), "mdiAccountMultiple", 'group'), "mdiEarth", _SettingsOutlineIcon["default"]), "mdiEmoticonHappyOutline", _EmoticonHappyOutlineIcon["default"]), "mdiFingerprint", 'fingerprint'), "mdiPlayCircleIcon", 'play_circle'), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_icons, "mdiScaleBalance", 'balance'), "mdiShoCard", 'id_card'), "mdiTransitConnectionVariant", _TransitConnectionVariantIcon["default"]), "mdiViewDashboard", 'dashboard'), "mdiWeb", 'globe'), "MenuDown", 'keyboard_arrow_down'), "MenuUp", 'keyboard_arrow_up'), "monitoringIcon", _ShowChartIcon["default"]), "openInNew", 'open_in_new'), "overviewIcon", 'dashboard'), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_icons, "p1verify", 'person_check'), "pam", _navBarIcons.PamIcon), "PingAuthorize", 'key'), "pingLogoHorizontalSmall", _logos.pingLogoHorizontalSmall), "protect", _navBarIcons.Protect), "rocketLaunchIcon", 'rocket_launch'), "shareFeedbackIcon", 'chat'), "shieldStar", _ShieldStarOutlineIcon["default"]), "SuccessCircle", 'check_circle'), "userExperienceIcon", 'palette'), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_icons, "WarningIcon", 'warning'), "helpHint", 'help_outline'), "ModalCloseIcon", 'close'));
 var _default = exports["default"] = icons;

package/lib/cjs/styles/themes/next-gen/customProperties/index.d.ts

@@ -9,6 +9,7 @@ export declare const nextGenThemeValues: {
     pageHeaderAddIconMargin: string;
     pageHeaderAddIconSize: string;
     defaultLoaderSize: number;
+    modalCloseIconSize: IconSize;
     accordionHoveredState: {
         '&.is-hovered': {
             color: string;
@@ -64,6 +65,8 @@ export declare const nextGenThemeValues: {
         SuccessCircle: string;
         userExperienceIcon: string;
         WarningIcon: string;
+        helpHint: string;
+        ModalCloseIcon: string;
     };
     tShirtSizes: {
         'icon-50': string;

package/lib/cjs/styles/themes/next-gen/next-gen.d.ts

@@ -1542,6 +1542,9 @@ declare const _default: {
                 alignSelf: string;
             };
             hintButton: {
+                maxWidth: string;
+                maxHeight: string;
+                borderRadius: string;
                 backgroundColor: string;
                 path: {
                     fill: string;
@@ -2901,7 +2904,7 @@ declare const _default: {
     };
     lineHeights: {
         body: any;
-        xs: string;
+        xs: any;
         sm: string;
         md: string;
     };
@@ -3052,6 +3055,13 @@ declare const _default: {
         base: {
             lineHeight: string;
         };
+        modalTitle: {
+            lineHeight: string;
+            fontSize: any;
+            fontWeight: number;
+            color: string;
+            fontFamily: string;
+        };
         buttonSubtitle: {
             fontSize: string;
             fontWeight: number;
@@ -3176,6 +3186,8 @@ declare const _default: {
         SuccessCircle: string;
         userExperienceIcon: string;
         WarningIcon: string;
+        helpHint: string;
+        ModalCloseIcon: string;
     };
     fonts: {
         standard: string;
@@ -5400,6 +5412,8 @@ declare const _default: {
         };
         iconWrapper: {
             xs: {
+                justifyContent: string;
+                alignItems: string;
                 '&.is-circle': {
                     borderRadius: string;
                 };
@@ -5411,6 +5425,8 @@ declare const _default: {
                 fontSize: any;
             };
             sm: {
+                justifyContent: string;
+                alignItems: string;
                 '&.is-circle': {
                     borderRadius: string;
                 };
@@ -5422,6 +5438,8 @@ declare const _default: {
                 fontSize: any;
             };
             md: {
+                justifyContent: string;
+                alignItems: string;
                 '&.is-circle': {
                     borderRadius: string;
                 };
@@ -5433,6 +5451,8 @@ declare const _default: {
                 fontSize: any;
             };
             lg: {
+                justifyContent: string;
+                alignItems: string;
                 '&.is-circle': {
                     borderRadius: string;
                 };
@@ -5444,6 +5464,8 @@ declare const _default: {
                 fontSize: any;
             };
             xl: {
+                justifyContent: string;
+                alignItems: string;
                 '&.is-circle': {
                     borderRadius: string;
                 };
@@ -5457,13 +5479,15 @@ declare const _default: {
         };
         listBox: {
             container: {
-                px: string;
+                pl: string;
+                pr: number;
                 py: string;
             };
             option: {
                 py: string;
                 pl: string;
                 pr: string;
+                mr: string;
                 justifyContent: string;
                 borderRadius: string;
                 lineHeight: string;
@@ -5731,7 +5755,6 @@ declare const _default: {
         message: {
             wrapper: {
                 gap: string;
-                right: string;
             };
             item: {
                 maxWidth: number;
@@ -5850,6 +5873,7 @@ declare const _default: {
                 borderTopColor: string;
                 borderRadius: string;
                 p: string;
+                flexDirection: string;
             };
             footerContainer: {
                 borderTop: string;
@@ -6069,9 +6093,6 @@ declare const _default: {
                 alignSelf: string;
                 mr: string;
             };
-            wrapper: {
-                mr: string;
-            };
         };
         popoverMenu: {
             container: {