@luminati-io/uikit 1.9.10 → 1.9.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/uikit.umd.js CHANGED
@@ -22331,6 +22331,7 @@ __webpack_require__.r(__webpack_exports__);
22331
22331
  /* harmony import */ var _menu__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../menu */ "./src/menu/index.js");
22332
22332
  /* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../typography */ "./src/typography/index.js");
22333
22333
  /* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
22334
+ /* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../constants */ "./src/constants.js");
22334
22335
  // LICENSE_CODE ZON
22335
22336
 
22336
22337
 
@@ -22349,6 +22350,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
22349
22350
 
22350
22351
 
22351
22352
 
22353
+
22352
22354
  var ComboButton = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRef(function (props, ref) {
22353
22355
  var text = props.text,
22354
22356
  variant = props.variant,
@@ -22422,7 +22424,8 @@ var ArrowIcon = function ArrowIcon(props) {
22422
22424
  }));
22423
22425
  };
22424
22426
  var ComboButtonMenuTrigger = (0,_hoc__WEBPACK_IMPORTED_MODULE_3__.withPopover)(ArrowIcon, ComboButtonMenu, {
22425
- placement: 'bottom-end'
22427
+ placement: 'bottom-end',
22428
+ zIndex: _constants__WEBPACK_IMPORTED_MODULE_8__.Z_INDEX.combobutton
22426
22429
  });
22427
22430
  var StyledButtonWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
22428
22431
  displayName: "StyledButtonWrapper",
@@ -22505,7 +22508,8 @@ var Z_INDEX = {
22505
22508
  backdrop: 1040,
22506
22509
  datepicker: 2000,
22507
22510
  tooltip: 9999,
22508
- dropdown: 999999
22511
+ dropdown: 999999,
22512
+ combobutton: 999999
22509
22513
  };
22510
22514
 
22511
22515
  /***/ }),
@@ -29370,15 +29374,13 @@ __webpack_require__.r(__webpack_exports__);
29370
29374
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);
29371
29375
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
29372
29376
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
29373
- /* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-dom */ "react-dom");
29374
- /* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_2__);
29375
- /* harmony import */ var react_popper__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-popper */ "./node_modules/react-popper/lib/esm/usePopper.js");
29376
- /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! styled-components */ "styled-components");
29377
- /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_3__);
29378
- /* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./theme */ "./src/theme.js");
29379
- /* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./typography */ "./src/typography/index.js");
29380
- /* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./utils */ "./src/utils.js");
29381
- /* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./constants */ "./src/constants.js");
29377
+ /* harmony import */ var react_popper__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react-popper */ "./node_modules/react-popper/lib/esm/usePopper.js");
29378
+ /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! styled-components */ "styled-components");
29379
+ /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_2__);
29380
+ /* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./theme */ "./src/theme.js");
29381
+ /* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./typography */ "./src/typography/index.js");
29382
+ /* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils */ "./src/utils.js");
29383
+ /* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./constants */ "./src/constants.js");
29382
29384
  // LICENSE_CODE ZON
29383
29385
 
29384
29386
 
@@ -29398,12 +29400,13 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
29398
29400
 
29399
29401
 
29400
29402
 
29401
-
29403
+ var CLOSE_DELAY = 200;
29402
29404
  var Tooltip = function Tooltip(props) {
29403
29405
  var children = props.children,
29404
29406
  tooltip = props.tooltip,
29405
29407
  placement = props.placement,
29406
- noWrap = props.noWrap;
29408
+ noWrap = props.noWrap,
29409
+ interactive = props.interactive;
29407
29410
  var _useState = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(null),
29408
29411
  _useState2 = _slicedToArray(_useState, 2),
29409
29412
  referenceElement = _useState2[0],
@@ -29420,13 +29423,23 @@ var Tooltip = function Tooltip(props) {
29420
29423
  _useState8 = _slicedToArray(_useState7, 2),
29421
29424
  visible = _useState8[0],
29422
29425
  setVisible = _useState8[1];
29426
+ var closeTimmer = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)();
29423
29427
  var show = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function () {
29424
- return setVisible(true);
29428
+ clearTimeout(closeTimmer.current);
29429
+ setVisible(true);
29425
29430
  }, []);
29426
29431
  var hide = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function () {
29427
- return setVisible(false);
29432
+ clearTimeout(closeTimmer.current);
29433
+ closeTimmer.current = setTimeout(function () {
29434
+ return setVisible(false);
29435
+ }, interactive ? CLOSE_DELAY : 0);
29436
+ }, []);
29437
+ (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {
29438
+ return function () {
29439
+ clearTimeout(closeTimmer.current);
29440
+ };
29428
29441
  }, []);
