@ebay/ui-core-react 6.2.2-rc.1 → 6.2.3
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.
Potentially problematic release.
This version of @ebay/ui-core-react might be problematic. Click here for more details.
- package/common/component-utils/array.polyfill.flat.js +13 -11
- package/common/component-utils/forwardRef.js +17 -4
- package/common/component-utils/usePrevious.js +3 -3
- package/common/component-utils/utils.js +26 -13
- package/common/debounce.js +7 -3
- package/common/event-utils/index.js +11 -8
- package/common/event-utils/use-key-press.js +12 -10
- package/common/event-utils/use-roving-index.js +24 -13
- package/common/floating-label-utils/hooks.js +53 -43
- package/common/notice-utils/notice-content.js +6 -5
- package/common/notice-utils/notice-cta.js +16 -5
- package/common/notice-utils/notice-footer.js +16 -5
- package/common/notice-utils/notice-title.js +17 -6
- package/common/random-id.js +1 -1
- package/common/range.js +4 -1
- package/common/tooltip-utils/tooltip-close-button.js +1 -1
- package/common/tooltip-utils/tooltip-content.js +28 -16
- package/common/tooltip-utils/tooltip-footer.js +6 -3
- package/common/tooltip-utils/tooltip-host.js +16 -5
- package/common/tooltip-utils/tooltip.d.ts +1 -1
- package/common/tooltip-utils/tooltip.js +26 -14
- package/common/tooltip-utils/use-tooltip.js +9 -8
- package/ebay-alert-dialog/alert-dialog.js +22 -11
- package/ebay-badge/badge.js +17 -6
- package/ebay-breadcrumbs/breadcrumb-item.js +18 -7
- package/ebay-breadcrumbs/breadcrumbs.js +30 -19
- package/ebay-button/button-cell.js +16 -5
- package/ebay-button/button-expand.d.ts +2 -4
- package/ebay-button/button-expand.d.ts.map +1 -1
- package/ebay-button/button-expand.js +10 -7
- package/ebay-button/button-loading.js +5 -5
- package/ebay-button/button-text.js +6 -3
- package/ebay-button/button.d.ts +1 -1
- package/ebay-button/button.js +43 -31
- package/ebay-calendar/calendar.js +111 -94
- package/ebay-calendar/date-utils.js +18 -9
- package/ebay-carousel/carousel-control-button.js +10 -9
- package/ebay-carousel/carousel-item.d.ts +1 -1
- package/ebay-carousel/carousel-item.js +25 -14
- package/ebay-carousel/carousel-list.js +22 -21
- package/ebay-carousel/carousel.js +44 -32
- package/ebay-carousel/helpers.js +47 -35
- package/ebay-carousel/scroll-to-transition.js +15 -15
- package/ebay-checkbox/checkbox.js +32 -21
- package/ebay-confirm-dialog/confirm-dialog.js +22 -11
- package/ebay-cta-button/cta-button.d.ts +1 -1
- package/ebay-cta-button/cta-button.js +20 -9
- package/ebay-date-textbox/date-textbox.js +53 -37
- package/ebay-dialog-base/components/animation.d.ts +1 -0
- package/ebay-dialog-base/components/animation.d.ts.map +1 -1
- package/ebay-dialog-base/components/animation.js +28 -25
- package/ebay-dialog-base/components/dialog-actions.js +5 -2
- package/ebay-dialog-base/components/dialog-close-button.d.ts +2 -5
- package/ebay-dialog-base/components/dialog-close-button.d.ts.map +1 -1
- package/ebay-dialog-base/components/dialog-close-button.js +5 -2
- package/ebay-dialog-base/components/dialog-footer.js +5 -2
- package/ebay-dialog-base/components/dialog-header.js +15 -4
- package/ebay-dialog-base/components/dialog-previous-button.js +17 -6
- package/ebay-dialog-base/components/dialogBase.js +51 -40
- package/ebay-dialog-base/dialog-base-with-state.js +35 -22
- package/ebay-drawer-dialog/components/drawer.js +50 -27
- package/ebay-eek/eek-rating.js +10 -8
- package/ebay-eek/eek-util.d.ts +1 -1
- package/ebay-eek/eek-util.d.ts.map +1 -1
- package/ebay-eek/eek-util.js +6 -7
- package/ebay-fake-menu/menu-item-separator.js +16 -5
- package/ebay-fake-menu/menu-item.js +26 -15
- package/ebay-fake-menu/menu.js +22 -11
- package/ebay-fake-menu-button/menu-button-item.js +2 -2
- package/ebay-fake-menu-button/menu-button-label.d.ts +2 -4
- package/ebay-fake-menu-button/menu-button-label.d.ts.map +1 -1
- package/ebay-fake-menu-button/menu-button-label.js +5 -2
- package/ebay-fake-menu-button/menu-button-separator.js +16 -5
- package/ebay-fake-menu-button/menu-button.js +45 -32
- package/ebay-fake-tabs/fake-tabs.js +23 -10
- package/ebay-fake-tabs/tab.js +16 -5
- package/ebay-field/description.js +19 -7
- package/ebay-field/field.js +5 -4
- package/ebay-field/label.js +18 -7
- package/ebay-fullscreen-dialog/fullscreen-dialog.js +18 -7
- package/ebay-icon/icon.d.ts +1 -1
- package/ebay-icon/icon.js +29 -17
- package/ebay-icon-button/icon-button.d.ts +1 -1
- package/ebay-icon-button/icon-button.js +27 -15
- package/ebay-infotip/ebay-infotip-content.js +5 -2
- package/ebay-infotip/ebay-infotip-heading.js +16 -5
- package/ebay-infotip/ebay-infotip-host.d.ts +2 -2
- package/ebay-infotip/ebay-infotip-host.d.ts.map +1 -1
- package/ebay-infotip/ebay-infotip-host.js +24 -10
- package/ebay-infotip/ebay-infotip.d.ts.map +1 -1
- package/ebay-infotip/ebay-infotip.js +34 -23
- package/ebay-inline-notice/inline-notice.js +27 -15
- package/ebay-lightbox-dialog/lightbox-dialog.js +21 -9
- package/ebay-listbox-button/listbox-button-option.js +18 -7
- package/ebay-listbox-button/listbox-button.d.ts.map +1 -1
- package/ebay-listbox-button/listbox-button.js +100 -79
- package/ebay-menu/menu-item-separator.js +16 -5
- package/ebay-menu/menu-item.js +23 -12
- package/ebay-menu/menu.d.ts +1 -1
- package/ebay-menu/menu.js +64 -37
- package/ebay-menu-button/README.md +1 -1
- package/ebay-menu-button/menu-button-item.js +1 -1
- package/ebay-menu-button/menu-button-label.d.ts +2 -4
- package/ebay-menu-button/menu-button-label.d.ts.map +1 -1
- package/ebay-menu-button/menu-button-label.js +5 -2
- package/ebay-menu-button/menu-button-separator.js +16 -5
- package/ebay-menu-button/menu-button.js +60 -46
- package/ebay-notice-base/components/ebay-notice-content/notice-content.js +1 -1
- package/ebay-notice-base/components/ebay-notice-title/notice-title.d.ts +2 -5
- package/ebay-notice-base/components/ebay-notice-title/notice-title.d.ts.map +1 -1
- package/ebay-notice-base/components/ebay-notice-title/notice-title.js +5 -2
- package/ebay-page-notice/page-notice-cta.js +6 -3
- package/ebay-page-notice/page-notice-footer.js +6 -3
- package/ebay-page-notice/page-notice-title.js +16 -5
- package/ebay-page-notice/page-notice.js +27 -16
- package/ebay-pagination/helpers.js +24 -21
- package/ebay-pagination/pagination-item.d.ts +1 -1
- package/ebay-pagination/pagination-item.js +27 -16
- package/ebay-pagination/pagination.js +81 -52
- package/ebay-panel-dialog/panel-dialog.js +21 -9
- package/ebay-progress-bar/progress-bar.js +16 -5
- package/ebay-progress-spinner/progress-spinner.js +18 -7
- package/ebay-progress-stepper/ebay-progress-step.js +25 -14
- package/ebay-progress-stepper/ebay-progress-stepper.js +21 -10
- package/ebay-progress-stepper/ebay-progress-title.js +5 -2
- package/ebay-radio/radio.js +29 -18
- package/ebay-section-notice/section-notice-footer.js +6 -3
- package/ebay-section-notice/section-notice-title.js +16 -5
- package/ebay-section-notice/section-notice.js +39 -24
- package/ebay-section-title/cta.js +16 -5
- package/ebay-section-title/info.js +16 -5
- package/ebay-section-title/overflow.js +16 -5
- package/ebay-section-title/section-title.js +24 -13
- package/ebay-section-title/subtitle.js +16 -5
- package/ebay-section-title/title.js +16 -5
- package/ebay-select/ebay-select-option.js +15 -4
- package/ebay-select/ebay-select.d.ts +1 -1
- package/ebay-select/ebay-select.js +45 -34
- package/ebay-signal/signal.js +17 -6
- package/ebay-snackbar-dialog/components/ebay-snackbar-dialog-action.js +16 -5
- package/ebay-snackbar-dialog/components/ebay-snackbar-dialog.js +38 -27
- package/ebay-split-button/split-button.js +21 -10
- package/ebay-star-rating/star-rating.js +19 -8
- package/ebay-star-rating-select/star-rating-select.js +31 -20
- package/ebay-svg/svg.js +3 -3
- package/ebay-switch/ebay-switch.js +21 -10
- package/ebay-tabs/tab-panel.js +16 -5
- package/ebay-tabs/tab.js +16 -5
- package/ebay-tabs/tabs.js +40 -26
- package/ebay-textbox/postfix-icon.js +18 -7
- package/ebay-textbox/prefix-icon.js +16 -5
- package/ebay-textbox/textbox.d.ts +1 -1
- package/ebay-textbox/textbox.js +53 -42
- package/ebay-toast-dialog/components/toast.js +17 -6
- package/ebay-tooltip/ebay-tooltip-content.js +1 -1
- package/ebay-tooltip/ebay-tooltip-host.js +1 -1
- package/ebay-tooltip/ebay-tooltip.js +32 -21
- package/ebay-tourtip/ebay-tourtip-content.js +1 -1
- package/ebay-tourtip/ebay-tourtip-footer.js +7 -4
- package/ebay-tourtip/ebay-tourtip-heading.js +17 -6
- package/ebay-tourtip/ebay-tourtip-host.js +1 -1
- package/ebay-tourtip/ebay-tourtip.js +33 -22
- package/ebay-video/controls.d.ts.map +1 -1
- package/ebay-video/controls.js +46 -23
- package/ebay-video/reportButton.d.ts +2 -7
- package/ebay-video/reportButton.d.ts.map +1 -1
- package/ebay-video/reportButton.js +8 -5
- package/ebay-video/source.js +14 -3
- package/ebay-video/video.d.ts.map +1 -1
- package/ebay-video/video.js +80 -54
- package/package.json +19 -23
|
@@ -1,4 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
2
13
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
14
|
if (k2 === undefined) k2 = k;
|
|
4
15
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -37,33 +48,37 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
37
48
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
49
|
};
|
|
39
50
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
var
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
51
|
+
var react_1 = __importStar(require("react"));
|
|
52
|
+
var makeup_expander_1 = __importDefault(require("makeup-expander"));
|
|
53
|
+
var calendar_1 = __importDefault(require("../ebay-calendar/calendar"));
|
|
54
|
+
var ebay_textbox_1 = require("../ebay-textbox");
|
|
55
|
+
var date_utils_1 = require("../ebay-calendar/date-utils");
|
|
56
|
+
var textbox_1 = require("../ebay-textbox/textbox");
|
|
57
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
58
|
+
var MIN_WIDTH_FOR_DOUBLE_PANE = 600;
|
|
59
|
+
var EbayDateTextbox = function (_a) {
|
|
60
|
+
var className = _a.className, _b = _a.inputPlaceholderText, inputPlaceholderText = _b === void 0 ? 'YYYY-MM-DD' : _b, _c = _a.a11yOpenPopoverText, a11yOpenPopoverText = _c === void 0 ? 'open calendar' : _c, range = _a.range, controlledValue = _a.value, controlledRangeEnd = _a.rangeEnd, defaultValue = _a.defaultValue, defaultRangeEnd = _a.defaultRangeEnd, collapseOnSelect = _a.collapseOnSelect, _d = _a.onChange, onChange = _d === void 0 ? function () { } : _d, _e = _a.onInputChange, onInputChange = _e === void 0 ? function () { } : _e, _f = _a.onInputRangeEndChange, onInputRangeEndChange = _f === void 0 ? function () { } : _f, rest = __rest(_a, ["className", "inputPlaceholderText", "a11yOpenPopoverText", "range", "value", "rangeEnd", "defaultValue", "defaultRangeEnd", "collapseOnSelect", "onChange", "onInputChange", "onInputRangeEndChange"]);
|
|
61
|
+
var expander = (0, react_1.useRef)();
|
|
62
|
+
var containerRef = (0, react_1.useRef)(null);
|
|
63
|
+
var _g = (0, react_1.useState)(defaultValue || ''), internalValue = _g[0], setInternalValue = _g[1];
|
|
64
|
+
var _h = (0, react_1.useState)(defaultRangeEnd || ''), internalRangeEnd = _h[0], setInternalRangeEnd = _h[1];
|
|
65
|
+
var valueToRender = (0, textbox_1.isControlled)(controlledValue) ? controlledValue : internalValue;
|
|
66
|
+
var rangeEndToRender = (0, textbox_1.isControlled)(controlledRangeEnd) ? controlledRangeEnd : internalRangeEnd;
|
|
67
|
+
var _j = (0, react_1.useState)(function () {
|
|
68
|
+
return (0, date_utils_1.dateArgToISO)(valueToRender);
|
|
69
|
+
}), firstSelected = _j[0], setFirstSelected = _j[1];
|
|
70
|
+
var _k = (0, react_1.useState)(function () {
|
|
71
|
+
return (0, date_utils_1.dateArgToISO)(rangeEndToRender);
|
|
72
|
+
}), secondSelected = _k[0], setSecondSelected = _k[1];
|
|
73
|
+
var _l = (0, react_1.useState)(false), isPopoverOpen = _l[0], setIsPopoverOpen = _l[1];
|
|
74
|
+
var _m = (0, react_1.useState)(1), numMonths = _m[0], setNumMonths = _m[1];
|
|
75
|
+
var openPopover = function () {
|
|
61
76
|
setIsPopoverOpen(true);
|
|
62
77
|
};
|
|
63
|
-
|
|
78
|
+
var closePopover = function () {
|
|
64
79
|
setIsPopoverOpen(false);
|
|
65
80
|
};
|
|
66
|
-
(0, react_1.useEffect)(()
|
|
81
|
+
(0, react_1.useEffect)(function () {
|
|
67
82
|
if (!containerRef.current) {
|
|
68
83
|
return;
|
|
69
84
|
}
|
|
@@ -75,20 +90,20 @@ const EbayDateTextbox = (_a) => {
|
|
|
75
90
|
});
|
|
76
91
|
containerRef.current.addEventListener('expander-expand', openPopover);
|
|
77
92
|
containerRef.current.addEventListener('expander-collapse', closePopover);
|
|
78
|
-
|
|
93
|
+
var calculateNumMonths = function () {
|
|
79
94
|
setNumMonths(document.documentElement.clientWidth < MIN_WIDTH_FOR_DOUBLE_PANE ? 1 : 2);
|
|
80
95
|
};
|
|
81
96
|
calculateNumMonths();
|
|
82
97
|
window.addEventListener('resize', calculateNumMonths);
|
|
83
|
-
return ()
|
|
98
|
+
return function () {
|
|
84
99
|
var _a;
|
|
85
100
|
(_a = expander.current) === null || _a === void 0 ? void 0 : _a.destroy();
|
|
86
101
|
window.removeEventListener('resize', calculateNumMonths);
|
|
87
102
|
};
|
|
88
103
|
}, []);
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
104
|
+
var handleInputChange = function (event, index) {
|
|
105
|
+
var date = new Date(event.target.value);
|
|
106
|
+
var iso = isNaN(date.getTime()) ? null : (0, date_utils_1.toISO)(date);
|
|
92
107
|
if (index === 0) {
|
|
93
108
|
setFirstSelected(iso);
|
|
94
109
|
setInternalValue(iso || '');
|
|
@@ -109,12 +124,13 @@ const EbayDateTextbox = (_a) => {
|
|
|
109
124
|
});
|
|
110
125
|
}
|
|
111
126
|
};
|
|
112
|
-
|
|
127
|
+
var handlePopoverSelect = function (event, _a) {
|
|
128
|
+
var iso = _a.iso;
|
|
113
129
|
setFirstSelected(iso);
|
|
114
130
|
setInternalValue(iso);
|
|
115
131
|
if (range) {
|
|
116
|
-
|
|
117
|
-
|
|
132
|
+
var selected = firstSelected || secondSelected;
|
|
133
|
+
var eventData = {
|
|
118
134
|
rangeStart: iso,
|
|
119
135
|
rangeEnd: selected
|
|
120
136
|
};
|
|
@@ -154,7 +170,7 @@ const EbayDateTextbox = (_a) => {
|
|
|
154
170
|
expander.current.expanded = false;
|
|
155
171
|
}
|
|
156
172
|
};
|
|
157
|
-
|
|
173
|
+
var handleInternalChange = function (event, index) {
|
|
158
174
|
if (index === 0) {
|
|
159
175
|
setInternalValue(event.target.value);
|
|
160
176
|
onInputChange(event);
|
|
@@ -164,15 +180,15 @@ const EbayDateTextbox = (_a) => {
|
|
|
164
180
|
onInputRangeEndChange(event);
|
|
165
181
|
}
|
|
166
182
|
};
|
|
167
|
-
|
|
183
|
+
var _o = Array.isArray(inputPlaceholderText)
|
|
168
184
|
? inputPlaceholderText
|
|
169
|
-
: [inputPlaceholderText, inputPlaceholderText];
|
|
185
|
+
: [inputPlaceholderText, inputPlaceholderText], rangeStartPlaceholder = _o[0], mainPlaceholder = _o[1];
|
|
170
186
|
return (react_1.default.createElement("span", { className: (0, classnames_1.default)('date-textbox', className), ref: containerRef },
|
|
171
|
-
range && (react_1.default.createElement(ebay_textbox_1.EbayTextbox, { value: valueToRender, placeholder: rangeStartPlaceholder, onInputChange: (event)
|
|
172
|
-
react_1.default.createElement(ebay_textbox_1.EbayTextbox, { className: "ebay-date-textbox--main", placeholder: mainPlaceholder, value: range ? rangeEndToRender : valueToRender, onInputChange: (event)
|
|
187
|
+
range && (react_1.default.createElement(ebay_textbox_1.EbayTextbox, { value: valueToRender, placeholder: rangeStartPlaceholder, onInputChange: function (event) { return handleInternalChange(event, 0); }, onBlur: function (event) { return handleInputChange(event, 0); } })),
|
|
188
|
+
react_1.default.createElement(ebay_textbox_1.EbayTextbox, { className: "ebay-date-textbox--main", placeholder: mainPlaceholder, value: range ? rangeEndToRender : valueToRender, onInputChange: function (event) { return handleInternalChange(event, range ? 1 : 0); }, onBlur: function (event) { return handleInputChange(event, range ? 1 : 0); } },
|
|
173
189
|
react_1.default.createElement(ebay_textbox_1.EbayTextboxPostfixIcon, { name: "calendar24", buttonAriaLabel: a11yOpenPopoverText })),
|
|
174
190
|
react_1.default.createElement("div", { hidden: !isPopoverOpen, className: "date-textbox__popover" },
|
|
175
|
-
react_1.default.createElement(calendar_1.default,
|
|
191
|
+
react_1.default.createElement(calendar_1.default, __assign({}, rest, { range: range, interactive: true, navigable: true, numMonths: numMonths, selected: firstSelected && secondSelected
|
|
176
192
|
? [firstSelected, secondSelected]
|
|
177
193
|
: firstSelected || secondSelected || undefined, onSelect: handlePopoverSelect })))));
|
|
178
194
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"animation.d.ts","sourceRoot":"","sources":["../../../src/ebay-dialog-base/components/animation.ts"],"names":[],"mappings":"AAWA,UAAU,wBAAwB;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACxC,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,MAAM,IAAI,CAAA;CAC9B;AAED,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,MAAM,CAAC;AAElD,wBAAgB,kBAAkB,CAAC,EAC/B,IAAI,EACJ,WAAW,EACX,iBAAiB,EACjB,SAAS,EACT,eAAe,EACf,OAAO,EACP,eAAe,EAClB,EAAE,wBAAwB,GAAG,IAAI,CA0CjC"}
|
|
1
|
+
{"version":3,"file":"animation.d.ts","sourceRoot":"","sources":["../../../src/ebay-dialog-base/components/animation.ts"],"names":[],"mappings":";AAWA,UAAU,wBAAwB;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACxC,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,MAAM,IAAI,CAAA;CAC9B;AAED,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,MAAM,CAAC;AAElD,wBAAgB,kBAAkB,CAAC,EAC/B,IAAI,EACJ,WAAW,EACX,iBAAiB,EACjB,SAAS,EACT,eAAe,EACf,OAAO,EACP,eAAe,EAClB,EAAE,wBAAwB,GAAG,IAAI,CA0CjC"}
|
|
@@ -1,39 +1,40 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useDialogAnimation = void 0;
|
|
4
|
-
|
|
5
|
-
function useDialogAnimation(
|
|
6
|
-
|
|
7
|
-
(0, react_1.
|
|
4
|
+
var react_1 = require("react");
|
|
5
|
+
function useDialogAnimation(_a) {
|
|
6
|
+
var open = _a.open, classPrefix = _a.classPrefix, transitionElement = _a.transitionElement, dialogRef = _a.dialogRef, dialogWindowRef = _a.dialogWindowRef, enabled = _a.enabled, onTransitionEnd = _a.onTransitionEnd;
|
|
7
|
+
var firstRender = (0, react_1.useRef)(true);
|
|
8
|
+
(0, react_1.useLayoutEffect)(function () {
|
|
8
9
|
if (!enabled) {
|
|
9
10
|
return;
|
|
10
11
|
}
|
|
11
|
-
|
|
12
|
+
var transitionElements = [dialogWindowRef, dialogRef];
|
|
12
13
|
if (transitionElement === 'window') {
|
|
13
14
|
transitionElements = [dialogWindowRef];
|
|
14
15
|
}
|
|
15
16
|
else if (transitionElement === 'root') {
|
|
16
17
|
transitionElements = [dialogRef];
|
|
17
18
|
}
|
|
18
|
-
|
|
19
|
+
var cancelCurrentAnimation;
|
|
19
20
|
if (open) {
|
|
20
21
|
cancelCurrentAnimation = showAnimation({
|
|
21
22
|
dialog: dialogRef,
|
|
22
23
|
waitFor: transitionElements,
|
|
23
|
-
classPrefix,
|
|
24
|
-
onTransitionEnd
|
|
24
|
+
classPrefix: classPrefix,
|
|
25
|
+
onTransitionEnd: onTransitionEnd
|
|
25
26
|
});
|
|
26
27
|
}
|
|
27
28
|
else if (!firstRender.current) {
|
|
28
29
|
cancelCurrentAnimation = hideAnimation({
|
|
29
30
|
dialog: dialogRef,
|
|
30
31
|
waitFor: transitionElements,
|
|
31
|
-
classPrefix,
|
|
32
|
-
onTransitionEnd
|
|
32
|
+
classPrefix: classPrefix,
|
|
33
|
+
onTransitionEnd: onTransitionEnd
|
|
33
34
|
});
|
|
34
35
|
}
|
|
35
36
|
firstRender.current = false;
|
|
36
|
-
return ()
|
|
37
|
+
return function () {
|
|
37
38
|
if (cancelCurrentAnimation) {
|
|
38
39
|
cancelCurrentAnimation();
|
|
39
40
|
}
|
|
@@ -41,28 +42,30 @@ function useDialogAnimation({ open, classPrefix, transitionElement, dialogRef, d
|
|
|
41
42
|
}, [open, enabled]);
|
|
42
43
|
}
|
|
43
44
|
exports.useDialogAnimation = useDialogAnimation;
|
|
44
|
-
function showAnimation(
|
|
45
|
-
|
|
45
|
+
function showAnimation(_a) {
|
|
46
|
+
var dialog = _a.dialog, waitFor = _a.waitFor, classPrefix = _a.classPrefix, onTransitionEnd = _a.onTransitionEnd;
|
|
47
|
+
return transition(dialog, waitFor, "".concat(classPrefix, "--show"), onTransitionEnd);
|
|
46
48
|
}
|
|
47
|
-
function hideAnimation(
|
|
48
|
-
|
|
49
|
+
function hideAnimation(_a) {
|
|
50
|
+
var dialog = _a.dialog, waitFor = _a.waitFor, classPrefix = _a.classPrefix, onTransitionEnd = _a.onTransitionEnd;
|
|
51
|
+
return transition(dialog, waitFor, "".concat(classPrefix, "--hide"), onTransitionEnd);
|
|
49
52
|
}
|
|
50
53
|
function transition(element, waitFor, className, onTransitionEnd) {
|
|
51
54
|
if (!element.current || !className) {
|
|
52
55
|
return;
|
|
53
56
|
}
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
+
var ran = 0;
|
|
58
|
+
var pending = waitFor ? waitFor.length : 0;
|
|
59
|
+
var initClass = "".concat(className, "-init");
|
|
57
60
|
element.current.classList.add(initClass);
|
|
58
|
-
return nextFrame(()
|
|
61
|
+
return nextFrame(function () {
|
|
59
62
|
if (!element.current) {
|
|
60
63
|
return;
|
|
61
64
|
}
|
|
62
65
|
element.current.classList.add(className);
|
|
63
66
|
element.current.classList.remove(initClass);
|
|
64
|
-
waitFor.forEach((ref)
|
|
65
|
-
|
|
67
|
+
waitFor.forEach(function (ref) {
|
|
68
|
+
var listener = function () {
|
|
66
69
|
var _a, _b;
|
|
67
70
|
if (++ran === pending) {
|
|
68
71
|
(_a = element.current) === null || _a === void 0 ? void 0 : _a.classList.remove(className);
|
|
@@ -75,10 +78,10 @@ function transition(element, waitFor, className, onTransitionEnd) {
|
|
|
75
78
|
});
|
|
76
79
|
}
|
|
77
80
|
function nextFrame(callback) {
|
|
78
|
-
|
|
79
|
-
|
|
81
|
+
var frame;
|
|
82
|
+
var cancelFrame;
|
|
80
83
|
if (window.requestAnimationFrame) {
|
|
81
|
-
frame = window.requestAnimationFrame(()
|
|
84
|
+
frame = window.requestAnimationFrame(function () {
|
|
82
85
|
frame = window.requestAnimationFrame(callback);
|
|
83
86
|
});
|
|
84
87
|
cancelFrame = window.cancelAnimationFrame;
|
|
@@ -87,7 +90,7 @@ function nextFrame(callback) {
|
|
|
87
90
|
frame = window.setTimeout(callback, 26); // 16ms to simulate RAF, 10ms to ensure called after the frame.
|
|
88
91
|
cancelFrame = window.clearTimeout;
|
|
89
92
|
}
|
|
90
|
-
return ()
|
|
93
|
+
return function () {
|
|
91
94
|
if (frame) {
|
|
92
95
|
cancelFrame(frame);
|
|
93
96
|
frame = undefined;
|
|
@@ -3,6 +3,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
|
|
7
|
-
|
|
6
|
+
var react_1 = __importDefault(require("react"));
|
|
7
|
+
var EbayDialogActions = function (_a) {
|
|
8
|
+
var children = _a.children;
|
|
9
|
+
return react_1.default.createElement(react_1.default.Fragment, null, children);
|
|
10
|
+
};
|
|
8
11
|
exports.default = EbayDialogActions;
|
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
import { FC
|
|
2
|
-
|
|
3
|
-
children?: ReactNode;
|
|
4
|
-
};
|
|
5
|
-
declare const EbayDialogCloseButton: FC<EbayDialogCloseButtonProps>;
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
declare const EbayDialogCloseButton: FC;
|
|
6
3
|
export default EbayDialogCloseButton;
|
|
7
4
|
//# sourceMappingURL=dialog-close-button.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog-close-button.d.ts","sourceRoot":"","sources":["../../../src/ebay-dialog-base/components/dialog-close-button.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,
|
|
1
|
+
{"version":3,"file":"dialog-close-button.d.ts","sourceRoot":"","sources":["../../../src/ebay-dialog-base/components/dialog-close-button.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAa,MAAM,OAAO,CAAA;AAM5C,QAAA,MAAM,qBAAqB,EAAE,EAAkE,CAAA;AAE/F,eAAe,qBAAqB,CAAA"}
|
|
@@ -3,6 +3,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
|
|
7
|
-
|
|
6
|
+
var react_1 = __importDefault(require("react"));
|
|
7
|
+
var EbayDialogCloseButton = function (_a) {
|
|
8
|
+
var children = _a.children;
|
|
9
|
+
return react_1.default.createElement(react_1.default.Fragment, null, children);
|
|
10
|
+
};
|
|
8
11
|
exports.default = EbayDialogCloseButton;
|
|
@@ -3,6 +3,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
|
|
7
|
-
|
|
6
|
+
var react_1 = __importDefault(require("react"));
|
|
7
|
+
var EbayDialogFooter = function (_a) {
|
|
8
|
+
var children = _a.children;
|
|
9
|
+
return react_1.default.createElement(react_1.default.Fragment, null, children);
|
|
10
|
+
};
|
|
8
11
|
exports.default = EbayDialogFooter;
|
|
@@ -1,4 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
2
13
|
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
14
|
var t = {};
|
|
4
15
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
@@ -14,9 +25,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
14
25
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
26
|
};
|
|
16
27
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
var
|
|
20
|
-
return react_1.default.createElement("h2",
|
|
28
|
+
var react_1 = __importDefault(require("react"));
|
|
29
|
+
var EbayDialogHeader = function (_a) {
|
|
30
|
+
var children = _a.children, rest = __rest(_a, ["children"]);
|
|
31
|
+
return react_1.default.createElement("h2", __assign({}, rest), children);
|
|
21
32
|
};
|
|
22
33
|
exports.default = EbayDialogHeader;
|
|
@@ -1,4 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
2
13
|
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
14
|
var t = {};
|
|
4
15
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
@@ -14,11 +25,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
14
25
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
26
|
};
|
|
16
27
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
var
|
|
22
|
-
return (react_1.default.createElement(ebay_icon_button_1.EbayIconButton,
|
|
28
|
+
var react_1 = __importDefault(require("react"));
|
|
29
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
30
|
+
var ebay_icon_button_1 = require("../../ebay-icon-button");
|
|
31
|
+
var EbayDialogPreviousButton = function (_a) {
|
|
32
|
+
var className = _a.className, icon = _a.icon, rest = __rest(_a, ["className", "icon"]);
|
|
33
|
+
return (react_1.default.createElement(ebay_icon_button_1.EbayIconButton, __assign({}, rest, { icon: icon || 'chevronLeft16', className: (0, classnames_1.default)(className, 'lightbox-dialog__prev') })));
|
|
23
34
|
};
|
|
24
35
|
exports.default = EbayDialogPreviousButton;
|
|
@@ -1,4 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
2
13
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
14
|
if (k2 === undefined) k2 = k;
|
|
4
15
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -38,26 +49,26 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
38
49
|
};
|
|
39
50
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
51
|
exports.DialogBase = void 0;
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
52
|
+
var react_1 = __importStar(require("react"));
|
|
53
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
54
|
+
var screenreaderTrap = __importStar(require("makeup-screenreader-trap"));
|
|
55
|
+
var keyboardTrap = __importStar(require("makeup-keyboard-trap"));
|
|
56
|
+
var ebay_icon_1 = require("../../ebay-icon");
|
|
57
|
+
var random_id_1 = require("../../common/random-id");
|
|
58
|
+
var animation_1 = require("./animation");
|
|
59
|
+
var DialogBase = function (_a) {
|
|
49
60
|
var _b;
|
|
50
|
-
var
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
(0, react_1.useEffect)(()
|
|
61
|
+
var _c = _a.baseEl, Container = _c === void 0 ? 'div' : _c, _d = _a.classPrefix, classPrefix = _d === void 0 ? 'drawer-dialog' : _d, windowClass = _a.windowClass, windowType = _a.windowType, mainId = _a.mainId, top = _a.top, header = _a.header, _e = _a.buttonPosition, buttonPosition = _e === void 0 ? 'right' : _e, children = _a.children, ariaLabelledby = _a.ariaLabelledby, a11yCloseText = _a.a11yCloseText, _f = _a.onCloseBtnClick, onCloseBtnClick = _f === void 0 ? function () { } : _f, footer = _a.footer, actions = _a.actions, onScroll = _a.onScroll, _g = _a.open, open = _g === void 0 ? false : _g, _h = _a.onOpen, onOpen = _h === void 0 ? function () { } : _h, _j = _a.onBackgroundClick, onBackgroundClick = _j === void 0 ? function () { } : _j, ignoreEscape = _a.ignoreEscape, closeButton = _a.closeButton, previousButton = _a.previousButton, isModal = _a.isModal, _k = _a.role, role = _k === void 0 ? 'dialog' : _k, focus = _a.focus, transitionElement = _a.transitionElement, animated = _a.animated, closeButtonClass = _a.closeButtonClass, props = __rest(_a, ["baseEl", "classPrefix", "windowClass", "windowType", "mainId", "top", "header", "buttonPosition", "children", "ariaLabelledby", "a11yCloseText", "onCloseBtnClick", "footer", "actions", "onScroll", "open", "onOpen", "onBackgroundClick", "ignoreEscape", "closeButton", "previousButton", "isModal", "role", "focus", "transitionElement", "animated", "closeButtonClass"]);
|
|
62
|
+
var dialogRef = (0, react_1.useRef)(null);
|
|
63
|
+
var drawerBaseEl = (0, react_1.useRef)(null);
|
|
64
|
+
var closeButtonRef = (0, react_1.useRef)(null);
|
|
65
|
+
var _l = (0, react_1.useState)(''), rId = _l[0], setRandomId = _l[1];
|
|
66
|
+
(0, react_1.useEffect)(function () {
|
|
56
67
|
setRandomId((0, random_id_1.randomId)());
|
|
57
68
|
}, []);
|
|
58
|
-
(0, react_1.useEffect)(()
|
|
59
|
-
|
|
60
|
-
|
|
69
|
+
(0, react_1.useEffect)(function () {
|
|
70
|
+
var timeout;
|
|
71
|
+
var handleBackgroundClick = function (e) {
|
|
61
72
|
if (drawerBaseEl.current && !drawerBaseEl.current.contains(e.target)) {
|
|
62
73
|
onBackgroundClick(e);
|
|
63
74
|
}
|
|
@@ -67,16 +78,16 @@ const DialogBase = (_a) => {
|
|
|
67
78
|
// causing the event listener to be attached to the document at the same time that the dialog
|
|
68
79
|
// opens. Adding a timeout so the event is attached after the click event that opened the modal
|
|
69
80
|
// is finished.
|
|
70
|
-
timeout = window.setTimeout(()
|
|
81
|
+
timeout = window.setTimeout(function () {
|
|
71
82
|
document.addEventListener('click', handleBackgroundClick, false);
|
|
72
83
|
});
|
|
73
84
|
}
|
|
74
|
-
return ()
|
|
85
|
+
return function () {
|
|
75
86
|
clearTimeout(timeout);
|
|
76
87
|
document.removeEventListener('click', handleBackgroundClick, false);
|
|
77
88
|
};
|
|
78
89
|
}, [onBackgroundClick, open]);
|
|
79
|
-
(0, react_1.useEffect)(()
|
|
90
|
+
(0, react_1.useEffect)(function () {
|
|
80
91
|
if (open && isModal) {
|
|
81
92
|
screenreaderTrap.trap(drawerBaseEl.current);
|
|
82
93
|
keyboardTrap.trap(drawerBaseEl.current);
|
|
@@ -85,27 +96,27 @@ const DialogBase = (_a) => {
|
|
|
85
96
|
screenreaderTrap.untrap();
|
|
86
97
|
keyboardTrap.untrap();
|
|
87
98
|
}
|
|
88
|
-
return ()
|
|
99
|
+
return function () {
|
|
89
100
|
screenreaderTrap.untrap();
|
|
90
101
|
keyboardTrap.untrap();
|
|
91
102
|
};
|
|
92
103
|
}, [open, isModal]);
|
|
93
104
|
(0, animation_1.useDialogAnimation)({
|
|
94
|
-
open,
|
|
95
|
-
classPrefix,
|
|
96
|
-
transitionElement,
|
|
97
|
-
dialogRef,
|
|
105
|
+
open: open,
|
|
106
|
+
classPrefix: classPrefix,
|
|
107
|
+
transitionElement: transitionElement,
|
|
108
|
+
dialogRef: dialogRef,
|
|
98
109
|
dialogWindowRef: drawerBaseEl,
|
|
99
110
|
enabled: animated,
|
|
100
|
-
onTransitionEnd: ()
|
|
111
|
+
onTransitionEnd: function () { return handleFocus(open); }
|
|
101
112
|
});
|
|
102
|
-
|
|
113
|
+
var onKeyDown = function (event) {
|
|
103
114
|
if (!ignoreEscape && event.key === 'Escape') {
|
|
104
115
|
event.stopPropagation();
|
|
105
116
|
onCloseBtnClick(event);
|
|
106
117
|
}
|
|
107
118
|
};
|
|
108
|
-
(0, react_1.useEffect)(()
|
|
119
|
+
(0, react_1.useEffect)(function () {
|
|
109
120
|
// For animated dialogs we handle the focus on transitionEnd event
|
|
110
121
|
if (!animated) {
|
|
111
122
|
handleFocus(open);
|
|
@@ -124,27 +135,27 @@ const DialogBase = (_a) => {
|
|
|
124
135
|
(_b = closeButtonRef.current) === null || _b === void 0 ? void 0 : _b.focus();
|
|
125
136
|
}
|
|
126
137
|
document.addEventListener('keydown', onKeyDown, false);
|
|
127
|
-
return ()
|
|
138
|
+
return function () { return document.removeEventListener('keydown', onKeyDown, false); };
|
|
128
139
|
}
|
|
129
140
|
}
|
|
130
|
-
|
|
131
|
-
'icon-btn--transparent': classPrefix ===
|
|
141
|
+
var closeButtonContent = buttonPosition !== 'hidden' && (react_1.default.createElement("button", { ref: closeButtonRef, className: (0, classnames_1.default)("icon-btn", closeButtonClass, "".concat(classPrefix, "__close"), {
|
|
142
|
+
'icon-btn--transparent': classPrefix === "toast-dialog"
|
|
132
143
|
}), type: "button", "aria-label": a11yCloseText, onClick: onCloseBtnClick }, closeButton || react_1.default.createElement(ebay_icon_1.EbayIcon, { name: "close16" })));
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
return (react_1.default.createElement(Container,
|
|
144
|
+
var windowClassName = windowType ? "".concat(classPrefix, "__").concat(windowType, "-window") : "".concat(classPrefix, "__window");
|
|
145
|
+
var dialogTitleId = ((_b = header === null || header === void 0 ? void 0 : header.props) === null || _b === void 0 ? void 0 : _b.id) || "dialog-title-".concat(rId);
|
|
146
|
+
var dialogLabelledBy = ariaLabelledby || dialogTitleId;
|
|
147
|
+
var dialogHeader = header ? (0, react_1.cloneElement)(header, __assign(__assign({}, header.props), { id: dialogTitleId })) : null;
|
|
148
|
+
return (react_1.default.createElement(Container, __assign({}, props, { "aria-labelledby": dialogLabelledBy, "arial-modal": "true", role: role, hidden: !open, className: (0, classnames_1.default)(classPrefix, props.className), "aria-live": !isModal ? 'polite' : undefined, ref: dialogRef, onKeyDown: onKeyDown }),
|
|
138
149
|
react_1.default.createElement("div", { className: (0, classnames_1.default)(windowClassName, windowClass), ref: drawerBaseEl },
|
|
139
150
|
top,
|
|
140
|
-
dialogHeader && (react_1.default.createElement("div", { className:
|
|
151
|
+
dialogHeader && (react_1.default.createElement("div", { className: "".concat(classPrefix, "__header") },
|
|
141
152
|
previousButton,
|
|
142
153
|
buttonPosition === 'right' && dialogHeader,
|
|
143
154
|
buttonPosition !== 'bottom' && closeButtonContent,
|
|
144
155
|
(buttonPosition === 'left' || buttonPosition === 'hidden') && dialogHeader)),
|
|
145
|
-
react_1.default.createElement("div", { id: mainId, className:
|
|
146
|
-
actions ? (react_1.default.createElement("div", { className:
|
|
147
|
-
footer || buttonPosition === 'bottom' ? (react_1.default.createElement("div", { className:
|
|
156
|
+
react_1.default.createElement("div", { id: mainId, className: "".concat(classPrefix, "__main"), onScroll: onScroll }, children),
|
|
157
|
+
actions ? (react_1.default.createElement("div", { className: "".concat(classPrefix, "__actions") }, actions)) : null,
|
|
158
|
+
footer || buttonPosition === 'bottom' ? (react_1.default.createElement("div", { className: "".concat(classPrefix, "__footer") },
|
|
148
159
|
footer,
|
|
149
160
|
buttonPosition === 'bottom' && closeButtonContent)) : null)));
|
|
150
161
|
};
|