@startlibs/components 1.0.2 → 1.0.4

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.
Files changed (3) hide show
  1. package/lib/index.js +376 -141
  2. package/package.json +1 -1
  3. package/yarn-error.log +3724 -0
package/lib/index.js CHANGED
@@ -6,7 +6,7 @@ import _getPrototypeOf from '@babel/runtime/helpers/getPrototypeOf';
6
6
  import _inherits from '@babel/runtime/helpers/inherits';
7
7
  import React, { useEffect, useRef, useMemo, useState, useLayoutEffect, forwardRef } from 'react';
8
8
  import styled, { withTheme, css, isStyledComponent, createGlobalStyle } from 'styled-components';
9
- import { transparentize, darken, rgba, lighten } from 'polished';
9
+ import { transparentize, darken, rgba } from 'polished';
10
10
  import { getColor, styledExtend, media, customTheme, callIfFunction, twoWayAnimation, oneWayAnimation, ifUndefined, getUID, constrainEvent, printerMedia, getClosestOffsetScroll, identityOpacityFrames, getScrollParent, normalizeMouse, normalizeTouch, getMargin, animationTiming, ifProp, isMobile, createPressAndMoveEvent, stopPropagation, postFetcher, _s, formatDate, addQueryString } from '@startlibs/utils';
11
11
  import _extends from '@babel/runtime/helpers/extends';
12
12
  import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
@@ -102,14 +102,14 @@ var Loading = styled.div.withConfig({
102
102
  });
103
103
 
104
104
  var _excluded$l = ["type", "locked", "color", "alpha", "success", "alert", "warning", "highlight", "light", "hover", "white", "icon", "onlyIcon", "small", "withDropdown", "onlyDropdown", "outline", "dashed", "textOnly", "isLoading", "isLoadingIcon", "dark", "innerAs", "className", "children", "rounded", "tabIndex", "focused", "noFocus", "colorSet", "concealed", "concealedModule", "buttonRef"];
105
- var _templateObject$8, _templateObject2$7, _templateObject3$4;
105
+ var _templateObject$8, _templateObject2$7, _templateObject3$5;
106
106
  var DropdownIcon = styledExtend(Icon$1)(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteral(["\n position: absolute;\n top: 51%;\n transform: translateY(-50%);\n right: 1rem;\n font-size: 12px;\n"])));
107
107
  var LockIcon = styled(Icon$1).withConfig({
108
108
  displayName: "Button__LockIcon",
109
109
  componentId: "sc-qe54pl-0"
110
110
  })(["position:absolute;bottom:10px;right:.75rem;left:auto;top:auto;font-size:18px;"]);
111
111
  var focus = css([":after{content:'';pointer-events:none;position:absolute;top:-3px;right:-3px;left:-3px;bottom:-3px;border-radius:", ";border:2px solid rgba(0,0,0,0.15);}"], function (props) {
112
- return props.rounded ? '100px' : '9px';
112
+ return props.rounded ? '100px' : '11px';
113
113
  });
