@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.

Files changed (171) hide show
  1. package/common/component-utils/array.polyfill.flat.js +13 -11
  2. package/common/component-utils/forwardRef.js +17 -4
  3. package/common/component-utils/usePrevious.js +3 -3
  4. package/common/component-utils/utils.js +26 -13
  5. package/common/debounce.js +7 -3
  6. package/common/event-utils/index.js +11 -8
  7. package/common/event-utils/use-key-press.js +12 -10
  8. package/common/event-utils/use-roving-index.js +24 -13
  9. package/common/floating-label-utils/hooks.js +53 -43
  10. package/common/notice-utils/notice-content.js +6 -5
  11. package/common/notice-utils/notice-cta.js +16 -5
  12. package/common/notice-utils/notice-footer.js +16 -5
  13. package/common/notice-utils/notice-title.js +17 -6
  14. package/common/random-id.js +1 -1
  15. package/common/range.js +4 -1
  16. package/common/tooltip-utils/tooltip-close-button.js +1 -1
  17. package/common/tooltip-utils/tooltip-content.js +28 -16
  18. package/common/tooltip-utils/tooltip-footer.js +6 -3
  19. package/common/tooltip-utils/tooltip-host.js +16 -5
  20. package/common/tooltip-utils/tooltip.d.ts +1 -1
  21. package/common/tooltip-utils/tooltip.js +26 -14
  22. package/common/tooltip-utils/use-tooltip.js +9 -8
  23. package/ebay-alert-dialog/alert-dialog.js +22 -11
  24. package/ebay-badge/badge.js +17 -6
  25. package/ebay-breadcrumbs/breadcrumb-item.js +18 -7
  26. package/ebay-breadcrumbs/breadcrumbs.js +30 -19
  27. package/ebay-button/button-cell.js +16 -5
  28. package/ebay-button/button-expand.d.ts +2 -4
  29. package/ebay-button/button-expand.d.ts.map +1 -1
  30. package/ebay-button/button-expand.js +10 -7
  31. package/ebay-button/button-loading.js +5 -5
  32. package/ebay-button/button-text.js +6 -3
  33. package/ebay-button/button.d.ts +1 -1
  34. package/ebay-button/button.js +43 -31
  35. package/ebay-calendar/calendar.js +111 -94
  36. package/ebay-calendar/date-utils.js +18 -9
  37. package/ebay-carousel/carousel-control-button.js +10 -9
  38. package/ebay-carousel/carousel-item.d.ts +1 -1
  39. package/ebay-carousel/carousel-item.js +25 -14
  40. package/ebay-carousel/carousel-list.js +22 -21
  41. package/ebay-carousel/carousel.js +44 -32
  42. package/ebay-carousel/helpers.js +47 -35
  43. package/ebay-carousel/scroll-to-transition.js +15 -15
  44. package/ebay-checkbox/checkbox.js +32 -21
  45. package/ebay-confirm-dialog/confirm-dialog.js +22 -11
  46. package/ebay-cta-button/cta-button.d.ts +1 -1
  47. package/ebay-cta-button/cta-button.js +20 -9
  48. package/ebay-date-textbox/date-textbox.js +53 -37
  49. package/ebay-dialog-base/components/animation.d.ts +1 -0
  50. package/ebay-dialog-base/components/animation.d.ts.map +1 -1
  51. package/ebay-dialog-base/components/animation.js +28 -25
  52. package/ebay-dialog-base/components/dialog-actions.js +5 -2
  53. package/ebay-dialog-base/components/dialog-close-button.d.ts +2 -5
  54. package/ebay-dialog-base/components/dialog-close-button.d.ts.map +1 -1
  55. package/ebay-dialog-base/components/dialog-close-button.js +5 -2
  56. package/ebay-dialog-base/components/dialog-footer.js +5 -2
  57. package/ebay-dialog-base/components/dialog-header.js +15 -4
  58. package/ebay-dialog-base/components/dialog-previous-button.js +17 -6
  59. package/ebay-dialog-base/components/dialogBase.js +51 -40
  60. package/ebay-dialog-base/dialog-base-with-state.js +35 -22
  61. package/ebay-drawer-dialog/components/drawer.js +50 -27
  62. package/ebay-eek/eek-rating.js +10 -8
  63. package/ebay-eek/eek-util.d.ts +1 -1
  64. package/ebay-eek/eek-util.d.ts.map +1 -1
  65. package/ebay-eek/eek-util.js +6 -7
  66. package/ebay-fake-menu/menu-item-separator.js +16 -5
  67. package/ebay-fake-menu/menu-item.js +26 -15
  68. package/ebay-fake-menu/menu.js +22 -11
  69. package/ebay-fake-menu-button/menu-button-item.js +2 -2
  70. package/ebay-fake-menu-button/menu-button-label.d.ts +2 -4
  71. package/ebay-fake-menu-button/menu-button-label.d.ts.map +1 -1
  72. package/ebay-fake-menu-button/menu-button-label.js +5 -2
  73. package/ebay-fake-menu-button/menu-button-separator.js +16 -5
  74. package/ebay-fake-menu-button/menu-button.js +45 -32
  75. package/ebay-fake-tabs/fake-tabs.js +23 -10
  76. package/ebay-fake-tabs/tab.js +16 -5
  77. package/ebay-field/description.js +19 -7
  78. package/ebay-field/field.js +5 -4
  79. package/ebay-field/label.js +18 -7
  80. package/ebay-fullscreen-dialog/fullscreen-dialog.js +18 -7
  81. package/ebay-icon/icon.d.ts +1 -1
  82. package/ebay-icon/icon.js +29 -17
  83. package/ebay-icon-button/icon-button.d.ts +1 -1
  84. package/ebay-icon-button/icon-button.js +27 -15
  85. package/ebay-infotip/ebay-infotip-content.js +5 -2
  86. package/ebay-infotip/ebay-infotip-heading.js +16 -5
  87. package/ebay-infotip/ebay-infotip-host.d.ts +2 -2
  88. package/ebay-infotip/ebay-infotip-host.d.ts.map +1 -1
  89. package/ebay-infotip/ebay-infotip-host.js +24 -10
  90. package/ebay-infotip/ebay-infotip.d.ts.map +1 -1
  91. package/ebay-infotip/ebay-infotip.js +34 -23
  92. package/ebay-inline-notice/inline-notice.js +27 -15
  93. package/ebay-lightbox-dialog/lightbox-dialog.js +21 -9
  94. package/ebay-listbox-button/listbox-button-option.js +18 -7
  95. package/ebay-listbox-button/listbox-button.d.ts.map +1 -1
  96. package/ebay-listbox-button/listbox-button.js +100 -79
  97. package/ebay-menu/menu-item-separator.js +16 -5
  98. package/ebay-menu/menu-item.js +23 -12
  99. package/ebay-menu/menu.d.ts +1 -1
  100. package/ebay-menu/menu.js +64 -37
  101. package/ebay-menu-button/README.md +1 -1
  102. package/ebay-menu-button/menu-button-item.js +1 -1
  103. package/ebay-menu-button/menu-button-label.d.ts +2 -4
  104. package/ebay-menu-button/menu-button-label.d.ts.map +1 -1
  105. package/ebay-menu-button/menu-button-label.js +5 -2
  106. package/ebay-menu-button/menu-button-separator.js +16 -5
  107. package/ebay-menu-button/menu-button.js +60 -46
  108. package/ebay-notice-base/components/ebay-notice-content/notice-content.js +1 -1
  109. package/ebay-notice-base/components/ebay-notice-title/notice-title.d.ts +2 -5
  110. package/ebay-notice-base/components/ebay-notice-title/notice-title.d.ts.map +1 -1
  111. package/ebay-notice-base/components/ebay-notice-title/notice-title.js +5 -2
  112. package/ebay-page-notice/page-notice-cta.js +6 -3
  113. package/ebay-page-notice/page-notice-footer.js +6 -3
  114. package/ebay-page-notice/page-notice-title.js +16 -5
  115. package/ebay-page-notice/page-notice.js +27 -16
  116. package/ebay-pagination/helpers.js +24 -21
  117. package/ebay-pagination/pagination-item.d.ts +1 -1
  118. package/ebay-pagination/pagination-item.js +27 -16
  119. package/ebay-pagination/pagination.js +81 -52
  120. package/ebay-panel-dialog/panel-dialog.js +21 -9
  121. package/ebay-progress-bar/progress-bar.js +16 -5
  122. package/ebay-progress-spinner/progress-spinner.js +18 -7
  123. package/ebay-progress-stepper/ebay-progress-step.js +25 -14
  124. package/ebay-progress-stepper/ebay-progress-stepper.js +21 -10
  125. package/ebay-progress-stepper/ebay-progress-title.js +5 -2
  126. package/ebay-radio/radio.js +29 -18
  127. package/ebay-section-notice/section-notice-footer.js +6 -3
  128. package/ebay-section-notice/section-notice-title.js +16 -5
  129. package/ebay-section-notice/section-notice.js +39 -24
  130. package/ebay-section-title/cta.js +16 -5
  131. package/ebay-section-title/info.js +16 -5
  132. package/ebay-section-title/overflow.js +16 -5
  133. package/ebay-section-title/section-title.js +24 -13
  134. package/ebay-section-title/subtitle.js +16 -5
  135. package/ebay-section-title/title.js +16 -5
  136. package/ebay-select/ebay-select-option.js +15 -4
  137. package/ebay-select/ebay-select.d.ts +1 -1
  138. package/ebay-select/ebay-select.js +45 -34
  139. package/ebay-signal/signal.js +17 -6
  140. package/ebay-snackbar-dialog/components/ebay-snackbar-dialog-action.js +16 -5
  141. package/ebay-snackbar-dialog/components/ebay-snackbar-dialog.js +38 -27
  142. package/ebay-split-button/split-button.js +21 -10
  143. package/ebay-star-rating/star-rating.js +19 -8
  144. package/ebay-star-rating-select/star-rating-select.js +31 -20
  145. package/ebay-svg/svg.js +3 -3
  146. package/ebay-switch/ebay-switch.js +21 -10
  147. package/ebay-tabs/tab-panel.js +16 -5
  148. package/ebay-tabs/tab.js +16 -5
  149. package/ebay-tabs/tabs.js +40 -26
  150. package/ebay-textbox/postfix-icon.js +18 -7
  151. package/ebay-textbox/prefix-icon.js +16 -5
  152. package/ebay-textbox/textbox.d.ts +1 -1
  153. package/ebay-textbox/textbox.js +53 -42
  154. package/ebay-toast-dialog/components/toast.js +17 -6
  155. package/ebay-tooltip/ebay-tooltip-content.js +1 -1
  156. package/ebay-tooltip/ebay-tooltip-host.js +1 -1
  157. package/ebay-tooltip/ebay-tooltip.js +32 -21
  158. package/ebay-tourtip/ebay-tourtip-content.js +1 -1
  159. package/ebay-tourtip/ebay-tourtip-footer.js +7 -4
  160. package/ebay-tourtip/ebay-tourtip-heading.js +17 -6
  161. package/ebay-tourtip/ebay-tourtip-host.js +1 -1
  162. package/ebay-tourtip/ebay-tourtip.js +33 -22
  163. package/ebay-video/controls.d.ts.map +1 -1
  164. package/ebay-video/controls.js +46 -23
  165. package/ebay-video/reportButton.d.ts +2 -7
  166. package/ebay-video/reportButton.d.ts.map +1 -1
  167. package/ebay-video/reportButton.js +8 -5
  168. package/ebay-video/source.js +14 -3
  169. package/ebay-video/video.d.ts.map +1 -1
  170. package/ebay-video/video.js +80 -54
  171. 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
