@nulogy/components 14.2.0 → 14.3.0

package/dist/main.module.js

@@ -3,7 +3,7 @@ import React__default, { createContext, useContext, useLayoutEffect, useEffect,
 import styled, { useTheme, keyframes as keyframes$3, createGlobalStyle, ThemeContext as ThemeContext$1, StyleSheetManager, ThemeProvider } from 'styled-components';
 import assign$1 from 'object-assign';
 import icons from '@nulogy/icons';
-import _extends$c from '@babel/runtime/helpers/extends';
+import _extends$d from '@babel/runtime/helpers/extends';
 import _assertThisInitialized$3 from '@babel/runtime/helpers/assertThisInitialized';
 import _inheritsLoose$3 from '@babel/runtime/helpers/inheritsLoose';
 import isEqual$3 from 'react-fast-compare';
@@ -9272,7 +9272,7 @@ var shadow = system({
   }
 });
 
-function _extends$b() { _extends$b = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$b.apply(this, arguments); }
+function _extends$c() { _extends$c = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$c.apply(this, arguments); }
 
 // based on https://github.com/developit/dlv
 var get$1 = function get(obj, key, def, p, undef) {
@@ -9403,7 +9403,7 @@ var positiveOrNegative = function positiveOrNegative(scale, value) {
 var transforms = ['margin', 'marginTop', 'marginRight', 'marginBottom', 'marginLeft', 'marginX', 'marginY', 'top', 'bottom', 'left', 'right'].reduce(function (acc, curr) {
   var _extends2;
 
-  return _extends$b({}, acc, (_extends2 = {}, _extends2[curr] = positiveOrNegative, _extends2));
+  return _extends$c({}, acc, (_extends2 = {}, _extends2[curr] = positiveOrNegative, _extends2));
 }, {});
 var responsive = function responsive(styles) {
   return function (theme) {
@@ -9445,7 +9445,7 @@ var css$3 = function css(args) {
       props = {};
     }
 
-    var theme = _extends$b({}, defaultTheme$1, {}, props.theme || props);
+    var theme = _extends$c({}, defaultTheme$1, {}, props.theme || props);
 
     var result = {};
     var obj = typeof args === 'function' ? args(theme) : args;
@@ -9457,7 +9457,7 @@ var css$3 = function css(args) {
 
       if (key === 'variant') {
         var variant = css(get$1(theme, val))(theme);
-        result = _extends$b({}, result, {}, variant);
+        result = _extends$c({}, result, {}, variant);
         continue;
       }
 
@@ -9645,7 +9645,7 @@ var LoadingIcon = /*#__PURE__*/React__default.forwardRef(function (_a, ref) {
   size || (size = theme.sizes.x3);
   return /*#__PURE__*/React__default.createElement("svg", Object.assign({
     ref: ref,
-    viewBox: "0 0 24px 24px",
+    viewBox: "0 0 24 24",
     width: size,
     height: size,
     fill: "none",
@@ -11020,8 +11020,8 @@ var Button = /*#__PURE__*/React__default.forwardRef(function (_a, ref) {
   }));
 });
 
-function _extends$a() {
-  _extends$a = Object.assign ? Object.assign.bind() : function (target) {
+function _extends$b() {
+  _extends$b = Object.assign ? Object.assign.bind() : function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -11032,7 +11032,7 @@ function _extends$a() {
     }
     return target;
   };
-  return _extends$a.apply(this, arguments);
+  return _extends$b.apply(this, arguments);
 }
 
 function _assertThisInitialized$2(self) {
@@ -11962,7 +11962,7 @@ function guard(lowerBoundary, upperBoundary, value) {
 function darken(amount, color) {
   if (color === 'transparent') return color;
   var hslColor = parseToHsl(color);
-  return toColorString(_extends$a({}, hslColor, {
+  return toColorString(_extends$b({}, hslColor, {
     lightness: guard(0, 1, hslColor.lightness - parseFloat(amount))
   }));
 } // prettier-ignore
@@ -12007,7 +12007,7 @@ function transparentize(amount, color) {
   var parsedColor = parseToRgb(color);
   var alpha = typeof parsedColor.alpha === 'number' ? parsedColor.alpha : 1;
 
-  var colorWithAlpha = _extends$a({}, parsedColor, {
+  var colorWithAlpha = _extends$b({}, parsedColor, {
     alpha: guard(0, 1, (alpha * 100 - parseFloat(amount) * 100) / 100)
   });
 
@@ -17728,7 +17728,7 @@ var Menu$2 = function Menu(props) {
   var children = props.children,
     innerRef = props.innerRef,
     innerProps = props.innerProps;
-  return jsx("div", _extends$a({}, getStyleProps(props, 'menu', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'menu', {
     menu: true
   }), {
     ref: innerRef
@@ -17759,7 +17759,7 @@ var MenuList$1 = function MenuList(props) {
     innerProps = props.innerProps,
     innerRef = props.innerRef,
     isMulti = props.isMulti;
-  return jsx("div", _extends$a({}, getStyleProps(props, 'menuList', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'menuList', {
     'menu-list': true,
     'menu-list--is-multi': isMulti
   }), {
@@ -17789,7 +17789,7 @@ var NoOptionsMessage = function NoOptionsMessage(_ref6) {
     children = _ref6$children === void 0 ? 'No options' : _ref6$children,
     innerProps = _ref6.innerProps,
     restProps = _objectWithoutProperties(_ref6, _excluded$3$1);
-  return jsx("div", _extends$a({}, getStyleProps(_objectSpread2(_objectSpread2({}, restProps), {}, {
+  return jsx("div", _extends$b({}, getStyleProps(_objectSpread2(_objectSpread2({}, restProps), {}, {
     children: children,
     innerProps: innerProps
   }), 'noOptionsMessage', {
@@ -17802,7 +17802,7 @@ var LoadingMessage = function LoadingMessage(_ref7) {
     children = _ref7$children === void 0 ? 'Loading...' : _ref7$children,
     innerProps = _ref7.innerProps,
     restProps = _objectWithoutProperties(_ref7, _excluded2$1);
-  return jsx("div", _extends$a({}, getStyleProps(_objectSpread2(_objectSpread2({}, restProps), {}, {
+  return jsx("div", _extends$b({}, getStyleProps(_objectSpread2(_objectSpread2({}, restProps), {}, {
     children: children,
     innerProps: innerProps
   }), 'loadingMessage', {
@@ -17887,7 +17887,7 @@ var MenuPortal = function MenuPortal(props) {
   if (!appendTo && menuPosition !== 'fixed' || !computedPosition) return null;
 
   // same wrapper element whether fixed or portalled
-  var menuWrapper = jsx("div", _extends$a({
+  var menuWrapper = jsx("div", _extends$b({
     ref: setMenuPortalElement
   }, getStyleProps(_objectSpread2(_objectSpread2({}, props), {}, {
     offset: computedPosition.offset,
@@ -17921,7 +17921,7 @@ var SelectContainer$2 = function SelectContainer(props) {
     innerProps = props.innerProps,
     isDisabled = props.isDisabled,
     isRtl = props.isRtl;
-  return jsx("div", _extends$a({}, getStyleProps(props, 'container', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'container', {
     '--is-disabled': isDisabled,
     '--is-rtl': isRtl
   }), innerProps), children);
@@ -17953,7 +17953,7 @@ var ValueContainer = function ValueContainer(props) {
     innerProps = props.innerProps,
     isMulti = props.isMulti,
     hasValue = props.hasValue;
-  return jsx("div", _extends$a({}, getStyleProps(props, 'valueContainer', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'valueContainer', {
     'value-container': true,
     'value-container--is-multi': isMulti,
     'value-container--has-value': hasValue
@@ -17975,7 +17975,7 @@ var indicatorsContainerCSS = function indicatorsContainerCSS() {
 var IndicatorsContainer = function IndicatorsContainer(props) {
   var children = props.children,
     innerProps = props.innerProps;
-  return jsx("div", _extends$a({}, getStyleProps(props, 'indicatorsContainer', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'indicatorsContainer', {
     indicators: true
   }), innerProps), children);
 };
@@ -18000,7 +18000,7 @@ var _ref2$2 = process.env.NODE_ENV === "production" ? {
 var Svg = function Svg(_ref) {
   var size = _ref.size,
     props = _objectWithoutProperties(_ref, _excluded$2$1);
-  return jsx("svg", _extends$a({
+  return jsx("svg", _extends$b({
     height: size,
     width: size,
     viewBox: "0 0 20 20",
@@ -18010,14 +18010,14 @@ var Svg = function Svg(_ref) {
   }, props));
 };
 var CrossIcon = function CrossIcon(props) {
-  return jsx(Svg, _extends$a({
+  return jsx(Svg, _extends$b({
     size: 20
   }, props), jsx("path", {
     d: "M14.348 14.849c-0.469 0.469-1.229 0.469-1.697 0l-2.651-3.030-2.651 3.029c-0.469 0.469-1.229 0.469-1.697 0-0.469-0.469-0.469-1.229 0-1.697l2.758-3.15-2.759-3.152c-0.469-0.469-0.469-1.228 0-1.697s1.228-0.469 1.697 0l2.652 3.031 2.651-3.031c0.469-0.469 1.228-0.469 1.697 0s0.469 1.229 0 1.697l-2.758 3.152 2.758 3.15c0.469 0.469 0.469 1.229 0 1.698z"
   }));
 };
 var DownChevron = function DownChevron(props) {
-  return jsx(Svg, _extends$a({
+  return jsx(Svg, _extends$b({
     size: 20
   }, props), jsx("path", {
     d: "M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
@@ -18049,7 +18049,7 @@ var dropdownIndicatorCSS = baseCSS;
 var DropdownIndicator = function DropdownIndicator(props) {
   var children = props.children,
     innerProps = props.innerProps;
-  return jsx("div", _extends$a({}, getStyleProps(props, 'dropdownIndicator', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'dropdownIndicator', {
     indicator: true,
     'dropdown-indicator': true
   }), innerProps), children || jsx(DownChevron, null));
@@ -18058,7 +18058,7 @@ var clearIndicatorCSS = baseCSS;
 var ClearIndicator = function ClearIndicator(props) {
   var children = props.children,
     innerProps = props.innerProps;
-  return jsx("div", _extends$a({}, getStyleProps(props, 'clearIndicator', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'clearIndicator', {
     indicator: true,
     'clear-indicator': true
   }), innerProps), children || jsx(CrossIcon, null));
@@ -18085,7 +18085,7 @@ var indicatorSeparatorCSS = function indicatorSeparatorCSS(_ref4, unstyled) {
 };
 var IndicatorSeparator = function IndicatorSeparator(props) {
   var innerProps = props.innerProps;
-  return jsx("span", _extends$a({}, innerProps, getStyleProps(props, 'indicatorSeparator', {
+  return jsx("span", _extends$b({}, innerProps, getStyleProps(props, 'indicatorSeparator', {
     'indicator-separator': true
   })));
 };
@@ -18138,7 +18138,7 @@ var LoadingIndicator = function LoadingIndicator(_ref7) {
     _ref7$size = _ref7.size,
     size = _ref7$size === void 0 ? 4 : _ref7$size,
     restProps = _objectWithoutProperties(_ref7, _excluded2$2);
-  return jsx("div", _extends$a({}, getStyleProps(_objectSpread2(_objectSpread2({}, restProps), {}, {
+  return jsx("div", _extends$b({}, getStyleProps(_objectSpread2(_objectSpread2({}, restProps), {}, {
     innerProps: innerProps,
     isRtl: isRtl,
     size: size
@@ -18194,7 +18194,7 @@ var Control = function Control(props) {
     innerRef = props.innerRef,
     innerProps = props.innerProps,
     menuIsOpen = props.menuIsOpen;
-  return jsx("div", _extends$a({
+  return jsx("div", _extends$b({
     ref: innerRef
   }, getStyleProps(props, 'control', {
     control: true,
@@ -18226,9 +18226,9 @@ var Group = function Group(props) {
     label = props.label,
     theme = props.theme,
     selectProps = props.selectProps;
-  return jsx("div", _extends$a({}, getStyleProps(props, 'group', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'group', {
     group: true
-  }), innerProps), jsx(Heading, _extends$a({}, headingProps, {
+  }), innerProps), jsx(Heading, _extends$b({}, headingProps, {
     selectProps: selectProps,
     theme: theme,
     getStyles: getStyles,
@@ -18258,7 +18258,7 @@ var GroupHeading = function GroupHeading(props) {
   var _cleanCommonProps = cleanCommonProps(props);
     _cleanCommonProps.data;
     var innerProps = _objectWithoutProperties(_cleanCommonProps, _excluded$1$1);
-  return jsx("div", _extends$a({}, getStyleProps(props, 'groupHeading', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'groupHeading', {
     'group-heading': true
   }), innerProps));
 };
@@ -18321,11 +18321,11 @@ var Input$1 = function Input(props) {
     isHidden = _cleanCommonProps.isHidden,
     inputClassName = _cleanCommonProps.inputClassName,
     innerProps = _objectWithoutProperties(_cleanCommonProps, _excluded$6);
-  return jsx("div", _extends$a({}, getStyleProps(props, 'input', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'input', {
     'input-container': true
   }), {
     "data-value": value || ''
-  }), jsx("input", _extends$a({
+  }), jsx("input", _extends$b({
     className: cx({
       input: true
     }, inputClassName),
@@ -18398,7 +18398,7 @@ var MultiValueLabel = MultiValueGeneric;
 function MultiValueRemove(_ref5) {
   var children = _ref5.children,
     innerProps = _ref5.innerProps;
-  return jsx("div", _extends$a({
+  return jsx("div", _extends$b({
     role: "button"
   }, innerProps), children || jsx(CrossIcon, {
     size: 14
@@ -18472,7 +18472,7 @@ var Option = function Option(props) {
     isSelected = props.isSelected,
     innerRef = props.innerRef,
     innerProps = props.innerProps;
-  return jsx("div", _extends$a({}, getStyleProps(props, 'option', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'option', {
     option: true,
     'option--is-disabled': isDisabled,
     'option--is-focused': isFocused,
@@ -18500,7 +18500,7 @@ var placeholderCSS = function placeholderCSS(_ref, unstyled) {
 var Placeholder = function Placeholder(props) {
   var children = props.children,
     innerProps = props.innerProps;
-  return jsx("div", _extends$a({}, getStyleProps(props, 'placeholder', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'placeholder', {
     placeholder: true
   }), innerProps), children);
 };
@@ -18528,7 +18528,7 @@ var SingleValue = function SingleValue(props) {
   var children = props.children,
     isDisabled = props.isDisabled,
     innerProps = props.innerProps;
-  return jsx("div", _extends$a({}, getStyleProps(props, 'singleValue', {
+  return jsx("div", _extends$b({}, getStyleProps(props, 'singleValue', {
     'single-value': true,
     'single-value--is-disabled': isDisabled
   }), innerProps), children);
@@ -18629,7 +18629,7 @@ var _ref$1 = process.env.NODE_ENV === "production" ? {
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__$2
 };
 var A11yText = function A11yText(props) {
-  return jsx("span", _extends$a({
+  return jsx("span", _extends$b({
     css: _ref$1
   }, props));
 };
@@ -19146,7 +19146,7 @@ function DummyInput(_ref) {
     props = _objectWithoutProperties(_ref, _excluded$5);
   // Remove animation props not meant for HTML elements
   var filteredProps = removeProps(props, 'onExited', 'in', 'enter', 'exit', 'appear');
-  return jsx("input", _extends$a({
+  return jsx("input", _extends$b({
     ref: innerRef
   }, filteredProps, {
     css: /*#__PURE__*/css$2({
@@ -20722,7 +20722,7 @@ var Select = /*#__PURE__*/function (_Component) {
       });
       if (!isSearchable) {
         // use a dummy input to maintain focus/blur functionality
-        return /*#__PURE__*/React.createElement(DummyInput, _extends$a({
+        return /*#__PURE__*/React.createElement(DummyInput, _extends$b({
           id: id,
           innerRef: this.getInputRef,
           onBlur: this.onInputBlur,
@@ -20735,7 +20735,7 @@ var Select = /*#__PURE__*/function (_Component) {
           value: ""
         }, ariaAttributes));
       }
-      return /*#__PURE__*/React.createElement(Input, _extends$a({}, commonProps, {
+      return /*#__PURE__*/React.createElement(Input, _extends$b({}, commonProps, {
         autoCapitalize: "none",
         autoComplete: "off",
         autoCorrect: "off",
@@ -20776,7 +20776,7 @@ var Select = /*#__PURE__*/function (_Component) {
         focusedValue = _this$state5.focusedValue,
         isFocused = _this$state5.isFocused;
       if (!this.hasValue() || !controlShouldRenderValue) {
-        return inputValue ? null : /*#__PURE__*/React.createElement(Placeholder, _extends$a({}, commonProps, {
+        return inputValue ? null : /*#__PURE__*/React.createElement(Placeholder, _extends$b({}, commonProps, {
           key: "placeholder",
           isDisabled: isDisabled,
           isFocused: isFocused,
@@ -20789,7 +20789,7 @@ var Select = /*#__PURE__*/function (_Component) {
         return selectValue.map(function (opt, index) {
           var isOptionFocused = opt === focusedValue;
           var key = "".concat(_this3.getOptionLabel(opt), "-").concat(_this3.getOptionValue(opt));
-          return /*#__PURE__*/React.createElement(MultiValue, _extends$a({}, commonProps, {
+          return /*#__PURE__*/React.createElement(MultiValue, _extends$b({}, commonProps, {
             components: {
               Container: MultiValueContainer,
               Label: MultiValueLabel,
@@ -20818,7 +20818,7 @@ var Select = /*#__PURE__*/function (_Component) {
         return null;
       }
       var singleValue = selectValue[0];
-      return /*#__PURE__*/React.createElement(SingleValue, _extends$a({}, commonProps, {
+      return /*#__PURE__*/React.createElement(SingleValue, _extends$b({}, commonProps, {
         data: singleValue,
         isDisabled: isDisabled
       }), this.formatOptionLabel(singleValue, 'value'));
@@ -20841,7 +20841,7 @@ var Select = /*#__PURE__*/function (_Component) {
         onTouchEnd: this.onClearIndicatorTouchEnd,
         'aria-hidden': 'true'
       };
-      return /*#__PURE__*/React.createElement(ClearIndicator, _extends$a({}, commonProps, {
+      return /*#__PURE__*/React.createElement(ClearIndicator, _extends$b({}, commonProps, {
         innerProps: innerProps,
         isFocused: isFocused
       }));
@@ -20860,7 +20860,7 @@ var Select = /*#__PURE__*/function (_Component) {
       var innerProps = {
         'aria-hidden': 'true'
       };
-      return /*#__PURE__*/React.createElement(LoadingIndicator, _extends$a({}, commonProps, {
+      return /*#__PURE__*/React.createElement(LoadingIndicator, _extends$b({}, commonProps, {
         innerProps: innerProps,
         isDisabled: isDisabled,
         isFocused: isFocused
@@ -20878,7 +20878,7 @@ var Select = /*#__PURE__*/function (_Component) {
       var commonProps = this.commonProps;
       var isDisabled = this.props.isDisabled;
       var isFocused = this.state.isFocused;
-      return /*#__PURE__*/React.createElement(IndicatorSeparator, _extends$a({}, commonProps, {
+      return /*#__PURE__*/React.createElement(IndicatorSeparator, _extends$b({}, commonProps, {
         isDisabled: isDisabled,
         isFocused: isFocused
       }));
@@ -20897,7 +20897,7 @@ var Select = /*#__PURE__*/function (_Component) {
         onTouchEnd: this.onDropdownIndicatorTouchEnd,
         'aria-hidden': 'true'
       };
-      return /*#__PURE__*/React.createElement(DropdownIndicator, _extends$a({}, commonProps, {
+      return /*#__PURE__*/React.createElement(DropdownIndicator, _extends$b({}, commonProps, {
         innerProps: innerProps,
         isDisabled: isDisabled,
         isFocused: isFocused
@@ -20962,7 +20962,7 @@ var Select = /*#__PURE__*/function (_Component) {
           'aria-selected': _this4.isAppleDevice ? undefined : isSelected // is not supported on Apple devices
         };
 
-        return /*#__PURE__*/React.createElement(Option, _extends$a({}, commonProps, {
+        return /*#__PURE__*/React.createElement(Option, _extends$b({}, commonProps, {
           innerProps: innerProps,
           data: data,
           isDisabled: isDisabled,
@@ -20984,7 +20984,7 @@ var Select = /*#__PURE__*/function (_Component) {
               groupIndex = item.index;
             var groupId = "".concat(_this4.getElementId('group'), "-").concat(groupIndex);
             var headingId = "".concat(groupId, "-heading");
-            return /*#__PURE__*/React.createElement(Group, _extends$a({}, commonProps, {
+            return /*#__PURE__*/React.createElement(Group, _extends$b({}, commonProps, {
               key: groupId,
               data: _data,
               options: options,
@@ -21021,12 +21021,12 @@ var Select = /*#__PURE__*/function (_Component) {
         menuPosition: menuPosition,
         menuShouldScrollIntoView: menuShouldScrollIntoView
       };
-      var menuElement = /*#__PURE__*/React.createElement(MenuPlacer, _extends$a({}, commonProps, menuPlacementProps), function (_ref4) {
+      var menuElement = /*#__PURE__*/React.createElement(MenuPlacer, _extends$b({}, commonProps, menuPlacementProps), function (_ref4) {
         var ref = _ref4.ref,
           _ref4$placerProps = _ref4.placerProps,
           placement = _ref4$placerProps.placement,
           maxHeight = _ref4$placerProps.maxHeight;
-        return /*#__PURE__*/React.createElement(Menu, _extends$a({}, commonProps, menuPlacementProps, {
+        return /*#__PURE__*/React.createElement(Menu, _extends$b({}, commonProps, menuPlacementProps, {
           innerRef: ref,
           innerProps: {
             onMouseDown: _this4.onMenuMouseDown,
@@ -21040,7 +21040,7 @@ var Select = /*#__PURE__*/function (_Component) {
           onBottomArrive: onMenuScrollToBottom,
           lockEnabled: menuShouldBlockScroll
         }, function (scrollTargetRef) {
-          return /*#__PURE__*/React.createElement(MenuList, _extends$a({}, commonProps, {
+          return /*#__PURE__*/React.createElement(MenuList, _extends$b({}, commonProps, {
             innerRef: function innerRef(instance) {
               _this4.getMenuListRef(instance);
               scrollTargetRef(instance);
@@ -21060,7 +21060,7 @@ var Select = /*#__PURE__*/function (_Component) {
       // positioning behaviour is almost identical for portalled and fixed,
       // so we use the same component. the actual portalling logic is forked
       // within the component based on `menuPosition`
-      return menuPortalTarget || menuPosition === 'fixed' ? /*#__PURE__*/React.createElement(MenuPortal, _extends$a({}, commonProps, {
+      return menuPortalTarget || menuPosition === 'fixed' ? /*#__PURE__*/React.createElement(MenuPortal, _extends$b({}, commonProps, {
         appendTo: menuPortalTarget,
         controlElement: this.controlRef,
         menuPlacement: menuPlacement,
@@ -21130,7 +21130,7 @@ var Select = /*#__PURE__*/function (_Component) {
         isFocused = _this$state6.isFocused,
         selectValue = _this$state6.selectValue;
       var focusableOptions = this.getFocusableOptions();
-      return /*#__PURE__*/React.createElement(LiveRegion$1, _extends$a({}, commonProps, {
+      return /*#__PURE__*/React.createElement(LiveRegion$1, _extends$b({}, commonProps, {
         id: this.getElementId('live-region'),
         ariaSelection: ariaSelection,
         focusedOption: focusedOption,
@@ -21156,7 +21156,7 @@ var Select = /*#__PURE__*/function (_Component) {
         menuIsOpen = _this$props14.menuIsOpen;
       var isFocused = this.state.isFocused;
       var commonProps = this.commonProps = this.getCommonProps();
-      return /*#__PURE__*/React.createElement(SelectContainer, _extends$a({}, commonProps, {
+      return /*#__PURE__*/React.createElement(SelectContainer, _extends$b({}, commonProps, {
         className: className,
         innerProps: {
           id: id,
@@ -21164,7 +21164,7 @@ var Select = /*#__PURE__*/function (_Component) {
         },
         isDisabled: isDisabled,
         isFocused: isFocused
-      }), this.renderLiveRegion(), /*#__PURE__*/React.createElement(Control, _extends$a({}, commonProps, {
+      }), this.renderLiveRegion(), /*#__PURE__*/React.createElement(Control, _extends$b({}, commonProps, {
         innerRef: this.getControlRef,
         innerProps: {
           onMouseDown: this.onControlMouseDown,
@@ -21173,9 +21173,9 @@ var Select = /*#__PURE__*/function (_Component) {
         isDisabled: isDisabled,
         isFocused: isFocused,
         menuIsOpen: menuIsOpen
-      }), /*#__PURE__*/React.createElement(ValueContainer, _extends$a({}, commonProps, {
+      }), /*#__PURE__*/React.createElement(ValueContainer, _extends$b({}, commonProps, {
         isDisabled: isDisabled
-      }), this.renderPlaceholderOrValue(), this.renderInput()), /*#__PURE__*/React.createElement(IndicatorsContainer, _extends$a({}, commonProps, {
+      }), this.renderPlaceholderOrValue(), this.renderInput()), /*#__PURE__*/React.createElement(IndicatorsContainer, _extends$b({}, commonProps, {
         isDisabled: isDisabled
       }), this.renderClearIndicator(), this.renderLoadingIndicator(), this.renderIndicatorSeparator(), this.renderDropdownIndicator())), this.renderMenu(), this.renderFormField());
     }
@@ -21446,19 +21446,19 @@ function useAsync(_ref) {
 var AsyncSelect$1 = /*#__PURE__*/forwardRef(function (props, ref) {
   var stateManagedProps = useAsync(props);
   var selectProps = useStateManager(stateManagedProps);
-  return /*#__PURE__*/React.createElement(Select, _extends$a({
+  return /*#__PURE__*/React.createElement(Select, _extends$b({
     ref: ref
   }, selectProps));
 });
 var AsyncSelect$1$1 = AsyncSelect$1;
 
-function _extends$9() { _extends$9 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$9.apply(this, arguments); }
+function _extends$a() { _extends$a = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$a.apply(this, arguments); }
 var propType = PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.array, PropTypes.object]);
 var createPropTypes = function createPropTypes(props) {
   return props.reduce(function (acc, name) {
     var _extends2;
 
-    return _extends$9({}, acc, (_extends2 = {}, _extends2[name] = propType, _extends2));
+    return _extends$a({}, acc, (_extends2 = {}, _extends2[name] = propType, _extends2));
   }, {});
 };
 var propTypes$1 = {
@@ -21620,7 +21620,7 @@ var LogoWrapper = styled.span.withConfig({
     background: color,
     display: "inline-block",
     padding: theme.space.half,
-    borderRadius: theme.radii.rounded,
+    borderRadius: theme.radii.circle,
     lineHeight: 0
   };
 });
@@ -21644,14 +21644,14 @@ function NulogyLogo$1(_a) {
   }));
 }
 
-function _extends$8() {
-  return _extends$8 = Object.assign ? Object.assign.bind() : function (n) {
+function _extends$9() {
+  return _extends$9 = Object.assign ? Object.assign.bind() : function (n) {
     for (var e = 1; e < arguments.length; e++) {
       var t = arguments[e];
       for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
     }
     return n;
-  }, _extends$8.apply(null, arguments);
+  }, _extends$9.apply(null, arguments);
 }
 
 function $e42e1063c40fb3ef$export$b9ecd428b558ff10(originalEventHandler, ourEventHandler, { checkForDefaultPrevented: checkForDefaultPrevented = true  } = {}) {
@@ -21781,34 +21781,34 @@ function $e42e1063c40fb3ef$export$b9ecd428b558ff10(originalEventHandler, ourEven
     return createScope1;
 }
 
-function _extends$7() {
-  return _extends$7 = Object.assign ? Object.assign.bind() : function (n) {
+function _extends$8() {
+  return _extends$8 = Object.assign ? Object.assign.bind() : function (n) {
     for (var e = 1; e < arguments.length; e++) {
       var t = arguments[e];
       for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
     }
     return n;
-  }, _extends$7.apply(null, arguments);
+  }, _extends$8.apply(null, arguments);
 }
 
-function _extends$6() {
-  return _extends$6 = Object.assign ? Object.assign.bind() : function (n) {
+function _extends$7() {
+  return _extends$7 = Object.assign ? Object.assign.bind() : function (n) {
     for (var e = 1; e < arguments.length; e++) {
       var t = arguments[e];
       for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
     }
     return n;
-  }, _extends$6.apply(null, arguments);
+  }, _extends$7.apply(null, arguments);
 }
 
-function _extends$5() {
-  return _extends$5 = Object.assign ? Object.assign.bind() : function (n) {
+function _extends$6() {
+  return _extends$6 = Object.assign ? Object.assign.bind() : function (n) {
     for (var e = 1; e < arguments.length; e++) {
       var t = arguments[e];
       for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
     }
     return n;
-  }, _extends$5.apply(null, arguments);
+  }, _extends$6.apply(null, arguments);
 }
 
 /* -------------------------------------------------------------------------------------------------
@@ -21828,11 +21828,11 @@ function _extends$5() {
                 return /*#__PURE__*/ isValidElement(newElement) ? newElement.props.children : null;
             } else return child;
         });
-        return /*#__PURE__*/ createElement($5e63c961fc1ce211$var$SlotClone, _extends$5({}, slotProps, {
+        return /*#__PURE__*/ createElement($5e63c961fc1ce211$var$SlotClone, _extends$6({}, slotProps, {
             ref: forwardedRef
         }), /*#__PURE__*/ isValidElement(newElement) ? /*#__PURE__*/ cloneElement(newElement, undefined, newChildren) : null);
     }
-    return /*#__PURE__*/ createElement($5e63c961fc1ce211$var$SlotClone, _extends$5({}, slotProps, {
+    return /*#__PURE__*/ createElement($5e63c961fc1ce211$var$SlotClone, _extends$6({}, slotProps, {
         ref: forwardedRef
     }), children);
 });
@@ -21916,7 +21916,7 @@ const $8927f6f2acc4f386$var$NODES = [
         useEffect(()=>{
             window[Symbol.for('radix-ui')] = true;
         }, []);
-        return /*#__PURE__*/ createElement(Comp, _extends$6({}, primitiveProps, {
+        return /*#__PURE__*/ createElement(Comp, _extends$7({}, primitiveProps, {
             ref: forwardedRef
         }));
     });
@@ -22100,7 +22100,7 @@ const $5cb92bef7577960e$export$177fb62ff3ec1f22 = /*#__PURE__*/ forwardRef((prop
         return ()=>document.removeEventListener($5cb92bef7577960e$var$CONTEXT_UPDATE, handleUpdate)
         ;
     }, []);
-    return /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends$7({}, layerProps, {
+    return /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends$8({}, layerProps, {
         ref: composedRefs,
         style: {
             pointerEvents: isBodyPointerEventsDisabled ? isPointerEventsEnabled ? 'auto' : 'none' : undefined,
@@ -22252,14 +22252,14 @@ function $1746a345f3d73bb7$export$f680877a34711e37(deterministicId) {
     return deterministicId || (id ? `radix-${id}` : '');
 }
 
-function _extends$4() {
-  return _extends$4 = Object.assign ? Object.assign.bind() : function (n) {
+function _extends$5() {
+  return _extends$5 = Object.assign ? Object.assign.bind() : function (n) {
     for (var e = 1; e < arguments.length; e++) {
       var t = arguments[e];
       for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
     }
     return n;
-  }, _extends$4.apply(null, arguments);
+  }, _extends$5.apply(null, arguments);
 }
 
 /**
@@ -24665,6 +24665,30 @@ const arrow$3 = (options, deps) => ({
   options: [options, deps]
 });
 
+function _extends$4() {
+  return _extends$4 = Object.assign ? Object.assign.bind() : function (n) {
+    for (var e = 1; e < arguments.length; e++) {
+      var t = arguments[e];
+      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+    }
+    return n;
+  }, _extends$4.apply(null, arguments);
+}
+
+const $7e8f5cd07187803e$export$21b07c8f274aebd5 = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
+    const { children: children , width: width = 10 , height: height = 5 , ...arrowProps } = props;
+    return /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.svg, _extends$4({}, arrowProps, {
+        ref: forwardedRef,
+        width: width,
+        height: height,
+        viewBox: "0 0 30 10",
+        preserveAspectRatio: "none"
+    }), props.asChild ? children : /*#__PURE__*/ createElement("polygon", {
+        points: "0,0 30,0 15,10"
+    }));
+});
+/* -----------------------------------------------------------------------------------------------*/ const $7e8f5cd07187803e$export$be92b6f5f03c0fe9 = $7e8f5cd07187803e$export$21b07c8f274aebd5;
+
 function $db6c3485150b8e66$export$1ab7ae714698c4b8(element) {
     const [size, setSize] = useState(undefined);
     $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
@@ -24740,7 +24764,7 @@ const $cf1ac5d9fe0e8206$export$ecd4e1ccab6ed6d = /*#__PURE__*/ forwardRef((props
         // `anchorRef` with their virtual ref in this case.
         context.onAnchorChange((virtualRef === null || virtualRef === void 0 ? void 0 : virtualRef.current) || ref.current);
     });
-    return virtualRef ? null : /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends$4({}, anchorProps, {
+    return virtualRef ? null : /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends$5({}, anchorProps, {
         ref: composedRefs
     }));
 });
@@ -24869,7 +24893,7 @@ const $cf1ac5d9fe0e8206$export$bc4ae5855d3c4fc = /*#__PURE__*/ forwardRef((props
         arrowX: arrowX,
         arrowY: arrowY,
         shouldHideArrow: cannotCenterArrow
-    }, /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends$4({
+    }, /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends$5({
         "data-side": placedSide,
         "data-align": placedAlign
     }, contentProps, {
@@ -24884,6 +24908,52 @@ const $cf1ac5d9fe0e8206$export$bc4ae5855d3c4fc = /*#__PURE__*/ forwardRef((props
         }
     }))));
 });
+/* -------------------------------------------------------------------------------------------------
+ * PopperArrow
+ * -----------------------------------------------------------------------------------------------*/ const $cf1ac5d9fe0e8206$var$ARROW_NAME = 'PopperArrow';
+const $cf1ac5d9fe0e8206$var$OPPOSITE_SIDE = {
+    top: 'bottom',
+    right: 'left',
+    bottom: 'top',
+    left: 'right'
+};
+const $cf1ac5d9fe0e8206$export$79d62cd4e10a3fd0 = /*#__PURE__*/ forwardRef(function $cf1ac5d9fe0e8206$export$79d62cd4e10a3fd0(props, forwardedRef) {
+    const { __scopePopper: __scopePopper , ...arrowProps } = props;
+    const contentContext = $cf1ac5d9fe0e8206$var$useContentContext($cf1ac5d9fe0e8206$var$ARROW_NAME, __scopePopper);
+    const baseSide = $cf1ac5d9fe0e8206$var$OPPOSITE_SIDE[contentContext.placedSide];
+    return(/*#__PURE__*/ // we have to use an extra wrapper because `ResizeObserver` (used by `useSize`)
+    // doesn't report size as we'd expect on SVG elements.
+    // it reports their bounding box which is effectively the largest path inside the SVG.
+    createElement("span", {
+        ref: contentContext.onArrowChange,
+        style: {
+            position: 'absolute',
+            left: contentContext.arrowX,
+            top: contentContext.arrowY,
+            [baseSide]: 0,
+            transformOrigin: {
+                top: '',
+                right: '0 0',
+                bottom: 'center 0',
+                left: '100% 0'
+            }[contentContext.placedSide],
+            transform: {
+                top: 'translateY(100%)',
+                right: 'translateY(50%) rotate(90deg) translateX(-50%)',
+                bottom: `rotate(180deg)`,
+                left: 'translateY(50%) rotate(-90deg) translateX(50%)'
+            }[contentContext.placedSide],
+            visibility: contentContext.shouldHideArrow ? 'hidden' : undefined
+        }
+    }, /*#__PURE__*/ createElement($7e8f5cd07187803e$export$be92b6f5f03c0fe9, _extends$5({}, arrowProps, {
+        ref: forwardedRef,
+        style: {
+            ...arrowProps.style,
+            // ensures the element can be measured correctly (mostly for if SVG)
+            display: 'block'
+        }
+    }))));
+});
 /* -----------------------------------------------------------------------------------------------*/ function $cf1ac5d9fe0e8206$var$isNotNull(value) {
     return value !== null;
 }
@@ -24939,6 +25009,7 @@ function $cf1ac5d9fe0e8206$var$getSideAndAlignFromPlacement(placement) {
 const $cf1ac5d9fe0e8206$export$be92b6f5f03c0fe9 = $cf1ac5d9fe0e8206$export$badac9ada3a0bdf9;
 const $cf1ac5d9fe0e8206$export$b688253958b8dfe7 = $cf1ac5d9fe0e8206$export$ecd4e1ccab6ed6d;
 const $cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2 = $cf1ac5d9fe0e8206$export$bc4ae5855d3c4fc;
+const $cf1ac5d9fe0e8206$export$21b07c8f274aebd5 = $cf1ac5d9fe0e8206$export$79d62cd4e10a3fd0;
 
 function _extends$3() {
   return _extends$3 = Object.assign ? Object.assign.bind() : function (n) {
@@ -25304,9 +25375,9 @@ const $a093c7e1ec25a057$export$8c610744efcf8a1d = /*#__PURE__*/ forwardRef((prop
     }, [
         handlePointerUp
     ]);
-    return /*#__PURE__*/ createElement($cf1ac5d9fe0e8206$export$b688253958b8dfe7, _extends$8({
+    return /*#__PURE__*/ createElement($cf1ac5d9fe0e8206$export$b688253958b8dfe7, _extends$9({
         asChild: true
-    }, popperScope), /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.button, _extends$8({
+    }, popperScope), /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.button, _extends$9({
         // We purposefully avoid adding `type=button` here because tooltip triggers are also
         // commonly anchors and the anchor `type` attribute signifies MIME type.
         "aria-describedby": context.open ? context.contentId : undefined,
@@ -25365,11 +25436,11 @@ const $a093c7e1ec25a057$export$e9003e2be37ec060 = /*#__PURE__*/ forwardRef((prop
     const context = $a093c7e1ec25a057$var$useTooltipContext($a093c7e1ec25a057$var$CONTENT_NAME, props.__scopeTooltip);
     return /*#__PURE__*/ createElement($921a889cee6df7e8$export$99c2b779aa4e8b8b, {
         present: forceMount || context.open
-    }, context.disableHoverableContent ? /*#__PURE__*/ createElement($a093c7e1ec25a057$var$TooltipContentImpl, _extends$8({
+    }, context.disableHoverableContent ? /*#__PURE__*/ createElement($a093c7e1ec25a057$var$TooltipContentImpl, _extends$9({
         side: side
     }, contentProps, {
         ref: forwardedRef
-    })) : /*#__PURE__*/ createElement($a093c7e1ec25a057$var$TooltipContentHoverable, _extends$8({
+    })) : /*#__PURE__*/ createElement($a093c7e1ec25a057$var$TooltipContentHoverable, _extends$9({
         side: side
     }, contentProps, {
         ref: forwardedRef
@@ -25460,7 +25531,7 @@ const $a093c7e1ec25a057$var$TooltipContentHoverable = /*#__PURE__*/ forwardRef((
         onClose,
         handleRemoveGraceArea
     ]);
-    return /*#__PURE__*/ createElement($a093c7e1ec25a057$var$TooltipContentImpl, _extends$8({}, props, {
+    return /*#__PURE__*/ createElement($a093c7e1ec25a057$var$TooltipContentImpl, _extends$9({}, props, {
         ref: composedRefs
     }));
 });
@@ -25505,7 +25576,7 @@ const $a093c7e1ec25a057$var$TooltipContentImpl = /*#__PURE__*/ forwardRef((props
         onFocusOutside: (event)=>event.preventDefault()
         ,
         onDismiss: onClose
-    }, /*#__PURE__*/ createElement($cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2, _extends$8({
+    }, /*#__PURE__*/ createElement($cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2, _extends$9({
         "data-state": context.stateAttribute
     }, popperScope, contentProps, {
         ref: forwardedRef,
@@ -25525,6 +25596,18 @@ const $a093c7e1ec25a057$var$TooltipContentImpl = /*#__PURE__*/ forwardRef((props
         role: "tooltip"
     }, ariaLabel || children))));
 });
+/* -------------------------------------------------------------------------------------------------
+ * TooltipArrow
+ * -----------------------------------------------------------------------------------------------*/ const $a093c7e1ec25a057$var$ARROW_NAME = 'TooltipArrow';
+const $a093c7e1ec25a057$export$c27ee0ad710f7559 = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
+    const { __scopeTooltip: __scopeTooltip , ...arrowProps } = props;
+    const popperScope = $a093c7e1ec25a057$var$usePopperScope(__scopeTooltip);
+    const visuallyHiddenContentContext = $a093c7e1ec25a057$var$useVisuallyHiddenContentContext($a093c7e1ec25a057$var$ARROW_NAME, __scopeTooltip); // if the arrow is inside the `VisuallyHidden`, we don't want to render it all to
+    // prevent issues in positioning the arrow due to the duplicate
+    return visuallyHiddenContentContext.isInside ? null : /*#__PURE__*/ createElement($cf1ac5d9fe0e8206$export$21b07c8f274aebd5, _extends$9({}, popperScope, arrowProps, {
+        ref: forwardedRef
+    }));
+});
 /* -----------------------------------------------------------------------------------------------*/ function $a093c7e1ec25a057$var$getExitSideFromRect(point, rect) {
     const top = Math.abs(rect.top - point.y);
     const bottom = Math.abs(rect.bottom - point.y);
@@ -25666,8 +25749,9 @@ const $a093c7e1ec25a057$export$be92b6f5f03c0fe9 = $a093c7e1ec25a057$export$28c66
 const $a093c7e1ec25a057$export$41fb9f06171c75f4 = $a093c7e1ec25a057$export$8c610744efcf8a1d;
 const $a093c7e1ec25a057$export$602eac185826482c = $a093c7e1ec25a057$export$7b36b8f925ab7497;
 const $a093c7e1ec25a057$export$7c6e2c02157bb7d2 = $a093c7e1ec25a057$export$e9003e2be37ec060;
+const $a093c7e1ec25a057$export$21b07c8f274aebd5 = $a093c7e1ec25a057$export$c27ee0ad710f7559;
 
-function Tooltip$1(_ref) {
+function Tooltip$2(_ref) {
   var children = _ref.children,
       content = _ref.content,
       _ref$hideTooltip = _ref.hideTooltip,
@@ -25679,15 +25763,15 @@ function Tooltip$1(_ref) {
 
   return /*#__PURE__*/React__default.createElement(Fragment, null, /*#__PURE__*/React__default.createElement($a093c7e1ec25a057$export$2881499e37b75b9a, null, /*#__PURE__*/React__default.createElement($a093c7e1ec25a057$export$be92b6f5f03c0fe9, null, /*#__PURE__*/React__default.createElement($a093c7e1ec25a057$export$41fb9f06171c75f4, {
     asChild: true
-  }, children), /*#__PURE__*/React__default.createElement($a093c7e1ec25a057$export$602eac185826482c, null, /*#__PURE__*/React__default.createElement(TooltipContent, {
+  }, children), /*#__PURE__*/React__default.createElement($a093c7e1ec25a057$export$602eac185826482c, null, /*#__PURE__*/React__default.createElement(TooltipContent$1, {
     sideOffset: 4
   }, content)))));
 }
-var slideUpAndFade = keyframes$3(["from{opacity:0;transform:translateY(2px);}to{opacity:1;transform:translateY(0);}"]);
-var slideRightAndFade = keyframes$3(["from{opacity:0;transform:translateX(-2px);}to{opacity:1;transform:translateX(0);}"]);
-var slideDownAndFade = keyframes$3(["from{opacity:0;transform:translateY(-2px);}to{opacity:1;transform:translateY(0);}"]);
-var slideLeftAndFade = keyframes$3(["from{opacity:0;transform:translateX(2px);}to{opacity:1;transform:translateX(0);}"]);
-var TooltipContent = styled($a093c7e1ec25a057$export$7c6e2c02157bb7d2).withConfig({
+var slideUpAndFade$1 = keyframes$3(["from{opacity:0;transform:translateY(2px);}to{opacity:1;transform:translateY(0);}"]);
+var slideRightAndFade$1 = keyframes$3(["from{opacity:0;transform:translateX(-2px);}to{opacity:1;transform:translateX(0);}"]);
+var slideDownAndFade$1 = keyframes$3(["from{opacity:0;transform:translateY(-2px);}to{opacity:1;transform:translateY(0);}"]);
+var slideLeftAndFade$1 = keyframes$3(["from{opacity:0;transform:translateX(2px);}to{opacity:1;transform:translateX(0);}"]);
+var TooltipContent$1 = styled($a093c7e1ec25a057$export$7c6e2c02157bb7d2).withConfig({
   displayName: "Tooltip__TooltipContent",
   componentId: "sc-1f1p4mx-0"
 })(["font-family:", ";white-space:nowrap;font-size:", ";line-height:", ";color:", ";background-color:", ";border-radius:", ";margin-top:", ";padding:", ";pointer-events:none;z-index:1000;animation-duration:400ms;animation-timing-function:cubic-bezier(0.16,1,0.3,1);will-change:transform,opacity;&[data-state=\"delayed-open\"][data-side=\"top\"]{animation-name:", ";}&[data-state=\"delayed-open\"][data-side=\"right\"]{animation-name:", ";}&[data-state=\"delayed-open\"][data-side=\"bottom\"]{animation-name:", ";}&[data-state=\"delayed-open\"][data-side=\"left\"]{animation-name:", ";}"], function (_ref2) {
@@ -25714,7 +25798,7 @@ var TooltipContent = styled($a093c7e1ec25a057$export$7c6e2c02157bb7d2).withConfi
 }, function (_ref9) {
   var theme = _ref9.theme;
   return theme.space.x0_25 + " " + theme.space.x0_75;
-}, slideUpAndFade, slideRightAndFade, slideDownAndFade, slideLeftAndFade);
+}, slideUpAndFade$1, slideRightAndFade$1, slideDownAndFade$1, slideLeftAndFade$1);
 
 function AppTag(_ref) {
   var app = _ref.app,
@@ -25725,7 +25809,7 @@ function AppTag(_ref) {
   var theme = useTheme();
   var abbreviation = APP_ABBREVIATIONS[app];
   var displayName = APP_DISPLAY_NAMES[app];
-  return /*#__PURE__*/React__default.createElement(Tooltip$1, {
+  return /*#__PURE__*/React__default.createElement(Tooltip$2, {
     content: displayName,
     hideTooltip: hideTooltip
   }, /*#__PURE__*/React__default.createElement(Wrapper$1, {
@@ -25733,8 +25817,8 @@ function AppTag(_ref) {
   }, /*#__PURE__*/React__default.createElement(LogoWrapper, {
     "$type": type
   }, /*#__PURE__*/React__default.createElement(NulogyLogo$1, {
-    width: 8,
-    height: 8
+    width: theme.space.x1,
+    height: theme.space.x1
   })), /*#__PURE__*/React__default.createElement(Text, {
     fontSize: "smaller",
     fontWeight: "bold",
@@ -28687,8 +28771,8 @@ function (_React$Component) {
         placement: _this.props.placement,
         eventsEnabled: _this.props.eventsEnabled,
         positionFixed: _this.props.positionFixed,
-        modifiers: _extends$c({}, _this.props.modifiers, {
-          arrow: _extends$c({}, _this.props.modifiers && _this.props.modifiers.arrow, {
+        modifiers: _extends$d({}, _this.props.modifiers, {
+          arrow: _extends$d({}, _this.props.modifiers && _this.props.modifiers.arrow, {
             enabled: !!_this.arrowNode,
             element: _this.arrowNode
           }),
@@ -28701,7 +28785,7 @@ function (_React$Component) {
     });
 
     _defineProperty$3(_assertThisInitialized$3(_assertThisInitialized$3(_this)), "getPopperStyle", function () {
-      return !_this.popperNode || !_this.state.data ? initialStyle : _extends$c({
+      return !_this.popperNode || !_this.state.data ? initialStyle : _extends$d({
         position: _this.state.data.offsets.popper.position
       }, _this.state.data.styles);
     });
@@ -28809,7 +28893,7 @@ function Popper$2(_ref) {
       props = _objectWithoutPropertiesLoose$4(_ref, ["referenceElement"]);
 
   return React.createElement(ManagerReferenceNodeContext$1.Consumer, null, function (referenceNode) {
-    return React.createElement(InnerPopper, _extends$c({
+    return React.createElement(InnerPopper, _extends$d({
       referenceElement: referenceElement !== undefined ? referenceElement : referenceNode
     }, props));
   });
@@ -28855,7 +28939,7 @@ function (_React$Component) {
 
 function Reference$1(props) {
   return React.createElement(ManagerReferenceNodeSetterContext$1.Consumer, null, function (setReferenceNode) {
-    return React.createElement(InnerReference, _extends$c({
+    return React.createElement(InnerReference, _extends$d({
       setReferenceNode: setReferenceNode
     }, props));
   });
@@ -29116,7 +29200,7 @@ var TooltipContainer = styled(Box).withConfig({
   });
 });
 
-var Tooltip = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
+var Tooltip$1 = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var _ref$showDelay = _ref.showDelay,
       showDelay = _ref$showDelay === void 0 ? "100" : _ref$showDelay,
       _ref$hideDelay = _ref.hideDelay,
@@ -29159,7 +29243,7 @@ function FramedIcon(_a) {
     justifyContent: "center",
     flexShrink: 0,
     borderRadius: "medium"
-  }, tooltip ? /*#__PURE__*/React__default.createElement(Tooltip, {
+  }, tooltip ? /*#__PURE__*/React__default.createElement(Tooltip$1, {
     tooltip: tooltip,
     defaultOpen: isTooltipOpenByDefault,
     maxWidth: maxWidth
@@ -29668,7 +29752,7 @@ var pick = function pick(o) {
 
 var StateManagedSelect = /*#__PURE__*/forwardRef(function (props, ref) {
   var baseSelectProps = useStateManager(props);
-  return /*#__PURE__*/React.createElement(Select, _extends$a({
+  return /*#__PURE__*/React.createElement(Select, _extends$b({
     ref: ref
   }, baseSelectProps));
 });
@@ -30604,7 +30688,7 @@ var FocusLock$1 = /*#__PURE__*/React.forwardRef(function FocusLockUI(props, pare
       }
     }, []);
   }
-  var lockProps = _extends$a((_extends2 = {}, _extends2[FOCUS_DISABLED] = disabled && 'disabled', _extends2[FOCUS_GROUP] = group, _extends2), containerProps);
+  var lockProps = _extends$b((_extends2 = {}, _extends2[FOCUS_DISABLED] = disabled && 'disabled', _extends2[FOCUS_GROUP] = group, _extends2), containerProps);
   var hasLeadingGuards = noFocusGuards !== true;
   var hasTailingGuards = hasLeadingGuards && noFocusGuards !== 'tail';
   var mergedRef = useMergeRefs([parentRef, setObserveNode]);
@@ -30643,7 +30727,7 @@ var FocusLock$1 = /*#__PURE__*/React.forwardRef(function FocusLockUI(props, pare
     returnFocus: returnFocus,
     focusOptions: focusOptions,
     noFocusGuards: noFocusGuards
-  }), /*#__PURE__*/React.createElement(Container, _extends$a({
+  }), /*#__PURE__*/React.createElement(Container, _extends$b({
     ref: mergedRef
   }, lockProps, {
     className: className,
@@ -31973,7 +32057,7 @@ mediumEffect.assignMedium(function (cb) {
 var FocusTrap = withSideEffect(reducePropsToState, handleStateChangeOnClient)(FocusWatcher);
 
 var FocusLockCombination = /*#__PURE__*/React.forwardRef(function FocusLockUICombination(props, ref) {
-  return /*#__PURE__*/React.createElement(FocusLockUI, _extends$a({
+  return /*#__PURE__*/React.createElement(FocusLockUI, _extends$b({
     sideCar: FocusTrap,
     ref: ref
   }, props));
@@ -34585,7 +34669,7 @@ var InputField = /*#__PURE__*/forwardRef(function (_a, ref) {
     textAlign: prefixAlignment
   }), /*#__PURE__*/React__default.createElement(InputWrapper, {
     maxWidth: inputWidth
-  }, iconLeft && (iconLeftTooltip ? /*#__PURE__*/React__default.createElement(Tooltip, Object.assign({
+  }, iconLeft && (iconLeftTooltip ? /*#__PURE__*/React__default.createElement(Tooltip$1, Object.assign({
     tooltip: iconLeftTooltip
   }, iconLeftTooltipProps), /*#__PURE__*/React__default.createElement(InputIcon, {
     left: "x1",
@@ -34606,7 +34690,7 @@ var InputField = /*#__PURE__*/forwardRef(function (_a, ref) {
     size: htmlSize,
     variant: componentVariant,
     inputWidth: inputWidth
-  }, props)), iconRight && (iconRightTooltip ? /*#__PURE__*/React__default.createElement(Tooltip, Object.assign({
+  }, props)), iconRight && (iconRightTooltip ? /*#__PURE__*/React__default.createElement(Tooltip$1, Object.assign({
     tooltip: iconRightTooltip
   }, iconRightTooltipProps), /*#__PURE__*/React__default.createElement(InputIcon, {
     right: "x1",
@@ -34752,7 +34836,7 @@ var BaseNavBarSearch = function BaseNavBarSearch(_ref) {
   var _useTranslation = useTranslation(),
       t = _useTranslation.t;
 
-  return /*#__PURE__*/React__default.createElement("form", _extends$c({}, props, {
+  return /*#__PURE__*/React__default.createElement("form", _extends$d({}, props, {
     onSubmit: handleOnSubmit
   }), /*#__PURE__*/React__default.createElement(Flex, {
     role: "search"
@@ -61261,7 +61345,7 @@ function createListComponent(_ref) {
         className: className,
         onScroll: onScroll,
         ref: this._outerRefSetter,
-        style: _extends$a({
+        style: _extends$b({
           position: 'relative',
           height: height,
           width: width,
@@ -65094,14 +65178,170 @@ var TopBar = {
   MenuItemLink: MenuItemLink
 };
 
-var MaybeTooltip = function MaybeTooltip(_a) {
-  var _a$children = _a.children,
-      children = _a$children === void 0 ? "" : _a$children,
-      _a$showTooltip = _a.showTooltip,
-      showTooltip = _a$showTooltip === void 0 ? true : _a$showTooltip,
-      props = __rest$3(_a, ["children", "showTooltip"]);
+function useHasHover() {
+  try {
+    return matchMedia("(hover: hover)").matches;
+  } catch (_a) {
+    // Assume that if the browser is too old to support matchMedia, it's likely not a touch device
+    return true;
+  }
+}
 
-  return showTooltip ? /*#__PURE__*/React__default.createElement(Tooltip, Object.assign({}, props), children) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, children);
+var TooltipTriggerContext = /*#__PURE__*/React.createContext({
+  supportMobileTap: false,
+  open: false,
+  setOpen: function setOpen() {}
+});
+var TooltipProvider = $a093c7e1ec25a057$export$2881499e37b75b9a;
+
+var Tooltip = function Tooltip(_a) {
+  var _b, _c;
+
+  var children = _a.children,
+      props = __rest$3(_a, ["children"]);
+
+  var _React$useState = React.useState((_b = props.defaultOpen) !== null && _b !== void 0 ? _b : false),
+      open = _React$useState[0],
+      setOpen = _React$useState[1];
+
+  var hasHover = useHasHover();
+  return /*#__PURE__*/React.createElement($a093c7e1ec25a057$export$be92b6f5f03c0fe9, {
+    delayDuration: !hasHover && props.supportMobileTap ? 0 : props.delayDuration,
+    onOpenChange: setOpen,
+    open: open
+  }, /*#__PURE__*/React.createElement(TooltipTriggerContext.Provider, {
+    value: {
+      open: open,
+      setOpen: setOpen,
+      supportMobileTap: (_c = props.supportMobileTap) !== null && _c !== void 0 ? _c : false
+    }
+  }, children));
+};
+
+Tooltip.displayName = $a093c7e1ec25a057$export$be92b6f5f03c0fe9.displayName;
+var TooltipTrigger = /*#__PURE__*/React.forwardRef(function (_a, ref) {
+  var children = _a.children,
+      props = __rest$3(_a, ["children"]);
+
+  var hasHover = useHasHover();
+
+  var _React$useContext = React.useContext(TooltipTriggerContext),
+      setOpen = _React$useContext.setOpen,
+      supportMobileTap = _React$useContext.supportMobileTap;
+
+  var onClickProp = props.onClick;
+  var onClick = React.useCallback(function (e) {
+    if (!hasHover && supportMobileTap) {
+      e.preventDefault();
+      setOpen(true);
+    } else {
+      onClickProp === null || onClickProp === void 0 ? void 0 : onClickProp(e);
+    }
+  }, [setOpen, hasHover, supportMobileTap, onClickProp]);
+  return /*#__PURE__*/React.createElement($a093c7e1ec25a057$export$41fb9f06171c75f4, Object.assign({
+    ref: ref
+  }, props, {
+    onClick: onClick
+  }), children);
+});
+TooltipTrigger.displayName = $a093c7e1ec25a057$export$41fb9f06171c75f4.displayName;
+var slideUpAndFade = keyframes$3(["from{opacity:0;transform:translateY(2px);}to{opacity:1;transform:translateY(0);}"]);
+var slideRightAndFade = keyframes$3(["from{opacity:0;transform:translateX(-2px);}to{opacity:1;transform:translateX(0);}"]);
+var slideDownAndFade = keyframes$3(["from{opacity:0;transform:translateY(-2px);}to{opacity:1;transform:translateY(0);}"]);
+var slideLeftAndFade = keyframes$3(["from{opacity:0;transform:translateX(2px);}to{opacity:1;transform:translateX(0);}"]);
+var StyledContent = styled($a093c7e1ec25a057$export$7c6e2c02157bb7d2).withConfig({
+  displayName: "TooltipComponents__StyledContent",
+  componentId: "sc-1fm7xjh-0"
+})(["font-family:", ";font-size:", ";line-height:", ";border-radius:", ";padding:", ";color:", ";background-color:", ";border:1px solid ", ";box-shadow:", ";z-index:", ";animation-duration:400ms;animation-timing-function:cubic-bezier(0.16,1,0.3,1);will-change:transform,opacity;&[data-state=\"delayed-open\"][data-side=\"top\"]{animation-name:", ";}&[data-state=\"delayed-open\"][data-side=\"right\"]{animation-name:", ";}&[data-state=\"delayed-open\"][data-side=\"bottom\"]{animation-name:", ";}&[data-state=\"delayed-open\"][data-side=\"left\"]{animation-name:", ";}", ""], function (_ref) {
+  var theme = _ref.theme;
+  return theme.fonts.base;
+}, function (_ref2) {
+  var theme = _ref2.theme;
+  return theme.fontSizes.small;
+}, function (_ref3) {
+  var theme = _ref3.theme;
+  return theme.lineHeights.smallTextBase;
+}, function (_ref4) {
+  var theme = _ref4.theme;
+  return theme.radii.medium;
+}, function (_ref5) {
+  var theme = _ref5.theme;
+  return theme.space.x1;
+}, function (_ref6) {
+  var theme = _ref6.theme;
+  return theme.colors.black;
+}, function (_ref7) {
+  var theme = _ref7.theme;
+  return theme.colors.white;
+}, function (_ref8) {
+  var theme = _ref8.theme;
+  return theme.colors.grey;
+}, function (_ref9) {
+  var theme = _ref9.theme;
+  return theme.shadows.medium;
+}, function (_ref10) {
+  var theme = _ref10.theme;
+  return theme.zIndices.content;
+}, slideDownAndFade, slideLeftAndFade, slideUpAndFade, slideRightAndFade, maxWidth);
+var StyledArrow = styled($a093c7e1ec25a057$export$21b07c8f274aebd5).withConfig({
+  displayName: "TooltipComponents__StyledArrow",
+  componentId: "sc-1fm7xjh-1"
+})(function (_ref11) {
+  var theme = _ref11.theme;
+  return {
+    fill: theme.colors.white,
+    filter: "drop-shadow(0px 1px 0px " + theme.colors.grey + ")"
+  };
+});
+var TooltipContent = /*#__PURE__*/React.forwardRef(function (_a, ref) {
+  var _a$sideOffset = _a.sideOffset,
+      sideOffset = _a$sideOffset === void 0 ? 4 : _a$sideOffset,
+      children = _a.children,
+      props = __rest$3(_a, ["sideOffset", "children"]);
+
+  var theme = useTheme();
+  return /*#__PURE__*/React.createElement(StyledContent, Object.assign({
+    ref: ref,
+    sideOffset: sideOffset
+  }, props), children, /*#__PURE__*/React.createElement(StyledArrow, {
+    width: theme.space.x1_5,
+    height: theme.space.x0_75
+  }));
+});
+TooltipContent.displayName = $a093c7e1ec25a057$export$7c6e2c02157bb7d2.displayName;
+
+var MaybeTooltip = function MaybeTooltip(_ref) {
+  var tooltip = _ref.tooltip,
+      children = _ref.children,
+      _ref$placement = _ref.placement,
+      placement = _ref$placement === void 0 ? "bottom" : _ref$placement,
+      _ref$defaultOpen = _ref.defaultOpen,
+      defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen,
+      _ref$showDelay = _ref.showDelay,
+      showDelay = _ref$showDelay === void 0 ? 100 : _ref$showDelay,
+      _ref$maxWidth = _ref.maxWidth,
+      maxWidth = _ref$maxWidth === void 0 ? "24em" : _ref$maxWidth,
+      _ref$showTooltip = _ref.showTooltip,
+      showTooltip = _ref$showTooltip === void 0 ? true : _ref$showTooltip,
+      _ref$supportMobileTap = _ref.supportMobileTap,
+      supportMobileTap = _ref$supportMobileTap === void 0 ? true : _ref$supportMobileTap,
+      className = _ref.className;
+
+  if (!showTooltip) {
+    return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, children);
+  }
+
+  return /*#__PURE__*/React__default.createElement(TooltipProvider, null, /*#__PURE__*/React__default.createElement(Tooltip, {
+    defaultOpen: defaultOpen,
+    delayDuration: showDelay,
+    supportMobileTap: supportMobileTap
+  }, /*#__PURE__*/React__default.createElement(TooltipTrigger, {
+    asChild: true
+  }, children), /*#__PURE__*/React__default.createElement($a093c7e1ec25a057$export$602eac185826482c, null, /*#__PURE__*/React__default.createElement(TooltipContent, {
+    side: placement,
+    className: className,
+    maxWidth: maxWidth
+  }, tooltip))));
 };
 
 var TruncatedTextFillWidth = function TruncatedTextFillWidth(_a) {
@@ -65222,4 +65462,4 @@ var VerticalDivider = styled.div.withConfig({
 }, addStyledProps);
 VerticalDivider.displayName = "VerticalDivider";
 
-export { ALL_NDS_LOCALES, Alert$1 as Alert, AnimatedBox, AppTag, ApplicationFrame, AsyncSelect, Banner, BottomSheet, BottomSheetParts, Box, BrandLogoContainer, NavBar as BrandedNavBar, Branding, Breadcrumbs, Button, ButtonGroup, Card, CardSet, Checkbox, CheckboxGroup, ControlIcon, DangerButton, DatePicker, DateRange, DescriptionDetails, DescriptionGroup, DescriptionList, DescriptionTerm, DesktopMenu, Divider$1 as Divider, DropdownButton, DropdownItem, DropdownLink, DropdownMenu, DropdownText, EnvironmentBanner, Field, FieldLabel, Fieldset, Flex, Form, FormSection, Header$1 as Header, Heading1, Heading2, Heading3, Heading4, HelpText$1 as HelpText, Icon, IconicButton, InlineFlex, InlineIcon, InlineValidation, Input, Link, List, ListItem, LoadingAnimation, MenuTrigger, Modal, MonthPicker, NDSProvider, NavBarBackground, NotificationTypes, Overlay$1 as Overlay, Page, Pagination, PrimaryButton, QuietButton, Radio, RadioGroup, RangeContainer, RequirementText, NDSSelect as Select, SelectClearIndicator, SelectContainer, SelectControl, SelectDropdownIndicator, SelectInput, SelectMenu, SelectMultiValue, SelectOption$1 as SelectOption, Sidebar, SmallNavBar, SortingTable, StatusIndicator, StatusIndicatorValues, Summary, SummaryDivider, SummaryItem, Switch$1 as Switch, Switcher, Tab, Table, Tabs, Text, Textarea, TimePicker, TimeRange, Toast, ToastContainer, ToggleComponent as Toggle, Tooltip, TopBar, TruncatedText, VerticalDivider, WeekPicker, addStyledProps, legacy as desktop, phone, tablet, themes, toast, useMediaQuery, useWindowDimensions };
+export { ALL_NDS_LOCALES, Alert$1 as Alert, AnimatedBox, AppTag, ApplicationFrame, AsyncSelect, Banner, BottomSheet, BottomSheetParts, Box, BrandLogoContainer, NavBar as BrandedNavBar, Branding, Breadcrumbs, Button, ButtonGroup, Card, CardSet, Checkbox, CheckboxGroup, ControlIcon, DangerButton, DatePicker, DateRange, DescriptionDetails, DescriptionGroup, DescriptionList, DescriptionTerm, DesktopMenu, Divider$1 as Divider, DropdownButton, DropdownItem, DropdownLink, DropdownMenu, DropdownText, EnvironmentBanner, Field, FieldLabel, Fieldset, Flex, Form, FormSection, Header$1 as Header, Heading1, Heading2, Heading3, Heading4, HelpText$1 as HelpText, Icon, IconicButton, InlineFlex, InlineIcon, InlineValidation, Input, Link, List, ListItem, LoadingAnimation, MenuTrigger, Modal, MonthPicker, NDSProvider, NavBarBackground, NotificationTypes, Overlay$1 as Overlay, Page, Pagination, PrimaryButton, QuietButton, Radio, RadioGroup, RangeContainer, RequirementText, NDSSelect as Select, SelectClearIndicator, SelectContainer, SelectControl, SelectDropdownIndicator, SelectInput, SelectMenu, SelectMultiValue, SelectOption$1 as SelectOption, Sidebar, SmallNavBar, SortingTable, StatusIndicator, StatusIndicatorValues, Summary, SummaryDivider, SummaryItem, Switch$1 as Switch, Switcher, Tab, Table, Tabs, Text, Textarea, TimePicker, TimeRange, Toast, ToastContainer, ToggleComponent as Toggle, Tooltip$1 as Tooltip, TopBar, TruncatedText, VerticalDivider, WeekPicker, addStyledProps, legacy as desktop, phone, tablet, themes, toast, useMediaQuery, useWindowDimensions };