114
114
  var Button = styled(/*#__PURE__*/React.forwardRef(function (_ref, ref) {
115
115
  var _ref$type = _ref.type,
@@ -174,7 +174,7 @@ var Button = styled(/*#__PURE__*/React.forwardRef(function (_ref, ref) {
174
174
  displayName: "Button",
175
175
  componentId: "sc-qe54pl-1"
176
176
  })(["vertical-align:top;border:0;font-size:12px;border-radius:", ";background:", ";color:white;min-width:8rem;font-weight:500;display:inline-block;line-height:16px;text-align:center;padding:10px 1.25rem;outline:none;cursor:pointer;position:relative;text-decoration:none;user-select:none;flex-shrink:0;:hover{background:", ";}:active{background:", ";}", " ", " & + &{margin-left:1rem;}", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], function (props) {
177
- return props.rounded ? '100px' : '6px';
177
+ return props.rounded ? '100px' : '8px';
178
178
  }, getColor, function (props) {
179
179
  return darken(0.05, getColor(props, true));
180
180
  }, function (props) {
@@ -187,7 +187,7 @@ var Button = styled(/*#__PURE__*/React.forwardRef(function (_ref, ref) {
187
187
  });
188
188
  }, function (props) {
189
189
  return props.hasErrors && css([":after{content:'';pointer-events:none;position:absolute;top:-4px;right:-4px;left:-4px;bottom:-4px;border-radius:", ";border:3px solid ", ";}"], function (props) {
190
- return props.rounded ? '100px' : '9px';
190
+ return props.rounded ? '100px' : '11px';
191
191
  }, function (props) {
192
192
  return transparentize(0.7, getColor("alert")(props));
193
193
  });
@@ -228,7 +228,7 @@ var Button = styled(/*#__PURE__*/React.forwardRef(function (_ref, ref) {
228
228
  return transparentize(0.76, darken(0.05, getColor('warning')(props)));
229
229
  });
230
230
  }, function (props) {
231
- return (props.outline || props.dashed || props.textOnly) && css(["color:", ";background:none;", ",", "{color:", ";}:before{content:'';border:1px ", " ", ";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:", ";pointer-events:none;}:hover{background-color:rgba(0,0,0,0.05);}:active{background-color:rgba(0,0,0,0.08);}:focus{:before{box-shadow:0 0 0 2px rgba(0,0,0,0.1);", "}:after{content:none;}}"], props.white ? 'white' : props.highlight ? getColor('main') : 'rgba(0,0,0,0.6)', Icon$1, DropdownIcon, props.white ? 'white' : props.highlight ? getColor('main') : 'rgba(0,0,0,0.5)', props.outline ? 'solid' : props.dashed ? 'dashed' : '', props.white ? 'white' : props.highlight ? getColor('main') : 'rgba(0,0,0,0.35)', props.rounded ? '100px' : '6px', props.textOnly && 'content: none;');
231
+ return (props.outline || props.dashed || props.textOnly) && css(["color:", ";background:none;", ",", "{color:", ";}:before{content:'';border:1px ", " ", ";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:", ";pointer-events:none;}:hover{background-color:rgba(0,0,0,0.05);}:active{background-color:rgba(0,0,0,0.08);}:focus{:before{box-shadow:0 0 0 2px rgba(0,0,0,0.1);", "}:after{content:none;}}"], props.white ? 'white' : props.highlight ? getColor('main') : 'rgba(0,0,0,0.6)', Icon$1, DropdownIcon, props.white ? 'white' : props.highlight ? getColor('main') : 'rgba(0,0,0,0.5)', props.outline ? 'solid' : props.dashed ? 'dashed' : '', props.white ? 'white' : props.highlight ? getColor('main') : 'rgba(0,0,0,0.35)', props.rounded ? '100px' : '8px', props.textOnly && 'content: none;');
232
232
  }, function (props) {
233
233
  return props.alpha && css(["background:rgba(0,0,0,0.45);:hover{background:rgba(0,0,0,0.50);}:active{background:rgba(0,0,0,0.55);}"]);
234
234
  }, function (props) {
@@ -243,7 +243,7 @@ var Button = styled(/*#__PURE__*/React.forwardRef(function (_ref, ref) {
243
243
  return !props.small && props.onlyIcon && css(["min-width:3.5rem;min-height:3.5rem;"]);
244
244
  }, function (props) {
245
245
  return props.withDropdown && css(["padding-right:2.5rem;", "{right:14px;}"], DropdownIcon);
246
- }), media.max(359)(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteral(["\n ", "\n "])), function (props) {
246
+ }), media.max(359)(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteral(["\n ", "\n "])), function (props) {
247
247
  return !props.small && !props.onlyIcon && !props.onlyDropdown && css(["min-width:0;"]);
248
248
  }), function (props) {
249
249
  return props.fullwidth && "\n width: 100%;\n ";
@@ -438,8 +438,8 @@ var LoadingDiv = function LoadingDiv(_ref2) {
438
438
  }, children) : children);
439
439
  };
440
440
 
441
- var _excluded$h = ["className", "skipWrap", "stickyFooter", "fixTitleMargin", "skipCloseIcon", "isLoading", "footer", "Content", "children", "title", "illustration", "icon", "auxiliarActions", "container"];
442
- var _templateObject$7, _templateObject2$6, _templateObject3$3, _templateObject4$2, _templateObject5$1, _templateObject6$1, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
441
+ var _excluded$h = ["className", "skipWrap", "wrapChildren", "stickyFooter", "fixTitleMargin", "skipCloseIcon", "isLoading", "footer", "Content", "children", "title", "illustration", "icon", "auxiliarActions", "container", "onClose"];
442
+ var _templateObject$7, _templateObject2$6, _templateObject3$4, _templateObject4$2, _templateObject5$1, _templateObject6$1, _templateObject7$1, _templateObject8$1, _templateObject9, _templateObject10;
443
443
  var DialogIcon = styled(Icon$1).withConfig({
444
444
  displayName: "Dialog__DialogIcon",
445
445
  componentId: "sc-gai4ey-0"
@@ -466,7 +466,7 @@ var DialogContent = styled(function (props) {
466
466
  })(["outline:none;width:100%;position:relative;min-height:5rem;", " ", " p{font-size:14px;}"], function (props) {
467
467
  return props.icon && css(["padding-right:8rem;min-height:6rem;"]);
468
468
  }, function (props) {
469
- return props.illustration && css(["padding-right:15rem;", ""], media.mobile(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteral(["\n padding-right: 1.5rem;\n "]))));
469
+ return props.illustration && css(["padding-right:15rem;", ""], media.mobile(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteral(["\n padding-right: 1.5rem;\n "]))));
470
470
  });
471
471
  var DialogTitle = styled.h2.withConfig({
472
472
  displayName: "Dialog__DialogTitle",
@@ -478,10 +478,10 @@ var DialogFooter = styled.div.withConfig({
478
478
  displayName: "Dialog__DialogFooter",
479
479
  componentId: "sc-gai4ey-5"
480
480
  })(["display:block;padding-top:1rem;margin-top:1rem;align-items:stretch;text-align:right;", " ", ""], function (props) {
481
- return props.sticky && css(["position:sticky;background:white;width:inherit;z-index:50;", " ", " ", ""], media.desktop(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteral(["\n bottom: -3rem;\n margin-left: -2rem;\n margin-right: -2rem;\n margin-bottom: -1.5rem;\n margin-top: 0.5rem;\n padding: 1.5rem 2rem;\n border-radius: 0 0 0.5rem 0.5rem;\n "]))), media.mobile(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteral(["\n bottom: -0.5rem;\n padding: 0.75rem 1.5rem;\n margin-bottom: -0.75rem;\n margin-left: -1.5rem;\n margin-right: -1.5rem;\n "]))), function (props) {
481
+ return props.sticky && css(["position:sticky;background:white;width:inherit;z-index:50;", " ", " ", ""], media.desktop(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteral(["\n bottom: -3rem;\n margin-left: -2rem;\n margin-right: -2rem;\n margin-bottom: -1.5rem;\n margin-top: 0.5rem;\n padding: 1.5rem 2rem;\n border-radius: 0 0 1rem 1rem;\n "]))), media.mobile(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteral(["\n bottom: -0.5rem;\n padding: 0.75rem 1.5rem;\n margin-bottom: -0.75rem;\n margin-left: -1.5rem;\n margin-right: -1.5rem;\n "]))), function (props) {
482
482
  return props.isSticky && "\n box-shadow: 0 0px 2px 0 rgba(0,0,0,0.1), 0 0px 5px 1px rgba(0,0,0,0.15);\n border-radius: 0;\n ";
483
483
  });
484
- }, media.max(370)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n ", " {\n min-width: unset;\n padding-left: 1rem;\n padding-right: 1rem;\n }\n "])), Button$1));
484
+ }, media.max(370)(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteral(["\n ", " {\n min-width: unset;\n padding-left: 1rem;\n padding-right: 1rem;\n }\n "])), Button$1));
485
485
  var FooterAuxiliaryContainer = styled.div.withConfig({
486
486
  displayName: "Dialog__FooterAuxiliaryContainer",
487
487
  componentId: "sc-gai4ey-6"
@@ -492,7 +492,7 @@ var FooterAuxiliaryContainer = styled.div.withConfig({
492
492
  var DialogContentWrapper = styled(LoadingDiv$1).withConfig({
493
493
  displayName: "Dialog__DialogContentWrapper",
494
494
  componentId: "sc-gai4ey-7"
495
- })(["padding:2rem;margin:-2rem;", ""], media.mobile(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n padding: 1.5rem;\n margin: -1.5rem;\n "]))));
495
+ })(["padding:2rem;margin:-2rem;", ""], media.mobile(_templateObject8$1 || (_templateObject8$1 = _taggedTemplateLiteral(["\n padding: 1.5rem;\n margin: -1.5rem;\n "]))));
496
496
  var DialogAlwaysVisibleDiv = styled.div.withConfig({
497
497
  displayName: "Dialog__DialogAlwaysVisibleDiv",
498
498
  componentId: "sc-gai4ey-8"
@@ -502,6 +502,7 @@ var DialogAlwaysVisibleDiv = styled.div.withConfig({
502
502
  var Dialog = styled(/*#__PURE__*/React.forwardRef(function (_ref, outerRef) {
503
503
  var className = _ref.className,
504
504
  skipWrap = _ref.skipWrap,
505
+ wrapChildren = _ref.wrapChildren,
505
506
  stickyFooter = _ref.stickyFooter;
506
507
  _ref.fixTitleMargin;
507
508
  var skipCloseIcon = _ref.skipCloseIcon,
@@ -515,11 +516,30 @@ var Dialog = styled(/*#__PURE__*/React.forwardRef(function (_ref, outerRef) {
515
516
  auxiliarActions = _ref.auxiliarActions,
516
517
  _ref$container = _ref.container,
517
518
  container = _ref$container === void 0 ? true : _ref$container,
519
+ onClose = _ref.onClose,
518
520
  props = _objectWithoutProperties(_ref, _excluded$h);
519
521
  var ref = useEnsureRef(outerRef);
520
522
  var _willUseIsSticky = willUseIsSticky$1(),
521
523
  _willUseIsSticky2 = _slicedToArray(_willUseIsSticky, 1),
522
524
  WithIsSticky = _willUseIsSticky2[0];
525
+ var handleClose = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
526
+ return _regeneratorRuntime.wrap(function _callee$(_context) {
527
+ while (1) switch (_context.prev = _context.next) {
528
+ case 0:
529
+ if (!onClose) {
530
+ _context.next = 3;
531
+ break;
532
+ }
533
+ _context.next = 3;
534
+ return onClose()["catch"](console.error);
535
+ case 3:
536
+ if (props.closeDialog) props.closeDialog();
537
+ case 4:
538
+ case "end":
539
+ return _context.stop();
540
+ }
541
+ }, _callee);
542
+ })), [onClose, props.closeDialog]);
523
543
  var alwaysVisible = function alwaysVisible(confirmCloseDialog) {
524
544
  return /*#__PURE__*/React.createElement(React.Fragment, null, props.closeDialog && !skipCloseIcon && /*#__PURE__*/React.createElement(CloseIcon$1, {
525
545
  className: "JS-dialog-close",
@@ -534,7 +554,7 @@ var Dialog = styled(/*#__PURE__*/React.forwardRef(function (_ref, outerRef) {
534
554
  }, callIfFunction(Content)), !Content && children && /*#__PURE__*/React.createElement(DialogContent, {
535
555
  icon: icon,
536
556
  illustration: illustration
537
- }, callIfFunction(children)), Content && children && callIfFunction(children), footer && /*#__PURE__*/React.createElement(WithIsSticky, {
557
+ }, wrapChildren ? wrapChildren(children) : callIfFunction(children)), Content && children && (wrapChildren ? wrapChildren(children) : callIfFunction(children)), footer && /*#__PURE__*/React.createElement(WithIsSticky, {
538
558
  bottom: true
539
559
  }, function (sentinel, isSticky) {
540
560
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DialogFooter, {
@@ -553,15 +573,16 @@ var Dialog = styled(/*#__PURE__*/React.forwardRef(function (_ref, outerRef) {
553
573
  return container ? /*#__PURE__*/React.createElement(DialogContainer$1, _extends({}, props, {
554
574
  DialogErrorContent: DialogErrorContent,
555
575
  ref: ref,
556
- title: title
557
- }), function (_ref2) {
558
- var confirmCloseDialog = _ref2.confirmCloseDialog;
576
+ title: title,
577
+ closeDialog: handleClose
578
+ }), function (_ref3) {
579
+ var confirmCloseDialog = _ref3.confirmCloseDialog;
559
580
  return dialog(confirmCloseDialog);
560
- }) : dialog(props.closeDialog);
581
+ }) : dialog(handleClose);
561
582
  })).withConfig({
562
583
  displayName: "Dialog",
563
584
  componentId: "sc-gai4ey-9"
564
- })(["@supports (position:sticky){will-change:transform,opacity;&.JS-wc-off{will-change:auto;}}border-radius:12px;padding:2rem;background-color:white;width:100%;max-width:45rem;margin:auto;position:relative;align-self:baseline;display:block;> h3:first-child{margin-top:0.5rem;}p{line-height:140%;}", " ", " ", ""], media.mobile(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n padding: 1.5rem 1.5rem 1.5rem;\n max-width: 100%;\n ", ";\n "])), function (props) {
585
+ })(["@supports (position:sticky){will-change:transform,opacity;&.JS-wc-off{will-change:auto;}}border-radius:18px;padding:2rem;background-color:white;width:100%;max-width:45rem;margin:auto;position:relative;align-self:baseline;display:block;> h3:first-child{margin-top:0.5rem;}p{line-height:140%;}", " ", " ", ""], media.mobile(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n padding: 1.5rem 1.5rem 1.5rem;\n max-width: 100%;\n ", ";\n "])), function (props) {
565
586
  return props.fullscreenOnMobile && "\n border-radius: 0;\n min-height: 100%;\n ";
566
587
  }), function (props) {
567
588
  return props.closeDialog && css(["", "{padding-right:2rem;}"], DialogTitle);
@@ -572,14 +593,37 @@ var ConfirmDialog = function ConfirmDialog(props) {
572
593
  }), props.children);
573
594
  };
574
595
  var DefaultConfirmDialog = function DefaultConfirmDialog(props) {
575
- return /*#__PURE__*/React.createElement(StartlibsConsumer, null, function (_ref3) {
576
- var confirmDialogLabels = _ref3.confirmDialogLabels;
596
+ return /*#__PURE__*/React.createElement(StartlibsConsumer, null, function (_ref4) {
597
+ var confirmDialogLabels = _ref4.confirmDialogLabels;
598
+ var handleCancel = /*#__PURE__*/function () {
599
+ var _ref5 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
600
+ return _regeneratorRuntime.wrap(function _callee2$(_context2) {
601
+ while (1) switch (_context2.prev = _context2.next) {
602
+ case 0:
603
+ if (props.onCancel) props.onCancel();
604
+ if (!props.onClose) {
605
+ _context2.next = 4;
606
+ break;
607
+ }
608
+ _context2.next = 4;
609
+ return props.onClose()["catch"](console.error);
610
+ case 4:
611
+ case "end":
612
+ return _context2.stop();
613
+ }
614
+ }, _callee2);
615
+ }));
616
+ return function handleCancel() {
617
+ return _ref5.apply(this, arguments);
618
+ };
619
+ }();
577
620
  return /*#__PURE__*/React.createElement(ConfirmDialog, {
578
621
  title: confirmDialogLabels.title,
579
- closeDialog: props.onCancel,
622
+ closeDialog: handleCancel,
623
+ onClose: props.onClose,
580
624
  onConfirm: props.onConfirm,
581
625
  footer: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button$1, {
582
- onClick: props.onCancel
626
+ onClick: handleCancel
583
627
  }, confirmDialogLabels.cancel), /*#__PURE__*/React.createElement(Button$1, {
584
628
  hover: "success",
585
629
  isLoading: props.isLoading,
@@ -592,37 +636,73 @@ var DefaultConfirmDialog = function DefaultConfirmDialog(props) {
592
636
  }, /*#__PURE__*/React.createElement("p", null, confirmDialogLabels.content));
593
637
  });
594
638
  };
595
- var DialogErrorContent = function DialogErrorContent(_ref4) {
596
- var closeDialog = _ref4.closeDialog;
597
- _ref4.title;
598
- return /*#__PURE__*/React.createElement(StartlibsConsumer, null, function (_ref5) {
599
- var _ref5$ErrorDialog = _ref5.ErrorDialog,
600
- title = _ref5$ErrorDialog.title,
601
- content = _ref5$ErrorDialog.content,
602
- close = _ref5$ErrorDialog.close;
639
+ var DialogErrorContent = function DialogErrorContent(_ref6) {
640
+ var closeDialog = _ref6.closeDialog,
641
+ onClose = _ref6.onClose;
642
+ _ref6.title;
643
+ var handleClose = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
644
+ return _regeneratorRuntime.wrap(function _callee3$(_context3) {
645
+ while (1) switch (_context3.prev = _context3.next) {
646
+ case 0:
647
+ if (!onClose) {
648
+ _context3.next = 3;
649
+ break;
650
+ }
651
+ _context3.next = 3;
652
+ return onClose()["catch"](console.error);
653
+ case 3:
654
+ if (closeDialog) closeDialog();
655
+ case 4:
656
+ case "end":
657
+ return _context3.stop();
658
+ }
659
+ }, _callee3);
660
+ })), [onClose, closeDialog]);
661
+ return /*#__PURE__*/React.createElement(StartlibsConsumer, null, function (_ref8) {
662
+ var _ref8$ErrorDialog = _ref8.ErrorDialog,
663
+ title = _ref8$ErrorDialog.title,
664
+ content = _ref8$ErrorDialog.content,
665
+ close = _ref8$ErrorDialog.close;
603
666
  return /*#__PURE__*/React.createElement(Dialog, {
604
667
  as: "div"
605
668
  }, closeDialog && /*#__PURE__*/React.createElement(CloseIcon$1, {
606
- onClick: closeDialog
669
+ onClick: handleClose
607
670
  }), title && /*#__PURE__*/React.createElement(DialogTitle, null, title), /*#__PURE__*/React.createElement(DialogContent, {
608
671
  icon: "warning"
609
672
  }, content), /*#__PURE__*/React.createElement(DialogFooter, null, /*#__PURE__*/React.createElement(Button$1, {
610
- onClick: closeDialog
673
+ onClick: handleClose
611
674
  }, close)));
612
675
  });
613
676
  };
614
- var DialogError = function DialogError(_ref6) {
615
- var closeDialog = _ref6.closeDialog;
616
- return /*#__PURE__*/React.createElement(StartlibsConsumer, null, function (_ref7) {
617
- var _ref7$ErrorDialog = _ref7.ErrorDialog,
618
- title = _ref7$ErrorDialog.title;
619
- _ref7$ErrorDialog.content;
620
- _ref7$ErrorDialog.close;
677
+ var DialogError = function DialogError(_ref9) {
678
+ var closeDialog = _ref9.closeDialog,
679
+ onClose = _ref9.onClose;
680
+ var handleClose = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
681
+ return _regeneratorRuntime.wrap(function _callee4$(_context4) {
682
+ while (1) switch (_context4.prev = _context4.next) {
683
+ case 0:
684
+ if (!onClose) {
685
+ _context4.next = 3;
686
+ break;
687
+ }
688
+ _context4.next = 3;
689
+ return onClose()["catch"](console.error);
690
+ case 3:
691
+ if (closeDialog) closeDialog();
692
+ case 4:
693
+ case "end":
694
+ return _context4.stop();
695
+ }
696
+ }, _callee4);
697
+ })), [onClose, closeDialog]);
698
+ return /*#__PURE__*/React.createElement(StartlibsConsumer, null, function (_ref11) {
699
+ var title = _ref11.ErrorDialog.title;
621
700
  return /*#__PURE__*/React.createElement(Dialog, {
622
- closeDialog: closeDialog,
701
+ closeDialog: handleClose,
623
702
  title: title
624
703
  }, /*#__PURE__*/React.createElement(DialogErrorContent, {
625
- closeDialog: closeDialog
704
+ closeDialog: handleClose,
705
+ onClose: onClose
626
706
  }));
627
707
  });
628
708
  };
@@ -795,22 +875,22 @@ var FlipNotification$1 = function FlipNotification(props) {
795
875
  }, props)));
796
876
  };
797
877
 
798
- var _templateObject$6, _templateObject2$5, _templateObject3$2, _templateObject4$1, _templateObject5, _templateObject6;
878
+ var _templateObject$6, _templateObject2$5, _templateObject3$3, _templateObject4$1, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
799
879
  function ownKeys$7(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
800
880
  function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
801
881
  var NotificationContainer$1 = styled.div.withConfig({
802
882
  displayName: "ToastNotifications__NotificationContainer",
803
883
  componentId: "sc-inycsj-0"
804
- })(["position:fixed;bottom:0;max-height:100%;z-index:999999;display:flex;flex-direction:column-reverse;align-items:flex-end;overflow-y:auto;right:1.5rem;::-webkit-scrollbar{width:21px;height:21px;}::-webkit-scrollbar-thumb{pointer-events:all;background:rgba(0,0,0,0.4);border-radius:100px;background-clip:padding-box;border:6px solid transparent;min-height:30px;min-width:30px;&:hover{background:rgba(0,0,0,0.5);background-clip:padding-box;border:6px solid transparent;}}::-webkit-scrollbar-corner{background:transparent;}", " ", ""], media.desktop(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteral(["\n &.JS-dialog-open {\n right: 2.75rem;\n }\n "]))), media.mobile(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteral(["\n left: 0.75rem;\n right: 0.75rem;\n "]))));
805
- var DefaultToast = styled.div.withConfig({
806
- displayName: "ToastNotifications__DefaultToast",
884
+ })(["position:fixed;bottom:0;max-height:100%;z-index:999999;display:flex;flex-direction:column-reverse;align-items:flex-end;overflow-y:auto;right:1.5rem;", " ", " ::-webkit-scrollbar{width:21px;height:21px;}::-webkit-scrollbar-thumb{pointer-events:all;background:rgba(0,0,0,0.4);border-radius:100px;background-clip:padding-box;border:6px solid transparent;min-height:30px;min-width:30px;&:hover{background:rgba(0,0,0,0.5);background-clip:padding-box;border:6px solid transparent;}}::-webkit-scrollbar-corner{background:transparent;}", " ", ""], media.desktop(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteral(["\n padding-bottom: 1.5rem;\n "]))), media.mobile(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteral(["\n padding-bottom: 0.75rem;\n "]))), media.desktop(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteral(["\n &.JS-dialog-open {\n right: 2.75rem;\n }\n "]))), media.mobile(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteral(["\n left: 0.75rem;\n right: 0.75rem;\n "]))));
885
+ var ToastBox = styled.div.withConfig({
886
+ displayName: "ToastNotifications__ToastBox",
807
887
  componentId: "sc-inycsj-1"
808
- })(["color:white;font-size:14px;font-weight:500;transition:0.4s opacity 1.5s;border-radius:10px;margin-top:0.5rem;overflow:hidden;flex-shrink:0;transition:0.3s background ease,0.4s opacity 1.5s;", " ", " ", ""], media.desktop(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteral(["\n background: ", ";\n max-width: 300px;\n :first-child {\n margin-bottom: 1.5rem;\n }\n "])), function (props) {
888
+ })(["color:white;font-size:14px;font-weight:500;border-radius:10px;flex-shrink:0;margin-top:0.5rem;overflow:hidden;transition:0.3s background ease,0.4s opacity 1.5s;", " ", " ", ""], media.desktop(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n background: ", ";\n max-width: 300px;\n "])), function (props) {
809
889
  return rgba(getColor(props.type)(props), ifUndefined(props.opacity, 0.7));
810
- }), media.mobile(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteral(["\n background: ", ";\n :first-child {\n margin-bottom: 0.75rem;\n }\n "])), function (props) {
890
+ }), media.mobile(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n background: ", ";\n "])), function (props) {
811
891
  return rgba(getColor(props.type)(props), ifUndefined(props.opacity, 0.8));
812
892
  }), function (props) {
813
- return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["background: ", ";"])), getColor(props.type));
893
+ return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["background: ", ";"])), getColor(props.type));
814
894
  });