- const react_1 = __importStar(require("react"));
41
- const makeup_expander_1 = __importDefault(require("makeup-expander"));
42
- const calendar_1 = __importDefault(require("../ebay-calendar/calendar"));
43
- const ebay_textbox_1 = require("../ebay-textbox");
44
- const date_utils_1 = require("../ebay-calendar/date-utils");
45
- const textbox_1 = require("../ebay-textbox/textbox");
46
- const classnames_1 = __importDefault(require("classnames"));
47
- const MIN_WIDTH_FOR_DOUBLE_PANE = 600;
48
- const EbayDateTextbox = (_a) => {
49
- var { className, inputPlaceholderText = 'YYYY-MM-DD', a11yOpenPopoverText = 'open calendar', range, value: controlledValue, rangeEnd: controlledRangeEnd, defaultValue, defaultRangeEnd, collapseOnSelect, onChange = () => { }, onInputChange = () => { }, onInputRangeEndChange = () => { } } = _a, rest = __rest(_a, ["className", "inputPlaceholderText", "a11yOpenPopoverText", "range", "value", "rangeEnd", "defaultValue", "defaultRangeEnd", "collapseOnSelect", "onChange", "onInputChange", "onInputRangeEndChange"]);
50
- const expander = (0, react_1.useRef)();
51
- const containerRef = (0, react_1.useRef)(null);
52
- const [internalValue, setInternalValue] = (0, react_1.useState)(defaultValue || '');
53
- const [internalRangeEnd, setInternalRangeEnd] = (0, react_1.useState)(defaultRangeEnd || '');
54
- const valueToRender = (0, textbox_1.isControlled)(controlledValue) ? controlledValue : internalValue;
55
- const rangeEndToRender = (0, textbox_1.isControlled)(controlledRangeEnd) ? controlledRangeEnd : internalRangeEnd;
56
- const [firstSelected, setFirstSelected] = (0, react_1.useState)(() => (0, date_utils_1.dateArgToISO)(valueToRender));
57
- const [secondSelected, setSecondSelected] = (0, react_1.useState)(() => (0, date_utils_1.dateArgToISO)(rangeEndToRender));
58
- const [isPopoverOpen, setIsPopoverOpen] = (0, react_1.useState)(false);
59
- const [numMonths, setNumMonths] = (0, react_1.useState)(1);
60
- const openPopover = () => {
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
- const closePopover = () => {
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
- const calculateNumMonths = () => {
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
- const handleInputChange = (event, index) => {
90
- const date = new Date(event.target.value);
91
- const iso = isNaN(date.getTime()) ? null : (0, date_utils_1.toISO)(date);
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
- const handlePopoverSelect = (event, { iso }) => {
127
+ var handlePopoverSelect = function (event, _a) {
128
+ var iso = _a.iso;
113
129
  setFirstSelected(iso);
114
130
  setInternalValue(iso);
115
131
  if (range) {
116
- const selected = firstSelected || secondSelected;
117
- const eventData = {
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
- const handleInternalChange = (event, index) => {
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
- const [rangeStartPlaceholder, mainPlaceholder] = Array.isArray(inputPlaceholderText)
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) => handleInternalChange(event, 0), onBlur: (event) => handleInputChange(event, 0) })),
172
- react_1.default.createElement(ebay_textbox_1.EbayTextbox, { className: "ebay-date-textbox--main", placeholder: mainPlaceholder, value: range ? rangeEndToRender : valueToRender, onInputChange: (event) => handleInternalChange(event, range ? 1 : 0), onBlur: (event) => handleInputChange(event, range ? 1 : 0) },
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, Object.assign({}, rest, { range: range, interactive: true, navigable: true, numMonths: numMonths, selected: firstSelected && secondSelected
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,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  interface DialogAnimationHookProps {
2
3
  open?: boolean;
3
4
  transitionElement?: TransitionElement;
@@ -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
- const react_1 = require("react");
5
- function useDialogAnimation({ open, classPrefix, transitionElement, dialogRef, dialogWindowRef, enabled, onTransitionEnd }) {
6
- const firstRender = (0, react_1.useRef)(true);
7
- (0, react_1.useLayoutEffect)(() => {
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
- let transitionElements = [dialogWindowRef, dialogRef];
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
- let cancelCurrentAnimation;
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({ dialog, waitFor, classPrefix, onTransitionEnd }) {
45
- return transition(dialog, waitFor, `${classPrefix}--show`, onTransitionEnd);
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({ dialog, waitFor, classPrefix, onTransitionEnd }) {
48
- return transition(dialog, waitFor, `${classPrefix}--hide`, onTransitionEnd);
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
- let ran = 0;
55
- const pending = waitFor ? waitFor.length : 0;
56
- const initClass = `${className}-init`;
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
- const listener = () => {
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
- let frame;
79
- let cancelFrame;
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
- const react_1 = __importDefault(require("react"));
7
- const EbayDialogActions = ({ children }) => react_1.default.createElement(react_1.default.Fragment, null, children);
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, ReactNode } from 'react';
2
- type EbayDialogCloseButtonProps = {
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,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAE5C,KAAK,0BAA0B,GAAG;IAC9B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB,CAAA;AAED,QAAA,MAAM,qBAAqB,EAAE,EAAE,CAAC,0BAA0B,CAAqC,CAAA;AAE/F,eAAe,qBAAqB,CAAA"}
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
- const react_1 = __importDefault(require("react"));
7
- const EbayDialogCloseButton = ({ children }) => react_1.default.createElement(react_1.default.Fragment, null, children);
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
- const react_1 = __importDefault(require("react"));
7
- const EbayDialogFooter = ({ children }) => react_1.default.createElement(react_1.default.Fragment, null, children);
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
- const react_1 = __importDefault(require("react"));
18
- const EbayDialogHeader = (_a) => {
19
- var { children } = _a, rest = __rest(_a, ["children"]);
20
- return react_1.default.createElement("h2", Object.assign({}, rest), children);
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
- const react_1 = __importDefault(require("react"));
18
- const classnames_1 = __importDefault(require("classnames"));
19
- const ebay_icon_button_1 = require("../../ebay-icon-button");
20
- const EbayDialogPreviousButton = (_a) => {
21
- var { className, icon } = _a, rest = __rest(_a, ["className", "icon"]);
22
- return (react_1.default.createElement(ebay_icon_button_1.EbayIconButton, Object.assign({}, rest, { icon: icon || 'chevronLeft16', className: (0, classnames_1.default)(className, 'lightbox-dialog__prev') })));
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
- const react_1 = __importStar(require("react"));
42
- const classnames_1 = __importDefault(require("classnames"));
43
- const screenreaderTrap = __importStar(require("makeup-screenreader-trap"));
44
- const keyboardTrap = __importStar(require("makeup-keyboard-trap"));
45
- const ebay_icon_1 = require("../../ebay-icon");
46
- const random_id_1 = require("../../common/random-id");
47
- const animation_1 = require("./animation");
48
- const DialogBase = (_a) => {
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 { baseEl: Container = 'div', classPrefix = 'drawer-dialog', windowClass, windowType, mainId, top, header, buttonPosition = 'right', children, ariaLabelledby, a11yCloseText, onCloseBtnClick = () => { }, footer, actions, onScroll, open = false, onOpen = () => { }, onBackgroundClick = () => { }, ignoreEscape, closeButton, previousButton, isModal, role = 'dialog', focus, transitionElement, animated, closeButtonClass } = _a, 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"]);
51
- const dialogRef = (0, react_1.useRef)(null);
52
- const drawerBaseEl = (0, react_1.useRef)(null);
53
- const closeButtonRef = (0, react_1.useRef)(null);
54
- const [rId, setRandomId] = (0, react_1.useState)('');
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
- let timeout;
60
- const handleBackgroundClick = (e) => {
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: () => handleFocus(open)
111
+ onTransitionEnd: function () { return handleFocus(open); }
101
112
  });
102
- const onKeyDown = (event) => {
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 () => document.removeEventListener('keydown', onKeyDown, false);
138
+ return function () { return document.removeEventListener('keydown', onKeyDown, false); };
128
139
  }
129
140
  }
130
- const closeButtonContent = buttonPosition !== 'hidden' && (react_1.default.createElement("button", { ref: closeButtonRef, className: (0, classnames_1.default)(`icon-btn`, closeButtonClass, `${classPrefix}__close`, {
131
- 'icon-btn--transparent': classPrefix === `toast-dialog`
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
- const windowClassName = windowType ? `${classPrefix}__${windowType}-window` : `${classPrefix}__window`;
134
- const dialogTitleId = ((_b = header === null || header === void 0 ? void 0 : header.props) === null || _b === void 0 ? void 0 : _b.id) || `dialog-title-${rId}`;
135
- const dialogLabelledBy = ariaLabelledby || dialogTitleId;
136
- const dialogHeader = header ? (0, react_1.cloneElement)(header, Object.assign(Object.assign({}, header.props), { id: dialogTitleId })) : null;
137
- return (react_1.default.createElement(Container, Object.assign({}, props, { "aria-labelledby": dialogLabelledBy, "aria-modal": "true", role: role, hidden: !open, className: (0, classnames_1.default)(classPrefix, props.className), "aria-live": !isModal ? 'polite' : undefined, ref: dialogRef, onKeyDown: onKeyDown }),
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: `${classPrefix}__header` },
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: `${classPrefix}__main`, onScroll: onScroll }, children),
146
- actions ? (react_1.default.createElement("div", { className: `${classPrefix}__actions` }, actions)) : null,
147
- footer || buttonPosition === 'bottom' ? (react_1.default.createElement("div", { className: `${classPrefix}__footer` },
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
  };