29429
- var _usePopper = (0,react_popper__WEBPACK_IMPORTED_MODULE_8__.usePopper)(referenceElement, popperElement, {
29442
+ var _usePopper = (0,react_popper__WEBPACK_IMPORTED_MODULE_7__.usePopper)(referenceElement, popperElement, {
29430
29443
  placement: placement,
29431
29444
  modifiers: [{
29432
29445
  name: 'arrow',
@@ -29438,21 +29451,26 @@ var Tooltip = function Tooltip(props) {
29438
29451
  options: {
29439
29452
  offset: [0, 8]
29440
29453
  }
29441
- }]
29454
+ }],
29455
+ strategy: 'fixed'
29442
29456
  }),
29443
29457
  styles = _usePopper.styles,
29444
29458
  attributes = _usePopper.attributes;
29445
29459
  if (!tooltip) return children;
29446
- var tooltipNode = visible ? /*#__PURE__*/react_dom__WEBPACK_IMPORTED_MODULE_2___default().createPortal( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(StyledTooltipBody, _extends({
29460
+ var tooltipNode = visible ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(StyledTooltipBody, _extends({
29447
29461
  ref: setPopperElement,
29462
+ role: "tooltip",
29448
29463
  style: styles.popper
29449
- }, attributes.popper), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_5__.Label, {
29464
+ }, attributes.popper, {
29465
+ onPointerEnter: interactive ? show : undefined,
29466
+ onPointerLeave: interactive ? hide : undefined
29467
+ }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_4__.Label, {
29450
29468
  variant: "sm",
29451
29469
  color: "white"
29452
29470
  }, tooltip), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(StyledTooltipArrow, _extends({
29453
29471
  ref: setArrowElement,
29454
29472
  style: styles.arrow
29455
- }, attributes.arrow))), document.body) : null;
29473
+ }, attributes.arrow))) : null;
29456
29474
  if (noWrap) {
29457
29475
  var child = react__WEBPACK_IMPORTED_MODULE_1__.Children.only(children);
29458
29476
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), null, /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.cloneElement)(child, {
@@ -29472,23 +29490,24 @@ Tooltip.defaultProps = {
29472
29490
  };
29473
29491
  Tooltip.propTypes = {
29474
29492
  tooltip: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),
29475
- placement: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(_utils__WEBPACK_IMPORTED_MODULE_6__.tooltipPlacements),
29476
- noWrap: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool)
29493
+ placement: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(_utils__WEBPACK_IMPORTED_MODULE_5__.tooltipPlacements),
29494
+ noWrap: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
29495
+ interactive: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool)
29477
29496
  };
29478
29497
  var withTooltip = function withTooltip(Comp, tooltipProps) {
29479
29498
  return function WithTooltip(props) {
29480
29499
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(Tooltip, tooltipProps, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(Comp, props));
29481
29500
  };
29482
29501
  };
29483
- var StyledTooltipBody = styled_components__WEBPACK_IMPORTED_MODULE_3___default().div.withConfig({
29502
+ var StyledTooltipBody = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
29484
29503
  displayName: "StyledTooltipBody",
29485
29504
  componentId: "sc-146jrck-0"
29486
- })(["background-color:", ";padding:", ";width:fit-content;max-width:500px;border-radius:", ";transition:opacity 200ms;z-index:", ";"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].color.gray_11_50, _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["03"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["02"], _constants__WEBPACK_IMPORTED_MODULE_7__.Z_INDEX.tooltip);
29487
- var StyledTooltipArrow = styled_components__WEBPACK_IMPORTED_MODULE_3___default().div.withConfig({
29505
+ })(["background-color:", ";padding:", ";width:fit-content;max-width:500px;border-radius:", ";transition:opacity 200ms;z-index:", ";"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_11_50, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["03"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["02"], _constants__WEBPACK_IMPORTED_MODULE_6__.Z_INDEX.tooltip);
29506
+ var StyledTooltipArrow = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
29488
29507
  displayName: "StyledTooltipArrow",
29489
29508
  componentId: "sc-146jrck-1"
29490
- })(["&,&::before{position:absolute;width:", ";height:", ";background:inherit;border-radius:", ";}z-index:-1;visibility:hidden;&::before{visibility:visible;content:'';transform:rotate(45deg);}[data-popper-placement^='top'] > &{bottom:-", ";}[data-popper-placement^='right'] > &{left:-", ";}[data-popper-placement^='bottom'] > &{top:-", ";}[data-popper-placement^='left'] > &{right:-", ";}"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["04"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["04"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["01"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["02"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["02"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["02"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["02"]);
29491
- var StyledTooltipReference = styled_components__WEBPACK_IMPORTED_MODULE_3___default().div.withConfig({
29509
+ })(["&,&::before{position:absolute;width:", ";height:", ";background:inherit;border-radius:", ";}z-index:-1;visibility:hidden;&::before{visibility:visible;content:'';transform:rotate(45deg);}[data-popper-placement^='top'] > &{bottom:-", ";}[data-popper-placement^='right'] > &{left:-", ";}[data-popper-placement^='bottom'] > &{top:-", ";}[data-popper-placement^='left'] > &{right:-", ";}"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["04"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["04"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["01"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["02"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["02"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["02"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["02"]);
29510
+ var StyledTooltipReference = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
29492
29511
  displayName: "StyledTooltipReference",
29493
29512
  componentId: "sc-146jrck-2"
29494
29513
  })(["width:fit-content;"]);