815
895
  var NotificationTitleContainer = styled.div.withConfig({
816
896
  displayName: "ToastNotifications__NotificationTitleContainer",
@@ -825,12 +905,12 @@ var NotificationTitle = styled.div.withConfig({
825
905
  var NotificationContent = styled.div.withConfig({
826
906
  displayName: "ToastNotifications__NotificationContent",
827
907
  componentId: "sc-inycsj-4"
828
- })(["display:flex;align-items:center;text-align:left;padding:1rem 1.5rem;", ""], media.mobile(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n justify-content: center;\n "]))));
908
+ })(["display:flex;align-items:center;text-align:left;padding:1rem 1.5rem;", ""], media.mobile(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n justify-content: center;\n "]))));
829
909
  var NotificationIconWrapper = styled.div.withConfig({
830
910
  displayName: "ToastNotifications__NotificationIconWrapper",
831
911
  componentId: "sc-inycsj-5"
832
- })(["margin-right:1rem;position:relative;width:36px;text-align:center;flex-shrink:0;", "{font-size:40px;", "}"], Icon$1, function (props) {
833
- return props.isLoading && "\n font-size: 22px;\n ";
912
+ })(["margin-right:1rem;position:relative;width:36px;text-align:center;flex-shrink:0;", "{font-size:", "px;}"], Icon$1, function (props) {
913
+ return props.isLoading ? 22 : props.iconFontSize || 40;
834
914
  });
835
915
  var CloseIcon = styled(Icon$1).attrs({
836
916
  icon: 'x'
@@ -863,6 +943,7 @@ var createToastNotification = function createToastNotification(notification, tim
863
943
  var hasClosed = false;
864
944
  var close = function close() {
865
945
  clearTimeout(currentTimer);
946
+ if (hasClosed) return;
866
947
  setToastNotifications(_.differenceBy('uid', _, [{
867
948
  uid: uid
868
949
  }]));
@@ -893,7 +974,9 @@ var createToastNotification = function createToastNotification(notification, tim
893
974
  setToastNotifications(_.concat(notificationObj));
894
975
  } else {
895
976
  setToastNotifications(_.map(function (n) {
896
- return n.uid === uid ? notificationObj : n;
977
+ return n.uid === uid ? _objectSpread$7(_objectSpread$7({}, notificationObj), {}, {
978
+ _key: n._key
979
+ }) : n;
897
980
  }));
898
981
  }
899
982
  }
@@ -934,7 +1017,10 @@ var willShowToastNotification = function willShowToastNotification(str) {
934
1017
  return showToastNotification(str);
935
1018
  };
936
1019
  };
937
- var animation$2 = oneWayAnimation("transform: scale(1); transform-origin: center; opacity: 1;", "transform: scale(0); transform-origin: center; opacity: 0;");
1020
+ var EXIT_ANIMATION_MS = 300;
1021
+ var TOAST_EASING = 'cubic-bezier(0.22, 0.61, 0.36, 1)';
1022
+ var TOAST_TIMING = "".concat(EXIT_ANIMATION_MS, "ms ").concat(TOAST_EASING);
1023
+ var animation$2 = oneWayAnimation('transform: translateY(0); opacity: 1;', 'transform: translateY(0.25rem); opacity: 1;', 'transform: translateY(1rem); opacity: 0;');
938
1024
  var removeAnimationReinsertPosition = function removeAnimationReinsertPosition(e) {
939
1025
  return e.style.position = '';
940
1026
  };
@@ -943,51 +1029,91 @@ var ToastNotifications = function ToastNotifications() {
943
1029
  _useToastNotification2 = _slicedToArray(_useToastNotification, 2),
944
1030
  notifications = _useToastNotification2[0];
945
1031
  _useToastNotification2[1];
1032
+ var containerRef = useRef(null);
1033
+ var _useNotificationConta = useNotificationContainerWidthLock(containerRef),
1034
+ lockWidth = _useNotificationConta.lockWidth,
1035
+ unlockWidth = _useNotificationConta.unlockWidth;
946
1036
  return /*#__PURE__*/React.createElement(Fill, {
947
1037
  name: "Notifications"
948
1038
  }, /*#__PURE__*/React.createElement(NotificationContainer$1, {
1039
+ ref: containerRef,
949
1040
  className: "JS-on-open-dialog"
950
1041
  }, /*#__PURE__*/React.createElement(FlipList$1, {
951
1042
  animation: animation$2,
1043
+ timing: TOAST_TIMING,
952
1044
  onReinsert: removeAnimationReinsertPosition,
953
- skipParentMorph: true
1045
+ skipParentMorph: true,
1046
+ anchoredDownList: true
954
1047
  }, notifications.map(function (notification) {
955
- return callIfFunction(notification.element, notification.close) || /*#__PURE__*/React.createElement(DefaultToast, {
956
- id: "js-share-notification",
1048
+ var closeWithLock = function closeWithLock() {
1049
+ lockWidth();
1050
+ notification.close();
1051
+ setTimeout(unlockWidth, EXIT_ANIMATION_MS);
1052
+ };
1053
+ return callIfFunction(notification.element, closeWithLock) || /*#__PURE__*/React.createElement(ToastBox, {
1054
+ key: "toast-".concat(notification.uid),
957
1055
  type: notification.type,
958
1056
  onClick: notification.onClick,
959
- opacity: notification.opacity,
960
- key: notification.uid
1057
+ opacity: notification.opacity
961
1058
  }, notification.title ? /*#__PURE__*/React.createElement(NotificationTitleContainer, {
962
1059
  onClick: notification.onClickTitle ? function (e) {
963
- return notification.onClickTitle(e, notification.close);
1060
+ return notification.onClickTitle(e, closeWithLock);
964
1061
  } : undefined
965
1062
  }, /*#__PURE__*/React.createElement(NotificationTitle, null, notification.title), notification.closeOnX && /*#__PURE__*/React.createElement(CloseIcon, {
966
- onClick: constrainEvent(notification.close)
1063
+ onClick: constrainEvent(closeWithLock)
967
1064
  })) : notification.closeOnX && /*#__PURE__*/React.createElement(CloseIcon, {
968
- onClick: notification.close
1065
+ onClick: closeWithLock
969
1066
  }), /*#__PURE__*/React.createElement(SwitchDiv$1, {
970
1067
  on: notification._key
971
1068
  }, /*#__PURE__*/React.createElement(NotificationContent, null, notification.icon && /*#__PURE__*/React.createElement(NotificationIconWrapper, {
972
- isLoading: notification.isLoading
1069
+ isLoading: notification.isLoading,
1070
+ iconFontSize: notification.iconFontSize
973
1071
  }, /*#__PURE__*/React.createElement(Icon$1, {
974
1072
  icon: notification.icon
975
1073
  }), notification.isLoading && /*#__PURE__*/React.createElement(Loading$1, {
976
1074
  size: 36,
977
1075
  white: true,
978
1076
  absolute: true
979
- })), /*#__PURE__*/React.createElement(_StyledDiv, null, callIfFunction(notification.content, notification.close))), notification.details && /*#__PURE__*/React.createElement(NotificationDetails, {
1077
+ })), /*#__PURE__*/React.createElement(_StyledDiv, null, callIfFunction(notification.content, closeWithLock))), notification.details && /*#__PURE__*/React.createElement(NotificationDetails, {
980
1078
  onClick: constrainEvent()
981
1079
  }, notification.details)));
982
1080
  }))));
983
1081
  };
1082
+ var useNotificationContainerWidthLock = function useNotificationContainerWidthLock(containerRef) {
1083
+ var lockCountRef = useRef(0);
1084
+ var prevWidthRef = useRef(null);
1085
+ var lockWidth = function lockWidth() {
1086
+ var el = containerRef.current;
1087
+ if (!el) return;
1088
+ if (lockCountRef.current === 0) {
1089
+ prevWidthRef.current = el.style.width;
1090
+ var measured = el.getBoundingClientRect().width;
1091
+ el.style.width = measured + 'px';
1092
+ }
1093
+ lockCountRef.current = lockCountRef.current + 1;
1094
+ };
1095
+ var unlockWidth = function unlockWidth() {
1096
+ var el = containerRef.current;
1097
+ if (!el) return;
1098
+ var next = Math.max(0, lockCountRef.current - 1);
1099
+ lockCountRef.current = next;
1100
+ if (next === 0) {
1101
+ el.style.width = prevWidthRef.current || '';
1102
+ prevWidthRef.current = null;
1103
+ }
1104
+ };
1105
+ return {
1106
+ lockWidth: lockWidth,
1107
+ unlockWidth: unlockWidth
1108
+ };
1109
+ };
984
1110
  var _StyledDiv = styled("div").withConfig({
985
1111
  displayName: "ToastNotifications___StyledDiv",
986
1112
  componentId: "sc-inycsj-8"
987
1113
  })(["min-width:0;"]);
988
1114
 
989
1115
  var _excluded$f = ["content", "type", "marginTop"];
990
- var _templateObject$5, _templateObject2$4;
1116
+ var _templateObject$5, _templateObject2$4, _templateObject3$2;
991
1117
  function ownKeys$6(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
992
1118
  function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
993
1119
  var PersistentNotification = styled.div.withConfig({
@@ -1053,15 +1179,17 @@ var NotificationContainer = styled.div.withConfig({
1053
1179
  var Notification = styled.div.withConfig({
1054
1180
  displayName: "PersistentNotifications__Notification",
1055
1181
  componentId: "sc-1t7i0dh-6"
1056
- })(["background:", ";position:relative;border-radius:7px;"], function (props) {
1182
+ })(["background:", ";position:relative;border-radius:15px;"], function (props) {
1057
1183
  return transparentize(0.9, getColor(props.type)(props));
1058
1184
  });
1059
1185
  var NotificationWrapper = styled.div.withConfig({
1060
1186
  displayName: "PersistentNotifications__NotificationWrapper",
1061
1187
  componentId: "sc-1t7i0dh-7"
1062
- })(["background:white;margin-top:", ";margin-right:0.75rem;margin-left:0.75rem;padding:5px;border-radius:10px;box-shadow:0 0 10px 0 rgba(0,0,0,0.1),0 1px 2px 1px rgba(0,0,0,0.15);max-width:364px;", ""], function (props) {
1063
- return props.marginTop || "4.75rem";
1064
- }, printerMedia(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteral(["\n display: none;\n "]))));
1188
+ })(["background:white;margin-top:", ";margin-right:0.75rem;margin-left:0.75rem;padding:5px;border-radius:18px;box-shadow:0 0 10px 0 rgba(0,0,0,0.1),0 1px 2px 1px rgba(0,0,0,0.15);max-width:364px;", " ", ""], function (props) {
1189
+ return props.marginTop || "3.5rem";
1190
+ }, media.mobile(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteral(["\n margin-top: ", ";\n "])), function (props) {
1191
+ return props.marginTop || "4rem";
1192
+ }), printerMedia(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteral(["\n display: none;\n "]))));
1065
1193
  var _willUseSharedState3 = willUseSharedState(false),
1066
1194
  _willUseSharedState4 = _slicedToArray(_willUseSharedState3, 3),
1067
1195
  useIsHiddenPersistentNotifications = _willUseSharedState4[0],
@@ -1180,7 +1308,9 @@ function getPosition(origin, offset, max, originSize, selfSize, originalAlignmen
1180
1308
  }
1181
1309
  return collision < flippedCollision ? [newPosition, 'none'] : [flippedPosition[0], flippedPosition[1] === 'fit' ? 'flipfit' : 'flip'];
1182
1310
  } else {
1183
- return newPosition < upperBound ? [upperBound, 'fitted'] : [Math.max(upperBound, newPosition - collision), collision !== 0 ? 'fit' : 'none'];
1311
+ var minBound = respectingBounds ? upperBound : 0;
1312
+ var fittedPosition = Math.max(minBound, Math.min(newPosition, max - selfSize - lowerBound));
1313
+ return [fittedPosition, fittedPosition !== newPosition ? 'fit' : 'none'];
1184
1314
  }
1185
1315
  } else {
1186
1316
  return [newPosition, 'none'];
@@ -1226,7 +1356,8 @@ var usePositioning = function usePositioning(element, _ref, arrowRefOpt) {
1226
1356
  boundMargin = _ref$boundMargin === void 0 ? 6 : _ref$boundMargin,
1227
1357
  respectBounds = _ref.respectBounds,
1228
1358
  respectOffsetScroll = _ref.respectOffsetScroll,
1229
- on = _ref.on;
1359
+ on = _ref.on,
1360
+ placeholderAs = _ref.placeholderAs;
1230
1361
  var placeholder = useRef();
1231
1362
  var arrowRef = useEnsureRef(arrowRefOpt);
1232
1363
  var _useState = useState(),
@@ -1433,6 +1564,7 @@ var usePositioning = function usePositioning(element, _ref, arrowRefOpt) {
1433
1564
  ref: arrowRef
1434
1565
  });
1435
1566
  var placeholderElement = /*#__PURE__*/React.createElement(Placeholder, {
1567
+ as: placeholderAs,
1436
1568
  ref: placeholder
1437
1569
  });
1438
1570
  return [positionInfo, placeholderElement, arrowElement];
@@ -1643,6 +1775,7 @@ var DialogContainer = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
1643
1775
  animationEnterEffect = _ref.animationEnterEffect,
1644
1776
  skipKeys = _ref.skipKeys,
1645
1777
  fullscreenOnMobile = _ref.fullscreenOnMobile,
1778
+ fullscreen = _ref.fullscreen,
1646
1779
  _ref$confirmChanges = _ref.confirmChanges,
1647
1780
  confirmChanges = _ref$confirmChanges === void 0 ? true : _ref$confirmChanges,
1648
1781
  skipDom = _ref.skipDom,
@@ -1857,6 +1990,7 @@ var DialogContainer = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
1857
1990
  autoComplete: autoComplete,
1858
1991
  className: "JS-has-wc",
1859
1992
  withScroll: getSize() > 1,
1993
+ fullscreen: fullscreen,
1860
1994
  fullscreenOnMobile: fullscreenOnMobile,
1861
1995
  ref: modalScroll,
1862
1996
  as: usingForm ? 'form' : undefined,
@@ -2072,6 +2206,12 @@ var DroppableContainerComponent = /*#__PURE__*/function (_React$Component2) {
2072
2206
  startDroppable = _ref2.startDroppable,
2073
2207
  activeIndex = _ref2.activeIndex,
2074
2208
  activeDroppable = _ref2.activeDroppable;
2209
+ // Repositioning dereferences startDroppable.props further down. Rendering with an
2210
+ // activeDroppable but no startDroppable would take the whole tree down, so render
2211
+ // the list untouched instead and let the next commit reconcile it.
2212
+ if (!startDroppable) {
2213
+ return array;
2214
+ }
2075
2215
  if (activeDroppable && (activeDroppable === _this2 || startDroppable === _this2)) {
2076
2216
  // remove
2077
2217
  var removedOrInserted = _.pullAt(startDroppable === _this2 ? startIndex : [], array);
@@ -2170,6 +2310,13 @@ var DraggableContainer = /*#__PURE__*/function (_React$Component3) {
2170
2310
  holdTouchTimer
2171
2311
  }*/
2172
2312
  _this3.ghost = void 0;
2313
+ // dragEnd animates the ghost out over 300ms, so the tail of a drag is asynchronous
2314
+ // and a new drag can start before the previous one has finished. Each drag therefore
2315
+ // gets its own session holding everything its completion needs (ghost, dragInfo),
2316
+ // instead of reading the shared slots a newer drag may already have taken over.
2317
+ // dragToken identifies the drag that currently owns the shared state.
2318
+ _this3.dragToken = 0;
2319
+ _this3.activeSession = null;
2173
2320
  _this3.positions = {};
2174
2321
  _this3.passedResistance = false;
2175
2322
  _this3.pressedEnough = false;
@@ -2228,7 +2375,6 @@ var DraggableContainer = /*#__PURE__*/function (_React$Component3) {
2228
2375
  pageY = _ref4.pageY,
2229
2376
  clientX = _ref4.clientX,
2230
2377
  clientY = _ref4.clientY;
2231
- _this3.dragHasEnded = false;
2232
2378
  var currentTarget = e.currentTarget;
2233
2379
  if (shouldPreventDrag(e) || _this3.props.disabled) {
2234
2380
  return;
@@ -2319,6 +2465,18 @@ var DraggableContainer = /*#__PURE__*/function (_React$Component3) {
2319
2465
  _this3.ghostDimensions = ghostDimensions;
2320
2466
  parent.click(); // close popups
2321
2467
  _this3.ghost = el;
2468
+ // Open this drag's session and take ownership of the shared state. Any previous
2469
+ // session is now superseded: it still holds its own ghost and dragInfo, so it can
2470
+ // finish animating and clean itself up without touching anything below.
2471
+ _this3.dragToken++;
2472
+ _this3.activeSession = {
2473
+ token: _this3.dragToken,
2474
+ ghost: el,
2475
+ dragInfo: null,
2476
+ ended: false,
2477
+ endTimeout: null,
2478
+ onTransitionEnd: null
2479
+ };
2322
2480
  parent.appendChild(_this3.ghost);
2323
2481
  _disableWillChange(_this3.ghost);
2324
2482
  _this3.setState({
@@ -2419,59 +2577,89 @@ var DraggableContainer = /*#__PURE__*/function (_React$Component3) {
2419
2577
  }, 0);
2420
2578
  return centerInsideGhost[closestIndex];
2421
2579
  };
2422
- _this3.stopMoving = function () {
2423
- if (_this3.dragHasEnded) {
2580
+ _this3.stopMoving = function (session) {
2581
+ // Completion runs from mouseup, from a transitionend, or from the 300ms fallback
2582
+ // timer, so it can be reached more than once for the same drag.
2583
+ if (!session || session.ended) {
2424
2584
  return;
2425
2585
  }
2426
- _this3.dragHasEnded = true;
2427
- var dragInfo = _this3.state.dragInfo;
2428
- var activeIndex = dragInfo.activeIndex,
2429
- startIndex = dragInfo.startIndex,
2430
- activeGroup = dragInfo.activeGroup,
2431
- activeDroppable = dragInfo.activeDroppable,
2432
- startDroppable = dragInfo.startDroppable;
2433
- if (_this3.endTimeout) {
2434
- clearTimeout(_this3.endTimeout);
2435
- _this3.endTimeout = null;
2586
+ session.ended = true;
2587
+ var token = session.token,
2588
+ ghost = session.ghost,
2589
+ dragInfo = session.dragInfo;
2590
+ var _ref6 = dragInfo || {},
2591
+ activeIndex = _ref6.activeIndex,
2592
+ startIndex = _ref6.startIndex,
2593
+ activeGroup = _ref6.activeGroup,
2594
+ activeDroppable = _ref6.activeDroppable,
2595
+ startDroppable = _ref6.startDroppable;
2596
+ if (session.endTimeout) {
2597
+ clearTimeout(session.endTimeout);
2598
+ session.endTimeout = null;
2599
+ }
2600
+ if (ghost && session.onTransitionEnd) {
2601
+ ghost.removeEventListener('transitionend', session.onTransitionEnd);
2602
+ session.onTransitionEnd = null;
2603
+ }
2604
+
2605
+ // Everything below acts on this session's own ghost and dragInfo, so it stays
2606
+ // correct even once a newer drag has replaced this.ghost and this.state.dragInfo.
2607
+ var finish = function finish() {
2608
+ if (ghost !== null && ghost !== void 0 && ghost.parentNode) {
2609
+ _reenableWillChange(ghost);
2610
+ ghost.parentNode.removeChild(ghost);
2611
+ }
2612
+ if (activeIndex !== startIndex && activeIndex !== undefined || activeDroppable !== startDroppable && activeDroppable !== undefined) {
2613
+ var _startDroppable$props, _activeDroppable$prop;
2614
+ var promise = _this3.props.setItemOrder(startIndex, activeIndex, startDroppable === null || startDroppable === void 0 ? void 0 : (_startDroppable$props = startDroppable.props) === null || _startDroppable$props === void 0 ? void 0 : _startDroppable$props.id, activeDroppable === null || activeDroppable === void 0 ? void 0 : (_activeDroppable$prop = activeDroppable.props) === null || _activeDroppable$prop === void 0 ? void 0 : _activeDroppable$prop.id, activeGroup);
2615
+ if (promise && promise.then) {
2616
+ promise.then(function () {
2617
+ return _this3.clearChangedOrder(token);
2618
+ }, function () {
2619
+ return _this3.clearChangedOrder(token);
2620
+ });
2621
+ } else {
2622
+ _this3.clearChangedOrder(token);
2623
+ }
2624
+ } else {
2625
+ _this3.clearChangedOrder(token);
2626
+ }
2627
+ };
2628
+ if (token !== _this3.dragToken) {
2629
+ // Superseded: a newer drag owns the shared state and the render output. Drop
2630
+ // our ghost and commit our reorder, but leave that drag's state alone.
2631
+ finish();
2632
+ return;
2436
2633
  }
2437
2634
  _this3.setState({
2438
2635
  saving: {
2439
2636
  list: _this3.props.list,
2440
2637
  children: _this3.props.children,
2441
- dragInfo: _.set('active', false, dragInfo)
2638
+ dragInfo: _.set('active', false, dragInfo || {})
2442
2639
  }
2443
2640
  }, function () {
2444
- var _this3$ghost;
2445
2641
  _this3.preventScroll = false;
2446
2642
  _this3.props.setDragRef(null);
2447
2643
  _this3.settedDragRef = false;
2448
- if ((_this3$ghost = _this3.ghost) !== null && _this3$ghost !== void 0 && _this3$ghost.parentNode) {
2449
- _reenableWillChange(_this3.ghost);
2450
- _this3.ghost.parentNode.removeChild(_this3.ghost);
2451
- }
2452
- if (activeIndex !== startIndex && activeIndex !== undefined || activeDroppable !== startDroppable && activeDroppable !== undefined) {
2453
- var promise = _this3.props.setItemOrder(startIndex, activeIndex, startDroppable.props.id, activeDroppable.props.id, activeGroup);
2454
- if (promise && promise.then) {
2455
- promise.then(_this3.clearChangedOrder, _this3.clearChangedOrder);
2456
- } else {
2457
- _this3.clearChangedOrder();
2458
- }
2459
- } else {
2460
- _this3.clearChangedOrder();
2461
- }
2644
+ finish();
2462
2645
  });
2463
2646
  };
2464
- _this3.clearChangedOrder = function () {
2647
+ _this3.clearChangedOrder = function (token) {
2648
+ // Only the drag that still owns the shared state may reset it — a superseded
2649
+ // session clearing dragInfo here would wipe the drag currently in progress.
2650
+ if (token !== undefined && token !== _this3.dragToken) {
2651
+ return;
2652
+ }
2465
2653
  _this3.setState({
2466
2654
  dragInfo: {},
2467
2655
  saving: false
2468
2656
  });
2469
2657
  };
2470
- _this3.dragMove = function (e, _ref6) {
2471
- var pageX = _ref6.pageX,
2472
- pageY = _ref6.pageY,
2473
- clientX = _ref6.clientX,
2474
- clientY = _ref6.clientY;
2658
+ _this3.dragMove = function (e, _ref7) {
2659
+ var pageX = _ref7.pageX,
2660
+ pageY = _ref7.pageY,
2661
+ clientX = _ref7.clientX,
2662
+ clientY = _ref7.clientY;
2475
2663
  var distance = Math.sqrt(Math.pow(_this3.positions.originalX - pageX, 2) + Math.pow(_this3.positions.originalY - pageY, 2));
2476
2664
  if (e.type === 'mousemove') {
2477
2665
  // get touchstart and touchmove
@@ -2619,29 +2807,41 @@ var DraggableContainer = /*#__PURE__*/function (_React$Component3) {
2619
2807
  _this3.stopAutoScroll();
2620
2808
  _this3.props.setDragRef && _this3.props.setDragRef(null);
2621
2809
  clearTimeout(_this3.holdTouchTimer);
2622
- var _this3$state$dragInfo = _this3.state.dragInfo,
2623
- activeDroppable = _this3$state$dragInfo.activeDroppable,
2624
- activeIndex = _this3$state$dragInfo.activeIndex;
2625
- if (activeDroppable) {
2626
- var finalPosition = activeDroppable.getPosition(activeIndex, _this3.getScrollPosition());
2627
- var _window$getComputedSt = window.getComputedStyle(_this3.ghost),
2810
+ // Wired to mouseup, touchend, visibilitychange and blur, so this can fire several
2811
+ // times for one drag. Only the first call owns the session and completes it.
2812
+ var session = _this3.activeSession;
2813
+ if (!session) {
2814
+ return;
2815
+ }
2816
+ _this3.activeSession = null;
2817
+ session.dragInfo = _this3.state.dragInfo;
2818
+ var ghost = session.ghost;
2819
+ var _session$dragInfo = session.dragInfo,
2820
+ activeDroppable = _session$dragInfo.activeDroppable,
2821
+ activeIndex = _session$dragInfo.activeIndex;
2822
+ var finalPosition = activeDroppable && activeDroppable.getPosition(activeIndex, _this3.getScrollPosition());
2823
+ if (activeDroppable && ghost && finalPosition) {
2824
+ var _window$getComputedSt = window.getComputedStyle(ghost),
2628
2825
  marginTop = _window$getComputedSt.marginTop,
2629
2826
  marginLeft = _window$getComputedSt.marginLeft,
2630
2827
  left = _window$getComputedSt.left,
2631
2828
  top = _window$getComputedSt.top;
2632
2829
  var finalLeft = finalPosition.x - Math.max(1, finalPosition.width) / 2 - parseInt(left) - parseInt(marginLeft);
2633
2830
  var finalTop = finalPosition.y - Math.max(1, finalPosition.height) / 2 - parseInt(top) - parseInt(marginTop);
2634
- _this3.ghost.style.transition = "transform 300ms ease-in-out 0ms, opacity 300ms ease-in-out 0ms";
2831
+ ghost.style.transition = "transform 300ms ease-in-out 0ms, opacity 300ms ease-in-out 0ms";
2635
2832
  var newTransform = "translate(".concat(finalLeft, "px,").concat(finalTop, "px)");
2636
- if ((_this3.ghost.style.transform || "").replace(/\s/g, '') === newTransform) {
2637
- _this3.stopMoving();
2833
+ if ((ghost.style.transform || "").replace(/\s/g, '') === newTransform) {
2834
+ _this3.stopMoving(session);
2638
2835
  } else {
2639
- _this3.ghost.style.transform = newTransform;
2640
- _this3.ghost.addEventListener('transitionend', _this3.stopMoving);
2641
- _this3.endTimeout = setTimeout(_this3.stopMoving, 300);
2836
+ ghost.style.transform = newTransform;
2837
+ session.onTransitionEnd = function () {
2838
+ return _this3.stopMoving(session);
2839
+ };
2840
+ ghost.addEventListener('transitionend', session.onTransitionEnd);
2841
+ session.endTimeout = setTimeout(session.onTransitionEnd, 300);
2642
2842
  }
2643
2843
  } else {
2644
- _this3.stopMoving();
2844
+ _this3.stopMoving(session);
2645
2845
  }
2646
2846
  };
2647
2847
  _this3.addDroppable = function (el) {
@@ -2745,7 +2945,7 @@ var DraggableContainer = /*#__PURE__*/function (_React$Component3) {
2745
2945
 
2746
2946
  // type GhostDimensions = { offsetX: number, offsetY: number, width: number, height: number }
2747
2947
  DraggableContainer.defaultProps = {
2748
- holdTouchTimer: 300,
2948
+ holdTouchTimer: 500,
2749
2949
  scrollOnDrag: true,
2750
2950
  setDragRef: function setDragRef() {}
2751
2951
  };
@@ -2949,11 +3149,15 @@ var areComponentsEqual = function areComponentsEqual(a, b) {
2949
3149
  var ListItem = styled.li.withConfig({
2950
3150
  displayName: "ContextMenu__ListItem",
2951
3151
  componentId: "sc-13y1vvt-0"
2952
- })(["position:relative;font-size:13px;& > *{padding:11px 1.5rem 11px 3.5rem;display:block;}", " ", ",.icon{font-size:23px;position:absolute;padding-left:0.25rem;left:0;top:50%;transform:translateY(-50%);width:3.5rem;text-align:center;}", " & > a{color:inherit;font-weight:inherit;text-decoration:inherit;}& > a,& > label{cursor:pointer;}", " ", " input[type=\"radio\"]{display:none;}", " ", " ", " ", ""], function (props) {
3152
+ })(["position:relative;font-size:13px;& > *{padding:11px 1.5rem 11px 3.5rem;display:block;}", " ", ",.icon{font-size:", "px;position:absolute;padding-left:0.25rem;left:0;top:50%;transform:translateY(-50%);width:3.5rem;text-align:center;}", " & > a{color:inherit;font-weight:inherit;text-decoration:inherit;}& > a,& > label{cursor:pointer;}", " ", " input[type=\"radio\"]{display:none;}", " ", " ", " ", ""], function (props) {
2953
3153
  return props.hasSubmenu && "\n & > * {\n padding-right: 3rem;\n }\n ";
2954
- }, Icon$1, media.mobile(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n font-size: 14px;\n & > * {\n padding-top: 15px;\n padding-bottom: 15px;\n }\n ", ", .icon {\n font-size: 25px;\n }\n "])), Icon$1), ifProp('hover', css(["& > a,& > label{background:", ";color:", ";color:", ";}"], function (props) {
2955
- return lighten(0.53, getColor("main")(props));
2956
- }, getColor('main'), function (props) {
3154
+ }, Icon$1, function (props) {
3155
+ return props.iconSize || 23;
3156
+ }, media.mobile(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n font-size: 15px;\n & > * {\n padding-top: 15px;\n padding-bottom: 15px;\n }\n ", ", .icon {\n font-size: ", "px;\n }\n "])), Icon$1, function (props) {
3157
+ return (props.iconSize || 23) + 2;
3158
+ }), ifProp('hover', css(["& > a,& > label{background:", ";color:", ";}"], function (props) {
3159
+ return transparentize(0.88, getColor("main")(props));
3160
+ }, function (props) {
2957
3161
  return darken(0.03, getColor("main")(props));
2958
3162
  })), ifProp('highlight', css(["color:", ";"], getColor('main'))), ifProp('noActions', "\n max-width: 17rem;\n color: rgba(0,0,0,0.4);\n pointer-events: none;\n text-align: center;\n white-space: normal;\n "), ifProp('withButton', css(["padding:0.25rem 1rem;", "{width:100%;color:white;font-weight:500;padding:10px 1.25rem;", "}"], Button$1, media.mobile(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n padding: 13px 1.25rem;\n "]))))), ifProp('smallPaddingRight', css(["& > *{padding-right:1.5rem;}"])), customTheme('ListItem'));
2959
3163
  var ListItemDescText = styled.div.withConfig({
@@ -2971,7 +3175,7 @@ var ListMenu = styled.ul.withConfig({
2971
3175
  var ContextListMenu = styled(ListMenu).withConfig({
2972
3176
  displayName: "ContextMenu__ContextListMenu",
2973
3177
  componentId: "sc-13y1vvt-4"
2974
- })(["position:absolute;z-index:999;background-color:white;box-shadow:0 2px 2px 0 rgba(0,0,0,0.14),0 3px 10px -2px rgba(0,0,0,0.15),0 0px 2px 0px rgba(0,0,0,0.2);border-radius:10px;margin-bottom:0.5rem;overflow:auto;max-height:100vh;", " ", " ", ""], function (props) {
3178
+ })(["position:absolute;z-index:999;background-color:white;backdrop-filter:blur(15px);background-color:rgb(255 255 255 / 82%);box-shadow:0 2px 2px 0 rgba(0,0,0,0.14),0 3px 10px -2px rgba(0,0,0,0.15),0 0px 2px 0px rgba(0,0,0,0.2);border-radius:12px;margin-bottom:0.5rem;overflow:auto;max-height:100vh;max-height:100dvh;max-width:100vw;max-width:100dvw;", " ", " ", ""], function (props) {
2975
3179
  return props.withoutIcons && "\n ".concat(ListItem, " > * {\n padding-left: 1.5rem;\n }\n ");
2976
3180
  }, ifProp('sub', css(["", " ", ""], function (props) {
2977
3181
  return props.fullHeight ? '' : props.atTop ? 'margin-top: -0.5rem;' : 'margin-top: 0.5rem;';
@@ -2991,7 +3195,7 @@ var ListSeparator = styled.li.withConfig({
2991
3195
  var ListHeading = styled.li.withConfig({
2992
3196
  displayName: "ContextMenu__ListHeading",
2993
3197
  componentId: "sc-13y1vvt-7"
2994
- })(["display:flex;align-items:center;padding:.5rem 1.25rem .25rem;span{flex-shrink:0;margin-right:.5rem;color:", ";font-size:10px;text-transform:uppercase;font-weight:600;}:after{content:'';flex-grow:1;height:1px;background:", ";}"], getColor('gray180'), getColor('gray240'));
3198
+ })(["display:flex;align-items:center;padding:.5rem 1rem;color:rgba(0,0,0,0.4);font-size:12px;text-transform:uppercase;:after{content:'';flex-grow:1;margin-left:0.75rem;height:1px;background:rgba(0,0,0,0.15);}"]);
2995
3199
  var SubmenuArrowIcon = styledExtend(Icon$1)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n font-size: 13px;\n position: absolute;\n right: 0;\n top: 50%;\n transform: translateY(-50%);\n width: 3rem;\n text-align: center;\n"])));
2996
3200
  var SimpleLi = /*#__PURE__*/function (_React$Component) {
2997
3201
  function SimpleLi() {
@@ -3166,7 +3370,15 @@ var Li = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
3166
3370
  }
3167
3371
  } else {
3168
3372
  if (subMenu.isOpen) {
3169
- subMenu.closeAfter(200);
3373
+ if (hoverCursor === -1) {
3374
+ // Mouse saiu de todos os itens — provavelmente indo até o submenu (que
3375
+ // abre ao lado, com um pequeno gap). Janela generosa; ao alcançá-lo, o
3376
+ // onMouseEnter/onMouseMove do submenu chama subMenu.open e cancela.
3377
+ subMenu.closeAfter(450);
3378
+ } else {
3379
+ // Mouse foi para outro item do menu — mantém os 200ms originais.
3380
+ subMenu.closeAfter(200);
3381
+ }
3170
3382
  emitter.emit('preventSub', index);
3171
3383
  }
3172
3384
  }
@@ -3205,6 +3417,10 @@ var Li = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
3205
3417
  fixed: rest.fixedPosition,
3206
3418
  closing: subMenu.closing,
3207
3419
  onMouseMove: subMenu.open,
3420
+ // onMouseEnter não borbulha, então não é barrado pelo stopPropagation dos itens
3421
+ // do submenu (linha onMouseMove do Li). Garante que alcançar o submenu sempre
3422
+ // cancele o fechamento agendado por closeAfter(200), mantendo-o aberto.
3423
+ onMouseEnter: subMenu.open,
3208
3424
  onClose: onCloseSub,
3209
3425
  sub: true,
3210
3426
  slot: c.props.slot || menuSlot
@@ -3457,16 +3673,16 @@ var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
3457
3673
  }, {
3458
3674
  key: "componentDidCatch",
3459
3675
  value: function componentDidCatch(e, info) {
3460
- var error = e && e.stack;
3461
3676
  if (_.get([0], e) === 'login' && _.get([1, 'status'], e) === 401) {
3462
3677
  window.location = "/login";
3463
3678
  }
3464
3679
  if (e !== null && e !== void 0 && e.notFound) {
3465
3680
  return;
3466
3681
  }
3682
+ var error = e && e.stack;
3467
3683
  try {
3468
3684
  if (!e || !e.stack) {
3469
- JSON.stringify(e);
3685
+ error = JSON.stringify(e);
3470
3686
  }
3471
3687
  } catch (exception) {
3472
3688
  error = e.toString();
@@ -3474,7 +3690,10 @@ var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
3474
3690
  if (!/bot|spider|crawl/i.test(window.navigator.userAgent)) {
3475
3691
  postFetcher("/log/errorBoundary", {
3476
3692
  error: error,
3477
- info: info
3693
+ message: e === null || e === void 0 ? void 0 : e.message,
3694
+ name: e === null || e === void 0 ? void 0 : e.name,
3695
+ componentStack: info === null || info === void 0 ? void 0 : info.componentStack,
3696
+ url: window.location.href
3478
3697
  });
3479
3698
  }
3480
3699
  }
@@ -3531,7 +3750,7 @@ var LoadingBar = styled.div.withConfig({
3531
3750
  })(["width:100%;border-radius:0 1px 1px 0;height:4px;position:fixed;background:", ";transform:translateX(-100%);", " left:0;z-index:99999;box-shadow:", ";", " ", ""], function (props) {
3532
3751
  return props.bottom ? css(["", ""], getColor('main')) : "#84D359";
3533
3752
  }, function (props) {
3534
- return props.bottom ? "bottom:55px;" : "top: 0;";
3753
+ return props.bottom ? "bottom:69px;" : "top: 0;";
3535
3754
  }, function (props) {
3536
3755
  return props.bottom ? "0 0 1px 1px rgba(0,132,214,0.2);" : "0 0 2px 0 rgba(0,0,0,0.5);";
3537
3756
  }, function (props) {
@@ -3985,7 +4204,10 @@ var finishSwitchNew = function finishSwitchNew(clone, wrapper) {
3985
4204
  var newChildren = [].slice.call(wrapper.children);
3986
4205
  childMAp(newChildren, function (c) {
3987
4206
  if (c.dataset) {
3988
- c.style.opacity = c.dataset.prevOpacity || '';
4207
+ // Guard against stale "0" from a prior uncompleted cycle: always restore
4208
+ // to empty when prev is "0" since "0" is never a legitimate captured value.
4209
+ var prev = c.dataset.prevOpacity;
4210
+ c.style.opacity = prev && prev !== '0' ? prev : '';
3989
4211
  }
3990
4212
  });
3991
4213
  // wrapper.style.willChange = ''
@@ -4147,7 +4369,10 @@ var willPlaySwitch = function willPlaySwitch(oldSnap, newSnap, _ref7) {
4147
4369
  var resizeToNew = oneWayAnimation("\n overflow: hidden;\n width: ".concat(oldSnap.width, "px;\n height: ").concat(oldSnap.height, "px;\n "), "\n overflow: hidden;\n width: ".concat(newSnap.clonedNode.style.width, ";\n height: ").concat(callIfFunction(transformHeight, newSnap.clonedNode.style.height, realWrapperRect), ";\n "));
4148
4370
  childMAp(newChildren, function (c) {
4149
4371
  if (c.dataset && !c.dataset.noFlip) {
4150
- if (c.style.opacity) {
4372
+ // Don't capture "0" as prevOpacity — it's always a transient value from
4373
+ // a prior uncompleted willPlaySwitch. Otherwise finishSwitchNew restores
4374
+ // opacity to "0" permanently, leaving content invisible.
4375
+ if (c.style.opacity && c.style.opacity !== '0') {
4151
4376
  c.dataset.prevOpacity = c.style.opacity;
4152
4377
  }
4153
4378
  c.style.opacity = '0';
@@ -4566,7 +4791,9 @@ var FlipList = /*#__PURE__*/function (_React$Component) {
4566
4791
  height = _item$domNode$getBoun.height;
4567
4792
  item.domNode.style.left = item.domNode.offsetLeft + 'px';
4568
4793
  item.domNode.style.top = item.domNode.offsetTop - scrollDelta + 'px';
4569
- item.domNode.style.marginTop = 0;
4794
+ if (!_this.props.anchoredDownList) {
4795
+ item.domNode.style.marginTop = 0;
4796
+ }
4570
4797
  item.domNode.style.marginLeft = 0;
4571
4798
  item.domNode.style.width = width + 'px';
4572
4799
  item.domNode.style.height = height + 'px';
@@ -4587,15 +4814,16 @@ var FlipList = /*#__PURE__*/function (_React$Component) {
4587
4814
  parentRect: parentRect
4588
4815
  };
4589
4816
  };
4590
- _this.calculatePositionForAnimation = function () {
4817
+ _this.calculatePositionForAnimation = function (lockedParentRect) {
4591
4818
  var _this$getParents = _this.getParents(),
4592
4819
  parentRect = _this$getParents.parentRect,
4593
4820
  parentNode = _this$getParents.parentNode,
4594
4821
  offsetParent = _this$getParents.offsetParent;
4595
4822
  if (!offsetParent) return null;
4823
+ var effectiveParentRect = lockedParentRect || parentRect;
4596
4824
  var children = new Map();
4597
4825
  [].slice.call(parentNode.children).map(function (node) {
4598
- var position = toPosition$1(node, parentRect, {
4826
+ var position = toPosition$1(node, effectiveParentRect, {
4599
4827
  withMargins: true,
4600
4828
  numberOfSiblings: _this.props.numberOfElements || 1
4601
4829
  });
@@ -4608,6 +4836,7 @@ var FlipList = /*#__PURE__*/function (_React$Component) {
4608
4836
  parent: toPosition$1(offsetParent, undefined, {
4609
4837
  withMargins: true
4610
4838
  }),
4839
+ parentRect: effectiveParentRect,
4611
4840
  scrollTop: offsetParent.scrollTop
4612
4841
  };
4613
4842
  };
@@ -4618,7 +4847,8 @@ var FlipList = /*#__PURE__*/function (_React$Component) {
4618
4847
  key: "componentDidUpdate",
4619
4848
  value: function componentDidUpdate(prevProps, prevState, snap) {
4620
4849
  if (snap) {
4621
- var newSnap = this.calculatePositionForAnimation();
4850
+ var useLockedParentRect = this.props.anchoredDownList && snap.parentRect;
4851
+ var newSnap = this.calculatePositionForAnimation(useLockedParentRect ? snap.parentRect : undefined);
4622
4852
  if (newSnap) {
4623
4853
  // se não tiver parentNode, verficar se há uma div sendo offsetParent, body não serve
4624
4854
  this.play(snap, newSnap);
@@ -4942,7 +5172,7 @@ var Image = /*#__PURE__*/forwardRef(function (_ref, ref) {
4942
5172
  ref: ref
4943
5173
  })) : /*#__PURE__*/React.createElement("div", _extends({}, rest, {
4944
5174
  style: _objectSpread(_objectSpread({}, style), {}, {
4945
- backgroundImage: "url(\"".concat(image, "\")")
5175
+ backgroundImage: image && "url(\"".concat(image, "\")")
4946
5176
  }),
4947
5177
  ref: ref
4948
5178
  }));
@@ -4959,7 +5189,7 @@ var _templateObject, _templateObject2, _templateObject3;
4959
5189
  var SideMenu = styled.div.withConfig({
4960
5190
  displayName: "DialogWithSidebar__SideMenu",
4961
5191
  componentId: "sc-suvg9r-0"
4962
- })(["background-color:", ";border-top-left-radius:10px;border-bottom-left-radius:10px;width:19rem;flex-shrink:0;padding:1.25rem 0;", " ", ""], getColor('gray240'), function (props) {
5192
+ })(["background-color:", ";border-top-left-radius:18px;border-bottom-left-radius:18px;width:19rem;flex-shrink:0;padding:1.25rem 0;", " ", ""], getColor('gray240'), function (props) {
4963
5193
  return !props.visibleOnDesktop && 'display:none;';
4964
5194
  }, media.mobile(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display:block;\n position:fixed;\n top:0;\n left:0;\n bottom:0;\n z-index:1000;\n transition: 0.25s transform ease-out;\n background-color: ", ";\n box-shadow: -5px 0 20px 5px rgba(0,0,0,0.4);\n border-radius: 0;\n ", "\n "])), getColor('gray240'), function (props) {
4965
5195
  return !props.isOpen && "\n transform: translateX(-100%);\n box-shadow: none;\n ";
@@ -5092,7 +5322,7 @@ var _excluded = ["href"],
5092
5322
  var Link = function Link(_ref) {
5093
5323
  var href = _ref.href,
5094
5324
  props = _objectWithoutProperties(_ref, _excluded);
5095
- return props.to ? /*#__PURE__*/React.createElement(Wouter.Link, props) : /*#__PURE__*/React.createElement("a", _extends({}, props, {
5325
+ return _.isString(props.to) ? /*#__PURE__*/React.createElement(Wouter.Link, props) : /*#__PURE__*/React.createElement("a", _extends({}, props, {
5096
5326
  href: href === null || href === void 0 ? void 0 : href.replace("~", "")
5097
5327
  }));
5098
5328
  };
@@ -5191,4 +5421,9 @@ var useSearchParams = function useSearchParams(defaultParams) {
5191
5421
  };
5192
5422
  var Router = Wouter.Router;
5193
5423
 
5194
- export { AnimatedModal, AnimationBlockContainer, Button, CloseIcon$1 as CloseIcon, ConfirmDialog, ContextListMenu, ContextMenu, ContextMenuComponent, DefaultArrow, DefaultConfirmDialog, DefaultWarningDialog, Dialog, DialogContainer, DialogContent, DialogContentWrapper, DialogError, DialogErrorContent, DialogFooter, DialogIcon, DialogTabMenu, DialogTitle, DialogWithImageHeader, DialogWithSidebar, DialogWithSidebarPresentation, DraggableContainer, DraggableItem, DropdownIcon, DroppableContainer, ErrorBoundary, FillLastLineResizer, FlipList, FooterAuxiliaryContainer, FormatDate, HistoryLink, Icon, Image, Li, Link, ListHeading, ListItem, ListMenu, ListSeparator, Loading, LoadingBar, LoadingDiv, MENU_TAB, MobileBubbleDialog, Modal, ModalContainer, Navigate, Notifications, OnClickLoadingButton, PageLoader, PersistentNotification, PersistentNotificationActions, PersistentNotificationCloseIcon, PersistentNotificationContent, PersistentNotificationIcon, PersistentNotifications, Popup, Reposition, Route, Router, Routes, SideMenu, SimpleLi, SplitColumnsContainer, StickyContainer, SuspenseLoadingBar, SwitchDiv, TextButton, ToastNotifications, Tooltip, TransitionDiv, WarningDialog, WarningDialogIcon, WarningDialogTitle, addPositioningBound, contextMenuLayersQuantity, createToastNotification, defaultAnimationMaker, dialogFadeInDown, dialogModalIn, dialogModalOut, fixDoubledLastMarginBottom, formatAnimation, getClientRectAnimation, getDialogLayersSize, hidePersistentNotifications, isFakeScrolled, morph, openPersistentNotification, preventDialogPop, removeWindowScroll, setNotification, setWarningDialog, toPosition, useAbsoluteLocation, useAbsolutePath, useDialog, useDialogLayers, useDialogWithToggle, useFlip, useFlipAnimation, useFlipEnter, useFlipLeave, useIsHiddenPersistentNotifications, useLocation, useNavigate, useNotification, useNotificationRef, useParams, usePositioning, useSearchParams, useToastNotificationToggle, useWarningDialog, waitForPop, willSetNotification, willShowToastNotification, willUseFlip, willUseFlipSwitch, willUseIsSticky };
5424
+ var BasicBulletList = styled.ul.withConfig({
5425
+ displayName: "BasicBulletList",
5426
+ componentId: "sc-1u3hhup-0"
5427
+ })(["margin-bottom:0;font-size:13px;li{margin-top:4px;padding-left:1rem;position:relative;:before{content:'\u2022';font-size:17px;line-height:0;position:absolute;left:0;top:7px;}}"]);
5428
+
5429
+ export { AnimatedModal, AnimationBlockContainer, BasicBulletList, Button, CloseIcon$1 as CloseIcon, ConfirmDialog, ContextListMenu, ContextMenu, ContextMenuComponent, DefaultArrow, DefaultConfirmDialog, DefaultWarningDialog, Dialog, DialogContainer, DialogContent, DialogContentWrapper, DialogError, DialogErrorContent, DialogFooter, DialogIcon, DialogTabMenu, DialogTitle, DialogWithImageHeader, DialogWithSidebar, DialogWithSidebarPresentation, DraggableContainer, DraggableItem, DropdownIcon, DroppableContainer, ErrorBoundary, FillLastLineResizer, FlipList, FooterAuxiliaryContainer, FormatDate, HistoryLink, Icon, Image, Li, Link, ListHeading, ListItem, ListMenu, ListSeparator, Loading, LoadingBar, LoadingDiv, MENU_TAB, MobileBubbleDialog, Modal, ModalContainer, Navigate, Notifications, OnClickLoadingButton, PageLoader, PersistentNotification, PersistentNotificationActions, PersistentNotificationCloseIcon, PersistentNotificationContent, PersistentNotificationIcon, PersistentNotifications, Popup, Reposition, Route, Router, Routes, SideMenu, SimpleLi, SplitColumnsContainer, StickyContainer, SuspenseLoadingBar, SwitchDiv, TextButton, ToastNotifications, Tooltip, TransitionDiv, WarningDialog, WarningDialogIcon, WarningDialogTitle, addPositioningBound, contextMenuLayersQuantity, createToastNotification, defaultAnimationMaker, dialogFadeInDown, dialogModalIn, dialogModalOut, fixDoubledLastMarginBottom, formatAnimation, getClientRectAnimation, getDialogLayersSize, hidePersistentNotifications, isFakeScrolled, morph, openPersistentNotification, preventDialogPop, removeWindowScroll, setNotification, setWarningDialog, toPosition, useAbsoluteLocation, useAbsolutePath, useDialog, useDialogLayers, useDialogWithToggle, useFlip, useFlipAnimation, useFlipEnter, useFlipLeave, useIsHiddenPersistentNotifications, useLocation, useNavigate, useNotification, useNotificationRef, useParams, usePositioning, useSearchParams, useToastNotificationToggle, useWarningDialog, waitForPop, willSetNotification, willShowToastNotification, willUseFlip, willUseFlipSwitch, willUseIsSticky };