@deque/cauldron-react 6.4.2-canary.eaeac9f4 → 6.4.2-canary.eb0a056f
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.
|
@@ -35,6 +35,9 @@ export default class Dialog extends React.Component<DialogProps, DialogState> {
|
|
|
35
35
|
close(): void;
|
|
36
36
|
handleClickOutside(): void;
|
|
37
37
|
focusHeading(): void;
|
|
38
|
+
private handleEscape;
|
|
39
|
+
private attachEventListeners;
|
|
40
|
+
private removeEventListeners;
|
|
38
41
|
}
|
|
39
42
|
interface DialogAlignmentProps {
|
|
40
43
|
align?: 'left' | 'center' | 'right';
|
package/lib/index.js
CHANGED
|
@@ -1386,6 +1386,9 @@ var AriaIsolate = /** @class */ (function () {
|
|
|
1386
1386
|
return AriaIsolate;
|
|
1387
1387
|
}());
|
|
1388
1388
|
|
|
1389
|
+
var isEscape = function (event) {
|
|
1390
|
+
return event.key === 'Escape' || event.key === 'Esc' || event.keyCode === 27;
|
|
1391
|
+
};
|
|
1389
1392
|
var noop = function () {
|
|
1390
1393
|
//not empty
|
|
1391
1394
|
};
|
|
@@ -1397,24 +1400,29 @@ var Dialog = /** @class */ (function (_super) {
|
|
|
1397
1400
|
_this.close = _this.close.bind(_this);
|
|
1398
1401
|
_this.focusHeading = _this.focusHeading.bind(_this);
|
|
1399
1402
|
_this.handleClickOutside = _this.handleClickOutside.bind(_this);
|
|
1403
|
+
_this.handleEscape = _this.handleEscape.bind(_this);
|
|
1400
1404
|
_this.state = {};
|
|
1401
1405
|
return _this;
|
|
1402
1406
|
}
|
|
1403
1407
|
Dialog.prototype.componentDidMount = function () {
|
|
1404
1408
|
var _this = this;
|
|
1405
1409
|
if (this.props.show) {
|
|
1410
|
+
this.attachEventListeners();
|
|
1406
1411
|
this.attachIsolator(function () { return setTimeout(_this.focusHeading); });
|
|
1407
1412
|
}
|
|
1408
1413
|
};
|
|
1409
1414
|
Dialog.prototype.componentWillUnmount = function () {
|
|
1410
1415
|
var isolator = this.state.isolator;
|
|
1411
1416
|
isolator === null || isolator === void 0 ? void 0 : isolator.deactivate();
|
|
1417
|
+
this.removeEventListeners();
|
|
1412
1418
|
};
|
|
1413
1419
|
Dialog.prototype.componentDidUpdate = function (prevProps) {
|
|
1414
1420
|
if (!prevProps.show && this.props.show) {
|
|
1415
1421
|
this.attachIsolator(this.focusHeading);
|
|
1422
|
+
this.attachEventListeners();
|
|
1416
1423
|
}
|
|
1417
1424
|
else if (prevProps.show && !this.props.show) {
|
|
1425
|
+
this.removeEventListeners();
|
|
1418
1426
|
this.close();
|
|
1419
1427
|
}
|
|
1420
1428
|
};
|
|
@@ -1438,8 +1446,7 @@ var Dialog = /** @class */ (function (_super) {
|
|
|
1438
1446
|
: 2);
|
|
1439
1447
|
var Dialog = (React__default["default"].createElement(FocusTrap__default["default"], { focusTrapOptions: {
|
|
1440
1448
|
allowOutsideClick: true,
|
|
1441
|
-
|
|
1442
|
-
escapeDeactivates: !forceAction,
|
|
1449
|
+
escapeDeactivates: false,
|
|
1443
1450
|
fallbackFocus: '.Dialog__heading'
|
|
1444
1451
|
} },
|
|
1445
1452
|
React__default["default"].createElement(ClickOutsideListener, { onClickOutside: this.handleClickOutside },
|
|
@@ -1481,6 +1488,24 @@ var Dialog = /** @class */ (function (_super) {
|
|
|
1481
1488
|
}
|
|
1482
1489
|
(_a = this.state.isolator) === null || _a === void 0 ? void 0 : _a.activate();
|
|
1483
1490
|
};
|
|
1491
|
+
Dialog.prototype.handleEscape = function (keyboardEvent) {
|
|
1492
|
+
if (!keyboardEvent.defaultPrevented && isEscape(keyboardEvent)) {
|
|
1493
|
+
this.close();
|
|
1494
|
+
}
|
|
1495
|
+
};
|
|
1496
|
+
Dialog.prototype.attachEventListeners = function () {
|
|
1497
|
+
var forceAction = this.props.forceAction;
|
|
1498
|
+
if (!forceAction) {
|
|
1499
|
+
var portal = this.props.portal || document.body;
|
|
1500
|
+
var targetElement = portal instanceof HTMLElement ? portal : portal.current;
|
|
1501
|
+
targetElement === null || targetElement === void 0 ? void 0 : targetElement.addEventListener('keyup', this.handleEscape);
|
|
1502
|
+
}
|
|
1503
|
+
};
|
|
1504
|
+
Dialog.prototype.removeEventListeners = function () {
|
|
1505
|
+
var portal = this.props.portal || document.body;
|
|
1506
|
+
var targetElement = portal instanceof HTMLElement ? portal : portal.current;
|
|
1507
|
+
targetElement === null || targetElement === void 0 ? void 0 : targetElement.removeEventListener('keyup', this.handleEscape);
|
|
1508
|
+
};
|
|
1484
1509
|
Dialog.defaultProps = {
|
|
1485
1510
|
onClose: noop,
|
|
1486
1511
|
forceAction: false,
|
|
@@ -1733,6 +1758,7 @@ function Tooltip(_a) {
|
|
|
1733
1758
|
if (event.key === 'Escape' ||
|
|
1734
1759
|
event.key === 'Esc' ||
|
|
1735
1760
|
event.keyCode === 27) {
|
|
1761
|
+
event.preventDefault();
|
|
1736
1762
|
setShowTooltip(false);
|
|
1737
1763
|
}
|
|
1738
1764
|
};
|
|
@@ -2906,7 +2932,7 @@ var AddressCityStateZip = function (_a) {
|
|
|
2906
2932
|
AddressCityStateZip.displayName = 'AddressCityStateZip';
|
|
2907
2933
|
|
|
2908
2934
|
var Pagination = React__default["default"].forwardRef(function (_a, ref) {
|
|
2909
|
-
var totalItems = _a.totalItems, _b = _a.itemsPerPage, itemsPerPage = _b === void 0 ? 10 : _b, _c = _a.currentPage, currentPage = _c === void 0 ? 1 : _c, statusLabel = _a.statusLabel,
|
|
2935
|
+
var totalItems = _a.totalItems, _b = _a.itemsPerPage, itemsPerPage = _b === void 0 ? 10 : _b, _c = _a.currentPage, currentPage = _c === void 0 ? 1 : _c, _d = _a.hideStartEndPagination, hideStartEndPagination = _d === void 0 ? false : _d, statusLabel = _a.statusLabel, _e = _a.firstPageLabel, firstPageLabel = _e === void 0 ? 'First page' : _e, _f = _a.previousPageLabel, previousPageLabel = _f === void 0 ? 'Previous page' : _f, _g = _a.nextPageLabel, nextPageLabel = _g === void 0 ? 'Next page' : _g, _h = _a.lastPageLabel, lastPageLabel = _h === void 0 ? 'Last page' : _h, _j = _a.tooltipPlacement, tooltipPlacement = _j === void 0 ? 'bottom' : _j, onNextPageClick = _a.onNextPageClick, onPreviousPageClick = _a.onPreviousPageClick, onFirstPageClick = _a.onFirstPageClick, onLastPageClick = _a.onLastPageClick, className = _a.className, _k = _a.thin, thin = _k === void 0 ? false : _k, other = tslib.__rest(_a, ["totalItems", "itemsPerPage", "currentPage", "hideStartEndPagination", "statusLabel", "firstPageLabel", "previousPageLabel", "nextPageLabel", "lastPageLabel", "tooltipPlacement", "onNextPageClick", "onPreviousPageClick", "onFirstPageClick", "onLastPageClick", "className", "thin"]);
|
|
2910
2936
|
var itemStart = currentPage * itemsPerPage - itemsPerPage + 1;
|
|
2911
2937
|
var itemEnd = Math.min(itemStart + itemsPerPage - 1, totalItems);
|
|
2912
2938
|
var isLastPage = itemEnd === totalItems;
|
|
@@ -2915,8 +2941,8 @@ var Pagination = React__default["default"].forwardRef(function (_a, ref) {
|
|
|
2915
2941
|
'Pagination--thin': thin
|
|
2916
2942
|
}) }, other),
|
|
2917
2943
|
React__default["default"].createElement("ul", null,
|
|
2918
|
-
React__default["default"].createElement("li", null,
|
|
2919
|
-
React__default["default"].createElement(IconButton, { icon: "chevron-double-left", tooltipProps: { placement: tooltipPlacement }, label: firstPageLabel, "aria-disabled": isFirstPage, onClick: isFirstPage ? undefined : onFirstPageClick })),
|
|
2944
|
+
!hideStartEndPagination && (React__default["default"].createElement("li", null,
|
|
2945
|
+
React__default["default"].createElement(IconButton, { icon: "chevron-double-left", tooltipProps: { placement: tooltipPlacement }, label: firstPageLabel, "aria-disabled": isFirstPage, onClick: isFirstPage ? undefined : onFirstPageClick }))),
|
|
2920
2946
|
React__default["default"].createElement("li", null,
|
|
2921
2947
|
React__default["default"].createElement(IconButton, { icon: "chevron-left", tooltipProps: { placement: tooltipPlacement }, label: previousPageLabel, "aria-disabled": isFirstPage, onClick: isFirstPage ? undefined : onPreviousPageClick })),
|
|
2922
2948
|
React__default["default"].createElement("li", null,
|
|
@@ -2930,8 +2956,8 @@ var Pagination = React__default["default"].forwardRef(function (_a, ref) {
|
|
|
2930
2956
|
React__default["default"].createElement("strong", null, totalItems))))),
|
|
2931
2957
|
React__default["default"].createElement("li", null,
|
|
2932
2958
|
React__default["default"].createElement(IconButton, { icon: "chevron-right", tooltipProps: { placement: tooltipPlacement }, label: nextPageLabel, "aria-disabled": isLastPage, onClick: isLastPage ? undefined : onNextPageClick })),
|
|
2933
|
-
React__default["default"].createElement("li", null,
|
|
2934
|
-
React__default["default"].createElement(IconButton, { icon: "chevron-double-right", tooltipProps: { placement: tooltipPlacement }, label: lastPageLabel, "aria-disabled": isLastPage, onClick: isLastPage ? undefined : onLastPageClick })))));
|
|
2959
|
+
!hideStartEndPagination && (React__default["default"].createElement("li", null,
|
|
2960
|
+
React__default["default"].createElement(IconButton, { icon: "chevron-double-right", tooltipProps: { placement: tooltipPlacement }, label: lastPageLabel, "aria-disabled": isLastPage, onClick: isLastPage ? undefined : onLastPageClick }))))));
|
|
2935
2961
|
});
|
|
2936
2962
|
Pagination.displayName = 'Pagination';
|
|
2937
2963
|
|
package/package.json
CHANGED