UNPKG

573 kBJavaScriptView Raw
1'use strict';
2
3Object.defineProperty(exports, '__esModule', { value: true });
4
5function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
6
7var PropTypes = require('prop-types');
8var React = require('react');
9var reactUtilities = require('@shopify/react-utilities');
10var styles = require('@shopify/react-utilities/styles');
11var tslib_1 = require('tslib');
12var decorators = require('@shopify/javascript-utilities/decorators');
13var geometry = require('@shopify/javascript-utilities/geometry');
14var throttle = _interopDefault(require('lodash-decorators/throttle'));
15var events = require('@shopify/javascript-utilities/events');
16var other = require('@shopify/javascript-utilities/other');
17var get = _interopDefault(require('lodash/get'));
18var merge = _interopDefault(require('lodash/merge'));
19var replace = _interopDefault(require('lodash/replace'));
20var hoistStatics = _interopDefault(require('hoist-non-react-statics'));
21var compose = _interopDefault(require('@shopify/react-compose'));
22var fastdom = require('@shopify/javascript-utilities/fastdom');
23var math = require('@shopify/javascript-utilities/math');
24var isEqual = _interopDefault(require('lodash/isEqual'));
25var dates = require('@shopify/javascript-utilities/dates');
26var capitalize = _interopDefault(require('lodash/capitalize'));
27require('core-js/fn/array/some');
28require('core-js/fn/string/ends-with');
29var reactTransitionGroup = require('react-transition-group');
30var ReactDOM = require('react-dom');
31var focus = require('@shopify/javascript-utilities/focus');
32var target = require('@shopify/react-utilities/target');
33var dom = require('@shopify/javascript-utilities/dom');
34var memoize$1 = _interopDefault(require('lodash/memoize'));
35var pick = _interopDefault(require('lodash/pick'));
36
37if (typeof window !== 'undefined') {
38 window.Polaris = window.Polaris || {};
39 window.Polaris.VERSION = '0.1.6';
40}
41
42/* eslint-disable shopify/typescript/prefer-pascal-case-enums */
43// eslint-disable-next-line shopify/typescript/prefer-singular-enums
44
45(function (Keys) {
46 Keys[Keys["BACKSPACE"] = 8] = "BACKSPACE";
47 Keys[Keys["TAB"] = 9] = "TAB";
48 Keys[Keys["ENTER"] = 13] = "ENTER";
49 Keys[Keys["SHIFT"] = 16] = "SHIFT";
50 Keys[Keys["CTRL"] = 17] = "CTRL";
51 Keys[Keys["ALT"] = 18] = "ALT";
52 Keys[Keys["PAUSE"] = 19] = "PAUSE";
53 Keys[Keys["CAPS_LOCK"] = 20] = "CAPS_LOCK";
54 Keys[Keys["ESCAPE"] = 27] = "ESCAPE";
55 Keys[Keys["SPACE"] = 32] = "SPACE";
56 Keys[Keys["PAGE_UP"] = 33] = "PAGE_UP";
57 Keys[Keys["PAGE_DOWN"] = 34] = "PAGE_DOWN";
58 Keys[Keys["END"] = 35] = "END";
59 Keys[Keys["HOME"] = 36] = "HOME";
60 Keys[Keys["LEFT_ARROW"] = 37] = "LEFT_ARROW";
61 Keys[Keys["UP_ARROW"] = 38] = "UP_ARROW";
62 Keys[Keys["RIGHT_ARROW"] = 39] = "RIGHT_ARROW";
63 Keys[Keys["DOWN_ARROW"] = 40] = "DOWN_ARROW";
64 Keys[Keys["INSERT"] = 45] = "INSERT";
65 Keys[Keys["DELETE"] = 46] = "DELETE";
66 Keys[Keys["KEY_0"] = 48] = "KEY_0";
67 Keys[Keys["KEY_1"] = 49] = "KEY_1";
68 Keys[Keys["KEY_2"] = 50] = "KEY_2";
69 Keys[Keys["KEY_3"] = 51] = "KEY_3";
70 Keys[Keys["KEY_4"] = 52] = "KEY_4";
71 Keys[Keys["KEY_5"] = 53] = "KEY_5";
72 Keys[Keys["KEY_6"] = 54] = "KEY_6";
73 Keys[Keys["KEY_7"] = 55] = "KEY_7";
74 Keys[Keys["KEY_8"] = 56] = "KEY_8";
75 Keys[Keys["KEY_9"] = 57] = "KEY_9";
76 Keys[Keys["KEY_A"] = 65] = "KEY_A";
77 Keys[Keys["KEY_B"] = 66] = "KEY_B";
78 Keys[Keys["KEY_C"] = 67] = "KEY_C";
79 Keys[Keys["KEY_D"] = 68] = "KEY_D";
80 Keys[Keys["KEY_E"] = 69] = "KEY_E";
81 Keys[Keys["KEY_F"] = 70] = "KEY_F";
82 Keys[Keys["KEY_G"] = 71] = "KEY_G";
83 Keys[Keys["KEY_H"] = 72] = "KEY_H";
84 Keys[Keys["KEY_I"] = 73] = "KEY_I";
85 Keys[Keys["KEY_J"] = 74] = "KEY_J";
86 Keys[Keys["KEY_K"] = 75] = "KEY_K";
87 Keys[Keys["KEY_L"] = 76] = "KEY_L";
88 Keys[Keys["KEY_M"] = 77] = "KEY_M";
89 Keys[Keys["KEY_N"] = 78] = "KEY_N";
90 Keys[Keys["KEY_O"] = 79] = "KEY_O";
91 Keys[Keys["KEY_P"] = 80] = "KEY_P";
92 Keys[Keys["KEY_Q"] = 81] = "KEY_Q";
93 Keys[Keys["KEY_R"] = 82] = "KEY_R";
94 Keys[Keys["KEY_S"] = 83] = "KEY_S";
95 Keys[Keys["KEY_T"] = 84] = "KEY_T";
96 Keys[Keys["KEY_U"] = 85] = "KEY_U";
97 Keys[Keys["KEY_V"] = 86] = "KEY_V";
98 Keys[Keys["KEY_W"] = 87] = "KEY_W";
99 Keys[Keys["KEY_X"] = 88] = "KEY_X";
100 Keys[Keys["KEY_Y"] = 89] = "KEY_Y";
101 Keys[Keys["KEY_Z"] = 90] = "KEY_Z";
102 Keys[Keys["LEFT_META"] = 91] = "LEFT_META";
103 Keys[Keys["RIGHT_META"] = 92] = "RIGHT_META";
104 Keys[Keys["SELECT"] = 93] = "SELECT";
105 Keys[Keys["NUMPAD_0"] = 96] = "NUMPAD_0";
106 Keys[Keys["NUMPAD_1"] = 97] = "NUMPAD_1";
107 Keys[Keys["NUMPAD_2"] = 98] = "NUMPAD_2";
108 Keys[Keys["NUMPAD_3"] = 99] = "NUMPAD_3";
109 Keys[Keys["NUMPAD_4"] = 100] = "NUMPAD_4";
110 Keys[Keys["NUMPAD_5"] = 101] = "NUMPAD_5";
111 Keys[Keys["NUMPAD_6"] = 102] = "NUMPAD_6";
112 Keys[Keys["NUMPAD_7"] = 103] = "NUMPAD_7";
113 Keys[Keys["NUMPAD_8"] = 104] = "NUMPAD_8";
114 Keys[Keys["NUMPAD_9"] = 105] = "NUMPAD_9";
115 Keys[Keys["MULTIPLY"] = 106] = "MULTIPLY";
116 Keys[Keys["ADD"] = 107] = "ADD";
117 Keys[Keys["SUBTRACT"] = 109] = "SUBTRACT";
118 Keys[Keys["DECIMAL"] = 110] = "DECIMAL";
119 Keys[Keys["DIVIDE"] = 111] = "DIVIDE";
120 Keys[Keys["F1"] = 112] = "F1";
121 Keys[Keys["F2"] = 113] = "F2";
122 Keys[Keys["F3"] = 114] = "F3";
123 Keys[Keys["F4"] = 115] = "F4";
124 Keys[Keys["F5"] = 116] = "F5";
125 Keys[Keys["F6"] = 117] = "F6";
126 Keys[Keys["F7"] = 118] = "F7";
127 Keys[Keys["F8"] = 119] = "F8";
128 Keys[Keys["F9"] = 120] = "F9";
129 Keys[Keys["F10"] = 121] = "F10";
130 Keys[Keys["F11"] = 122] = "F11";
131 Keys[Keys["F12"] = 123] = "F12";
132 Keys[Keys["NUM_LOCK"] = 144] = "NUM_LOCK";
133 Keys[Keys["SCROLL_LOCK"] = 145] = "SCROLL_LOCK";
134 Keys[Keys["SEMICOLON"] = 186] = "SEMICOLON";
135 Keys[Keys["EQUALS"] = 187] = "EQUALS";
136 Keys[Keys["COMMA"] = 188] = "COMMA";
137 Keys[Keys["DASH"] = 189] = "DASH";
138 Keys[Keys["PERIOD"] = 190] = "PERIOD";
139 Keys[Keys["FORWARD_SLASH"] = 191] = "FORWARD_SLASH";
140 Keys[Keys["GRAVE_ACCENT"] = 192] = "GRAVE_ACCENT";
141 Keys[Keys["OPEN_BRACKET"] = 219] = "OPEN_BRACKET";
142 Keys[Keys["BACK_SLASH"] = 220] = "BACK_SLASH";
143 Keys[Keys["CLOSE_BRACKET"] = 221] = "CLOSE_BRACKET";
144 Keys[Keys["SINGLE_QUOTE"] = 222] = "SINGLE_QUOTE";
145})(exports.Keys || (exports.Keys = {}));
146/* eslint-enable shopify/typescript/prefer-pascal-case-enums */
147const contentContextTypes = {
148 withinContentContainer: PropTypes.bool
149};
150
151var styles$1 = {
152 "SettingAction": "p_bu",
153 "Setting": "p_u4",
154 "Action": "p_i6",
155};
156
157function SettingAction$1({ action, children }) {
158 return React.createElement(
159 'div',
160 { className: styles$1.SettingAction },
161 React.createElement(
162 'div',
163 { className: styles$1.Setting },
164 children
165 ),
166 React.createElement(
167 'div',
168 { className: styles$1.Action },
169 action
170 )
171 );
172}
173
174var styles$2 = {
175 "TermsOfService": "p_xv",
176 "Content": "p_gt",
177};
178
179// eslint-disable-next-line shopify/strict-component-boundaries
180function AccountConnection$1({ connected = false, action, avatarUrl, accountName = '', title, details, termsOfService }) {
181 const initials = accountName ? accountName.split(/\s+/).map(name => name[0]).join('') : undefined;
182 const avatarMarkup = connected ? React.createElement(Avatar$2, { accessibilityLabel: '', name: accountName, initials: initials, source: avatarUrl }) : null;
183 let titleMarkup = null;
184 if (title) {
185 titleMarkup = React.createElement(
186 'div',
187 null,
188 title
189 );
190 } else if (accountName) {
191 titleMarkup = React.createElement(
192 'div',
193 null,
194 accountName
195 );
196 }
197 const detailsMarkup = details ? React.createElement(
198 'div',
199 null,
200 React.createElement(
201 TextStyle$1,
202 { variation: 'subdued' },
203 details
204 )
205 ) : null;
206 const termsOfServiceMarkup = termsOfService ? React.createElement(
207 'div',
208 { className: styles$2.TermsOfService },
209 termsOfService
210 ) : null;
211 const actionElement = action ? buttonFrom(action, { primary: !connected }) : null;
212 return React.createElement(
213 Card$1,
214 { sectioned: true },
215 React.createElement(
216 SettingAction$1,
217 { action: actionElement },
218 React.createElement(
219 Stack$1,
220 null,
221 avatarMarkup,
222 React.createElement(
223 Stack$1.Item,
224 { fill: true },
225 React.createElement(
226 'div',
227 { className: styles$2.Content },
228 titleMarkup,
229 detailsMarkup
230 )
231 )
232 )
233 ),
234 termsOfServiceMarkup
235 );
236}
237
238var index_common = {
239 colorPurpleLighter: 'rgb(246, 240, 253)',
240 colorPurpleLight: 'rgb(227, 208, 255)',
241 colorPurpleBase: 'rgb(156, 106, 222)',
242 colorPurpleDark: 'rgb(80, 36, 143)',
243 colorPurpleDarker: 'rgb(35, 0, 81)',
244 colorPurpleText: 'rgb(80, 73, 90)',
245 colorIndigoLighter: 'rgb(244, 245, 250)',
246 colorIndigoLight: 'rgb(179, 188, 245)',
247 colorIndigoBase: 'rgb(92, 106, 196)',
248 colorIndigoDark: 'rgb(32, 46, 120)',
249 colorIndigoDarker: 'rgb(0, 6, 57)',
250 colorIndigoText: 'rgb(62, 65, 85)',
251 colorBlueLighter: 'rgb(235, 245, 250)',
252 colorBlueLight: 'rgb(180, 225, 250)',
253 colorBlueBase: 'rgb(0, 122, 206)',
254 colorBlueDark: 'rgb(8, 78, 138)',
255 colorBlueDarker: 'rgb(0, 20, 41)',
256 colorBlueText: 'rgb(62, 78, 87)',
257 colorTealLighter: 'rgb(224, 245, 245)',
258 colorTealLight: 'rgb(183, 236, 236)',
259 colorTealBase: 'rgb(71, 193, 191)',
260 colorTealDark: 'rgb(0, 132, 142)',
261 colorTealDarker: 'rgb(0, 49, 53)',
262 colorTealText: 'rgb(64, 83, 82)',
263 colorGreenLighter: 'rgb(227, 241, 223)',
264 colorGreenLight: 'rgb(187, 229, 179)',
265 colorGreenBase: 'rgb(80, 184, 60)',
266 colorGreenDark: 'rgb(16, 128, 67)',
267 colorGreenDarker: 'rgb(23, 54, 48)',
268 colorGreenText: 'rgb(65, 79, 62)',
269 colorYellowLighter: 'rgb(252, 241, 205)',
270 colorYellowLight: 'rgb(255, 234, 138)',
271 colorYellowBase: 'rgb(238, 194, 0)',
272 colorYellowDark: 'rgb(156, 111, 25)',
273 colorYellowDarker: 'rgb(87, 59, 0)',
274 colorYellowText: 'rgb(89, 81, 48)',
275 colorOrangeLighter: 'rgb(252, 235, 219)',
276 colorOrangeLight: 'rgb(255, 197, 139)',
277 colorOrangeBase: 'rgb(244, 147, 66)',
278 colorOrangeDark: 'rgb(192, 87, 23)',
279 colorOrangeDarker: 'rgb(74, 21, 4)',
280 colorOrangeText: 'rgb(89, 68, 48)',
281 colorRedLighter: 'rgb(251, 234, 229)',
282 colorRedLight: 'rgb(254, 173, 154)',
283 colorRedBase: 'rgb(222, 54, 24)',
284 colorRedDark: 'rgb(191, 7, 17)',
285 colorRedDarker: 'rgb(51, 1, 1)',
286 colorRedText: 'rgb(88, 60, 53)',
287 colorWhiteBase: 'rgb(255, 255, 255)',
288 colorSkyLighter: 'rgb(249, 250, 251)',
289 colorSkyLight: 'rgb(244, 246, 248)',
290 colorSkyBase: 'rgb(223, 227, 232)',
291 colorSkyDark: 'rgb(196, 205, 213)',
292 colorInkLightest: 'rgb(145, 158, 171)',
293 colorInkLighter: 'rgb(99, 115, 129)',
294 colorInkLight: 'rgb(69, 79, 91)',
295 colorInkBase: 'rgb(33, 43, 54)',
296 colorBlackBase: 'rgb(0, 0, 0)',
297 spacingNone: 0,
298 spacingExtraTight: '4px',
299 spacingTight: '8px',
300 spacingBase: '16px',
301 spacingLoose: '20px',
302 spacingExtraLoose: '32px',
303 fontStackBase:
304 "-apple-system, 'BlinkMacSystemFont', 'San Francisco', 'Roboto', 'Segoe UI', 'Helvetica Neue', sans-serif",
305 fontStackMonospace: "Monaco, Consolas, 'Lucida Console', monospace",
306};
307
308var polarisTokens = index_common;
309
310const Breakpoints = {
311 navBarCollapsed: '769px',
312 stackedContent: '1043px'
313};
314const noWindowMatches = {
315 media: '',
316 addListener: other.noop,
317 removeListener: other.noop,
318 matches: false
319};
320
321function stackedContent() {
322 return typeof window === 'undefined' ? noWindowMatches : window.matchMedia(`(max-width: ${Breakpoints.stackedContent})`);
323}
324
325class StickyManager {
326 constructor(container) {
327 this.stickyItems = [];
328 this.stuckItems = [];
329 if (container) {
330 this.setContainer(container);
331 }
332 }
333 registerStickyItem(stickyItem) {
334 this.stickyItems.push(stickyItem);
335 }
336 unregisterStickyItem(nodeToRemove) {
337 const nodeIndex = this.stickyItems.findIndex(({ stickyNode }) => nodeToRemove === stickyNode);
338 this.stickyItems.splice(nodeIndex, 1);
339 }
340 setContainer(el) {
341 this.container = el;
342 events.addEventListener(this.container, 'scroll', this.handleScroll);
343 events.addEventListener(window, 'resize', this.handleResize);
344 this.manageStickyItems();
345 }
346 removeScrollListener() {
347 if (this.container) {
348 events.removeEventListener(this.container, 'scroll', this.handleScroll);
349 events.removeEventListener(window, 'resize', this.handleResize);
350 }
351 }
352 handleResize() {
353 this.manageStickyItems();
354 }
355 handleScroll() {
356 this.manageStickyItems();
357 }
358 manageStickyItems() {
359 if (this.stickyItems.length <= 0) {
360 return;
361 }
362 const scrollTop = scrollTopFor(this.container);
363 const containerTop = geometry.getRectForNode(this.container).top;
364 this.stickyItems.forEach(stickyItem => {
365 const handlePositioning = stickyItem.handlePositioning;
366
367 var _evaluateStickyItem = this.evaluateStickyItem(stickyItem, scrollTop, containerTop);
368
369 const sticky = _evaluateStickyItem.sticky,
370 top = _evaluateStickyItem.top,
371 left = _evaluateStickyItem.left,
372 width = _evaluateStickyItem.width;
373
374 this.updateStuckItems(stickyItem, sticky);
375 handlePositioning(sticky, top, left, width);
376 });
377 }
378 evaluateStickyItem(stickyItem, scrollTop, containerTop) {
379 const stickyNode = stickyItem.stickyNode,
380 placeHolderNode = stickyItem.placeHolderNode,
381 boundingElement = stickyItem.boundingElement,
382 offset = stickyItem.offset,
383 disableWhenStacked = stickyItem.disableWhenStacked;
384
385 if (disableWhenStacked && stackedContent().matches) {
386 return {
387 sticky: false,
388 top: 0,
389 left: 0,
390 width: 'auto'
391 };
392 }
393 const stickyOffset = offset ? this.getOffset(stickyNode) + parseInt(polarisTokens.spacingLoose, 10) : this.getOffset(stickyNode);
394 const scrollPosition = scrollTop + stickyOffset;
395 const placeHolderNodeCurrentTop = placeHolderNode.getBoundingClientRect().top - containerTop + scrollTop;
396 const top = containerTop + stickyOffset;
397 const width = placeHolderNode.getBoundingClientRect().width;
398 const left = placeHolderNode.getBoundingClientRect().left;
399 let sticky;
400 if (boundingElement == null) {
401 sticky = scrollPosition >= placeHolderNodeCurrentTop;
402 } else {
403 const stickyItemHeight = stickyNode.getBoundingClientRect().height;
404 const stickyItemBottomPosition = boundingElement.getBoundingClientRect().bottom - stickyItemHeight + scrollTop - containerTop;
405 sticky = scrollPosition >= placeHolderNodeCurrentTop && scrollPosition < stickyItemBottomPosition;
406 }
407 return {
408 sticky,
409 top,
410 left,
411 width
412 };
413 }
414 updateStuckItems(item, sticky) {
415 const stickyNode = item.stickyNode;
416
417 if (sticky && !this.isNodeStuck(stickyNode)) {
418 this.addStuckItem(item);
419 } else if (!sticky && this.isNodeStuck(stickyNode)) {
420 this.removeStuckItem(item);
421 }
422 }
423 addStuckItem(stickyItem) {
424 this.stuckItems.push(stickyItem);
425 }
426 removeStuckItem(stickyItem) {
427 const nodeToRemove = stickyItem.stickyNode;
428
429 const nodeIndex = this.stuckItems.findIndex(({ stickyNode }) => nodeToRemove === stickyNode);
430 this.stuckItems.splice(nodeIndex, 1);
431 }
432 getOffset(node) {
433 if (this.stuckItems.length === 0) {
434 return 0;
435 }
436 let offset = 0;
437 let count = 0;
438 const stuckNodesLength = this.stuckItems.length;
439 const nodeRect = geometry.getRectForNode(node);
440 while (count < stuckNodesLength) {
441 const stuckNode = this.stuckItems[count].stickyNode;
442 if (stuckNode !== node) {
443 const stuckNodeRect = geometry.getRectForNode(stuckNode);
444 if (!horizontallyOverlaps(nodeRect, stuckNodeRect)) {
445 offset += geometry.getRectForNode(stuckNode).height;
446 }
447 } else {
448 break;
449 }
450 count++;
451 }
452 return offset;
453 }
454 isNodeStuck(node) {
455 const nodeFound = this.stuckItems.findIndex(({ stickyNode }) => node === stickyNode);
456 return nodeFound >= 0;
457 }
458}
459tslib_1.__decorate([throttle(50), decorators.autobind], StickyManager.prototype, "handleResize", null);
460tslib_1.__decorate([throttle(50), decorators.autobind], StickyManager.prototype, "handleScroll", null);
461function isDocument(node) {
462 return node === document;
463}
464function scrollTopFor(container) {
465 return isDocument(container) ? document.body.scrollTop || document.documentElement.scrollTop : container.scrollTop;
466}
467function horizontallyOverlaps(rect1, rect2) {
468 const rect1Left = rect1.left;
469 const rect1Right = rect1.left + rect1.width;
470 const rect2Left = rect2.left;
471 const rect2Right = rect2.left + rect2.width;
472 return rect2Right < rect1Left || rect1Right < rect2Left;
473}
474
475const polarisAppProviderContextTypes = {
476 polaris: PropTypes.any,
477 easdk: PropTypes.any
478};
479
480var Polaris = {"Avatar":{"label":"Avatar","labelWithInitials":"Avatar with initials {initials}"},"Badge":{"PROGRESS_LABELS":{"incomplete":"Incomplete","partiallyComplete":"Partially complete","complete":"Complete"},"STATUS_LABELS":{"info":"Info","success":"Success","warning":"Warning","attention":"Attention","new":"New"}},"Button":{"spinnerAccessibilityLabel":"Loading"},"Common":{"checkbox":"checkbox","undo":"Undo"},"DataTable":{"sortAccessibilityLabel":"sort {direction} by","navAccessibilityLabel":"Scroll table {direction} one column","totalsRowHeading":"Totals"},"DatePicker":{"previousMonth":"Show previous month, {previousMonthName} {showPreviousYear}","nextMonth":"Show next month, {nextMonth} {nextYear}","today":"Today "},"DropZone":{"overlayTextFile":"Drop file to upload","overlayTextImage":"Drop image to upload","errorOverlayTextFile":"File type is not valid","errorOverlayTextImage":"Image type is not valid","FileUpload":{"actionTitleFile":"Add file","actionTitleImage":"Add image","actionHintFile":"or drop files to upload","actionHintImage":"or drop images to upload"}},"EmptySearchResult":{"altText":"Empty search results"},"Icon":{"backdropWarning":"The {color} icon doesn’t accept backdrops. The icon colors that have backdrops are: {colorsWithBackDrops}"},"Modal":{"iFrameTitle":"body markup","modalWarning":"These required properties are missing from Modal: {missingProps}","actionWarning":"Modals inside of an embedded app will ignore: {actionWarnings}"},"Pagination":{"previous":"Previous","next":"Next","pagination":"Pagination"},"ProgressBar":{"negativeWarningMessage":"Values passed to the progress prop shouldn’t be negative. Resetting {progress} to 0.","exceedWarningMessage":"Values passed to the progress prop shouldn’t exceed 100. Setting {progress} to 100."},"ResourceList":{"sortingLabel":"Sort by","defaultItemSingular":"item","defaultItemPlural":"items","showing":"Showing {itemsCount} {resource}","selected":"{selectedItemsCount} selected","allItemsSelected":"All {itemsLength}+ {resourceNamePlural} in your store are selected.","selectAllItems":"Select all {itemsLength}+ {resourceNamePlural} in your store","emptySearchResultTitle":"No {resourceNamePlural} found","emptySearchResultDescription":"Try changing the filters or search term","selectButtonText":"Select","a11yCheckboxDeselectAllSingle":"Deselect {resourceNameSingular}","a11yCheckboxSelectAllSingle":"Select {resourceNameSingular}","a11yCheckboxDeselectAllMultiple":"Deselect all {itemsLength} {resourceNamePlural}","a11yCheckboxSelectAllMultiple":"Select all {itemsLength} {resourceNamePlural}","ariaLiveSingular":"{itemsLength} item","ariaLivePlural":"{itemsLength} items","Item":{"selectItem":"Select: {accessibilityLabel}","deselectItem":"Deselect: {accessibilityLabel}","actionsDropdown":"Actions dropdown"},"BulkActions":{"actionsActivatorLabel":"Actions","moreActionsActivatorLabel":"More actions","warningMessage":"To provide a better user experience. There should only be a maximum of {maxPromotedActions} promoted actions."},"FilterCreator":{"filterButtonLabel":"Filter","selectFilterKeyPlaceholder":"Select a filter…","addFilterButtonLabel":"Add filter","showAllWhere":"Show all {resourceNamePlural} where:"},"FilterControl":{"textFieldLabel":"Search {resourceNamePlural}"},"FilterValueSelector":{"selectFilterValuePlaceholder":"Select a filter…"},"DateSelector":{"dateFilterLabel":"Select a value","dateValueLabel":"Date","dateValueError":"Match YYYY-MM-DD format","dateValuePlaceholder":"YYYY-MM-DD","SelectOptions":{"PastWeek":"in the last week","PastMonth":"in the last month","PastQuarter":"in the last 3 months","PastYear":"in the last year","ComingWeek":"next week","ComingMonth":"next month","ComingQuarter":"in the next 3 months","ComingYear":"in the next year","OnOrBefore":"on or before","OnOrAfter":"on or after"},"FilterLabelForValue":{"past_week":"in the last week","past_month":"in the last month","past_quarter":"in the last 3 months","past_year":"in the last year","coming_week":"next week","coming_month":"next month","coming_quarter":"in the next 3 months","coming_year":"in the next year","on_or_before":"before {date}","on_or_after":"after {date}"}}},"Spinner":{"warningMessage":"The color {color} is not meant to be used on {size} spinners. The colors available on large spinners are: {colors}"},"Tag":{"ariaLabel":"Remove {children}"}};
481var en = {
482 Polaris: Polaris
483};
484
485class Intl {
486 constructor(translation) {
487 this.translation = translation;
488 this.setTranslation(translation);
489 }
490 setTranslation(translation) {
491 const i18n = Array.isArray(translation) ? merge({}, ...translation) : translation;
492 this.translation = i18n ? merge({}, en, i18n) : en;
493 }
494 translate(id, replacements) {
495 return translate(id, this.translation, replacements);
496 }
497 translationKeyExists(path) {
498 return Boolean(get(this.translation, path));
499 }
500}
501tslib_1.__decorate([decorators.autobind], Intl.prototype, "translate", null);
502
503class Link {
504 constructor(linkComponent) {
505 this.linkComponent = linkComponent;
506 }
507 setLinkComponent(link) {
508 this.linkComponent = link;
509 }
510 getLinkComponent() {
511 return this.linkComponent;
512 }
513}
514
515function transformBreadcrumb(breadcrumb, shopOrigin) {
516 if (breadcrumb.content == null) {
517 throw new Error(`No content provided for breadcrumb (${JSON.stringify(breadcrumb)})`);
518 }
519 let target$$1;
520 if (breadcrumb.target) {
521 target$$1 = breadcrumb.target;
522 } else if (breadcrumb.url) {
523 target$$1 = getTargetFromURL(breadcrumb.url, shopOrigin);
524 } else {
525 target$$1 = undefined;
526 }
527 return {
528 label: breadcrumb.content,
529 href: breadcrumb.url,
530 target: target$$1,
531 message: target$$1 === 'app' ? generateCallback(breadcrumb.url) : breadcrumb.onAction
532 };
533}
534function transformAction(shopOrigin) {
535 return action => {
536 let style;
537 if (action.disabled) {
538 style = 'disabled';
539 } else if (action.destructive) {
540 style = 'danger';
541 }
542 let target$$1;
543 if (action.target) {
544 target$$1 = action.target;
545 } else if (action.url) {
546 target$$1 = action.external ? 'new' : getTargetFromURL(action.url, shopOrigin);
547 } else {
548 target$$1 = undefined;
549 }
550 return {
551 label: action.content,
552 href: action.url,
553 target: target$$1,
554 message: target$$1 === 'app' ? generateCallback(action.url) : action.onAction,
555 style
556 };
557 };
558}
559function transformActionGroup(shopOrigin) {
560 return actionGroup => {
561 return {
562 type: 'dropdown',
563 label: actionGroup.title,
564 links: actionGroup.actions.map(transformAction(shopOrigin))
565 };
566 };
567}
568// see https://en.wikipedia.org/wiki/Uniform_Resource_Identifier#Generic_syntax for more info on the URI scheme
569function getTargetFromURL(url, shopOrigin) {
570 if (isRootRelative(url) || isOriginHost(url, shopOrigin)) {
571 return 'shopify';
572 } else if (isSameHost(url) || isFragment(url) || isRelative(url) || isSchemeRelative(url)) {
573 return 'app';
574 } else {
575 return 'new';
576 }
577}
578function isRootRelative(url) {
579 return url.charAt(0) === '/' && url.charAt(1) !== '/';
580}
581function isOriginHost(url, shopOrigin) {
582 return shopOrigin && url.indexOf(shopOrigin) !== -1;
583}
584function isSameHost(url) {
585 const hostIndex = url.indexOf(window.location.hostname);
586 const firstDotIndex = url.indexOf('.');
587 return hostIndex >= 0 && hostIndex < firstDotIndex;
588}
589function isFragment(url) {
590 return url.charAt(0) === '#';
591}
592function isRelative(url) {
593 return url.charAt(0) !== '/' && url.toLowerCase().indexOf('http') !== 0;
594}
595function isSchemeRelative(url) {
596 return url.indexOf('//') === 0;
597}
598function generateCallback(url) {
599 if (url == null) {
600 return;
601 }
602 return () => {
603 window.location.assign(url);
604 };
605}
606function transformPagination(pagination) {
607 if (pagination == null) {
608 return undefined;
609 }
610 const hasNext = pagination.hasNext,
611 hasPrevious = pagination.hasPrevious,
612 nextURL = pagination.nextURL,
613 previousURL = pagination.previousURL,
614 onNext = pagination.onNext,
615 onPrevious = pagination.onPrevious;
616
617 const finalPagination = {};
618 if (hasNext) {
619 if (onNext) {
620 finalPagination.next = { message: onNext };
621 } else if (nextURL) {
622 finalPagination.next = { href: nextURL };
623 }
624 }
625 if (hasPrevious) {
626 if (onPrevious) {
627 finalPagination.previous = { message: onPrevious };
628 } else if (previousURL) {
629 finalPagination.previous = { href: previousURL };
630 }
631 }
632 return finalPagination;
633}
634
635class Bar {
636 constructor(messenger) {
637 this.messenger = messenger;
638 }
639 update(config) {
640 const title = config.title,
641 icon = config.icon,
642 breadcrumbs = config.breadcrumbs,
643 secondaryActions = config.secondaryActions,
644 actionGroups = config.actionGroups,
645 primaryAction = config.primaryAction,
646 pagination = config.pagination;
647
648 this.messenger.send('Shopify.API.Bar.initialize', {
649 buttons: {
650 primary: primaryAction ? transformAction(this.messenger.targetOrigin)(primaryAction) : undefined,
651 secondary: [...(secondaryActions || []).map(transformAction(this.messenger.targetOrigin)), ...(actionGroups || []).map(transformActionGroup(this.messenger.targetOrigin))]
652 },
653 title,
654 icon,
655 breadcrumb: getLastLevelBreadcrumb(breadcrumbs, this.messenger.targetOrigin),
656 pagination: transformPagination(pagination)
657 });
658 if (actionGroups) {
659 document.addEventListener('click', this.closeDropdown);
660 } else {
661 document.removeEventListener('click', this.closeDropdown);
662 }
663 }
664 closeDropdown() {
665 this.messenger.send('Shopify.API.Bar.closeDropdown');
666 }
667}
668tslib_1.__decorate([decorators.autobind], Bar.prototype, "closeDropdown", null);
669function getLastLevelBreadcrumb(breadcrumbs, shopOrigin) {
670 return breadcrumbs && breadcrumbs.length > 0 ? transformBreadcrumb(breadcrumbs[breadcrumbs.length - 1], shopOrigin) : undefined;
671}
672
673class Modal {
674 constructor(messenger) {
675 this.messenger = messenger;
676 }
677 open(config) {
678 const title = config.title,
679 primaryAction = config.primaryAction,
680 secondaryActions = config.secondaryActions,
681 src = config.src,
682 width = config.width,
683 height = config.height,
684 onClose = config.onClose;
685
686 if (onClose != null) {
687 this.storeCloseCallback(onClose);
688 }
689 this.messenger.send('Shopify.API.Modal.open', {
690 src,
691 title,
692 width,
693 height,
694 buttons: {
695 primary: primaryAction ? transformAction(this.messenger.targetOrigin)(primaryAction) : undefined,
696 secondary: secondaryActions ? secondaryActions.map(transformAction(this.messenger.targetOrigin)) : undefined
697 }
698 });
699 }
700 alert(config) {
701 const children = config.children,
702 title = config.title,
703 destructive = config.destructive,
704 confirmContent = config.confirmContent,
705 cancelContent = config.cancelContent,
706 onClose = config.onClose,
707 onConfirm = config.onConfirm;
708
709 this.storeCloseCallback(result => {
710 if (result) {
711 if (onConfirm) {
712 onConfirm();
713 }
714 } else if (onClose) {
715 onClose();
716 }
717 });
718 if (onClose && cancelContent) {
719 this.messenger.send('Shopify.API.Modal.confirm', {
720 message: {
721 title,
722 message: children,
723 okButton: confirmContent,
724 cancelButton: cancelContent,
725 style: destructive ? 'danger' : undefined
726 }
727 });
728 } else {
729 this.messenger.send('Shopify.API.Modal.alert', {
730 message: {
731 title,
732 message: children,
733 okButton: confirmContent,
734 style: destructive ? 'danger' : undefined
735 }
736 });
737 }
738 }
739 close(result, data) {
740 if (this.closeCallback == null) {
741 return;
742 }
743 this.messenger.send('Shopify.API.Modal.close', {
744 result,
745 data
746 });
747 }
748 storeCloseCallback(callback) {
749 this.closeCallback = callback;
750 }
751 callCloseCallback(result, data) {
752 const closeCallback = this.closeCallback;
753
754 if (typeof closeCallback === 'function') {
755 delete this.closeCallback;
756 closeCallback(result, data);
757 }
758 }
759}
760
761class ResourcePicker {
762 constructor(messenger, modal) {
763 this.messenger = messenger;
764 this.modal = modal;
765 }
766 close() {
767 this.modal.close();
768 }
769 open({ title, products, collections, allowMultiple = false, showHidden = true, onCancel, onSelection }) {
770 this.modal.storeCloseCallback((success, data) => {
771 if (!success) {
772 if (onCancel != null) {
773 onCancel();
774 }
775 return;
776 }
777 if (onSelection == null) {
778 return;
779 }
780 onSelection(data);
781 });
782 const resources = [];
783 if (products) {
784 resources.push('products');
785 }
786 if (collections) {
787 resources.push('collections');
788 }
789 if (collections) {
790 this.messenger.send('Shopify.API.Modal.collectionPicker', {
791 title,
792 selectMultiple: allowMultiple,
793 // eslint-disable-next-line camelcase
794 show_hidden: showHidden,
795 // eslint-disable-next-line camelcase
796 selectable_resources: resources
797 });
798 } else {
799 this.messenger.send('Shopify.API.Modal.productPicker', {
800 title,
801 selectMultiple: allowMultiple,
802 // eslint-disable-next-line camelcase
803 show_hidden: showHidden,
804 // eslint-disable-next-line camelcase
805 selectable_resources: resources
806 });
807 }
808 }
809}
810
811// eslint-disable-next-line typescript/no-var-requires
812const CoreWeakMap = require('core-js/library/es6/weak-map');
813class Messenger {
814 constructor(target$$1, handlers, options) {
815 this.target = target$$1;
816 this.handlers = handlers;
817 this.targetOrigin = '*';
818 this.queue = [];
819 this.callbacks = {};
820 this.callbacksToID = new CoreWeakMap();
821 this.callbackIndex = 0;
822 if (typeof window === 'undefined') {
823 return;
824 }
825 this.name = options.name;
826 this.targetOrigin = options.targetOrigin;
827 this.debug = options.debug || false;
828 if (!this.targetOrigin.match(/^http(s)?:\/\//)) {
829 this.warn('warning: targetOrigin should include the protocol');
830 }
831 window.addEventListener('message', this.handleMessage.bind(this), false);
832 }
833 setTarget(target$$1) {
834 this.target = target$$1;
835 this.tryToDequeue();
836 }
837 send(message, data) {
838 const normalizedPayload = this.normalizePayload(data);
839 const newMessage = {
840 message,
841 data: normalizedPayload
842 };
843 const messageString = JSON.stringify(newMessage);
844 if (this.target != null) {
845 this.log(`Posting message: ${messageString} to ${this.targetOrigin} }`);
846 this.target.postMessage(messageString, this.targetOrigin);
847 } else {
848 this.log(`Queueing message: ${messageString}`);
849 this.queue.push(newMessage);
850 }
851 return normalizedPayload;
852 }
853 tryToDequeue() {
854 const queue = this.queue,
855 target$$1 = this.target;
856
857 if (target$$1 == null || queue.length === 0) {
858 return;
859 }
860 this.queue.forEach(message => {
861 target$$1.postMessage(message, '*');
862 });
863 this.queue.length = 0;
864 }
865 log(message) {
866 if (!this.debug) {
867 return;
868 }
869 // eslint-disable-next-line no-console
870 console.log(`[${this.name} Messenger]: ${message}`);
871 }
872 warn(message) {
873 if (!this.debug) {
874 return;
875 }
876 // eslint-disable-next-line no-console
877 console.warn(`[${this.name} Messenger]: ${message}`);
878 }
879 storeCallback(callback) {
880 // Optimization, so we don’t store a new callback ID for callbacks
881 // we have sent before
882 if (this.callbacksToID.has(callback)) {
883 return this.callbacksToID.get(callback);
884 }
885 const id = `EASDKCallback${this.callbackIndex++}`;
886 this.callbacks[id] = callback;
887 this.callbacksToID.set(callback, id);
888 return id;
889 }
890 normalizePayload(payload) {
891 if (payload == null) {
892 return payload;
893 }
894 if (typeof payload === 'function') {
895 return this.storeCallback(payload);
896 } else if (payload instanceof Array) {
897 return payload.map(newPayload => {
898 return this.normalizePayload(newPayload);
899 });
900 } else if (typeof payload === 'object') {
901 return Object.keys(payload).reduce((newPayload, key) => {
902 newPayload[key] = this.normalizePayload(payload[key]);
903 return newPayload;
904 }, {});
905 } else {
906 return payload;
907 }
908 }
909 handleMessage(event) {
910 if (!this.isFromTargetOrigin(event)) {
911 this.log(`client received ${event.data} from unknown origin ${event.origin}. Expected ${this.targetOrigin}`);
912 return;
913 }
914 this.log(`Received message: ${event.data} from ${event.origin}`);
915 let receivedMessage;
916 try {
917 receivedMessage = JSON.parse(event.data);
918 } catch (error) {
919 // eslint-disable-next-line no-console
920 console.error(`Received received invalid JSON and cannot process the message. ${error} : ${event.data} : ${JSON.stringify(event.data)}`);
921 return;
922 }
923 if (receivedMessage.message === Messenger.Messages.SET_WINDOW_LOCATION) {
924 this.windowLocation = receivedMessage.data;
925 } else {
926 this.invokeCallback(receivedMessage);
927 this.invokeHandler(receivedMessage);
928 }
929 }
930 isFromTargetOrigin({ origin }) {
931 return origin != null && origin === this.targetOrigin;
932 }
933 invokeCallback(receivedMessage) {
934 const callback = this.callbacks[receivedMessage.message];
935 if (typeof callback === 'function') {
936 // eslint-disable-next-line callback-return
937 callback();
938 }
939 }
940 invokeHandler(receivedMessage) {
941 const handler = this.handlers[receivedMessage.message];
942 if (typeof handler === 'function') {
943 handler(receivedMessage.data);
944 }
945 }
946 set windowLocation(location) {
947 window.location = location;
948 }
949}
950Messenger.Messages = Object.freeze({
951 SET_WINDOW_LOCATION: 'Shopify.API.setWindowLocation'
952});
953
954class EASDK {
955 constructor({ apiKey, shopOrigin, debug, forceRedirect }, metadata) {
956 checkFrameRedirect(apiKey, shopOrigin, forceRedirect);
957 this.messenger = new Messenger(window.parent, {
958 'Shopify.API.initialize': data => {
959 if (data && data.User && data.User.current) {
960 this.currentUser = data.User.current;
961 }
962 },
963 'Shopify.API.Modal.close': ({ result, data }) => {
964 this.Modal.callCloseCallback(result, data);
965 }
966 }, {
967 name: 'iframe',
968 targetOrigin: shopOrigin,
969 debug
970 });
971 this.Bar = new Bar(this.messenger);
972 this.Modal = new Modal(this.messenger);
973 this.ResourcePicker = new ResourcePicker(this.messenger, this.Modal);
974 this.messenger.send('Shopify.API.initialize', {
975 apiKey,
976 shopOrigin,
977 metadata,
978 debug,
979 forceRedirect
980 });
981 }
982 startLoading() {
983 this.messenger.send('Shopify.API.Bar.loading.on');
984 }
985 stopLoading() {
986 this.messenger.send('Shopify.API.Bar.loading.off');
987 }
988 showFlashNotice(message, options = {}) {
989 var _options$error = options.error;
990 const error = _options$error === undefined ? false : _options$error;
991
992 const type = error ? 'Shopify.API.flash.error' : 'Shopify.API.flash.notice';
993 this.messenger.send(type, { message });
994 }
995 pushState(location) {
996 this.messenger.send('Shopify.API.pushState', { location });
997 }
998 redirect(location) {
999 this.messenger.send('Shopify.API.redirect', { location });
1000 }
1001}
1002tslib_1.__decorate([decorators.autobind], EASDK.prototype, "startLoading", null);
1003tslib_1.__decorate([decorators.autobind], EASDK.prototype, "stopLoading", null);
1004tslib_1.__decorate([decorators.autobind], EASDK.prototype, "showFlashNotice", null);
1005tslib_1.__decorate([decorators.autobind], EASDK.prototype, "pushState", null);
1006tslib_1.__decorate([decorators.autobind], EASDK.prototype, "redirect", null);
1007function checkFrameRedirect(apiKey, shopOrigin = 'https://myshopify.com', forceRedirect) {
1008 if (window !== window.parent) {
1009 return;
1010 }
1011 let redirectUrl = `${shopOrigin}/admin/apps/`;
1012 if (apiKey) {
1013 redirectUrl = `${redirectUrl}${apiKey}${window.location.pathname}${window.location.search}`;
1014 }
1015 if (forceRedirect) {
1016 window.location.assign(redirectUrl);
1017 } else {
1018 // eslint-disable-next-line no-console
1019 console.warn(`Embedded app was not loaded in an iframe and redirecting is disabled. Set forceRedirect to true and this page will redirect to: ${redirectUrl}`);
1020 }
1021}
1022
1023var name = "@combine-labs/combine-polaris";
1024var description = "Combine Lab's product component library. Forked from Shopify's Polaris.";
1025var version = "0.1.6";
1026var license = "MIT";
1027var author = "Steve Kaschinske <steve.kaschinske@gmail.com>";
1028var homepage = "https://github.com/Combine-Labs/combine-polaris";
1029var repository = "https://github.com/Combine-Labs/combine-polaris";
1030var publishConfig = {"access":"public"};
1031var keywords = ["combine labs","react","components","component library"];
1032var main = "index.js";
1033var module$1 = "index.es.js";
1034var types = "types/index.d.ts";
1035var scripts = {"lint":"npm-run-all lint:js lint:css","lint:css":"stylelint './**/*.scss' --max-warnings 0","lint:js":"eslint './**/*.{js,jsx,ts,tsx}' --max-warnings 0 --format codeframe","format":"npm-run-all format:js format:css format:prettier","format:css":"yarn run lint:css --fix","format:js":"yarn run lint:js --fix","format:prettier":"prettier '**/*.{json,md,yml}' --write","ts":"tsc --noEmit","test":"jest --config ./config/jest/config.json","test:coverage":"yarn test --coverage --no-cache","test:ci":"yarn test --runInBand --coverage","test:watch":"yarn test --watch","check":"npm-run-all lint ts test","check:ci":"npm-run-all lint ts test:ci","clean":"rimraf build build-esnext esnext styles types docs 'build-intermediate' 'index.*' 'embedded.js' './src/styles/polaris-tokens' './tophat/.cache' './tophat/assets' 'styles.{css,scss}'","optimize":"node ./scripts/optimize.js","prebuild":"npm-run-all clean optimize copy-polaris-tokens","build":"babel-node ./scripts/build.js","build-shrink-ray":"yarn run copy-polaris-tokens && node ./scripts/build-shrink-ray.js","copy-polaris-tokens":"rimraf ./src/styles/polaris-tokens && shx cp -r ./node_modules/@shopify/polaris-tokens/dist ./src/styles/polaris-tokens","dev":"yarn run copy-polaris-tokens && webpack-dev-server --config ./playground/webpack.config.js --content-base ./playground/ --hot --inline","tophat":"yarn run copy-polaris-tokens && node ./tophat/index.js --watch","test:percy":"node ./tophat/snapshots.js","test:a11y":"node ./scripts/pa11y.js","start":"node ./tophat/index.js","heroku-postbuild":"yarn run copy-polaris-tokens && webpack --config ./tophat/webpack.config.js --output-path ./tophat/assets"};
1036var stylelint = {"extends":["stylelint-config-shopify/prettier"],"rules":{"selector-class-pattern":"^[a-zA-Z][a-zA-Z0-9-]+$","selector-pseudo-class-no-unknown":[true,{"ignorePseudoClasses":["global"]}]}};
1037var devDependencies = {"@babel/generator":"^7.0.0-beta.51","@babel/parser":"^7.0.0-beta.51","@babel/standalone":"^7.0.0-beta.51","@percy/puppeteer":"^0.3.2","@shopify/js-uploader":"github:shopify/js-uploader","@shopify/polaris-tokens":"^1.2.0","@shopify/react-serialize":"^1.0.6","@types/enzyme":"^3.1.13","@types/jest":"^21.1.2","@types/lodash":"^4.14.108","@types/lodash-decorators":"^4.0.0","@types/node":"^8.10.17","@types/react-helmet":"^5.0.6","@types/react-hot-loader":"^3.0.6","@types/react-router-dom":"^4.2.7","archiver":"^2.1.0","awesome-typescript-loader":"^3.1.3","aws-sdk":"^2.58.0","babel":"^6.23.0","babel-cli":"^6.26.0","babel-core":"^6.26.3","babel-jest":"^21.2.0","babel-loader":"^7.1.2","babel-plugin-transform-jsx-html":"^1.0.0","babel-plugin-transform-object-rest-spread":"^6.26.0","babel-plugin-transform-react-jsx":"^6.24.1","babel-polyfill":"^6.26.0","babel-preset-env":"^1.7.0","babel-preset-es2015":"^6.24.1","babel-preset-react":"^6.24.1","babel-preset-shopify":"^16.2.0","babel-preset-stage-0":"^6.24.1","babel-register":"^6.26.0","chalk":"^2.4.1","change-case":"^3.0.1","codecov":"^3.0.4","copyfiles":"^1.2.0","crypto":"^1.0.1","css-loader":"^0.28.3","cssnano":"^3.10.0","enzyme":"^3.6.0","enzyme-adapter-react-16":"^1.5.0","eslint":"^5.5.0","eslint-plugin-shopify":"^25.0.1","express":"^4.16.3","file-loader":"^1.1.11","fs-extra":"^4.0.2","generic-names":"^1.0.2","glob":"^7.1.2","gray-matter":"^4.0.1","identity-obj-proxy":"^3.0.0","image-webpack-loader":"^3.3.1","in-publish":"^2.0.0","isomorphic-fetch":"^2.2.1","jest":"^21.2.1","node-sass":"^4.5.3","npm-run-all":"^4.0.2","object-hash":"^1.3.0","pa11y":"^5.0.4","postcss":"^6.0.1","postcss-loader":"^2.0.5","postcss-modules-extract-imports":"^1.1.0","postcss-modules-local-by-default":"^1.2.0","postcss-modules-parser":"^1.1.1","postcss-modules-scope":"^1.1.0","postcss-modules-values":"^1.3.0","postcss-shopify":"^1.0.0","prettier":"^1.14.2","puppeteer":"^1.5.0","react":"^16.4.0","react-dom":"^16.4.0","react-helmet":"^5.2.0","react-router-dom":"^4.3.1","react-test-renderer":"^16.3.1","rimraf":"^2.6.1","rollup":"^0.50.0","rollup-plugin-babel":"^3.0.2","rollup-plugin-commonjs":"^8.0.2","rollup-plugin-json":"^2.1.1","rollup-plugin-node-resolve":"^3.0.0","rollup-pluginutils":"^2.0.1","sass-loader":"^7.0.3","sass-resources-loader":"^1.3.3","semver":"^5.4.1","shelljs":"^0.7.7","shx":"^0.2.2","style-loader":"^0.19.0","stylelint":"^9.5.0","stylelint-config-shopify":"^7.0.2","svgo":"^0.7.2","tslint":"^5.8.0","typescript":"^2.9.1","url-loader":"^1.0.1","webpack":"^3.7.1","webpack-bundle-analyzer":"^2.11.1","webpack-dev-server":"^2.9.3","yargs":"^12.0.1"};
1038var peerDependencies = {"react":"^16.3.1","react-dom":"^16.3.1"};
1039var files = ["esnext","styles","types","docs","index.js","index.es.js","styles.css","styles.scss","embedded.js","embedded.d.ts"];
1040var dependencies = {"@shopify/images":"^1.1.0","@shopify/javascript-utilities":"^2.2.0","@shopify/react-compose":"^0.1.6","@shopify/react-html":"^3.0.3","@shopify/react-utilities":"^2.0.3","@types/prop-types":"^15.5.2","@types/react":"16.4.1","@types/react-dom":"^16.0.6","@types/react-transition-group":"^2.0.7","babel-runtime":"^6.23.0","core-js":"^2.5.1","hoist-non-react-statics":"^2.5.0","lodash":"^4.17.4","lodash-decorators":"^4.3.5","prop-types":"^15.6.1","react-transition-group":"^2.3.0","tslib":"^1.8.0"};
1041var packageJSON = {
1042 name: name,
1043 description: description,
1044 version: version,
1045 license: license,
1046 author: author,
1047 homepage: homepage,
1048 repository: repository,
1049 publishConfig: publishConfig,
1050 keywords: keywords,
1051 main: main,
1052 module: module$1,
1053 types: types,
1054 scripts: scripts,
1055 stylelint: stylelint,
1056 devDependencies: devDependencies,
1057 peerDependencies: peerDependencies,
1058 files: files,
1059 dependencies: dependencies,
1060 "private": false,
1061 "jsnext:main": "index.es.js"
1062};
1063
1064const METADATA = {
1065 interface: {
1066 name: packageJSON.name,
1067 version: packageJSON.version
1068 }
1069};
1070const REPLACE_REGEX = /{([^}]*)}/g;
1071function translate(id, translations, replacements) {
1072 const text = get(translations, id);
1073 if (!text) {
1074 return '';
1075 }
1076 if (replacements) {
1077 return replace(text, REPLACE_REGEX, match => {
1078 const replacement = match.substring(1, match.length - 1);
1079 if (!replacements.hasOwnProperty(replacement)) {
1080 throw new Error(`No replacement found for key '${replacement}'. The following replacements were passed: ${Object.keys(replacements).map(key => `'${key}'`).join(', ')}`);
1081 }
1082 return replacements[replacement];
1083 });
1084 }
1085 return text;
1086}
1087function withAppProvider() {
1088 return function addProvider(WrappedComponent) {
1089 // eslint-disable-next-line react/prefer-stateless-function
1090 class WithProvider extends React.Component {
1091 render() {
1092 var _context = this.context;
1093 const polaris = _context.polaris,
1094 easdk = _context.easdk;
1095
1096 const polarisContext = Object.assign({}, polaris, { easdk });
1097 if (!polaris) {
1098 throw new Error(`The <AppProvider> component is required as of v2.0 of Polaris React. See
1099 https://polaris.shopify.com/components/structure/app-provider for implementation
1100 instructions.`);
1101 }
1102 return React.createElement(WrappedComponent, Object.assign({}, this.props, { polaris: polarisContext }));
1103 }
1104 }
1105 WithProvider.contextTypes = WrappedComponent.contextTypes ? merge(WrappedComponent.contextTypes, polarisAppProviderContextTypes) : polarisAppProviderContextTypes;
1106 const FinalComponent = hoistStatics(WithProvider, WrappedComponent);
1107 return FinalComponent;
1108 };
1109}
1110function withSticky() {
1111 return function addStickyManager(WrappedComponent) {
1112 class WithStickyManager extends React.Component {
1113 constructor(props, context) {
1114 super(props);
1115 this.stickyManager = new StickyManager();
1116 const polaris = context.polaris,
1117 easdk = context.easdk;
1118
1119 this.polarisContext = Object.assign({}, polaris, { stickyManager: this.stickyManager, easdk });
1120 }
1121 getChildContext() {
1122 const _a = this.polarisContext,
1123 easdk = _a.easdk,
1124 rest = tslib_1.__rest(_a, ["easdk"]);
1125 return {
1126 polaris: rest,
1127 easdk
1128 };
1129 }
1130 render() {
1131 return React.createElement(WrappedComponent, Object.assign({}, this.props, { polaris: this.polarisContext }));
1132 }
1133 }
1134 WithStickyManager.childContextTypes = polarisAppProviderContextTypes;
1135 WithStickyManager.contextTypes = WrappedComponent.contextTypes ? merge(WrappedComponent.contextTypes, polarisAppProviderContextTypes) : polarisAppProviderContextTypes;
1136 const FinalComponent = hoistStatics(WithStickyManager, WrappedComponent);
1137 return FinalComponent;
1138 };
1139}
1140function createPolarisContext({ i18n, linkComponent, apiKey, shopOrigin, forceRedirect, debug, stickyManager } = {}) {
1141 const intl = new Intl(i18n);
1142 const link = new Link(linkComponent);
1143 const easdk = apiKey && shopOrigin ? new EASDK({
1144 apiKey,
1145 shopOrigin,
1146 forceRedirect,
1147 debug
1148 }, METADATA) : undefined;
1149 return {
1150 polaris: {
1151 intl,
1152 link,
1153 stickyManager: stickyManager || new StickyManager()
1154 },
1155 easdk
1156 };
1157}
1158
1159class AppProvider$1 extends React.Component {
1160 constructor(props) {
1161 super(props);
1162 this.stickyManager = new StickyManager();
1163 this.polarisContext = createPolarisContext(Object.assign({}, props, { stickyManager: this.stickyManager }));
1164 }
1165 componentDidMount() {
1166 if (document != null) {
1167 this.stickyManager.setContainer(document);
1168 }
1169 }
1170 // eslint-disable-next-line react/no-deprecated
1171 componentWillReceiveProps({ i18n, linkComponent, apiKey, shopOrigin, forceRedirect, debug }) {
1172 if (i18n !== this.props.i18n || linkComponent !== this.props.linkComponent || apiKey !== this.props.apiKey || shopOrigin !== this.props.shopOrigin || forceRedirect !== this.props.forceRedirect || debug !== this.props.debug) {
1173 const stickyManager = this.stickyManager;
1174 this.polarisContext = createPolarisContext({
1175 i18n,
1176 linkComponent,
1177 apiKey,
1178 shopOrigin,
1179 forceRedirect,
1180 debug,
1181 stickyManager
1182 });
1183 }
1184 }
1185 getChildContext() {
1186 return this.polarisContext;
1187 }
1188 render() {
1189 return React.Children.only(this.props.children);
1190 }
1191}
1192AppProvider$1.childContextTypes = polarisAppProviderContextTypes;
1193
1194var add = {"viewBox":"0 0 20 20","body":"<path d=\"M17 9h-6V3a1 1 0 1 0-2 0v6H3a1 1 0 1 0 0 2h6v6a1 1 0 1 0 2 0v-6h6a1 1 0 1 0 0-2\" fill-rule=\"evenodd\"/>"};
1195
1196var alert = {"viewBox":"0 0 20 20","body":"<path d=\"M10 18a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm-1-8h2V6H9v4zm0 4h2v-2H9v2z\" fill-rule=\"evenodd\"/>"};
1197
1198var arrowDown = {"viewBox":"0 0 20 20","body":"<path d=\"M10.707 17.707l5-5a.999.999 0 1 0-1.414-1.414L11 14.586V3a1 1 0 1 0-2 0v11.586l-3.293-3.293a.999.999 0 1 0-1.414 1.414l5 5a.999.999 0 0 0 1.414 0\" fill-rule=\"evenodd\"/>"};
1199
1200var arrowLeft = {"viewBox":"0 0 20 20","body":"<path d=\"M17 9H5.414l3.293-3.293a.999.999 0 1 0-1.414-1.414l-5 5a.999.999 0 0 0 0 1.414l5 5a.997.997 0 0 0 1.414 0 .999.999 0 0 0 0-1.414L5.414 11H17a1 1 0 1 0 0-2\" fill-rule=\"evenodd\"/>"};
1201
1202var arrowRight = {"viewBox":"0 0 20 20","body":"<path d=\"M17.707 9.293l-5-5a.999.999 0 1 0-1.414 1.414L14.586 9H3a1 1 0 1 0 0 2h11.586l-3.293 3.293a.999.999 0 1 0 1.414 1.414l5-5a.999.999 0 0 0 0-1.414\" fill-rule=\"evenodd\"/>"};
1203
1204var arrowUp = {"viewBox":"0 0 20 20","body":"<path d=\"M11 17V5.414l3.293 3.293a.999.999 0 1 0 1.414-1.414l-5-5a.999.999 0 0 0-1.414 0l-5 5a.997.997 0 0 0 0 1.414.999.999 0 0 0 1.414 0L9 5.414V17a1 1 0 1 0 2 0\" fill-rule=\"evenodd\"/>"};
1205
1206var arrowUpDown = {"viewBox":"0 0 20 20","body":"<path d=\"M13 8l-3-3-3 3h6zm-.1 4L10 14.9 7.1 12h5.8z\" fill-rule=\"evenodd\"/>"};
1207
1208var calendar = {"viewBox":"0 0 20 20","body":"<path d=\"M4 8h12V6H4v2zm9 4h2v-2h-2v2zm-4 0h2v-2H9v2zm0 4h2v-2H9v2zm-4-4h2v-2H5v2zm0 4h2v-2H5v2zM17 4h-2V3a1 1 0 1 0-2 0v1H7V3a1 1 0 1 0-2 0v1H3a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1V5a1 1 0 0 0-1-1z\" fill-rule=\"evenodd\"/>"};
1209
1210var cancel = {"viewBox":"0 0 20 20","body":"<path d=\"M11.414 10l6.293-6.293a.999.999 0 1 0-1.414-1.414L10 8.586 3.707 2.293a.999.999 0 1 0-1.414 1.414L8.586 10l-6.293 6.293a.999.999 0 1 0 1.414 1.414L10 11.414l6.293 6.293a.997.997 0 0 0 1.414 0 .999.999 0 0 0 0-1.414L11.414 10z\" fill-rule=\"evenodd\"/>"};
1211
1212var cancelSmall = {"viewBox":"0 0 20 20","body":"<path d=\"M11.414 10l4.293-4.293a.999.999 0 1 0-1.414-1.414L10 8.586 5.707 4.293a.999.999 0 1 0-1.414 1.414L8.586 10l-4.293 4.293a.999.999 0 1 0 1.414 1.414L10 11.414l4.293 4.293a.997.997 0 0 0 1.414 0 .999.999 0 0 0 0-1.414L11.414 10z\" fill-rule=\"evenodd\"/>"};
1213
1214var caretDown = {"viewBox":"0 0 20 20","body":"<path d=\"M5 8l5 5 5-5z\" fill-rule=\"evenodd\"/>"};
1215
1216var caretUp = {"viewBox":"0 0 20 20","body":"<path d=\"M15 12l-5-5-5 5z\" />"};
1217
1218var checkmark = {"viewBox":"0 0 20 20","body":"<path d=\"M8.315 13.859l-3.182-3.417a.506.506 0 0 1 0-.684l.643-.683a.437.437 0 0 1 .642 0l2.22 2.393 4.942-5.327a.437.437 0 0 1 .643 0l.643.684a.504.504 0 0 1 0 .683l-5.91 6.35a.437.437 0 0 1-.642 0\"/>"};
1219
1220var chevronDown = {"viewBox":"0 0 20 20","body":"<path d=\"M10 14a.997.997 0 0 1-.707-.293l-5-5a.999.999 0 1 1 1.414-1.414L10 11.586l4.293-4.293a.999.999 0 1 1 1.414 1.414l-5 5A.997.997 0 0 1 10 14\" fill-rule=\"evenodd\"/>"};
1221
1222var chevronLeft = {"viewBox":"0 0 20 20","body":"<path d=\"M12 16a.997.997 0 0 1-.707-.293l-5-5a.999.999 0 0 1 0-1.414l5-5a.999.999 0 1 1 1.414 1.414L8.414 10l4.293 4.293A.999.999 0 0 1 12 16\" fill-rule=\"evenodd\"/>"};
1223
1224var chevronRight = {"viewBox":"0 0 20 20","body":"<path d=\"M8 16a.999.999 0 0 1-.707-1.707L11.586 10 7.293 5.707a.999.999 0 1 1 1.414-1.414l5 5a.999.999 0 0 1 0 1.414l-5 5A.997.997 0 0 1 8 16\" fill-rule=\"evenodd\"/>"};
1225
1226var chevronUp = {"viewBox":"0 0 20 20","body":"<path d=\"M15 13a.997.997 0 0 1-.707-.293L10 8.414l-4.293 4.293a.999.999 0 1 1-1.414-1.414l5-5a.999.999 0 0 1 1.414 0l5 5A.999.999 0 0 1 15 13\" fill-rule=\"evenodd\"/>"};
1227
1228var circleCancel = {"viewBox":"0 0 20 20","body":"<path d=\"M14.242 12.829l-1.414 1.414L10 11.413l-2.828 2.83-1.414-1.414 2.828-2.83-2.828-2.827 1.414-1.414L10 8.586l2.828-2.828 1.414 1.414L11.414 10l2.828 2.829zM10 1.999A8 8 0 1 0 10 18a8 8 0 0 0 0-16z\" fill-rule=\"evenodd\"/>"};
1229
1230var circleChevronDown = {"viewBox":"0 0 20 20","body":"<path d=\"M10 13.414L5.293 8.707l1.414-1.414L10 10.586l3.293-3.293 1.414 1.414L10 13.414zM10 2a8 8 0 1 0 0 16 8 8 0 0 0 0-16z\" fill-rule=\"evenodd\"/>"};
1231
1232var circleChevronLeft = {"viewBox":"0 0 20 20","body":"<path d=\"M11.293 5.293l1.414 1.414L9.414 10l3.293 3.293-1.414 1.414L6.586 10l4.707-4.707zM10 2a8 8 0 1 0 0 16 8 8 0 0 0 0-16z\" fill-rule=\"evenodd\"/>"};
1233
1234var circleChevronRight = {"viewBox":"0 0 20 20","body":"<path d=\"M8.707 14.707l-1.414-1.414L10.586 10 7.293 6.707l1.414-1.414L13.414 10l-4.707 4.707zM10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16z\" fill-rule=\"evenodd\"/>"};
1235
1236var circleChevronUp = {"viewBox":"0 0 20 20","body":"<path d=\"M14.707 11.293l-1.414 1.414L10 9.414l-3.293 3.293-1.414-1.414L10 6.586l4.707 4.707zM18 10a8 8 0 1 0-16 0 8 8 0 0 0 16 0z\" fill-rule=\"evenodd\"/>"};
1237
1238var circleInformation = {"viewBox":"0 0 20 20","body":"<path d=\"M19 10c0 4.971-4.029 9-9 9s-9-4.029-9-9 4.029-9 9-9 9 4.029 9 9z\" fill=\"currentColor\"/><path d=\"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zm1-5v-3a1 1 0 0 0-1-1H9a1 1 0 1 0 0 2v3a1 1 0 0 0 1 1h1a1 1 0 1 0 0-2zm-1-5.9a1.1 1.1 0 1 0 0-2.2 1.1 1.1 0 0 0 0 2.2z\" />"};
1239
1240var circlePlus = {"viewBox":"0 0 20 20","body":"<path d=\"M15 11h-4v4H9v-4H5V9h4V5h2v4h4v2zm-5-9a8 8 0 1 0 0 16 8 8 0 0 0 0-16z\" fill-rule=\"evenodd\"/>"};
1241
1242var conversation = {"viewBox":"0 0 20 20","body":"<path d=\"M13 11h2V9h-2v2zm-4 0h2V9H9v2zm-4 0h2V9H5v2zm5-9c-4.411 0-8 3.589-8 8 0 1.504.425 2.908 1.15 4.111l-1.069 2.495a1 1 0 0 0 1.314 1.313l2.494-1.069A7.939 7.939 0 0 0 10 18c4.411 0 8-3.589 8-8s-3.589-8-8-8z\" fill-rule=\"evenodd\"/>"};
1243
1244var deleteIcon = {"viewBox":"0 0 20 20","body":"<path d=\"M16 6H4a1 1 0 1 0 0 2h1v9a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V8h1a1 1 0 1 0 0-2zM9 4a1 1 0 1 1 0-2h2a1 1 0 1 1 0 2H9zm2 12h2V8h-2v8zm-4 0h2V8H7v8z\" fill-rule=\"evenodd\"/>"};
1245
1246var disable = {"viewBox":"0 0 20 20","body":"<path d=\"M10 16a5.961 5.961 0 0 1-3.471-1.115l8.356-8.356A5.961 5.961 0 0 1 16 10c0 3.309-2.691 6-6 6m0-12c1.294 0 2.49.416 3.471 1.115l-8.356 8.356A5.961 5.961 0 0 1 4 10c0-3.309 2.691-6 6-6m0-2c-4.411 0-8 3.589-8 8s3.589 8 8 8 8-3.589 8-8-3.589-8-8-8\" fill-rule=\"evenodd\"/>"};
1247
1248var dispute = {"viewBox":"0 0 20 20","body":"<path d=\"M9 10h2V6H9v4zm0 4h2v-2H9v2zm-7-4c0 4.411 3.589 8 8 8a7.939 7.939 0 0 0 4.111-1.15l2.494 1.069a1 1 0 0 0 1.314-1.313l-1.069-2.495A7.939 7.939 0 0 0 18 10c0-4.411-3.589-8-8-8s-8 3.589-8 8z\" fill-rule=\"evenodd\"/>"};
1249
1250var duplicate = {"viewBox":"0 0 20 20","body":"<path d=\"M8 12h8V4H8v8zm4 4H4V8h2v5a1 1 0 0 0 1 1h5v2zm5-14H7a1 1 0 0 0-1 1v3H3a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1v-3h3a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1z\" fill-rule=\"evenodd\"/>"};
1251
1252var embed = {"viewBox":"0 0 20 20","body":"<path d=\"M17 13a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-3a1 1 0 1 1 2 0v2h12v-2a1 1 0 0 1 1-1zm0-11a1 1 0 0 1 1 1v3a1 1 0 1 1-2 0V4H4v2a1 1 0 1 1-2 0V3a1 1 0 0 1 1-1h14zm.555 7.168a1.001 1.001 0 0 1 0 1.664l-3 2a1 1 0 0 1-1.109-1.664L15.198 10l-1.752-1.168a1 1 0 1 1 1.109-1.664l3 2zM6.832 7.445a1 1 0 0 1-.277 1.387L4.803 10l1.752 1.168a1 1 0 1 1-1.11 1.664l-3-2a1.001 1.001 0 0 1 0-1.664l3-2a1 1 0 0 1 1.387.277zM9 14.001a1 1 0 0 1-.948-1.317l2-6a1 1 0 0 1 1.896.633l-2 6A.999.999 0 0 1 9 14z\" fill-rule=\"evenodd\"/>"};
1253
1254var exportIcon = {"viewBox":"0 0 20 20","body":"<path d=\"M13.707 6.707a.997.997 0 0 1-1.414 0L11 5.414V13a1 1 0 1 1-2 0V5.414L7.707 6.707a.999.999 0 1 1-1.414-1.414l3-3a.999.999 0 0 1 1.414 0l3 3a.999.999 0 0 1 0 1.414zM17 18H3a1 1 0 1 1 0-2h14a1 1 0 1 1 0 2z\"/>"};
1255
1256var external = {"viewBox":"0 0 20 20","body":"<path d=\"M17 2a1 1 0 0 1 1 1v4a1 1 0 1 1-2 0V5.414l-7.293 7.293a.997.997 0 0 1-1.414 0 .999.999 0 0 1 0-1.414L14.586 4H13a1 1 0 1 1 0-2h4zm-4 9a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5a1 1 0 1 1 0 2H4v8h8v-4a1 1 0 0 1 1-1z\" fill-rule=\"evenodd\"/>"};
1257
1258var help = {"viewBox":"0 0 20 20","body":"<circle cx=\"10\" cy=\"10\" r=\"9\" fill=\"currentColor\"/><path d=\"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0m0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8m0-4a1 1 0 1 0 0 2 1 1 0 1 0 0-2m0-10C8.346 4 7 5.346 7 7a1 1 0 1 0 2 0 1.001 1.001 0 1 1 1.591.808C9.58 8.548 9 9.616 9 10.737V11a1 1 0 1 0 2 0v-.263c0-.653.484-1.105.773-1.317A3.013 3.013 0 0 0 13 7c0-1.654-1.346-3-3-3\" />"};
1259
1260var horizontalDots = {"viewBox":"0 0 20 20","body":"<path d=\"M6 10a2 2 0 1 1-4.001-.001A2 2 0 0 1 6 10zm6 0a2 2 0 1 1-4.001-.001A2 2 0 0 1 12 10zm6 0a2 2 0 1 1-4.001-.001A2 2 0 0 1 18 10z\" fill-rule=\"evenodd\"/>"};
1261
1262var importIcon = {"viewBox":"0 0 20 20","body":"<path d=\"M9.293 13.707l-3-3a.999.999 0 1 1 1.414-1.414L9 10.586V3a1 1 0 1 1 2 0v7.586l1.293-1.293a.999.999 0 1 1 1.414 1.414l-3 3a.999.999 0 0 1-1.414 0zM17 16a1 1 0 1 1 0 2H3a1 1 0 1 1 0-2h14z\"/>"};
1263
1264var menu = {"viewBox":"0 0 32 32","body":"<path d=\"M30.4 17.6H1.6a1.6 1.6 0 1 1 0-3.2h28.8a1.6 1.6 0 1 1 0 3.2zm0-11.2H1.6a1.6 1.6 0 1 1 0-3.2h28.8a1.6 1.6 0 1 1 0 3.2zm0 22.4H1.6a1.6 1.6 0 1 1 0-3.2h28.8a1.6 1.6 0 1 1 0 3.2z\"/>"};
1265
1266var notes = {"viewBox":"0 0 20 20","body":"<path d=\"M6 11h8V9H6v2zm0 4h8v-2H6v2zm0-8h4V5H6v2zm9.707-1.707l-3-3A.996.996 0 0 0 12 2H5a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V6a.997.997 0 0 0-.293-.707z\" fill-rule=\"evenodd\"/>"};
1267
1268var notification = {"viewBox":"0 0 20 20","body":"<path d=\"M16 8c0-2.967-2.167-5.432-5-5.91V1a1 1 0 1 0-2 0v1.09C6.167 2.568 4 5.033 4 8c0 2.957 0 4.586-1.707 6.293A1 1 0 0 0 3 16h4.183A2.909 2.909 0 0 0 7 17c0 1.654 1.345 3 3 3s3-1.346 3-3c0-.353-.07-.687-.184-1H17a1 1 0 0 0 .707-1.707C16 12.586 16 10.957 16 8zM5.011 14C6 12.208 6 10.285 6 8c0-2.206 1.794-4 4-4s4 1.794 4 4c0 2.285 0 4.208.989 6H5.011zM11 17a1.001 1.001 0 0 1-2 0 1 1 0 0 1 2 0z\"/>"};
1269
1270var print = {"viewBox":"0 0 20 20","body":"<path d=\"M14 11h2V9h-2v2zM7 7h6V4H7v3zm0 9h6v-2H7v2zm10-9h-2V3a1 1 0 0 0-1-1H6a1 1 0 0 0-1 1v4H3a1 1 0 0 0-1 1v7a1 1 0 0 0 1 1h2v1a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1v-1h2a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1z\" fill-rule=\"evenodd\"/>"};
1271
1272var subtract = {"viewBox":"0 0 20 20","body":"<path d=\"M15 9H5a1 1 0 1 0 0 2h10a1 1 0 1 0 0-2\" fill-rule=\"evenodd\"/>"};
1273
1274var refresh = {"viewBox":"0 0 20 20","body":"<path d=\"M17 11a1 1 0 0 1 1 1c0 1.654-1.346 3-3 3H5.414l1.293 1.293a.999.999 0 1 1-1.414 1.414l-3-3a.999.999 0 0 1 0-1.414l3-3a.999.999 0 1 1 1.414 1.414L5.414 13H15c.552 0 1-.449 1-1a1 1 0 0 1 1-1zM3 9a1 1 0 0 1-1-1c0-1.654 1.346-3 3-3h9.586l-1.293-1.293a.999.999 0 1 1 1.414-1.414l3 3a.999.999 0 0 1 0 1.414l-3 3a.997.997 0 0 1-1.414 0 .999.999 0 0 1 0-1.414L14.586 7H5c-.552 0-1 .449-1 1a1 1 0 0 1-1 1z\" fill-rule=\"evenodd\"/>"};
1275
1276var risk = {"viewBox":"0 0 20 20","body":"<path d=\"M9 12h2V8H9v4zm0 4h2v-2H9v2zm8.895.509l-7-14c-.339-.678-1.451-.678-1.79 0l-7 14A.999.999 0 0 0 3 17.956h14a1.001 1.001 0 0 0 .895-1.447z\" fill-rule=\"evenodd\"/>"};
1277
1278var save = {"viewBox":"0 0 20 20","body":"<path d=\"M17 4h-3a1 1 0 1 0 0 2h2v10H4V4h3.586L9 5.414v5.172L7.707 9.293a1 1 0 0 0-1.414 1.414l3 3a.996.996 0 0 0 1.414 0l3-3a1 1 0 0 0-1.414-1.414L11 10.586V5a.997.997 0 0 0-.293-.707l-2-2A.994.994 0 0 0 8 2H3a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1V5a1 1 0 0 0-1-1z\"/>"};
1279
1280var search = {"viewBox":"0 0 20 20","body":"<path d=\"M8 12a4 4 0 1 1 0-8 4 4 0 0 1 0 8m9.707 4.293l-4.82-4.82A5.968 5.968 0 0 0 14 8 6 6 0 0 0 2 8a6 6 0 0 0 6 6 5.968 5.968 0 0 0 3.473-1.113l4.82 4.82a.997.997 0 0 0 1.414 0 .999.999 0 0 0 0-1.414\" fill-rule=\"evenodd\"/>"};
1281
1282var view = {"viewBox":"0 0 20 20","body":"<path d=\"M17.928 9.628C17.836 9.399 15.611 4 9.999 4S2.162 9.399 2.07 9.628a1.017 1.017 0 0 0 0 .744C2.162 10.601 4.387 16 9.999 16s7.837-5.399 7.929-5.628a1.017 1.017 0 0 0 0-.744zM9.999 14a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6A2 2 0 1 0 10 12.001 2 2 0 0 0 10 8z\"/>"};
1283
1284var edit = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjAgMjAiPjxkZWZzPjxwYXRoIGlkPSJhIiBkPSJNMTUgMTcuNTg2TDEzLjkxNCAxNi41bC43OTMtLjc5M2EuOTk5Ljk5OSAwIDEgMC0xLjQxNC0xLjQxNGwtLjc5My43OTNMMTEuNDE0IDE0IDE0IDExLjQxNCAxNy41ODYgMTUgMTUgMTcuNTg2ek0zLjQzNyAxNC44NTJsMS43MTEgMS43MTEtMi41NjcuODU2Ljg1Ni0yLjU2N3pNNC45MTQgNy41bC43OTMtLjc5M2EuOTk5Ljk5OSAwIDEgMC0xLjQxNC0xLjQxNGwtLjc5My43OTNMMi40MTQgNSA1IDIuNDE0IDguNTg2IDYgNiA4LjU4NiA0LjkxNCA3LjV6bTEyLjU1MS00Ljk2NWExLjgzIDEuODMgMCAwIDEgMCAyLjU4NkwxNyA1LjU4NiAxNC40MTQgM2wuNDY1LS40NjVhMS44MyAxLjgzIDAgMCAxIDIuNTg2IDB6TTQuNDE1IDEzTDEzIDQuNDE0IDE1LjU4NiA3IDcgMTUuNTg2IDQuNDE0IDEzem0xNS4yOTIgMS4yOTNMMTUuNDE0IDEwbDMuNDY1LTMuNDY1YTMuODMyIDMuODMyIDAgMCAwIDAtNS40MTQgMy44MzQgMy44MzQgMCAwIDAtNS40MTQgMEwxMCA0LjU4NiA1LjcwNy4yOTNhLjk5OS45OTkgMCAwIDAtMS40MTQgMGwtNCA0YS45OTkuOTk5IDAgMCAwIDAgMS40MTRMNC41ODYgMTBsLTIuMjkzIDIuMjkzYS45OTYuOTk2IDAgMCAwLS4yNC4zOTFsLTIgNmEuOTk4Ljk5OCAwIDAgMCAxLjI2MyAxLjI2NGw2LTJhLjk5Ni45OTYgMCAwIDAgLjM5MS0uMjRMMTAgMTUuNDEzbDQuMjkzIDQuMjkzYS45OTcuOTk3IDAgMCAwIDEuNDE0IDBsNC00YS45OTkuOTk5IDAgMCAwIDAtMS40MTR6Ii8+PC9kZWZzPjx1c2UgZmlsbD0iIzMxMzczRCIgeGxpbms6aHJlZj0iI2EiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPgo=';
1285
1286var checkmarkLarge = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PHBhdGggZD0iTTE0Ljc5MyA1LjI5M2ExIDEgMCAwIDEgMS40MTQgMS40MTRsLTggOGExIDEgMCAwIDEtMS40MTQgMGwtMy0zYTEgMSAwIDAgMSAxLjQxNC0xLjQxNEw3LjUgMTIuNTg2bDcuMjkzLTcuMjkzeiIvPjwvc3ZnPgo=';
1287
1288var clock = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSI+PGNpcmNsZSBjeD0iMTAiIGN5PSIxMCIgcj0iOSIgZmlsbD0iI0ZGRiIvPjxwYXRoIGZpbGw9IiMwMDAiIGQ9Ik0xMCAwQzQuNDg2IDAgMCA0LjQ4NiAwIDEwczQuNDg2IDEwIDEwIDEwIDEwLTQuNDg2IDEwLTEwUzE1LjUxNCAwIDEwIDBtMCAxOGMtNC40MTEgMC04LTMuNTg5LTgtOHMzLjU4OS04IDgtOCA4IDMuNTg5IDggOC0zLjU4OSA4LTggOCIvPjxwYXRoIGZpbGw9IiMwMDAiIGQ9Ik0xMy43MDcgMTIuMjkzYTEgMSAwIDAgMS0xLjQxNCAxLjQxNEw5IDEwLjQxNFY1YTEgMSAwIDEgMSAyIDB2NC41ODZsMi43MDcgMi43MDd6Ii8+PC9nPjwvc3ZnPgo=';
1289
1290var notificationCircle = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGNpcmNsZSBjeD0iMTAiIGN5PSIxMCIgcj0iNSIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+Cg==';
1291
1292var activity = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PHBhdGggZmlsbD0iIzYzNzM4MSIgZD0iTTIuOTY3IDEwLjQwMmwtMS4zNDMgMi4wMTRhLjc1Ljc1IDAgMCAxLTEuMjQ4LS44MzJsMi0zYS43NS43NSAwIDAgMSAxLjI2Ny4wM2wyLjIgMy42NjcgMi40NTUtNi41NDRjLjI0NC0uNjUzIDEuMTY5LS42NDggMS40MDcuMDA3bDMuMjEgOC44MjYgMy4zNjQtMTEuNzc2Yy4yMDItLjcxIDEuMi0uNzMgMS40MzMtLjAzMWwyIDZhLjc1Ljc1IDAgMCAxLTEuNDI0LjQ3NGwtMS4yMzMtMy43LTMuMzM0IDExLjY2OWMtLjIuNy0xLjE3Ny43MzQtMS40MjYuMDVMOC45OSA4LjE2NWwtMi4yODcgNi4wOThhLjc1Ljc1IDAgMCAxLTEuMzQ1LjEyM2wtMi4zOS0zLjk4NHoiLz48L3N2Zz4K';
1293
1294var location = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PHBhdGggZmlsbD0iIzYzNzM4MSIgZmlsbC1vcGFjaXR5PSIuMjUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlPSIjNjM3MzgxIiBzdHJva2Utd2lkdGg9IjEuNSIgZD0iTTIuNzUgOGMwIDMuMDggMS4yOCA1LjgxMSAzLjQ0IDguMTczIDEuMzM4IDEuNDYyIDIuNzI1IDIuNDk2IDMuNjg4IDMuMDQ1YS4yNDYuMjQ2IDAgMCAwIC4yNDctLjAwMWMuOTYtLjU0OCAyLjM0Ny0xLjU4MiAzLjY4NS0zLjA0NEMxNS45NyAxMy44MSAxNy4yNSAxMS4wOCAxNy4yNSA4YzAtMy45OTgtMy4yNTMtNy4yNS03LjI1LTcuMjVTMi43NSA0LjAwMiAyLjc1IDh6bTQgMEEzLjI1MyAzLjI1MyAwIDAgMSAxMCA0Ljc1IDMuMjUzIDMuMjUzIDAgMCAxIDEzLjI1IDggMy4yNTMgMy4yNTMgMCAwIDEgMTAgMTEuMjUgMy4yNTMgMy4yNTMgMCAwIDEgNi43NSA4eiIvPjwvc3ZnPgo=';
1295
1296var misc = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2U9IiM2MzczODEiIHN0cm9rZS13aWR0aD0iMS41Ij48cmVjdCB3aWR0aD0iNy41IiBoZWlnaHQ9IjcuNSIgeD0iLjc1IiB5PSIuNzUiIGZpbGw9IiNGRkYiIHJ4PSIyIi8+PHJlY3Qgd2lkdGg9IjcuNSIgaGVpZ2h0PSI3LjUiIHg9Ii43NSIgeT0iMTEuNzUiIGZpbGw9IiM2MzczODEiIGZpbGwtb3BhY2l0eT0iLjI1IiByeD0iMiIvPjxyZWN0IHdpZHRoPSI3LjUiIGhlaWdodD0iNy41IiB4PSIxMS43NSIgeT0iMTEuNzUiIGZpbGw9IiNGRkYiIHJ4PSIyIi8+PHBhdGggc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBkPSJNMTUuNSA4VjFNMTIgNC41aDciLz48L2c+PC9zdmc+Cg==';
1297
1298var person = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMTAgMTNjLTQgMC03IDMtNyAzbDEgM2gxMmwxLTNzLTMtMy03LTMiLz48ZyBzdHJva2U9IiM2MzczODEiIHN0cm9rZS13aWR0aD0iMS41Ij48cGF0aCBmaWxsPSIjNjM3MzgxIiBmaWxsLW9wYWNpdHk9Ii4yNSIgZD0iTTEwIDEyLjc1Yy0xLjc2NyAwLTMuNDc0LjU1NS01LjA1OCAxLjQ5Mi0uOTc4LjU3Ny0xLjcyMSAxLjE4MS0yLjExOCAxLjU4MWEuMjUuMjUgMCAwIDAtLjA2MS4yNTZsMSAzQS4yNS4yNSAwIDAgMCA0IDE5LjI1aDEyYS4yNDkuMjQ5IDAgMCAwIC4yMzctLjE3MWwxLTNhLjI0OS4yNDkgMCAwIDAtLjA2LS4yNTZjLS40MS0uNDEtMS4xNDEtMS4wMDQtMi4xMTktMS41ODEtMS41ODQtLjkzNy0zLjI5MS0xLjQ5Mi01LjA1OC0xLjQ5MnoiLz48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMTQuMjUgNUE0LjI1NiA0LjI1NiAwIDAgMCAxMCAuNzUgNC4yNTYgNC4yNTYgMCAwIDAgNS43NSA1IDQuMjU2IDQuMjU2IDAgMCAwIDEwIDkuMjUgNC4yNTYgNC4yNTYgMCAwIDAgMTQuMjUgNXoiLz48L2c+PC9nPjwvc3ZnPgo=';
1299
1300var tag = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjRkZGIiBkPSJNNCA3bC0zIDMgOSA5IDMtM3oiLz48cGF0aCBmaWxsPSIjRkZGIiBzdHJva2U9IiM2MzczODEiIHN0cm9rZS13aWR0aD0iMS41IiBkPSJNMTkgLjc1aC05YS4yNTIuMjUyIDAgMCAwLS4xNzYuMDczbC05IDlhLjI0OS4yNDkgMCAwIDAgMCAuMzU0bDkgOWEuMjQ3LjI0NyAwIDAgMCAuMzUzIDBsOS4wMDEtOS4wMDJBLjI0Ny4yNDcgMCAwIDAgMTkuMjUgMTBWMUEuMjUuMjUgMCAwIDAgMTkgLjc1eiIvPjxwYXRoIGZpbGw9IiM2MzczODEiIGZpbGwtb3BhY2l0eT0iLjI1IiBkPSJNNCA3bDkgOS0zIDMtOS05eiIvPjxwYXRoIGZpbGw9IiM2MzczODEiIGQ9Ik0xNSA2LjVhMS41IDEuNSAwIDEgMC0uMDAxLTMuMDAxQTEuNSAxLjUgMCAwIDAgMTUgNi41Ii8+PHBhdGggc3Ryb2tlPSIjNjM3MzgxIiBzdHJva2Utd2lkdGg9IjEuNSIgZD0iTTQgN2w5IDkiLz48L2c+PC9zdmc+Cg==';
1301
1302var warning = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjAgMjAiPjxkZWZzPjxwYXRoIGlkPSJhIiBkPSJNMTAgMEM0LjQ4NiAwIDAgNC40ODYgMCAxMHM0LjQ4NiAxMCAxMCAxMCAxMC00LjQ4NiAxMC0xMFMxNS41MTQgMCAxMCAwbTAgMThjLTQuNDExIDAtOC0zLjU4OS04LThzMy41ODktOCA4LTggOCAzLjU4OSA4IDgtMy41ODkgOC04IDhtMC03YTEgMSAwIDAgMCAxLTFWNmExIDEgMCAxIDAtMiAwdjRhMSAxIDAgMCAwIDEgMW0wIDEuOWExLjEgMS4xIDAgMSAwIDAgMi4yIDEuMSAxLjEgMCAwIDAgMC0yLjIiLz48L2RlZnM+PHVzZSBmaWxsPSIjOUM2RjE5IiB4bGluazpocmVmPSIjYSIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+Cg==';
1303
1304var mail = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cmVjdCB3aWR0aD0iMTguNSIgaGVpZ2h0PSIxNC41IiB4PSIuNzUiIHk9IjIuNzUiIGZpbGw9IiM2MzczODEiIGZpbGwtb3BhY2l0eT0iLjI1IiBzdHJva2U9IiM2MzczODEiIHN0cm9rZS13aWR0aD0iMS41IiByeD0iMyIvPjxwYXRoIGZpbGw9IiNGRkYiIGQ9Ik0xIDVsOSA2IDktNi0xLTJIMnoiLz48cGF0aCBmaWxsPSIjNjM3MzgxIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0zIDMuNUExLjUgMS41IDAgMCAwIDEuNSA1djEwQTEuNSAxLjUgMCAwIDAgMyAxNi41aDE0YTEuNSAxLjUgMCAwIDAgMS41LTEuNVY1QTEuNSAxLjUgMCAwIDAgMTcgMy41SDN6TTMgMmgxNGEzIDMgMCAwIDEgMyAzdjEwYTMgMyAwIDAgMS0zIDNIM2EzIDMgMCAwIDEtMy0zVjVhMyAzIDAgMCAxIDMtM3oiLz48cGF0aCBmaWxsPSIjNjM3MzgxIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0xOC41ODQgNC4zNzZsLjgzMiAxLjI0OC03Ljg5IDUuMjZhMi43NSAyLjc1IDAgMCAxLTMuMDUxIDBMLjU4NCA1LjYyNGwuODMyLTEuMjQ4IDcuODkgNS4yNmMuNDIuMjguOTY4LjI4IDEuMzg3IDBsNy44OTEtNS4yNnoiLz48L2c+PC9zdmc+Cg==';
1305
1306var phone = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjRkZGIiBkPSJNNSAwaDEwYTIgMiAwIDAgMSAyIDJ2MTZhMiAyIDAgMCAxLTIgMkg1YTIgMiAwIDAgMS0yLTJWMmEyIDIgMCAwIDEgMi0yeiIvPjxwYXRoIGZpbGw9IiM2MzczODEiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTUgMS41YS41LjUgMCAwIDAtLjUuNXYxNmEuNS41IDAgMCAwIC41LjVoMTBhLjUuNSAwIDAgMCAuNS0uNVYyYS41LjUgMCAwIDAtLjUtLjVINXpNNSAwaDEwYTIgMiAwIDAgMSAyIDJ2MTZhMiAyIDAgMCAxLTIgMkg1YTIgMiAwIDAgMS0yLTJWMmEyIDIgMCAwIDEgMi0yeiIvPjxyZWN0IHdpZHRoPSI4IiBoZWlnaHQ9IjMiIHg9IjYiIGZpbGw9IiM2MzczODEiIHJ4PSIxLjUiLz48cmVjdCB3aWR0aD0iOCIgaGVpZ2h0PSIxLjUiIHg9IjYiIHk9IjE1LjUiIGZpbGw9IiM2MzczODEiIHJ4PSIuNzUiLz48L2c+PC9zdmc+Cg==';
1307
1308var attentionFilled = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PHBhdGggZmlsbD0iIzMxMzczRCIgZD0iTTguMDU4IDIuNjQ3QzguNDcyIDEuOTM0IDkuMjA4IDEuNSAxMCAxLjVjLjc5MyAwIDEuNTI4LjQzNCAxLjk0MiAxLjE0N2w2Ljc1NCAxMS44MTNjLjQwMy43MzIuNDA1IDEuNjMyLjAwNiAyLjM2NkEyLjIzMSAyLjIzMSAwIDAgMSAxNi43NSAxOEgzLjI0NGEyLjIyOCAyLjIyOCAwIDAgMS0xLjk0Ni0xLjE3NCAyLjQ4IDIuNDggMCAwIDEgLjAxMi0yLjM3NUw4LjA1OCAyLjY0N3pNOSAxMWgyVjdIOXY0em0wIDRoMnYtMkg5djJ6Ii8+PC9zdmc+Cg==';
1309
1310var circleCheckmark = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PHBhdGggZmlsbD0iIzMxMzczRCIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTAgMThhOCA4IDAgMSAxIDAtMTYgOCA4IDAgMCAxIDAgMTZ6bS0xLjY4NS00LjE0MWwtLjAwMS0uMDAxYS40MzcuNDM3IDAgMCAwIC42NDIgMGw1LjkxLTYuMzVhLjUwNC41MDQgMCAwIDAgMC0uNjgzbC0uNjQzLS42ODRhLjQzNy40MzcgMCAwIDAtLjY0MyAwbC00Ljk0MiA1LjMyNy0yLjIyLTIuMzkzYS40MzcuNDM3IDAgMCAwLS42NDIgMGwtLjY0My42ODNhLjUwNi41MDYgMCAwIDAgMCAuNjg0bDMuMTgyIDMuNDE3eiIvPjwvc3ZnPgo=';
1311
1312var circleInformationFilled = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PHBhdGggZmlsbD0iIzMxMzczRCIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTAgMThhOCA4IDAgMSAxIDAtMTYgOCA4IDAgMCAxIDAgMTZ6bTEtNXYtM2ExIDEgMCAwIDAtMS0xSDlhMSAxIDAgMSAwIDAgMnYzYTEgMSAwIDAgMCAxIDFoMWExIDEgMCAwIDAgMC0yem0tMS01LjlhMS4xIDEuMSAwIDEgMCAwLTIuMiAxLjEgMS4xIDAgMCAwIDAgMi4yeiIvPjwvc3ZnPgo=';
1313
1314var property = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0iIzVFNjg4MCIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0zLjUgOXY5YS41LjUgMCAwIDAgLjUuNWgxMmEuNS41IDAgMCAwIC41LS41VjlIMTh2OWEyIDIgMCAwIDEtMiAySDRhMiAyIDAgMCAxLTItMlY5aDEuNXoiLz48cGF0aCBkPSJNOCAxMmg0YTIgMiAwIDAgMSAyIDJ2Nkg2di02YTIgMiAwIDAgMSAyLTJ6IiBvcGFjaXR5PSIuMjUiLz48cGF0aCBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik03LjUgMTguNWg1VjE0YS41LjUgMCAwIDAtLjUtLjVIOGEuNS41IDAgMCAwLS41LjV2NC41ek04IDEyaDRhMiAyIDAgMCAxIDIgMnY2SDZ2LTZhMiAyIDAgMCAxIDItMnoiLz48cGF0aCBzdHJva2U9IiM1RTY4ODAiIHN0cm9rZS13aWR0aD0iMS41IiBkPSJNMTkuMjUgNC42OTRMMTcuMDU5Ljc1SDIuOTRMLjc1IDQuNjk0VjZhMy4yNSAzLjI1IDAgMCAwIDUuNjg4IDIuMTVMNyA3LjUxMmwuNTYyLjYzOEEzLjI0IDMuMjQgMCAwIDAgMTAgOS4yNWEzLjI0IDMuMjQgMCAwIDAgMi40MzgtMS4xTDEzIDcuNTEybC41NjIuNjM4QTMuMjUgMy4yNSAwIDAgMCAxOS4yNSA2VjQuNjk0eiIgb3BhY2l0eT0iLjI1Ii8+PHBhdGggZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNMTYuNjE3IDEuNUgzLjM4M0wxLjUgNC44ODlWNmEyLjUgMi41IDAgMCAwIDQuMzc1IDEuNjUzTDcgNi4zOGwxLjEyNSAxLjI3NEEyLjQ5IDIuNDkgMCAwIDAgMTAgOC41YTIuNDkgMi40OSAwIDAgMCAxLjg3NS0uODQ3TDEzIDYuMzhsMS4xMjUgMS4yNzRBMi41IDIuNSAwIDAgMCAxOC41IDZWNC44ODlMMTYuNjE3IDEuNXpNMTMuNzUgOS4zMDdMMTMgOC42NDZsLS43NS42NjFBMy45ODEgMy45ODEgMCAwIDEgMTAgMTBjLS44MzUgMC0xLjYxLS4yNTYtMi4yNS0uNjkzTDcgOC42NDZsLS43NS42NjFBNCA0IDAgMCAxIDAgNlY0LjVMMi41IDBoMTVMMjAgNC41VjZhNCA0IDAgMCAxLTYuMjUgMy4zMDd6Ii8+PHBhdGggZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNMTcuNzI5IDMuNWwtMS4xMTItMkgzLjM4M2wtMS4xMTIgMkgxNy43M3pNMS40MzkgNUgxLjV2LS4xMTFMMS40MzggNXpNMCA1di0uNUwyLjUgMGgxNUwyMCA0LjVWNUgweiIvPjwvZz48L3N2Zz4K';
1315
1316var date = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0wIDdoMjB2MTFhMiAyIDAgMCAxLTIgMkgyYTIgMiAwIDAgMS0yLTJWN3oiLz48cGF0aCBmaWxsPSIjNUU2ODgwIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0yIDEuNWgxNmEyIDIgMCAwIDEgMiAydjVIMHYtNWEyIDIgMCAwIDEgMi0yeiIgb3BhY2l0eT0iLjI1Ii8+PHBhdGggZmlsbD0iIzVFNjg4MCIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNMS41IDguNVYxOGEuNS41IDAgMCAwIC41LjVoMTZhLjUuNSAwIDAgMCAuNS0uNVY4LjVoLTE3ek0wIDdoMjB2MTFhMiAyIDAgMCAxLTIgMkgyYTIgMiAwIDAgMS0yLTJWN3oiLz48cGF0aCBmaWxsPSIjNUU2ODgwIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0xLjUgN2gxN1YzLjVBLjUuNSAwIDAgMCAxOCAzSDJhLjUuNSAwIDAgMC0uNS41Vjd6TTIgMS41aDE2YTIgMiAwIDAgMSAyIDJ2NUgwdi01YTIgMiAwIDAgMSAyLTJ6Ii8+PHBhdGggZmlsbD0iIzVFNjg4MCIgZD0iTTE1LjI1IDBhLjc1Ljc1IDAgMCAxIC43NS43NXYzYS43NS43NSAwIDEgMS0xLjUgMHYtM2EuNzUuNzUgMCAwIDEgLjc1LS43NXpNNC43NSAwYS43NS43NSAwIDAgMSAuNzUuNzV2M2EuNzUuNzUgMCAwIDEtMS41IDB2LTNBLjc1Ljc1IDAgMCAxIDQuNzUgMHoiLz48L2c+PC9zdmc+Cg==';
1317
1318var dateStart = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0wIDYuNWgyMHYxMS40MjNDMjAgMTkuMDcgMTkuMTA1IDIwIDE4IDIwSDJjLTEuMTA1IDAtMi0uOTMtMi0yLjA3N1Y2LjV6Ii8+PHBhdGggZmlsbD0iIzVFNjg4MCIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNMiAxLjVoMTZjMS4xMDUgMCAyIC44MzEgMiAxLjg1N1Y4SDBWMy4zNTdDMCAyLjMzMS44OTUgMS41IDIgMS41eiIgb3BhY2l0eT0iLjI1Ii8+PHBhdGggZmlsbD0iIzVFNjg4MCIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNMS41IDguMDU4djkuODY1YzAgLjI4Ny4yMjQuNTIuNS41MmgxNmEuNTEuNTEgMCAwIDAgLjUtLjUyVjguMDU4aC0xN3pNMCA2LjVoMjB2MTEuNDIzQzIwIDE5LjA3IDE5LjEwNSAyMCAxOCAyMEgyYy0xLjEwNSAwLTItLjkzLTItMi4wNzdWNi41eiIvPjxwYXRoIGZpbGw9IiM1RTY4ODAiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTEuNSA2LjYwN2gxN3YtMy4yNWMwLS4yNTYtLjIyNC0uNDY0LS41LS40NjRIMmMtLjI3NiAwLS41LjIwOC0uNS40NjR2My4yNXpNMiAxLjVoMTZjMS4xMDUgMCAyIC44MzEgMiAxLjg1N1Y4SDBWMy4zNTdDMCAyLjMzMS44OTUgMS41IDIgMS41eiIvPjxnIGZpbGw9IiM1RTY4ODAiIGZpbGwtcnVsZT0ibm9uemVybyI+PHBhdGggZD0iTTUuNzUgMTRhLjc1Ljc1IDAgMCAxIDAtMS41aDcuNWEuNzUuNzUgMCAwIDEgMCAxLjVoLTcuNXoiLz48cGF0aCBkPSJNOS43MiAxMC43OGEuNzUuNzUgMCAwIDEgMS4wNi0xLjA2bDMgM2EuNzUuNzUgMCAwIDEgMCAxLjA2bC0zIDNhLjc1Ljc1IDAgMCAxLTEuMDYtMS4wNmwyLjQ3LTIuNDctMi40Ny0yLjQ3eiIvPjwvZz48cGF0aCBmaWxsPSIjNUU2ODgwIiBkPSJNMTUuMjUgMGEuNzUuNzUgMCAwIDEgLjc1Ljc1djNhLjc1Ljc1IDAgMSAxLTEuNSAwdi0zYS43NS43NSAwIDAgMSAuNzUtLjc1ek00Ljc1IDBhLjc1Ljc1IDAgMCAxIC43NS43NXYzYS43NS43NSAwIDAgMS0xLjUgMHYtM0EuNzUuNzUgMCAwIDEgNC43NSAweiIvPjwvZz48L3N2Zz4K';
1319
1320var dateEnd = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0wIDdoMjB2MTFhMiAyIDAgMCAxLTIgMkgyYTIgMiAwIDAgMS0yLTJWN3oiLz48cGF0aCBmaWxsPSIjNUU2ODgwIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0yIDEuNWgxNmEyIDIgMCAwIDEgMiAydjVIMHYtNWEyIDIgMCAwIDEgMi0yeiIgb3BhY2l0eT0iLjI1Ii8+PHBhdGggZmlsbD0iIzVFNjg4MCIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNMS41IDguNVYxOGEuNS41IDAgMCAwIC41LjVoMTZhLjUuNSAwIDAgMCAuNS0uNVY4LjVoLTE3ek0wIDdoMjB2MTFhMiAyIDAgMCAxLTIgMkgyYTIgMiAwIDAgMS0yLTJWN3oiLz48cGF0aCBmaWxsPSIjNUU2ODgwIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0xLjUgN2gxN1YzLjVBLjUuNSAwIDAgMCAxOCAzSDJhLjUuNSAwIDAgMC0uNS41Vjd6TTIgMS41aDE2YTIgMiAwIDAgMSAyIDJ2NUgwdi01YTIgMiAwIDAgMSAyLTJ6Ii8+PHBhdGggZmlsbD0iIzVFNjg4MCIgZD0iTTE1LjI1IDBhLjc1Ljc1IDAgMCAxIC43NS43NXYzYS43NS43NSAwIDEgMS0xLjUgMHYtM2EuNzUuNzUgMCAwIDEgLjc1LS43NXpNNC43NSAwYS43NS43NSAwIDAgMSAuNzUuNzV2M2EuNzUuNzUgMCAwIDEtMS41IDB2LTNBLjc1Ljc1IDAgMCAxIDQuNzUgMHoiLz48ZyBmaWxsPSIjNUU2ODgwIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjxwYXRoIGQ9Ik02LjQ3IDExLjAzbDEuMDYtMS4wNiA2IDYtMS4wNiAxLjA2eiIvPjxwYXRoIGQ9Ik03LjUzIDE3LjAzbC0xLjA2LTEuMDYgNi02IDEuMDYgMS4wNnoiLz48L2c+PC9nPjwvc3ZnPgo=';
1321
1322var areaSales = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0iIzVFNjg4MCIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMCA2aDEwLjE1NGMxLjMzNyAwIDEuODIyLjE0IDIuMzExLjQuNDkuMjYyLjg3My42NDYgMS4xMzQgMS4xMzUuMjYyLjQ4OS40MDEuOTc0LjQwMSAyLjMxVjIwSDUuMTI4Yy0xLjc4MyAwLTIuNDMtLjE4Ni0zLjA4Mi0uNTM0YTMuNjM1IDMuNjM1IDAgMCAxLTEuNTEyLTEuNTEyQy4xODYgMTcuMzAyIDAgMTYuNjU1IDAgMTQuODcyVjZ6IiBvcGFjaXR5PSIuMjUiLz48cGF0aCBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0xNCAxMS41djNoLTEuNXYtM0gxNHptMC0yaC0xLjVWOUExLjUgMS41IDAgMCAwIDExIDcuNWgtLjVWNmguNWEzIDMgMCAwIDEgMyAzdi41em0wIDdWMjBsLTEuNS0xLjV2LTJIMTR6TTguNSA2djEuNWgtM1Y2aDN6bS01IDB2MS41aC0yTDAgNmgzLjV6Ii8+PHBhdGggZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNNS4xMjggMS41Yy0xLjQgMC0xLjg4LjA5My0yLjM3NC4zNTctLjM5LjIwOS0uNjg4LjUwNi0uODk3Ljg5Ny0uMjY0LjQ5NC0uMzU3Ljk3NS0uMzU3IDIuMzc0djkuNzQ0YzAgMS40LjA5MyAxLjg4LjM1NyAyLjM3NC4yMDkuMzkuNTA2LjY4OC44OTcuODk3LjQ5NC4yNjQuOTc1LjM1NyAyLjM3NC4zNTdoOS43NDRjMS40IDAgMS44OC0uMDkzIDIuMzc0LS4zNTcuMzktLjIwOS42ODgtLjUwNi44OTctLjg5Ny4yNjQtLjQ5NC4zNTctLjk3NS4zNTctMi4zNzRWNS4xMjhjMC0xLjQtLjA5My0xLjg4LS4zNTctMi4zNzRhMi4xMzUgMi4xMzUgMCAwIDAtLjg5Ny0uODk3Yy0uNDk0LS4yNjQtLjk3NS0uMzU3LTIuMzc0LS4zNTdINS4xMjh6bTAtMS41aDkuNzQ0YzEuNzgzIDAgMi40My4xODYgMy4wODIuNTM0LjY1Mi4zNDkgMS4xNjMuODYgMS41MTIgMS41MTIuMzQ4LjY1Mi41MzQgMS4yOTkuNTM0IDMuMDgydjkuNzQ0YzAgMS43ODMtLjE4NiAyLjQzLS41MzQgMy4wODJhMy42MzUgMy42MzUgMCAwIDEtMS41MTIgMS41MTJjLS42NTIuMzQ4LTEuMjk5LjUzNC0zLjA4Mi41MzRINS4xMjhjLTEuNzgzIDAtMi40My0uMTg2LTMuMDgyLS41MzRhMy42MzUgMy42MzUgMCAwIDEtMS41MTItMS41MTJDLjE4NiAxNy4zMDIgMCAxNi42NTUgMCAxNC44NzJWNS4xMjhjMC0xLjc4My4xODYtMi40My41MzQtMy4wODJBMy42MzUgMy42MzUgMCAwIDEgMi4wNDYuNTM0QzIuNjk4LjE4NiAzLjM0NSAwIDUuMTI4IDB6Ii8+PC9nPjwvc3ZnPgo=';
1323
1324var areaGross = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0iIzVFNjg4MCI+PHBhdGggZD0iTTUuMTI4IDBoOS43NDRjMS43ODMgMCAyLjQzLjE4NiAzLjA4Mi41MzQuNjUyLjM0OSAxLjE2My44NiAxLjUxMiAxLjUxMi4zNDguNjUyLjUzNCAxLjI5OS41MzQgMy4wODJ2OS43NDRjMCAxLjc4My0uMTg2IDIuNDMtLjUzNCAzLjA4MmEzLjYzNSAzLjYzNSAwIDAgMS0xLjUxMiAxLjUxMmMtLjY1Mi4zNDgtMS4yOTkuNTM0LTMuMDgyLjUzNEg1LjEyOGMtMS43ODMgMC0yLjQzLS4xODYtMy4wODItLjUzNGEzLjYzNSAzLjYzNSAwIDAgMS0xLjUxMi0xLjUxMkMuMTg2IDE3LjMwMiAwIDE2LjY1NSAwIDE0Ljg3MlY1LjEyOGMwLTEuNzgzLjE4Ni0yLjQzLjUzNC0zLjA4MkEzLjYzNSAzLjYzNSAwIDAgMSAyLjA0Ni41MzRDMi42OTguMTg2IDMuMzQ1IDAgNS4xMjggMHoiIG9wYWNpdHk9Ii4yNSIvPjxwYXRoIGQ9Ik0yMCA1LjV2M2gtMS41di0zSDIwem0tLjAzLTJoLTEuNTJhMi41MDQgMi41MDQgMCAwIDAtMS45NS0xLjk1Vi4wM2E0IDQgMCAwIDEgMy40NyAzLjQ3em0uMDMgN1YxNGwtMS41LTEuNXYtMkgyMHpNMTQuNSAwdjEuNWgtM1YwaDN6bS01IDB2MS41aC0yTDYgMGgzLjV6Ii8+PHBhdGggZD0iTTkuNSAwdjEuNUg1LjEyOGMtMS40IDAtMS44OC4wOTMtMi4zNzQuMzU3LS4zOS4yMDktLjY4OC41MDYtLjg5Ny44OTctLjI2NC40OTQtLjM1Ny45NzUtLjM1NyAyLjM3NHY5Ljc0NGMwIDEuNC4wOTMgMS44OC4zNTcgMi4zNzQuMjA5LjM5LjUwNi42ODguODk3Ljg5Ny40OTQuMjY0Ljk3NS4zNTcgMi4zNzQuMzU3aDkuNzQ0YzEuNCAwIDEuODgtLjA5MyAyLjM3NC0uMzU3LjM5LS4yMDkuNjg4LS41MDYuODk3LS44OTcuMjY0LS40OTQuMzU3LS45NzUuMzU3LTIuMzc0VjEwLjVIMjB2NC4zNzJjMCAxLjc4My0uMTg2IDIuNDMtLjUzNCAzLjA4MmEzLjYzNSAzLjYzNSAwIDAgMS0xLjUxMiAxLjUxMmMtLjY1Mi4zNDgtMS4yOTkuNTM0LTMuMDgyLjUzNEg1LjEyOGMtMS43ODMgMC0yLjQzLS4xODYtMy4wODItLjUzNGEzLjYzNSAzLjYzNSAwIDAgMS0xLjUxMi0xLjUxMkMuMTg2IDE3LjMwMiAwIDE2LjY1NSAwIDE0Ljg3MlY1LjEyOGMwLTEuNzgzLjE4Ni0yLjQzLjUzNC0zLjA4MkEzLjYzNSAzLjYzNSAwIDAgMSAyLjA0Ni41MzRDMi42OTguMTg2IDMuMzQ1IDAgNS4xMjggMEg5LjV6Ii8+PC9nPjwvc3ZnPgo=';
1325
1326var breakOption = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0yIDBoMTZhMiAyIDAgMCAxIDIgMnYxNmEyIDIgMCAwIDEtMiAySDJhMiAyIDAgMCAxLTItMlYyYTIgMiAwIDAgMSAyLTJ6Ii8+PHBhdGggZmlsbD0iIzVFNjg4MCIgb3BhY2l0eT0iLjI1IiBkPSJNMSAxaDd2MThIMXoiLz48cGF0aCBmaWxsPSIjNUU2ODgwIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik05IDB2MS41SDJhLjUuNSAwIDAgMC0uNS41djE2YS41LjUgMCAwIDAgLjUuNWg3VjIwSDJhMiAyIDAgMCAxLTItMlYyYTIgMiAwIDAgMSAyLTJoN3ptMiAwaDN2MS41aC0zVjB6bTAgMjB2LTEuNWgzVjIwaC0zem01LTIwaDJhMiAyIDAgMCAxIDIgMnYyaC0xLjVWMmEuNS41IDAgMCAwLS41LS41aC0yVjB6bTAgMjB2LTEuNWgyYS41LjUgMCAwIDAgLjUtLjV2LTJIMjB2MmEyIDIgMCAwIDEtMiAyaC0yem00LTZoLTEuNXYtM0gyMHYzem0wLTh2M2gtMS41VjZIMjB6Ii8+PHBhdGggZmlsbD0iIzVFNjg4MCIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNNy41IDE4LjV2LTE3SDJhLjUuNSAwIDAgMC0uNS41djE2YS41LjUgMCAwIDAgLjUuNWg1LjV6TTIgMGg3djIwSDJhMiAyIDAgMCAxLTItMlYyYTIgMiAwIDAgMSAyLTJ6Ii8+PC9nPjwvc3ZnPgo=';
1327
1328var warningCircle = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48Y2lyY2xlIGN4PSIxMCIgY3k9IjEwIiByPSIxMCIgZmlsbD0iI0ZGRiIvPjxwYXRoIGZpbGw9IiM1RTY4ODAiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTEwIDE4YTggOCAwIDEgMCAwLTE2IDggOCAwIDAgMCAwIDE2em0wIDJDNC40NzcgMjAgMCAxNS41MjMgMCAxMFM0LjQ3NyAwIDEwIDBzMTAgNC40NzcgMTAgMTAtNC40NzcgMTAtMTAgMTB6Ii8+PHBhdGggZmlsbD0iIzVFNjg4MCIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNOSA2YTEgMSAwIDEgMSAyIDB2NGExIDEgMCAwIDEtMiAwVjZ6bTEgN2ExIDEgMCAxIDAgMCAyIDEgMSAwIDAgMCAwLTJ6Ii8+PC9nPjwvc3ZnPgo=';
1329
1330var warningTriangle = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI0ZGRiIgZD0iTTcuODQzIDEuNzE3YTIuNTIyIDIuNTIyIDAgMCAxIDQuMzE0IDBsNy41MDUgMTIuNTI5Yy40NDguNzc2LjQ1IDEuNzMuMDA3IDIuNTA5LS40NDEuNzc0LTEuMjYgMS4yMzUtMi4xNyAxLjI0NUgyLjQ5M2MtLjkwMS0uMDEtMS43MjEtLjQ3MS0yLjE2Mi0xLjI0NWEyLjUyNSAyLjUyNSAwIDAgMSAuMDEzLTIuNTJMNy44NDMgMS43MTh6Ii8+PHBhdGggZmlsbD0iIzVFNjg4MCIgZD0iTTcuODQzIDEuNzE3YTIuNTIyIDIuNTIyIDAgMCAxIDQuMzE0IDBsNy41MDUgMTIuNTI5Yy40NDguNzc2LjQ1IDEuNzMuMDA3IDIuNTA5LS40NDEuNzc0LTEuMjYgMS4yMzUtMi4xNyAxLjI0NUgyLjQ5M2MtLjkwMS0uMDEtMS43MjEtLjQ3MS0yLjE2Mi0xLjI0NWEyLjUyNSAyLjUyNSAwIDAgMSAuMDEzLTIuNTJMNy44NDMgMS43MTh6TTEuNjM3IDE0Ljk5NmExLjAyIDEuMDIgMCAwIDAtLjAwMyAxLjAxNi45OTMuOTkzIDAgMCAwIC44NjcuNDg4aDE0Ljk5Yy4zNzgtLjAwNC43MDMtLjE4Ny44NzUtLjQ4OC4xOC0uMzE1LjE3OS0uNzAyLjAwMy0xLjAwNkwxMC44NzMgMi40OTFhMS4wMiAxLjAyIDAgMCAwLTEuNzQ1LS4wMDFMMS42MzcgMTQuOTk2eiIvPjxwYXRoIGZpbGw9IiM1RTY4ODAiIGQ9Ik0xMCAxMi4yNWExLjUgMS41IDAgMSAxIDAgMyAxLjUgMS41IDAgMCAxIDAtM3pNOSA2YTEgMSAwIDEgMSAyIDB2NGExIDEgMCAwIDEtMiAwVjZ6Ii8+PC9nPjwvc3ZnPgo=';
1331
1332var comment = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PHBhdGggZmlsbD0iIzYzNzM4MSIgZmlsbC1vcGFjaXR5PSIuMjUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlPSIjNUU2ODgwIiBzdHJva2Utd2lkdGg9IjEuNSIgZD0iTTMuNzUgMTguNDU3bDQuMDgyLTMuMjA3SDE2QTMuMjUgMy4yNSAwIDAgMCAxOS4yNSAxMlY0QTMuMjUgMy4yNSAwIDAgMCAxNiAuNzVINEEzLjI1IDMuMjUgMCAwIDAgLjc1IDR2OGEzLjI1MiAzLjI1MiAwIDAgMCAyLjQzNyAzLjE0OGwuNTYzLjE0NXYzLjE2NHoiLz48L3N2Zz4K';
1333
1334var landlord = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjNjM3MzgxIiBmaWxsLW9wYWNpdHk9Ii4yNSIgZD0iTTQuNDYyIDYuNDM3Yy4wNDYuNTI1LjI1NS45NDQuNjI4IDEuMjU3LjM3My4zMTMuODIyLjQ0NiAxLjM0Ny40LjUyNC0uMDQ2Ljk0My0uMjU1IDEuMjU2LS42MjguMzEzLS4zNzMuNDQ3LS44MjIuNC0xLjM0Ny0uMDQ1LS41MjQtLjI1NC0uOTQzLS42MjgtMS4yNTYtLjM3My0uMzEzLS44MTYtLjQ0Mi0xLjMzLS4zODdhMS44NDQgMS44NDQgMCAwIDAtMS42NzQgMS45NjF6bTYuOTg2IDEuNzY4bDcuMjc1IDYuMTA0LTIuMzc2IDIuODMtMS40MTUtMS4xODctMi4zNDggMi43OTgtMi43OTctMi4zNDggMi4zNDctMi43OTgtMy4wNjEtMi41NjhhNS4yNjMgNS4yNjMgMCAwIDEtMy4yMTMuNzUzYy0xLjE1Ny0uMDkyLTIuMTk2LS41MjQtMy4xMTgtMS4yOThDMS41OCA5LjUxNi45MzIgOC4yNzEuOCA2Ljc1N2MtLjEzMi0xLjUxMy4yOS0yLjg1MSAxLjI2Ni00LjAxNEMzLjA0IDEuNTggNC4yODUuOTMzIDUuNzk5LjhjMS41MTMtLjEzMyAyLjg1MS4yODkgNC4wMTQgMS4yNjUuOTIyLjc3MyAxLjUyOCAxLjcyMiAxLjgyIDIuODQ1YTUuMjYzIDUuMjYzIDAgMCAxLS4xODUgMy4yOTV6Ii8+PHBhdGggZmlsbD0iIzVFNjg4MCIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNMy42ODUgNi40NzNsLS4wMDItLjAzYTIuNTkzIDIuNTkzIDAgMCAxIC42MDktMS44MzZjLjQ0LS41MjQgMS4wMy0uODMgMS43MzQtLjkwNi43MTMtLjA3NyAxLjM2LjExMiAxLjg5Mi41NTguNTMuNDQ0LjgzIDEuMDQ3Ljg5NCAxLjc2Ni4wNjMuNzE4LS4xMyAxLjM2NS0uNTc0IDEuODk0LS40NDMuNTI5LTEuMDQ3LjgzLTEuNzY1Ljg5My0uNzE5LjA2My0xLjM2NS0uMTMtMS44OTQtLjU3My0uNTMtLjQ0NC0uODMtMS4wNDctLjg5NC0xLjc2NnptMS44NTguNjE3Yy4yMTcuMTgyLjQ2OC4yNTcuNzk5LjIyOC4zMy0uMDI5LjU2NS0uMTQ2Ljc0Ny0uMzYzLjE4My0uMjE4LjI1Ny0uNDY5LjIyOC0uOC0uMDI4LS4zMy0uMTQ2LS41NjUtLjM2My0uNzQ3LS4yMTQtLjE4LS40NTQtLjI1LS43NjgtLjIxNi0uMzI0LjAzNS0uNTYuMTU3LS43NDUuMzc5YTEuMDkyIDEuMDkyIDAgMCAwLS4yNi43ODdjLjAzMS4zMjIuMTQ4LjU1Mi4zNjIuNzMyem00Ljk4MyAxLjMxNmwuMTkzLS41Yy4zNTgtLjkyNy40MS0xLjg2NS4xNTktMi44MzctLjI1Mi0uOTctLjc3My0xLjc4NS0xLjU3Ni0yLjQ1OS0xLjAxLS44NDgtMi4xNTItMS4yMDctMy40NjctMS4wOTItMS4zMTYuMTE1LTIuMzc3LjY2Ny0zLjIyNSAxLjY3OC0uODQ4IDEuMDEtMS4yMDggMi4xNTItMS4wOTMgMy40NjcuMTE1IDEuMzE1LjY2OCAyLjM3NyAxLjY3OCAzLjIyNS44MDQuNjc0IDEuNjk1IDEuMDQ1IDIuNjk1IDEuMTI1YTQuNTA2IDQuNTA2IDAgMCAwIDIuNzY2LS42NDlsLjQ2LS4yNzcgNC4wNDUgMy4zOTYtMi4zNDcgMi43OTcgMS42NDkgMS4zODQgMi4zNDctMi43OTggMS40MTYgMS4xODggMS40MS0xLjY4Mi03LjExLTUuOTY2em05LjIyNCA1Ljc4MWwtMy4zNCAzLjk4LTEuNDE1LTEuMTg4LTIuMzQ4IDIuNzk4LTMuOTQ2LTMuMzEyIDIuMzQ3LTIuNzk4LTIuMDk0LTEuNzU3YTYuMDAzIDYuMDAzIDAgMCAxLTMuMTgyLjU5OGMtMS4zMTQtLjEwNS0yLjUtLjU5OS0zLjU0LTEuNDcxQy45MTUgOS45MzMuMTcxIDguNTA1LjAyMSA2Ljc5NC0uMTI4IDUuMDgyLjM1NiAzLjU0NyAxLjQ2IDIuMjMyIDIuNTY1LjkxNiAzLjk5Mi4xNzMgNS43MDQuMDIzYzEuNzExLS4xNSAzLjI0Ni4zMzQgNC41NjIgMS40MzggMS4wNC44NzMgMS43MzIgMS45NTYgMi4wNjMgMy4yMzFhNi4wMDMgNi4wMDMgMCAwIDEtLjAzNiAzLjIzOGw3LjQ1NyA2LjI1N3oiLz48L2c+PC9zdmc+Cg==';
1335
1336var draft = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSI+PGNpcmNsZSBjeD0iMTAiIGN5PSIxMCIgcj0iOSIgZmlsbD0iI0ZGRiIvPjxwYXRoIGZpbGw9IiMwMDdBQ0UiIGQ9Ik0xMS45ODggMTkuNzhhMSAxIDAgMCAxLS4yMi0xLjk3NiA3LjkzNSA3LjkzNSAwIDAgMCAyLjQ3LTEuMDIgMSAxIDAgMCAxIDEuMDU1IDEuNyA5Ljk3MyA5Ljk3MyAwIDAgMS0zLjA4MyAxLjI3MiAxLjAzNCAxLjAzNCAwIDAgMS0uMjIyLjAyNHptLTQuMDAyLS4wMDhjLS4wNzYgMC0uMTUtLjAwOC0uMjI1LS4wMjVhOS45OTcgOS45OTcgMCAwIDEtMy4wOS0xLjI4NSAxIDEgMCAxIDEgMS4wNjUtMS42OTNjLjc2LjQ4IDEuNTk4LjgyOCAyLjQ3NSAxLjAzYS45OTkuOTk5IDAgMCAxLS4yMjMgMS45NzR2LS4wMDJsLS4wMDIuMDAxem05LjYyNi0zLjk2N2ExLjAwMiAxLjAwMiAwIDAgMS0uODQ1LTEuNTMzYy40OC0uNzYuODMtMS41OTYgMS4wMzMtMi40NzJhMSAxIDAgMSAxIDEuOTUuNDUgMTAuMDU4IDEwLjA1OCAwIDAgMS0xLjI4NiAzLjA5Ljk5OS45OTkgMCAwIDEtLjg1Mi40NjV6bS0xNS4yNDQtLjAyOGEuOTg3Ljk4NyAwIDAgMS0uODQtLjQ2NWwtLjAxOC0uMDI4YTkuOTQ4IDkuOTQ4IDAgMCAxLTEuMjYzLTMuMDY3IDEgMSAwIDAgMSAxLjk1LS40NDNjLjIuODczLjU0MyAxLjcwNiAxLjAyIDIuNDY1YTEgMSAwIDAgMS0uODQ4IDEuNTM3bC0uMDAxLjAwMXpNMTguNzggOS4wMThhLjk5OS45OTkgMCAwIDEtLjk3My0uNzggOC4wNTQgOC4wNTQgMCAwIDAtMS4wMjMtMi40NzggMS4wMTQgMS4wMTQgMCAwIDEgLjMxLTEuMzkuOTkzLjk5MyAwIDAgMSAxLjM3LjI5OHYuMDAzbC4wMjIuMDM1Yy41OTQuOTUzIDEuMDI0IDIgMS4yNyAzLjA5NWExIDEgMCAwIDEtLjc1IDEuMmgtLjAwM2MtLjA3My4wMTQtLjE0OC4wMi0uMjIyLjAxOGwtLjAwMS0uMDAxek0xLjIyOCA4Ljk5MmExLjAwMiAxLjAwMiAwIDAgMS0uOTgxLTEuMjIzdi0uMDA0Yy4yNTItMS4wOTUuNjg0LTIuMTQgMS4yOC0zLjA5M2ExLjAwMyAxLjAwMyAwIDAgMSAxLjcwMSAxLjA2M2MtLjQ4Ljc2My0uODI3IDEuNi0xLjAyOCAyLjQ4YTEgMSAwIDAgMS0uOTcyLjc3NnYuMDAxem0xMy41NTgtNS42MTVhLjk4My45ODMgMCAwIDEtLjUzLS4xNTRBOCA4IDAgMCAwIDExLjc3OSAyLjJhMSAxIDAgMSAxIC4zNzktMS45NjRsLjA2My4wMTRhOS45MyA5LjkzIDAgMCAxIDMuMSAxLjI4Yy40NjguMjkzLjYxLjkxLjMxNSAxLjM3OGEuOTk0Ljk5NCAwIDAgMS0uODQ3LjQ2OGgtLjAwNGwuMDAxLjAwMXpNNS4yMjQgMy4zN2MtLjM0LjAwMi0uNjU3LS4xNy0uODQzLS40NTRhLjk5NS45OTUgMCAwIDEgLjQwMy0xLjQ0M0E5LjcxNyA5LjcxNyAwIDAgMSA3Ljc3Ni4yNDlhMSAxIDAgMSAxIC40NDUgMS45NWMtLjg3LjItMS43MDMuNTQ0LTIuNDYgMS4wMTgtLjE2LjEtLjM0Ny4xNTMtLjUzNi4xNTJsLS4wMDEuMDAxeiIvPjwvZz48L3N2Zz4K';
1337
1338var inApprovals = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSI+PGNpcmNsZSBjeD0iMTAiIGN5PSIxMCIgcj0iOSIgZmlsbD0iI0ZGRiIvPjxwYXRoIGZpbGw9IiM5QzZGMTkiIGQ9Ik0xMS45ODggMTkuNzhhMSAxIDAgMCAxLS4yMi0xLjk3NiA3LjkzNSA3LjkzNSAwIDAgMCAyLjQ3LTEuMDIgMSAxIDAgMCAxIDEuMDU1IDEuNyA5Ljk3MyA5Ljk3MyAwIDAgMS0zLjA4MyAxLjI3MiAxLjAzNCAxLjAzNCAwIDAgMS0uMjIyLjAyNHptLTQuMDAyLS4wMDhjLS4wNzYgMC0uMTUtLjAwOC0uMjI1LS4wMjVhOS45OTcgOS45OTcgMCAwIDEtMy4wOS0xLjI4NSAxIDEgMCAxIDEgMS4wNjUtMS42OTNjLjc2LjQ4IDEuNTk4LjgyOCAyLjQ3NSAxLjAzYS45OTkuOTk5IDAgMCAxLS4yMjMgMS45NzR2LS4wMDJsLS4wMDIuMDAxem05LjYyNi0zLjk2N2ExLjAwMiAxLjAwMiAwIDAgMS0uODQ1LTEuNTMzYy40OC0uNzYuODMtMS41OTYgMS4wMzMtMi40NzJhMSAxIDAgMSAxIDEuOTUuNDUgMTAuMDU4IDEwLjA1OCAwIDAgMS0xLjI4NiAzLjA5Ljk5OS45OTkgMCAwIDEtLjg1Mi40NjV6bS0xNS4yNDQtLjAyOGEuOTg3Ljk4NyAwIDAgMS0uODQtLjQ2NWwtLjAxOC0uMDI4YTkuOTQ4IDkuOTQ4IDAgMCAxLTEuMjYzLTMuMDY3IDEgMSAwIDAgMSAxLjk1LS40NDNjLjIuODczLjU0MyAxLjcwNiAxLjAyIDIuNDY1YTEgMSAwIDAgMS0uODQ4IDEuNTM3bC0uMDAxLjAwMXpNMTguNzggOS4wMThhLjk5OS45OTkgMCAwIDEtLjk3My0uNzggOC4wNTQgOC4wNTQgMCAwIDAtMS4wMjMtMi40NzggMS4wMTQgMS4wMTQgMCAwIDEgLjMxLTEuMzkuOTkzLjk5MyAwIDAgMSAxLjM3LjI5OHYuMDAzbC4wMjIuMDM1Yy41OTQuOTUzIDEuMDI0IDIgMS4yNyAzLjA5NWExIDEgMCAwIDEtLjc1IDEuMmgtLjAwM2MtLjA3My4wMTQtLjE0OC4wMi0uMjIyLjAxOGwtLjAwMS0uMDAxek0xLjIyOCA4Ljk5MmExLjAwMiAxLjAwMiAwIDAgMS0uOTgxLTEuMjIzdi0uMDA0Yy4yNTItMS4wOTUuNjg0LTIuMTQgMS4yOC0zLjA5M2ExLjAwMyAxLjAwMyAwIDAgMSAxLjcwMSAxLjA2M2MtLjQ4Ljc2My0uODI3IDEuNi0xLjAyOCAyLjQ4YTEgMSAwIDAgMS0uOTcyLjc3NnYuMDAxem0xMy41NTgtNS42MTVhLjk4My45ODMgMCAwIDEtLjUzLS4xNTRBOCA4IDAgMCAwIDExLjc3OSAyLjJhMSAxIDAgMSAxIC4zNzktMS45NjRsLjA2My4wMTRhOS45MyA5LjkzIDAgMCAxIDMuMSAxLjI4Yy40NjguMjkzLjYxLjkxLjMxNSAxLjM3OGEuOTk0Ljk5NCAwIDAgMS0uODQ3LjQ2OGgtLjAwNGwuMDAxLjAwMXpNNS4yMjQgMy4zN2MtLjM0LjAwMi0uNjU3LS4xNy0uODQzLS40NTRhLjk5NS45OTUgMCAwIDEgLjQwMy0xLjQ0M0E5LjcxNyA5LjcxNyAwIDAgMSA3Ljc3Ni4yNDlhMSAxIDAgMSAxIC40NDUgMS45NWMtLjg3LjItMS43MDMuNTQ0LTIuNDYgMS4wMTgtLjE2LjEtLjM0Ny4xNTMtLjUzNi4xNTJsLS4wMDEuMDAxeiIvPjxwYXRoIGZpbGw9IiM5Nzk3OTciIGQ9Ik0xMy44MiAxOS4yNDRsLS43NjQtMS44NDhhOC4wMDIgOC4wMDIgMCAwIDAtLjA1LTE0LjgxMkwxMy43NTguNzNhMTAuMDAyIDEwLjAwMiAwIDAgMSAuMDYzIDE4LjUxNHoiLz48L2c+PC9zdmc+Cg==';
1339
1340var executed = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSI+PGNpcmNsZSBjeD0iMTAiIGN5PSIxMCIgcj0iOSIgZmlsbD0iI0ZGRiIvPjxwYXRoIGZpbGw9IiMxMDgwNDMiIGQ9Ik0yLjkyNiAyLjkyNGMzLjkxLTMuOTAzIDEwLjI0Ni0zLjg5NyAxNC4xNS4wMTJzMy44OTggMTAuMjQtLjAxMiAxNC4xNDJjLTMuOTA1IDMuODk3LTEwLjIzIDMuODk3LTE0LjEzNSAwLTMuOTA0LTMuOTEtMy45MDQtMTAuMjQ0IDAtMTQuMTU0aC0uMDAzem0xLjQxMyAxMi43NDNhOC4wMTQgOC4wMTQgMCAwIDAgMTEuMzMtLjAwNiA4LjAwNSA4LjAwNSAwIDAgMC0uMDA3LTExLjMyNSA4LjAxMyA4LjAxMyAwIDAgMC0xMS4zMjMgMCA3Ljg4NiA3Ljg4NiAwIDAgMC0yLjI3MyA0LjY2M2g3LjUzbC0xLjMwMi0xLjI5YTEuMDA1IDEuMDA1IDAgMSAxIDEuNDIyLTEuNDIyTDEyLjcyIDkuMjljLjM5LjM5Mi4zOSAxLjAyNyAwIDEuNDJsLTMuMDA0IDMuMDAzYTEuMDE2IDEuMDE2IDAgMCAxLTEuNDIyIDAgMS4wMDggMS4wMDggMCAwIDEgMC0xLjQyTDkuNTk2IDExaC03LjUzYTcuODk0IDcuODk0IDAgMCAwIDIuMjczIDQuNjY2eiIvPjwvZz48L3N2Zz4K';
1341
1342var completed = 'data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjAgMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48Y2lyY2xlIGZpbGw9IiNGRkYiIGN4PSIxMCIgY3k9IjEwIiByPSI5Ii8+PHBhdGggZD0iTTEwIDBDNC40ODYgMCAwIDQuNDg2IDAgMTBzNC40ODYgMTAgMTAgMTAgMTAtNC40ODYgMTAtMTBTMTUuNTE0IDAgMTAgMG0wIDE4Yy00LjQxIDAtOC0zLjU5LTgtOHMzLjU5LTggOC04IDggMy41OSA4IDgtMy41OSA4LTggOG0yLjI5My0xMC43MDdMOSAxMC41ODYgNy43MDcgOS4yOTNhMSAxIDAgMSAwLTEuNDE0IDEuNDE0bDIgMmEuOTk3Ljk5NyAwIDAgMCAxLjQxNCAwbDQtNGExIDEgMCAxIDAtMS40MTQtMS40MTQiIGZpbGw9IiM5MTlFQUIiLz48L2c+PC9zdmc+Cg==';
1343
1344var failed = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48Y2lyY2xlIGN4PSIxMCIgY3k9IjEwIiByPSI5IiBmaWxsPSIjRkZGIi8+PHBhdGggZD0iTTEwIDBDNC40ODYgMCAwIDQuNDg2IDAgMTBzNC40ODYgMTAgMTAgMTAgMTAtNC40ODYgMTAtMTBTMTUuNTE0IDAgMTAgMG0wIDE4Yy00LjQxMSAwLTgtMy41ODktOC04czMuNTg5LTggOC04IDggMy41ODkgOCA4LTMuNTg5IDgtOCA4bTMuNzA3LTExLjcwN2EuOTk5Ljk5OSAwIDAgMC0xLjQxNCAwTDEwIDguNTg2IDcuNzA3IDYuMjkzYS45OTkuOTk5IDAgMSAwLTEuNDE0IDEuNDE0TDguNTg2IDEwbC0yLjI5MyAyLjI5M2EuOTk5Ljk5OSAwIDEgMCAxLjQxNCAxLjQxNEwxMCAxMS40MTRsMi4yOTMgMi4yOTNhLjk5Ny45OTcgMCAwIDAgMS40MTQgMCAuOTk5Ljk5OSAwIDAgMCAwLTEuNDE0TDExLjQxNCAxMGwyLjI5My0yLjI5M2EuOTk5Ljk5OSAwIDAgMCAwLTEuNDE0Ii8+PC9nPjwvc3ZnPgo=';
1345
1346var requestChanges = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PHBhdGggZD0iTTcuNCA4LjAxNWMzLjEuMDQ3IDQuMzU1LjIzMiA1LjY0NC44MjdDMTUuMTE2IDkuNzk4IDE2IDExLjcwOSAxNiAxNWExIDEgMCAwIDEtMiAwYzAtNC4wMzUtLjc3OS00Ljg0Ny02LjU2NC00Ljk3OGwyLjI3MSAyLjI3YTEgMSAwIDEgMS0xLjQxNCAxLjQxNWwtNC00YTEgMSAwIDAgMSAwLTEuNDE0bDQtNGExIDEgMCAwIDEgMS40MTQgMS40MTRMNy40IDguMDE1eiIvPjwvc3ZnPgo=';
1347
1348var styles$3 = {
1349 "Icon": "p_uo",
1350 "hasBackdrop": "p_g1",
1351 "isColored": "p_zk",
1352 "colorWhite": "p_f6",
1353 "colorBlack": "p_i7",
1354 "colorSkyLighter": "p_gx",
1355 "colorSkyLight": "p_n7",
1356 "colorSky": "p_q9",
1357 "colorSkyDark": "p_jb",
1358 "colorInkLightest": "p_hr",
1359 "colorInkLighter": "p_r6",
1360 "colorInkLight": "p_wa",
1361 "colorInk": "p_v0",
1362 "colorBlueLighter": "p_nu",
1363 "colorBlueLight": "p_ax",
1364 "colorBlue": "p_le",
1365 "colorBlueDark": "p_d2",
1366 "colorBlueDarker": "p_rv",
1367 "colorIndigoLighter": "p_c9",
1368 "colorIndigoLight": "p_od",
1369 "colorIndigo": "p_l8",
1370 "colorIndigoDark": "p_o4",
1371 "colorIndigoDarker": "p_g4",
1372 "colorTealLighter": "p_wn",
1373 "colorTealLight": "p_g0",
1374 "colorTeal": "p_j2",
1375 "colorTealDark": "p_rb",
1376 "colorTealDarker": "p_vy",
1377 "colorGreenLighter": "p_xn",
1378 "colorGreen": "p_zv",
1379 "colorGreenDark": "p_l1",
1380 "colorYellowLighter": "p_zm",
1381 "colorYellow": "p_d6",
1382 "colorYellowDark": "p_hu",
1383 "colorOrange": "p_qq",
1384 "colorOrangeDark": "p_m2",
1385 "colorRedLighter": "p_u2",
1386 "colorRed": "p_op",
1387 "colorRedDark": "p_mu",
1388 "colorPurple": "p_nz",
1389 "Svg": "p_f7",
1390 "Placeholder": "p_sh",
1391};
1392
1393const BUNDLED_ICONS = {
1394 add,
1395 alert,
1396 arrowDown,
1397 arrowLeft,
1398 arrowRight,
1399 arrowUp,
1400 arrowUpDown,
1401 calendar,
1402 cancel,
1403 cancelSmall,
1404 caretDown,
1405 caretUp,
1406 checkmark,
1407 chevronDown,
1408 chevronLeft,
1409 chevronRight,
1410 chevronUp,
1411 circleCancel,
1412 circleChevronDown,
1413 circleChevronLeft,
1414 circleChevronRight,
1415 circleChevronUp,
1416 circleInformation,
1417 circlePlus,
1418 conversation,
1419 delete: deleteIcon,
1420 disable,
1421 dispute,
1422 duplicate,
1423 embed,
1424 export: exportIcon,
1425 external,
1426 help,
1427 horizontalDots,
1428 import: importIcon,
1429 menu,
1430 notes,
1431 notification,
1432 print,
1433 refresh,
1434 risk,
1435 save,
1436 search,
1437 subtract,
1438 view,
1439 edit,
1440 checkmarkLarge,
1441 clock,
1442 notificationCircle,
1443 activity,
1444 location,
1445 misc,
1446 person,
1447 tag,
1448 warning,
1449 mail,
1450 phone,
1451 attentionFilled,
1452 circleCheckmark,
1453 circleInformationFilled,
1454 property,
1455 date,
1456 dateStart,
1457 dateEnd,
1458 breakOption,
1459 areaSales,
1460 areaGross,
1461 warningCircle,
1462 warningTriangle,
1463 comment,
1464 landlord,
1465 draft,
1466 inApprovals,
1467 executed,
1468 completed,
1469 failed,
1470 requestChanges
1471};
1472const COLORS_WITH_BACKDROPS = ['teal', 'tealDark', 'greenDark', 'redDark', 'yellowDark', 'ink', 'inkLighter', 'inkLightest'];
1473function Icon$1({ source, color, backdrop, accessibilityLabel, polaris: { intl } }) {
1474 if (color && backdrop && COLORS_WITH_BACKDROPS.indexOf(color) < 0) {
1475 // eslint-disable-next-line no-console
1476 console.warn(intl.translate('Polaris.Icon.backdropWarning', {
1477 color,
1478 colorsWithBackDrops: COLORS_WITH_BACKDROPS.join(', ')
1479 }));
1480 }
1481 const className = styles.classNames(styles$3.Icon, color && styles$3[styles.variationName('color', color)], color && color !== 'white' && styles$3.isColored, backdrop && styles$3.hasBackdrop);
1482 let contentMarkup;
1483 if (source === 'placeholder') {
1484 contentMarkup = React.createElement('div', { className: styles$3.Placeholder });
1485 } else {
1486 const iconSource = typeof source === 'string' ? BUNDLED_ICONS[source] : source;
1487 contentMarkup = iconSource && iconSource.viewBox && iconSource.body && React.createElement('svg', { className: styles$3.Svg, viewBox: iconSource.viewBox, dangerouslySetInnerHTML: { __html: iconSource.body }, focusable: 'false', 'aria-hidden': 'true' });
1488 }
1489 return React.createElement(
1490 'span',
1491 { className: className, 'aria-label': accessibilityLabel },
1492 contentMarkup
1493 );
1494}
1495var Icon$2 = withAppProvider()(Icon$1);
1496
1497const scrollable = {
1498 props: { 'data-polaris-scrollable': true },
1499 selector: '[data-polaris-scrollable]'
1500};
1501const overlay = {
1502 props: { 'data-polaris-overlay': true },
1503 selector: '[data-polaris-overlay]'
1504};
1505const layer = {
1506 props: { 'data-polaris-layer': true },
1507 selector: '[data-polaris-layer]'
1508};
1509const unstyled = {
1510 props: { 'data-polaris-unstyled': true },
1511 selector: '[data-polaris-unstyled]'
1512};
1513// these match our values in duration.scss
1514var Duration;
1515(function (Duration) {
1516 Duration[Duration["Instant"] = 0] = "Instant";
1517 Duration[Duration["Fast"] = 100] = "Fast";
1518 Duration[Duration["Base"] = 200] = "Base";
1519 Duration[Duration["Slow"] = 300] = "Slow";
1520 Duration[Duration["Slower"] = 400] = "Slower";
1521 Duration[Duration["Slowest"] = 500] = "Slowest";
1522})(Duration || (Duration = {}));
1523
1524var _React$createContext = React.createContext({
1525 forwardedRef: null
1526});
1527
1528const Provider = _React$createContext.Provider;
1529const Consumer = _React$createContext.Consumer;
1530
1531function withRef$1() {
1532 return function addForwardRef(WrappedComponent) {
1533 // eslint-disable-next-line react/prefer-stateless-function
1534 class WithRef extends React.Component {
1535 render() {
1536 return React.createElement(
1537 Consumer,
1538 null,
1539 ctx => React.createElement(WrappedComponent, Object.assign({}, this.props, { ref: ctx.forwardedRef }))
1540 );
1541 }
1542 }
1543 const FinalComponent = hoistStatics(WithRef, WrappedComponent);
1544 return FinalComponent;
1545 };
1546}
1547
1548// eslint-disable-next-line shopify/strict-component-boundaries
1549function compose$1(...wrappingFunctions) {
1550 return function wrapComponent(OriginalComponent) {
1551 const Result = compose(...wrappingFunctions)(OriginalComponent);
1552 return React.forwardRef((props, ref) => {
1553 return React.createElement(
1554 Provider,
1555 { value: { forwardedRef: ref } },
1556 React.createElement(Result, props)
1557 );
1558 });
1559 };
1560}
1561
1562class UnstyledLink$1 extends React.PureComponent {
1563 render() {
1564 const _a = this.props,
1565 polaris = _a.polaris,
1566 external = _a.external,
1567 url = _a.url,
1568 rest = tslib_1.__rest(_a, ["polaris", "external", "url"]);
1569 if (polaris && polaris.link) {
1570 const LinkComponent = polaris.link.getLinkComponent();
1571 if (LinkComponent) {
1572 const _b = this.props,
1573 polaris = _b.polaris,
1574 rest = tslib_1.__rest(_b, ["polaris"]);
1575 return React.createElement(LinkComponent, Object.assign({}, unstyled.props, rest));
1576 }
1577 }
1578 const target$$1 = external ? '_blank' : undefined;
1579 const rel = external ? 'noopener noreferrer' : undefined;
1580 return React.createElement('a', Object.assign({ target: target$$1 }, rest, { href: url, rel: rel }, unstyled.props));
1581 }
1582}
1583var UnstyledLink$2 = compose$1(withAppProvider(), withRef$1())(UnstyledLink$1);
1584
1585var styles$4 = {
1586 "VisuallyHidden": "p_bb",
1587};
1588
1589function VisuallyHidden$1({ children }) {
1590 return React.createElement(
1591 'span',
1592 { className: styles$4.VisuallyHidden },
1593 children
1594 );
1595}
1596
1597var styles$5 = {
1598 "Badge": "p_cf",
1599 "Pip": "p_f3",
1600 "statusSuccess": "p_mn",
1601 "statusInfo": "p_sf",
1602 "statusAttention": "p_ee",
1603 "statusWarning": "p_ny",
1604 "statusDanger": "p_cy",
1605 "statusNew": "p_lx",
1606 "progressIncomplete": "p_ci",
1607 "progressPartiallyComplete": "p_rt",
1608 "progressComplete": "p_lw",
1609 "Icon": "p_qn",
1610 "hasIcon": "p_pk",
1611};
1612
1613const PROGRESS_LABELS = {
1614 incomplete: 'incomplete',
1615 partiallyComplete: 'partiallyComplete',
1616 complete: 'complete'
1617};
1618const STATUS_LABELS = {
1619 info: 'info',
1620 success: 'success',
1621 warning: 'warning',
1622 attention: 'attention',
1623 new: 'new',
1624 danger: 'danger'
1625};
1626function Badge$1({ children, status, progress, icon, polaris: { intl } }) {
1627 const className = styles.classNames(styles$5.Badge, status && styles$5[styles.variationName('status', status)], progress && styles$5[styles.variationName('progress', progress)], icon && styles$5.hasIcon);
1628 let progressMarkup;
1629 switch (progress) {
1630 case PROGRESS_LABELS.incomplete:
1631 progressMarkup = intl.translate('Polaris.Badge.PROGRESS_LABELS.incomplete');
1632 break;
1633 case PROGRESS_LABELS.partiallyComplete:
1634 progressMarkup = intl.translate('Polaris.Badge.PROGRESS_LABELS.partiallyComplete');
1635 break;
1636 case PROGRESS_LABELS.complete:
1637 progressMarkup = intl.translate('Polaris.Badge.PROGRESS_LABELS.complete');
1638 break;
1639 }
1640 const pipMarkup = progress ? React.createElement(
1641 'span',
1642 { className: styles$5.Pip },
1643 React.createElement(
1644 VisuallyHidden$1,
1645 null,
1646 progressMarkup
1647 )
1648 ) : null;
1649 const iconMarkup = icon ? React.createElement(
1650 'span',
1651 { className: styles$5.Icon },
1652 React.createElement(Icon$2, { source: icon })
1653 ) : null;
1654 let statusMarkup;
1655 switch (status) {
1656 case STATUS_LABELS.info:
1657 statusMarkup = intl.translate('Polaris.Badge.STATUS_LABELS.info');
1658 break;
1659 case STATUS_LABELS.success:
1660 statusMarkup = intl.translate('Polaris.Badge.STATUS_LABELS.success');
1661 break;
1662 case STATUS_LABELS.warning:
1663 statusMarkup = intl.translate('Polaris.Badge.STATUS_LABELS.warning');
1664 break;
1665 case STATUS_LABELS.attention:
1666 statusMarkup = intl.translate('Polaris.Badge.STATUS_LABELS.attention');
1667 break;
1668 case STATUS_LABELS.danger:
1669 statusMarkup = intl.translate('Polaris.Badge.STATUS_LABELS.danger');
1670 break;
1671 case STATUS_LABELS.new:
1672 statusMarkup = intl.translate('Polaris.Badge.STATUS_LABELS.new');
1673 break;
1674 }
1675 const statusLabelMarkup = status ? React.createElement(
1676 VisuallyHidden$1,
1677 null,
1678 statusMarkup
1679 ) : null;
1680 return React.createElement(
1681 'span',
1682 { className: className },
1683 statusLabelMarkup,
1684 pipMarkup,
1685 iconMarkup,
1686 children
1687 );
1688}
1689var Badge$2 = withAppProvider()(Badge$1);
1690
1691var styles$6 = {
1692 "ActionList": "p_ah",
1693 "Section-withoutTitle": "p_hh",
1694 "Actions": "p_ca",
1695 "Section": "p_w3",
1696 "Title": "p_n9",
1697 "Item": "p_wo",
1698 "destructive": "p_jy",
1699 "disabled": "p_er",
1700 "Image": "p_bj",
1701 "Content": "p_qx",
1702 "Text": "p_nr",
1703 "BadgeWrapper": "p_do",
1704};
1705
1706function Item$1({ badge, content, url, onAction, icon, iconColor, image, disabled, external, destructive, ellipsis }) {
1707 const className = reactUtilities.classNames(styles$6.Item, disabled && styles$6.disabled, destructive && styles$6.destructive);
1708 let imageElement = null;
1709 if (icon) {
1710 imageElement = React.createElement(
1711 'div',
1712 { className: styles$6.Image },
1713 React.createElement(Icon$2, { source: icon, color: iconColor })
1714 );
1715 } else if (image) {
1716 imageElement = React.createElement('div', { role: 'presentation', className: styles$6.Image, style: { backgroundImage: `url(${image}` } });
1717 }
1718 const contentMarkup = ellipsis && content ? `${content}…` : content;
1719 const badgeMarkup = badge && React.createElement(
1720 'span',
1721 { className: styles$6.BadgeWrapper },
1722 React.createElement(
1723 Badge$2,
1724 { status: badge.status },
1725 badge.content
1726 )
1727 );
1728 const textMarkup = imageElement ? React.createElement(
1729 'div',
1730 { className: styles$6.Text },
1731 contentMarkup
1732 ) : contentMarkup;
1733 const contentElement = React.createElement(
1734 'div',
1735 { className: styles$6.Content },
1736 imageElement,
1737 textMarkup,
1738 badgeMarkup
1739 );
1740 const control = url ? React.createElement(
1741 UnstyledLink$2,
1742 { url: url, onClick: onAction, className: styles$6.Item, external: external },
1743 contentElement
1744 ) : React.createElement(
1745 'button',
1746 { onClick: onAction, className: className, disabled: disabled, type: 'button' },
1747 contentElement
1748 );
1749 return React.createElement(
1750 'li',
1751 null,
1752 control
1753 );
1754}
1755
1756function Section$1({ section, hasMultipleSections, onActionAnyItem }) {
1757 const handleAction = itemOnAction => {
1758 return () => {
1759 if (itemOnAction) {
1760 itemOnAction();
1761 }
1762 if (onActionAnyItem) {
1763 onActionAnyItem();
1764 }
1765 };
1766 };
1767 const actionMarkup = section.items.map((_a, index) => {
1768 var content = _a.content,
1769 onAction = _a.onAction,
1770 item = tslib_1.__rest(_a, ["content", "onAction"]);
1771
1772 return React.createElement(Item$1, Object.assign({ key: `${content}-${index}`, content: content, onAction: handleAction(onAction) }, item));
1773 });
1774 const className = section.title ? null : styles$6['Section-withoutTitle'];
1775 const titleMarkup = section.title ? React.createElement(
1776 'p',
1777 { className: styles$6.Title },
1778 section.title
1779 ) : null;
1780 const sectionMarkup = React.createElement(
1781 'div',
1782 { className: className },
1783 titleMarkup,
1784 React.createElement(
1785 'ul',
1786 { className: styles$6.Actions },
1787 actionMarkup
1788 )
1789 );
1790 return hasMultipleSections ? React.createElement(
1791 'li',
1792 { className: styles$6.Section },
1793 sectionMarkup
1794 ) : sectionMarkup;
1795}
1796
1797function ActionList$1({ items, sections = [], onActionAnyItem }) {
1798 let finalSections = [];
1799 if (items) {
1800 finalSections = [{ items }, ...sections];
1801 } else if (sections) {
1802 finalSections = sections;
1803 }
1804 const hasMultipleSections = finalSections.length > 1;
1805 const Element = hasMultipleSections ? 'ul' : 'div';
1806 const sectionMarkup = finalSections.map((section, index) => {
1807 return React.createElement(Section$1, { key: section.title || index, section: section, onActionAnyItem: onActionAnyItem, hasMultipleSections: hasMultipleSections });
1808 });
1809 return React.createElement(
1810 Element,
1811 { className: styles$6.ActionList },
1812 sectionMarkup
1813 );
1814}
1815
1816function Image$1(_a) {
1817 var sourceSet = _a.sourceSet,
1818 source = _a.source,
1819 crossOrigin = _a.crossOrigin,
1820 rest = tslib_1.__rest(_a, ["sourceSet", "source", "crossOrigin"]);
1821
1822 const finalSourceSet = sourceSet ? sourceSet.map(({ source: subSource, descriptor }) => `${subSource} ${descriptor}`).join(',') : null;
1823 return finalSourceSet ?
1824 // eslint-disable-next-line jsx-a11y/alt-text
1825 React.createElement("img", Object.assign({ src: source, srcSet: finalSourceSet, crossOrigin: crossOrigin }, rest)) :
1826 // eslint-disable-next-line jsx-a11y/alt-text
1827 React.createElement("img", Object.assign({ src: source }, rest, { crossOrigin: crossOrigin }));
1828}
1829
1830var styles$7 = {
1831 "Avatar": "p_lb",
1832 "sizeExtraSmall": "p_yr",
1833 "sizeSmall": "p_rx",
1834 "sizeMedium": "p_xt",
1835 "sizeLarge": "p_fz",
1836 "styleOne": "p_n3",
1837 "styleTwo": "p_ry",
1838 "styleThree": "p_ld",
1839 "styleFour": "p_wm",
1840 "styleFive": "p_a6",
1841 "styleSix": "p_dr",
1842 "hasImage": "p_qp",
1843 "Image": "p_ed",
1844 "Initials": "p_qj",
1845 "Svg": "p_p0",
1846};
1847
1848var avatar1 = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSIjMjQ1YjQ4IiBkPSJNMCAwaDEwMHYxMDBIMHoiLz48cGF0aCBmaWxsPSIjMmRiMTY3IiBkPSJNNjkgMHY2NS42NWwtMi0uMDF2MTkuODVsMiAuMDJWMTAwSDBWMGg2OXoiLz48cGF0aCBmaWxsPSIjZmZmIiBkPSJNNjcgNjUuNjR2MTkuODVsLTI1LjU3LS4xOUMzMiA4NS4yMiAyNS42IDgxLjQ2IDI1LjY4IDcyLjA2cy4yNS02Ljc0LjI1LTYuNzR6Ii8+PHBhdGggZmlsbD0iIzhkYzk1OCIgZD0iTTg2Ljk5IDU4SDY5VjBoMTAuOTNsNy4wNiA1OHoiLz48cGF0aCBmaWxsPSIjZWJlZGYxIiBkPSJNMjQuNTMgNDAuMjlhMTIuMjMgMTIuMjMgMCAwIDEgMjQuNDYgMCIgb3BhY2l0eT0iLjIiLz48cGF0aCBmaWxsPSIjOGRjOTU4IiBkPSJNNTkuNjIgNThBMTAuNjkgMTAuNjkgMCAwIDEgODEgNTh6Ii8+PC9zdmc+Cg==';
1849
1850var avatar2 = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSIjMWUyNjVjIiBkPSJNLS4wMSAwaDEwMHYxMDBoLTEwMHoiLz48cGF0aCBmaWxsPSIjNWQ2Y2MxIiBkPSJNLS4wMSAwaDY5LjAydjEwMEgtLjAxeiIvPjxwYXRoIGZpbGw9IiNmZmYiIGQ9Ik02OC45MyA2NS44OGwtMjQuNDQtLjE5LS4wNSA2LjA5YzAgNS4yMiAzLjQ4IDkuNDcgOC42OSA5LjUybDE1LjguMTJ6Ii8+PHBhdGggZmlsbD0iI2ZmYzA0ZCIgZD0iTTY4LjkxIDExLjNsMTkuMTcgNDYuMjktMTkuMTctLjE2VjExLjN6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIGQ9Ik0yMy4yNSAzNi40M2EzLjIyIDMuMjIgMCAxIDAgMCA2LjQ0bTIxLjAxLTYuNDRhMy4yMiAzLjIyIDAgMCAwIDAgNi40NG0tMTMuNTUgMy43NGEzLjIyIDMuMjIgMCAxIDAgMCA2LjQ0bTMuMjItMjUuNTFhMy4yMiAzLjIyIDAgMCAwIDAgNi40NCIvPjwvc3ZnPgo=';
1851
1852var avatar3 = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSIjNWQ2Y2MxIiBkPSJNLS4wMiAwaDEwMHYxMDBoLTEwMHoiLz48cGF0aCBmaWxsPSIjNmRjYWNlIiBkPSJNLjM5IDBoNjkuMDJ2MTAwSC4zOXoiLz48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjUiIGQ9Ik0yNC4xOCAzMS4yMXYzLjQ3QTEwLjQzIDEwLjQzIDAgMCAwIDM0LjQgNDUuMjFhMTAuNDMgMTAuNDMgMCAwIDAgMTAuMjItMTAuNTN2LTMuNDciLz48cGF0aCBmaWxsPSIjZWJlZGYxIiBkPSJNMjAuMTEgNDkuMDdhMTYuMjIgMTYuMjIgMCAxIDEgMCAzMi40NCIgb3BhY2l0eT0iLjIiLz48cGF0aCBkPSJNNjkuNDQgMTguODNMOTAgNzFINjkuNDRWMTguODN6IiBmaWxsPSIjZmZmIi8+PHBhdGggZD0iTTU3LjU5IDcxYTYgNiAwIDAgMSAxMiAweiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPgo=';
1853
1854var avatar4 = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSIjZmZlMGMzIiBkPSJNMC0uMDFoMTAwdjEwMEgweiIvPjxwYXRoIGZpbGw9IiM1ZDZjYzEiIGQ9Ik0wIDBoNjkuMDJ2MTAwSDB6Ii8+PHBhdGggZD0iTTY5LjAyIDBsMjQuMDMgNjEuNjlINjkuMDJWMHoiIGZpbGw9IiNmZjk2N2QiLz48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjUiIGQ9Ik0zMC42OSAzMS45MXYtM2MwLTQuNzggMy40Ni04LjY1IDgtOC42NXM4IDMuODcgOCA4LjY1djMiLz48cGF0aCBmaWxsPSIjZWJlZGYxIiBkPSJNMTIuNzYgNTYuMDZhMTMuMzYgMTMuMzYgMCAxIDEgMjYuNzIgMCIgb3BhY2l0eT0iLjIiLz48cGF0aCBkPSJNODAgNjEuNDZsLTI5LjM0LjIzdi03LjMzYzAtNi4yOCA0LjA3LTExLjM2IDEwLjM0LTExLjQ0bDE5LS4xNHoiIGZpbGw9IiNmZjk2N2QiLz48L3N2Zz4K';
1855
1856var avatar5 = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSIjOGRjOTU4IiBkPSJNMCAwaDcwLjAydjEwMEgweiIvPjxwYXRoIGQ9Ik02OS45MiAwdjU2LjMyTDQ5IDY3bC0uMyAyNS4wN1YxMDBIMTAwVjB6IiBmaWxsPSIjMmRiMTY3Ii8+PHBhdGggZmlsbD0iIzI0NWI0OCIgZD0iTTU5LjI3IDU4LjI5YTUuMjIgNS4yMiAwIDAgMC05LjQzIDQuNDgiLz48cGF0aCBkPSJNMjcuMTIgOS4zM2g0NC41M3YyLjE5SDI3LjEyem0tMTIuNDEgOS40OWg1Ni45NHYyLjE5SDE0LjcxeiIgZmlsbD0iIzJkYjE2NyIvPjxjaXJjbGUgY3g9IjE5LjY2IiBjeT0iNDQuOCIgcj0iMTEuMjIiIGZpbGw9IiNlYmVkZjEiIG9wYWNpdHk9Ii4yIi8+PC9zdmc+Cg==';
1857
1858var avatar6 = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBkPSJNLS4wMi0uMDFoMTAwdjEwMGgtMTAweiIgZmlsbD0iI2ZmZTBjMyIvPjxwYXRoIGZpbGw9IiNmZjk2N2QiIGQ9Ik0wIDBoNjkuNDF2MTAwSDB6Ii8+PHBhdGggZD0iTTY5LjkyIDB2NDQuMzJMNTEuMzQgNTV2NDVIMTAwVjB6IiBmaWxsPSIjZmZlMGMzIi8+PHBhdGggZmlsbD0iIzMyY2FjNiIgZD0iTTM5LjMyIDc2YTExLjg1IDExLjg1IDAgMCAwIDEyIDExLjYyVjc2Ii8+PHBhdGggZmlsbD0iIzAwOTc5NiIgZD0iTTM5LjMyIDc2YTEyIDEyIDAgMCAxIDEyLTExLjgyVjc2Ii8+PHBhdGggZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSI1IiBkPSJNNDMuNzQgMTkuODNhMTIuODIgMTIuODIgMCAxIDEtMjUuNjQgMCIvPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iNCIgZD0iTTI3LjM5IDMxLjZsLTEuNTggNS45Nm05LjM3LTUuNzJsMi41NSA1LjQ3bTQuMjYtOS44NWwzLjUzIDQuNW0tMjUuNDMtNC41bC0zLjUzIDQuNSIvPjwvc3ZnPgo=';
1859
1860var avatar7 = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBkPSJNMCAwaDEwMHYxMDAuNDhIMHoiIGZpbGw9IiM4ZGM5NTgiLz48cGF0aCBmaWxsPSIjMmRiMTY3IiBkPSJNODMgNjh2MzJsLTE0LS4xNnYuMTZIMFYwaDY5djY4aDE0eiIvPjxwYXRoIGQ9Ik02OS4yOSA0MS42OUgyMC42NnMtLjA5LTMtLjE3IDcuMTUgNyAxOC41MSAxNy4zNSAxOC41OWwzMS40NS41N3oiIGZpbGw9IiM4ZGM5NTgiLz48cGF0aCBkPSJNNjguNyAxMi40bDExLjU0IDI5LjI5SDY4LjdWMTIuNHoiIGZpbGw9IiNmZmYiLz48cGF0aCBkPSJNNjIuMjIgNDEuNjlhMy4zNCAzLjM0IDAgMSAxIDYuNjkgMHoiIGZpbGw9IiNmZmYiLz48cGF0aCBmaWxsPSIjMjQ1YjQ4IiBkPSJNNDEuNDUgMTguMDZhMi41NyAyLjU3IDAgMCAwLTUuMTQgME0zMy4zMyAyNGEyLjU3IDIuNTcgMCAxIDAtNS4xNCAwbTIwLjM2IDIuNThhMi41NyAyLjU3IDAgMSAwLTUuMTQgMCIvPjwvc3ZnPgo=';
1861
1862var avatar8 = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSIjZmZlZGI5IiBkPSJNMCAwaDEwMHYxMDBIMHoiLz48cGF0aCBkPSJNNjQuNjMgMTcuMzNhMTcgMTcgMCAwIDEgNSAyOS43MiAxNi43NSAxNi43NSAwIDAgMS01IDIuNjIiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjUiLz48cGF0aCBmaWxsPSIjZmZjMDRkIiBkPSJNMCAwaDY5LjAydjEwMEgweiIvPjxjaXJjbGUgY3g9IjQ1LjExIiBjeT0iMzMuNDkiIHI9IjE2Ljk4IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgtMzcuMDIgNDUuMTI0IDMzLjQ5MykiLz48cGF0aCBmaWxsPSIjNWQ2Y2MxIiBkPSJNNjkuMDIgMzQuNDhsMTkuNDcgMzguNzQtMTkuNDcgMS41M1YzNC40OHoiLz48cGF0aCBkPSJNNjEuNiAzMy42N2ExMC4xNyAxMC4xNyAwIDAgMSAxNS40LjA4IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSI1Ii8+PC9zdmc+Cg==';
1863
1864var avatar9 = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBkPSJNMCAwaDEwMHYxMDBIMHoiIGZpbGw9IiNmZmMwNGQiLz48cGF0aCBkPSJNMCAwaDY5LjQxdjEwMEgweiIgZmlsbD0iIzVkNmNjMSIvPjxwYXRoIGQ9Ik03MC4yMSA4MC44OGgtMTUuMWMtNC44MSAwLTUuNjgtNS44NC01LjY4LTUuODRoMjAuNzgiIGZpbGw9IiNmZmMwNGQiLz48cGF0aCBkPSJNODIgNjAuNDhsLTE0IC4yNVYwaDEwLjE3QzgwLjU5IDIwLjE0IDgyIDYwLjQ4IDgyIDYwLjQ4eiIgZmlsbD0iIzVkNmNjMSIvPjxwYXRoIGZpbGw9IiM0MTIzNmUiIGQ9Ik01Ny43MSA2MC40OGE1LjQ0IDUuNDQgMCAxIDEgMTAuODcgMCIvPjxjaXJjbGUgY3g9IjI0Ljc3IiBjeT0iNDAuMTkiIHI9IjExLjIyIiBmaWxsPSIjZWJlZGYxIiBvcGFjaXR5PSIuMiIvPjwvc3ZnPgo=';
1865
1866
1867
1868var avatars = Object.freeze({
1869 avatarOne: avatar1,
1870 avatarTwo: avatar2,
1871 avatarThree: avatar3,
1872 avatarFour: avatar4,
1873 avatarFive: avatar5,
1874 avatarSix: avatar6,
1875 avatarSeven: avatar7,
1876 avatarEight: avatar8,
1877 avatarNine: avatar9
1878});
1879
1880const STYLE_CLASSES = ['one', 'two', 'three', 'four', 'five', 'six'];
1881const AVATAR_IMAGES = Object.keys(avatars).map(key => avatars[key]);
1882function Avatar$1({ name, source, initials, customer, size = 'medium', accessibilityLabel, polaris: { intl } }) {
1883 const nameString = name || initials;
1884 let finalSource;
1885 let label;
1886 if (accessibilityLabel) {
1887 label = accessibilityLabel;
1888 } else if (name) {
1889 label = name;
1890 } else if (initials) {
1891 const splitInitials = initials.split('').join(' ');
1892 label = intl.translate('Polaris.Avatar.labelWithInitials', {
1893 initials: splitInitials
1894 });
1895 } else {
1896 label = intl.translate('Polaris.Avatar.label');
1897 }
1898 if (source) {
1899 finalSource = source;
1900 } else if (customer) {
1901 finalSource = customerPlaceholder(nameString);
1902 }
1903 const className = styles.classNames(styles$7.Avatar, styles$7[styles.variationName('style', styleClass(nameString))], size && styles$7[styles.variationName('size', size)], finalSource && styles$7.hasImage);
1904 const imageMarkUp = finalSource ? React.createElement(Image$1, { className: styles$7.Image, source: finalSource, alt: '', role: 'presentation' }) : null;
1905 // Use `dominant-baseline: central` instead of `dy` when Edge supports it.
1906 const verticalOffset = '0.35em';
1907 const initialsMarkup = initials ? React.createElement(
1908 'span',
1909 { className: styles$7.Initials },
1910 React.createElement(
1911 'svg',
1912 { className: styles$7.Svg, viewBox: '0 0 48 48' },
1913 React.createElement(
1914 'text',
1915 { x: '50%', y: '50%', dy: verticalOffset, fill: 'currentColor', fontSize: '26', textAnchor: 'middle' },
1916 initials
1917 )
1918 )
1919 ) : null;
1920 return React.createElement(
1921 'span',
1922 { 'aria-label': label, role: 'img', className: className },
1923 initialsMarkup,
1924 imageMarkUp
1925 );
1926}
1927function styleClass(name) {
1928 return name ? STYLE_CLASSES[name.charCodeAt(0) % STYLE_CLASSES.length] : STYLE_CLASSES[0];
1929}
1930function customerPlaceholder(name) {
1931 return name ? AVATAR_IMAGES[name.charCodeAt(0) % AVATAR_IMAGES.length] : AVATAR_IMAGES[0];
1932}
1933var Avatar$2 = withAppProvider()(Avatar$1);
1934
1935function handleMouseUpByBlurring({ currentTarget }) {
1936 currentTarget.blur();
1937}
1938
1939var styles$8 = {
1940 "Spinner": "p_i0",
1941 "loading": "p_e6",
1942 "sizeSmall": "p_iw",
1943 "sizeLarge": "p_u8",
1944 "colorWhite": "p_yg",
1945 "colorTeal": "p_cu",
1946 "colorInkLightest": "p_i5",
1947};
1948
1949var spinnerSVGLarge = {"viewBox":"0 0 44 44","body":"<path d=\"M15.542 1.487A21.507 21.507 0 0 0 .5 22c0 11.874 9.626 21.5 21.5 21.5 9.847 0 18.364-6.675 20.809-16.072a1.5 1.5 0 0 0-2.904-.756C37.803 34.755 30.473 40.5 22 40.5 11.783 40.5 3.5 32.217 3.5 22c0-8.137 5.3-15.247 12.942-17.65a1.5 1.5 0 1 0-.9-2.863z\" />"};
1950
1951var spinnerSVGSmall = {"viewBox":"0 0 20 20","body":"<path d=\"M7.229 1.173a9.25 9.25 0 1 0 11.655 11.412 1.25 1.25 0 1 0-2.4-.698 6.75 6.75 0 1 1-8.506-8.329 1.25 1.25 0 1 0-.75-2.385z\" />"};
1952
1953const COLORS_FOR_LARGE_SPINNER = ['teal', 'inkLightest'];
1954function Spinner$1({ size = 'large', color = 'teal', accessibilityLabel, polaris: { intl } }) {
1955 if (size === 'large' && COLORS_FOR_LARGE_SPINNER.indexOf(color) < 0) {
1956 if (process.env.NODE_ENV === 'development') {
1957 // eslint-disable-next-line no-console
1958 console.warn(intl.translate('Polaris.Spinner.warningMessage', {
1959 color,
1960 size,
1961 colors: COLORS_FOR_LARGE_SPINNER.join(', ')
1962 }));
1963 }
1964 // eslint-disable-next-line no-param-reassign
1965 size = 'small';
1966 }
1967 const className = styles.classNames(styles$8.Spinner, color && styles$8[styles.variationName('color', color)], size && styles$8[styles.variationName('size', size)]);
1968 const spinnerSVG = size === 'large' ? spinnerSVGLarge : spinnerSVGSmall;
1969 return React.createElement('svg', { viewBox: spinnerSVG.viewBox, dangerouslySetInnerHTML: { __html: spinnerSVG.body }, className: className, 'aria-label': accessibilityLabel, role: 'status' });
1970}
1971var Spinner$2 = withAppProvider()(Spinner$1);
1972
1973var styles$9 = {
1974 "Indicator": "p_lr",
1975 "pulseIndicator": "p_dm",
1976 "bounce": "p_y3",
1977 "pulse": "p_ak",
1978};
1979
1980function Indicator$1({ pulse = true }) {
1981 const className = styles.classNames(styles$9.Indicator, pulse && styles$9.pulseIndicator);
1982 return React.createElement('span', { className: className });
1983}
1984
1985var styles$10 = {
1986 "Button": "p_vk",
1987 "disabled": "p_tk",
1988 "Content": "p_ei",
1989 "Icon": "p_m8",
1990 "Spinner": "p_t3",
1991 "sizeSlim": "p_tj",
1992 "primary": "p_pt",
1993 "destructive": "p_m1",
1994 "outline": "p_ay",
1995 "loading": "p_ew",
1996 "plain": "p_i4",
1997 "fullWidth": "p_ri",
1998 "sizeLarge": "p_eh",
1999 "iconOnly": "p_a2",
2000 "minimal": "p_yq",
2001};
2002
2003function Button$1({ id, url, disabled, loading, children, accessibilityLabel, ariaControls, ariaExpanded, onClick, onFocus, onBlur, external, icon, primary, outline, minimal, destructive, disclosure, plain, submit, size = 'medium', fullWidth, polaris: { intl } }) {
2004 const indicator = false;
2005 const isDisabled = disabled || loading;
2006 const className = reactUtilities.classNames(styles$10.Button, primary && styles$10.primary, outline && styles$10.outline, minimal && styles$10.minimal, destructive && styles$10.destructive, isDisabled && styles$10.disabled, loading && styles$10.loading, plain && styles$10.plain, size && size !== 'medium' && styles$10[reactUtilities.variationName('size', size)], fullWidth && styles$10.fullWidth, icon && children == null && styles$10.iconOnly);
2007 const disclosureIconMarkup = disclosure ? React.createElement(
2008 IconWrapper,
2009 null,
2010 React.createElement(Icon$2, { source: loading ? 'placeholder' : 'caretDown' })
2011 ) : null;
2012 let iconMarkup;
2013 if (icon) {
2014 const iconInner = isIconSource(icon) ? React.createElement(Icon$2, { source: loading ? 'placeholder' : icon }) : icon;
2015 iconMarkup = React.createElement(
2016 IconWrapper,
2017 null,
2018 iconInner
2019 );
2020 }
2021 const childMarkup = children ? React.createElement(
2022 'span',
2023 null,
2024 children
2025 ) : null;
2026 const spinnerColor = primary || destructive ? 'white' : 'inkLightest';
2027 const spinnerSVGMarkup = loading ? React.createElement(
2028 'span',
2029 { className: styles$10.Spinner },
2030 React.createElement(Spinner$2, { size: 'small', color: spinnerColor, accessibilityLabel: intl.translate('Polaris.Button.spinnerAccessibilityLabel') })
2031 ) : null;
2032 const indicatorMarkup = indicator && React.createElement(Indicator$1, null);
2033 const content = iconMarkup || disclosureIconMarkup ? React.createElement(
2034 'span',
2035 { className: styles$10.Content },
2036 spinnerSVGMarkup,
2037 iconMarkup,
2038 childMarkup,
2039 disclosureIconMarkup
2040 ) : React.createElement(
2041 'span',
2042 { className: styles$10.Content },
2043 spinnerSVGMarkup,
2044 childMarkup
2045 );
2046 const type = submit ? 'submit' : 'button';
2047 return url ? React.createElement(
2048 UnstyledLink$2,
2049 { id: id, url: url, external: external, onClick: onClick, onFocus: onFocus, onBlur: onBlur, onMouseUp: handleMouseUpByBlurring, className: className, disabled: isDisabled, 'aria-label': accessibilityLabel },
2050 indicatorMarkup,
2051 content
2052 ) : React.createElement(
2053 'button',
2054 { id: id, type: type, onClick: onClick, onFocus: onFocus, onBlur: onBlur, onMouseUp: handleMouseUpByBlurring, className: className, disabled: isDisabled, 'aria-label': accessibilityLabel, 'aria-controls': ariaControls, 'aria-expanded': ariaExpanded, role: loading ? 'alert' : undefined, 'aria-busy': loading ? true : undefined },
2055 indicatorMarkup,
2056 content
2057 );
2058}
2059function IconWrapper({ children }) {
2060 return React.createElement(
2061 'span',
2062 { className: styles$10.Icon },
2063 children
2064 );
2065}
2066function isIconSource(x) {
2067 return typeof x === 'string' || typeof x === 'object' && x.body;
2068}
2069var Button$2 = withAppProvider()(Button$1);
2070
2071function buttonsFrom(actions, overrides = {}) {
2072 if (Array.isArray(actions)) {
2073 return actions.map((action, index) => buttonFrom(action, overrides, index));
2074 } else {
2075 const action = actions;
2076 return buttonFrom(action, overrides);
2077 }
2078}
2079function buttonFrom(_a, overrides, key) {
2080 var content = _a.content,
2081 onAction = _a.onAction,
2082 action = tslib_1.__rest(_a, ["content", "onAction"]);
2083
2084 return React.createElement(
2085 Button$2,
2086 Object.assign({ key: key, onClick: onAction }, action, overrides),
2087 content
2088 );
2089}
2090
2091var styles$11 = {
2092 "Heading": "p_l2",
2093};
2094
2095function Heading$1({ element: Element = 'h2', children }) {
2096 return React.createElement(
2097 Element,
2098 { className: styles$11.Heading },
2099 children
2100 );
2101}
2102
2103var styles$12 = {
2104 "ButtonGroup": "p_ug",
2105 "Item": "p_l9",
2106 "Item-plain": "p_d4",
2107 "segmented": "p_n2",
2108 "Item-focused": "p_o9",
2109 "fullWidth": "p_s0",
2110 "connectedTop": "p_vn",
2111};
2112
2113class Item$3 extends React.PureComponent {
2114 constructor() {
2115 super(...arguments);
2116 this.state = { focused: false };
2117 }
2118 render() {
2119 const button = this.props.button;
2120 const focused = this.state.focused;
2121
2122 const className = styles.classNames(styles$12.Item, focused && styles$12['Item-focused'], button.props.plain && styles$12['Item-plain']);
2123 return React.createElement(
2124 'div',
2125 { className: className, onFocus: this.handleFocus, onBlur: this.handleBlur },
2126 button
2127 );
2128 }
2129 handleFocus() {
2130 this.setState({ focused: true });
2131 }
2132 handleBlur() {
2133 this.setState({ focused: false });
2134 }
2135}
2136tslib_1.__decorate([decorators.autobind], Item$3.prototype, "handleFocus", null);
2137tslib_1.__decorate([decorators.autobind], Item$3.prototype, "handleBlur", null);
2138
2139function ButtonGroup$1({ children, segmented, fullWidth, connectedTop }) {
2140 const className = styles.classNames(styles$12.ButtonGroup, segmented && styles$12.segmented, fullWidth && styles$12.fullWidth, connectedTop && styles$12.connectedTop);
2141 const contents = reactUtilities.elementChildren(children).map((child, index) => React.createElement(Item$3, { button: child, key: index }));
2142 return React.createElement(
2143 'div',
2144 { className: className },
2145 contents
2146 );
2147}
2148
2149var styles$13 = {
2150 "Banner": "p_zt",
2151 "withinContentContainer": "p_o7",
2152 "statusSuccess": "p_np",
2153 "statusInfo": "p_r5",
2154 "statusWarning": "p_d1",
2155 "statusCritical": "p_dh",
2156 "Ribbon": "p_h6",
2157 "Actions": "p_xz",
2158 "Dismiss": "p_i9",
2159 "withinPage": "p_hp",
2160 "hasDismiss": "p_fm",
2161 "Heading": "p_gi",
2162 "Content": "p_im",
2163 "SecondaryAction": "p_bt",
2164 "Text": "p_lm",
2165};
2166
2167var successIcon = {"viewBox":"0 0 20 20","body":"<g fill-rule=\"evenodd\"><circle fill=\"currentColor\" cx=\"10\" cy=\"10\" r=\"9\"/><path d=\"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8m2.293-10.707L9 10.586 7.707 9.293a1 1 0 1 0-1.414 1.414l2 2a.997.997 0 0 0 1.414 0l4-4a1 1 0 1 0-1.414-1.414\" /></g>"};
2168
2169var fallbackIcon = {"viewBox":"0 0 20 20","body":"<g fill-rule=\"evenodd\"><path fill=\"currentColor\" d=\"M2 3h11v4h6l-2 4 2 4H8v-4H3\"/><path d=\"M16.105 11.447L17.381 14H9v-2h4a1 1 0 0 0 1-1V8h3.38l-1.274 2.552a.993.993 0 0 0 0 .895zM2.69 4H12v6H4.027L2.692 4zm15.43 7l1.774-3.553A1 1 0 0 0 19 6h-5V3c0-.554-.447-1-1-1H2.248L1.976.782a1 1 0 1 0-1.953.434l4 18a1.006 1.006 0 0 0 1.193.76 1 1 0 0 0 .76-1.194L4.47 12H7v3a1 1 0 0 0 1 1h11c.346 0 .67-.18.85-.476a.993.993 0 0 0 .044-.972l-1.775-3.553z\" /></g>"};
2170
2171var warningIcon = {"viewBox":"0 0 20 20","body":"<g fill-rule=\"evenodd\"><circle fill=\"currentColor\" cx=\"10\" cy=\"10\" r=\"9\"/><path d=\"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8m0-13a1 1 0 0 0-1 1v4a1 1 0 1 0 2 0V6a1 1 0 0 0-1-1m0 8a1 1 0 1 0 0 2 1 1 0 0 0 0-2\" /></g>"};
2172
2173var criticalIcon = {"viewBox":"0 0 20 20","body":"<g fill-rule=\"evenodd\"><circle fill=\"currentColor\" cx=\"10\" cy=\"10\" r=\"9\"/><path d=\"M2 10c0-1.846.635-3.543 1.688-4.897l11.209 11.209A7.954 7.954 0 0 1 10 18c-4.411 0-8-3.589-8-8m14.312 4.897L5.103 3.688A7.954 7.954 0 0 1 10 2c4.411 0 8 3.589 8 8a7.952 7.952 0 0 1-1.688 4.897M0 10c0 5.514 4.486 10 10 10s10-4.486 10-10S15.514 0 10 0 0 4.486 0 10\" /></g>"};
2174
2175var infoIcon = {"viewBox":"0 0 20 20","body":"<g fill-rule=\"evenodd\"><circle cx=\"10\" cy=\"10\" r=\"9\" fill=\"currentColor\"/><path d=\"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0m0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8m1-5v-3a1 1 0 0 0-1-1H9a1 1 0 1 0 0 2v3a1 1 0 0 0 1 1h1a1 1 0 1 0 0-2m-1-5.9a1.1 1.1 0 1 0 0-2.2 1.1 1.1 0 0 0 0 2.2\"/></g>"};
2176
2177class Banner$1 extends React.PureComponent {
2178 render() {
2179 var _props = this.props;
2180 const icon = _props.icon,
2181 action = _props.action,
2182 secondaryAction = _props.secondaryAction,
2183 title = _props.title,
2184 children = _props.children,
2185 status = _props.status,
2186 onDismiss = _props.onDismiss;
2187 const withinContentContainer = this.context.withinContentContainer;
2188
2189 let color;
2190 let defaultIcon;
2191 let ariaRoleType = 'status';
2192 switch (status) {
2193 case 'success':
2194 color = 'greenDark';
2195 defaultIcon = successIcon;
2196 break;
2197 case 'info':
2198 color = 'blueDark';
2199 defaultIcon = infoIcon;
2200 break;
2201 case 'warning':
2202 color = 'yellowDark';
2203 defaultIcon = warningIcon;
2204 ariaRoleType = 'alert';
2205 break;
2206 case 'critical':
2207 color = 'redDark';
2208 defaultIcon = criticalIcon;
2209 ariaRoleType = 'alert';
2210 break;
2211 default:
2212 color = 'inkLighter';
2213 defaultIcon = fallbackIcon;
2214 }
2215 const className = styles.classNames(styles$13.Banner, status && styles$13[styles.variationName('status', status)], onDismiss && styles$13.hasDismiss, withinContentContainer ? styles$13.withinContentContainer : styles$13.withinPage);
2216 const id = uniqueID();
2217 const iconName = icon || defaultIcon;
2218 let headingMarkup = null;
2219 let headingID;
2220 if (title) {
2221 headingID = `${id}Heading`;
2222 headingMarkup = React.createElement(
2223 'div',
2224 { className: styles$13.Heading, id: headingID },
2225 React.createElement(
2226 Heading$1,
2227 { element: 'p' },
2228 title
2229 )
2230 );
2231 }
2232 const buttonSizeValue = withinContentContainer ? 'slim' : undefined;
2233 const secondaryActionMarkup = secondaryAction ? secondaryActionFrom(secondaryAction) : null;
2234 const actionMarkup = action ? React.createElement(
2235 'div',
2236 { className: styles$13.Actions },
2237 React.createElement(
2238 ButtonGroup$1,
2239 null,
2240 buttonFrom(action, { outline: true, size: buttonSizeValue }),
2241 secondaryActionMarkup
2242 )
2243 ) : null;
2244 let contentMarkup = null;
2245 let contentID;
2246 if (children || actionMarkup) {
2247 contentID = `${id}Content`;
2248 contentMarkup = React.createElement(
2249 'div',
2250 { className: styles$13.Content, id: contentID },
2251 children,
2252 actionMarkup
2253 );
2254 }
2255 const dismissButton = onDismiss ? React.createElement(
2256 'div',
2257 { className: styles$13.Dismiss },
2258 React.createElement(Button$2, { plain: true, icon: 'cancelSmall', onClick: onDismiss, accessibilityLabel: 'Dismiss notification' })
2259 ) : null;
2260 return React.createElement(
2261 'div',
2262 { className: className
2263 // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
2264 , tabIndex: 0, role: ariaRoleType, 'aria-live': 'polite', onMouseUp: handleMouseUp, 'aria-labelledby': headingID, 'aria-describedby': contentID },
2265 dismissButton,
2266 React.createElement(
2267 'div',
2268 { className: styles$13.Ribbon },
2269 React.createElement(Icon$2, { source: iconName, color: color, backdrop: true })
2270 ),
2271 React.createElement(
2272 'div',
2273 null,
2274 headingMarkup,
2275 contentMarkup
2276 )
2277 );
2278 }
2279}
2280Banner$1.contextTypes = contentContextTypes;
2281let index = 1;
2282function uniqueID() {
2283 return `Banner${index++}`;
2284}
2285function handleMouseUp({ currentTarget }) {
2286 currentTarget.blur();
2287}
2288function secondaryActionFrom(action) {
2289 if (action.url) {
2290 return React.createElement(
2291 UnstyledLink$2,
2292 { className: styles$13.SecondaryAction, url: action.url, external: action.external },
2293 React.createElement(
2294 'span',
2295 { className: styles$13.Text },
2296 action.content
2297 )
2298 );
2299 }
2300 return React.createElement(
2301 'button',
2302 { className: styles$13.SecondaryAction, onClick: action.onAction },
2303 React.createElement(
2304 'span',
2305 { className: styles$13.Text },
2306 action.content
2307 )
2308 );
2309}
2310
2311var styles$14 = {
2312 "Breadcrumb": "p_w7",
2313 "Icon": "p_kb",
2314 "Content": "p_o6",
2315};
2316
2317class Breadcrumbs$1 extends React.PureComponent {
2318 render() {
2319 const breadcrumbs = this.props.breadcrumbs;
2320
2321 const breadcrumb = breadcrumbs[breadcrumbs.length - 1];
2322 if (breadcrumb == null) {
2323 return null;
2324 }
2325 const content = breadcrumb.content;
2326
2327 const contentMarkup = React.createElement(
2328 React.Fragment,
2329 null,
2330 React.createElement(
2331 'span',
2332 { className: styles$14.Icon },
2333 React.createElement(Icon$2, { source: 'chevronLeft' })
2334 ),
2335 React.createElement(
2336 'span',
2337 { className: styles$14.Content },
2338 content
2339 )
2340 );
2341 const breadcrumbMarkup = 'url' in breadcrumb ? React.createElement(
2342 UnstyledLink$2,
2343 { key: content, url: breadcrumb.url, className: styles$14.Breadcrumb, onMouseUp: handleMouseUpByBlurring },
2344 contentMarkup
2345 ) : React.createElement(
2346 'button',
2347 { key: content, className: styles$14.Breadcrumb, onClick: breadcrumb.onAction, onMouseUp: handleMouseUpByBlurring, type: 'button' },
2348 contentMarkup
2349 );
2350 return (
2351 // eslint-disable-next-line jsx-a11y/no-redundant-roles
2352 React.createElement(
2353 'nav',
2354 { role: 'navigation' },
2355 breadcrumbMarkup
2356 )
2357 );
2358 }
2359}
2360
2361var styles$15 = {
2362 "Stack": "p_qc",
2363 "Item": "p_yo",
2364 "noWrap": "p_jj",
2365 "vertical": "p_kn",
2366 "spacingNone": "p_w6",
2367 "spacingExtraTight": "p_sj",
2368 "spacingTight": "p_la",
2369 "spacingLoose": "p_s2",
2370 "spacingExtraLoose": "p_ud",
2371 "distributionLeading": "p_ft",
2372 "distributionTrailing": "p_gj",
2373 "distributionCenter": "p_mc",
2374 "distributionEqualSpacing": "p_cl",
2375 "distributionFill": "p_bv",
2376 "distributionFillEvenly": "p_au",
2377 "alignmentLeading": "p_bc",
2378 "alignmentTrailing": "p_d0",
2379 "alignmentCenter": "p_t1",
2380 "alignmentFill": "p_xr",
2381 "alignmentBaseline": "p_dd",
2382 "Item-fill": "p_ye",
2383};
2384
2385function Item$5({ children, fill }) {
2386 const className = styles.classNames(styles$15.Item, fill && styles$15['Item-fill']);
2387 return React.createElement(
2388 'div',
2389 { className: className },
2390 children
2391 );
2392}
2393
2394class Stack$1 extends React.PureComponent {
2395 render() {
2396 var _props = this.props;
2397 const children = _props.children,
2398 vertical = _props.vertical,
2399 spacing = _props.spacing,
2400 distribution = _props.distribution,
2401 alignment = _props.alignment,
2402 wrap = _props.wrap;
2403
2404 const className = styles.classNames(styles$15.Stack, vertical && styles$15.vertical, spacing && styles$15[styles.variationName('spacing', spacing)], distribution && styles$15[styles.variationName('distribution', distribution)], alignment && styles$15[styles.variationName('alignment', alignment)], wrap === false && styles$15.noWrap);
2405 const itemMarkup = reactUtilities.elementChildren(children).map((child, index) => {
2406 const props = { key: index };
2407 return reactUtilities.wrapWithComponent(child, Item$5, props);
2408 });
2409 return React.createElement(
2410 'div',
2411 { className: className },
2412 itemMarkup
2413 );
2414 }
2415}
2416Stack$1.Item = Item$5;
2417
2418var styles$16 = {
2419 "Card": "p_z4",
2420 "subdued": "p_b5",
2421 "emphasis": "p_ai",
2422 "Header": "p_k2",
2423 "Section": "p_an",
2424 "Section-fullWidth": "p_sc",
2425 "Section-subdued": "p_t7",
2426 "SectionHeader": "p_kp",
2427 "Footer": "p_yl",
2428};
2429
2430function Header$1({ children, title, actions }) {
2431 const actionMarkup = actions ? React.createElement(
2432 ButtonGroup$1,
2433 null,
2434 buttonsFrom(actions, { plain: true })
2435 ) : null;
2436 const titleMarkup = React.isValidElement(title) ? title : React.createElement(
2437 Heading$1,
2438 null,
2439 title
2440 );
2441 const headingMarkup = actionMarkup || children ? React.createElement(
2442 Stack$1,
2443 { alignment: 'baseline' },
2444 React.createElement(
2445 Stack$1.Item,
2446 { fill: true },
2447 titleMarkup
2448 ),
2449 actionMarkup,
2450 children
2451 ) : titleMarkup;
2452 return React.createElement(
2453 'div',
2454 { className: styles$16.Header },
2455 headingMarkup
2456 );
2457}
2458
2459var styles$17 = {
2460 "Subheading": "p_u6",
2461};
2462
2463function Subheading$1({ element: Element = 'h3', children }) {
2464 const ariaLabel = typeof children === 'string' ? children : undefined;
2465 return React.createElement(
2466 Element,
2467 { 'aria-label': ariaLabel, className: styles$17.Subheading },
2468 children
2469 );
2470}
2471
2472function Section$3({ children, title, subdued, fullWidth, actions }) {
2473 const actionMarkup = actions ? React.createElement(
2474 ButtonGroup$1,
2475 null,
2476 buttonsFrom(actions, { plain: true })
2477 ) : null;
2478 const headerContent = title ? React.createElement(
2479 'div',
2480 { className: styles$16.SectionHeader },
2481 React.createElement(
2482 Stack$1,
2483 { alignment: 'baseline' },
2484 React.createElement(
2485 Stack$1.Item,
2486 { fill: true },
2487 React.createElement(
2488 Subheading$1,
2489 null,
2490 title
2491 )
2492 ),
2493 actionMarkup
2494 )
2495 ) : null;
2496 const className = styles.classNames(styles$16.Section, subdued && styles$16['Section-subdued'], fullWidth && styles$16['Section-fullWidth']);
2497 return React.createElement(
2498 'div',
2499 { className: className },
2500 headerContent,
2501 children
2502 );
2503}
2504
2505var propflowStyles = {
2506 "Card": "p_sw",
2507 "subdued": "p_pj",
2508 "Header": "p_p2",
2509 "Section": "p_r2",
2510 "Section-fullWidth": "p_il",
2511 "Section-subdued": "p_y9",
2512 "SectionHeader": "p_vp",
2513 "Footer": "p_xy",
2514};
2515
2516class Card$1 extends React.PureComponent {
2517 constructor() {
2518 super(...arguments);
2519 this.styles = this.props.project === 'propflow' ? propflowStyles : styles$16;
2520 }
2521 getChildContext() {
2522 return {
2523 withinContentContainer: true
2524 };
2525 }
2526 render() {
2527 var _props = this.props;
2528 const children = _props.children,
2529 title = _props.title,
2530 subdued = _props.subdued,
2531 emphasis = _props.emphasis,
2532 sectioned = _props.sectioned,
2533 actions = _props.actions,
2534 primaryFooterAction = _props.primaryFooterAction,
2535 secondaryFooterAction = _props.secondaryFooterAction;
2536
2537 const className = styles.classNames(this.styles.Card, emphasis && this.styles.emphasis, subdued && this.styles.subdued);
2538 const headerMarkup = title ? React.createElement(Header$1, { actions: actions, title: title }) : null;
2539 const content = sectioned ? React.createElement(
2540 Section$3,
2541 null,
2542 children
2543 ) : children;
2544 const primaryFooterActionMarkup = primaryFooterAction ? buttonFrom(primaryFooterAction, { primary: true }) : null;
2545 const secondaryFooterActionMarkup = secondaryFooterAction ? buttonFrom(secondaryFooterAction) : null;
2546 const footerMarkup = primaryFooterActionMarkup || secondaryFooterActionMarkup ? React.createElement(
2547 'div',
2548 { className: this.styles.Footer },
2549 React.createElement(
2550 ButtonGroup$1,
2551 null,
2552 primaryFooterActionMarkup,
2553 secondaryFooterActionMarkup
2554 )
2555 ) : null;
2556 return React.createElement(
2557 'div',
2558 { className: className },
2559 headerMarkup,
2560 content,
2561 footerMarkup
2562 );
2563 }
2564}
2565Card$1.Section = Section$3;
2566Card$1.Header = Header$1;
2567Card$1.childContextTypes = contentContextTypes;
2568
2569var styles$18 = {
2570 "TextContainer": "p_zd",
2571 "spacingTight": "p_tm",
2572 "spacingLoose": "p_h9",
2573 "alignmentLeft": "p_hq",
2574 "alignmentCenter": "p_y7",
2575 "alignmentRight": "p_qa",
2576};
2577
2578function TextContainer$1({ spacing, alignment, children }) {
2579 const className = styles.classNames(styles$18.TextContainer, spacing && styles$18[styles.variationName('spacing', spacing)], alignment && styles$18[styles.variationName('alignment', alignment)]);
2580 return React.createElement(
2581 'div',
2582 { className: className },
2583 children
2584 );
2585}
2586
2587var styles$19 = {
2588 "CalloutCard": "p_bk",
2589 "Image": "p_vu",
2590 "Content": "p_ae",
2591 "Title": "p_mm",
2592 "Buttons": "p_mv",
2593};
2594
2595function CalloutCard$1({ title, children, illustration, primaryAction, secondaryAction }) {
2596 const primaryActionMarkup = buttonFrom(primaryAction);
2597 const secondaryActionMarkup = secondaryAction ? buttonFrom(secondaryAction, { plain: true }) : null;
2598 const buttonMarkup = secondaryActionMarkup ? React.createElement(
2599 ButtonGroup$1,
2600 null,
2601 primaryActionMarkup,
2602 secondaryActionMarkup
2603 ) : primaryActionMarkup;
2604 return React.createElement(
2605 Card$1,
2606 { sectioned: true },
2607 React.createElement(
2608 'div',
2609 { className: styles$19.CalloutCard },
2610 React.createElement(
2611 'div',
2612 { className: styles$19.Content },
2613 React.createElement(
2614 'div',
2615 { className: styles$19.Title },
2616 React.createElement(
2617 Heading$1,
2618 null,
2619 title
2620 )
2621 ),
2622 React.createElement(
2623 TextContainer$1,
2624 null,
2625 children
2626 ),
2627 React.createElement(
2628 'div',
2629 { className: styles$19.Buttons },
2630 buttonMarkup
2631 )
2632 ),
2633 React.createElement(Image$1, { alt: '', className: styles$19.Image, source: illustration })
2634 )
2635 );
2636}
2637
2638var styles$20 = {
2639 "Caption": "p_dw",
2640};
2641
2642function Caption$1({ children }) {
2643 return React.createElement(
2644 'p',
2645 { className: styles$20.Caption },
2646 children
2647 );
2648}
2649
2650var styles$21 = {
2651 "InlineError": "p_dg",
2652 "Icon": "p_xs",
2653};
2654
2655function InlineError$1({ message, fieldID }) {
2656 if (!message) {
2657 return null;
2658 }
2659 return React.createElement(
2660 'div',
2661 { id: `${fieldID}Error`, className: styles$21.InlineError },
2662 React.createElement(
2663 'div',
2664 { className: styles$21.Icon },
2665 React.createElement(Icon$2, { source: 'alert' })
2666 ),
2667 message
2668 );
2669}
2670
2671var styles$22 = {
2672 "Choice": "p_a4",
2673 "labelHidden": "p_mi",
2674 "Label": "p_qu",
2675 "Control": "p_y2",
2676 "disabled": "p_cn",
2677 "Descriptions": "p_kx",
2678 "HelpText": "p_v5",
2679};
2680
2681function Choice$1({ id, label, disabled, error, children, labelHidden, helpText }) {
2682 const className = styles.classNames(styles$22.Choice, labelHidden && styles$22.labelHidden, disabled && styles$22.disabled);
2683 const labelMarkup = React.createElement(
2684 'label',
2685 { className: className, htmlFor: id },
2686 React.createElement(
2687 'span',
2688 { className: styles$22.Control },
2689 children
2690 ),
2691 React.createElement(
2692 'span',
2693 { className: styles$22.Label },
2694 label
2695 )
2696 );
2697 const helpTextMarkup = helpText ? React.createElement(
2698 'div',
2699 { className: styles$22.HelpText, id: helpTextID(id) },
2700 helpText
2701 ) : null;
2702 const errorMarkup = error && typeof error !== 'boolean' && React.createElement(
2703 'div',
2704 { className: styles$22.Error },
2705 React.createElement(InlineError$1, { message: error, fieldID: id })
2706 );
2707 const descriptionMarkup = helpTextMarkup || errorMarkup ? React.createElement(
2708 'div',
2709 { className: styles$22.Descriptions },
2710 errorMarkup,
2711 helpTextMarkup
2712 ) : null;
2713 return descriptionMarkup ? React.createElement(
2714 'div',
2715 null,
2716 labelMarkup,
2717 descriptionMarkup
2718 ) : labelMarkup;
2719}
2720function helpTextID(id) {
2721 return `${id}HelpText`;
2722}
2723
2724var styles$23 = {
2725 "Checkbox": "p_zy",
2726 "error": "p_ix",
2727 "Backdrop": "p_tp",
2728 "Icon": "p_pr",
2729 "Input": "p_d7",
2730 "Input-indeterminate": "p_ol",
2731 "disabled": "p_wk",
2732};
2733
2734const getUniqueID = other.createUniqueIDFactory('Checkbox');
2735function Checkbox$1({ id = getUniqueID(), label, labelHidden, helpText, checked = false, error, disabled, onChange, onFocus, onBlur, name, value }) {
2736 function handleChange(event) {
2737 if (onChange == null) {
2738 return;
2739 }
2740 const currentTarget = event.currentTarget;
2741
2742 onChange(currentTarget.checked, id);
2743 }
2744 const describedBy = [];
2745 if (error) {
2746 describedBy.push(`${id}Error`);
2747 }
2748 if (helpText) {
2749 describedBy.push(helpTextID(id));
2750 }
2751 const ariaDescribedBy = describedBy.length ? describedBy.join(' ') : undefined;
2752 const wrapperClassName = styles.classNames(styles$23.Checkbox, error && styles$23.error);
2753 const isIndeterminate = checked === 'indeterminate';
2754 const isChecked = !isIndeterminate && Boolean(checked);
2755 const indeterminateAttributes = isIndeterminate ? { indeterminate: 'true', 'aria-checked': 'mixed' } : { 'aria-checked': isChecked };
2756 const iconSource = isIndeterminate ? 'subtract' : 'checkmark';
2757 const inputClassName = styles.classNames(styles$23.Input, isIndeterminate && styles$23['Input-indeterminate']);
2758 return (
2759 /* eslint-disable jsx-a11y/no-redundant-roles, jsx-a11y/role-has-required-aria-props */
2760 React.createElement(
2761 Choice$1,
2762 { id: id, label: label, labelHidden: labelHidden, helpText: helpText, error: error, disabled: disabled },
2763 React.createElement(
2764 'span',
2765 { className: wrapperClassName },
2766 React.createElement('input', Object.assign({ id: id, name: name, value: value, type: 'checkbox', checked: isChecked, disabled: disabled, className: inputClassName, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, 'aria-invalid': error != null, 'aria-describedby': ariaDescribedBy, role: 'checkbox' }, indeterminateAttributes)),
2767 React.createElement('span', { className: styles$23.Backdrop }),
2768 React.createElement(
2769 'span',
2770 { className: styles$23.Icon },
2771 React.createElement(Icon$2, { source: iconSource })
2772 )
2773 )
2774 )
2775 /* eslint-disable jsx-a11y/no-redundant-roles, jsx-a11y/role-has-required-aria-props */
2776
2777 );
2778}
2779var Checkbox$2 = withAppProvider()(Checkbox$1);
2780
2781var styles$24 = {
2782 "RadioButton": "p_wi",
2783 "Input": "p_pl",
2784 "Backdrop": "p_yj",
2785 "Icon": "p_ly",
2786};
2787
2788const getUniqueID$2 = other.createUniqueIDFactory('RadioButton');
2789function RadioButton$1({ label, labelHidden, helpText, checked, disabled, onChange, onFocus, onBlur, id = getUniqueID$2(), name = id, value }) {
2790 function handleChange({ currentTarget }) {
2791 if (onChange == null) {
2792 return;
2793 }
2794 onChange(currentTarget.checked, id);
2795 }
2796 const describedBy = helpText ? helpTextID(id) : undefined;
2797 return React.createElement(
2798 Choice$1,
2799 { label: label, labelHidden: labelHidden, disabled: disabled, id: id, helpText: helpText },
2800 React.createElement(
2801 'span',
2802 { className: styles$24.RadioButton },
2803 React.createElement('input', { id: id, name: name, value: value, type: 'radio', checked: checked, disabled: disabled, className: styles$24.Input, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, 'aria-describedby': describedBy }),
2804 React.createElement('span', { className: styles$24.Backdrop }),
2805 React.createElement('span', { className: styles$24.Icon })
2806 )
2807 );
2808}
2809
2810var styles$25 = {
2811 "ChoiceList": "p_mr",
2812 "titleHidden": "p_zs",
2813 "Title": "p_b4",
2814 "Choices": "p_ib",
2815 "ChoiceChildren": "p_rr",
2816 "ChoiceError": "p_ch",
2817};
2818
2819const getUniqueID$1 = other.createUniqueIDFactory('ChoiceList');
2820function ChoiceList$1({ title, titleHidden, allowMultiple, choices, selected, onChange = other.noop, error, name = getUniqueID$1() }) {
2821 const ControlComponent = allowMultiple ? Checkbox$2 : RadioButton$1;
2822 const finalName = allowMultiple ? `${name}[]` : name;
2823 const className = styles.classNames(styles$25.ChoiceList, titleHidden && styles$25.titleHidden);
2824 const titleMarkup = title ? React.createElement(
2825 'legend',
2826 { className: styles$25.Title },
2827 title
2828 ) : null;
2829 const choicesMarkup = choices.map(choice => {
2830 const value = choice.value,
2831 label = choice.label,
2832 helpText = choice.helpText,
2833 disabled = choice.disabled;
2834
2835 function handleChange(checked) {
2836 onChange(updateSelectedChoices(choice, checked, selected, allowMultiple), name);
2837 }
2838 const isSelected = choiceIsSelected(choice, selected);
2839 const children = choice.renderChildren ? React.createElement(
2840 'div',
2841 { className: styles$25.ChoiceChildren },
2842 choice.renderChildren(isSelected)
2843 ) : null;
2844 return React.createElement(
2845 'li',
2846 { key: value },
2847 React.createElement(ControlComponent, { name: finalName, value: value, label: label, disabled: disabled, checked: choiceIsSelected(choice, selected), helpText: helpText, onChange: handleChange }),
2848 children
2849 );
2850 });
2851 const errorMarkup = error && React.createElement(
2852 'div',
2853 { className: styles$25.ChoiceError },
2854 React.createElement(InlineError$1, { message: error, fieldID: finalName })
2855 );
2856 return React.createElement(
2857 'fieldset',
2858 { className: className, id: finalName, 'aria-invalid': error != null, 'aria-describedby': `${finalName}Error` },
2859 titleMarkup,
2860 React.createElement(
2861 'ul',
2862 { className: styles$25.Choices },
2863 choicesMarkup
2864 ),
2865 errorMarkup
2866 );
2867}
2868function choiceIsSelected({ value }, selected) {
2869 return selected.indexOf(value) >= 0;
2870}
2871function updateSelectedChoices({ value }, checked, selected, allowMultiple = false) {
2872 if (checked) {
2873 return allowMultiple ? [...selected, value] : [value];
2874 }
2875 return selected.filter(selectedChoice => selectedChoice !== value);
2876}
2877var ChoiceList$2 = withAppProvider()(ChoiceList$1);
2878
2879var styles$26 = {
2880 "Collapsible": "p_by",
2881 "animating": "p_cz",
2882 "open": "p_h4",
2883};
2884
2885const CONTEXT_TYPES = {
2886 parentCollapsibleExpanding: PropTypes.bool
2887};
2888class Collapsible$1 extends React.Component {
2889 constructor() {
2890 super(...arguments);
2891 this.state = {
2892 height: null,
2893 animationState: 'idle'
2894 };
2895 this.node = null;
2896 this.heightNode = null;
2897 }
2898 getChildContext() {
2899 const open = this.props.open;
2900 const animationState = this.state.animationState;
2901 const parentCollapsibleExpanding = this.context.parentCollapsibleExpanding;
2902
2903 return {
2904 parentCollapsibleExpanding: parentCollapsibleExpanding || open && animationState !== 'idle'
2905 };
2906 }
2907 // eslint-disable-next-line react/no-deprecated
2908 componentWillReceiveProps({ open: willOpen }) {
2909 const open = this.props.open;
2910
2911 if (open !== willOpen) {
2912 this.setState({ animationState: 'measuring' });
2913 }
2914 }
2915 componentDidUpdate({ open: wasOpen }) {
2916 const animationState = this.state.animationState;
2917 const parentCollapsibleExpanding = this.context.parentCollapsibleExpanding;
2918
2919 if (parentCollapsibleExpanding && animationState !== 'idle') {
2920 // eslint-disable-next-line react/no-did-update-set-state
2921 this.setState({
2922 animationState: 'idle'
2923 });
2924 return;
2925 }
2926 fastdom.read(() => {
2927 switch (animationState) {
2928 case 'idle':
2929 break;
2930 case 'measuring':
2931 this.setState({
2932 animationState: wasOpen ? 'closingStart' : 'openingStart',
2933 height: wasOpen && this.heightNode ? this.heightNode.scrollHeight : 0
2934 });
2935 break;
2936 case 'closingStart':
2937 this.setState({
2938 animationState: 'closing',
2939 height: 0
2940 });
2941 break;
2942 case 'openingStart':
2943 this.setState({
2944 animationState: 'opening',
2945 height: this.heightNode ? this.heightNode.scrollHeight : 0
2946 });
2947 }
2948 });
2949 }
2950 componentDidMount() {
2951 if (this.node == null) {
2952 return;
2953 }
2954 events.addEventListener(this.node, 'transitionend', this.handleTransitionEnd);
2955 }
2956 componentWillUnmount() {
2957 if (this.node == null) {
2958 return;
2959 }
2960 events.removeEventListener(this.node, 'transitionend', this.handleTransitionEnd);
2961 }
2962 render() {
2963 var _props = this.props;
2964 const id = _props.id,
2965 open = _props.open,
2966 children = _props.children;
2967 var _state = this.state;
2968 const animationState = _state.animationState,
2969 height = _state.height;
2970
2971 const animating = animationState !== 'idle';
2972 const wrapperClassName = styles.classNames(styles$26.Collapsible, open && styles$26.open, animating && styles$26.animating);
2973 const displayHeight = collapsibleHeight(open, animationState, height);
2974 const content = animating || open ? children : null;
2975 return React.createElement(
2976 'div',
2977 { id: id, 'aria-hidden': !open, style: { height: displayHeight }, className: wrapperClassName, ref: this.bindNode },
2978 React.createElement(
2979 'div',
2980 { ref: this.bindHeightNode },
2981 content
2982 )
2983 );
2984 }
2985 bindNode(node) {
2986 this.node = node;
2987 }
2988 bindHeightNode(node) {
2989 this.heightNode = node;
2990 }
2991 handleTransitionEnd(event) {
2992 const target$$1 = event.target;
2993
2994 if (target$$1 === this.node) {
2995 this.setState({ animationState: 'idle', height: null });
2996 }
2997 }
2998}
2999Collapsible$1.contextTypes = CONTEXT_TYPES;
3000Collapsible$1.childContextTypes = CONTEXT_TYPES;
3001tslib_1.__decorate([decorators.autobind], Collapsible$1.prototype, "bindNode", null);
3002tslib_1.__decorate([decorators.autobind], Collapsible$1.prototype, "bindHeightNode", null);
3003tslib_1.__decorate([decorators.autobind], Collapsible$1.prototype, "handleTransitionEnd", null);
3004function collapsibleHeight(open, animationState, height) {
3005 if (animationState === 'idle' && open) {
3006 return open ? 'auto' : undefined;
3007 }
3008 if (animationState === 'measuring') {
3009 return open ? undefined : 'auto';
3010 }
3011 return `${height || 0}px`;
3012}
3013var Collapsible$2 = withAppProvider()(Collapsible$1);
3014
3015function rgbString(color) {
3016 const red = color.red,
3017 green = color.green,
3018 blue = color.blue;
3019
3020 if (color.hasOwnProperty('alpha')) {
3021 return `rgba(${red}, ${green}, ${blue}, ${color.alpha})`;
3022 } else {
3023 return `rgb(${red}, ${green}, ${blue})`;
3024 }
3025}
3026const rgbaString = rgbString;
3027function rgbToHex({ red, green, blue }) {
3028 return `#${componentToHex(red)}${componentToHex(green)}${componentToHex(blue)}`;
3029}
3030function componentToHex(component) {
3031 const hex = component.toString(16);
3032 return hex.length === 1 ? `0${hex}` : hex;
3033}
3034function hsbToHex(color) {
3035 return rgbToHex(hsbToRgb(color));
3036}
3037function hsbToRgb(color) {
3038 const hue = color.hue,
3039 saturation = color.saturation,
3040 brightness = color.brightness;
3041 var _color$alpha = color.alpha;
3042 const alpha = _color$alpha === undefined ? 1 : _color$alpha;
3043
3044 const chroma = brightness * saturation;
3045 const huePrime = hue / 60;
3046 const hueDelta = 1 - Math.abs(huePrime % 2 - 1);
3047 const intermediateValue = chroma * hueDelta;
3048 let red = 0;
3049 let green = 0;
3050 let blue = 0;
3051 if (huePrime >= 0 && huePrime <= 1) {
3052 red = chroma;
3053 green = intermediateValue;
3054 blue = 0;
3055 }
3056 if (huePrime >= 1 && huePrime <= 2) {
3057 red = intermediateValue;
3058 green = chroma;
3059 blue = 0;
3060 }
3061 if (huePrime >= 2 && huePrime <= 3) {
3062 red = 0;
3063 green = chroma;
3064 blue = intermediateValue;
3065 }
3066 if (huePrime >= 3 && huePrime <= 4) {
3067 red = 0;
3068 green = intermediateValue;
3069 blue = chroma;
3070 }
3071 if (huePrime >= 4 && huePrime <= 5) {
3072 red = intermediateValue;
3073 green = 0;
3074 blue = chroma;
3075 }
3076 if (huePrime >= 5 && huePrime <= 6) {
3077 red = chroma;
3078 green = 0;
3079 blue = intermediateValue;
3080 }
3081 const chromaBrightnessDelta = brightness - chroma;
3082 red += chromaBrightnessDelta;
3083 green += chromaBrightnessDelta;
3084 blue += chromaBrightnessDelta;
3085 return {
3086 red: Math.round(red * 255),
3087 green: Math.round(green * 255),
3088 blue: Math.round(blue * 255),
3089 alpha
3090 };
3091}
3092function rgbToHsb(color) {
3093 var _color$alpha2 = color.alpha;
3094 const alpha = _color$alpha2 === undefined ? 1 : _color$alpha2;
3095
3096 const red = color.red / 255;
3097 const green = color.green / 255;
3098 const blue = color.blue / 255;
3099 const largestComponent = Math.max(red, green, blue);
3100 const smallestComponent = Math.min(red, green, blue);
3101 const delta = largestComponent - smallestComponent;
3102 const saturation = largestComponent === 0 ? 0 : delta / largestComponent;
3103 let huePercentage = 0;
3104 switch (largestComponent) {
3105 case red:
3106 huePercentage = (green - blue) / delta + (green < blue ? 6 : 0);
3107 break;
3108 case green:
3109 huePercentage = (blue - red) / delta + 2;
3110 break;
3111 case blue:
3112 huePercentage = (red - green) / delta + 4;
3113 }
3114 const hue = Math.round(huePercentage / 6 * 360);
3115 return {
3116 hue: math.clamp(hue, 0, 360) || 0,
3117 saturation: math.clamp(saturation, 0, 1),
3118 brightness: math.clamp(largestComponent, 0, 1),
3119 alpha
3120 };
3121}
3122
3123// see https://github.com/oliviertassinari/react-event-listener/
3124class EventListener$1 extends React.PureComponent {
3125 componentDidMount() {
3126 this.attachListener();
3127 }
3128 // eslint-disable-next-line react/no-deprecated
3129 componentWillUpdate() {
3130 this.detachListener();
3131 }
3132 componentDidUpdate() {
3133 this.attachListener();
3134 }
3135 componentWillUnmount() {
3136 this.detachListener();
3137 }
3138 render() {
3139 return null;
3140 }
3141 attachListener() {
3142 var _props = this.props;
3143 const event = _props.event,
3144 handler = _props.handler,
3145 capture = _props.capture,
3146 passive = _props.passive;
3147
3148 events.addEventListener(window, event, handler, { capture, passive });
3149 }
3150 detachListener() {
3151 var _props2 = this.props;
3152 const event = _props2.event,
3153 handler = _props2.handler,
3154 capture = _props2.capture;
3155
3156 events.removeEventListener(window, event, handler, capture);
3157 }
3158}
3159
3160var styles$27 = {
3161 "ColorPicker": "p_m4",
3162 "MainColor": "p_ma",
3163 "Dragger": "p_rp",
3164 "ColorLayer": "p_x5",
3165 "HuePicker": "p_zw",
3166 "AlphaPicker": "p_bz",
3167 "Slidable": "p_f2",
3168};
3169
3170class Slidable$1 extends React.PureComponent {
3171 constructor() {
3172 super(...arguments);
3173 this.state = {
3174 dragging: false
3175 };
3176 this.node = null;
3177 this.draggerNode = null;
3178 }
3179 componentDidMount() {
3180 const onDraggerHeight = this.props.onDraggerHeight;
3181
3182 if (onDraggerHeight == null) {
3183 return;
3184 }
3185 const draggerNode = this.draggerNode;
3186
3187 if (draggerNode == null) {
3188 return;
3189 }
3190 onDraggerHeight(draggerNode.clientWidth);
3191 if (process.env.NODE_ENV === 'development') {
3192 setTimeout(() => {
3193 onDraggerHeight(draggerNode.clientWidth);
3194 }, 0);
3195 }
3196 }
3197 render() {
3198 const dragging = this.state.dragging;
3199 var _props = this.props,
3200 _props$draggerX = _props.draggerX;
3201 const draggerX = _props$draggerX === undefined ? 0 : _props$draggerX;
3202 var _props$draggerY = _props.draggerY;
3203 const draggerY = _props$draggerY === undefined ? 0 : _props$draggerY;
3204
3205 const draggerPositioning = {
3206 transform: `translate3d(${draggerX}px, ${draggerY}px, 0)`
3207 };
3208 const moveListener = dragging ? React.createElement(EventListener$1, { event: 'mousemove', handler: this.handleMove }) : null;
3209 const touchMoveListener = dragging ? React.createElement(EventListener$1, { event: 'touchmove', handler: this.handleMove }) : null;
3210 const endDragListener = dragging ? React.createElement(EventListener$1, { event: 'mouseup', handler: this.handleDragEnd }) : null;
3211 const touchEndListener = dragging ? React.createElement(EventListener$1, { event: 'touchend', handler: this.handleDragEnd }) : null;
3212 const touchCancelListener = dragging ? React.createElement(EventListener$1, { event: 'touchcancel', handler: this.handleDragEnd }) : null;
3213 return React.createElement(
3214 'div',
3215 { ref: this.setNode, className: styles$27.Slidable, onMouseDown: this.startDrag, onTouchStart: this.startDrag },
3216 endDragListener,
3217 moveListener,
3218 touchMoveListener,
3219 touchEndListener,
3220 touchCancelListener,
3221 React.createElement('div', { style: draggerPositioning, className: styles$27.Dragger, ref: this.setDraggerNode })
3222 );
3223 }
3224 setDraggerNode(node) {
3225 this.draggerNode = node;
3226 }
3227 setNode(node) {
3228 this.node = node;
3229 }
3230 startDrag(event) {
3231 if (event.type === 'mousedown') {
3232 const mouseEvent = event;
3233 this.handleDraggerMove(mouseEvent.clientX, mouseEvent.clientY);
3234 }
3235 this.setState({ dragging: true });
3236 }
3237 handleDragEnd() {
3238 this.setState({ dragging: false });
3239 }
3240 handleMove(event) {
3241 event.stopImmediatePropagation();
3242 event.stopPropagation();
3243 event.preventDefault();
3244 if (event.type === 'mousemove') {
3245 const mouseEvent = event;
3246 this.handleDraggerMove(mouseEvent.clientX, mouseEvent.clientY);
3247 return;
3248 }
3249 const touchEvent = event;
3250 this.handleDraggerMove(touchEvent.touches[0].clientX, touchEvent.touches[0].clientY);
3251 }
3252 handleDraggerMove(x, y) {
3253 if (this.node == null) {
3254 return;
3255 }
3256 const onChange = this.props.onChange;
3257
3258 const rect = this.node.getBoundingClientRect();
3259 const offsetX = x - rect.left;
3260 const offsetY = y - rect.top;
3261 onChange({ x: offsetX, y: offsetY });
3262 }
3263}
3264tslib_1.__decorate([decorators.autobind], Slidable$1.prototype, "setDraggerNode", null);
3265tslib_1.__decorate([decorators.autobind], Slidable$1.prototype, "setNode", null);
3266tslib_1.__decorate([decorators.autobind], Slidable$1.prototype, "startDrag", null);
3267tslib_1.__decorate([decorators.autobind], Slidable$1.prototype, "handleDragEnd", null);
3268tslib_1.__decorate([decorators.autobind], Slidable$1.prototype, "handleMove", null);
3269tslib_1.__decorate([decorators.autobind], Slidable$1.prototype, "handleDraggerMove", null);
3270
3271const VERTICAL_PADDING = 13;
3272class AlphaPicker$1 extends React.PureComponent {
3273 constructor() {
3274 super(...arguments);
3275 this.state = {
3276 sliderHeight: 0,
3277 draggerHeight: 0
3278 };
3279 }
3280 render() {
3281 var _props = this.props;
3282 const color = _props.color,
3283 alpha = _props.alpha;
3284 var _state = this.state;
3285 const sliderHeight = _state.sliderHeight,
3286 draggerHeight = _state.draggerHeight;
3287
3288 const offset = offsetForAlpha(alpha, sliderHeight, draggerHeight);
3289 const draggerY = math.clamp(offset, 0, sliderHeight);
3290 const background = alphaGradientForColor(color);
3291 return React.createElement(
3292 'div',
3293 { className: styles$27.AlphaPicker, ref: this.setSliderHeight },
3294 React.createElement('div', { className: styles$27.ColorLayer, style: { background } }),
3295 React.createElement(Slidable$1, { draggerY: draggerY, draggerX: 0, onChange: this.handleChange, onDraggerHeight: this.setDraggerHeight })
3296 );
3297 }
3298 setSliderHeight(node) {
3299 if (node == null) {
3300 return;
3301 }
3302 this.setState({ sliderHeight: node.clientHeight });
3303 if (process.env.NODE_ENV === 'development') {
3304 setTimeout(() => {
3305 this.setState({ sliderHeight: node.clientHeight });
3306 }, 0);
3307 }
3308 }
3309 setDraggerHeight(height) {
3310 this.setState({
3311 draggerHeight: height
3312 });
3313 }
3314 handleChange({ y }) {
3315 const onChange = this.props.onChange;
3316 const sliderHeight = this.state.sliderHeight;
3317
3318 const offsetY = math.clamp(y, 0, sliderHeight);
3319 const alpha = alphaForOffset(offsetY, sliderHeight);
3320 onChange(alpha);
3321 }
3322}
3323tslib_1.__decorate([decorators.autobind], AlphaPicker$1.prototype, "setSliderHeight", null);
3324tslib_1.__decorate([decorators.autobind], AlphaPicker$1.prototype, "setDraggerHeight", null);
3325tslib_1.__decorate([decorators.autobind], AlphaPicker$1.prototype, "handleChange", null);
3326function alphaForOffset(offset, sliderHeight) {
3327 const selectionHeight = offset - VERTICAL_PADDING;
3328 const slidableArea = sliderHeight - VERTICAL_PADDING * 2;
3329 return math.clamp(1 - selectionHeight / slidableArea, 0, 1);
3330}
3331function offsetForAlpha(alpha, sliderHeight, draggerHeight) {
3332 const slidableArea = sliderHeight - (draggerHeight + VERTICAL_PADDING);
3333 return math.clamp((1 - alpha) * slidableArea + VERTICAL_PADDING, 0, sliderHeight - draggerHeight);
3334}
3335function alphaGradientForColor(color) {
3336 var _hsbToRgb = hsbToRgb(color);
3337
3338 const red = _hsbToRgb.red,
3339 green = _hsbToRgb.green,
3340 blue = _hsbToRgb.blue;
3341
3342 const rgb = `${red}, ${green}, ${blue}`;
3343 return `linear-gradient(to top, rgba(${rgb}, 0) 18px, rgba(${rgb}, 1) calc(100% - 18px))`;
3344}
3345
3346const VERTICAL_PADDING$1 = 13;
3347class HuePicker$1 extends React.PureComponent {
3348 constructor() {
3349 super(...arguments);
3350 this.state = {
3351 sliderHeight: 0,
3352 draggerHeight: 0
3353 };
3354 }
3355 render() {
3356 const hue = this.props.hue;
3357 var _state = this.state;
3358 const sliderHeight = _state.sliderHeight,
3359 draggerHeight = _state.draggerHeight;
3360
3361 const offset = offsetForHue(hue, sliderHeight, draggerHeight);
3362 const draggerY = math.clamp(offset, 0, sliderHeight);
3363 return React.createElement(
3364 'div',
3365 { className: styles$27.HuePicker, ref: this.setSliderHeight },
3366 React.createElement(Slidable$1, { draggerY: draggerY, draggerX: 0, onChange: this.handleChange, onDraggerHeight: this.setDraggerHeight })
3367 );
3368 }
3369 setSliderHeight(node) {
3370 if (node == null) {
3371 return;
3372 }
3373 this.setState({ sliderHeight: node.clientHeight });
3374 if (process.env.NODE_ENV === 'development') {
3375 setTimeout(() => {
3376 this.setState({ sliderHeight: node.clientHeight });
3377 }, 0);
3378 }
3379 }
3380 setDraggerHeight(height) {
3381 this.setState({
3382 draggerHeight: height
3383 });
3384 }
3385 handleChange({ y }) {
3386 const onChange = this.props.onChange;
3387 const sliderHeight = this.state.sliderHeight;
3388
3389 const offsetY = math.clamp(y, 0, sliderHeight);
3390 const hue = hueForOffset(offsetY, sliderHeight);
3391 onChange(hue);
3392 }
3393}
3394tslib_1.__decorate([decorators.autobind], HuePicker$1.prototype, "setSliderHeight", null);
3395tslib_1.__decorate([decorators.autobind], HuePicker$1.prototype, "setDraggerHeight", null);
3396tslib_1.__decorate([decorators.autobind], HuePicker$1.prototype, "handleChange", null);
3397function offsetForHue(hue, sliderHeight, draggerHeight) {
3398 const slidableArea = sliderHeight - (draggerHeight + VERTICAL_PADDING$1);
3399 return math.clamp(hue / 360 * slidableArea + VERTICAL_PADDING$1, 0, sliderHeight - draggerHeight);
3400}
3401function hueForOffset(offset, sliderHeight) {
3402 const selectionHeight = offset - VERTICAL_PADDING$1;
3403 const slidableArea = sliderHeight - VERTICAL_PADDING$1 * 2;
3404 return math.clamp(selectionHeight / slidableArea * 360, 0, 360);
3405}
3406
3407class ColorPicker$1 extends React.PureComponent {
3408 constructor() {
3409 super(...arguments);
3410 this.state = {
3411 pickerSize: 0
3412 };
3413 this.colorNode = null;
3414 }
3415 componentDidMount() {
3416 const colorNode = this.colorNode;
3417
3418 if (colorNode == null) {
3419 return;
3420 }
3421 // eslint-disable-next-line react/no-did-mount-set-state
3422 this.setState({ pickerSize: colorNode.clientWidth });
3423 if (process.env.NODE_ENV === 'development') {
3424 setTimeout(() => {
3425 this.setState({ pickerSize: colorNode.clientWidth });
3426 }, 0);
3427 }
3428 }
3429 render() {
3430 var _props = this.props;
3431 const id = _props.id,
3432 color = _props.color,
3433 allowAlpha = _props.allowAlpha;
3434 const hue = color.hue,
3435 saturation = color.saturation,
3436 brightness = color.brightness,
3437 providedAlpha = color.alpha;
3438 const pickerSize = this.state.pickerSize;
3439
3440 const alpha = providedAlpha != null && allowAlpha ? providedAlpha : 1;
3441
3442 var _hsbToRgb = hsbToRgb({ hue, saturation: 1, brightness: 1 });
3443
3444 const red = _hsbToRgb.red,
3445 green = _hsbToRgb.green,
3446 blue = _hsbToRgb.blue;
3447
3448 const colorString = `rgba(${red}, ${green}, ${blue}, ${alpha})`;
3449 const draggerX = math.clamp(saturation * pickerSize, 0, pickerSize);
3450 const draggerY = math.clamp(pickerSize - brightness * pickerSize, 0, pickerSize);
3451 const alphaSliderMarkup = allowAlpha ? React.createElement(AlphaPicker$1, { alpha: alpha, color: color, onChange: this.handleAlphaChange }) : null;
3452 return React.createElement(
3453 'div',
3454 { className: styles$27.ColorPicker, id: id },
3455 React.createElement(
3456 'div',
3457 { ref: this.setColorNode, className: styles$27.MainColor },
3458 React.createElement('div', { className: styles$27.ColorLayer, style: { backgroundColor: colorString } }),
3459 React.createElement(Slidable$1, { onChange: this.handleDraggerMove, draggerX: draggerX, draggerY: draggerY })
3460 ),
3461 React.createElement(HuePicker$1, { hue: hue, onChange: this.handleHueChange }),
3462 alphaSliderMarkup
3463 );
3464 }
3465 setColorNode(node) {
3466 this.colorNode = node;
3467 }
3468 handleHueChange(hue) {
3469 var _props2 = this.props,
3470 _props2$color = _props2.color;
3471 const brightness = _props2$color.brightness,
3472 saturation = _props2$color.saturation;
3473 var _props2$color$alpha = _props2$color.alpha;
3474 const alpha = _props2$color$alpha === undefined ? 1 : _props2$color$alpha,
3475 onChange = _props2.onChange;
3476
3477 onChange({ hue, brightness, saturation, alpha });
3478 }
3479 handleAlphaChange(alpha) {
3480 var _props3 = this.props,
3481 _props3$color = _props3.color;
3482 const hue = _props3$color.hue,
3483 brightness = _props3$color.brightness,
3484 saturation = _props3$color.saturation,
3485 onChange = _props3.onChange;
3486
3487 onChange({ hue, brightness, saturation, alpha });
3488 }
3489 handleDraggerMove({ x, y }) {
3490 const pickerSize = this.state.pickerSize;
3491 var _props4 = this.props,
3492 _props4$color = _props4.color;
3493 const hue = _props4$color.hue;
3494 var _props4$color$alpha = _props4$color.alpha;
3495 const alpha = _props4$color$alpha === undefined ? 1 : _props4$color$alpha,
3496 onChange = _props4.onChange;
3497
3498 const saturation = math.clamp(x / pickerSize, 0, 1);
3499 const brightness = math.clamp(1 - y / pickerSize, 0, 1);
3500 onChange({ hue, saturation, brightness, alpha });
3501 }
3502}
3503tslib_1.__decorate([decorators.autobind], ColorPicker$1.prototype, "setColorNode", null);
3504tslib_1.__decorate([decorators.autobind], ColorPicker$1.prototype, "handleHueChange", null);
3505tslib_1.__decorate([decorators.autobind], ColorPicker$1.prototype, "handleAlphaChange", null);
3506tslib_1.__decorate([decorators.autobind], ColorPicker$1.prototype, "handleDraggerMove", null);
3507
3508var styles$28 = {
3509 "Connected": "p_g3",
3510 "Item": "p_li",
3511 "Item-primary": "p_zc",
3512 "Item-connection": "p_yn",
3513 "Item-focused": "p_e7",
3514};
3515
3516var ItemPosition;
3517(function (ItemPosition) {
3518 ItemPosition[ItemPosition["Left"] = 0] = "Left";
3519 ItemPosition[ItemPosition["Primary"] = 1] = "Primary";
3520 ItemPosition[ItemPosition["Right"] = 2] = "Right";
3521})(ItemPosition || (ItemPosition = {}));
3522class Item$7 extends React.PureComponent {
3523 constructor() {
3524 super(...arguments);
3525 this.state = { focused: false };
3526 }
3527 render() {
3528 const focused = this.state.focused;
3529 var _props = this.props;
3530 const children = _props.children,
3531 position = _props.position;
3532
3533 const className = styles.classNames(styles$28.Item, focused && styles$28['Item-focused'], position === ItemPosition.Primary ? styles$28['Item-primary'] : styles$28['Item-connection']);
3534 return React.createElement(
3535 'div',
3536 { onBlur: this.handleBlur, onFocus: this.handleFocus, className: className },
3537 children
3538 );
3539 }
3540 handleBlur() {
3541 this.setState({ focused: false });
3542 }
3543 handleFocus() {
3544 this.setState({ focused: true });
3545 }
3546}
3547tslib_1.__decorate([decorators.autobind], Item$7.prototype, "handleBlur", null);
3548tslib_1.__decorate([decorators.autobind], Item$7.prototype, "handleFocus", null);
3549
3550function Connected$1({ children, left, right }) {
3551 if (left == null && right == null) {
3552 return React.Children.only(children);
3553 }
3554 const leftConnectionMarkup = left ? React.createElement(
3555 Item$7,
3556 { position: ItemPosition.Left },
3557 left
3558 ) : null;
3559 const rightConnectionMarkup = right ? React.createElement(
3560 Item$7,
3561 { position: ItemPosition.Right },
3562 right
3563 ) : null;
3564 return React.createElement(
3565 'div',
3566 { className: styles$28.Connected },
3567 leftConnectionMarkup,
3568 React.createElement(
3569 Item$7,
3570 { position: ItemPosition.Primary },
3571 children
3572 ),
3573 rightConnectionMarkup
3574 );
3575}
3576
3577var styles$29 = {
3578 "DataField": "p_fd",
3579 "Icon": "p_fc",
3580 "SecondaryData": "p_qv",
3581 "Content": "p_fy",
3582};
3583
3584var styles$30 = {
3585 "Label": "p_jk",
3586 "hidden": "p_co",
3587 "Text": "p_vd",
3588 "Optional": "p_yv",
3589};
3590
3591function labelID(id) {
3592 return `${id}Label`;
3593}
3594function Label$1({ children, id, hidden, optional }) {
3595 const className = styles.classNames(styles$30.Label, hidden && styles$30.hidden);
3596 const optionalMarkup = optional ? React.createElement(
3597 'span',
3598 { className: styles$30.Optional },
3599 '(Optional)'
3600 ) : null;
3601 return React.createElement(
3602 'div',
3603 { className: className },
3604 React.createElement(
3605 'label',
3606 { id: labelID(id), htmlFor: id, className: styles$30.Text },
3607 children,
3608 ' ',
3609 optionalMarkup
3610 )
3611 );
3612}
3613
3614function DataField$1({ children, data, secondaryData, label, icon, iconColor }) {
3615 const labelMarkup = label ? React.createElement(
3616 Label$1,
3617 { id: 'Data Field Label' },
3618 label
3619 ) : null;
3620 const iconMarkup = icon ? React.createElement(
3621 'div',
3622 { className: styles$29.Icon },
3623 React.createElement(Icon$2, { source: icon, color: iconColor ? iconColor : "inkLighter" })
3624 ) : null;
3625 const secondaryDataMarkup = secondaryData ? React.createElement(
3626 'span',
3627 { className: styles$29.SecondaryData },
3628 ' \xB7 ',
3629 secondaryData
3630 ) : null;
3631 const contentMarkup = children ? React.createElement(
3632 'div',
3633 null,
3634 children
3635 ) : null;
3636 const emptyMarkup = !children && !data ? React.createElement(
3637 'span',
3638 { className: styles$29.SecondaryData },
3639 '--'
3640 ) : null;
3641 return React.createElement(
3642 'div',
3643 { className: styles$29.DataField },
3644 iconMarkup,
3645 React.createElement(
3646 'div',
3647 { className: styles$29.Content },
3648 labelMarkup,
3649 React.createElement(
3650 'div',
3651 { className: styles$29.Data },
3652 data,
3653 secondaryDataMarkup
3654 ),
3655 contentMarkup,
3656 emptyMarkup
3657 )
3658 );
3659}
3660
3661var styles$31 = {
3662 "DataTable": "p_m0",
3663 "hasFooter": "p_ht",
3664 "ScrollContainer": "p_ik",
3665 "Navigation": "p_e8",
3666 "Navigation-left": "p_ki",
3667 "Navigation-right": "p_re",
3668 "Navigation-button": "p_yy",
3669 "Navigation-chevron": "p_ic",
3670 "Pip": "p_u3",
3671 "Pip-visible": "p_fs",
3672 "Table": "p_yi",
3673 "TableFoot": "p_fi",
3674 "Cell": "p_hz",
3675 "Cell-numeric": "p_wy",
3676 "Cell-fixed": "p_dn",
3677 "Cell-truncated": "p_nx",
3678 "Cell-header": "p_p1",
3679 "Cell-sortable": "p_du",
3680 "Heading": "p_t2",
3681 "Icon": "p_fq",
3682 "Heading-left": "p_h7",
3683 "Cell-sorted": "p_j6",
3684 "Cell-total": "p_br",
3685 "Cell-footer": "p_c2",
3686 "collapsed": "p_ao",
3687};
3688
3689function Cell$1({ height, content, contentType, fixed, truncate, header, total, footer, sorted, sortable, sortDirection, defaultSortDirection, polaris: { intl: { translate } }, onSort }) {
3690 const numeric = contentType === 'numeric';
3691 const className = styles.classNames(styles$31.Cell, fixed && styles$31['Cell-fixed'], fixed && truncate && styles$31['Cell-truncated'], header && styles$31['Cell-header'], total && styles$31['Cell-total'], footer && styles$31['Cell-footer'], numeric && styles$31['Cell-numeric'], sortable && styles$31['Cell-sortable'], sorted && styles$31['Cell-sorted']);
3692 const headerClassName = styles.classNames(header && styles$31.Heading, header && contentType === 'text' && styles$31['Heading-left']);
3693 const iconClassName = styles.classNames(sortable && styles$31.Icon);
3694 const style = {
3695 height: height ? `${height}px` : undefined
3696 };
3697 const direction = sorted ? sortDirection : defaultSortDirection;
3698 const source = `caret${direction === 'ascending' ? 'Up' : 'Down'}`;
3699 const oppositeDirection = sortDirection === 'ascending' ? 'descending' : 'ascending';
3700 const sortAccessibilityLabel = translate('Polaris.DataTable.sortAccessibilityLabel', { direction: sorted ? oppositeDirection : direction });
3701 const iconMarkup = React.createElement(
3702 'span',
3703 { className: iconClassName },
3704 React.createElement(Icon$2, { source: source, accessibilityLabel: sortAccessibilityLabel })
3705 );
3706 const sortableHeadingContent = React.createElement(
3707 'button',
3708 { className: headerClassName, onClick: onSort },
3709 iconMarkup,
3710 content
3711 );
3712 const columnHeadingContent = sortable ? sortableHeadingContent : content;
3713 const headingMarkup = header ? React.createElement(
3714 'th',
3715 { className: className, scope: 'col', 'aria-sort': sortDirection, style: style },
3716 columnHeadingContent
3717 ) : React.createElement(
3718 'th',
3719 { className: className, scope: 'row', style: style },
3720 content
3721 );
3722 const cellMarkup = header || fixed ? headingMarkup : React.createElement(
3723 'td',
3724 { className: className, style: style },
3725 content
3726 );
3727 return cellMarkup;
3728}
3729var Cell$2 = withAppProvider()(Cell$1);
3730
3731var chevronLeft$1 = 'data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjAgMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEyIDE2YS45OTcuOTk3IDAgMCAxLS43MDctLjI5M2wtNS01YS45OTkuOTk5IDAgMCAxIDAtMS40MTRsNS01YS45OTkuOTk5IDAgMSAxIDEuNDE0IDEuNDE0TDguNDE0IDEwbDQuMjkzIDQuMjkzQS45OTkuOTk5IDAgMCAxIDEyIDE2IiBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4K';
3732
3733var chevronRight$1 = 'data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjAgMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTggMTZhLjk5OS45OTkgMCAwIDEtLjcwNy0xLjcwN0wxMS41ODYgMTAgNy4yOTMgNS43MDdhLjk5OS45OTkgMCAxIDEgMS40MTQtMS40MTRsNSA1YS45OTkuOTk5IDAgMCAxIDAgMS40MTRsLTUgNUEuOTk3Ljk5NyAwIDAgMSA4IDE2IiBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4K';
3734
3735function Navigation$1({ isScrolledFarthestLeft, isScrolledFarthestRight, navigateTableLeft, navigateTableRight, polaris: { intl: { translate } } }) {
3736 const leftA11yLabel = translate('Polaris.DataTable.navAccessibilityLabel', {
3737 direction: 'left'
3738 });
3739 const rightA11yLabel = translate('Polaris.DataTable.navAccessibilityLabel', {
3740 direction: 'right'
3741 });
3742 const leftButton = isScrolledFarthestLeft ? null : React.createElement(
3743 'div',
3744 { className: styles$31['Navigation-left'] },
3745 React.createElement(
3746 'a',
3747 { 'aria-label': leftA11yLabel, className: styles$31['Navigation-button'], onClick: navigateTableLeft },
3748 React.createElement('img', { src: chevronLeft$1, className: styles$31['Navigation-chevron'] })
3749 )
3750 );
3751 const rightButton = isScrolledFarthestRight ? null : React.createElement(
3752 'div',
3753 { className: styles$31['Navigation-right'] },
3754 React.createElement(
3755 'a',
3756 { 'aria-label': rightA11yLabel, className: styles$31['Navigation-button'], onClick: navigateTableRight },
3757 React.createElement('img', { src: chevronRight$1, className: styles$31['Navigation-chevron'] })
3758 )
3759 );
3760 return React.createElement(
3761 'div',
3762 { className: styles$31.Navigation },
3763 leftButton,
3764 rightButton
3765 );
3766}
3767var Navigation$2 = withAppProvider()(Navigation$1);
3768
3769class DataTable$1 extends React.PureComponent {
3770 constructor(props) {
3771 super(props);
3772 this.state = {
3773 collapsed: false,
3774 columnVisibilityData: [],
3775 heights: [],
3776 preservedScrollPosition: {},
3777 isScrolledFarthestLeft: true,
3778 isScrolledFarthestRight: false
3779 };
3780 this.dataTable = React.createRef();
3781 this.scrollContainer = React.createRef();
3782 this.table = React.createRef();
3783 const translate = props.polaris.intl.translate;
3784
3785 this.totalsRowHeading = translate('Polaris.DataTable.totalsRowHeading');
3786 }
3787 componentDidMount() {
3788 // We need to defer the calculation in development so the styles have time to be injected.
3789 if (process.env.NODE_ENV === 'development') {
3790 setTimeout(() => {
3791 this.handleResize();
3792 }, 10);
3793 } else {
3794 this.handleResize();
3795 }
3796 }
3797 componentDidUpdate(prevProps) {
3798 if (isEqual(prevProps, this.props)) {
3799 return;
3800 }
3801 this.handleResize();
3802 }
3803 render() {
3804 var _props = this.props;
3805 const columnContentTypes = _props.columnContentTypes,
3806 headings = _props.headings,
3807 totals = _props.totals,
3808 rows = _props.rows,
3809 truncate = _props.truncate,
3810 footerContent = _props.footerContent,
3811 sortable = _props.sortable;
3812 var _props$defaultSortDir = _props.defaultSortDirection;
3813 const defaultSortDirection = _props$defaultSortDir === undefined ? 'ascending' : _props$defaultSortDir;
3814 var _props$initialSortCol = _props.initialSortColumnIndex;
3815 const initialSortColumnIndex = _props$initialSortCol === undefined ? 0 : _props$initialSortCol;
3816 var _state = this.state;
3817 const collapsed = _state.collapsed,
3818 heights = _state.heights;
3819 var _state$sortedColumnIn = _state.sortedColumnIndex;
3820 const sortedColumnIndex = _state$sortedColumnIn === undefined ? initialSortColumnIndex : _state$sortedColumnIn;
3821 var _state$sortDirection = _state.sortDirection;
3822 const sortDirection = _state$sortDirection === undefined ? defaultSortDirection : _state$sortDirection,
3823 isScrolledFarthestLeft = _state.isScrolledFarthestLeft,
3824 isScrolledFarthestRight = _state.isScrolledFarthestRight;
3825
3826 const className = styles.classNames(styles$31.DataTable, collapsed && styles$31.collapsed, footerContent && styles$31.hasFooter);
3827 const wrapperClassName = styles.classNames(styles$31.TableWrapper, collapsed && styles$31.collapsed);
3828 const footerClassName = styles.classNames(footerContent && styles$31.TableFoot);
3829 const footerMarkup = footerContent ? React.createElement(
3830 'tfoot',
3831 { className: footerClassName },
3832 React.createElement(
3833 'tr',
3834 null,
3835 this.renderFooter()
3836 )
3837 ) : null;
3838 const totalsMarkup = totals ? React.createElement(
3839 'tr',
3840 null,
3841 totals.map(this.renderTotals)
3842 ) : null;
3843 const headingMarkup = React.createElement(
3844 'tr',
3845 null,
3846 headings.map((heading, headingIndex) => {
3847 let sortableHeadingProps;
3848 const id = `heading-cell-${headingIndex}`;
3849 if (sortable) {
3850 const isSortable = sortable[headingIndex];
3851 const isSorted = sortedColumnIndex === headingIndex;
3852 const direction = isSorted ? sortDirection : 'none';
3853 sortableHeadingProps = {
3854 defaultSortDirection,
3855 sorted: isSorted,
3856 sortable: isSortable,
3857 sortDirection: direction,
3858 onSort: this.defaultOnSort(headingIndex)
3859 };
3860 }
3861 const height = !truncate ? heights[0] : undefined;
3862 return React.createElement(Cell$2, Object.assign({ header: true, key: id, height: height, content: heading, contentType: columnContentTypes[headingIndex], fixed: headingIndex === 0, truncate: truncate }, sortableHeadingProps));
3863 })
3864 );
3865 const bodyMarkup = rows.map(this.defaultRenderRow);
3866 const style = footerContent ? { marginBottom: `${heights[heights.length - 1]}px` } : undefined;
3867 return React.createElement(
3868 'div',
3869 { className: wrapperClassName },
3870 React.createElement(Navigation$2, { isScrolledFarthestLeft: isScrolledFarthestLeft, isScrolledFarthestRight: isScrolledFarthestRight, navigateTableLeft: this.navigateTable('left'), navigateTableRight: this.navigateTable('right') }),
3871 React.createElement(
3872 'div',
3873 { className: className, ref: this.dataTable },
3874 React.createElement(
3875 'div',
3876 { className: styles$31.ScrollContainer, ref: this.scrollContainer, style: style },
3877 React.createElement(EventListener$1, { event: 'resize', handler: this.handleResize }),
3878 React.createElement(EventListener$1, { capture: true, event: 'scroll', handler: this.scrollListener }),
3879 React.createElement(
3880 'table',
3881 { className: styles$31.Table, ref: this.table },
3882 React.createElement(
3883 'thead',
3884 null,
3885 headingMarkup,
3886 totalsMarkup
3887 ),
3888 React.createElement(
3889 'tbody',
3890 null,
3891 bodyMarkup
3892 ),
3893 footerMarkup
3894 )
3895 )
3896 )
3897 );
3898 }
3899 handleResize() {
3900 var _props2 = this.props;
3901 const footerContent = _props2.footerContent,
3902 truncate = _props2.truncate;
3903 const table = this.table.current,
3904 scrollContainer = this.scrollContainer.current;
3905
3906 let collapsed = false;
3907 if (table && scrollContainer) {
3908 collapsed = table.scrollWidth > scrollContainer.clientWidth;
3909 scrollContainer.scrollLeft = 0;
3910 }
3911 this.setState(Object.assign({ collapsed, heights: [] }, this.calculateColumnVisibilityData(collapsed)), () => {
3912 if (footerContent || !truncate) {
3913 this.setHeightsAndScrollPosition();
3914 }
3915 });
3916 }
3917 tallestCellHeights() {
3918 var _props3 = this.props;
3919 const footerContent = _props3.footerContent,
3920 truncate = _props3.truncate;
3921 const table = this.table.current;
3922 let heights = this.state.heights;
3923
3924 if (table) {
3925 const rows = Array.from(table.getElementsByTagName('tr'));
3926 if (!truncate) {
3927 return heights = rows.map(row => {
3928 const fixedCell = row.childNodes[0];
3929 return Math.max(row.clientHeight, fixedCell.clientHeight);
3930 });
3931 }
3932 if (footerContent) {
3933 const footerCellHeight = rows[rows.length - 1].childNodes[0].clientHeight;
3934 heights = [footerCellHeight];
3935 }
3936 }
3937 return heights;
3938 }
3939 resetScrollPosition() {
3940 const scrollContainer = this.scrollContainer.current;
3941
3942 if (scrollContainer) {
3943 var _state$preservedScrol = this.state.preservedScrollPosition;
3944 const left = _state$preservedScrol.left,
3945 top = _state$preservedScrol.top;
3946
3947 if (left) {
3948 scrollContainer.scrollLeft = left;
3949 }
3950 if (top) {
3951 window.scrollTo(0, top);
3952 }
3953 }
3954 }
3955 setHeightsAndScrollPosition() {
3956 this.setState({ heights: this.tallestCellHeights() }, this.resetScrollPosition);
3957 }
3958 calculateColumnVisibilityData(collapsed) {
3959 const table = this.table.current,
3960 scrollContainer = this.scrollContainer.current,
3961 dataTable = this.dataTable.current;
3962
3963 if (collapsed && table && scrollContainer && dataTable) {
3964 const headerCells = table.querySelectorAll('[class*=header]');
3965 const collapsedHeaderCells = Array.from(headerCells).slice(1);
3966 const fixedColumnWidth = headerCells[0].offsetWidth;
3967 const firstVisibleColumnIndex = collapsedHeaderCells.length - 1;
3968 const tableLeftVisibleEdge = scrollContainer.scrollLeft + fixedColumnWidth;
3969 const tableRightVisibleEdge = scrollContainer.scrollLeft + dataTable.offsetWidth;
3970 const tableData = {
3971 fixedColumnWidth,
3972 firstVisibleColumnIndex,
3973 tableLeftVisibleEdge,
3974 tableRightVisibleEdge
3975 };
3976 const columnVisibilityData = collapsedHeaderCells.map(measureColumn(tableData));
3977 const lastColumn = columnVisibilityData[columnVisibilityData.length - 1];
3978 return Object.assign({ fixedColumnWidth,
3979 columnVisibilityData }, getPrevAndCurrentColumns(tableData, columnVisibilityData), { isScrolledFarthestLeft: tableLeftVisibleEdge === fixedColumnWidth, isScrolledFarthestRight: lastColumn.rightEdge <= tableRightVisibleEdge });
3980 }
3981 return {
3982 columnVisibilityData: [],
3983 previousColumn: undefined,
3984 currentColumn: undefined
3985 };
3986 }
3987 scrollListener() {
3988 this.setState(prevState => Object.assign({}, this.calculateColumnVisibilityData(prevState.collapsed)));
3989 }
3990 navigateTable(direction) {
3991 var _state2 = this.state;
3992 const currentColumn = _state2.currentColumn,
3993 previousColumn = _state2.previousColumn,
3994 fixedColumnWidth = _state2.fixedColumnWidth;
3995 const scrollContainer = this.scrollContainer.current;
3996
3997 const handleScroll = () => {
3998 if (!currentColumn || !previousColumn || !fixedColumnWidth) {
3999 return;
4000 }
4001 if (scrollContainer) {
4002 scrollContainer.scrollLeft = direction === 'right' ? currentColumn.rightEdge - fixedColumnWidth : previousColumn.leftEdge - fixedColumnWidth;
4003 requestAnimationFrame(() => {
4004 this.setState(prevState => Object.assign({}, this.calculateColumnVisibilityData(prevState.collapsed)));
4005 });
4006 }
4007 };
4008 return handleScroll;
4009 }
4010 renderTotals(total, index) {
4011 const id = `totals-cell-${index}`;
4012 const heights = this.state.heights;
4013 var _props$truncate = this.props.truncate;
4014 const truncate = _props$truncate === undefined ? false : _props$truncate;
4015
4016 let content;
4017 let contentType;
4018 if (index === 0) {
4019 content = this.totalsRowHeading;
4020 }
4021 if (total !== '' && index > 0) {
4022 contentType = 'numeric';
4023 content = total;
4024 }
4025 return React.createElement(Cell$2, { total: true, fixed: index === 0, key: id, height: heights[1], content: content, contentType: contentType, truncate: truncate });
4026 }
4027 defaultRenderRow(row, index) {
4028 const className = styles.classNames(styles$31.TableRow);
4029 var _props4 = this.props;
4030 const columnContentTypes = _props4.columnContentTypes,
4031 totals = _props4.totals,
4032 footerContent = _props4.footerContent;
4033 var _props4$truncate = _props4.truncate;
4034 const truncate = _props4$truncate === undefined ? false : _props4$truncate;
4035 const heights = this.state.heights;
4036
4037 const bodyCellHeights = totals ? heights.slice(2) : heights.slice(1);
4038 if (footerContent) {
4039 bodyCellHeights.pop();
4040 }
4041 return React.createElement(
4042 'tr',
4043 { key: `row-${index}`, className: className },
4044 row.map((content, cellIndex) => {
4045 const id = `cell-${cellIndex}-row-${index}`;
4046 return React.createElement(Cell$2, { key: id, height: bodyCellHeights[index], content: content, contentType: columnContentTypes[cellIndex], fixed: cellIndex === 0, truncate: truncate });
4047 })
4048 );
4049 }
4050 renderFooter() {
4051 const heights = this.state.heights;
4052
4053 const footerCellHeight = heights[heights.length - 1];
4054 return React.createElement(Cell$2, { footer: true, height: footerCellHeight, content: this.props.footerContent, truncate: this.props.truncate });
4055 }
4056 defaultOnSort(headingIndex) {
4057 var _props5 = this.props;
4058 const onSort = _props5.onSort,
4059 truncate = _props5.truncate;
4060 var _props5$defaultSortDi = _props5.defaultSortDirection;
4061 const defaultSortDirection = _props5$defaultSortDi === undefined ? 'ascending' : _props5$defaultSortDi,
4062 initialSortColumnIndex = _props5.initialSortColumnIndex;
4063 var _state3 = this.state;
4064 const sortDirection = _state3.sortDirection;
4065 var _state3$sortedColumnI = _state3.sortedColumnIndex;
4066 const sortedColumnIndex = _state3$sortedColumnI === undefined ? initialSortColumnIndex : _state3$sortedColumnI;
4067
4068 let newSortDirection = defaultSortDirection;
4069 if (sortedColumnIndex === headingIndex) {
4070 newSortDirection = sortDirection === 'ascending' ? 'descending' : 'ascending';
4071 }
4072 const handleSort = () => {
4073 this.setState({
4074 sortDirection: newSortDirection,
4075 sortedColumnIndex: headingIndex
4076 }, () => {
4077 if (onSort) {
4078 onSort(headingIndex, newSortDirection);
4079 if (!truncate && this.scrollContainer.current) {
4080 const preservedScrollPosition = {
4081 left: this.scrollContainer.current.scrollLeft,
4082 top: window.scrollY
4083 };
4084 this.setState({ preservedScrollPosition });
4085 this.handleResize();
4086 }
4087 }
4088 });
4089 };
4090 return handleSort;
4091 }
4092}
4093tslib_1.__decorate([decorators.autobind, decorators.debounce()], DataTable$1.prototype, "handleResize", null);
4094tslib_1.__decorate([decorators.autobind], DataTable$1.prototype, "tallestCellHeights", null);
4095tslib_1.__decorate([decorators.autobind], DataTable$1.prototype, "resetScrollPosition", null);
4096tslib_1.__decorate([decorators.autobind], DataTable$1.prototype, "setHeightsAndScrollPosition", null);
4097tslib_1.__decorate([decorators.autobind], DataTable$1.prototype, "calculateColumnVisibilityData", null);
4098tslib_1.__decorate([decorators.autobind], DataTable$1.prototype, "scrollListener", null);
4099tslib_1.__decorate([decorators.autobind], DataTable$1.prototype, "navigateTable", null);
4100tslib_1.__decorate([decorators.autobind], DataTable$1.prototype, "renderTotals", null);
4101tslib_1.__decorate([decorators.autobind], DataTable$1.prototype, "defaultRenderRow", null);
4102tslib_1.__decorate([decorators.autobind], DataTable$1.prototype, "renderFooter", null);
4103tslib_1.__decorate([decorators.autobind], DataTable$1.prototype, "defaultOnSort", null);
4104function measureColumn(tableData) {
4105 return function (column, index) {
4106 const firstVisibleColumnIndex = tableData.firstVisibleColumnIndex,
4107 tableStart = tableData.tableLeftVisibleEdge,
4108 tableEnd = tableData.tableRightVisibleEdge,
4109 fixedColumnWidth = tableData.fixedColumnWidth;
4110
4111 const leftEdge = column.offsetLeft + fixedColumnWidth;
4112 const rightEdge = leftEdge + column.offsetWidth;
4113 const isVisibleLeft = isEdgeVisible(leftEdge, tableStart, tableEnd);
4114 const isVisibleRight = isEdgeVisible(rightEdge, tableStart, tableEnd);
4115 const isVisible = isVisibleLeft || isVisibleRight;
4116 if (isVisible) {
4117 tableData.firstVisibleColumnIndex = Math.min(firstVisibleColumnIndex, index);
4118 }
4119 return { leftEdge, rightEdge, isVisible };
4120 };
4121}
4122function isEdgeVisible(position, start, end) {
4123 const minVisiblePixels = 30;
4124 return position >= start + minVisiblePixels && position <= end - minVisiblePixels;
4125}
4126function getPrevAndCurrentColumns(tableData, columnData) {
4127 const firstVisibleColumnIndex = tableData.firstVisibleColumnIndex;
4128
4129 const previousColumnIndex = Math.max(firstVisibleColumnIndex - 1, 0);
4130 const previousColumn = columnData[previousColumnIndex];
4131 const currentColumn = columnData[firstVisibleColumnIndex];
4132 return { previousColumn, currentColumn };
4133}
4134var DataTable$2 = withAppProvider()(DataTable$1);
4135
4136function DatePreference$1({ children }) {
4137 const datePreference = "Spelled";
4138 const months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
4139 const d = new Date(children);
4140 //const now = new Date();
4141 var date = "";
4142 if (datePreference === "Spelled") {
4143 // 4 Mar, 5 Feb 2020
4144 date = d.getDate() + " " + months[d.getMonth()] + " " + d.getFullYear();
4145 } else if (datePreference === "American") {
4146 // 3/4/2018, 2/5/2020
4147 date = d.getMonth() + 1 + "/" + d.getDate() + "/" + d.getFullYear();
4148 } else {
4149 // 4/3/2018, 5/2/2020
4150 date = d.getDate() + "/" + (d.getMonth() + 1) + "/" + d.getFullYear();
4151 }
4152 return React.createElement(
4153 "span",
4154 null,
4155 date
4156 );
4157}
4158
4159var styles$32 = {
4160 "DatePicker": "p_hj",
4161 "MonthContainer": "p_xq",
4162 "Month": "p_ha",
4163 "Month-current": "p_kv",
4164 "Week": "p_jc",
4165 "WeekHeadings": "p_dl",
4166 "Day": "p_sp",
4167 "EmptyDay": "p_j0",
4168 "Day-today": "p_dk",
4169 "Day-inRange": "p_lk",
4170 "Day-selected": "p_sa",
4171 "Day-disabled": "p_cq",
4172 "Weekday": "p_vl",
4173 "Weekday-current": "p_vb",
4174 "Header": "p_nd",
4175 "Title": "p_aq",
4176};
4177
4178class Day$1 extends React.PureComponent {
4179 constructor() {
4180 super(...arguments);
4181 this.dayNode = null;
4182 }
4183 componentDidUpdate(prevProps) {
4184 if (!prevProps.focused && this.props.focused && this.dayNode) {
4185 this.dayNode.focus();
4186 }
4187 }
4188 render() {
4189 var _props = this.props;
4190 const day = _props.day,
4191 focused = _props.focused,
4192 onClick = _props.onClick;
4193 var _props$onHover = _props.onHover;
4194 const onHover = _props$onHover === undefined ? other.noop : _props$onHover;
4195 var _props$onFocus = _props.onFocus;
4196 const onFocus = _props$onFocus === undefined ? other.noop : _props$onFocus,
4197 selected = _props.selected,
4198 inRange = _props.inRange,
4199 inHoveringRange = _props.inHoveringRange,
4200 disabled = _props.disabled,
4201 intl = _props.polaris.intl;
4202
4203 const handleHover = onHover.bind(null, day);
4204 if (!day) {
4205 return React.createElement('div', { className: styles$32.EmptyDay, onMouseOver: handleHover });
4206 }
4207 const handleClick = onClick && !disabled ? onClick.bind(null, day) : other.noop;
4208 const today = dates.isSameDay(new Date(), day);
4209 const className = styles.classNames(styles$32.Day, selected && styles$32['Day-selected'], disabled && styles$32['Day-disabled'], today && styles$32['Day-today'], (inRange || inHoveringRange) && !disabled && styles$32['Day-inRange']);
4210 const date = day.getDate();
4211 const tabIndex = (focused || selected || today || date === 1) && !disabled ? 0 : -1;
4212 const ariaLabel = [`${today ? intl.translate('Polaris.DatePicker.today') : ''}`, `${dates.Months[day.getMonth()]} `, `${date} `, `${day.getFullYear()}`].join('');
4213 return React.createElement(
4214 'button',
4215 {
4216 // eslint-disable-next-line react/jsx-no-bind
4217 onFocus: onFocus.bind(null, day), type: 'button', ref: this.setNode, tabIndex: tabIndex, className: className, onMouseOver: handleHover
4218 // eslint-disable-next-line react/jsx-no-bind
4219 , onClick: handleClick, 'aria-label': ariaLabel, 'aria-selected': selected, 'aria-disabled': disabled, role: 'gridcell' },
4220 date
4221 );
4222 }
4223 setNode(node) {
4224 this.dayNode = node;
4225 }
4226}
4227tslib_1.__decorate([decorators.autobind], Day$1.prototype, "setNode", null);
4228var Day$2 = withAppProvider()(Day$1);
4229
4230function Weekday$1({ label, title, current }) {
4231 const className = styles.classNames(styles$32.Weekday, current && styles$32['Weekday-current']);
4232 return React.createElement(
4233 'div',
4234 { 'aria-label': dates.Weekdays[label], className: className },
4235 title
4236 );
4237}
4238
4239const WEEKDAYS = [dates.Weekdays.Sunday, dates.Weekdays.Monday, dates.Weekdays.Tuesday, dates.Weekdays.Wednesday, dates.Weekdays.Thursday, dates.Weekdays.Friday, dates.Weekdays.Saturday];
4240function Month$1({ focusedDate, selected, hoverDate, disableDatesBefore, disableDatesAfter, allowRange, onChange = other.noop, onHover = other.noop, onFocus = other.noop, month, year, weekStartsOn }) {
4241 const isInHoveringRange = allowRange ? hoveringDateIsInRange : () => false;
4242 const now = new Date();
4243 const current = now.getMonth() === month && now.getFullYear() === year;
4244 const className = styles.classNames(styles$32.Title, current && styles$32['Month-current']);
4245 const weeks = dates.getWeeksForMonth(month, year, weekStartsOn);
4246 const weekdays = getWeekdaysOrdered(weekStartsOn).map(weekday => React.createElement(Weekday$1, { key: weekday, title: dates.abbreviationForWeekday(weekday), current: current && new Date().getDay() === weekday, label: weekday }));
4247 function handleDateClick(selectedDate) {
4248 onChange(dates.getNewRange(allowRange && selected, selectedDate));
4249 }
4250 function renderWeek(day, dayIndex) {
4251 if (day == null) {
4252 const lastDayOfMonth = new Date(year, month + 1, 0);
4253 return (
4254 // eslint-disable-next-line react/jsx-no-bind
4255 React.createElement(Day$2, { key: dayIndex, onHover: onHover.bind(null, lastDayOfMonth) })
4256 );
4257 }
4258 const disabled = disableDatesBefore && dates.isDateBefore(day, disableDatesBefore) || disableDatesAfter && dates.isDateAfter(day, disableDatesAfter);
4259 return React.createElement(Day$2, { focused: focusedDate != null && dates.isSameDay(day, focusedDate), day: day, key: dayIndex, onFocus: onFocus, onClick: handleDateClick, onHover: onHover, selected: selected != null && dates.dateIsSelected(day, selected), inRange: selected != null && dates.dateIsInRange(day, selected), disabled: disabled, inHoveringRange: selected != null && hoverDate != null && isInHoveringRange(day, selected, hoverDate) });
4260 }
4261 const weeksMarkup = weeks.map((week, index) => React.createElement(
4262 'div',
4263 { role: 'row', className: styles$32.Week, key: index },
4264 week.map(renderWeek)
4265 ));
4266 return React.createElement(
4267 'div',
4268 { role: 'grid', className: styles$32.Month },
4269 React.createElement(
4270 'div',
4271 { className: className },
4272 dates.Months[month],
4273 ' ',
4274 year
4275 ),
4276 React.createElement(
4277 'div',
4278 { role: 'rowheader', className: styles$32.WeekHeadings },
4279 weekdays
4280 ),
4281 weeksMarkup
4282 );
4283}
4284function hoveringDateIsInRange(day, range, hoverEndDate) {
4285 if (day == null) {
4286 return false;
4287 }
4288 const start = range.start,
4289 end = range.end;
4290
4291 return Boolean(start === end && day > start && day <= hoverEndDate);
4292}
4293function getWeekdaysOrdered(weekStartsOn) {
4294 const weekDays = [...WEEKDAYS];
4295 const restOfDays = weekDays.splice(weekStartsOn);
4296 return [...restOfDays, ...weekDays];
4297}
4298
4299class DatePicker$1 extends React.PureComponent {
4300 constructor() {
4301 super(...arguments);
4302 this.state = {
4303 hoverDate: undefined,
4304 focusDate: undefined
4305 };
4306 }
4307 componentDidUpdate(prevProps) {
4308 const selectedPropDidChange = !isSameSelectedDate(prevProps.selected, this.props.selected);
4309 if (selectedPropDidChange) {
4310 this.resetFocus();
4311 }
4312 }
4313 render() {
4314 var _props = this.props;
4315 const id = _props.id,
4316 selected = _props.selected,
4317 month = _props.month,
4318 year = _props.year,
4319 allowRange = _props.allowRange,
4320 multiMonth = _props.multiMonth,
4321 disableDatesBefore = _props.disableDatesBefore,
4322 disableDatesAfter = _props.disableDatesAfter;
4323 var _props$weekStartsOn = _props.weekStartsOn;
4324 const weekStartsOn = _props$weekStartsOn === undefined ? dates.Weekdays.Sunday : _props$weekStartsOn,
4325 intl = _props.polaris.intl;
4326 var _state = this.state;
4327 const hoverDate = _state.hoverDate,
4328 focusDate = _state.focusDate;
4329
4330 const showNextYear = dates.getNextDisplayYear(month, year);
4331 const showNextMonth = dates.getNextDisplayMonth(month);
4332 const showNextToNextYear = dates.getNextDisplayYear(showNextMonth, showNextYear);
4333 const showNextToNextMonth = dates.getNextDisplayMonth(showNextMonth);
4334 const showPreviousYear = dates.getPreviousDisplayYear(month, year);
4335 const showPreviousMonth = dates.getPreviousDisplayMonth(month);
4336 const previousMonthName = dates.Months[showPreviousMonth];
4337 const nextMonth = multiMonth ? dates.Months[showNextToNextMonth] : dates.Months[showNextMonth];
4338 const nextYear = multiMonth ? showNextToNextYear : showNextYear;
4339 const secondDatePicker = multiMonth ? React.createElement(Month$1, { onFocus: this.handleFocus, focusedDate: focusDate, month: showNextMonth, year: showNextYear, selected: deriveRange(selected), hoverDate: hoverDate, onChange: this.handleDateSelection, onHover: this.handleHover, disableDatesBefore: disableDatesBefore, disableDatesAfter: disableDatesAfter, allowRange: allowRange, weekStartsOn: weekStartsOn }) : null;
4340 return React.createElement(
4341 'div',
4342 { id: id, className: styles$32.DatePicker, onKeyDown: handleKeyDown, onKeyUp: this.handleKeyUp },
4343 React.createElement(
4344 'div',
4345 { className: styles$32.Header },
4346 React.createElement(Button$2, { plain: true, icon: 'arrowLeft', accessibilityLabel: intl.translate('Polaris.DatePicker.previousMonth', {
4347 previousMonthName,
4348 showPreviousYear
4349 })
4350 // eslint-disable-next-line react/jsx-no-bind
4351 , onClick: this.handleMonthChangeClick.bind(null, showPreviousMonth, showPreviousYear) }),
4352 React.createElement(Button$2, { plain: true, icon: 'arrowRight', accessibilityLabel: intl.translate('Polaris.DatePicker.nextMonth', {
4353 nextMonth,
4354 nextYear
4355 })
4356 // eslint-disable-next-line react/jsx-no-bind
4357 , onClick: this.handleMonthChangeClick.bind(null, showNextMonth, showNextYear) })
4358 ),
4359 React.createElement(
4360 'div',
4361 { className: styles$32.MonthContainer },
4362 React.createElement(Month$1, { onFocus: this.handleFocus, focusedDate: focusDate, month: month, year: year, selected: deriveRange(selected), hoverDate: hoverDate, onChange: this.handleDateSelection, onHover: this.handleHover, disableDatesBefore: disableDatesBefore, disableDatesAfter: disableDatesAfter, allowRange: allowRange, weekStartsOn: weekStartsOn }),
4363 secondDatePicker
4364 )
4365 );
4366 }
4367 handleFocus(date) {
4368 this.setState({ focusDate: date });
4369 }
4370 resetFocus() {
4371 this.setState({ focusDate: undefined });
4372 }
4373 handleKeyUp(event) {
4374 const key = event.key;
4375 var _props2 = this.props;
4376 const selected = _props2.selected,
4377 disableDatesBefore = _props2.disableDatesBefore,
4378 disableDatesAfter = _props2.disableDatesAfter;
4379 const focusDate = this.state.focusDate;
4380
4381 const range = deriveRange(selected);
4382 const focusedDate = focusDate || range && range.start;
4383 if (focusedDate == null) {
4384 return;
4385 }
4386 if (key === 'ArrowUp') {
4387 const previousWeek = new Date(focusedDate);
4388 previousWeek.setDate(focusedDate.getDate() - 7);
4389 if (!(disableDatesBefore && dates.isDateBefore(previousWeek, disableDatesBefore))) {
4390 this.setFocusDateAndHandleMonthChange(previousWeek);
4391 }
4392 }
4393 if (key === 'ArrowDown') {
4394 const nextWeek = new Date(focusedDate);
4395 nextWeek.setDate(focusedDate.getDate() + 7);
4396 if (!(disableDatesAfter && dates.isDateAfter(nextWeek, disableDatesAfter))) {
4397 this.setFocusDateAndHandleMonthChange(nextWeek);
4398 }
4399 }
4400 if (key === 'ArrowRight') {
4401 const tomorrow = new Date(focusedDate);
4402 tomorrow.setDate(focusedDate.getDate() + 1);
4403 if (!(disableDatesAfter && dates.isDateAfter(tomorrow, disableDatesAfter))) {
4404 this.setFocusDateAndHandleMonthChange(tomorrow);
4405 }
4406 }
4407 if (key === 'ArrowLeft') {
4408 const yesterday = new Date(focusedDate);
4409 yesterday.setDate(focusedDate.getDate() - 1);
4410 if (!(disableDatesBefore && dates.isDateBefore(yesterday, disableDatesBefore))) {
4411 this.setFocusDateAndHandleMonthChange(yesterday);
4412 }
4413 }
4414 }
4415 setFocusDateAndHandleMonthChange(date) {
4416 const onMonthChange = this.props.onMonthChange;
4417
4418 if (onMonthChange) {
4419 onMonthChange(date.getMonth(), date.getFullYear());
4420 }
4421 this.setState({
4422 hoverDate: date,
4423 focusDate: date
4424 });
4425 }
4426 handleDateSelection(range) {
4427 const end = range.end;
4428 var _props$onChange = this.props.onChange;
4429 const onChange = _props$onChange === undefined ? other.noop : _props$onChange;
4430
4431 this.setState({ hoverDate: end, focusDate: new Date(end) }, () => onChange(range));
4432 }
4433 handleMonthChangeClick(month, year) {
4434 const onMonthChange = this.props.onMonthChange;
4435
4436 if (!onMonthChange) {
4437 return;
4438 }
4439 this.setState({
4440 focusDate: undefined
4441 });
4442 onMonthChange(month, year);
4443 }
4444 handleHover(date) {
4445 this.setState({
4446 hoverDate: date
4447 });
4448 }
4449}
4450tslib_1.__decorate([decorators.autobind], DatePicker$1.prototype, "handleFocus", null);
4451tslib_1.__decorate([decorators.autobind], DatePicker$1.prototype, "resetFocus", null);
4452tslib_1.__decorate([decorators.autobind], DatePicker$1.prototype, "handleKeyUp", null);
4453tslib_1.__decorate([decorators.autobind], DatePicker$1.prototype, "setFocusDateAndHandleMonthChange", null);
4454tslib_1.__decorate([decorators.autobind], DatePicker$1.prototype, "handleDateSelection", null);
4455tslib_1.__decorate([decorators.autobind], DatePicker$1.prototype, "handleMonthChangeClick", null);
4456tslib_1.__decorate([decorators.autobind], DatePicker$1.prototype, "handleHover", null);
4457function handleKeyDown(event) {
4458 const key = event.key;
4459
4460 if (key === 'ArrowUp' || key === 'ArrowDown' || key === 'ArrowLeft' || key === 'ArrowRight') {
4461 event.preventDefault();
4462 event.stopPropagation();
4463 }
4464}
4465function isSameSelectedDate(previousDate, currentDate) {
4466 if (previousDate == null || currentDate == null) {
4467 return previousDate == null && currentDate == null;
4468 }
4469 if (previousDate instanceof Date || currentDate instanceof Date) {
4470 return previousDate instanceof Date && currentDate instanceof Date && dates.isSameDay(previousDate, currentDate);
4471 }
4472 return dates.isSameDay(previousDate.start, currentDate.start) && dates.isSameDay(previousDate.end, currentDate.end);
4473}
4474function deriveRange(selected) {
4475 return selected instanceof Date ? { start: selected, end: selected } : selected;
4476}
4477var DatePicker$2 = withAppProvider()(DatePicker$1);
4478
4479var styles$33 = {
4480 "DescriptionList": "p_bw",
4481 "Term": "p_on",
4482 "Description": "p_uj",
4483 "dense": "p_am",
4484};
4485
4486const getUniqueTermKey = other.createUniqueIDFactory(`Term`);
4487const getUniqueDescriptionKey = other.createUniqueIDFactory(`Description`);
4488function DescriptionList$1({ items, dense }) {
4489 const terms = items.reduce((allTerms, { term, description }) => [...allTerms, React.createElement(
4490 'dt',
4491 { key: getUniqueTermKey(), className: styles$33.Term },
4492 term
4493 ), React.createElement(
4494 'dd',
4495 { key: getUniqueDescriptionKey(), className: styles$33.Description },
4496 description ? description : '--'
4497 )], []);
4498 const className = styles.classNames(styles$33.DescriptionList, dense && styles$33.dense);
4499 return React.createElement(
4500 'dl',
4501 { className: className },
4502 terms
4503 );
4504}
4505
4506var styles$34 = {
4507 "DisplayText": "p_ne",
4508 "sizeSmall": "p_wx",
4509 "sizeMedium": "p_tb",
4510 "sizeLarge": "p_ti",
4511 "sizeExtraLarge": "p_ww",
4512};
4513
4514function DisplayText$1({ element: Element = 'p', children, size = 'medium' }) {
4515 const className = styles.classNames(styles$34.DisplayText, size && styles$34[styles.variationName('size', size)]);
4516 return React.createElement(
4517 Element,
4518 { className: className },
4519 children
4520 );
4521}
4522
4523var styles$35 = {
4524 "hidden": "p_f9",
4525 "LabelWrapper": "p_e4",
4526 "HelpText": "p_w5",
4527 "Error": "p_we",
4528};
4529
4530function Labelled$1(_a) {
4531 var id = _a.id,
4532 label = _a.label,
4533 error = _a.error,
4534 action = _a.action,
4535 helpText = _a.helpText,
4536 children = _a.children,
4537 labelHidden = _a.labelHidden,
4538 optional = _a.optional,
4539 rest = tslib_1.__rest(_a, ["id", "label", "error", "action", "helpText", "children", "labelHidden", "optional"]);
4540
4541 const className = styles.classNames(labelHidden && styles$35.hidden);
4542 const actionMarkup = action ? buttonFrom(action, { plain: true }) : null;
4543 const helpTextMarkup = helpText ? React.createElement(
4544 'div',
4545 { className: styles$35.HelpText, id: helpTextID$1(id) },
4546 helpText
4547 ) : null;
4548 const errorMarkup = error && typeof error !== 'boolean' && React.createElement(
4549 'div',
4550 { className: styles$35.Error },
4551 React.createElement(InlineError$1, { message: error, fieldID: id })
4552 );
4553 const labelMarkup = label ? React.createElement(
4554 'div',
4555 { className: styles$35.LabelWrapper },
4556 React.createElement(
4557 Label$1,
4558 Object.assign({ id: id }, rest, { hidden: false, optional: optional }),
4559 label
4560 ),
4561 actionMarkup
4562 ) : null;
4563 return React.createElement(
4564 'div',
4565 { className: className },
4566 labelMarkup,
4567 children,
4568 errorMarkup,
4569 helpTextMarkup
4570 );
4571}
4572
4573function helpTextID$1(id) {
4574 return `${id}HelpText`;
4575}
4576
4577function withContext$1(Consumer) {
4578 return function addContext(WrappedComponent) {
4579 // eslint-disable-next-line react/prefer-stateless-function
4580 class WithContext extends React.Component {
4581 render() {
4582 return React.createElement(
4583 Consumer,
4584 null,
4585 ctx => {
4586 const _a = this.props,
4587 context = _a.context,
4588 rest = tslib_1.__rest(_a, ["context"]);
4589 return React.createElement(WrappedComponent, Object.assign({}, rest, { context: Object.assign({}, context, ctx) }));
4590 }
4591 );
4592 }
4593 }
4594 const FinalComponent = hoistStatics(WithContext, WrappedComponent);
4595 return FinalComponent;
4596 };
4597}
4598
4599var _React$createContext$1 = React.createContext({
4600 size: 'extraLarge',
4601 type: 'file'
4602});
4603
4604const Provider$1 = _React$createContext$1.Provider;
4605const Consumer$1 = _React$createContext$1.Consumer;
4606
4607var IconDragDrop = {"viewBox":"0 0 20 20","body":"<path fill-rule=\"evenodd\" d=\"M19.317 12.052L14 10.28V5a1 1 0 0 0-1-1H5a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h5.28l1.772 5.317a.998.998 0 0 0 1.843.13l1.85-3.701 3.703-1.851a1 1 0 0 0-.131-1.843zM2 16a1 1 0 1 0-2 0v1a1 1 0 0 0 1 1h1a1 1 0 1 0 0-2M16 2a1 1 0 1 0 2 0V1a1 1 0 0 0-1-1h-1a1 1 0 1 0 0 2M6 2h1a1 1 0 1 0 0-2H6a1 1 0 1 0 0 2m5 0h1a1 1 0 1 0 0-2h-1a1 1 0 1 0 0 2M2 0H1a1 1 0 0 0-1 1v1a1 1 0 1 0 2 0 1 1 0 1 0 0-2M1 8a1 1 0 0 0 1-1V6a1 1 0 1 0-2 0v1a1 1 0 0 0 1 1m0 5a1 1 0 0 0 1-1v-1a1 1 0 1 0-2 0v1a1 1 0 0 0 1 1m13.553 1.105a1.002 1.002 0 0 0-.447.447l-.921 1.841-1.604-4.812 4.813 1.604-1.841.92zM6 12.002V6h6v3.612l-1.683-.561a.998.998 0 1 0-1.265 1.265L9.612 12H6zM7 16H6a1 1 0 1 0 0 2h1a1 1 0 1 0 0-2M17 5a1 1 0 0 0-1 1v1a1 1 0 1 0 2 0V6a1 1 0 0 0-1-1\"/>"};
4608
4609var AssetFileUpload = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMjggMTI4Ij48cGF0aCBkPSJNNjkuODEgMTI0LjQzYTEuMzkgMS4zOSAwIDAgMS0uNTctLjEyIDEuNDMgMS40MyAwIDAgMS0uNDktLjMyIDEuNTIgMS41MiAwIDAgMS0uNDQtMS4wNiAxLjUgMS41IDAgMCAxIC40NC0xLjA2IDEuNTMgMS41MyAwIDAgMSAxLjM1LS40MiAxLjMxIDEuMzEgMCAwIDEgLjI4LjA5IDEuMDggMS4wOCAwIDAgMSAuMjYuMTQgMS4wNiAxLjA2IDAgMCAxIC4yMy4xOSAxLjM3IDEuMzcgMCAwIDEgLjE5LjIyIDEuMjYgMS4yNiAwIDAgMSAuMTMuMjYgMS40OSAxLjQ5IDAgMCAxLS4zMiAxLjY0IDEuMzQgMS4zNCAwIDAgMS0uNDkuMzIgMS4zOSAxLjM5IDAgMCAxLS41Ny4xMnptLTkuNzEtMS41YTEuNSAxLjUgMCAwIDEgMS41LTEuNSAxLjUgMS41IDAgMCAxIDEuNSAxLjUgMS41MSAxLjUxIDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUtMS41em0tOC4yMiAwYTEuNSAxLjUgMCAwIDEgMS41LTEuNSAxLjUgMS41IDAgMCAxIDEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41LTEuNXptLTguMjIgMGExLjUgMS41IDAgMCAxIDEuNS0xLjUgMS41MSAxLjUxIDAgMCAxIDEuNTEgMS41IDEuNTEgMS41MSAwIDAgMS0xLjUxIDEuNSAxLjUxIDEuNTEgMCAwIDEtMS41LTEuNXptLTguMjEgMGExLjUgMS41IDAgMCAxIDEuNS0xLjUgMS41IDEuNSAwIDAgMSAxLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNS0xLjV6bS04LjIyIDBhMS41IDEuNSAwIDAgMSAxLjUtMS41IDEuNTEgMS41MSAwIDAgMSAxLjUxIDEuNSAxLjUxIDEuNTEgMCAwIDEtMS41MSAxLjUgMS41MSAxLjUxIDAgMCAxLTEuNS0xLjV6bS04LjIxIDBhMS41IDEuNSAwIDAgMSAxLjUtMS41IDEuNSAxLjUgMCAwIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUyLTEuNXptLTguMjIgMGExLjUgMS41IDAgMCAxIDEuNS0xLjUgMS41MSAxLjUxIDAgMCAxIDEuNTEgMS41IDEuNTEgMS41MSAwIDAgMS0xLjUxIDEuNSAxLjUgMS41IDAgMCAxLTEuNS0xLjV6bS02LjcxIDEuNUExLjUgMS41IDAgMCAxIDMgMTI0YTEuNDcgMS40NyAwIDAgMS0uNDQtMS4wNiAxLjUzIDEuNTMgMCAwIDEgMC0uM2MwLS4wOSAwLS4xOS4wOC0uMjhhMi4xNSAyLjE1IDAgMCAxIC4xNC0uMjYgMS4zNyAxLjM3IDAgMCAxIC4xOS0uMjIgMS4wNiAxLjA2IDAgMCAxIC4yMy0uMTkgMS4wOCAxLjA4IDAgMCAxIC4yNi0uMTQgMS4zMSAxLjMxIDAgMCAxIC4yOC0uMDkgMS44OCAxLjg4IDAgMCAxIC41OCAwIDEuMzEgMS4zMSAwIDAgMSAuMjguMDkgMS4zIDEuMyAwIDAgMSAuMjYuMTQgMS4zNyAxLjM3IDAgMCAxIC4yMy4xOSAxLjM3IDEuMzcgMCAwIDEgLjE5LjIyIDEuMjYgMS4yNiAwIDAgMSAuMTMuMjYgMS40MSAxLjQxIDAgMCAxIC4xMi41OCAxLjU2IDEuNTYgMCAwIDEtLjExLjU3IDEuNjMgMS42MyAwIDAgMS0uMzMuNDkgMS41IDEuNSAwIDAgMS0xIC40M3ptLTEuNS05LjVhMS41IDEuNSAwIDAgMSAxLjUtMS41IDEuNSAxLjUgMCAwIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUtMS41em0wLThhMS41IDEuNSAwIDAgMSAxLjUtMS41IDEuNSAxLjUgMCAwIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUtMS41em0wLThhMS41IDEuNSAwIDAgMSAxLjUtMS41IDEuNSAxLjUgMCAwIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUtMS40OXptMC04YTEuNSAxLjUgMCAwIDEgMS41LTEuNSAxLjUgMS41IDAgMCAxIDEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41LTEuNDl6bTAtOGExLjUgMS41IDAgMCAxIDEuNS0xLjVBMS41IDEuNSAwIDAgMSA1LjU5IDgzYTEuNSAxLjUgMCAwIDEtMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNS0xLjV6bTAtOGExLjUgMS41IDAgMCAxIDEuNS0xLjVBMS41IDEuNSAwIDAgMSA1LjU5IDc1YTEuNSAxLjUgMCAwIDEtMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNS0xLjV6bTAtOGExLjUgMS41IDAgMCAxIDEuNS0xLjVBMS41IDEuNSAwIDAgMSA1LjU5IDY3YTEuNTEgMS41MSAwIDAgMS0xLjUgMS41MUExLjUxIDEuNTEgMCAwIDEgMi41OSA2N3ptMC04YTEuNSAxLjUgMCAwIDEgMS41LTEuNUExLjUgMS41IDAgMCAxIDUuNTkgNTlhMS41IDEuNSAwIDAgMS0xLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41LTEuNXptMC04YTEuNTEgMS41MSAwIDAgMSAxLjUtMS41MUExLjUxIDEuNTEgMCAwIDEgNS41OSA1MWExLjUgMS41IDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUtMS41em0xLjUtNi40NkExLjUgMS41IDAgMCAxIDIuNTkgNDNhMS4zNiAxLjM2IDAgMCAxIDAtLjI5IDIuMjkgMi4yOSAwIDAgMSAuMDgtLjI4IDIuMTUgMi4xNSAwIDAgMSAuMTQtLjI2IDEuNTcgMS41NyAwIDAgMSAuNDItLjQyIDIgMiAwIDAgMSAuMjUtLjE0bC4yOS0uMDhhMS41IDEuNSAwIDAgMSAxLjM1LjQxIDEuNDUgMS40NSAwIDAgMSAuMTkuMjMgMS4yNiAxLjI2IDAgMCAxIC4xMy4yNiAxLjMxIDEuMzEgMCAwIDEgLjA5LjI4IDEuMzYgMS4zNiAwIDAgMSAwIC4yOSAxLjUyIDEuNTIgMCAwIDEtLjM4IDEgMi4xMSAyLjExIDAgMCAxLS4yMy4xOSAxLjI2IDEuMjYgMCAwIDEtLjI2LjEzIDEuMzEgMS4zMSAwIDAgMS0uMjguMDkgMS40MyAxLjQzIDAgMCAxLS4yOS4wNnpNNjAuMSA0M2ExLjUgMS41IDAgMCAxIDEuNS0xLjUgMS41IDEuNSAwIDAgMSAxLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNS0xLjV6bS04LjIyIDBhMS41IDEuNSAwIDAgMSAxLjUtMS41IDEuNSAxLjUgMCAwIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUtMS41em0tOC4yMiAwYTEuNSAxLjUgMCAwIDEgMS41LTEuNSAxLjUxIDEuNTEgMCAwIDEgMS41MSAxLjUgMS41MSAxLjUxIDAgMCAxLTEuNTEgMS41IDEuNSAxLjUgMCAwIDEtMS41LTEuNXptLTguMjEgMGExLjUgMS41IDAgMCAxIDEuNS0xLjUgMS41IDEuNSAwIDAgMSAxLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNS0xLjV6bS04LjIyIDBhMS41IDEuNSAwIDAgMSAxLjUtMS41IDEuNSAxLjUgMCAwIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUtMS41ek0xOSA0M2ExLjUgMS41IDAgMCAxIDEuNS0xLjVBMS41IDEuNSAwIDAgMSAyMiA0M2ExLjUgMS41IDAgMCAxLTEuNSAxLjVBMS41IDEuNSAwIDAgMSAxOSA0M3ptLTguMiAwYTEuNSAxLjUgMCAwIDEgMS41LTEuNSAxLjUgMS41IDAgMCAxIDEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41LTEuNXptNTkuMDEgMS40N2ExLjUgMS41IDAgMCAxLTEuMDYtLjQ3IDEuNTIgMS41MiAwIDAgMS0uNDQtMSAxLjUgMS41IDAgMCAxIDEuNzktMS41bC4yOC4wOC4yNi4xNGEyLjExIDIuMTEgMCAwIDEgLjIzLjE5IDEuNSAxLjUgMCAwIDEgLjQ0IDEuMDkgMS41MiAxLjUyIDAgMCAxLS40NCAxIDIuMTEgMi4xMSAwIDAgMS0uMjMuMTkgMS4yNiAxLjI2IDAgMCAxLS4yNi4xMyAxLjMxIDEuMzEgMCAwIDEtLjI4LjA5IDEuMzYgMS4zNiAwIDAgMS0uMjkuMDZ6bS0xLjUgNzAuNDZhMS41IDEuNSAwIDAgMSAxLjUtMS41IDEuNSAxLjUgMCAwIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUtMS41em0wLThhMS41IDEuNSAwIDAgMSAxLjUtMS41IDEuNSAxLjUgMCAwIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUtMS41em0wLThhMS41IDEuNSAwIDAgMSAxLjUtMS41IDEuNSAxLjUgMCAwIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUtMS40OXptMC04YTEuNSAxLjUgMCAwIDEgMS41LTEuNSAxLjUgMS41IDAgMCAxIDEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41LTEuNDl6bTAtOGExLjUgMS41IDAgMCAxIDEuNS0xLjUgMS41IDEuNSAwIDAgMSAxLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNS0xLjQzem0wLThhMS41IDEuNSAwIDAgMSAxLjUtMS41IDEuNSAxLjUgMCAwIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUtMS40M3ptMC04YTEuNSAxLjUgMCAwIDEgMS41LTEuNSAxLjUgMS41IDAgMCAxIDEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUgMS40OSAxLjUgMS41IDAgMCAxLTEuNS0xLjQyem0wLThhMS41IDEuNSAwIDAgMSAxLjUtMS41IDEuNSAxLjUgMCAwIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUtMS40M3ptMC04YTEuNSAxLjUgMCAwIDEgMS41LTEuNSAxLjUgMS41IDAgMCAxIDEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41LTEuNDN6IiBmaWxsPSIjZGVlNGY1Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTI2LjY3IDMuNTdoNzkuNDF2OTYuNjFIMjYuNjd6Ii8+PHBhdGggZD0iTTEwNi45MiAxMDFIOTEuNzhjLTEuNjQgMC0zLjI0LjE1LTQuOS4xOHMtMy4zOS0uMDUtNS4xMS0uMTNjLS44NSAwLTEuNy0uMDYtMi41NCAwcy0xLjY3IDAtMi40OSAwbC05LjkxLjI5Yy0zLjMyLjA4LTYuNjIuMjQtMTAgLjI2cy02Ljc4LS4yNy0xMC4xMS0uMTljLTYuNjMuNDItMTMuNC4xNi0yMC4wNyAwaC0uMDhhMS4xIDEuMSAwIDAgMS0xLjA3LTEuMTNjLjA4LTIgLjA2LTQgLjA4LTZzMC00IDAtNi0uMTktNC0uMjMtNiAuMTUtNCAuMjgtNmEyMS42IDIxLjYgMCAwIDAgMC0zIDI3Ljg2IDI3Ljg2IDAgMCAxLS4xNC0zdi02bC4xMy0xMi4wOHYtMTJsLjMzLTZhNTMgNTMgMCAwIDAtLjEzLTZjLS4yMy00IC4xMi04IC4yNi0xMi4wOGwuMDYtM3YtM2wtLjA4LTZBLjU1LjU1IDAgMCAxIDI2LjY0IDNjMy4zLS4xIDYuNjEgMCA5LjkyIDBzNi42MiAwIDkuOTMuMDZjMS42NSAwIDMuMzEuMDYgNSAuMDdINTRsMi40OC0uMDggOS45My0uMzNDNzMgMi41NCA3OS42IDIuNCA4Ni4yMiAyLjQzYzMuMzEuMDcgNi42Mi4zIDkuOTMuMjRsOS45Mi0uMjZhMS4xMyAxLjEzIDAgMCAxIDEuMTYgMS4xdi4wNmwuMTggNi4xYzAgMi0uMTEgNC4wNi0uMTYgNi4wOCAwIDQuMDYuMjIgOC4xNi4xMyAxMi4yMiAwIDItLjI2IDQtLjMzIDYtLjA2IDEgMCAyIDAgM3Y2LjA2bC0uMTIgM2E0Ni43NSA0Ni43NSAwIDAgMCAuMDkgNi4xM2MuMjEgNC4xNi0uMjEgOC0uMiAxMi4wOC0uMTcgNCAuMTMgOC4yIDAgMTIuMjEgMCAyLS4xNSA0LS4xNiA2cy4wNyA0LjExLjEzIDYuMTlsLjA4IDMuMTJ2My4wNmMuMDYgMi4xOC4xMyA0LjE4LjA1IDYuMTh6bS0xLjctMS42OVY4Ny4zN2MwLTIgLjA4LTMuOTMuMDYtNS45M3MtLjItNC4xMy0uMjYtNi4xNWMtLjE1LTQuMDguMjItNy44MyAwLTExLjkzLS4wNi0yLS4xNi00LjA2LS4yNy02LjFhNDMuODkgNDMuODkgMCAwIDEgMC02IDMxLjE0IDMxLjE0IDAgMCAwIC4xNi01LjkgNDQuNzUgNDQuNzUgMCAwIDEtLjA5LTYgNTguNDUgNTguNDUgMCAwIDAgLjE4LTUuODZjMC0yLS4yNy00LjA1LS4yOC02czAtNCAuMTEtNS45NS4xNS00IC4xNC02LS4xOS00LS4xNi02bC4xNC02IDEuMTEgMS4xMWMtMy4zMS0uMDctNi42MS0uMTktOS45Mi0uMThzLTYuNjIuMy05LjkzLjQzQzc5LjYgNS4wNiA3MyA1IDY2LjM3IDQuODNjLTEuNjYgMC0zLjMxLS4xLTUtLjE3bC01LS4yOWMtMy4zMS0uMTgtNi42MSAwLTkuOTIuMTMtNi42Mi4yMi0xMy4yNC4zOS0xOS44NS4yN2wxLjItMS4yLS4yOCA2djNsLjEgM2MuMjIgNCAuODMgOC4wNi4zNyAxMi4wOC0uMTEgMS0uMjcgMi0uMzQgM3MwIDIgMCAzYy4xMSAyIC40MSA0IC41IDZ2M2wtLjA3IDMtLjE0IDZMMjggNjRsLS4wNiA2YTIyIDIyIDAgMCAxLS4yIDMgMjAuMTggMjAuMTggMCAwIDAtLjA4IDNjLjA5IDIgLjI4IDQgLjE5IDZsLS4yNyA2Yy0uMDYgNC0uMTQgOC4wNS0uMTMgMTIuMDhsLS43NC0uNzVoOS44NWMzLjI4IDAgNi41OC4wOCA5Ljg2LjA2czYuNTEtLjI1IDkuNzYtLjI5IDYuNTcuMSA5Ljg3LjE0bDkuOTEuMTloNC44OWMxLjU5IDAgMy4xOC0uMTQgNC44Mi0uMTRzMy4zNC4xMSA1IC4xNGw0Ljg2LS4wNmMzLjE3LS4wNSA2LjQ3LS4wMiA5LjY5LS4wNHoiIGZpbGw9IiNmZmYiLz48ZyBvcGFjaXR5PSIuNSIgZmlsbD0iI2RlZTRmNSI+PHBhdGggZD0iTTI2LjY3IDMuNTdoNzkuNDF2OTYuNjFIMjYuNjd6Ii8+PHBhdGggZD0iTTEwNi45MiAxMDFIOTEuNzhjLTEuNjQgMC0zLjI0LjE1LTQuOS4xOHMtMy4zOS0uMDUtNS4xMS0uMTNjLS44NSAwLTEuNy0uMDYtMi41NCAwcy0xLjY3IDAtMi40OSAwbC05LjkxLjI5Yy0zLjMyLjA4LTYuNjIuMjQtMTAgLjI2cy02Ljc4LS4yNy0xMC4xMS0uMTljLTYuNjMuNDItMTMuNC4xNi0yMC4wNyAwaC0uMDhhMS4xIDEuMSAwIDAgMS0xLjA3LTEuMTNjLjA4LTIgLjA2LTQgLjA4LTZzMC00IDAtNi0uMTktNC0uMjMtNiAuMTUtNCAuMjgtNmEyMS42IDIxLjYgMCAwIDAgMC0zIDI3Ljg2IDI3Ljg2IDAgMCAxLS4xNC0zdi02bC4xMy0xMi4wOHYtMTJsLjMzLTZhNTMgNTMgMCAwIDAtLjEzLTZjLS4yMy00IC4xMi04IC4yNi0xMi4wOGwuMDYtM3YtM2wtLjA4LTZBLjU1LjU1IDAgMCAxIDI2LjY0IDNjMy4zLS4xIDYuNjEgMCA5LjkyIDBzNi42MiAwIDkuOTMuMDZjMS42NSAwIDMuMzEuMDYgNSAuMDdINTRsMi40OC0uMDggOS45My0uMzNDNzMgMi41NCA3OS42IDIuNCA4Ni4yMiAyLjQzYzMuMzEuMDcgNi42Mi4zIDkuOTMuMjRsOS45Mi0uMjZhMS4xMyAxLjEzIDAgMCAxIDEuMTYgMS4xdi4wNmwuMTggNi4xYzAgMi0uMTEgNC4wNi0uMTYgNi4wOCAwIDQuMDYuMjIgOC4xNi4xMyAxMi4yMiAwIDItLjI2IDQtLjMzIDYtLjA2IDEgMCAyIDAgM3Y2LjA2bC0uMTIgM2E0Ni43NSA0Ni43NSAwIDAgMCAuMDkgNi4xM2MuMjEgNC4xNi0uMjEgOC0uMiAxMi4wOC0uMTcgNCAuMTMgOC4yIDAgMTIuMjEgMCAyLS4xNSA0LS4xNiA2cy4wNyA0LjExLjEzIDYuMTlsLjA4IDMuMTJ2My4wNmMuMDYgMi4xOC4xMyA0LjE4LjA1IDYuMTh6bS0xLjctMS42OVY4Ny4zN2MwLTIgLjA4LTMuOTMuMDYtNS45M3MtLjItNC4xMy0uMjYtNi4xNWMtLjE1LTQuMDguMjItNy44MyAwLTExLjkzLS4wNi0yLS4xNi00LjA2LS4yNy02LjFhNDMuODkgNDMuODkgMCAwIDEgMC02IDMxLjE0IDMxLjE0IDAgMCAwIC4xNi01LjkgNDQuNzUgNDQuNzUgMCAwIDEtLjA5LTYgNTguNDUgNTguNDUgMCAwIDAgLjE4LTUuODZjMC0yLS4yNy00LjA1LS4yOC02czAtNCAuMTEtNS45NS4xNS00IC4xNC02LS4xOS00LS4xNi02bC4xNC02IDEuMTEgMS4xMWMtMy4zMS0uMDctNi42MS0uMTktOS45Mi0uMThzLTYuNjIuMy05LjkzLjQzQzc5LjYgNS4wNiA3MyA1IDY2LjM3IDQuODNjLTEuNjYgMC0zLjMxLS4xLTUtLjE3bC01LS4yOWMtMy4zMS0uMTgtNi42MSAwLTkuOTIuMTMtNi42Mi4yMi0xMy4yNC4zOS0xOS44NS4yN2wxLjItMS4yLS4yOCA2djNsLjEgM2MuMjIgNCAuODMgOC4wNi4zNyAxMi4wOC0uMTEgMS0uMjcgMi0uMzQgM3MwIDIgMCAzYy4xMSAyIC40MSA0IC41IDZ2M2wtLjA3IDMtLjE0IDZMMjggNjRsLS4wNiA2YTIyIDIyIDAgMCAxLS4yIDMgMjAuMTggMjAuMTggMCAwIDAtLjA4IDNjLjA5IDIgLjI4IDQgLjE5IDZsLS4yNyA2Yy0uMDYgNC0uMTQgOC4wNS0uMTMgMTIuMDhsLS43NC0uNzVoOS44NWMzLjI4IDAgNi41OC4wOCA5Ljg2LjA2czYuNTEtLjI1IDkuNzYtLjI5IDYuNTcuMSA5Ljg3LjE0bDkuOTEuMTloNC44OWMxLjU5IDAgMy4xOC0uMTQgNC44Mi0uMTRzMy4zNC4xMSA1IC4xNGw0Ljg2LS4wNmMzLjE3LS4wNSA2LjQ3LS4wMiA5LjY5LS4wNHoiLz48L2c+PHJlY3QgeD0iMzguOCIgeT0iMTYuMTciIHdpZHRoPSIyMS45NiIgaGVpZ2h0PSIyMy4zMyIgcng9IjEwLjcxIiByeT0iMTAuNzEiIGZpbGw9IiNkZWU0ZjUiLz48cGF0aCBkPSJNNTAuMDUgNDAuMjlhMTEuNzggMTEuNzggMCAwIDEtNC43LS44MmMtLjcyLS4zNS0xLjQzLS43Mi0yLjE1LTEuMDktLjM1LS4xOS0uNjgtLjQzLTEtLjY0cy0uNjUtLjUtMS0uNzZhMTEuNDUgMTEuNDUgMCAwIDEtMy4yNy04Ljg3TDM4IDI3YzAtLjM5IDAtLjguMDctMS4ycy4xNC0uOC4yMi0xLjJsLjM0LTEuMTZhMTAuNjggMTAuNjggMCAwIDEgMi41MS00IDE1LjUxIDE1LjUxIDAgMCAxIDEuNzYtMS41OCAxMC4xOCAxMC4xOCAwIDAgMSAyLjA2LTEuMTYgMTMuNjMgMTMuNjMgMCAwIDEgNC41OC0uOTUgMTEuODUgMTEuODUgMCAwIDEgNC41OC44MSAxMi4yOSAxMi4yOSAwIDAgMSA0IDIuNDEgMTEuNzUgMTEuNzUgMCAwIDEgMy40NiA4LjY1IDEyLjYxIDEyLjYxIDAgMCAxLTMgOC44MiA3LjU3IDcuNTcgMCAwIDEtLjg5LjgxIDguNDYgOC40NiAwIDAgMS0xIC43MiAxMi40MiAxMi40MiAwIDAgMS0yIDEuMjMgMTEuMTQgMTEuMTQgMCAwIDEtNC42NCAxLjA5em0wLTEuNThhOS42OSA5LjY5IDAgMCAwIDQtLjkyIDkuMzIgOS4zMiAwIDAgMCAxLjc3LTEuMDYgNS4xMiA1LjEyIDAgMCAwIC43Ni0uNzEgNy4wNyA3LjA3IDAgMCAwIC42Ny0uNzggMTEuMTUgMTEuMTUgMCAwIDAgMi4wOS0zLjQ5bC4zLTEgLjE2LTEgLjA3LTF2LTEuMThjMC0uMzguMDUtLjc2IDAtMS4xYTYuMTUgNi4xNSAwIDAgMCAwLTEgNiA2IDAgMCAwLS41My0yQTEwLjE5IDEwLjE5IDAgMCAwIDU3LjA1IDIwYy0uNTEtLjQ3LTEuMDctLjg2LTEuNTctMS4zNmE0LjQ0IDQuNDQgMCAwIDAtMS44Mi0xIDYuMDcgNi4wNyAwIDAgMC0xLS4yNSA2LjE0IDYuMTQgMCAwIDAtMS0uMTJjLS43MS0uMDgtMS4zMyAwLTIuMTEgMGgtMWE4LjYxIDguNjEgMCAwIDAtMSAuMTIgOS4zOCA5LjM4IDAgMCAwLTIgLjY4IDExLjMyIDExLjMyIDAgMCAwLTEuNzkgMSA1IDUgMCAwIDAtLjgzLjYybC0uMzkuMzUtLjMyLjRhMjUuMzUgMjUuMzUgMCAwIDAtMi4xMSAzLjU1IDYuNDggNi40OCAwIDAgMC0uMzIgMWMtLjA1LjM0LS4xMS42OS0uMTUgMUwzOS40NiAyN2wtLjEgMS4xM2E5LjM4IDkuMzggMCAwIDAgMyA3LjcxYy4yNC4yNS41LjQ5Ljc1Ljc0cy41NC40NS44My42NmE1LjU5IDUuNTkgMCAwIDAgMS45LjkyIDExLjIzIDExLjIzIDAgMCAwIDQuMjEuNTV6IiBmaWxsPSIjZGVlNGY1Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTQ5Ljc3IDI3Ljg0aDI4LjY4djMwLjQ3SDQ5Ljc3eiIvPjxwYXRoIGQ9Ik03OSA1OC44N2MtMi40My4wNS01LS4xMy03LjMxLjA3YTQxLjQyIDQxLjQyIDAgMCAwLTcuMjYuMTggMjQuODcgMjQuODcgMCAwIDEtMy42NyAwIDE2IDE2IDAgMCAwLTMuNjcuMDVjLTIuNDMuMTYtNC45Mi0uMi03LjM0LS4yMWEuNjcuNjcgMCAwIDEtLjY3LS42OHYtMS45MWMwLS42NC0uMS0xLjI3LS4xNS0xLjktLjE1LTEuMjcuNDQtMi41NC4wOC0zLjgxIDAtMi41NC4xLTUuMDguMS03LjYyYTMyLjMxIDMyLjMxIDAgMCAxIC4wOS0zLjgxIDE1LjI2IDE1LjI2IDAgMCAwIC4xOC0xLjljMC0uNjQtLjEzLTEuMjctLjE2LTEuOTEgMC0xLjI2LjE1LTIuNTMuMjMtMy44czAtMi41NC0uMDUtMy44MWEuMzYuMzYgMCAwIDEgLjM0LS4zN2MxLjItLjA2IDIuMzkgMCAzLjU5IDBzMi4zOSAwIDMuNTguMDZjMi4zOS4xNiA0Ljc4LS4yMyA3LjE3LS4yOWE4Ni4xIDg2LjEgMCAwIDEgMy41OS0uMTMgMjUuMTkgMjUuMTkgMCAwIDEgMy41OC4wOSA2My42MiA2My42MiAwIDAgMCA3LjItLjE3Ljg3Ljg3IDAgMCAxIC44OS44M3YuMDZhMTggMTggMCAwIDEtLjEgMS45NCAxOCAxOCAwIDAgMCAwIDEuOTQgMTUuNjEgMTUuNjEgMCAwIDEtLjEyIDMuODcgMzguMyAzOC4zIDAgMCAwLS4wNiAzLjg3IDEzLjIgMTMuMiAwIDAgMC0uMTEgMS45IDE5LjY0IDE5LjY0IDAgMCAxIC4xNSAyYy0uMDYgMS4yNy0uMjIgMi40OS0uMjIgMy43N3MuMTYgMi42OSAwIDMuOTFhMjEuMDggMjEuMDggMCAwIDAgMCAzLjg5djJjMCAuNjYuMTIgMS4yNi4xMiAxLjg5em0tMS4xMy0xLjEzdi0zLjcxYTE4LjY0IDE4LjY0IDAgMCAwLS4wOC0zLjc4IDM1LjUgMzUuNSAwIDAgMSAwLTMuNzJjMC0xLjI1LS4yMy0yLjU5LS4yOC0zLjg0YTguNjcgOC42NyAwIDAgMSAuMjEtMS43OCAxMS4yOCAxMS4yOCAwIDAgMC0uMTItMS45IDguNTQgOC41NCAwIDAgMSAuMS0xLjgzIDcuODIgNy44MiAwIDAgMCAwLTEuODcgMTQuMjEgMTQuMjEgMCAwIDEgMC0zLjc0IDE0LjM5IDE0LjM5IDAgMCAwIC4wNi0xLjg2YzAtLjYzLS4xMS0xLjI1LS4wOS0xLjg3bC44My44M2MtMi4zOSAwLTQuNzgtLjQtNy4xNy0uMDhhMjEuNDkgMjEuNDkgMCAwIDEtMy41OC4xOUg2NS45bC0xLjc5LS4wN2MtMi4zOSAwLTQuNzgtLjY0LTcuMTctLjI5YTY4LjY5IDY4LjY5IDAgMCAxLTcuMTcuMjJsLjgtLjhhMjIuMDkgMjIuMDkgMCAwIDAtLjE2IDMuODEgMjIuMzMgMjIuMzMgMCAwIDEgLjM3IDMuOCAxNiAxNiAwIDAgMC0uMzUgMS45MSA4Ljg2IDguODYgMCAwIDAgLjI2IDEuOSAxNi4xOSAxNi4xOSAwIDAgMSAwIDMuODFjLS4xMSAyLjU0IDAgNS4wOC0uMTcgNy42Mi0uNDIgMS4yNy4xMyAyLjU0IDAgMy44MWwtLjE4IDEuOS0uMDUgMS45MS0uNTMtLjUzYzIuMzcuMDkgNC43MSAwIDcuMDggMGEyMi41NyAyMi41NyAwIDAgMCAzLjUtLjEgMjUuNDggMjUuNDggMCAwIDEgMy41IDAgNDUgNDUgMCAwIDAgNy4wNS4wNmMyLjQ3LjE3IDQuNjYtLjAzIDcgMHoiIGZpbGw9IiNmZmYiLz48cGF0aCBkPSJNODMuNzEgNDEuMTlMNzQgNTkuMjhsMjEuNDYtLjY3LTExLjE1LTE3LjQ1YS4zNC4zNCAwIDAgMC0uNi4wM3oiIGZpbGw9IiNkZWU0ZjUiLz48cGF0aCBkPSJNODQuNCA0MS41NmMtLjgyIDEuNS0xLjU5IDMtMi40OSA0LjQ4bC0xIDIuMzdjLS4zNS43OC0uNzUgMS41My0xLjE3IDIuMjhsLTIuNTIgNC40N2MtLjgxIDEuNS0xLjY3IDMtMi41NCA0LjQ1bC0uNjUtMWMxLjc5IDAgMy41OC4xNCA1LjM3IDBzMy41OCAwIDUuMzctLjA5IDMuNTcgMCA1LjM2LS4xMmE1My41MSA1My41MSAwIDAgMSA1LjM2LS40M2wtLjU1IDEtMS40OS0yLjIzYy0uNTItLjc0LTEtMS40Ny0xLjUyLTIuMjJDOTEgNTMgOTAuMTMgNTEuNDMgODkuMSA1MGMtLjQ4LS43Ni0xLTEuNDgtMS40NS0yLjI2cy0uODUtMS41OC0xLjM2LTIuMzEtMS0xLjQ5LTEuNTEtMi4yMkw4NCA0Mi4wOGwtLjMxLS40NmEuNDQuNDQgMCAwIDAgLjcxLS4wNnptLTEuNC0uNzRhMS4xMyAxLjEzIDAgMCAxIC44NS0uNiAxLjE1IDEuMTUgMCAwIDEgMSAuMzYgMiAyIDAgMCAxIC4xNy4yNGwuMDkuMTQuMTkuMjguNzMgMS4xMiAxLjQ4IDIuMjRjLjQ3Ljc2IDEuMDYgMS40NCAxLjU4IDIuMTdzLjk0IDEuNTIgMS40MSAyLjI4Yy44OSAxLjU2IDEuODYgMy4wNiAyLjc4IDQuNi40NC43OC44NSAxLjU4IDEuMzQgMi4zM2wxLjUzIDIuMmEuNzguNzggMCAwIDEtLjIgMS4wOC43NS43NSAwIDAgMS0uMzguMTNoLS4wNmEyNC43MiAyNC43MiAwIDAgMS01LjM3LjA3Yy0xLjc5LjA3LTMuNTcuNTItNS4zNi40NGExNy4yNiAxNy4yNiAwIDAgMC0yLjY5IDBjLS44OS4wNi0xLjc4LjA3LTIuNjguMDgtMS43OS0uMTUtMy41Ny40MS01LjM2LjE0aC0uMjVhLjguOCAwIDAgMS0uNjctLjkyLjY5LjY5IDAgMCAxIC4xMi0uMzJsLjc1LTEuMDkuNi0xLjEzYy40NS0uNzMuOTMtMS40NCAxLjQtMi4xNS44OS0xLjQ3IDEuNi0zIDIuMzQtNC41Ny4zNi0uNzguNzItMS41NSAxLjE0LTIuM2wxLjMtMi4yMWMuNjYtMS41OCAxLjQ4LTMuMDggMi4yMi00LjYxem0xNC43NiAzNi42OUg4NmExIDEgMCAwIDEgMC0yaDExLjc2YTEgMSAwIDAgMSAwIDJ6bS0yMC4xNiAwSDM1YTEgMSAwIDAgMSAwLTJoNDIuNmExIDEgMCAwIDEgMCAyek05OCA4OC4xNEg2OS4zMWExIDEgMCAwIDEgMC0ySDk4YTEgMSAwIDAgMSAwIDJ6bS0zNy4yNSAwSDM1YTEgMSAwIDAgMSAwLTJoMjUuNzVhMSAxIDAgMCAxIDAgMnoiIGZpbGw9IiNkZWU0ZjUiLz48Y2lyY2xlIGN4PSIxMDcuNDEiIGN5PSIxMDYuNDMiIHI9IjE4IiBmaWxsPSIjZGVlNGY1IiBzdHJva2U9IiNkZWU0ZjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIzIi8+PHBhdGggZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMyIgZD0iTTEwNy40MSA5Ni44NHYxOS4xOG03LjE4LTkuNTlsLTcuMTgtOS41OS03LjE4IDkuNTkiLz48L3N2Zz4K';
4610
4611var AssetImageUpload = 'data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTI5IDEwOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik02OC43OCAxMDYuMjVhMS41MiAxLjUyIDAgMCAxLTEuMDYtLjQ0IDEuNTQgMS41NCAwIDAgMS0uMzItLjQ5IDEuMzkgMS4zOSAwIDAgMS0uMTItLjU3IDEuNDEgMS40MSAwIDAgMSAuMTItLjU4Ljk0Ljk0IDAgMCAxIC4xNC0uMjYgMSAxIDAgMCAxIC4xOC0uMjIgMS41NCAxLjU0IDAgMCAxIDIuMTIgMCAxLjUgMS41IDAgMCAxLTEuMDYgMi41NnptLTkuNzgtMS41YTEuNSAxLjUgMCAxIDEgMyAwIDEuNSAxLjUgMCAwIDEtMyAwem0tOC4zMSAwYTEuNSAxLjUgMCAwIDEgMyAwIDEuNTEgMS41MSAwIDAgMS0xLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41My0xLjVoLjAzem0tOC4zMiAwYTEuNSAxLjUgMCAxIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNTMtMS41aC4wM3ptLTguMzEgMGExLjUgMS41IDAgMSAxIDEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjU2LTEuNWguMDZ6bS04LjMxIDBhMS41IDEuNSAwIDEgMSAxLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41My0xLjVoLjAzem0tOC4zMiAwYTEuNSAxLjUgMCAxIDEgMS41IDEuNSAxLjUxIDEuNTEgMCAwIDEtMS41My0xLjVoLjAzem0tOC4zMSAwYTEuNSAxLjUgMCAxIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNTMtMS41aC4wM3ptLTYuODQgMS41YTEuNSAxLjUgMCAwIDEtMS4wNi0uNDQgMS41IDEuNSAwIDAgMSAwLTIuMTIgMS4wNiAxLjA2IDAgMCAxIC4yMy0uMTkgMS4wOCAxLjA4IDAgMCAxIC4yNi0uMTQgMS4zMSAxLjMxIDAgMCAxIC4yOC0uMDkgMS44OCAxLjg4IDAgMCAxIC41OCAwIDEuMzEgMS4zMSAwIDAgMSAuMjguMDkgMS4zIDEuMyAwIDAgMSAuMjYuMTQgMS4zNyAxLjM3IDAgMCAxIC4yMy4xOSAxLjUgMS41IDAgMCAxIC40NCAxLjA2IDEuNSAxLjUgMCAwIDEtMS41IDEuNXptLTEuNS05LjQzYTEuNSAxLjUgMCAxIDEgMyAwIDEuNSAxLjUgMCAwIDEtMyAwem0wLTcuOTJhMS41IDEuNSAwIDEgMSAzIDAgMS41IDEuNSAwIDAgMS0zIDB6bTAtNy45MmExLjUgMS41IDAgMSAxIDMgLjAyIDEuNSAxLjUgMCAwIDEtMyAwdi0uMDJ6bTAtNy45M2ExLjUgMS41IDAgMSAxIDMgMCAxLjUgMS41IDAgMCAxLTMgMHptMC03LjkyYTEuNSAxLjUgMCAxIDEgMyAwIDEuNSAxLjUgMCAwIDEtMyAwem0wLTcuOTNhMS41IDEuNSAwIDEgMSAzIDAgMS41IDEuNSAwIDAgMS0zIDB6bTAtNy45MmExLjUgMS41IDAgMSAxIDMgMCAxLjUgMS41IDAgMCAxLTMgMHptMS41LTYuNDJhMS41IDEuNSAwIDAgMS0xLjA2LTIuNTYgMS4wNiAxLjA2IDAgMCAxIC4yMy0uMTkgMS41OSAxLjU5IDAgMCAxIC4yNi0uMTFsLjI5LS4xMWExLjQyIDEuNDIgMCAwIDEgLjU4IDBsLjI4LjA4LjI2LjE0YTEuMzcgMS4zNyAwIDAgMSAuMjMuMTkgMS41IDEuNSAwIDAgMS0xLjA2IDIuNTZoLS4wMXpNNTkgNDEuMzZhMS41IDEuNSAwIDEgMSAzIDAgMS41IDEuNSAwIDAgMS0zIDB6bS04LjMxIDBhMS41IDEuNSAwIDEgMSAxLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41My0xLjVoLjAzem0tOC4zMiAwYTEuNSAxLjUgMCAxIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNTMtMS41aC4wM3ptLTguMzEgMGExLjUgMS41IDAgMSAxIDEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjU2LTEuNWguMDZ6bS04LjMxIDBhMS41IDEuNSAwIDEgMSAxLjUgMS41IDEuNSAxLjUgMCAwIDEtMS41My0xLjVoLjAzem0tOC4zMiAwYTEuNSAxLjUgMCAxIDEgMS41IDEuNSAxLjUgMS41IDAgMCAxLTEuNTMtMS41aC4wM3ptLTguMzEgMGExLjUgMS41IDAgMSAxIDEuNSAxLjUgMS41IDEuNSAwIDAgMS0xLjUzLTEuNWguMDN6bTU5LjY2IDEuNWExLjQ5IDEuNDkgMCAwIDEtMS4zOC0yLjA4IDEuMSAxLjEgMCAwIDEgLjE0LS4yNiAxLjI0IDEuMjQgMCAwIDEgLjE4LS4yMiAxLjUyIDEuNTIgMCAwIDEgMS4zNi0uNDFsLjI4LjA4YTIgMiAwIDAgMSAuMjUuMTQgMS4wNiAxLjA2IDAgMCAxIC4yMy4xOSAxLjMgMS4zIDAgMCAxIC4xOS4yMmMwIC4wOS4xLjE3LjE0LjI2YTEuNDcgMS40NyAwIDAgMSAuMDguMjggMS41IDEuNSAwIDAgMS0uNDEgMS4zNiAxIDEgMCAwIDEtLjIzLjE4IDEuMjMgMS4yMyAwIDAgMS0uMjUuMTQgMS40MSAxLjQxIDAgMCAxLS41OC4xMnptLTEuNSA1My45NmExLjUgMS41IDAgMSAxIDMgMCAxLjUgMS41IDAgMCAxLTMgMHptMC03LjkyYTEuNSAxLjUgMCAxIDEgMyAwIDEuNSAxLjUgMCAwIDEtMyAwem0wLTcuOTJjMC0uODMuNjctMS41MDUgMS41LTEuNTFhMS41MSAxLjUxIDAgMCAxIDEuNSAxLjUzIDEuNSAxLjUgMCAwIDEtMyAwdi0uMDJ6bTAtNy45M2ExLjUgMS41IDAgMSAxIDMgMCAxLjUgMS41IDAgMCAxLTMgMHptMC03LjkyYTEuNSAxLjUgMCAxIDEgMyAwIDEuNSAxLjUgMCAwIDEtMyAwem0wLTcuOTNhMS41IDEuNSAwIDEgMSAzIDAgMS41IDEuNSAwIDAgMS0zIDB6bTAtNy45MmExLjUgMS41IDAgMSAxIDMgMCAxLjUgMS41IDAgMCAxLTMgMHoiIGZpbGw9IiNERUU0RjUiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE3LjY0IDEuOThoOTEuMjZ2ODcuNTVIMTcuNjR6Ii8+PHBhdGggZD0iTTEwOS43NSA5MC4zOEg5OC4xNmMtMS45MiAwLTMuODgtLjA2LTUuNzMgMC0uOTQgMC0xLjg1LjEtMi44MS4xaC0yLjkxYy0yLS4wNy0zLjk1LS4xNy01Ljg2LS4xNmwtNS42OC4xNS0xMS4zOC4zM2MtMS45MSAwLTMuODEuMTMtNS43NS4xcy0zLjg5LS4xMy01LjgzLS4xN2MtMS45NC0uMDQtMy44NSAwLTUuNzUuMDZzLTMuODEuMTctNS43My4xOWMtMy44Ny0uMDctNy43Mi0uMTQtMTEuNTgtLjI2bC0yLjg4LS4wOGgtOC42M2ExIDEgMCAwIDEtMS0xYzAtMy42NS0uMzktNy4yOS0uMTctMTAuOTRhNDUuNSA0NS41IDAgMCAwIC4yMy01LjQ3Yy0uMDYtLjkxLS4xNy0xLjgzLS4xOC0yLjc0LS4wMS0uOTEgMC0xLjgyIDAtMi43MyAwLTcuMy4yMS0xNC42LjE2LTIxLjg5VjQwLjRjMC0xLjgyLjE3LTMuNjUuMjUtNS40OC4wOC0xLjgzLjE5LTMuNjQuMTMtNS40Ny0uMDYtMS44My0uMjQtMy42NC0uMjMtNS40NyAwLTMuNjUuMy03LjI5LjM3LTEwLjk0LjA3LTMuNjUgMC03LjMtLjA4LTEwLjk1IDAtLjMuMjQtLjU0NS41NC0uNTUgMy44LS4wOSA3LjYxIDAgMTEuNDEgMHM3LjYgMCAxMS40MS4xMWMxLjkgMCAzLjguMDUgNS43IDBsNS43LS4xOGMzLjgxLS4xNiA3LjYxLS4yNCAxMS40MS0uMzMgMy44LS4wOSA3LjYtLjEyIDExLjQxLS4xOCAzLjgxLS4wNiA3LjYuMjEgMTEuNC4yNiAzLjguMDUgNy42MS0uMTYgMTEuNDEtLjI0IDMuOC0uMDggNy42MS0uMzMgMTEuNDEtLjFoLjA4QTEuMTkgMS4xOSAwIDAgMSAxMTAuMTMgMmMwIC45My0uMDYgMS44NS0uMDcgMi43N2wuMDYgMi43Ni4xMSA1LjU0YzAgMS44NSAwIDMuNjktLjEyIDUuNTItLjEyIDEuODMtLjI2IDMuNjQtLjI3IDUuNDggMCAzLjY4LjE2IDcuNDEtLjA5IDExYTQ1LjIxIDQ1LjIxIDAgMCAwIC4xMSA1LjU2IDUzLjcyIDUzLjcyIDAgMCAxIDAgNS41M2MtLjE2IDMuNjItLjI1IDcuMjUtLjI2IDEwLjkzLS4wMSAzLjY4LjE3IDcuNDcgMCAxMS0uMTcgMy41MyAwIDcuMzQuMDggMTEuMTEuMDYgMS45IDAgMy43My4wNiA1LjU5LjA2IDEuODYuMDMgMy43Ny4wMSA1LjU5em0tMS43LTEuN1Y3Ny44N2MuMDYtMy41NS4xOC03LjA4LS4wNi0xMC44NS0uMS0xLjg3LS4xOS0zLjcyLS4xNy01LjUxbC4xMS01LjM0YzAtMy42LS4xOC03LjMtLjM3LTExYTM2Ljg5IDM2Ljg5IDAgMCAxIDAtNS4zNyAzMC41MiAzMC41MiAwIDAgMCAuMTgtNS4zNSA1MCA1MCAwIDAgMS0uMTYtNS40NWMwLTEuNzguMjMtMy41NS4yMy01LjM2di0yLjcybC0uMTYtMi43M2MtLjEyLTEuODItLjEyLTMuNjItLjA5LTUuNDJsLjE3LTUuNC4wOC0yLjdWMS45NWwxLjE0IDEuMTVjLTcuNjEuMzItMTUuMjEtLjM5LTIyLjgyLS4xOC0xLjkgMC0zLjguMTktNS43LjI5LS45NS4wNy0xLjkuMS0yLjg1LjEzLS45NS4wMy0xLjkuMDUtMi44NSAwLTMuODEgMC03LjYxLjA1LTExLjQxLS4wNy0zLjgtLjEyLTcuNi0uMDktMTEuNDEtLjMzYTk0LjMgOTQuMyAwIDAgMC0xMS40LS4yYy03LjYxLjMyLTE1LjIxLjQ4LTIyLjgyLjM4TDE4Ljg0IDJjLS4xNCAzLjY1LS40MSA3LjMtLjI1IDExIC4xNiAzLjcuNTggNy4yOS41OSAxMC45NCAwIDEuODMtLjM0IDMuNjUtLjUgNS40N2EyMC44OSAyMC44OSAwIDAgMCAwIDIuNzRjMCAuOTEuMSAxLjgyLjE4IDIuNzNhNTAuNDEgNTAuNDEgMCAwIDEgLjM2IDUuNDhjLjA1IDEuODItLjA1IDMuNjQtLjA4IDUuNDdsLS4xNCA1LjR2NS40N2wtLjA4IDExdjIuNzNjMCAuOTEtLjE2IDEuODMtLjI0IDIuNzRhNDMuNDUgNDMuNDUgMCAwIDAgLjE0IDUuNDdjLjE3IDMuNjUtLjI0IDcuMjktLjI4IDEwLjk0bC0uODQtLjg0YzcuNTYuMTUgMTUuMTIuMDggMjIuNjcuMDZsNS42Ny4wNmMxLjg5IDAgMy43OSAwIDUuNjUtLjA3bDUuNTktLjE5aDUuNjZsMTEuNC4yIDUuNy4wOWMxLjg5IDAgMy43Mi0uMSA1LjU1LS4xNyAxLjgzLS4wNyAzLjczIDAgNS42NyAwaDUuNjZjMy42My0uMDMgNy40LS4wMiAxMS4xMy0uMDR6IiBmaWxsPSIjREVFNEY1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48ZyBvcGFjaXR5PSIuNSIgZmlsbD0iI0RFRTRGNSIgZmlsbC1ydWxlPSJub256ZXJvIj48cGF0aCBkPSJNMjUuOSA5LjloNzQuNzV2NzEuNzFIMjUuOXoiLz48cGF0aCBkPSJNMTAxLjIxIDgyLjE4SDg3LjA2Yy0xLjUyIDAtMy4wOC4xLTQuNjkgMC0xLjYxLS4xLTMuMjEtLjA5LTQuNzctLjA4bC00LjY1LjEtOS4zNC4yMmMtMy4wOS4xMi02LjI5IDAtOS40NSAwLTEuNTgtLjA2LTMuMTQgMC00LjcgMGwtNC43LjExYy02LjMxLS4wNy0xMi42LS4yOS0xOC44Ni0uMjVhLjcuNyAwIDAgMS0uNzEtLjY5YzAtMy0uMjQtNi0uMTEtOWE0NC43MSA0NC43MSAwIDAgMCAuMTYtNC40OGMwLS43NS0uMTItMS41LS4xMi0yLjI0di0yLjE4YzAtNiAuMTQtMTIgLjExLTE3LjkzLS4wMy01LjkzLjU3LTExLjk1LjEtMTcuOTNsLjI0LTljLjA2LTMgMC02LS4wNS05IDAtLjIuMTYtLjM2NS4zNi0uMzcgMy4xMS0uMDYgNi4yMiAwIDkuMzQgMHM2LjIzIDAgOS4zNC4wN2g0LjY3bDQuNjgtLjEyYzMuMTEtLjEgNi4yMy0uMTYgOS4zNC0uMjIgMy4xMS0uMDYgNi4yMy0uMDcgOS4zNC0uMTEgMy4xMS0uMDQgNi4yMy4xMSA5LjM1LjE1IDMuMTIuMDQgNi4yMy0uMDkgOS4zNC0uMTQgMy4xMS0uMDUgNi4yMy0uMTkgOS4zNC0uMDdoLjA2YS44MS44MSAwIDAgMSAuNzcuODJ2NC41MmwuMDYgNC41M2MwIDEuNTEgMCAzLS4wOCA0LjUxLS4wOCAxLjUxLS4xNCAzLS4xNyA0LjQ5IDAgMyAuMSA2IDAgOS0uMDcgMS40OCAwIDMgLjA2IDQuNTMuMDYgMS41MyAwIDMgMCA0LjUzLS4xIDMtLjE2IDUuOTQtLjE3IDguOTUtLjAxIDMuMDEuMTEgNi4wOSAwIDlzMCA2IC4wNSA5LjA4IDAgNi4xNy4wMSA5LjJ6bS0xLjEzLTEuMTN2LTguODhjMC0yLjg4LjEtNS44NSAwLTguOS0uMS0zLjA1LS4wOS02IDAtOC45LjA5LTIuOS0uMTEtNi0uMjQtOWE0MC42MyA0MC42MyAwIDAgMSAwLTQuNDIgMzIgMzIgMCAwIDAgLjEyLTQuNGMtLjI1LTMgMC01LjkxIDAtOC44NyAwLTIuOTYtLjMzLTYtLjE4LTguOTFsLjEtNC40NFY5Ljg4bC43Ny43N2MtMy4xMS4xMi02LjIyIDAtOS4zNCAwcy02LjIzLS4xMi05LjM0LS4wOGMtMy4xMS4wNC02LjIzLjMzLTkuMzUuMy0zLjEyLS4wMy02LjIzIDAtOS4zNCAwLTMuMTEgMC02LjIzLS4wOC05LjM0LS4yM2wtNC42OC0uMTdjLTEuNTUtLjA1LTMuMTEgMC00LjY3IDAtNi4yMy4yMi0xMi40Ni4zMi0xOC42OC4yNWwuOC0uOGMtLjEgMy0uMjggNi0uMTcgOSAuMTEgMyAuMzkgNiAuMzkgOSAwIDEuNS0uMjIgMy0uMzIgNC40OGEzMS44OSAzMS44OSAwIDAgMCAuMSA0LjQ4IDcwLjY5IDcwLjY5IDAgMCAxIC4xOCA5Yy0uMTUgNi0uMDcgMTEuOTUtLjE1IDE3LjkzdjIuMjRjMCAuNzQtLjExIDEuNDktLjE2IDIuMjRhNDEuODcgNDEuODcgMCAwIDAgLjA5IDQuNDhjLjEgMy0uMTUgNi0uMTggOWwtLjU2LS41NmM2LjE5LjEgMTIuMzkgMCAxOC41OCAwIDMuMSAwIDYuMjMuMTEgOS4yOSAwIDMuMDYtLjExIDYuMTItLjIgOS4yNC0uMTFsOS4zNC4xNCA0LjY3LjA2IDQuNTctLjFjMS41MS0uMDYgMy4wNyAwIDQuNjUgMGg0LjY0YzMuMDEtLjE1IDYuMDktLjE0IDkuMTctLjE1eiIvPjwvZz48cmVjdCBmaWxsPSIjREVFNEY1IiBmaWxsLXJ1bGU9Im5vbnplcm8iIHg9IjM0LjY3IiB5PSIyMy4xMSIgd2lkdGg9IjIyLjE1IiBoZWlnaHQ9IjI0LjUyIiByeD0iMTEuMDIiLz48cGF0aCBkPSJNNDUuNzkgNDhhMTIuMDcgMTIuMDcgMCAwIDEtOC42MS0zLjcgMTEuMTEgMTEuMTEgMCAwIDEtMi40Mi00LjE2Yy0uMTItLjM5LS4yLS43OS0uMy0xLjE4LS4xLS4zOS0uMTItLjc5LS4xOC0xLjE5bC0uMDUtMS4yMXYtMS4xNGMwLS43NyAwLTEuNTUuMDctMi4zNiAwLS40LjEzLS44LjE5LTEuMTlsLjMyLTEuMTZhMTEuMDYgMTEuMDYgMCAwIDEgMi40My00LjA4IDExLjM5IDExLjM5IDAgMCAxIDMuODItMi43OCAxMi4yNyAxMi4yNyAwIDAgMSA0LjYyLTEgMTEuMjUgMTEuMjUgMCAwIDEgNC42MSAxIDEyIDEyIDAgMCAxIDMuODggMi42OSAxMS40MSAxMS40MSAwIDAgMSAyLjQzIDQuMDljLjEzLjM3LjIyLjc3LjMyIDEuMTUuMS4zOC4xNC43OS4yMSAxLjE5bC4wNyAxLjE5djEuMTdjMCAuNzcgMCAxLjU1LS4wOSAyLjM1LS4wNS40LS4xMy44LS4xOSAxLjE5TDU2LjY0IDQwYTEwLjg3IDEwLjg3IDAgMCAxLTIuMzUgNC4xNCA3LjQ4IDcuNDggMCAwIDEtLjg2LjgzIDguMjYgOC4yNiAwIDAgMS0uOTQuNzRBMTAuOTIgMTAuOTIgMCAwIDEgNTAuNDQgNDdhMTEuNjIgMTEuNjIgMCAwIDEtNC42NSAxem0wLS43OWExMC4yOSAxMC4yOSAwIDAgMCA3Ljg2LTMuNjQgMTEuMjMgMTEuMjMgMCAwIDAgMi4yMi0zLjgxIDEzIDEzIDAgMCAwIC41My00LjQ2di0yLjI5Yy0uMDYtLjM3LS4wOS0uNzQtLjE2LTEuMTEtLjA3LS4zNy0uMTktLjczLS4zMS0xLjA4YTEwLjY5IDEwLjY5IDAgMCAwLTIuMy0zLjgyIDEwLjQ4IDEwLjQ4IDAgMCAwLTMuNTctMi42NSAxMS4yNyAxMS4yNyAwIDAgMC00LjM3LS43OGgtMS4xMWExMC42IDEwLjYgMCAwIDAtMS4xMS4xNiAxMSAxMSAwIDAgMC0yLjEuNzEgMTAuMjggMTAuMjggMCAwIDAtMy41OCAyLjYxIDE0LjEyIDE0LjEyIDAgMCAwLTIuMjMgMy44MyAxMC4yMiAxMC4yMiAwIDAgMC0uMzEgMS4xMmMwIC4zNy0uMTIuNzQtLjE2IDEuMTEtLjA4Ljc0LS4xMiAxLjUxLS4xNCAyLjI5YTEwLjU3IDEwLjU3IDAgMCAwIDIuODQgOC4zNCAxMC4yMyAxMC4yMyAwIDAgMCA4IDMuNDl2LS4wMnoiIGZpbGw9IiNERUU0RjUiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTQ1Ljc0IDM1LjM3aDI4LjkzdjMyLjAySDQ1Ljc0eiIvPjxwYXRoIGQ9Ik03NSA2Ny42N2MtMi40MyAwLTQuOTQtLjA2LTcuMyAwLTIuNTEtLjExLTQuODcgMC03LjI5LjA3LTEuMjEgMC0yLjQxLjA5LTMuNjUgMC0xLjI0LS4wOS0yLjQ2LS4wNy0zLjY2IDAtMi40My4xMi00Ljg5LS4wNy03LjMyLS4wN2EuMzYuMzYgMCAwIDEtLjM2LS4zNnYtNGMwLTEuMzMuMTItMi42NyAwLTQtLjA4LTIuNjYgMC01LjMzIDAtOHYtNGwuMDktMmMwLS42NyAwLTEuMzQtLjA2LTIgMC0xLjMzLjA2LTIuNjYuMDktNCAuMDMtMS4zNCAwLTIuNjcgMC00YS4yLjIgMCAwIDEgLjE5LS4xOWg3LjIzYzIuNDEuMDggNC44My0uMSA3LjI0LS4xMmg3LjI0YzIuNDEuMTEgNC44MiAwIDcuMjMtLjA4YS40Mi40MiAwIDAgMSAuNDMuNGMuMDcgMS4zNS0uMDkgMi42OSAwIDRzLjA3IDIuNzEgMCA0LS4wNyAyLjY3IDAgNGwtLjA3IDItLjAzIDIuMmMwIDEuMzQtLjEgMi42NS0uMTEgNC0uMDEgMS4zNS4wOCAyLjc0IDAgNGwtLjA1IDIgLjA1IDIuMDZDNzUgNjUgNzUgNjYuMzEgNzUgNjcuNjd6bS0uNTctLjU2di02bC0uMDctMmMtLjA5LTEuMzcgMC0yLjYxIDAtNGwtLjE0LTRjMC0uNjYuMTMtMS4yNy4xMi0xLjk0LS4wMS0uNjctLjA2LTEuMzQtLjA4LTJhMzcuMTIgMzcuMTIgMCAwIDAgMC00Yy0uMDktMS4zNCAwLTIuNjQgMC00IDAtMS4zNi0uMDctMi42NSAwLTRsLjQuNGMtMi40MSAwLTQuODItLjE2LTcuMjMgMGwtMS44MS4wN0g2MC4yYy0yLjQxIDAtNC44My0uMjktNy4yNC0uMTMtMi40MS4xNi00LjgyLjE2LTcuMjMuMWwuMzktLjM5YzAgMS4zMy0uMTQgMi42Ny0uMDYgNCAuMDggMS4zMy4yMyAyLjY3LjE2IDRhMTkuNDMgMTkuNDMgMCAwIDAtLjE2IDJjMCAuNjYuMDkgMS4zMy4xNCAyIC4xMiAxLjMzIDAgMi42NiAwIDQtLjA2IDIuNjcgMCA1LjM0LS4xMiA4LS4wOSAxLjM0LjEyIDIuNjcgMCA0cy0uMDcgMi42Ny0uMDkgNGwtLjI2LS4yNWg3LjE5YzEuMiAwIDIuMzkgMCAzLjU3LS4wNyAxLjE4LS4wNyAyLjM4IDAgMy41OCAwIDIuNCAwIDQuODUuMTMgNy4xNyAwIDIuNDUuMjkgNC43Ni4xOSA3LjE1LjIxaC4wNHoiIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik04MCA0OS40bC05Ljc2IDE5IDIxLjY1LS43LTExLjMxLTE4LjMzYS4zMy4zMyAwIDAgMC0uNTguMDN6IiBmaWxsPSIjREVFNEY1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNODAuMzMgNDkuNThjLS44MiAxLjU4LTEuNjIgMy4xNy0yLjQ4IDQuNzNsLTEuMTIgMi40My0xLjIgMi4zOGMtMS42OCAzLjE1LTMuMjkgNi4zMi01IDkuNDVsLS4zMy0uNTJjMS44IDAgMy42MSAwIDUuNDItLjA5czMuNjEgMCA1LjQxLS4xM2MxLjgtLjEzIDMuNjEtLjA5IDUuNDEtLjE2IDEuOC0uMDcgMy42MS0uMjMgNS40MS0uM2wtLjI3LjUxLTMtNC43MWMtMS0xLjU4LTEuODctMy4yLTIuODgtNC43Ni0uNDktLjc5LTEtMS41Ny0xLjQ3LTIuMzdzLS45MS0xLjYyLTEuNDItMi40bC0xLjQ4LTIuMzUtLjc1LTEuMTgtLjM1LS41NC4xLjAxem0tLjctLjM2YS43NC43NCAwIDAgMSAuNTctLjQxLjcxLjcxIDAgMCAxIC42Ni4yN2MuMTkuMjcuMjcuNDEuNC42M2wuNzQgMS4xOCAxLjQ4IDIuMzZjLjQ4LjggMSAxLjU1IDEuNTIgMi4zNC41Mi43OSAxIDEuNTkgMS40NCAyLjM4bDIuODYgNC43OGE2NS4zNSA2NS4zNSAwIDAgMCAxLjQxIDIuNGwxLjUgMi4zNWEuMzguMzggMCAwIDEtLjEyLjU0LjMzLjMzIDAgMCAxLS4xOS4wNmwtMi43MS4xM2MtLjkuMDgtMS44MSAwLTIuNzEgMC0xLjguMDktMy42LjI5LTUuNDEuMzEtMS44MS4wMi0zLjYxLjEzLTUuNDEuMTQtMS44LjAxLTMuNjEuMjYtNS40Mi4xN2EuNDMuNDMgMCAwIDEtLjQxLS40NS40Ni40NiAwIDAgMSAwLS4yYy40NS0uNzcuOS0xLjU0IDEuMjktMi4zNC4zOS0uOC44OC0xLjU1IDEuMy0yLjMzLjg4LTEuNTMgMS41OC0zLjE3IDIuNDEtNC43N0w3NiA1Ni4zNyA3Ny4yNyA1NGMuNzMtMS42IDEuNTctMy4xOSAyLjM2LTQuNzh6IiBmaWxsPSIjREVFNEY1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48Y2lyY2xlIGZpbGw9IiNERUU0RjUiIGZpbGwtcnVsZT0ibm9uemVybyIgY3g9IjEwOC42NCIgY3k9Ijg4LjI1IiByPSIxOS41Ii8+PHBhdGggZD0iTTEwOC42NCA3OC42NnYxOS4xOG03LjE4LTkuNTlsLTcuMTgtOS41OS03LjE4IDkuNTkiIHN0cm9rZT0iI0ZGRiIgc3Ryb2tlLXdpZHRoPSIzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L2c+PC9zdmc+Cg==';
4612
4613var styles$36 = {
4614 "FileUpload": "p_km",
4615 "Image": "p_j8",
4616 "sizeExtraLarge": "p_yd",
4617 "sizeLarge": "p_v6",
4618};
4619
4620class FileUpload$1 extends React.Component {
4621 constructor(props) {
4622 super(props);
4623 const translate = props.polaris.intl.translate,
4624 type = props.context.type;
4625
4626 const suffix = capitalize(type);
4627 this.state = {
4628 actionTitle: translate(`Polaris.DropZone.FileUpload.actionTitle${suffix}`),
4629 actionHint: translate(`Polaris.DropZone.FileUpload.actionHint${suffix}`)
4630 };
4631 }
4632 updateStateFromProps(props) {
4633 var _state = this.state;
4634 const actionTitle = _state.actionTitle,
4635 actionHint = _state.actionHint;
4636
4637 if (props.actionTitle && props.actionTitle !== actionTitle) {
4638 this.setState({ actionTitle: props.actionTitle });
4639 }
4640 if (props.actionHint && props.actionHint !== actionHint) {
4641 this.setState({ actionHint: props.actionHint });
4642 }
4643 }
4644 // eslint-disable-next-line react/no-deprecated
4645 componentWillReceiveProps(props) {
4646 this.updateStateFromProps(props);
4647 }
4648 // eslint-disable-next-line react/no-deprecated
4649 componentWillMount() {
4650 this.updateStateFromProps(this.props);
4651 }
4652 render() {
4653 var _props$context = this.props.context;
4654 const size = _props$context.size,
4655 type = _props$context.type;
4656 var _state2 = this.state;
4657 const actionTitle = _state2.actionTitle,
4658 actionHint = _state2.actionHint;
4659
4660 const imageClasses = styles.classNames(styles$36.Image, size && size === 'extraLarge' && styles$36.sizeExtraLarge, size && size === 'large' && styles$36.sizeLarge);
4661 const extraLargeView = size === 'extraLarge' ? React.createElement(
4662 Stack$1,
4663 { vertical: true },
4664 type === 'file' && React.createElement('img', { className: imageClasses, src: AssetFileUpload, alt: '' }),
4665 type === 'image' && React.createElement('img', { className: imageClasses, src: AssetImageUpload, alt: '' }),
4666 React.createElement(
4667 Button$2,
4668 null,
4669 actionTitle
4670 ),
4671 React.createElement(
4672 TextStyle$1,
4673 { variation: 'subdued' },
4674 actionHint
4675 )
4676 ) : null;
4677 const largeView = size === 'large' ? React.createElement(
4678 Stack$1,
4679 { vertical: true, spacing: 'tight' },
4680 type === 'file' && React.createElement('img', { className: imageClasses, src: AssetFileUpload, alt: '' }),
4681 type === 'image' && React.createElement('img', { className: imageClasses, src: AssetImageUpload, alt: '' }),
4682 React.createElement(
4683 Button$2,
4684 { size: 'slim' },
4685 actionTitle
4686 ),
4687 React.createElement(
4688 Caption$1,
4689 null,
4690 React.createElement(
4691 TextStyle$1,
4692 { variation: 'subdued' },
4693 actionHint
4694 )
4695 )
4696 ) : null;
4697 const mediumView = size === 'medium' ? React.createElement(
4698 Stack$1,
4699 { vertical: true, spacing: 'tight' },
4700 React.createElement(
4701 Link$2,
4702 null,
4703 actionTitle
4704 ),
4705 React.createElement(
4706 Caption$1,
4707 null,
4708 React.createElement(
4709 TextStyle$1,
4710 { variation: 'subdued' },
4711 actionHint
4712 )
4713 )
4714 ) : null;
4715 const smallView = size === 'small' ? React.createElement(
4716 Stack$1,
4717 { vertical: true, spacing: 'tight' },
4718 React.createElement(Icon$2, { source: IconDragDrop, color: 'inkLightest' })
4719 ) : null;
4720 return React.createElement(
4721 'div',
4722 { className: styles$36.FileUpload },
4723 smallView,
4724 mediumView,
4725 largeView,
4726 extraLargeView
4727 );
4728 }
4729}
4730var FileUpload$2 = compose$1(withContext$1(Consumer$1), withAppProvider(), withRef$1())(FileUpload$1);
4731
4732var IconAlertCircle = {"viewBox":"0 0 20 20","body":"<path fill-rule=\"evenodd\" d=\"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0m0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8m0-7a1 1 0 0 0 1-1V6a1 1 0 1 0-2 0v4a1 1 0 0 0 1 1m0 1.9a1.1 1.1 0 1 0 0 2.2 1.1 1.1 0 0 0 0-2.2\"/>"};
4733
4734const dragEvents = ['dragover', 'dragenter', 'drop'];
4735function fileAccepted(file, accept) {
4736 return file.type === 'application/x-moz-file' || accepts(file, accept);
4737}
4738function getDataTransferFiles(event) {
4739 if (isDragEvent(event)) {
4740 const dt = event.dataTransfer;
4741 if (dt.files && dt.files.length) {
4742 return Array.from(dt.files);
4743 } else if (dt.items && dt.items.length) {
4744 // Chrome is the only browser that allows to read the file list on drag
4745 // events and uses `items` instead of `files` in this case.
4746 return Array.from(dt.items);
4747 }
4748 } else if (event.target && event.target.files) {
4749 // Return files from even when a file was selected from an upload dialog
4750 return Array.from(event.target.files);
4751 }
4752 return [];
4753}
4754function accepts(file, acceptedFiles) {
4755 if (file && acceptedFiles) {
4756 const fileName = file.name || '';
4757 const mimeType = file.type || '';
4758 const baseMimeType = mimeType.replace(/\/.*$/, '');
4759 const acceptedFilesArray = Array.isArray(acceptedFiles) ? acceptedFiles : acceptedFiles.split(',');
4760 return acceptedFilesArray.some(type => {
4761 const validType = type.trim();
4762 if (validType.charAt(0) === '.') {
4763 return fileName.toLowerCase().endsWith(validType.toLowerCase());
4764 } else if (/\/\*$/.test(validType)) {
4765 // This is something like a image/* mime type
4766 return baseMimeType === validType.replace(/\/.*$/, '');
4767 }
4768 return mimeType === validType;
4769 });
4770 }
4771 return true;
4772}
4773function isDragEvent(event) {
4774 return dragEvents.indexOf(event.type) > 0;
4775}
4776
4777var styles$37 = {
4778 "DropZone": "p_pd",
4779 "hasOutline": "p_q3",
4780 "isDragging": "p_fa",
4781 "isDisabled": "p_o0",
4782 "sizeExtraLarge": "p_ui",
4783 "sizeLarge": "p_u9",
4784 "sizeMedium": "p_k9",
4785 "sizeSmall": "p_qe",
4786 "Container": "p_nq",
4787 "Overlay": "p_c4",
4788 "hasError": "p_v2",
4789};
4790
4791const getUniqueID$3 = other.createUniqueIDFactory('DropZone');
4792class DropZone$1 extends React.Component {
4793 constructor(props) {
4794 super(props);
4795 this.node = null;
4796 this.dropNode = null;
4797 this.dragTargets = [];
4798 const translate = props.polaris.intl.translate,
4799 type = props.type;
4800
4801 const suffix = capitalize(type);
4802 this.state = {
4803 type,
4804 id: props.id || getUniqueID$3(),
4805 size: 'extraLarge',
4806 dragging: false,
4807 error: false,
4808 overlayText: translate(`Polaris.DropZone.overlayText${suffix}`),
4809 errorOverlayText: translate(`Polaris.DropZone.errorOverlayText${suffix}`)
4810 };
4811 }
4812 static getDerivedStateFromProps(nextProps, prevState) {
4813 const id = prevState.id,
4814 error = prevState.error,
4815 type = prevState.type,
4816 overlayText = prevState.overlayText,
4817 errorOverlayText = prevState.errorOverlayText;
4818
4819 const newState = {};
4820 if (nextProps.id != null && id !== nextProps.id) {
4821 newState.id = nextProps.id || id;
4822 }
4823 if (nextProps.error != null && error !== nextProps.error) {
4824 newState.error = nextProps.error;
4825 }
4826 if (nextProps.type != null && type !== nextProps.type) {
4827 newState.type = nextProps.type;
4828 }
4829 if (nextProps.overlayText != null && overlayText !== nextProps.overlayText) {
4830 newState.overlayText = nextProps.overlayText;
4831 }
4832 if (nextProps.errorOverlayText != null && errorOverlayText !== nextProps.errorOverlayText) {
4833 newState.errorOverlayText = nextProps.errorOverlayText;
4834 }
4835 return Object.keys(newState).length ? newState : null;
4836 }
4837 get getContext() {
4838 return {
4839 size: this.state.size,
4840 type: this.state.type || 'file'
4841 };
4842 }
4843 render() {
4844 var _state = this.state;
4845 const id = _state.id,
4846 dragging = _state.dragging,
4847 error = _state.error,
4848 size = _state.size,
4849 overlayText = _state.overlayText,
4850 errorOverlayText = _state.errorOverlayText;
4851 var _props = this.props;
4852 const label = _props.label,
4853 labelAction = _props.labelAction,
4854 labelHidden = _props.labelHidden,
4855 children = _props.children,
4856 disabled = _props.disabled,
4857 outline = _props.outline,
4858 accept = _props.accept,
4859 active = _props.active,
4860 overlay = _props.overlay,
4861 allowMultiple = _props.allowMultiple;
4862
4863 const inputAttributes = {
4864 id,
4865 accept,
4866 disabled,
4867 type: 'file',
4868 multiple: allowMultiple,
4869 ref: this.setInputNode,
4870 onChange: this.handleDrop,
4871 autoComplete: 'off'
4872 };
4873 const classes = styles.classNames(styles$37.DropZone, outline && styles$37.hasOutline, (active || dragging) && styles$37.isDragging, error && styles$37.hasError, size && size === 'extraLarge' && styles$37.sizeExtraLarge, size && size === 'large' && styles$37.sizeLarge, size && size === 'medium' && styles$37.sizeMedium, size && size === 'small' && styles$37.sizeSmall);
4874 const dragOverlay = (active || dragging) && !error && overlay ? React.createElement(
4875 'div',
4876 { className: styles$37.Overlay },
4877 React.createElement(
4878 Stack$1,
4879 { vertical: true, spacing: 'tight' },
4880 React.createElement(Icon$2, { source: IconDragDrop, color: 'blue' }),
4881 size === 'extraLarge' && React.createElement(
4882 DisplayText$1,
4883 { size: 'small', element: 'p' },
4884 overlayText
4885 ),
4886 (size === 'medium' || size === 'large') && React.createElement(
4887 Caption$1,
4888 null,
4889 overlayText
4890 )
4891 )
4892 ) : null;
4893 const dragErrorOverlay = dragging && error ? React.createElement(
4894 'div',
4895 { className: styles$37.Overlay },
4896 React.createElement(
4897 Stack$1,
4898 { vertical: true, spacing: 'tight' },
4899 React.createElement(Icon$2, { source: IconAlertCircle, color: 'red' }),
4900 size === 'extraLarge' && React.createElement(
4901 DisplayText$1,
4902 { size: 'small', element: 'p' },
4903 errorOverlayText
4904 ),
4905 (size === 'medium' || size === 'large') && React.createElement(
4906 Caption$1,
4907 null,
4908 overlayText
4909 )
4910 )
4911 ) : null;
4912 const dropZoneMarkup = React.createElement(
4913 'div',
4914 { ref: this.setNode, className: classes, 'aria-disabled': disabled, onClick: this.handleClick, onDragStart: handleDragStart },
4915 dragOverlay,
4916 dragErrorOverlay,
4917 React.createElement(
4918 'div',
4919 { className: styles$37.Container },
4920 children
4921 ),
4922 React.createElement(
4923 VisuallyHidden$1,
4924 null,
4925 React.createElement('input', inputAttributes)
4926 )
4927 );
4928 const labelledDropzoneMarkup = label ? React.createElement(
4929 Labelled$1,
4930 { id: id, label: label, action: labelAction, labelHidden: labelHidden },
4931 dropZoneMarkup
4932 ) : dropZoneMarkup;
4933 return React.createElement(
4934 Provider$1,
4935 { value: this.getContext },
4936 labelledDropzoneMarkup
4937 );
4938 }
4939 componentDidMount() {
4940 this.dragTargets = [];
4941 // eslint-disable-next-line react/no-did-mount-set-state
4942 this.setState({ error: this.props.error });
4943 if (!this.dropNode) {
4944 return;
4945 }
4946 events.addEventListener(this.dropNode, 'drop', this.handleDrop);
4947 events.addEventListener(this.dropNode, 'dragover', this.handleDragOver);
4948 events.addEventListener(this.dropNode, 'dragenter', this.handleDragEnter);
4949 events.addEventListener(this.dropNode, 'dragleave', this.handleDragLeave);
4950 events.addEventListener(window, 'resize', this.adjustSize);
4951 if (this.props.openFileDialog) {
4952 this.triggerFileDialog();
4953 }
4954 }
4955 componentWillUnmount() {
4956 if (!this.dropNode) {
4957 return;
4958 }
4959 events.removeEventListener(this.dropNode, 'drop', this.handleDrop);
4960 events.removeEventListener(this.dropNode, 'dragover', this.handleDragOver);
4961 events.removeEventListener(this.dropNode, 'dragenter', this.handleDragEnter);
4962 events.removeEventListener(this.dropNode, 'dragleave', this.handleDragLeave);
4963 events.removeEventListener(window, 'resize', this.adjustSize);
4964 }
4965 componentDidUpdate() {
4966 if (this.props.openFileDialog) {
4967 this.triggerFileDialog();
4968 }
4969 }
4970 triggerFileDialog() {
4971 this.open();
4972 if (this.props.onFileDialogClose) {
4973 this.props.onFileDialogClose();
4974 }
4975 }
4976 open() {
4977 if (!this.fileInputNode) {
4978 return;
4979 }
4980 this.fileInputNode.click();
4981 }
4982 adjustSize() {
4983 if (!this.node) {
4984 return;
4985 }
4986 let size = 'extraLarge';
4987 const width = this.node.getBoundingClientRect().width;
4988 if (width < 100) {
4989 size = 'small';
4990 } else if (width < 160) {
4991 size = 'medium';
4992 } else if (width < 300) {
4993 size = 'large';
4994 }
4995 this.setState({ size });
4996 }
4997 getValidatedFiles(files) {
4998 var _props2 = this.props;
4999 const accept = _props2.accept,
5000 allowMultiple = _props2.allowMultiple,
5001 customValidator = _props2.customValidator;
5002
5003 const acceptedFiles = [];
5004 const rejectedFiles = [];
5005 Array.from(files).forEach(file => {
5006 if (!fileAccepted(file, accept) || customValidator && !customValidator(file)) {
5007 rejectedFiles.push(file);
5008 } else {
5009 acceptedFiles.push(file);
5010 }
5011 });
5012 if (!allowMultiple) {
5013 acceptedFiles.splice(1, acceptedFiles.length);
5014 rejectedFiles.push(...acceptedFiles.slice(1));
5015 }
5016 return {
5017 files,
5018 acceptedFiles,
5019 rejectedFiles
5020 };
5021 }
5022 setNode(node) {
5023 const dropOnPage = this.props.dropOnPage;
5024
5025 this.node = node;
5026 this.dropNode = dropOnPage ? document : node;
5027 this.adjustSize();
5028 }
5029 setInputNode(node) {
5030 this.fileInputNode = node;
5031 }
5032 handleClick(event) {
5033 var _props3 = this.props;
5034 const onClick = _props3.onClick,
5035 disabled = _props3.disabled;
5036
5037 if (disabled) {
5038 return;
5039 }
5040 return onClick ? onClick(event) : this.open();
5041 }
5042 handleDrop(event) {
5043 event.preventDefault();
5044 event.stopPropagation();
5045 var _props4 = this.props;
5046 const disabled = _props4.disabled,
5047 onDrop = _props4.onDrop,
5048 onDropAccepted = _props4.onDropAccepted,
5049 onDropRejected = _props4.onDropRejected;
5050
5051 if (disabled) {
5052 return;
5053 }
5054 const fileList = getDataTransferFiles(event);
5055
5056 var _getValidatedFiles = this.getValidatedFiles(fileList);
5057
5058 const files = _getValidatedFiles.files,
5059 acceptedFiles = _getValidatedFiles.acceptedFiles,
5060 rejectedFiles = _getValidatedFiles.rejectedFiles;
5061
5062 this.dragTargets = [];
5063 this.setState({ dragging: false, error: rejectedFiles.length > 0 });
5064 if (onDrop) {
5065 onDrop(files, acceptedFiles, rejectedFiles);
5066 }
5067 if (onDropAccepted && acceptedFiles.length) {
5068 onDropAccepted(acceptedFiles);
5069 }
5070 if (onDropRejected && rejectedFiles.length) {
5071 onDropRejected(rejectedFiles);
5072 }
5073 }
5074 handleDragEnter(event) {
5075 event.preventDefault();
5076 event.stopPropagation();
5077 const dragging = this.state.dragging;
5078 var _props5 = this.props;
5079 const disabled = _props5.disabled,
5080 onDragEnter = _props5.onDragEnter;
5081
5082 if (disabled) {
5083 return;
5084 }
5085 const fileList = getDataTransferFiles(event);
5086 if (event.target && this.dragTargets.indexOf(event.target) === -1) {
5087 this.dragTargets.push(event.target);
5088 }
5089 if (dragging) {
5090 return false;
5091 }
5092
5093 var _getValidatedFiles2 = this.getValidatedFiles(fileList);
5094
5095 const rejectedFiles = _getValidatedFiles2.rejectedFiles;
5096
5097 this.setState({ dragging: true, error: rejectedFiles.length > 0 });
5098 if (onDragEnter) {
5099 onDragEnter();
5100 }
5101 }
5102 handleDragOver(event) {
5103 event.preventDefault();
5104 event.stopPropagation();
5105 var _props6 = this.props;
5106 const disabled = _props6.disabled,
5107 onDragOver = _props6.onDragOver;
5108
5109 if (disabled) {
5110 return;
5111 }
5112 if (onDragOver) {
5113 onDragOver();
5114 }
5115 return false;
5116 }
5117 handleDragLeave(event) {
5118 event.preventDefault();
5119 var _props7 = this.props;
5120 const disabled = _props7.disabled,
5121 onDragLeave = _props7.onDragLeave;
5122
5123 if (disabled) {
5124 return;
5125 }
5126 this.dragTargets = this.dragTargets.filter(el => {
5127 return el !== event.target && this.dropNode && this.dropNode.contains(el);
5128 });
5129 if (this.dragTargets.length > 0) {
5130 return;
5131 }
5132 this.setState({ dragging: false, error: false });
5133 if (onDragLeave) {
5134 onDragLeave();
5135 }
5136 }
5137}
5138DropZone$1.FileUpload = FileUpload$2;
5139DropZone$1.defaultProps = {
5140 type: 'file',
5141 outline: true,
5142 overlay: true,
5143 allowMultiple: true
5144};
5145tslib_1.__decorate([decorators.autobind], DropZone$1.prototype, "triggerFileDialog", null);
5146tslib_1.__decorate([decorators.autobind], DropZone$1.prototype, "open", null);
5147tslib_1.__decorate([decorators.autobind, decorators.debounce(50, { trailing: true })], DropZone$1.prototype, "adjustSize", null);
5148tslib_1.__decorate([decorators.autobind], DropZone$1.prototype, "getValidatedFiles", null);
5149tslib_1.__decorate([decorators.autobind], DropZone$1.prototype, "setNode", null);
5150tslib_1.__decorate([decorators.autobind], DropZone$1.prototype, "setInputNode", null);
5151tslib_1.__decorate([decorators.autobind], DropZone$1.prototype, "handleClick", null);
5152tslib_1.__decorate([decorators.autobind], DropZone$1.prototype, "handleDrop", null);
5153tslib_1.__decorate([decorators.autobind], DropZone$1.prototype, "handleDragEnter", null);
5154tslib_1.__decorate([decorators.autobind], DropZone$1.prototype, "handleDragOver", null);
5155tslib_1.__decorate([decorators.autobind], DropZone$1.prototype, "handleDragLeave", null);
5156function handleDragStart(event) {
5157 event.preventDefault();
5158 event.stopPropagation();
5159}
5160var DropZone$2 = withAppProvider()(DropZone$1);
5161
5162var emptySearch = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNzggMTU4Ij48cGF0aCBkPSJNOS4xOSAxMjkuODRhNDAuMDI5IDQwLjAyOSAwIDAgMS00LjktNy4xNEMtMTMuOTEgODguNTkgNTguMDgtNDEuODggMTM1Ljg1IDE4LjQzYTEwNS45NDYgMTA1Ljk0NiAwIDAgMSA4LjM0IDcuMThjLjMyLjMuNjMuNi45NS45MSA4Ny40OSA4NS04Mi4zIDE2Ni4yOC0xMzUuOTUgMTAzLjMyeiIgZmlsbD0iI2Y0ZjZmOCIvPjxwYXRoIGQ9Ik0xMjIuNiAxMDAuODg1Yy0zLjM2NyA1LjQtNy44MzQgMTAuNzY1LTEzLjY0NiAxMy42MDUtNC4yODcgMi4xLTE0LjQ1MyA5Ljc1LTMxLjcwOSA3LjAzMy03LjU2LTE0LjUyMyA0MC40MzEtMTEuMzIzIDIzLjE0OS0zMi44Ny04LjA3Mi0xMC4wODEgMTMuMzI3LTE0LjEyIDEwLjc0Ny0yMy42MDctMS43NTYtNi40NTItMTIuNTktNy40MS02LjA5My0xOS4yMTYgNC4xNzQtNy41ODktNC45Ny04LjE5NC05LjgzOS0xMC45MTRhOC40MzkgOC40MzkgMCAwIDEtMi45Ni0yLjcxNCAyNS41NCAyNS41NCAwIDAgMSAyLjYyNC40NzJjNC42MDkgMS4xIDkuMzE3IDMuNjI0IDEzLjMyNSA2LjExOSAxMC44ODEgNi43ODcgMTQuODM2IDEzLjQxNCAxNy4yMjEgMTkuNDggNS43NzUgMTQuNzQ5IDUuNzA1IDI4Ljk1MS0yLjgxOSA0Mi42MTJ6IiBmaWxsPSIjZmZmIiBvcGFjaXR5PSIuNCIvPjxwYXRoIGQ9Ik0xMTMuNyAyOC4yMDZjLS4xNTUuMTM2LS4zMTQuMjcyLS40NjkuNDEyLS40NDIuMzktLjg4NS43OS0xLjMzMSAxLjE4NGEyNC4xIDI0LjEgMCAwIDEtMy42NDIgMi44MSAxOS4zMzUgMTkuMzM1IDAgMCAxLTQuNTY5LjkzOGMtMi40MDUtMS41MzItNy43MjMtMS40LTcuNDY2LTQuODc5LjE3LTIuMjg4IDIuMy00Ljg1NiA0LjEzOC02LjM0My4xNjMtLjEzMi4zMjUtLjI1My40OC0uMzY3IDMuNTMyLTIuNTQ5IDguMjYtMi40MjEgMTIuMzQ1LTEuNjYgNC41NTkuODQ3IDMuNjE0IDUuMjM4LjUxNCA3LjkwNXoiIGZpbGw9IiNhZmJhZGQiLz48cGF0aCBkPSJNMTEzLjk2NCAyOC41MDhjLS44MjMuNzIxLTEuNzIgMS4zNzUtMi40ODggMi4xNzktLjk1NS41OTEtMS43IDEuNDQtMi42NDcgMi4wNzdsLS4zNTguMjQ4YTMuMSAzLjEgMCAwIDEtLjQ2NS4yMTIgNC4xNTcgNC4xNTcgMCAwIDEtLjgzOS4xNzggOS44ODEgOS44ODEgMCAwIDAtMS42MjkuNCA5LjIzOCA5LjIzOCAwIDAgMS0xLjcyNS4xNjIuODEzLjgxMyAwIDAgMS0uMjIyLS4wMzYuNDA3LjQwNyAwIDAgMS0uMTMtLjA2NmwtLjAzOS0uMDI3LS4xNTYtLjEwOWE0LjQ3MiA0LjQ3MiAwIDAgMC0uMzQ0LS4xNzkgOC41NTIgOC41NTIgMCAwIDAtLjczMy0uMzA3IDcuMDUxIDcuMDUxIDAgMCAxLTEuNTYxLS40NzggMS44NyAxLjg3IDAgMCAwLS44LS4yMjFjLS4yNzEtLjA2OS0uNTMyLS4xNzItLjgtLjI2OGE3LjgyNSA3LjgyNSAwIDAgMS0xLjU1Mi0uNzUyIDMuNDQ5IDMuNDQ5IDAgMCAxLTEuMjc2LTEuMjg4IDMuOTY3IDMuOTY3IDAgMCAxLS4xNjktMS43ODlBMy4yMzEgMy4yMzEgMCAwIDEgOTYuNSAyNi44YTE3LjkgMTcuOSAwIDAgMSAxLjg1Ni0yLjggMTIuODIzIDEyLjgyMyAwIDAgMSAyLjQ5NC0yLjIyMSA5Ljg5MSA5Ljg5MSAwIDAgMSAyLjk0LTEuNjU5IDEwLjA1IDEwLjA1IDAgMCAxIDEuNjQ0LS40MjhjLjU2MS0uMDgzIDEuMTMtLjA2IDEuNjg2LS4xMjVzMS4xMTktLjExMyAxLjY4LS4xMzZhNS44MzUgNS44MzUgMCAwIDEgMS42NzkuMDg5Yy41NTYuMDY3IDEuMTE3LjA3OCAxLjY3MS4xNThhMTUuNDM0IDE1LjQzNCAwIDAgMSAxLjY0My40MzIgNS43IDUuNyAwIDAgMSAuODM3LjI3NiAzLjE4IDMuMTggMCAwIDEgLjczOS41MDdjLjIxNS4yMS40NzIuMzc0LjY5MS42YTIuMTIyIDIuMTIyIDAgMCAxIC40MjIuODI5IDQuNjc0IDQuNjc0IDAgMCAxIC4wNTEgMS43ODggMy43ODggMy43ODggMCAwIDEtLjUzIDEuNjQ5Yy0uMy40ODktLjU2Ni45OTItLjg4NCAxLjQ3NGE3LjcxNCA3LjcxNCAwIDAgMS0xLjE1NSAxLjI3NXptLS41MjUtLjZhMTEuMjc3IDExLjI3NyAwIDAgMCAxLjExNi0xLjEyMSAzLjYwOSAzLjYwOSAwIDAgMCAuODYyLTEuMzEzYy4xMzktLjUwOC4zNjYtLjk2NC40NzYtMS40NmEyLjIgMi4yIDAgMCAwLS4xODgtMS40MmMtLjEtLjIwOS0uMjIyLS4zODktLjMxNy0uNmExLjExNCAxLjExNCAwIDAgMC0uNDIyLS41NzFjLS4yMTUtLjEyMy0uNDQ3LS4yLS42NjctLjMxNWE1LjQxMSA1LjQxMSAwIDAgMC0uNjg3LS4zMzJjLS40ODQtLjE3My0xLjA3MS0uMDgzLTEuNi0uMjFhMTMuNzQ3IDEzLjc0NyAwIDAgMC0xLjYwOC0uMjcxYy0xLjA4Ny4wMzEtMi4xNjEtLjIwOS0zLjI0Ny0uMTEyYTcuOCA3LjggMCAwIDAtMS41ODIuMzRjLS41MTkuMTIxLTEuMDQuMjI1LTEuNTQ1LjM4OWExMi4zNzEgMTIuMzcxIDAgMCAwLTEuNS41MTkgOCA4IDAgMCAwLTEuNDYuNjcgMTYuMDY0IDE2LjA2NCAwIDAgMC0yLjI2IDIuM2MtLjYzNC44MzktMS41NTMgMS41Ni0xLjc0MiAyLjY1YTUuMzE3IDUuMzE3IDAgMCAxLS40NDIgMS40NjguODc4Ljg3OCAwIDAgMC0uMDExLjcyNWMuMS4yMjcuMjQzLjQuMzMxLjU5M2EyLjczIDIuNzMgMCAwIDAgLjkzMyAxLjAxIDguMjIgOC4yMiAwIDAgMCAxLjQxMS42NjRjLjI0OC4xLjUwOS4xNzQuNzYuMjhhMS42ODYgMS42ODYgMCAwIDAgLjc3LjI5MiA1LjQzMSA1LjQzMSAwIDAgMSAxLjU3NS41NTljLjI2Mi4xLjUyMy4yMTQuNzc4LjM0NGwuMzguMi4xODkuMTA5Yy4xMTkuMDYtLjAzNSAwIC4wNjQuMDE5YTE1Ljg0OCAxNS44NDggMCAwIDAgMS41ODUtLjI0MyA3LjYyNiA3LjYyNiAwIDAgMCAxLjU5NC0uMzgyYy4yNTYtLjEuNTEzLS4xOTEuNzYyLS4yNjZhMi43MjYgMi43MjYgMCAwIDAgLjMyMy0uMWwuMzQ1LS4yQTEwLjUyMyAxMC41MjMgMCAwIDAgMTExIDMwLjE0Yy44NzgtLjY2NiAxLjYxMi0xLjQ5NiAyLjQzOS0yLjI0eiIgZmlsbD0iI2FmYmFkZCIvPjxnIG9wYWNpdHk9Ii40IiBmaWxsPSIjN2I4ZWQwIj48cGF0aCBkPSJNMTEzLjIzMyAyOC42MThjLS40NDIuMzktLjg4NS43OS0xLjMzMSAxLjE4NGEyNC4xIDI0LjEgMCAwIDEtMy42NDIgMi44MSAxOS4zMzUgMTkuMzM1IDAgMCAxLTQuNTY5LjkzOGMtMi40MDUtMS41MzItNy43MjMtMS40LTcuNDY2LTQuODc5LjE3LTIuMjg4IDIuMy00Ljg1NiA0LjEzOC02LjM0M2EyMi42NjggMjIuNjY4IDAgMCAxIDEyLjg3IDYuMjl6Ii8+PHBhdGggZD0iTTExMy42MzIgMjguNjMxYTEzLjYzMSAxMy42MzEgMCAwIDEtMS41IDEuNDE4Yy0uMjQuMTc3LS4zOTIuNDU0LS42MzcuNjI4LS4yMy4xOTEtLjUxNS4zMTYtLjczOS41MTVsLTEuMzU4IDEuMmE4LjMxMyA4LjMxMyAwIDAgMS0uNzM4LjU0MiAxLjUxOCAxLjUxOCAwIDAgMS0uNS4yMTRsLS40NjYuMDkxYTQuNjczIDQuNjczIDAgMCAwLS44NjcuMjc0IDQuMjU5IDQuMjU5IDAgMCAxLS44ODMuMTc1Yy0uNi4wNzItMS4xOS4xMjMtMS44LjIwOGwtLjI0My4wMThoLS4xNDNjLS4wNDItLjAwNi0uMDU5IDAtLjEyMy0uMDEyYS41NDYuNTQ2IDAgMCAxLS4xMzQtLjA1MmwtLjAyNC0uMDFhMy44NzggMy44NzggMCAwIDAtLjM4My0uMTU0IDMgMyAwIDAgMS0uNzQ1LS40MDhjLS41NjYtLjEyMy0xLjExMi0uMzI2LTEuNjc3LS41MDdsLTEuNy0uNTdjLS42LS4xNDQtMS4wMzMtLjY2Ni0xLjYxOC0uODgxYTIuMjY3IDIuMjY3IDAgMCAxLTEuMTI1LTEuNDg3IDMuMTM3IDMuMTM3IDAgMCAxLS4wOTMtMS44NDMgNi4zNzMgNi4zNzMgMCAwIDEgLjY2NC0xLjY5Yy4zMTctLjUxNC42MjUtMS4wMjUuOTMzLTEuNTQ2YTkuNyA5LjcgMCAwIDEgMi40MDctMi43bC4wNTYtLjA0MWEuMjQyLjI0MiAwIDAgMSAuMjEtLjAzN2MxLjE5My4zNTIgMi40ODMuMjI3IDMuNjQuNzI2LjU3NS4yMjggMS4yLjMwNiAxLjc2LjU5YTkuMDQ2IDkuMDQ2IDAgMCAwIC44MDguNDY2Yy4yNzguMTMxLjU3NC4yMjYuODQ2LjM3MWEzLjczNyAzLjczNyAwIDAgMCAuOC40NiAyLjQxNSAyLjQxNSAwIDAgMSAuODI3LjQxNCAxMS4zIDExLjMgMCAwIDAgMS41MjkgMS4wMzhjLjU1Ny4yODQuOTE4LjgyNSAxLjQ2NCAxLjEyNi4yNTEuMTc5LjUxOC4zNDQuNzUyLjU0N2E0LjE0MyA0LjE0MyAwIDAgMSAuOC45MTd6bS0uOC0uMDI2YTEuMjI3IDEuMjI3IDAgMCAxLS41MjYtLjMyM2MtLjIyOC0uMTkxLS40MTktLjQyNS0uNjM1LS42MzQtLjQtLjQ1Ny0xLjAzNy0uNjEyLTEuNDY4LTEuMDI5YTQuOTQxIDQuOTQxIDAgMCAwLTEuNTQzLS45MDYgMS44OTEgMS44OTEgMCAwIDEtLjc0LS41MDggMi40MDggMi40MDggMCAwIDAtLjgxMy0uMzc2Yy0uMjc3LS4xMTEtLjUwNS0uMzI2LS43NzQtLjQ1OGE1LjE1MyA1LjE1MyAwIDAgMC0uODU5LS4yNjdjLS41Ny0uMTc0LTEuMDgtLjUxOC0xLjY2Mi0uNjY2LTEuMTY2LS4yMTQtMi4yNy0uODQ3LTMuNS0uNjlsLjMxMi0uMDkxYy0uODIxLjgtMS42NSAxLjU4OC0yLjQ1MiAyLjQyN2EzLjIzNiAzLjIzNiAwIDAgMC0uOTUyIDEuNDM0IDkuNDA3IDkuNDA3IDAgMCAwLS41IDEuNiAzLjY3NCAzLjY3NCAwIDAgMC0uMDg0IDEuNTYzYy4yMTEuNTIxLjc5My42MDcgMS4wNzYgMS4wODlhLjg1MS44NTEgMCAwIDAgLjcxNy40IDIuMjg4IDIuMjg4IDAgMCAxIC44Mi4yMzIgMTEuMzQgMTEuMzQgMCAwIDAgMS42NDQuNiA3LjQ0NCA3LjQ0NCAwIDAgMSAxLjY3Ny42NyAyLjA4NSAyLjA4NSAwIDAgMSAuODY3LjMyN2MuMTMuMDkuMjU4LjE4Ny4zODIuMjg3LS4xLS4wMTctLjAyMy4wMDcuMDQzIDBsLjItLjAwOWExMS4yODEgMTEuMjgxIDAgMCAwIDEuNzI5LS4yNzggMTUuMjQ4IDE1LjI0OCAwIDAgMCAxLjcwOS0uNDA4Yy4xMzQtLjA1Ni4yNjktLjExLjM5MS0uMTc0YTIuNTM3IDIuNTM3IDAgMCAwIC4zMTctLjJjLjI0OS0uMTQ2LjUtLjI4OS43NDUtLjQ0Ny40ODktLjMxNC45NzMtLjY0NSAxLjQzNS0xLjAwNy4yMjktLjE4NS40LS40MzkuNjEzLS42MzlzLjQ4LS4zNDYuNjg1LS41NTlhNi45MTMgNi45MTMgMCAwIDEgMS4xNDctLjk2NXoiLz48L2c+PHBhdGggZD0iTTExNC44IDYyLjc5MWMuMDY5IDIxLjQ3OC0xMi4xODEgMTguODQyLTMxLjUgMzUuMTg3LTEyLjg3NiAxMC44OTMtMjIuNyA2LjQ3Ny0yNC4yNDYtLjczOGE5LjY0OCA5LjY0OCAwIDAgMS0uMi0yLjUyNEM1OS4xMTQgODkuNDEgNjMuNiA4My40NDQgNzQgODAuOTI1IDg0LjgzNyA3OC4zIDgwLjggNTkuNyA5OS42NDUgNTEuNGMuNDQ2LS4yLjktLjM4NiAxLjM3NC0uNTcxLjIwNi0uMDgyLjQwOC0uMTU1LjYwNS0uMjI3IDkuMzM1LTMuMzcgMTMuMTQ2IDEuODM2IDEzLjE3NiAxMi4xODl6IiBmaWxsPSIjZmZiZjRkIi8+PHBhdGggZD0iTTExNSA2Mi43OWEzMy44NTMgMzMuODUzIDAgMCAxLTEuNDU0IDEwLjUgMTYuOTU0IDE2Ljk1NCAwIDAgMS0yLjQ3OSA0LjcxbC0uODIxIDEuMDU5Yy0uMjgxLjM0Ni0uNjIxLjYzOC0uOTI5Ljk2cy0uNjI3LjYzNC0uOTUyLjkzOWwtMS4wMzUuODRhODYuMTMyIDg2LjEzMiAwIDAgMS04Ljg2MSA1LjgxN2MtMy4wMjUgMS44MDktNS45OSAzLjcwNi04Ljg1OCA1Ljc0NS0yLjg5MSAyLjAyMS01LjUzOSA0LjMxLTguMzcyIDYuNDU2YTI0LjY4NCAyNC42ODQgMCAwIDEtOS41NCA0LjU0NGwtMS4zMTUuMjM2LTEuMzM2LjA3MmE3LjI3IDcuMjcgMCAwIDEtMS4zMzYtLjA0NyA2LjUgNi41IDAgMCAxLTEuMzI0LS4xODUgOS4zMjIgOS4zMjIgMCAwIDEtNy4yLTEyLjIyMSAxNC44IDE0LjggMCAwIDEgNi41ODEtOC4wODYgMjYuMzE1IDI2LjMxNSAwIDAgMSA0Ljc3Ny0yLjMwOGMxLjY0NS0uNjUxIDMuNDQxLS45MiA1LjAyMi0xLjZhOS41NzggOS41NzggMCAwIDAgMy44NjEtMy40IDI4LjMxNSAyOC4zMTUgMCAwIDAgMi40ODQtNC42MjEgODIuMTI5IDgyLjEyOSAwIDAgMSA0LjU4Ny05LjU0OCAyNy43IDI3LjcgMCAwIDEgNy4wMjktNy45MTVBMzAuNzA5IDMwLjcwOSAwIDAgMSAxMDMgNDkuOTkzYTEyLjA0MiAxMi4wNDIgMCAwIDEgNS4zLS40MDcgNi42IDYuNiAwIDAgMSA0LjM4OCAyLjkxOCAxMy41MjUgMTMuNTI1IDAgMCAxIDEuODcyIDQuOTg4IDM0LjAzNCAzNC4wMzQgMCAwIDEgLjQ0IDUuMjk4em0tLjQgMGEzMy42NTEgMzMuNjUxIDAgMCAwLS40MzYtNS4yMjggMTMuMTQxIDEzLjE0MSAwIDAgMC0xLjgwOC00LjgzOCA2LjIgNi4yIDAgMCAwLTQuMTM1LTIuNzUzIDExLjU0NiAxMS41NDYgMCAwIDAtNS4xMTUuNCAzMC43ODcgMzAuNzg3IDAgMCAwLTkuMzM0IDQuNjgxIDI3LjM3IDI3LjM3IDAgMCAwLTYuOTQyIDcuNzk1IDgxLjg3NSA4MS44NzUgMCAwIDAtNC41ODcgOS41IDI4LjY0NCAyOC42NDQgMCAwIDEtMi41MjYgNC42OCA5LjkzMSA5LjkzMSAwIDAgMS00LjAwOCAzLjUwOWMtMS42ODIuNzE3LTMuNDE0Ljk1OS01LjA1MSAxLjZhMjUuOTg3IDI1Ljk4NyAwIDAgMC00LjcxNyAyLjI2OCAxNC40MDYgMTQuNDA2IDAgMCAwLTYuNDUxIDcuOSA5LjI0MiA5LjI0MiAwIDAgMCAyLjQxIDkuNDk2IDkuMTM1IDkuMTM1IDAgMCAwIDQuNTY3IDIuMjM4IDYuMTcgNi4xNyAwIDAgMCAxLjI3OC4xNzEgNy40NDMgNy40NDMgMCAwIDAgMS4yOTIuMDQ3bDEuMy0uMDY0IDEuMjgyLS4yMjVhMjQuMzEgMjQuMzEgMCAwIDAgOS40MDktNC40MzRjMi43ODktMi4xMTQgNS40NDMtNC40OTMgOC4zNTYtNi40ODUgMi44OC0yLjA0NCA1Ljg2NC0zLjkzOCA4Ljg4OC01Ljc1MWE5MC4wMDcgOTAuMDA3IDAgMCAwIDguNzk1LTUuODIxbDEuMDIxLS44MjcuOTMzLS45MmMuMy0uMzE1LjYzNy0uNi45MTItLjkzOWwuOC0xLjAzNGExNi41NDEgMTYuNTQxIDAgMCAwIDIuNDI5LTQuNiAzMy40NzEgMzMuNDcxIDAgMCAwIDEuNDM4LTEwLjM2NXpNNTkuMzEzIDg3LjVhMy4yMTYgMy4yMTYgMCAwIDEgLjc2OC0xLjA4MmwuMTI1LS4xMTFjLjA1Ni0uMDI1LjEzLS4wMzQuMTU2LS4wODRsLjIzMy0uMjM0Yy4xNDgtLjE2My4zOTEtLjIzNC41NDQtLjM4OGwuODM3LTEuMDIzYTEuMjYyIDEuMjYyIDAgMCAxIC41MzMtLjM4OCAzLjkzMiAzLjkzMiAwIDAgMCAuNDc4LS40NTZsLjQ4LjY0Yy0uMTU2LjE0Mi0uMy4zLS40Ni40MzNzLS40LjE3Ni0uNTI2LjM1MWMtLjMwOS4yODQtLjYxMy41NzMtLjg5Mi44ODUtLjEyOC4xNjgtLjE5LjM5NC0uMzc5LjUtLjA5My4wNTYtLjIxNy4wODUtLjMwNy4xNDYtLjA2NS4wMTMtLjA2OC4wOC0uMDkuMTI5bC0uMTMzLjA5M2EuOTI4LjkyOCAwIDAgMC0uMjQ5LjJjLS4wNTcuMDg5LS4wNDQuMjMyLS4xMTcuMzA4LS4xMTcuMTc0LS4yMDguMzY1LS4zMzguNTI4eiIgZmlsbD0iI2ZmYmY0ZCIvPjxwYXRoIGQ9Ik02Ni40IDgxLjY1NWEyOS43NjggMjkuNzY4IDAgMCAxIDUuNzIzLTIuMTU1IDkuMDU1IDkuMDU1IDAgMCAwIDQuOTEyLTIuODA4IDEyLjU2NiAxMi41NjYgMCAwIDAgLjkxNi0xLjEzNSA5LjQ1NyA5LjQ1NyAwIDAgMCAuODQ2LTEuMjExIDMzLjY3IDMzLjY3IDAgMCAwIDEuMzc2LTIuNjQ5bDIuNTcyLTUuNDU5YTM1LjEyNCAzNS4xMjQgMCAwIDEgNi41Mi0xMC4yMDggMjIuMjg0IDIyLjI4NCAwIDAgMSA0Ljc4Mi0zLjc5IDM1LjMzNSAzNS4zMzUgMCAwIDEgNS40MDktMi44MTNsLjI5NC43NDRhMzIuNTE0IDMyLjUxNCAwIDAgMC01LjI3NSAyLjc0MiAyNC43MzIgMjQuNzMyIDAgMCAwLTQuNjY0IDMuNjU3IDMzLjM1OSAzMy4zNTkgMCAwIDAtNi40OSA5LjkzNGMtLjgxNSAxLjgyOC0xLjQ5IDMuNzIzLTIuNDA4IDUuNTM2YTI5LjU3NyAyOS41NzcgMCAwIDEtMS41IDIuNjY1Yy0uMy40Mi0uNTI3Ljg3Ny0uODE4IDEuM2ExMS43MTEgMTEuNzExIDAgMCAxLS45ODUgMS4yIDEwLjAyMyAxMC4wMjMgMCAwIDEtMi40MjYgMS45MyAxMC43IDEwLjcgMCAwIDEtMS4zODcuNzE1IDEzLjQ5MSAxMy40OTEgMCAwIDEtMS40NzEuNDYxIDI4Ljk0MyAyOC45NDMgMCAwIDAtNS41NzcgMi4wNjJ6IiBmaWxsPSIjZmZiZjRkIi8+PHBhdGggZD0iTTExNC44IDYyLjc5MWMuMDY5IDIxLjQ3OC0xMi4xODEgMTguODQyLTMxLjUgMzUuMTg3LTEyLjg3NiAxMC44OTMtMjIuNyA2LjQ3Ny0yNC4yNDYtLjczOGE5LjY0OCA5LjY0OCAwIDAgMS0uMi0yLjUyNCAxOS41MTMgMTkuNTEzIDAgMCAxIDguNDY0LTMuOTgzYzQuMzgyLS42IDguOTc1LS4yNTggMTMuMzc4LTEuMTQyIDguMzg3LTEuNjgyIDE5LjA4Ny0xMC4zNjUgMTcuMzE0LTE5LjkzNy0uODcxLTQuNy0yLjQxMi04LjY3NC0uNy0xMy40NTFhMjMuMDA5IDIzLjAwOSAwIDAgMSAyLjMzNS00LjhjLjQ0Ni0uMi45LS4zODYgMS4zNzQtLjU3MS4yMDYtLjA4Mi40MDgtLjE1NS42MDUtLjIyNyA5LjMzNS0zLjM3MyAxMy4xNDYgMS44MzMgMTMuMTc2IDEyLjE4NnoiIGZpbGw9IiNmZmFhMTAiIHN0cm9rZT0iI2ZmYWExMCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIuNSIvPjxwYXRoIGQ9Ik0zOC4xMTMgODQuNjU5YTE3LjI2NSAxNy4yNjUgMCAwIDEtMy4yMDcgMy42MTYgMjkuMyAyOS4zIDAgMCAxLTMuNjcyIDIuNzA4IDEyLjE3MiAxMi4xNzIgMCAwIDEtMS41MTMuODEzYy0zLjU4OSAxLjY0NS03LjczOCAxLjc4NS0xMS4wOTMgMy45OS0yLjY1MSAxLjc0NC00LjU3MyA1LjE3OC04LjE4MSA0Ljg5LTMuNTU1LS4yODQtNS4yNzYtMy40MjMtNC4yNTUtNi42NTMgMS4zOTItNC40MjUgNy40NzctMy45MTUgMTAuNjItNi41MjhhNDEuODIxIDQxLjgyMSAwIDAgMCA0LjUtNC44NzFjLjMxOC0uMzc0LjY1MS0uNzQ1Ljk4LTEuMWExMy42NzMgMTMuNjczIDAgMCAxIDQuNTI3LTMuNDggOC4wMzYgOC4wMzYgMCAwIDEgMS42OTQtLjUzYzQuMTU0LS44MTQgMTMuNTY0Ljk3NiA5LjYgNy4xNDV6IiBmaWxsPSIjYWZiYWRkIi8+PHBhdGggZD0iTTM4LjQ0OSA4NC44NzVhMjEuMjE4IDIxLjIxOCAwIDAgMS0zLjcxIDQuMDI5IDQyLjQ4OSA0Mi40ODkgMCAwIDEtNC41IDMuMTEyIDkuOTc1IDkuOTc1IDAgMCAxLTIuNTYgMS4wMDhjLS44ODguMjEtMS43MzYuNTI2LTIuNi43NzdhMjUuMzkxIDI1LjM5MSAwIDAgMC01LjA1IDEuNTg3IDkuMzE2IDkuMzE2IDAgMCAwLTIuMTI5IDEuNDc3cS0uNTMuMzg4LTEuMDU1LjgwOGMtLjM0Ny4yODMtLjU5MS42NzktLjk0OS45NjJhMTIuNTQyIDEyLjU0MiAwIDAgMS0yLjIyOCAxLjY0MiA1Ljc2OCA1Ljc2OCAwIDAgMS0yLjczLjc0MiA0LjkgNC45IDAgMCAxLTIuNzE5LS43MDkgNi41NjIgNi41NjIgMCAwIDEtMS4xLS44NzcgNC41NzkgNC41NzkgMCAwIDEtLjg5NS0xLjA5NSA0Ljk5MSA0Ljk5MSAwIDAgMS0uNDc5LTIuNzM4IDYuODYxIDYuODYxIDAgMCAxIC43MjUtMi42NUE1LjA1MyA1LjA1MyAwIDAgMSA4LjQwOCA5MWExMS43IDExLjcgMCAwIDEgMi40OS0xLjEgMjIuOTcyIDIyLjk3MiAwIDAgMCA0LjktMi4wNjcgMTAuNCAxMC40IDAgMCAwIDEuOTU4LTEuNzExYy41ODUtLjY1OSAxLjIzOS0xLjI2NSAxLjgyOC0xLjkzOSAxLjItMS4zMjEgMi4xODUtMi44NTkgMy41NDItNC4xMDdhMjUuNjQ5IDI1LjY0OSAwIDAgMSAyLjE3NC0xLjcyMiA2Ljg4IDYuODggMCAwIDEgMi41OTMtMS4wNDMgOS4yMDggOS4yMDggMCAwIDEgMi43NTEtLjMgMjIuNiAyMi42IDAgMCAxIDIuNzM4LjE5IDE2LjU1NSAxNi41NTUgMCAwIDEgMi42MjguODIxIDUuNTE4IDUuNTE4IDAgMCAxIDIuMzYyIDEuNDg5IDMuOTg2IDMuOTg2IDAgMCAxIDEuMDIxIDIuNjc3IDUuNTg3IDUuNTg3IDAgMCAxLS45NDQgMi42ODd6bS0uNjczLS40MzNhNS41ODUgNS41ODUgMCAwIDAgLjkwNS0yLjMgMi43MDkgMi43MDkgMCAwIDAtLjExLTEuMTgyIDIuNjU0IDIuNjU0IDAgMCAwLS42OS0uOTgyIDguNzY5IDguNzY5IDAgMCAwLTIuMTA4LTEuMzYzIDEwLjU0OSAxMC41NDkgMCAwIDAtMi41MzQtLjU3MyAxMi4yNTggMTIuMjU4IDAgMCAwLTUuMTY2LS4wNTEgMTUuNjEgMTUuNjEgMCAwIDAtMi4zMTkgMS4xIDguNDgzIDguNDgzIDAgMCAwLTIuMDYzIDEuNTg4IDQzLjg1NiA0My44NTYgMCAwIDAtMy42MTMgMy45MjEgMTQuOTU4IDE0Ljk1OCAwIDAgMS0xLjcyMiAyLjExMSA5LjgxMyA5LjgxMyAwIDAgMS0yLjE3MyAxLjc2MWMtMS42MzYgMS4wMDctMy41MTYgMS4wODktNS4xMzggMS44MzZDOS40MjYgOTEgNy44MTEgOTEuOCA2Ljk3IDkzLjIzOGE0LjQwOSA0LjQwOSAwIDAgMC0uNzM5IDIuMzg1IDUuMjIzIDUuMjIzIDAgMCAwIC42ODYgMi4zNDcgNC45MzYgNC45MzYgMCAwIDAgLjU4MyAxLjA3NyAyLjQxMSAyLjQxMSAwIDAgMCAxLjA0MS42NTYgOC45IDguOSAwIDAgMCAyLjM4NS40OTRjMS42NjYuMDg4IDMuMTI0LTEuMDA1IDQuNDMtMi4xNTguMzEtLjMxNS43MzMtLjUxOSAxLjA1MS0uODM4cy42MzctLjY0NS45NzEtLjk2YTEyLjI4NSAxMi4yODUgMCAwIDEgMi4zNzQtMS40MTVjMy4zMDktMS41OSA3LjAyNi0xLjg1OCAxMC4xNDUtMy41MWwxLjE2OS0uNTk1cS41NzItLjM0NSAxLjEzMS0uNzA5YTEyLjY1MiAxMi42NTIgMCAwIDAgMi4wOTEtMS42NDUgMTkgMTkgMCAwIDAgMS45MjItMS44MiAxNy42ODQgMTcuNjg0IDAgMCAwIDEuNTY2LTIuMTA1eiIgZmlsbD0iI2FmYmFkZCIvPjxnIG9wYWNpdHk9Ii40IiBmaWxsPSIjN2I4ZWQwIj48cGF0aCBkPSJNMzguMTEzIDg0LjY1OWExNy4yNjUgMTcuMjY1IDAgMCAxLTMuMjA3IDMuNjE2IDI5LjMgMjkuMyAwIDAgMS0zLjY3MiAyLjcwOCAxMi4xNzIgMTIuMTcyIDAgMCAxLTEuNTEzLjgxM2MtLjIxOS0zLjI4My4zNjMtNi4zODgtLjkxNS05Ljc2NmEyNy4wMTggMjcuMDE4IDAgMCAwLTEuOTgyLTMuOTkgOC4wMzYgOC4wMzYgMCAwIDEgMS42OTQtLjUzYzQuMTQ5LS44MSAxMy41NTkuOTggOS41OTUgNy4xNDl6Ii8+PHBhdGggZD0iTTM4LjQ0OSA4NC44NzVBOS43NTQgOS43NTQgMCAwIDEgMzcuNTc1IDg2Yy0uMzQ5LjMyNC0uNTI2LjgtLjkxNSAxLjA4OC0uNzY4LjU2OS0xLjI5MiAxLjM3Ny0yLjAwNSAyLjAwNWE1LjgyNiA1LjgyNiAwIDAgMS0xLjE1My44MjJjLS40LjI1Mi0uNy42NDQtMS4xMTEuODczLS43OTEuNS0xLjcuODQ2LTIuNTI0IDEuMzI1YS4zMjkuMzI5IDAgMCAxLS40OTItLjI0MWwtLjAwNy0uMDU3YTYuODYxIDYuODYxIDAgMCAxLS4xMTctLjkwNSA0LjkgNC45IDAgMCAwIC4wNzgtLjkwNiAzLjAxIDMuMDEgMCAwIDEtLjA0NC0uOWwuMDI3LS44OTRhMTYuODMyIDE2LjgzMiAwIDAgMC0uMDA3LTEuNzc0Yy0uMDkxLS41NzkuMTQ2LTEuMTk0LS4wNTYtMS43NjRhMTEuMTE0IDExLjExNCAwIDAgMS0uMzEyLTEuNzM2IDkuMDY3IDkuMDY3IDAgMCAwLS42NDgtMS42NDUgMjYuOTkyIDI2Ljk5MiAwIDAgMC0uNzU0LTEuNjA4IDcuNTI4IDcuNTI4IDAgMCAwLS44OTMtMS41NDMuMTg3LjE4NyAwIDAgMSAuMDM3LS4yNjJsLjAyLS4wMTMuMDQtLjAyMmE2Ljg2NyA2Ljg2NyAwIDAgMSA0LjM0LS44MDggMTYuMzQxIDE2LjM0MSAwIDAgMSAyLjIyMS4wNjVjLjcuMjY0IDEuNDc3LjIzMiAyLjE3Mi41NDdhOC41MjYgOC41MjYgMCAwIDAgMS4wMDcuNTE3Yy4xNzQuMDczLjM0NS4xNTIuNTE2LjIzNWE0LjMwOCA0LjMwOCAwIDAgMSAuNDUzLjM0OWMuMjc1LjI1Ny43LjM0OS45MzQuNjgxYTMuODE2IDMuODE2IDAgMCAxIC42MDYgMS4wMTIgNC41NTggNC41NTggMCAwIDEgLjM3NCAxLjEyNSAzLjI3NCAzLjI3NCAwIDAgMS0uMTMyIDEuMTY0IDYuNjYgNi42NiAwIDAgMS0uMjY2IDEuMTI0IDguOTkyIDguOTkyIDAgMCAxLS41MTUgMS4wMjF6bS0uNjczLS40MzNhOC4yMjMgOC4yMjMgMCAwIDAgLjUtLjkgMy4zIDMuMyAwIDAgMCAuMzkxLS45MzEgNS4wMjQgNS4wMjQgMCAwIDAtLjAzOC0uOTcxIDEuODEyIDEuODEyIDAgMCAwLS4yMTctLjkxMiAyLjcxOCAyLjcxOCAwIDAgMC0uNjUtLjdjLS4yNDctLjE4OS0uMzU5LS41ODItLjY4My0uNzIyYTIuOTU1IDIuOTU1IDAgMCAxLS44OTQtLjUgMi40MzIgMi40MzIgMCAwIDAtLjk5MS0uMzIyIDcuNDY0IDcuNDY0IDAgMCAwLTIuMDMxLS41MzEgMTMuMzUzIDEzLjM1MyAwIDAgMC0yLjEtLjMwNyA1LjUgNS41IDAgMCAwLTEuMDU1LjE0OWMtLjM0Ny4wNTktLjY5My4wNjYtMS4wMzMuMTE5YTE2LjQ3NCAxNi40NzQgMCAwIDAtMi4wMTcuNDMxbC4xNTMtLjQ3YTUuNzE3IDUuNzE3IDAgMCAwIC44NzUgMS41NzkgMTIuMjE5IDEyLjIxOSAwIDAgMSAuODcgMS42Yy4yNy41NDkuMjk0IDEuMTk0LjU0MSAxLjc1Ni4yMjQuNTY0LjY1MiAxLjEyNC40NjggMS43NzktLjEyNi42MjkuMzg2IDEuMTkyLjI5MiAxLjgxNi0uMDE3LjYxMi0uMDQ1IDEuMjE1LS4wNDIgMS44MTVsLS4wMjMuOUEyLjk1MiAyLjk1MiAwIDAgMSAzMCA5MGEzLjM0NSAzLjM0NSAwIDAgMCAuMDcuODg1YzAgLjI5NS0uMDM5LjU5LS4wNTYuODg3bC0uNDEzLS4yNDdhMTMuMjQ3IDEzLjI0NyAwIDAgMCAyLjM3OC0xLjM0OSAxMS4zNTkgMTEuMzU5IDAgMCAwIDEuMTI5LS43OTMgOS4zMjQgOS4zMjQgMCAwIDEgMS4wMzItLjkxNGMuMzY0LS4yNzYuNzI1LS41NjMgMS4wNzQtLjg1OGEzLjk4MyAzLjk4MyAwIDAgMCAuOTQ1LS45OTNjLjI0NS0uMzkxLjY2MS0uNjMyLjg4Ni0xLjAzNy4yNDYtLjM4MS41MDQtLjc1LjczMS0xLjEzOXoiLz48L2c+PHBhdGggZD0iTTE0NC4xOSAyNS42MWEuMjQ5LjI0OSAwIDAgMS0uMDcuMDQgNDAuNTIxIDQwLjUyMSAwIDAgMC01LjQ5IDMuMDdjLTMuMSAyLjMyLTMuOTggOC4wNS04LjM2IDguMzYtMy4yMS4yMi01LjcyLTIuMDYtNS4yLTUuNC41My0zLjM5IDQuMTItNC40IDYuMzItNi40NiAyLjAyLTEuOSAzLjEyLTQuNDIgNC40Ni02Ljc5YTEwNS45NDYgMTA1Ljk0NiAwIDAgMSA4LjM0IDcuMTh6IiBmaWxsPSIjYWZiYWRkIi8+PHBhdGggZD0iTTExNy44NTUgMzcuMDMzYTUwLjkzNiA1MC45MzYgMCAxIDAgNC4yNjUgNzEuOTA4IDUwLjY3MSA1MC42NzEgMCAwIDAtNC4yNjUtNzEuOTA4em05LjcgNDkuNjM4Yy0yLjE3NiA2Ljg5Mi01LjE3NSAxMy4yOTUtMTAuMDEyIDE4Ljc0Mi00LjIyNSA0Ljc1My05LjUzMyA5LjMtMTUuNzM5IDExLjExOS0zLjk3OCAxLjE3LTguMDIgMi45NjYtMTIuMTM0IDMuNjA3YTQ1LjMyOCA0NS4zMjggMCAwIDEtOC43OTMuMjEyIDQ0LjUxNiA0NC41MTYgMCAwIDEtMjYuOTY3LTExLjE2NGMtOC43LTcuNzI5LTEyLjk0My0xNy4zNzktMTQuNDQ2LTI4LjYxNmEzNy4yIDM3LjIgMCAwIDEtLjE3NS0xMC41NjRjMS4yMjUtOC40OSA1LjE0Ni0xOC4wMzYgMTAuODQ3LTI0LjQ1MyA5LjktMTEuMTUyIDI3LjgxNy0xOC43MzUgNDIuNjg2LTE0LjYzOWE3MC42NzQgNzAuNjc0IDAgMCAxIDguODQgMi41OTRjNC4zNiAxLjg2MyA4LjU3NyA1LjEzOCAxMi4xMDcgOC4yNzFhNDcuOTQzIDQ3Ljk0MyAwIDAgMSA5LjE4NyAxMC42MzYgMjguMTU1IDI4LjE1NSAwIDAgMSAyLjA2NSAzLjYwOCAzOC41IDM4LjUgMCAwIDEgMi40NTEgNy44NTNjMS40NzIgNy4wNzcgMi4yOTQgMTUuNzk5LjA4NyAyMi43OTR6IiBmaWxsPSIjZmZmIi8+PHBhdGggZD0iTTEyMy4zIDEwOS45ODZhNTEuNTU0IDUxLjU1NCAwIDAgMS0xNi4zNjYgMTIuMzA2Yy0xLjU2Ni43LTMuMiAxLjIzMS00Ljc2OSAxLjkyMmwtNC44NjUgMS42NzhjLTEuNjU3LjQ0MS0zLjMzNy44MTQtNS4wMTMgMS4yMjhsLTUuMTI2Ljc0MWE0OS41NTMgNDkuNTUzIDAgMCAxLTIwLjQxNC0yLjg0MyA1My44IDUzLjggMCAwIDEtMTcuNjY3LTEwLjU0NmwtMy42NjMtMy42MzljLTEuMTI1LTEuMy0yLjItMi42NDktMy4yOS0zLjk3Ny0uOTk1LTEuNC0xLjktMi44NzEtMi44NDQtNC4zLS44NTUtMS40ODgtMS42LTMuMDM4LTIuNDA2LTQuNTUyLS43LTEuNTYzLTEuMy0zLjE3Ni0xLjk0Ni00Ljc1OS0uNTM2LTEuNjI1LS45NzgtMy4yODItMS40NjgtNC45Mi0uMzY4LTEuNjctLjYzNC0zLjM2Mi0uOTQ1LTUuMDM4bC0uNDQzLTUuMWMuMDI5LTEuNy4wMTMtMy40MDYgMC01LjEwNi4xNTMtMS42OTQuMjU2LTMuMzk0LjQzMy01LjA4NS4zLTEuNjc1LjU4Ni0zLjM1Ni45NjQtNS4wMTIuNDk0LTEuNjI4LjkyNC0zLjI3NyAxLjQ3NC00Ljg4NC42NTYtMS41NjkgMS4yNTktMy4xNiAxLjk3Ni00LjcuODE1LTEuNDkgMS41NTUtMy4wMiAyLjQwOS00LjQ4Mi45NTctMS40IDEuODIxLTIuODYxIDIuNzczLTQuMjYzbDMuMTQ2LTRhNTEuMzg0IDUxLjM4NCAwIDAgMSAxNi4xNzMtMTIuMTMzIDUzLjA0IDUzLjA0IDAgMCAxIDQuNjgtMS45NzcgODEuMTkgODEuMTkgMCAwIDEgNC44LTEuNjg5IDQ2LjYwOCA0Ni42MDggMCAwIDEgNC45NjEtMS4yMiA1Mi41MTIgNTIuNTEyIDAgMCAxIDUuMDgyLS42IDUyLjQ2NyA1Mi40NjcgMCAwIDEgMzcuOTg1IDEyLjc3MmwzLjYyMSAzLjY2OWMxLjExMyAxLjMwNyAyLjE2NSAyLjY2NiAzLjI0NSA0IC45OTMgMS40IDEuODg5IDIuODYyIDIuODMzIDQuMjg5Ljg2NSAxLjQ3NSAxLjY1NiAzIDIuNDg1IDQuNS43MzYgMS41NDQgMS4zNiAzLjE0MyAyLjA0MyA0LjcxNS41NzIgMS42MTMgMS4wNDUgMy4yNjMgMS41NyA0LjkuNCAxLjY2Ni43MjMgMy4zNTEgMS4wODQgNS4wMjguMjM1IDEuNy4zNjIgMy40MTMuNTA3IDUuMTE4bC0uMDYxIDUuMTM2LS41NDkgNS4xYy0uMzExIDEuNjc3LS41NzEgMy4zNjgtLjkyOSA1LjAzNS0uNDgxIDEuNjM4LS44OCAzLjMtMS4zOTMgNC45MzFhNTIuMzI2IDUyLjMyNiAwIDAgMS0xMC4wODcgMTcuNzU3em0tMi4zNTUtMi4wOTFhNDkuNTgxIDQ5LjU4MSAwIDAgMCA5LjYzNC0xNi42NTVjLjUtMS41MzEuODgxLTMuMSAxLjMzMS00LjY0NS4zMzQtMS41NzQuNTczLTMuMTcuODY5LTQuNzUxLjE1LTEuNi4xODctMy4yMTYuMjktNC44MTZsLS4xNjktNC44MWMtLjIyLTEuNTktLjQxNi0zLjE3Ni0uNTY4LTQuNzctLjMxOC0xLjU2Ny0uNTk1LTMuMTQ2LS45MzktNC43MS0uNDY4LTEuNTMxLS44OTQtMy4wNzctMS4zODctNC42LS42MDktMS40ODEtMS4xNTYtMi45OTQtMS44MTEtNC40NTlhNDguMjcyIDQ4LjI3MiAwIDAgMC0xMS40NTUtMTUuMzk0IDQzLjkyIDQzLjkyIDAgMCAwLTE2LjUwNy05LjkyMSA0OS45NTMgNDkuOTUzIDAgMCAwLTE5LjEwNi0yLjM1NSA0OS4xNyA0OS4xNyAwIDAgMC00Ljc4OS41ODZjLTEuNTkuMjQ1LTMuMTcyLjUyMy00Ljc2OC44YTMwLjkyOCAzMC45MjggMCAwIDAtOS4xMzQgMy4yMTIgNTMuNDM0IDUzLjQzNCAwIDAgMC0xNC45ODcgMTIuMDA2Yy0xLjAxOCAxLjIzNS0yLjA4MyAyLjQzNi0zLjEyMyAzLjY2NWE3NS4zMjggNzUuMzI4IDAgMCAwLTIuNzE5IDMuOTgzYy0uNzgzIDEuNC0xLjQ3OCAyLjg1Ny0yLjIwOSA0LjI4OC0uNjQyIDEuNDcyLTEuMTU1IDMtMS43NTYgNC40ODgtLjUwOCAxLjUyMi0uOSAzLjA4My0xLjM2MiA0LjYyMS0uMzUgMS41NjctLjU4NCAzLjE1OS0uOTM0IDQuNzMxLS4yMTEgMS41OTMtLjM0NyAzLjItLjUgNC44LS4wMi44IDAgMS42MTEgMCAyLjQxNmwuMDgzIDIuNDE0LjcyMiA0Ljc3Yy4zNjggMS41NjMuNjg5IDMuMTMxIDEgNC43bC42NTkgMi4zMTNjLjIxNi43NzIuMzgxIDEuNTY1LjYzOCAyLjMyNi41NzMgMS41IDEuMDkzIDMuMDMgMS43MTYgNC41Mi43MjQgMS40MzggMS4zNzIgMi45MzMgMi4yMjIgNC4zMDcuOTE4IDEuMzMyIDEuNzg1IDIuNyAyLjc0IDQgMS4wMTQgMS4yNTggMS45NjYgMi41NzQgMi45OTMgMy44MzRsMy4zNTQgMy41NTFhNDQuMDIzIDQ0LjAyMyAwIDAgMCAxNi43NDggOS44NzUgNTEuMTU4IDUxLjE1OCAwIDAgMCAxOS4yNTEgMi4zMjZsNC44NDUtLjQ0NmMxLjU5Mi0uMzEgMy4yLS41ODEgNC43ODYtLjkxOCAxLjU1MS0uNDc5IDMuMTQ0LS44NDggNC42NjktMS40MTMgMS40ODEtLjY3OSAyLjk4Ny0xLjMgNC40MjktMi4wMzlhNTAuOTI5IDUwLjkyOSAwIDAgMCAxNS4yNDItMTEuODN6bTYuODg5IDMuNzA1YzIuOSAyLjM0NyA1Ljc2NCA0Ljc0IDguNDQgNy4zNDMgMS4zNDYgMS4yOTIgMi42IDIuNjg0IDMuOTc1IDMuOTQ3IDEuMzUgMS4yODggMi43OTUgMi40NjkgNC4yNTEgMy42MzdzMi45IDIuMzQ1IDQuMjY3IDMuNjE5IDIuNyAyLjU3NyA0LjA0OSAzLjg2NGMuNjY3LjY1MyAxLjQgMS4yMzcgMi4wOTMgMS44NTVsMi4yIDEuNzM3Yy43NDIuNTY4IDEuNDE3IDEuMjEzIDIuMTIxIDEuODI0czEuNCAxLjIzNSAyLjA2NSAxLjg4N2ExLjggMS44IDAgMCAxLTIuMzQ0IDIuNzMybC0uMDQ5LS4wMzdjLS43NDgtLjU2Mi0xLjQ3LTEuMTUyLTIuMTg3LTEuNzQ5cy0xLjQ1NC0xLjE3MS0yLjE0Mi0xLjhjLS43MDYtLjYwOS0xLjM4LTEuMjU0LTIuMDYyLTEuODlzLTEuMzE2LTEuMzI2LTIuMDIzLTEuOTM0Yy0yLjgwOS0yLjQ1Mi01LjYtNC45MjEtOC4yMzYtNy41NzItMS4zMjYtMS4zMTUtMi42NTUtMi42MjYtNC4wNjEtMy44NXMtMi44NTItMi40LTQuMjY0LTMuNjIyYy0xLjQ1MS0xLjE3My0yLjctMi41NzItNC4wODUtMy44MjRhNDEuMjQyIDQxLjI0MiAwIDAgMC00LjQtMy40NyAxLjggMS44IDAgMCAxIDItM3EuMDY4LjA0Ni4xMzEuMXoiIGZpbGw9IiMwODExNDAiLz48cGF0aCBkPSJNMTcwIDE0MS44MThhNi45NDMgNi45NDMgMCAwIDEtMS42NyA0LjM4NWMtMS4xIDEuNDYtMy4yNjggNS4wODMtNS4wNiA1LjYyMi0yLjY5My44MDgtNi41LTIuNzQ2LTguMzE3LTQuMS00LjY3NS0zLjQ4NC00LjQwNi0zLjAyNC04LjY3Ni02Ljk4Mi00LjMxLTQtOC41MjktOC4wODktMTIuNzc4LTEyLjE1LTIuMy0yLjE5My05LjI1My01Ljg4My03LjMxOC0xMC4xMzQuOTc2LTIuMTEgNC44NzMtNS4xMjkgNi43LTYuNDkzIDUuODMyLTQuMzYxIDE3LjE0NSAxMC4xODMgMjAuOTg2IDEzLjU5MyA0LjU1NSA0LjA0NCA0LjUyOCAzLjY0OCA5LjA4MiA3LjY5MiAyLjgzMSAyLjUxOCA2LjkyOSA0Ljk3NSA3LjA1MSA4LjU2N3oiIGZpbGw9IiMwODExNDAiLz48cGF0aCBkPSJNMTcwLjE5NCAxNDEuODExYTYuNjM5IDYuNjM5IDAgMCAxLTEuMTc2IDMuNzM1IDIxNC4yNSAyMTQuMjUgMCAwIDEtMi4yMzcgMy4xNiAxNC4yMTIgMTQuMjEyIDAgMCAxLTIuNjMxIDIuODkgMi45MiAyLjkyIDAgMCAxLTEuOTQ4LjU2NSA1LjU3OCA1LjU3OCAwIDAgMS0xLjkzNi0uNWMtMi40MjktMS4wODItNC4yOTItMi45NDUtNi4zNjUtNC40MjVhNjQuNjM3IDY0LjYzNyAwIDAgMS02LjA3NS00Ljc4NWMtMy43NzctMy41LTcuNDQ5LTcuMS0xMS4xNjctMTAuNjY0YTU2LjUzMyA1Ni41MzMgMCAwIDAtNS43NTktNS4xMDYgMjkuMDkxIDI5LjA5MSAwIDAgMS0yLjk0Mi0yLjUxNyA3LjYyNyA3LjYyNyAwIDAgMS0yLjEwNS0zLjI1MiAzLjYgMy42IDAgMCAxIC4wMjQtMS45NjcgNS4wNTQgNS4wNTQgMCAwIDEgLjk1NC0xLjcxMyAyMS4zODQgMjEuMzg0IDAgMCAxIDIuNzI5LTIuNzUxYy45NzMtLjg0OCAxLjk5My0xLjYzNiAzLjAxMi0yLjQyM2E0LjQ0IDQuNDQgMCAwIDEgMy43MTItLjk2OCAxMC44NDEgMTAuODQxIDAgMCAxIDMuNjIxIDEuNDMzIDI2LjM0OCAyNi4zNDggMCAwIDEgMy4xNzMgMi4yMzQgNjcuNjExIDY3LjYxMSAwIDAgMSA1LjY2MiA1LjI2OWwyLjY3MyAyLjc4NmMuODg1LjkzMiAxLjc1MyAxLjg4MiAyLjcgMi43MyAxLjg5NCAxLjc0MyAzLjkxMSAzLjMyMiA1LjkxMSA0Ljk1MSAxIC44MTcgMS45NTggMS42NzYgMi45MTUgMi41MzdzMS45NjYgMS42NDUgMi45NiAyLjQ2N2ExOS4zNjQgMTkuMzY0IDAgMCAxIDIuNzkgMi43MDcgNi4xODYgNi4xODYgMCAwIDEgMS41MDUgMy42MDd6bS0uMzkzLjAxM2E1LjggNS44IDAgMCAwLTEuNDA3LTMuMzg3IDE4Ljc4MyAxOC43ODMgMCAwIDAtMi43My0yLjY1NmMtLjk4NS0uODE5LTIuMDA3LTEuNjA2LTIuOTg1LTIuNDU3bC0yLjkzLTIuNWMtMS45OC0xLjYyNS0zLjk5LTMuMjYxLTUuOS00Ljk4Ny0xLjkxOC0xLjc2LTMuNTg4LTMuNzA5LTUuMzgzLTUuNTUxYTU5LjY2OCA1OS42NjggMCAwIDAtNS42MTgtNS4yNTMgMjUuOTg1IDI1Ljk4NSAwIDAgMC0zLjEzMS0yLjIgMTAuNDg0IDEwLjQ4NCAwIDAgMC0zLjQ5NC0xLjM4MSA0LjE0IDQuMTQgMCAwIDAtMy40NzYuODMzIDQ0LjAwMiA0NC4wMDIgMCAwIDAtMi45ODYgMi40MjEgMjEuMDc1IDIxLjA3NSAwIDAgMC0yLjY1OSAyLjczMSAzLjc3OCAzLjc3OCAwIDAgMC0uOSAzLjM3OCA3LjEzMyA3LjEzMyAwIDAgMCAxLjk5MiAzLjEwOCAyOC43NzkgMjguNzc5IDAgMCAwIDIuOTIzIDIuNDY4IDI4LjQyNiAyOC40MjYgMCAwIDEgMi45OTUgMi40NjdsMi43ODUgMi42NzFjMy44IDMuNDY3IDcuNCA3LjE1NyAxMS4xODQgMTAuNjMyLjk0My44NzMgMS45IDEuNzIgMi45MjMgMi41czIuMDggMS41MTEgMy4xMTQgMi4yNzdjMi4xMDYgMS40ODEgMy45OCAzLjMxNiA2LjMxNCA0LjM0MSAxLjEyNi40ODggMi41Ljc4NyAzLjUxNC4wMTVhMTEuNzUyIDExLjc1MiAwIDAgMCAyLjU1Ni0yLjhsMi4yLTMuMTU3YTYuMjU5IDYuMjU5IDAgMCAwIDEuMDk4LTMuNTEzeiIgZmlsbD0iIzA4MTE0MCIvPjxwYXRoIGQ9Ik0xNDEuNzUyIDExNC4wNjJhMzUuNTQgMzUuNTQgMCAwIDEtMi43MjYgMy4xMjMgMjMuNzE0IDIzLjcxNCAwIDAgMC0yLjg0IDMuMDIzIDMwLjA2NiAzMC4wNjYgMCAwIDEtMi43OTIgMy4wNjUgMTUuNTY2IDE1LjU2NiAwIDAgMC0xLjMyMSAxLjYgMjEuNzM3IDIxLjczNyAwIDAgMS0xLjM4MSAxLjU0Ni45LjkgMCAwIDEtMS4zNjktMS4xN2wuMDA4LS4wMTFhMjUuNjUzIDI1LjY1MyAwIDAgMSAyLjc0MS0zLjExOWMuOTExLTEuMDQyIDEuODMxLTIuMDc2IDIuODQyLTMuMDNhMzMuNDM3IDMzLjQzNyAwIDAgMCAyLjc5Mi0zLjA3NCAyMC4yMzEgMjAuMjMxIDAgMCAwIDIuNy0zLjE1My45LjkgMCAxIDEgMS41NTkuOTEuOTEzLjkxMyAwIDAgMS0uMDYzLjA5NHptMTQuOTg3IDM1LjExNGEzOS4yMTIgMzkuMjEyIDAgMCAxIDIuMi0zLjM1OSAyNi44NTYgMjYuODU2IDAgMCAwIDIuMzctMy4zIDE5LjE0MiAxOS4xNDIgMCAwIDEgMi41MDYtMy4yMzljLjQ2Ny0uNS44NzEtMS4wNjMgMS4zLTEuNjA5YTEzLjI4IDEzLjI4IDAgMCAxIDEuNDY5LTEuNDc2LjkuOSAwIDAgMSAxLjI2MyAxLjI3OWwtLjAzNi4wNDFhOTQuODY4IDk0Ljg2OCAwIDAgMS0yLjY0MiAyLjg4NGMtLjgyNSAxLjAyMi0xLjYxMSAyLjA4Mi0yLjQ3NSAzLjFhMjUuNjQzIDI1LjY0MyAwIDAgMC0yLjI4NSAzLjMgMjEuMDczIDIxLjA3MyAwIDAgMC0yLjE5MSAzLjQwNy45LjkgMCAxIDEtMS42MTEtLjgwN3oiIGZpbGw9IiNmZmM3NTciLz48cGF0aCBkPSJNMzguODM0IDY3LjY5MWMuNDQtMi43NzkgMS4zODYtNS40MDkgMS45NDItOC4xNzNhNDMuODkgNDMuODkgMCAwIDEgMy40MjQtNy42NzIgMzMuNSAzMy41IDAgMCAxIDIuMjM2LTMuNTYzQTMwLjkgMzAuOSAwIDAgMSA0OS4wNjMgNDVjLjkzMS0xLjA0OCAxLjg0NC0yLjEgMi44NjktMy4wNTNsMy4xMjktMi43NjdhNDQuOTQ5IDQ0Ljk0OSAwIDAgMSAzLjM2Mi0yLjQ2N2MxLjE4MS0uNzI4IDIuMi0xLjcyOCAzLjQxOS0yLjRsMS44LTEuMDYzIDEuODYyLS45NjFjMS4yNjQtLjU5IDIuNS0xLjI1OSAzLjgyMi0xLjczMS42NjktLjIxIDEuMzIzLS40NjEgMi0uNjI4czEuMzQ5LS4zNzEgMi4wMTMtLjU5M2EzMS45MjQgMzEuOTI0IDAgMCAxIDQuMDg2LS45NjJjLjY5MS0uMTE4IDEuMzkzLS4xNTggMi4wODktLjIyNy42OTItLjEwNiAxLjM4NC0uMiAyLjA4Mi0uMjYyIDEuMzkyLS4xODEgMi44LS4yMjkgNC4yLS4yNzdhLjc4Ny43ODcgMCAxIDEgLjA1MyAxLjU3MmgtLjFjLTEuMzQ5LjAyLTIuNy4wMzYtNC4wMzkuMTg1YTE5LjEzNiAxOS4xMzYgMCAwIDAtMy45OC43MDVjLS42NTEuMTc3LTEuMzI2LjIzMi0xLjk4MS4zOTNsLTEuOTc4LjQzM2E0MC4wMzMgNDAuMDMzIDAgMCAwLTMuODc1IDEuMiAyOC43NzkgMjguNzc5IDAgMCAwLTcuMzI3IDMuNSAxMC42IDEwLjYgMCAwIDEtMS43NyAxIDUgNSAwIDAgMC0uOTIxLjQ1MWMtLjI3OC4yLS41NDQuNDA5LS44MTYuNjEyLTEuMDgzLjgyNi0yLjAyNCAxLjgyMi0zLjA4NyAyLjY0OC0uNTMxLjQxNS0xLjEwOS43OC0xLjYxOCAxLjIyNWwtMS40MjQgMS40MjdjLS41LjQ1NC0uOTI2Ljk3OS0xLjQyIDEuNDQxYTEwLjI1OCAxMC4yNTggMCAwIDAtMS4zNDcgMS41IDI1LjEyMyAyNS4xMjMgMCAwIDEtMi40MzUgMy4yMjggMTEuMjQzIDExLjI0MyAwIDAgMC0xLjEyMiAxLjY5M2MtLjQuNTUyLS43NjUgMS4xMjYtMS4xNTMgMS42OWEzMi43MzYgMzIuNzM2IDAgMCAwLTMuMTEyIDcuNTQ0IDE5LjI4MyAxOS4yODMgMCAwIDAtMS4yMSAzLjkgNzEuMzMzIDcxLjMzMyAwIDAgMC0uNzQ5IDQgLjc4Ny43ODcgMCAwIDEtMS41NTYtLjIzOXptODIuOTA1IDM0LjI2bC0xLjg1NCAyLjMwOWEyMS4wOTEgMjEuMDkxIDAgMCAxLTEuOTQ2IDIuMjE1bC0xLjA1MiAxLjAzYy0uMzQ3LjM0Ny0uNjYxLjcyNy0xIDEuMDgzcS0xIDEuMDg0LTIuMDc3IDIuMTE2YTI5LjA4NSAyOS4wODUgMCAwIDEtMTAuMzI0IDUuOTA3bC01LjU0MSAxLjcxNGE0Ni41IDQ2LjUgMCAwIDEtNS42NzggMS41MTZjLS45NzEuMTctMS45NDIuMzc3LTIuOTI4LjQ4N2EyOC41MzEgMjguNTMxIDAgMCAxLTIuOTQ3LjE0OWMtLjk4IDAtMS45NTYtLjAzMi0yLjkzLS4wODNzLTEuOTQyLS4wNDUtMi45MjMtLjExOWEzOC44NjIgMzguODYyIDAgMCAxLTUuOC0uODY3IDUxLjU0NyA1MS41NDcgMCAwIDEtNS43MDktMS40IDQ3IDQ3IDAgMCAxLTEwLjYtNS4xMThjLTEuNjEzLTEuMTQtMy4xLTIuNDM2LTQuNi0zLjdhMzYuMjUgMzYuMjUgMCAwIDEtNC4xNzQtNC4xNzEgNTEuMjA1IDUxLjIwNSAwIDAgMS0xLjc3Ny0yLjM1OWMtLjYtLjc4LTEuMTYxLTEuNTg2LTEuNzE5LTIuNGE0My4zMTggNDMuMzE4IDAgMCAxLTIuOTktNS4xLjc4Ny43ODcgMCAxIDEgMS40MDctLjcwNnYuMDA2bC4wMTYuMDMyYTQxLjU0NiA0MS41NDYgMCAwIDAgMi44MTEgNC45NTMgMzguOSAzOC45IDAgMCAwIDEuNjUzIDIuMzE2Yy42LjczOCAxLjI1MiAxLjQyNyAxLjg4OSAyLjEyNiAxLjI4NyAxLjM4NSAyLjU2MSAyLjc4NyAzLjk1NyA0LjA3OGE0MC40MjcgNDAuNDI3IDAgMCAwIDQuNDU0IDMuNTQ3IDMzLjggMzMuOCAwIDAgMCAxMC4xNjIgNS4wODhjMS44NDEuNDUxIDMuNTM3IDEuNDY3IDUuNDU0IDEuNjcgMS44ODIuMzE5IDMuNzg4LjM5MSA1LjY2OS41MzUuOTMzLjExIDEuOS4yNDEgMi44NTYuMjY0czEuOTExLjAxIDIuODYtLjAyMWMuOTQ5LS4wMTEgMS44OS0uMDgyIDIuODIzLS4xNDdhMTIuMzI3IDEyLjMyNyAwIDAgMCAyLjc2MS0uNDY3Yy45MDYtLjI1OSAxLjc4OS0uNiAyLjcxMi0uODM2LjkxNS0uMjYzIDEuODU2LS40NzMgMi43ODctLjczOC45NDQtLjIyNiAxLjg0Ni0uNTg2IDIuNzc1LS44ODcuOTI1LS4yNzMgMS45MzEtLjQ3NCAyLjgyNi0uNzIyIDMuNzA2LS45NDkgNi44MzMtMy4zNTcgOS43LTUuODE3Ljc0MS0uNiAxLjQ3My0xLjIxMyAyLjE4LTEuODU4YTE1Ljk3NiAxNS45NzYgMCAwIDAgMS45NzgtMi4wNzZjMS4yOTItMS40MjUgMi4zNzYtMi45ODUgMy41NTktNC40NzJsLjA1LS4wNjNhLjc4Ni43ODYgMCAwIDEgMS4yMzEuOTc5ek00MC4yMTggODcuNDE0YTQuNzEgNC43MSAwIDAgMS0uNDU0LTEuNTU0IDMuNTczIDMuNTczIDAgMCAwLS4yNTEtMS42IDMuOTI4IDMuOTI4IDAgMCAxLS4yNzEtMS41OSAyLjQ4NiAyLjQ4NiAwIDAgMC0uMjE5LS43OCAzLjE4MiAzLjE4MiAwIDAgMS0uMTMtLjguOS45IDAgMCAxIDEuNzM0LS4zODRsLjA0Ny4xMWEzLjc3OSAzLjc3OSAwIDAgMSAuMjk1IDEuNTM5IDYuOTM3IDYuOTM3IDAgMCAxIC4yIDEuNTU2IDQuMDI1IDQuMDI1IDAgMCAwIC4zMTIgMS41MzYgNC4yNTEgNC4yNTEgMCAwIDEgLjExNi43NzggMS42ODUgMS42ODUgMCAwIDAgLjM1Ni43MTYuOTEuOTEgMCAxIDEtMS41MS45ODF6IiBmaWxsPSIjMDgxMTQwIi8+PHBhdGggZD0iTTI1LjMgMTIzLjYyN2MtMS43MjMgMy41NTMtNS4xMTQgNC4yMzMtOC41OTIgNC42MTZhNzEuNjM3IDcxLjYzNyAwIDAgMC03LjUyMSAxLjYgMzkuOTMxIDM5LjkzMSAwIDAgMS00Ljg5My03LjE0M2MxLjg1NS0uNSAzLjgyOS0xLjA4MiA0LjM2Ni0xLjMwNyA0Ljk1My0yLjEgNy43MzYtNi44MzcgMTIuNDkyLTkuMTE4IDEuMzc1LS42NjMgNC40MzctMS4xNSA1Ljc1NS0uMDc1IDIuMDgxIDEuNy0xLjMgMTAuNzgzLTEuNjA3IDExLjQyN3oiIGZpbGw9IiNhZmJhZGQiLz48cGF0aCBkPSJNODAuNDc1IDU4Ljk5NWMtLjQtLjgzOC0uODM4LTEuNjYtMS4yNTgtMi41YTE0LjYzMSAxNC42MzEgMCAwIDAtMS40MDctMi40MzZjLS41NTQtLjc2LTEuMDY3LTEuNTQ1LTEuNTktMi4zMjdhMTEuMDc5IDExLjA3OSAwIDAgMC0uODg3LTEuMDk1Yy0uMzA3LS4zNTUtLjU4OC0uNzMtLjg5MS0xLjA4N2EuNDUuNDUgMCAwIDEgLjY2Ny0uNmwuMDE4LjAxOWExNS44NjIgMTUuODYyIDAgMCAxIDEuOCAyLjI0NSAyMi4wMjMgMjIuMDIzIDAgMCAxIDEuNiAyLjM4OGMuNDcxLjgzNC45NzkgMS42NDQgMS40NjggMi40Ny4yNDQuNDE0LjQyOS44NTkuNjM5IDEuMjkxcy40My44Ni42NzYgMS4yODJhLjQ1MS40NTEgMCAwIDEtLjc3OS40NTVsLS4wMTctLjAzMnptLTMuMDA3IDQuMDZhMTkuNTQ3IDE5LjU0NyAwIDAgMS03LjcyNS01LjU2NiAxMC4xMzMgMTAuMTMzIDAgMCAxLTEuMzA3LTIuMDc4IDMuNTUgMy41NSAwIDAgMS0uMjktMi41OTQgMi42NjUgMi42NjUgMCAwIDEgLjgxMS0xLjExNyAzLjQxNiAzLjQxNiAwIDAgMSAxLjItLjU3NyAzLjYzOSAzLjYzOSAwIDAgMSAyLjU4MS4yNDEgMS45IDEuOSAwIDAgMSAuNTc4LjQ1NSAyLjU2NiAyLjU2NiAwIDAgMSAuMzc3LjU4IDIgMiAwIDAgMSAuMTUzIDEuNDQ1IDMuMDQ5IDMuMDQ5IDAgMCAxLTEuOTU1IDEuOCA4LjMxNyA4LjMxNyAwIDAgMS00Ljg4NS4wOTUgOS42OTMgOS42OTMgMCAwIDEtNC4yMzItMi4zODggOS45MjIgOS45MjIgMCAwIDEtMi40Ni00LjE4NS40NTEuNDUxIDAgMSAxIC44Ni0uMjcgOC44MzUgOC44MzUgMCAwIDAgNi4wNTIgNS45ODkgNy40NDMgNy40NDMgMCAwIDAgNC4zMzMtLjExQTIuMjQ1IDIuMjQ1IDAgMCAwIDczIDUzLjU5NWExLjEyOSAxLjEyOSAwIDAgMC0uMDc4LS44MzMgMS43NCAxLjc0IDAgMCAwLS4yNS0uNDA2IDEuMDggMS4wOCAwIDAgMC0uMzM1LS4yN2MtMS4xMjEtLjYxOC0zLjA0Mi0uMjctMy40NDEgMWEyLjc1OCAyLjc1OCAwIDAgMCAuMyAxLjk2OSA5LjI3NiA5LjI3NiAwIDAgMCAxLjIzNCAxLjg2NyAxOC4zMSAxOC4zMSAwIDAgMCAzLjMzNyAzLjEzMSAxOC41MDkgMTguNTA5IDAgMCAwIDQuMDMzIDIuMTY2LjQ1MS40NTEgMCAwIDEtLjMyNC44NDF6bS0uODY4IDMuNTI2Yy0xLjIxMi0uMzQ1LTIuNDY4LS41OTUtMy43MjItLjk1NGE0Ny43NCA0Ny43NCAwIDAgMS0xLjg2My0uNjEzIDE4LjUxNiAxOC41MTYgMCAwIDAtMS44NDYtLjUgMzEuNTUxIDMxLjU1MSAwIDAgMS0zLjc0Ni0xLjA0NmMtLjYxOC0uMjE1LTEuMjQ4LS40LTEuODctLjYzOGE5Ljg0NyA5Ljg0NyAwIDAgMS0xLjc4NS0uOTM0LjQ1LjQ1IDAgMCAxIC40NzEtLjc2N2wuMDI3LjAxNmEyMC44NjYgMjAuODY2IDAgMCAwIDMuNDIxIDEuNDg2YzEuMjEuMzgyIDIuNDYuNjc0IDMuNyAxLjA2MyAxLjI1NC4zNiAyLjQ4Mi44MDYgMy43MTMgMS4wOC42MjMuMTQ2IDEuMjM5LjMzNiAxLjg2Ny41czEuMjYzLjMwOSAxLjkxLjQ1M2EuNDUxLjQ1MSAwIDAgMS0uMi44OGwtLjAyNS0uMDA2eiIgZmlsbD0iIzIyMjY2ZCIvPjxwYXRoIGQ9Ik04MC41MjcgNTguOTczYy0uMjE0LS40MTItLjI3Mi0uOS0uNjU4LTEuMjM0LS4yNTItLjM5NC0uMzg4LS44NDktLjYwOC0xLjI2NHMtLjQtLjg1MS0uNTc4LTEuMjkzYy0uMS0uMjE1LS4yNS0uNC0uMzQ5LS42MTVhMi42OTQgMi42OTQgMCAwIDAtLjM2NC0uNjA3Yy0uMTM2LS4xOTMtLjIzOC0uNDA4LS4zNy0uNi0uMDk0LS4yMjItLjM2Ny0uMzIxLS40ODEtLjUyOC0uMy0uMzY2LS41OTEtLjczNS0uOS0xLjA5MmE2Ljg5MyA2Ljg5MyAwIDAgMC0uODE5LTEuMTUgMy44OTIgMy44OTIgMCAwIDAtLjkxMy0xLjA3Mi4zOTIuMzkyIDAgMCAxIC41NjMtLjU0NmwuMDM2LjAzNmE4LjcyOCA4LjcyOCAwIDAgMCAxIDEuMDQ0Yy4zLjM3Mi41Mi44MS44MDUgMS4xOTRhMy45ODggMy45ODggMCAwIDAgLjg1MyAxLjE1NGMuMjA4LjE0OC4xMjYuNDkzLjM0Mi42MzVhMy41MDggMy41MDggMCAwIDEgLjUwNS41MjcgMTQuODIyIDE0LjgyMiAwIDAgMSAxLjMgMi41NzEgNS45MjkgNS45MjkgMCAwIDAgLjczIDEuMjQgNy45OCA3Ljk4IDAgMCAwIC42NCAxLjMuMzkzLjM5MyAwIDAgMS0uNzEzLjMyOXoiIGZpbGw9IiNmZmM2NTciLz48cGF0aCBkPSJNODAuMTIgNTkuMTY0YTIzLjM4MSAyMy4zODEgMCAwIDAtMS41MDktMi44MzNBMjUuOTE4IDI1LjkxOCAwIDAgMCA3NyA1My42MzhjLS4zLS40NDYtLjU4Ny0uOS0uODY3LTEuMzY0LS4yNzQtLjQ3Ni0uNi0uODUtLjg5Mi0xLjMtLjMxMS0uNDI3LS42ODMtLjgyNC0xLTEuMjU4YS42OTEuNjkxIDAgMCAxIC4yMjMtMS4wNDguNzIuNzIgMCAwIDEgLjU4LS4wMjcuNy43IDAgMCAxIC4yNC4xNjRsLjE0NC4xNDNhMTUuMTggMTUuMTggMCAwIDEgMS4wMzYgMS4yNTZjLjMuNDYxLjcyNi44MDkgMS4wMDYgMS4yNzQuNjA1Ljg5IDEuMyAxLjc1NiAxLjg0NCAyLjY2Ny40NjQuOTY1IDEuMDg2IDEuODM0IDEuNTI4IDIuODQ0YTkuMjU0IDkuMjU0IDAgMCAwIC43MDkgMS40MjIuODYxLjg2MSAwIDAgMSAuMTM1LjYxNS44LjggMCAwIDEtLjQuNTYxLjgyNC44MjQgMCAwIDEtMS4wMDYtLjE3IDEuMTY3IDEuMTY3IDAgMCAxLS4xNi0uMjUzem0uNzExLS4zMzljLjAzOS4wODEuMDQ1LjA4Mi4wNDUuMDgyYS4wNDMuMDQzIDAgMCAwIC4wMi4wMS4wNDMuMDQzIDAgMCAwIC4wNC0uMDA3LjAzNy4wMzcgMCAwIDAgLjAxNy0uMDMyLjA1NS4wNTUgMCAwIDAgMC0uMDE2bC0uMDQxLS4wNzQtLjM5My0uNzE4Yy0uMTQtLjIzMS0uMzA3LS40NjUtLjQzLS42ODktLjI3Mi0uNDUyLS40MTktLjk0OC0uNy0xLjQxOC0uMjQ2LS40NzktLjUyNi0uOTM3LS43ODctMS40MDZBMTQuODI5IDE0LjgyOSAwIDAgMCA3Ni44NiA1MS45Yy0uMzc1LS4zODEtLjQ1My0uOTkxLS44NS0xLjMzOC0uMzU0LS4zODgtLjc1Mi0uNzMyLTEuMTEzLTEuMTA2LS4wNDYtLjA0Ny0uMDgxLS4xLS4xMjItLjE1NC0uMDIyLS4wMzEuMDA4LS4wMTMuMDA1LS4wMjRzMC0uMDMxIDAtLjAyMi4wMS4wMTUuMDExIDBjLjM1NC40LjYyNi44NTYgMSAxLjI1NWE0LjI1MSA0LjI1MSAwIDAgMSAuOTggMS4zMjYgNS4wODMgNS4wODMgMCAwIDAgLjQyNy42NzdsLjM4My43MDlhMTAuNjg0IDEwLjY4NCAwIDAgMCAuOSAxLjM1MSAxMiAxMiAwIDAgMSAuODcyIDEuMzkgMjcuNzU4IDI3Ljc1OCAwIDAgMCAxLjQ3NyAyLjg2MXpNNzcuNDg5IDYzYTM0LjQ2NiAzNC40NjYgMCAwIDEtNC4yMDgtMi4yNyAxNy4yNiAxNy4yNiAwIDAgMS0zLjQ5LTMuMjgxIDkuMzczIDkuMzczIDAgMCAxLTEuMjg0LTIuMDcyIDMuMzkgMy4zOSAwIDAgMS0uMjI2LTIuNTE2IDIuNjg4IDIuNjg4IDAgMCAxIC43NTgtMS4wNjEgMi45NTggMi45NTggMCAwIDEgMS4xNTQtLjU0MSAzLjgyNyAzLjgyNyAwIDAgMSAyLjQ1OC4yNiAxLjkxMSAxLjkxMSAwIDAgMSAuODU4Ljk2NCAxLjc3NCAxLjc3NCAwIDAgMSAuMTE1IDEuMjkzIDIuOTY5IDIuOTY5IDAgMCAxLTEuNzg4IDEuNzI4IDguMzI5IDguMzI5IDAgMCAxLTQuODI4LjIyNyA5Ljc4NSA5Ljc4NSAwIDAgMS00LjE3Mi0yLjQ0IDEwLjIxNiAxMC4yMTYgMCAwIDEtLjc1OC0uOTUxIDkuNDk1IDkuNDk1IDAgMCAxLS42ODItMSAxMi4yNjUgMTIuMjY1IDAgMCAxLTEuMDI3LTIuMTkuMzkzLjM5MyAwIDAgMSAuNzM2LS4yNzh2LjAwNmwuMDEzLjAzNmE4LjU0MyA4LjU0MyAwIDAgMCAyLjMyNSAzLjc3NCAxMS4zNTQgMTEuMzU0IDAgMCAwIDEuNzI1IDEuMzc1IDcuNzI5IDcuNzI5IDAgMCAwIDIuMDQ0Ljg2NyA2LjM5NCA2LjM5NCAwIDAgMCA0LjM1Ni0uMTIyYy4zMzEtLjEzOS42MTgtLjMyNS45MjYtLjQ3MWExLjA0MSAxLjA0MSAwIDAgMCAuNTYxLS43MjkgMS40NjMgMS40NjMgMCAwIDAtLjc1OS0xLjQ1MyAyLjM5MSAyLjM5MSAwIDAgMC0xLjkyOS0uMjA3IDEuODMgMS44MyAwIDAgMC0xLjQxMSAxLjE1NSA0LjAyOSA0LjAyOSAwIDAgMCAuMjQ4IDEuOTQ3IDQuMzIzIDQuMzIzIDAgMCAwIC41My45NzljLjE3My4zMzQuNC42NDUuNjA1Ljk2NmExMy43MTEgMTMuNzExIDAgMCAwIDMuNDI1IDMuMDYxIDE0Ljc5MyAxNC43OTMgMCAwIDAgNC4wMTYgMi4yMTIuMzk0LjM5NCAwIDAgMS0uMjk0LjczeiIgZmlsbD0iI2ZmYzY1NyIvPjxwYXRoIGQ9Ik03Ny4zMjEgNjMuNDIxYTIxLjk4NyAyMS45ODcgMCAwIDEtOC4wMjEtNS43MzMgMTAuMTM1IDEwLjEzNSAwIDAgMS0xLjM0Mi0yLjE3MiAzLjk0NCAzLjk0NCAwIDAgMS0uMy0yLjY4NCAzLjEgMy4xIDAgMCAxIDEuOTE1LTEuOTc3IDQuMjYzIDQuMjYzIDAgMCAxIDIuNjY2LS4xNDEgMi45NjggMi45NjggMCAwIDEgMS4yNDIuNjY0IDIuODYgMi44NiAwIDAgMSAuNDIxLjU2OSAyLjE1NSAyLjE1NSAwIDAgMSAuMzE3LjYzNiAyLjMxNiAyLjMxNiAwIDAgMS0uMDE3IDEuNDQ3IDIuODE3IDIuODE3IDAgMCAxLS43ODkgMS4xNDkgNC45ODIgNC45ODIgMCAwIDEtMi4zNyAxLjA1NCA4LjE4MyA4LjE4MyAwIDAgMS0yLjUxNy4wNjcgMTAuMDEgMTAuMDEgMCAwIDEtNC42NDMtMS43MTggMTAuMTM0IDEwLjEzNCAwIDAgMS0zLjY0Ny00LjkyOCAyIDIgMCAwIDEtLjE2NS0uNjg1LjY4LjY4IDAgMCAxIDEuMzE4LS4xNjNsLjIuNTdhMTAuMTYyIDEwLjE2MiAwIDAgMCAuNDkzIDEuMDgyIDguNTIgOC41MiAwIDAgMCAzLjI3NiAzLjMyNCA3Ljg1OSA3Ljg1OSAwIDAgMCA0LjQ4OCAxIDUuMTc4IDUuMTc4IDAgMCAwIDIuMTU4LS42MjMgMS4zODUgMS4zODUgMCAwIDAgLjYzLS42Ny44NjUuODY1IDAgMCAwLS4yMDgtLjc3OGMtLjY2Ny0uOTE5LTMuMTE1LS42NjUtMy4yMzMuN2EzLjU0IDMuNTQgMCAwIDAgLjY1NCAyLjA1MSAxNS4zNTQgMTUuMzU0IDAgMCAwIDEuNDMzIDEuODczIDE0LjY3NiAxNC42NzYgMCAwIDAgMy42MiAzLjA3MSAxNy4wMTkgMTcuMDE5IDAgMCAwIDIuMTIgMS4xbC41NTEuMjI4LjI3OC4xMDdhLjk1Mi45NTIgMCAwIDEgLjQuMjQ3LjgzNC44MzQgMCAwIDEgLjA2OCAxLjAzNi44NDQuODQ0IDAgMCAxLS45OTYuMjk3em0uMjkzLS43MzFhLjA1NC4wNTQgMCAwIDAgLjA2NC0uMDg0Yy4wNi4wMTQtLjIyLS4wODctLjQtLjE2MWwtLjU3My0uMjQzYTE4Ljk2NSAxOC45NjUgMCAwIDEtMi4yLTEuMTU4IDE2LjU2OCAxNi41NjggMCAwIDEtMi4wMjUtMS40NTMgMTguMTY0IDE4LjE2NCAwIDAgMS0xLjg0Ny0xLjY3OEExMC43ODYgMTAuNzg2IDAgMCAxIDY5LjEgNTUuOWE0LjI2NyA0LjI2NyAwIDAgMS0uNzItMi42MDcgMi4xMTYgMi4xMTYgMCAwIDEgLjc2MS0xLjMwOSAyLjg4NiAyLjg4NiAwIDAgMSAxLjMtLjU3MiAzLjM0NyAzLjM0NyAwIDAgMSAxLjM4My4wMzEgMi43NDEgMi43NDEgMCAwIDEgLjY2OC4yNDYgMS4zNSAxLjM1IDAgMCAxIC41ODkuNTMyIDEuNjUgMS42NSAwIDAgMSAuMjgxIDEuNTA5IDIuMTMzIDIuMTMzIDAgMCAxLS45OTQgMS4wNjQgNi41OTIgNi41OTIgMCAwIDEtMi40ODMuNyA4LjU0NyA4LjU0NyAwIDAgMS00LjkxOS0xLjA3NiA5LjYwNSA5LjYwNSAwIDAgMS0zLjQyMS0zLjY4NCAxMC43NjcgMTAuNzY3IDAgMCAxLS41NTUtMS4xMzRsLS4yMjItLjU3NmMtLjAwOC0uMDA5LS4wMjctLjAwNy0uMDIzIDAtLjEtLjMxMy4zMzcuODQyLjYxNSAxLjQ2MWE4LjUzMSA4LjUzMSAwIDAgMCAxLjE5MSAxLjk3NyA4LjcgOC43IDAgMCAwIDEuNzI3IDEuNTI2IDkuMSA5LjEgMCAwIDAgNC4zMTEgMS41ODkgOS4zIDkuMyAwIDAgMCAyLjI4MS0uMTUgNC4zNzQgNC4zNzQgMCAwIDAgMi4wMTYtLjgyNCAxLjgxNyAxLjgxNyAwIDAgMCAuNTg5LS44MjQgMS41NDcgMS41NDcgMCAwIDAtLjAwNy0uOTYzIDEuNiAxLjYgMCAwIDAtLjIyLS40NjMgMi4yNDEgMi4yNDEgMCAwIDAtLjI4OS0uNDM4IDIuMTcyIDIuMTcyIDAgMCAwLS45MTktLjUyYy0xLjM5Mi0uNDYyLTMuMzA1LjE3MS0zLjY3OCAxLjYzM2EzLjMxIDMuMzEgMCAwIDAgLjMyOCAyLjE3MSA5LjM4IDkuMzggMCAwIDAgMS4yNiAxLjk3MyAxNy45MjMgMTcuOTIzIDAgMCAwIDcuNjY0IDUuNTE4em0tLjk5NyAzLjgzN2E2LjEyMyA2LjEyMyAwIDAgMC0xLjg1OC0uNDM1Yy0uNjMzLS4xMDctMS4yMzktLjM0OC0xLjg2OC0uNTE0YTEyLjQwOSAxMi40MDkgMCAwIDEtMS44MzctLjY4NWMtLjI5NC0uMTI0LS42MTItLjE3OS0uOTEtLjNhNC43MTYgNC43MTYgMCAwIDAtLjkyNS0uMjY5Yy0uMzEzLS4wNzUtLjYxNy0uMTg2LS45My0uMjY1LS4zLS4xMjgtLjY1Ni0uMDQyLS45NjItLjE1Mi0uNjMxLS4xNDUtMS4yNy0uMjc1LTEuOS0uNDQ1LS41OTMtLjI4OS0xLjIzNS0uNDM3LTEuODM2LS43MTgtLjU1Ni0uMzcyLTEuMi0uNTQ4LTEuNzg4LS45YS4zOTMuMzkzIDAgMCAxIC4zOTUtLjY3OWwuMDQxLjAyM2E2LjE3NCA2LjE3NCAwIDAgMCAxLjY4OC43NjdjLjU3OS4yMjYgMS4xNDEuNTMgMS43NDkuNzE4YTYuNDc1IDYuNDc1IDAgMCAwIDEuODQ1LjUxNWMuMzM1LS4wMTQuNTc5LjMyNi45MTYuMzA5YTYuMDkyIDYuMDkyIDAgMCAxIC45NzEuMTE1IDMuNSAzLjUgMCAwIDAgLjkzMS4yOTNjLjMyLjA3My42MTMuMjMxLjkzNi4zYTEuODExIDEuODExIDAgMCAxIC45LjMxMyAxLjcgMS43IDAgMCAwIC40NTIuMTU3bC40NDEuMjA3YTkuMTkgOS4xOSAwIDAgMCAxLjg5My40IDE4LjI1OCAxOC4yNTggMCAwIDAgMS45LjQ5LjM5My4zOTMgMCAwIDEtLjIyMS43NTV6IiBmaWxsPSIjZmZjNjU3Ii8+PHBhdGggZD0iTTc2LjQ5MiA2Ni45NmMtMS4zNzUtLjMzOS0yLjcwOS0uNzc1LTQuMTI2LTEtMS40LS40NC0yLjY0Ny0uODcyLTQuMDI4LTEuMmEyNy44MTQgMjcuODE0IDAgMCAxLTQuMDQ2LTEuMzgzYy0uMzI4LS4xNDMtLjY2NS0uMjI3LTEuMDA1LS4zNjJhNy42ODQgNy42ODQgMCAwIDEtLjk3Mi0uNDlsLS40NTgtLjI4OS0uMjI3LS4xNTVhLjY3Ni42NzYgMCAwIDEtLjI0LS4zMS43LjcgMCAwIDEgLjE0OC0uNzMxLjY4My42ODMgMCAwIDEgLjczOS0uMTU0IDE2LjQ5IDE2LjQ5IDAgMCAwIDEuODkzLjk0MiAxNS45NzYgMTUuOTc2IDAgMCAwIDIuMDA3LjYyMmw0LjA4OCAxLjA4MmMuNjczLjIyNCAxLjMyMi41IDIgLjY2OHMxLjM2LjMgMi4wMzguNTIyYy4zMzguMS42NzQuMjI5IDEuMDE0LjMxNWwxLjAzLjIyMi41MTUuMTExYS45NS45NSAwIDAgMSAuMzcyLjEzNy44MTIuODEyIDAgMCAxIC4xMTggMS4yNS44NjIuODYyIDAgMCAxLS44Ni4yMDN6bS4yMTYtLjc1N2MuMTQyLjA0My4xMTEtLjAzMS4xMTEtLjA1NWEuMDUuMDUgMCAwIDAtLjAxOC0uMDE4LjYuNiAwIDAgMC0uMS0uMDI0bC0uNTE5LS4xMTdjLS42ODktLjE2OS0xLjM5MS0uMy0yLjA3Ny0uNDM1LTEuMzQ1LS4zMy0yLjc2Ny0uNzk0LTQuMDgtMS4yMzNhMzQuNjM2IDM0LjYzNiAwIDAgMC00LjA4LTEuMTY3Yy0uNzI1LS4xLTEuMjg5LS42MjYtMS45OS0uNzkxLS4zMzgtLjEyLS42ODYtLjIyNS0xLjAyMi0uMzY1bC0uNTA2LS4yMTQtLjI1MS0uMTE3LS4xMi0uMDY4Yy0uMDQ4LS4wMjktLjA3OS0uMDQ2LS4wNTktLjAzNi4wNjItLjAxLjAwNi0uMDY5LjAxLS4wNDFoLjAwNWwuMjEuMTI5LjQ0NC4yNDdhOC4yIDguMiAwIDAgMCAxLjg3OS44IDkuODQyIDkuODQyIDAgMCAxIDEuOTcyLjcgNi43MDggNi43MDggMCAwIDAgMSAuMzE5bC45OTUuMzRjMS4zNDEuNDI1IDIuOC42NzMgNC4xMDYgMS4xYTM5LjE2NCAzOS4xNjQgMCAwIDAgNC4wOSAxLjA0M3oiIGZpbGw9IiNmZmM2NTciLz48cGF0aCBkPSJNNjguMSA0NC45MDZjLjAzNi0uMjkzLS4yMzMtLjU3Ni0uNDUxLS40NzNhLjUxNS41MTUgMCAwIDAtLjA5LjcyN2MuMTgyLjE5MS41LjAzOS41NDEtLjI1NCIgZmlsbD0iI2ZmYzc1NyIvPjxwYXRoIGQ9Ik02Ny43MDcgNDQuODU3Yy0uMDM4LS4wMzItLjE1OS4wMjMtLjAyMi0uMDE1YS4zMS4zMSAwIDAgMCAuMDUtLjAxNGMuMDIxLS4wMjcuMDMtLjA3Ni4wNDUtLjA2OC4wMjctLjAxMy4wMzgtLjAzMi4wMzUtLjAzOHMtLjE0NC0uMDA4LS4xNTQuMDY1YzAgLjE1NC4yLjIxOS4xMi4wODItLjA1LS4wNzctLjA3Ny4wMTgtLjAyOS4wMzkuMDEtLjAwNyAwLS4wNDEtLjA0NS0uMDUxYS42NTYuNjU2IDAgMSAxIC44MDktLjYyNWwtLjAxNS43MjRhLjc3Mi43NzIgMCAwIDEtLjIyOS41NTFjLS4xNjYuMTYxLS40MjkuMTIxLS42NTYuMTEzYS43LjcgMCAwIDEtLjUtLjQxNSAxLjA4NSAxLjA4NSAwIDAgMS0uMDgyLS41YzAtLjE1NS0uMDU0LS4zOTIuMTcyLS41NDdhLjc2Ni43NjYgMCAwIDEgLjQtLjA5MWMuMDY5LjAyNS4xMjQtLjAyMy4xOS0uMDMxYS40NS40NSAwIDAgMSAuMTU5LjA3OCAyLjQxMiAyLjQxMiAwIDAgMSAuMTkzLjJjLjA2My4wNDMuMTkxLjA1Mi4yMjMuMTM3YS43LjcgMCAwIDEgLjEzMy41MDYuMjk0LjI5NCAwIDAgMS0uNDc3LjE3em00LjEgMS4zNDNjLjA2Ny0uNTUzLS41MDctMS4xLS45NjItLjkyMWEuOS45IDAgMCAwLS4xNjcgMS4zNzIuNjg3LjY4NyAwIDAgMCAxLjEyOS0uNDUxIiBmaWxsPSIjZmZjNzU3Ii8+PHBhdGggZD0iTTcxLjQxIDQ2LjE1NGMtLjAyMi0uMTg4LS4yNDItLjMyNC0uMzI1LS40NTVsLS4wMzgtLjAzNWMtLjAwOC0uMDI5LS4wMjctLjA3OC0uMDQxLS4wNjJhLjE3Mi4xNzIgMCAwIDAtLjA5My4wMjVjLS4wNTUuMDQyLS4yNDEuMTI0LS4yNjMuMjktLjAxMi4zMy4yNDUuNTg5LjQuNTIzLjA3Mi0uMDUuMTUzLjAwNS4yNzMtLjAyMmEuMjMyLjIzMiAwIDAgMCAuMDg2LS4yNjMuNDE2LjQxNiAwIDEgMSAuODA2LS4xMjdsLS4wMTEuMjI0YTEuMSAxLjEgMCAwIDEtLjQxNS44MDkgMS4yNTggMS4yNTggMCAwIDEtLjkuMTMgMS4wMzkgMS4wMzkgMCAwIDEtLjcxMi0uNTUyIDEuNDggMS40OCAwIDAgMS0uMTQ5LS44LjkxMi45MTIgMCAwIDEgLjMzOC0uODI5Ljk4Ni45ODYgMCAwIDEgLjUyOC0uMTExYy4wODYuMDI2LjE2Mi0uMDE2LjI0NS0uMDIxYS43NjIuNzYyIDAgMCAxIC4yMTEuMDk0IDIuODg2IDIuODg2IDAgMCAxIC4zMDkuMjU3Yy4xLjA2OC4yNTkuMTA2LjMyMy4yMjhhMS4wOTIgMS4wOTIgMCAwIDEgLjIyNS44LjQuNCAwIDAgMS0uNzg1LS4wMTV6IiBmaWxsPSIjZmZjNzU3Ii8+PC9zdmc+Cg==';
5163
5164var styles$38 = {
5165 "Image": "p_d9",
5166};
5167
5168class EmptySearchResult$1 extends React.PureComponent {
5169 render() {
5170 var _props = this.props;
5171 const title = _props.title,
5172 description = _props.description,
5173 withIllustration = _props.withIllustration,
5174 intl = _props.polaris.intl;
5175
5176 const altText = intl.translate('Polaris.EmptySearchResult.altText');
5177 const descriptionMarkup = description ? React.createElement(
5178 'p',
5179 null,
5180 description
5181 ) : null;
5182 const illustrationMarkup = withIllustration ? React.createElement(Image$1, { alt: altText, source: emptySearch, className: styles$38.Image, draggable: false }) : null;
5183 return React.createElement(
5184 Stack$1,
5185 { alignment: 'center', vertical: true },
5186 illustrationMarkup,
5187 React.createElement(
5188 DisplayText$1,
5189 { size: 'small' },
5190 title
5191 ),
5192 React.createElement(
5193 TextStyle$1,
5194 { variation: 'subdued' },
5195 descriptionMarkup
5196 )
5197 );
5198 }
5199}
5200var EmptySearchResult$2 = withAppProvider()(EmptySearchResult$1);
5201
5202var styles$39 = {
5203 "EmptyState": "p_l6",
5204 "imageContained": "p_pv",
5205 "Image": "p_e5",
5206 "Section": "p_cs",
5207 "ImageContainer": "p_ms",
5208 "DetailsContainer": "p_fg",
5209 "Details": "p_p5",
5210 "Content": "p_un",
5211 "Actions": "p_pw",
5212};
5213
5214class EmptyState$1 extends React.PureComponent {
5215 render() {
5216 var _props = this.props;
5217 const children = _props.children,
5218 heading = _props.heading,
5219 image = _props.image,
5220 largeImage = _props.largeImage,
5221 imageContained = _props.imageContained,
5222 action = _props.action,
5223 secondaryAction = _props.secondaryAction;
5224
5225 const className = styles.classNames(styles$39.EmptyState, imageContained && styles$39.imageContained);
5226 const imageMarkup = largeImage ? React.createElement(Image$1, { alt: '', role: 'presentation', className: styles$39.Image, source: largeImage, sourceSet: [{ source: image, descriptor: '568w' }, { source: largeImage, descriptor: '1136w' }], sizes: '(max-width: 568px) 60vw' }) : React.createElement(Image$1, { role: 'presentation', alt: '', className: styles$39.Image, source: image });
5227 const secondaryActionMarkup = secondaryAction ? buttonFrom(secondaryAction, { plain: true }) : null;
5228 return React.createElement(
5229 'div',
5230 { className: className },
5231 React.createElement(
5232 'div',
5233 { className: styles$39.Section },
5234 React.createElement(
5235 'div',
5236 { className: styles$39.DetailsContainer },
5237 React.createElement(
5238 'div',
5239 { className: styles$39.Details },
5240 React.createElement(
5241 TextContainer$1,
5242 null,
5243 React.createElement(
5244 DisplayText$1,
5245 { size: 'medium' },
5246 heading
5247 ),
5248 React.createElement(
5249 'div',
5250 { className: styles$39.Content },
5251 children
5252 )
5253 ),
5254 React.createElement(
5255 'div',
5256 { className: styles$39.Actions },
5257 React.createElement(
5258 Stack$1,
5259 { alignment: 'center' },
5260 buttonFrom(action, { primary: true, size: 'large' }),
5261 secondaryActionMarkup
5262 )
5263 )
5264 )
5265 ),
5266 React.createElement(
5267 'div',
5268 { className: styles$39.ImageContainer },
5269 imageMarkup
5270 )
5271 )
5272 );
5273 }
5274}
5275
5276var styles$40 = {
5277 "Truncate": "p_mz",
5278};
5279
5280function Truncate$1({ children }) {
5281 return React.createElement(
5282 'span',
5283 { className: styles$40.Truncate },
5284 children
5285 );
5286}
5287
5288var styles$41 = {
5289 "ExceptionList": "p_l4",
5290 "Item": "p_v1",
5291 "Icon": "p_k6",
5292 "statusWarning": "p_ff",
5293 "statusCritical": "p_nm",
5294 "Bullet": "p_kf",
5295 "Title": "p_zf",
5296 "Description": "p_cg",
5297};
5298
5299function ExceptionList$1({ items: itemsList }) {
5300 const items = itemsList.map((item, index) => {
5301 const status = item.status,
5302 icon = item.icon,
5303 title = item.title,
5304 description = item.description;
5305 var _item$truncate = item.truncate;
5306 const truncate = _item$truncate === undefined ? false : _item$truncate;
5307
5308 const itemClasses = styles.classNames(styles$41.Item, status && styles$41[styles.variationName('status', status)]);
5309 const iconMarkup = icon ? React.createElement(Icon$2, { source: icon }) : React.createElement('span', { className: styles$41.Bullet });
5310 const titleMarkup = title && React.createElement(
5311 'span',
5312 { className: styles$41.Title },
5313 title
5314 );
5315 const descriptionMarkup = description && React.createElement(
5316 'span',
5317 { className: styles$41.Description },
5318 description
5319 );
5320 const Element = truncate ? Truncate$1 : React.Fragment;
5321 return React.createElement(
5322 'li',
5323 { className: itemClasses, key: index },
5324 React.createElement(
5325 'span',
5326 { className: styles$41.Icon },
5327 iconMarkup
5328 ),
5329 React.createElement(
5330 Element,
5331 null,
5332 titleMarkup,
5333 descriptionMarkup
5334 )
5335 );
5336 });
5337 return React.createElement(
5338 'ul',
5339 { className: styles$41.ExceptionList },
5340 items
5341 );
5342}
5343
5344class Form$1 extends React.PureComponent {
5345 render() {
5346 var _props = this.props;
5347 const acceptCharset = _props.acceptCharset,
5348 action = _props.action,
5349 autoComplete = _props.autoComplete,
5350 children = _props.children,
5351 encType = _props.encType;
5352 var _props$implicitSubmit = _props.implicitSubmit;
5353 const implicitSubmit = _props$implicitSubmit === undefined ? true : _props$implicitSubmit,
5354 method = _props.method,
5355 name = _props.name,
5356 noValidate = _props.noValidate,
5357 target$$1 = _props.target;
5358
5359 const autoCompleteInputs = normalizeAutoComplete(autoComplete);
5360 const submitMarkup = implicitSubmit ? React.createElement(
5361 VisuallyHidden$1,
5362 null,
5363 React.createElement('button', { type: 'submit', 'aria-hidden': 'true' })
5364 ) : null;
5365 return React.createElement(
5366 'form',
5367 { acceptCharset: acceptCharset, action: action, autoComplete: autoCompleteInputs, encType: encType, method: method, name: name, noValidate: noValidate, target: target$$1, onSubmit: this.handleSubmit },
5368 children,
5369 submitMarkup
5370 );
5371 }
5372 handleSubmit(event) {
5373 var _props2 = this.props,
5374 _props2$preventDefaul = _props2.preventDefault;
5375 const preventDefault = _props2$preventDefaul === undefined ? true : _props2$preventDefaul,
5376 onSubmit = _props2.onSubmit;
5377
5378 if (!preventDefault) {
5379 return;
5380 }
5381 event.preventDefault();
5382 onSubmit(event);
5383 }
5384}
5385tslib_1.__decorate([decorators.autobind], Form$1.prototype, "handleSubmit", null);
5386function normalizeAutoComplete(autoComplete) {
5387 if (autoComplete == null) {
5388 return autoComplete;
5389 }
5390 return autoComplete ? 'on' : 'off';
5391}
5392
5393var styles$42 = {
5394 "DateTextField": "p_nv",
5395 "DatePicker": "p_uh",
5396};
5397
5398const VALID_DATE_REGEX = /^\d{4}-\d{1,2}-\d{1,2}$/;
5399var DateFilterOption;
5400(function (DateFilterOption) {
5401 DateFilterOption["PastWeek"] = "past_week";
5402 DateFilterOption["PastMonth"] = "past_month";
5403 DateFilterOption["PastQuarter"] = "past_quarter";
5404 DateFilterOption["PastYear"] = "past_year";
5405 DateFilterOption["ComingWeek"] = "coming_week";
5406 DateFilterOption["ComingMonth"] = "coming_month";
5407 DateFilterOption["ComingQuarter"] = "coming_quarter";
5408 DateFilterOption["ComingYear"] = "coming_year";
5409 DateFilterOption["OnOrBefore"] = "on_or_before";
5410 DateFilterOption["OnOrAfter"] = "on_or_after";
5411})(DateFilterOption || (DateFilterOption = {}));
5412class DateSelector$1 extends React.PureComponent {
5413 constructor() {
5414 super(...arguments);
5415 this.state = {
5416 datePickerMonth: this.now.getMonth(),
5417 datePickerYear: this.now.getFullYear(),
5418 initialConsumerFilterKey: this.props.filterKey
5419 };
5420 }
5421 render() {
5422 var _props = this.props;
5423 const filterValue = _props.filterValue,
5424 filterKey = _props.filterKey,
5425 filterMinKey = _props.filterMinKey,
5426 filterMaxKey = _props.filterMaxKey,
5427 dateOptionType = _props.dateOptionType,
5428 intl = _props.polaris.intl;
5429 var _state = this.state;
5430 const selectedDate = _state.selectedDate,
5431 datePickerMonth = _state.datePickerMonth,
5432 datePickerYear = _state.datePickerYear,
5433 userInputDateError = _state.userInputDateError;
5434
5435 const dateFilterOption = getDateFilterOption(filterValue, filterKey, filterMinKey, filterMaxKey);
5436 const showDatePredicate = dateFilterOption === DateFilterOption.OnOrBefore || dateFilterOption === DateFilterOption.OnOrAfter;
5437 const datePredicateMarkup = showDatePredicate && React.createElement(
5438 React.Fragment,
5439 null,
5440 React.createElement(
5441 'div',
5442 { className: styles$42.DateTextField },
5443 React.createElement(TextField$1, { label: intl.translate('Polaris.ResourceList.DateSelector.dateValueLabel'), placeholder: intl.translate('Polaris.ResourceList.DateSelector.dateValuePlaceholder'), value: this.dateTextFieldValue, error: userInputDateError, prefix: React.createElement(Icon$2, { source: 'calendar', color: 'skyDark' }), autoComplete: false, onChange: this.handleDateFieldChange, onBlur: this.handleDateBlur })
5444 ),
5445 React.createElement(
5446 'div',
5447 { className: styles$42.DatePicker },
5448 React.createElement(DatePicker$2, { selected: selectedDate, month: datePickerMonth, year: datePickerYear, onChange: this.handleDatePickerChange, onMonthChange: this.handleDatePickerMonthChange })
5449 )
5450 );
5451 return React.createElement(
5452 React.Fragment,
5453 null,
5454 React.createElement(Select$1, { label: intl.translate('Polaris.ResourceList.DateSelector.SelectOptions.dateFilterLabel'), labelHidden: true, options: dateOptionType ? this.dateOptionTypes[dateOptionType] : this.dateOptionTypes.full, placeholder: intl.translate('Polaris.ResourceList.FilterValueSelector.selectFilterValuePlaceholder'), value: dateFilterOption, onChange: this.handleDateFilterOptionsChange }),
5455 datePredicateMarkup
5456 );
5457 }
5458 get dateComparatorOptions() {
5459 const intl = this.props.polaris.intl;
5460
5461 return [{
5462 value: DateFilterOption.OnOrBefore,
5463 label: intl.translate('Polaris.ResourceList.DateSelector.SelectOptions.OnOrBefore')
5464 }, {
5465 value: DateFilterOption.OnOrAfter,
5466 label: intl.translate('Polaris.ResourceList.DateSelector.SelectOptions.OnOrAfter')
5467 }];
5468 }
5469 get datePastOptions() {
5470 const intl = this.props.polaris.intl;
5471
5472 return [{
5473 value: DateFilterOption.PastWeek,
5474 label: intl.translate('Polaris.ResourceList.DateSelector.SelectOptions.PastWeek')
5475 }, {
5476 value: DateFilterOption.PastMonth,
5477 label: intl.translate('Polaris.ResourceList.DateSelector.SelectOptions.PastMonth')
5478 }, {
5479 value: DateFilterOption.PastQuarter,
5480 label: intl.translate('Polaris.ResourceList.DateSelector.SelectOptions.PastQuarter')
5481 }, {
5482 value: DateFilterOption.PastYear,
5483 label: intl.translate('Polaris.ResourceList.DateSelector.SelectOptions.PastYear')
5484 }];
5485 }
5486 get dateFutureOptions() {
5487 const intl = this.props.polaris.intl;
5488
5489 return [{
5490 value: DateFilterOption.ComingWeek,
5491 label: intl.translate('Polaris.ResourceList.DateSelector.SelectOptions.ComingWeek')
5492 }, {
5493 value: DateFilterOption.ComingMonth,
5494 label: intl.translate('Polaris.ResourceList.DateSelector.SelectOptions.ComingMonth')
5495 }, {
5496 value: DateFilterOption.ComingQuarter,
5497 label: intl.translate('Polaris.ResourceList.DateSelector.SelectOptions.ComingQuarter')
5498 }, {
5499 value: DateFilterOption.ComingYear,
5500 label: intl.translate('Polaris.ResourceList.DateSelector.SelectOptions.ComingYear')
5501 }];
5502 }
5503 get dateOptionTypes() {
5504 return {
5505 past: [...this.datePastOptions, ...this.dateComparatorOptions],
5506 future: [...this.dateFutureOptions, ...this.dateComparatorOptions],
5507 full: [...this.datePastOptions, ...this.dateFutureOptions, ...this.dateComparatorOptions]
5508 };
5509 }
5510 get now() {
5511 return new Date();
5512 }
5513 get dateTextFieldValue() {
5514 var _state2 = this.state;
5515 const userInputDate = _state2.userInputDate,
5516 selectedDate = _state2.selectedDate;
5517
5518 if (!userInputDate && !selectedDate) {
5519 return undefined;
5520 }
5521 if (userInputDate !== undefined) {
5522 return userInputDate;
5523 }
5524 if (selectedDate) {
5525 return formatDateValue(selectedDate);
5526 }
5527 }
5528 handleDateFilterOptionsChange(newOption) {
5529 var _props2 = this.props;
5530 const onFilterValueChange = _props2.onFilterValueChange,
5531 onFilterKeyChange = _props2.onFilterKeyChange,
5532 filterMinKey = _props2.filterMinKey,
5533 filterMaxKey = _props2.filterMaxKey;
5534 var _state3 = this.state;
5535 const initialConsumerFilterKey = _state3.initialConsumerFilterKey,
5536 selectedDate = _state3.selectedDate;
5537
5538 if (!initialConsumerFilterKey) {
5539 return;
5540 }
5541 if (newOption === DateFilterOption.OnOrBefore) {
5542 onFilterKeyChange(filterMaxKey);
5543 onFilterValueChange(selectedDate ? formatDateValue(selectedDate) : undefined);
5544 return;
5545 }
5546 if (newOption === DateFilterOption.OnOrAfter) {
5547 onFilterKeyChange(filterMinKey);
5548 onFilterValueChange(selectedDate ? formatDateValue(selectedDate) : undefined);
5549 return;
5550 }
5551 onFilterKeyChange(initialConsumerFilterKey);
5552 onFilterValueChange(newOption);
5553 }
5554 handleDateFieldChange(value) {
5555 const onFilterValueChange = this.props.onFilterValueChange;
5556 const userInputDateError = this.state.userInputDateError;
5557
5558 if (value.length === 0) {
5559 this.setState({
5560 selectedDate: undefined
5561 }, () => {
5562 onFilterValueChange(undefined);
5563 });
5564 }
5565 if (userInputDateError && isValidDate(value)) {
5566 this.setState({
5567 userInputDateError: undefined
5568 });
5569 }
5570 this.setState({
5571 userInputDate: value
5572 });
5573 }
5574 handleDateBlur() {
5575 var _props3 = this.props;
5576 const intl = _props3.polaris.intl,
5577 onFilterValueChange = _props3.onFilterValueChange;
5578
5579 if (!this.dateTextFieldValue || !isValidDate(this.dateTextFieldValue)) {
5580 this.setState({
5581 selectedDate: undefined,
5582 userInputDateError: intl.translate('Polaris.ResourceList.DateSelector.dateValueError')
5583 });
5584 onFilterValueChange(undefined);
5585 return;
5586 }
5587 const userInputDate = this.state.userInputDate;
5588
5589 if (!userInputDate) {
5590 return;
5591 }
5592 const nextDate = new Date(userInputDate.replace(/-/g, '/'));
5593 this.setState({
5594 selectedDate: nextDate,
5595 datePickerMonth: nextDate.getMonth(),
5596 datePickerYear: nextDate.getFullYear(),
5597 userInputDate: undefined,
5598 userInputDateError: undefined
5599 }, this.handleDateChanged);
5600 }
5601 handleDateChanged() {
5602 const onFilterValueChange = this.props.onFilterValueChange;
5603 const selectedDate = this.state.selectedDate;
5604
5605 if (!selectedDate) {
5606 return;
5607 }
5608 onFilterValueChange(formatDateValue(selectedDate));
5609 }
5610 handleDatePickerChange({ end: nextDate }) {
5611 this.setState({
5612 selectedDate: new Date(nextDate),
5613 userInputDate: undefined,
5614 userInputDateError: undefined
5615 }, this.handleDateChanged);
5616 }
5617 handleDatePickerMonthChange(month, year) {
5618 this.setState({ datePickerMonth: month, datePickerYear: year });
5619 }
5620}
5621tslib_1.__decorate([decorators.autobind], DateSelector$1.prototype, "handleDateFilterOptionsChange", null);
5622tslib_1.__decorate([decorators.autobind], DateSelector$1.prototype, "handleDateFieldChange", null);
5623tslib_1.__decorate([decorators.autobind], DateSelector$1.prototype, "handleDateBlur", null);
5624tslib_1.__decorate([decorators.autobind], DateSelector$1.prototype, "handleDatePickerChange", null);
5625tslib_1.__decorate([decorators.autobind], DateSelector$1.prototype, "handleDatePickerMonthChange", null);
5626function isValidDate(date) {
5627 if (!date) {
5628 return false;
5629 }
5630 return VALID_DATE_REGEX.test(date) && !isNaN(new Date(date).getTime());
5631}
5632function getDateFilterOption(filterValue, filterKey, filterMinKey, filterMaxKey) {
5633 if (filterKey === filterMaxKey) {
5634 return DateFilterOption.OnOrBefore;
5635 }
5636 if (filterKey === filterMinKey) {
5637 return DateFilterOption.OnOrAfter;
5638 }
5639 return filterValue;
5640}
5641function formatDateValue(date) {
5642 return date.toISOString().slice(0, 10);
5643}
5644var DateSelector$2 = withAppProvider()(DateSelector$1);
5645
5646(function (FilterType) {
5647 FilterType[FilterType["Select"] = 0] = "Select";
5648 FilterType[FilterType["TextField"] = 1] = "TextField";
5649 FilterType[FilterType["DateSelector"] = 2] = "DateSelector";
5650})(exports.FilterType || (exports.FilterType = {}));
5651
5652class FilterValueSelector extends React.PureComponent {
5653 componentDidMount() {
5654 var _props$filter = this.props.filter;
5655 const operatorText = _props$filter.operatorText,
5656 type = _props$filter.type;
5657
5658 if (type === exports.FilterType.DateSelector || !operatorText || typeof operatorText === 'string' || operatorText.length === 0) {
5659 return;
5660 }
5661 this.handleOperatorOptionChange(operatorText[0].key);
5662 }
5663 render() {
5664 var _props = this.props;
5665 const filter = _props.filter,
5666 filterKey = _props.filterKey,
5667 value = _props.value,
5668 onChange = _props.onChange,
5669 onFilterKeyChange = _props.onFilterKeyChange,
5670 intl = _props.polaris.intl;
5671 const operatorText = filter.operatorText;
5672
5673 const showOperatorOptions = filter.type !== exports.FilterType.DateSelector && operatorText && typeof operatorText !== 'string';
5674 const operatorOptionsMarkup = showOperatorOptions ? React.createElement(Select$1, { label: filter.label, labelHidden: true, options: buildOperatorOptions(operatorText), value: filterKey, onChange: this.handleOperatorOptionChange }) : null;
5675 const selectedFilterLabel = typeof operatorText === 'string' ? operatorText : '';
5676 switch (filter.type) {
5677 case exports.FilterType.Select:
5678 return React.createElement(
5679 Stack$1,
5680 { vertical: true },
5681 operatorOptionsMarkup,
5682 React.createElement(Select$1, { label: selectedFilterLabel, options: filter.options, placeholder: intl.translate('Polaris.ResourceList.FilterValueSelector.selectFilterValuePlaceholder'), value: value, onChange: onChange })
5683 );
5684 case exports.FilterType.TextField:
5685 return React.createElement(
5686 Stack$1,
5687 { vertical: true },
5688 operatorOptionsMarkup,
5689 React.createElement(TextField$1, { label: selectedFilterLabel, value: value, type: filter.textFieldType, onChange: onChange })
5690 );
5691 case exports.FilterType.DateSelector:
5692 return React.createElement(DateSelector$2, { dateOptionType: filter.dateOptionType, filterValue: value, filterKey: filterKey, filterMinKey: filter.minKey, filterMaxKey: filter.maxKey, onFilterValueChange: onChange, onFilterKeyChange: onFilterKeyChange });
5693 default:
5694 return null;
5695 }
5696 }
5697 handleOperatorOptionChange(operatorKey) {
5698 var _props2 = this.props;
5699 const value = _props2.value,
5700 onChange = _props2.onChange,
5701 onFilterKeyChange = _props2.onFilterKeyChange;
5702
5703 onFilterKeyChange(operatorKey);
5704 if (!value) {
5705 return;
5706 }
5707 onChange(value);
5708 }
5709}
5710tslib_1.__decorate([decorators.autobind], FilterValueSelector.prototype, "handleOperatorOptionChange", null);
5711function buildOperatorOptions(operatorText) {
5712 if (!operatorText || typeof operatorText === 'string') {
5713 return [];
5714 }
5715 return operatorText.map(({ key, optionLabel }) => {
5716 return { value: key, label: optionLabel };
5717 });
5718}
5719var FilterValueSelector$1 = withAppProvider()(FilterValueSelector);
5720
5721class FilterCreator extends React.PureComponent {
5722 constructor() {
5723 super(...arguments);
5724 this.state = {
5725 popoverActive: false
5726 };
5727 this.node = null;
5728 }
5729 get canAddFilter() {
5730 return Boolean(this.state.selectedFilter && this.state.selectedFilterKey && this.state.selectedFilterValue);
5731 }
5732 render() {
5733 var _props = this.props;
5734 const filters = _props.filters,
5735 resourceName = _props.resourceName,
5736 disabled = _props.disabled,
5737 intl = _props.polaris.intl;
5738 var _state = this.state;
5739 const popoverActive = _state.popoverActive,
5740 selectedFilter = _state.selectedFilter,
5741 selectedFilterKey = _state.selectedFilterKey,
5742 selectedFilterValue = _state.selectedFilterValue;
5743
5744 const activator = React.createElement(
5745 Button$2,
5746 { onClick: this.togglePopover, disclosure: true, disabled: disabled, onFocus: this.handleButtonFocus },
5747 intl.translate('Polaris.ResourceList.FilterCreator.filterButtonLabel')
5748 );
5749 const filterOptions = filters.map(({ key, label }) => ({
5750 value: key,
5751 label
5752 }));
5753 const filterValueSelectionMarkup = selectedFilter ? React.createElement(FilterValueSelector$1, { filter: selectedFilter, filterKey: selectedFilterKey, value: selectedFilterValue, onFilterKeyChange: this.handleFilterKeyChange, onChange: this.handleFilterValueChange }) : null;
5754 const addFilterButtonMarkup = selectedFilter ? React.createElement(
5755 Button$2,
5756 { onClick: this.handleAddFilter, disabled: !this.canAddFilter },
5757 intl.translate('Polaris.ResourceList.FilterCreator.addFilterButtonLabel')
5758 ) : null;
5759 return React.createElement(
5760 Popover$1,
5761 { active: popoverActive, activator: activator, onClose: this.togglePopover, sectioned: true, fullHeight: true },
5762 React.createElement(
5763 Form$1,
5764 { onSubmit: this.handleAddFilter },
5765 React.createElement(
5766 FormLayout$1,
5767 null,
5768 React.createElement(Select$1, { label: intl.translate('Polaris.ResourceList.FilterCreator.showAllWhere', { resourceNamePlural: resourceName.plural.toLocaleLowerCase() }), placeholder: intl.translate('Polaris.ResourceList.FilterCreator.selectFilterKeyPlaceholder'), options: filterOptions, onChange: this.handleFilterKeyChange, value: selectedFilter && selectedFilter.key }),
5769 filterValueSelectionMarkup,
5770 addFilterButtonMarkup
5771 )
5772 )
5773 );
5774 }
5775 handleButtonFocus(...args) {
5776 const event = args[0];
5777 if (!this.node && event) {
5778 this.node = event.target;
5779 }
5780 }
5781 togglePopover() {
5782 this.setState(({ popoverActive }) => ({ popoverActive: !popoverActive }));
5783 }
5784 handleFilterKeyChange(filterKey) {
5785 const filters = this.props.filters;
5786
5787 const foundFilter = filters.find(filter => {
5788 const minKey = filter.minKey,
5789 maxKey = filter.maxKey,
5790 operatorText = filter.operatorText;
5791
5792 if (minKey || maxKey) {
5793 return filter.key === filterKey || minKey === filterKey || maxKey === filterKey;
5794 }
5795 if (operatorText && typeof operatorText !== 'string') {
5796 return filter.key === filterKey || operatorText.filter(({ key }) => key === filterKey).length === 1;
5797 }
5798 return filter.key === filterKey;
5799 });
5800 if (!foundFilter) {
5801 return;
5802 }
5803 this.setState({
5804 selectedFilter: foundFilter,
5805 selectedFilterKey: filterKey,
5806 selectedFilterValue: undefined
5807 });
5808 }
5809 handleFilterValueChange(filterValue) {
5810 this.setState({ selectedFilterValue: filterValue });
5811 }
5812 handleAddFilter() {
5813 const onAddFilter = this.props.onAddFilter;
5814 const selectedFilterKey = this.state.selectedFilterKey;
5815
5816 if (!onAddFilter || !this.canAddFilter || !selectedFilterKey) {
5817 return;
5818 }
5819 onAddFilter({
5820 key: selectedFilterKey,
5821 value: this.state.selectedFilterValue || ''
5822 });
5823 this.setState({
5824 popoverActive: false,
5825 selectedFilter: undefined,
5826 selectedFilterValue: undefined
5827 });
5828 if (this.node != null) {
5829 this.node.focus();
5830 }
5831 }
5832}
5833tslib_1.__decorate([decorators.autobind], FilterCreator.prototype, "handleButtonFocus", null);
5834tslib_1.__decorate([decorators.autobind], FilterCreator.prototype, "togglePopover", null);
5835tslib_1.__decorate([decorators.autobind], FilterCreator.prototype, "handleFilterKeyChange", null);
5836tslib_1.__decorate([decorators.autobind], FilterCreator.prototype, "handleFilterValueChange", null);
5837tslib_1.__decorate([decorators.autobind], FilterCreator.prototype, "handleAddFilter", null);
5838var FilterCreator$1 = withAppProvider()(FilterCreator);
5839
5840var styles$43 = {
5841 "Controls": "p_so",
5842 "Search": "p_qi",
5843 "AppliedFilters": "p_vg",
5844 "AppliedFilter": "p_us",
5845};
5846
5847var styles$44 = {
5848 "Select": "p_hd",
5849 "disabled": "p_ng",
5850 "Content": "p_e3",
5851 "InlineLabel": "p_gn",
5852 "Icon": "p_w1",
5853 "Backdrop": "p_tu",
5854 "error": "p_b6",
5855 "Input": "p_ir",
5856 "placeholder": "p_ok",
5857 "SelectedOption": "p_mj",
5858};
5859
5860const PLACEHOLDER_VALUE = '';
5861const getUniqueID$5 = other.createUniqueIDFactory('Select');
5862function Select$1({ options: optionsProp, groups: groupsProp, label, labelAction, labelHidden: labelHiddenProp, labelInline, disabled, helpText, placeholder, id = getUniqueID$5(), name, value = PLACEHOLDER_VALUE, error, onChange, onFocus, onBlur }) {
5863 const labelHidden = labelInline ? true : labelHiddenProp;
5864 const className = styles.classNames(styles$44.Select, error && styles$44.error, disabled && styles$44.disabled);
5865 const handleChange = onChange ? event => onChange(event.currentTarget.value, id) : undefined;
5866 const describedBy = [];
5867 if (helpText) {
5868 describedBy.push(helpTextID$1(id));
5869 }
5870 if (error) {
5871 describedBy.push(`${id}Error`);
5872 }
5873 if (groupsProp != null) {
5874 // eslint-disable-next-line no-console
5875 console.warn('Deprecation: the `groups` prop is deprecated and will be removed in the next major version. Pass groups to the `options` prop instead.');
5876 }
5877 const options = optionsProp || groupsProp || [];
5878 let normalizedOptions = options.map(normalizeOption);
5879 if (placeholder) {
5880 normalizedOptions = [{
5881 label: placeholder,
5882 value: PLACEHOLDER_VALUE,
5883 disabled: true
5884 }, ...normalizedOptions];
5885 }
5886 const inlineLabelMarkup = labelInline && React.createElement(
5887 'span',
5888 { className: styles$44.InlineLabel },
5889 label
5890 );
5891 const selectedOption = getSelectedOption(normalizedOptions, value);
5892 const contentMarkup = React.createElement(
5893 'div',
5894 { className: styles$44.Content, 'aria-hidden': true },
5895 inlineLabelMarkup,
5896 React.createElement(
5897 'span',
5898 { className: styles$44.SelectedOption },
5899 selectedOption
5900 ),
5901 React.createElement(
5902 'span',
5903 { className: styles$44.Icon },
5904 React.createElement(Icon$2, { source: 'arrowUpDown' })
5905 )
5906 );
5907 const optionsMarkup = normalizedOptions.map(renderOption);
5908 return React.createElement(
5909 Labelled$1,
5910 { id: id, label: label, error: error, action: labelAction, labelHidden: labelHidden, helpText: helpText },
5911 React.createElement(
5912 'div',
5913 { className: className },
5914 React.createElement(
5915 'select',
5916 { id: id, name: name, value: value, className: styles$44.Input, disabled: disabled, onFocus: onFocus, onBlur: onBlur, onChange: handleChange, 'aria-invalid': Boolean(error), 'aria-describedby': describedBy.length ? describedBy.join(' ') : undefined },
5917 optionsMarkup
5918 ),
5919 contentMarkup,
5920 React.createElement('div', { className: styles$44.Backdrop })
5921 )
5922 );
5923}
5924function isString(option) {
5925 return typeof option === 'string';
5926}
5927function isGroup(option) {
5928 return option.options != null;
5929}
5930function normalizeStringOption(option) {
5931 return {
5932 label: option,
5933 value: option
5934 };
5935}
5936/**
5937 * Converts a string option (and each string option in a Group) into
5938 * an Option object.
5939 */
5940function normalizeOption(option) {
5941 if (isString(option)) {
5942 return normalizeStringOption(option);
5943 } else if (isGroup(option)) {
5944 const title = option.title,
5945 options = option.options;
5946
5947 return {
5948 title,
5949 options: options.map(option => {
5950 return isString(option) ? normalizeStringOption(option) : option;
5951 })
5952 };
5953 }
5954 return option;
5955}
5956/**
5957 * Gets the text to display in the UI, for the currently selected option
5958 */
5959function getSelectedOption(options, value) {
5960 const flatOptions = flattenOptions(options);
5961 let selectedOption = flatOptions.find(option => value === option.value);
5962 if (selectedOption === undefined) {
5963 // Get the first visible option (not the hidden placeholder)
5964 selectedOption = flatOptions.find(option => !option.hidden);
5965 }
5966 return selectedOption ? selectedOption.label : '';
5967}
5968/**
5969 * Ungroups an options array
5970 */
5971function flattenOptions(options) {
5972 let flatOptions = [];
5973 options.forEach(optionOrGroup => {
5974 if (isGroup(optionOrGroup)) {
5975 flatOptions = flatOptions.concat(optionOrGroup.options);
5976 } else {
5977 flatOptions.push(optionOrGroup);
5978 }
5979 });
5980 return flatOptions;
5981}
5982function renderSingleOption(option) {
5983 const value = option.value,
5984 label = option.label,
5985 rest = tslib_1.__rest(option, ["value", "label"]);
5986
5987 return React.createElement(
5988 'option',
5989 Object.assign({ key: value, value: value }, rest),
5990 label
5991 );
5992}
5993function renderOption(optionOrGroup) {
5994 if (isGroup(optionOrGroup)) {
5995 const title = optionOrGroup.title,
5996 options = optionOrGroup.options;
5997
5998 return React.createElement(
5999 'optgroup',
6000 { label: title, key: title },
6001 options.map(renderSingleOption)
6002 );
6003 }
6004 return renderSingleOption(optionOrGroup);
6005}
6006
6007var selectIcon = {"viewBox":"0 0 20 20","body":"<path d=\"M9 14.41l-3.71-3.7 1.42-1.42L9 11.59l5.29-5.3 1.42 1.42L9 14.41zM17 2H3c-.55 0-1 .45-1 1v14c0 .55.45 1 1 1h14c.55 0 1-.45 1-1V3c0-.55-.45-1-1-1z\" />"};
6008
6009var styles$45 = {
6010 "CheckableButton": "p_mh",
6011 "CheckableButton-measuring": "p_ec",
6012 "CheckableButton-plain": "p_uc",
6013 "CheckableButton-selectMode": "p_uy",
6014 "CheckableButton-selected": "p_if",
6015 "Checkbox": "p_fw",
6016 "Label": "p_rs",
6017};
6018
6019function CheckableButton$1({ accessibilityLabel, label = '', onToggleAll, selected, selectMode, plain, measuring, disabled }) {
6020 const className = plain ? styles.classNames(styles$45.CheckableButton, styles$45['CheckableButton-plain']) : styles.classNames(styles$45.CheckableButton, selectMode && styles$45['CheckableButton-selectMode'], selected && styles$45['CheckableButton-selected'], measuring && styles$45['CheckableButton-measuring']);
6021 return React.createElement(
6022 'div',
6023 { className: className, onClick: onToggleAll },
6024 React.createElement(
6025 'div',
6026 { className: styles$45.Checkbox },
6027 React.createElement(Checkbox$2, { label: accessibilityLabel, labelHidden: true, checked: selected, disabled: disabled })
6028 ),
6029 React.createElement(
6030 'span',
6031 { className: styles$45.Label },
6032 label
6033 )
6034 );
6035}
6036var CheckableButton$2 = withAppProvider()(CheckableButton$1);
6037
6038var styles$46 = {
6039 "Button": "p_i8",
6040 "Group-measuring": "p_mt",
6041 "Group": "p_oc",
6042 "Group-entering": "p_m7",
6043 "Group-exiting": "p_zu",
6044 "Group-entered": "p_kt",
6045 "Group-exited": "p_oy",
6046 "Group-smallScreen": "p_ru",
6047 "Group-largeScreen": "p_cp",
6048 "ButtonGroup": "p_ni",
6049 "Button-cancel": "p_rl",
6050 "Popover": "p_sn",
6051 "ActionContent": "p_dp",
6052 "ActionIcon": "p_mb",
6053 "disabled": "p_js",
6054 "PaginatedSelectAll": "p_c1",
6055 "Slide": "p_gq",
6056 "Slide-appear": "p_hi",
6057 "Slide-enter": "p_gc",
6058 "Slide-exit": "p_bf",
6059 "Slide-appearing": "p_ii",
6060 "Slide-entering": "p_a1",
6061};
6062
6063class BulkActionButton extends React.PureComponent {
6064 componentDidMount() {
6065 const handleMeasurement = this.props.handleMeasurement;
6066
6067 if (handleMeasurement) {
6068 const bulkActionButtonNode = ReactDOM.findDOMNode(this);
6069 const width = bulkActionButtonNode instanceof Element && bulkActionButtonNode.getBoundingClientRect().width || 0;
6070 handleMeasurement(width);
6071 }
6072 }
6073 render() {
6074 var _props = this.props;
6075 const url = _props.url,
6076 external = _props.external,
6077 onAction = _props.onAction,
6078 content = _props.content,
6079 disclosure = _props.disclosure,
6080 accessibilityLabel = _props.accessibilityLabel,
6081 disabled = _props.disabled;
6082
6083 const disclosureIconMarkup = disclosure ? React.createElement(
6084 'span',
6085 { className: styles$46.ActionIcon },
6086 React.createElement(Icon$2, { source: 'caretDown' })
6087 ) : null;
6088 const contentMarkup = disclosureIconMarkup ? React.createElement(
6089 'span',
6090 { className: styles$46.ActionContent },
6091 React.createElement(
6092 'span',
6093 null,
6094 content
6095 ),
6096 disclosureIconMarkup
6097 ) : content;
6098 if (url) {
6099 return React.createElement(
6100 UnstyledLink$2,
6101 { external: external, url: url, onMouseUp: handleMouseUpByBlurring, className: styles$46.Button, 'aria-label': accessibilityLabel },
6102 contentMarkup
6103 );
6104 }
6105 const className = reactUtilities.classNames(styles$46.Button, disabled && styles$46.disabled);
6106 return React.createElement(
6107 'button',
6108 { className: className, onClick: onAction, onMouseUp: handleMouseUpByBlurring, 'aria-label': accessibilityLabel, type: 'button', disabled: disabled },
6109 contentMarkup
6110 );
6111 }
6112}
6113
6114const MAX_PROMOTED_ACTIONS = 2;
6115const slideClasses = {
6116 appear: styles.classNames(styles$46.Slide, styles$46['Slide-appear']),
6117 appearActive: styles.classNames(styles$46.Slide, styles$46['Slide-appearing']),
6118 enter: styles.classNames(styles$46.Slide, styles$46['Slide-enter']),
6119 enterActive: styles.classNames(styles$46.Slide, styles$46['Slide-entering']),
6120 exit: styles.classNames(styles$46.Slide, styles$46['Slide-exit'])
6121};
6122class BulkActions$1 extends React.PureComponent {
6123 constructor() {
6124 super(...arguments);
6125 this.state = {
6126 smallScreenPopoverVisible: false,
6127 largeScreenPopoverVisible: false,
6128 containerWidth: 0,
6129 measuring: true
6130 };
6131 this.promotedActionsWidths = [];
6132 this.bulkActionsWidth = 0;
6133 this.addedMoreActionsWidthForMeasuring = 0;
6134 }
6135 get numberOfPromotedActionsToRender() {
6136 const promotedActions = this.props.promotedActions;
6137 var _state = this.state;
6138 const containerWidth = _state.containerWidth,
6139 measuring = _state.measuring;
6140
6141 if (!promotedActions) {
6142 return 0;
6143 }
6144 if (containerWidth >= this.bulkActionsWidth || measuring) {
6145 return promotedActions.length;
6146 }
6147 let sufficientSpace = false;
6148 let counter = promotedActions.length - 1;
6149 let totalWidth = 0;
6150 while (!sufficientSpace && counter >= 0) {
6151 totalWidth += this.promotedActionsWidths[counter];
6152 const widthWithRemovedAction = this.bulkActionsWidth - totalWidth + this.addedMoreActionsWidthForMeasuring;
6153 if (containerWidth >= widthWithRemovedAction) {
6154 sufficientSpace = true;
6155 } else {
6156 counter--;
6157 }
6158 }
6159 return counter;
6160 }
6161 get hasActions() {
6162 var _props = this.props;
6163 const promotedActions = _props.promotedActions,
6164 actions = _props.actions;
6165
6166 return Boolean(promotedActions && promotedActions.length > 0 || actions && actions.length > 0);
6167 }
6168 get actionSections() {
6169 const actions = this.props.actions;
6170
6171 if (!actions || actions.length === 0) {
6172 return;
6173 }
6174 if (instanceOfBulkActionListSectionArray(actions)) {
6175 return actions;
6176 }
6177 if (instanceOfBulkActionArray(actions)) {
6178 return [{
6179 items: actions
6180 }];
6181 }
6182 }
6183 componentDidMount() {
6184 var _props2 = this.props;
6185 const actions = _props2.actions,
6186 promotedActions = _props2.promotedActions;
6187
6188 if (promotedActions && !actions && this.moreActionsNode) {
6189 this.addedMoreActionsWidthForMeasuring = this.moreActionsNode.getBoundingClientRect().width;
6190 }
6191 this.bulkActionsWidth = this.largeScreenButtonsNode ? this.largeScreenButtonsNode.getBoundingClientRect().width - this.addedMoreActionsWidthForMeasuring : 0;
6192 if (this.containerNode) {
6193 // eslint-disable-next-line react/no-did-mount-set-state
6194 this.setState({
6195 containerWidth: this.containerNode.getBoundingClientRect().width,
6196 measuring: false
6197 });
6198 }
6199 }
6200 render() {
6201 var _props3 = this.props;
6202 const selectMode = _props3.selectMode,
6203 accessibilityLabel = _props3.accessibilityLabel;
6204 var _props3$label = _props3.label;
6205 const label = _props3$label === undefined ? '' : _props3$label,
6206 onToggleAll = _props3.onToggleAll,
6207 selected = _props3.selected,
6208 disabled = _props3.disabled,
6209 promotedActions = _props3.promotedActions;
6210 var _props3$paginatedSele = _props3.paginatedSelectAllText;
6211 const paginatedSelectAllText = _props3$paginatedSele === undefined ? null : _props3$paginatedSele,
6212 paginatedSelectAllAction = _props3.paginatedSelectAllAction,
6213 intl = _props3.polaris.intl;
6214
6215 if (promotedActions && promotedActions.length > MAX_PROMOTED_ACTIONS) {
6216 // eslint-disable-next-line no-console
6217 console.warn(intl.translate('Polaris.ResourceList.BulkActions.warningMessage', {
6218 maxPromotedActions: MAX_PROMOTED_ACTIONS
6219 }));
6220 }
6221 var _state2 = this.state;
6222 const smallScreenPopoverVisible = _state2.smallScreenPopoverVisible,
6223 largeScreenPopoverVisible = _state2.largeScreenPopoverVisible,
6224 measuring = _state2.measuring;
6225
6226 const paginatedSelectAllActionMarkup = paginatedSelectAllAction ? React.createElement(
6227 Button$2,
6228 { onClick: paginatedSelectAllAction.onAction, plain: true, disabled: disabled },
6229 paginatedSelectAllAction.content
6230 ) : null;
6231 const paginatedSelectAllTextMarkup = paginatedSelectAllText && paginatedSelectAllAction ? React.createElement(
6232 'span',
6233 { 'aria-live': 'polite' },
6234 paginatedSelectAllText
6235 ) : paginatedSelectAllText;
6236 const paginatedSelectAllMarkup = paginatedSelectAllActionMarkup || paginatedSelectAllTextMarkup ? React.createElement(
6237 'div',
6238 { className: styles$46.PaginatedSelectAll },
6239 paginatedSelectAllTextMarkup,
6240 ' ',
6241 paginatedSelectAllActionMarkup
6242 ) : null;
6243 const cancelButtonClassName = styles.classNames(styles$46.Button, styles$46['Button-cancel']);
6244 const cancelButton = React.createElement(
6245 'button',
6246 { className: cancelButtonClassName
6247 // eslint-disable-next-line react/jsx-no-bind
6248 , onClick: this.setSelectMode.bind(this, false) },
6249 'Cancel'
6250 );
6251 const numberOfPromotedActionsToRender = this.numberOfPromotedActionsToRender;
6252 const allActionsPopover = this.hasActions ? React.createElement(
6253 'div',
6254 { className: styles$46.Popover, ref: this.setMoreActionsNode },
6255 React.createElement(
6256 Popover$1,
6257 { active: smallScreenPopoverVisible, activator: React.createElement(BulkActionButton, { disclosure: true, onAction: this.toggleSmallScreenPopover, content: intl.translate('Polaris.ResourceList.BulkActions.actionsActivatorLabel') }), onClose: this.toggleSmallScreenPopover },
6258 React.createElement(ActionList$1, { items: promotedActions, sections: this.actionSections, onActionAnyItem: this.toggleSmallScreenPopover })
6259 )
6260 ) : null;
6261 const promotedActionsMarkup = promotedActions && numberOfPromotedActionsToRender > 0 ? [...promotedActions].slice(0, numberOfPromotedActionsToRender).map((action, index) => React.createElement(BulkActionButton, Object.assign({}, action, { key: index, handleMeasurement: this.handleMeasurement }))) : null;
6262 const rolledInPromotedActions = promotedActions && numberOfPromotedActionsToRender < promotedActions.length ? [...promotedActions].slice(numberOfPromotedActionsToRender) : [];
6263 const activatorLabel = !promotedActions || promotedActions && numberOfPromotedActionsToRender === 0 && !measuring ? intl.translate('Polaris.ResourceList.BulkActions.actionsActivatorLabel') : intl.translate('Polaris.ResourceList.BulkActions.moreActionsActivatorLabel');
6264 let combinedActions = [];
6265 if (this.actionSections && rolledInPromotedActions.length > 0) {
6266 combinedActions = [{ items: rolledInPromotedActions }, ...this.actionSections];
6267 } else if (this.actionSections) {
6268 combinedActions = this.actionSections;
6269 } else if (rolledInPromotedActions.length > 0) {
6270 combinedActions = [{ items: rolledInPromotedActions }];
6271 }
6272 const actionsPopover = this.actionSections || rolledInPromotedActions.length > 0 || measuring ? React.createElement(
6273 'div',
6274 { className: styles$46.Popover, ref: this.setMoreActionsNode },
6275 React.createElement(
6276 Popover$1,
6277 { active: largeScreenPopoverVisible, activator: React.createElement(BulkActionButton, { disclosure: true, onAction: this.toggleLargeScreenPopover, content: activatorLabel, disabled: disabled }), onClose: this.toggleLargeScreenPopover },
6278 React.createElement(ActionList$1, { sections: combinedActions, onActionAnyItem: this.toggleLargeScreenPopover })
6279 )
6280 ) : null;
6281 const checkableButtonProps = {
6282 accessibilityLabel,
6283 label,
6284 selected,
6285 selectMode,
6286 onToggleAll,
6287 measuring,
6288 disabled
6289 };
6290 const smallScreenGroup = React.createElement(
6291 reactTransitionGroup.Transition,
6292 { timeout: 0, 'in': selectMode, key: 'smallGroup' },
6293 status => {
6294 const smallScreenGroupClassName = styles.classNames(styles$46.Group, styles$46['Group-smallScreen'], styles$46[`Group-${status}`]);
6295 return React.createElement(
6296 'div',
6297 { className: smallScreenGroupClassName },
6298 React.createElement(
6299 'div',
6300 { className: styles$46.ButtonGroup },
6301 React.createElement(
6302 reactTransitionGroup.CSSTransition,
6303 { 'in': selectMode, timeout: Duration.Base, classNames: slideClasses, appear: true },
6304 React.createElement(CheckableButton$2, checkableButtonProps)
6305 ),
6306 allActionsPopover,
6307 cancelButton
6308 ),
6309 paginatedSelectAllMarkup
6310 );
6311 }
6312 );
6313 const largeScreenGroup = React.createElement(
6314 reactTransitionGroup.Transition,
6315 { timeout: 0, 'in': selectMode, key: 'largeGroup' },
6316 status => {
6317 const largeScreenGroupClassName = styles.classNames(styles$46.Group, styles$46['Group-largeScreen'], !measuring && styles$46[`Group-${status}`], measuring && styles$46['Group-measuring']);
6318 return React.createElement(
6319 'div',
6320 { className: largeScreenGroupClassName },
6321 React.createElement(EventListener$1, { event: 'resize', handler: this.handleResize }),
6322 React.createElement(
6323 'div',
6324 { className: styles$46.ButtonGroup, ref: this.setLargeScreenButtonsNode },
6325 React.createElement(CheckableButton$2, checkableButtonProps),
6326 promotedActionsMarkup,
6327 actionsPopover
6328 ),
6329 paginatedSelectAllMarkup
6330 );
6331 }
6332 );
6333 return React.createElement(
6334 'div',
6335 { ref: this.setContainerNode },
6336 smallScreenGroup,
6337 largeScreenGroup
6338 );
6339 }
6340 setLargeScreenButtonsNode(node) {
6341 this.largeScreenButtonsNode = node;
6342 }
6343 setContainerNode(node) {
6344 this.containerNode = node;
6345 }
6346 setMoreActionsNode(node) {
6347 this.moreActionsNode = node;
6348 }
6349 setSelectMode(val) {
6350 const onSelectModeToggle = this.props.onSelectModeToggle;
6351
6352 if (onSelectModeToggle) {
6353 onSelectModeToggle(val);
6354 }
6355 }
6356 toggleSmallScreenPopover() {
6357 this.setState(({ smallScreenPopoverVisible }) => ({
6358 smallScreenPopoverVisible: !smallScreenPopoverVisible
6359 }));
6360 }
6361 toggleLargeScreenPopover() {
6362 this.setState(({ largeScreenPopoverVisible }) => ({
6363 largeScreenPopoverVisible: !largeScreenPopoverVisible
6364 }));
6365 }
6366 handleResize() {
6367 var _state3 = this.state;
6368 const smallScreenPopoverVisible = _state3.smallScreenPopoverVisible,
6369 largeScreenPopoverVisible = _state3.largeScreenPopoverVisible;
6370
6371 if (this.containerNode) {
6372 const containerWidth = this.containerNode.getBoundingClientRect().width;
6373 if (containerWidth > 0) {
6374 this.setState({ containerWidth });
6375 }
6376 }
6377 if (smallScreenPopoverVisible || largeScreenPopoverVisible) {
6378 this.setState({
6379 smallScreenPopoverVisible: false,
6380 largeScreenPopoverVisible: false
6381 });
6382 }
6383 }
6384 handleMeasurement(width) {
6385 const measuring = this.state.measuring;
6386
6387 if (measuring) {
6388 this.promotedActionsWidths.push(width);
6389 }
6390 }
6391}
6392tslib_1.__decorate([decorators.autobind], BulkActions$1.prototype, "setLargeScreenButtonsNode", null);
6393tslib_1.__decorate([decorators.autobind], BulkActions$1.prototype, "setContainerNode", null);
6394tslib_1.__decorate([decorators.autobind], BulkActions$1.prototype, "setMoreActionsNode", null);
6395tslib_1.__decorate([decorators.autobind], BulkActions$1.prototype, "setSelectMode", null);
6396tslib_1.__decorate([decorators.autobind], BulkActions$1.prototype, "toggleSmallScreenPopover", null);
6397tslib_1.__decorate([decorators.autobind], BulkActions$1.prototype, "toggleLargeScreenPopover", null);
6398tslib_1.__decorate([decorators.autobind, decorators.debounce(50, { trailing: true })], BulkActions$1.prototype, "handleResize", null);
6399tslib_1.__decorate([decorators.autobind], BulkActions$1.prototype, "handleMeasurement", null);
6400function instanceOfBulkActionListSectionArray(actions) {
6401 const validList = actions.filter(action => {
6402 return action.items;
6403 });
6404 return actions.length === validList.length;
6405}
6406function instanceOfBulkActionArray(actions) {
6407 const validList = actions.filter(action => {
6408 return !action.items;
6409 });
6410 return actions.length === validList.length;
6411}
6412var BulkActions$2 = withAppProvider()(BulkActions$1);
6413
6414const getUniqueID$7 = other.createUniqueIDFactory('portal-');
6415class Portal$1 extends React.PureComponent {
6416 constructor() {
6417 super(...arguments);
6418 this.portalId = this.props.idPrefix !== '' ? `${this.props.idPrefix}-${getUniqueID$7()}` : getUniqueID$7();
6419 }
6420 // eslint-disable-next-line react/no-deprecated
6421 componentWillMount() {
6422 if (target.isServer) {
6423 return;
6424 }
6425 this.portalNode = document.createElement('div');
6426 this.portalNode.setAttribute('data-portal-id', this.portalId);
6427 document.body.appendChild(this.portalNode);
6428 }
6429 componentWillUnmount() {
6430 if (target.isServer) {
6431 return;
6432 }
6433 document.body.removeChild(this.portalNode);
6434 }
6435 render() {
6436 if (target.isServer) {
6437 return null;
6438 }
6439 return ReactDOM.createPortal(this.props.children, this.portalNode);
6440 }
6441}
6442Portal$1.defaultProps = { idPrefix: '' };
6443
6444const contextTypes = {
6445 scrollToPosition: PropTypes.func
6446};
6447
6448class ScrollTo$1 extends React.Component {
6449 constructor() {
6450 super(...arguments);
6451 this.ref = React.createRef();
6452 }
6453 componentDidMount() {
6454 const scrollToPosition = this.context.scrollToPosition;
6455
6456 if (!scrollToPosition || !this.ref.current) {
6457 return;
6458 }
6459 scrollToPosition(this.ref.current.offsetTop);
6460 }
6461 render() {
6462 const getUniqueId = other.createUniqueIDFactory(`ScrollTo`);
6463 // eslint-disable-next-line jsx-a11y/anchor-is-valid
6464 return React.createElement('a', { id: getUniqueId(), ref: this.ref });
6465 }
6466}
6467ScrollTo$1.contextTypes = contextTypes;
6468
6469var styles$47 = {
6470 "Scrollable": "p_b3",
6471 "horizontal": "p_w0",
6472 "vertical": "p_ag",
6473 "hasTopShadow": "p_kg",
6474 "hasBottomShadow": "p_fp",
6475};
6476
6477const MAX_SCROLL_DISTANCE = 100;
6478const DELTA_THRESHOLD = 0.2;
6479const DELTA_PERCENTAGE = 0.2;
6480const EVENTS_TO_LOCK = ['scroll', 'touchmove', 'wheel'];
6481const PREFERS_REDUCED_MOTION = prefersReducedMotion();
6482class Scrollable$1 extends React.Component {
6483 constructor() {
6484 super(...arguments);
6485 this.state = {
6486 topShadow: false,
6487 bottomShadow: false,
6488 scrollPosition: 0
6489 };
6490 }
6491 static forNode(node) {
6492 return dom.closest(node, scrollable.selector) || document;
6493 }
6494 getChildContext() {
6495 return {
6496 scrollToPosition: this.scrollToPosition
6497 };
6498 }
6499 componentDidMount() {
6500 const polaris = this.props.polaris;
6501
6502 if (this.scrollArea == null) {
6503 return;
6504 }
6505 polaris.stickyManager.setContainer(this.scrollArea);
6506 events.addEventListener(this.scrollArea, 'scroll', () => {
6507 window.requestAnimationFrame(this.handleScroll);
6508 });
6509 events.addEventListener(window, 'resize', this.handleResize);
6510 window.requestAnimationFrame(() => {
6511 this.handleScroll();
6512 if (this.props.hint) {
6513 this.scrollHint();
6514 }
6515 });
6516 }
6517 componentWillUnmount() {
6518 const polaris = this.props.polaris;
6519
6520 if (this.scrollArea == null) {
6521 return;
6522 }
6523 events.removeEventListener(this.scrollArea, 'scroll', this.handleScroll);
6524 events.removeEventListener(window, 'resize', this.handleResize);
6525 polaris.stickyManager.removeScrollListener();
6526 }
6527 componentDidUpdate() {
6528 const scrollPosition = this.state.scrollPosition;
6529
6530 if (scrollPosition && this.scrollArea && scrollPosition > 0) {
6531 this.scrollArea.scrollTop = scrollPosition;
6532 }
6533 }
6534 render() {
6535 var _state = this.state;
6536 const topShadow = _state.topShadow,
6537 bottomShadow = _state.bottomShadow;
6538 const _a = this.props,
6539 children = _a.children,
6540 className = _a.className,
6541 horizontal = _a.horizontal;var _a$vertical = _a.vertical;
6542
6543 const vertical = _a$vertical === undefined ? true : _a$vertical,
6544 shadow = _a.shadow,
6545 hint = _a.hint,
6546 rest = tslib_1.__rest(_a, ["children", "className", "horizontal", "vertical", "shadow", "hint"]);
6547
6548 const finalClassName = styles.classNames(className, styles$47.Scrollable, vertical && styles$47.vertical, horizontal && styles$47.horizontal, topShadow && styles$47.hasTopShadow, bottomShadow && styles$47.hasBottomShadow);
6549 return React.createElement(
6550 'div',
6551 Object.assign({ className: finalClassName }, scrollable.props, rest, { ref: this.setScrollArea }),
6552 children
6553 );
6554 }
6555 setScrollArea(scrollArea) {
6556 this.scrollArea = scrollArea;
6557 }
6558 handleScroll() {
6559 const scrollArea = this.scrollArea;
6560 const shadow = this.props.shadow;
6561
6562 if (scrollArea == null) {
6563 return;
6564 }
6565 const scrollTop = scrollArea.scrollTop,
6566 clientHeight = scrollArea.clientHeight,
6567 scrollHeight = scrollArea.scrollHeight;
6568
6569 const shouldBottomShadow = Boolean(shadow && !(scrollTop + clientHeight >= scrollHeight));
6570 const shouldTopShadow = Boolean(shadow && scrollTop > 0);
6571 this.setState({
6572 topShadow: shouldTopShadow,
6573 bottomShadow: shouldBottomShadow,
6574 scrollPosition: scrollTop
6575 });
6576 }
6577 handleResize() {
6578 this.handleScroll();
6579 }
6580 scrollHint() {
6581 const scrollArea = this.scrollArea;
6582
6583 if (scrollArea == null) {
6584 return;
6585 }
6586 const clientHeight = scrollArea.clientHeight,
6587 scrollHeight = scrollArea.scrollHeight;
6588
6589 if (PREFERS_REDUCED_MOTION || this.state.scrollPosition > 0 || scrollHeight <= clientHeight) {
6590 return;
6591 }
6592 const scrollDistance = scrollHeight - clientHeight;
6593 this.toggleLock();
6594 this.setState({
6595 scrollPosition: scrollDistance > MAX_SCROLL_DISTANCE ? MAX_SCROLL_DISTANCE : scrollDistance
6596 }, () => {
6597 window.requestAnimationFrame(this.scrollStep);
6598 });
6599 }
6600 scrollStep() {
6601 this.setState(({ scrollPosition }) => {
6602 const delta = scrollPosition * DELTA_PERCENTAGE;
6603 return {
6604 scrollPosition: delta < DELTA_THRESHOLD ? 0 : scrollPosition - delta
6605 };
6606 }, () => {
6607 if (this.state.scrollPosition > 0) {
6608 window.requestAnimationFrame(this.scrollStep);
6609 } else {
6610 this.toggleLock(false);
6611 }
6612 });
6613 }
6614 toggleLock(shouldLock = true) {
6615 const scrollArea = this.scrollArea;
6616
6617 if (scrollArea == null) {
6618 return;
6619 }
6620 EVENTS_TO_LOCK.forEach(eventName => {
6621 if (shouldLock) {
6622 events.addEventListener(scrollArea, eventName, prevent);
6623 } else {
6624 events.removeEventListener(scrollArea, eventName, prevent);
6625 }
6626 });
6627 }
6628 scrollToPosition(scrollY) {
6629 this.setState({ scrollPosition: scrollY });
6630 }
6631}
6632Scrollable$1.childContextTypes = contextTypes;
6633Scrollable$1.ScrollTo = ScrollTo$1;
6634tslib_1.__decorate([decorators.autobind], Scrollable$1.prototype, "setScrollArea", null);
6635tslib_1.__decorate([decorators.autobind], Scrollable$1.prototype, "handleScroll", null);
6636tslib_1.__decorate([decorators.autobind, decorators.debounce(50, { trailing: true })], Scrollable$1.prototype, "handleResize", null);
6637tslib_1.__decorate([decorators.autobind], Scrollable$1.prototype, "scrollHint", null);
6638tslib_1.__decorate([decorators.autobind], Scrollable$1.prototype, "scrollStep", null);
6639tslib_1.__decorate([decorators.autobind], Scrollable$1.prototype, "scrollToPosition", null);
6640function prevent(evt) {
6641 evt.preventDefault();
6642}
6643function prefersReducedMotion() {
6644 try {
6645 return window.matchMedia('(prefers-reduced-motion: reduce)').matches;
6646 } catch (err) {
6647 return false;
6648 }
6649}
6650var Scrollable$2 = withSticky()(Scrollable$1);
6651
6652var styles$48 = {
6653 "Popover": "p_fr",
6654 "fullWidth": "p_ur",
6655 "Content": "p_ap",
6656 "measuring": "p_xf",
6657 "exiting": "p_lj",
6658 "positionedAbove": "p_eg",
6659 "Wrapper": "p_ia",
6660 "Content-fullHeight": "p_g8",
6661 "Pane": "p_rk",
6662 "Pane-fixed": "p_w9",
6663 "Section": "p_sk",
6664 "FocusTracker": "p_qy",
6665};
6666
6667function Section$5({ children }) {
6668 return React.createElement(
6669 'div',
6670 { className: styles$48.Section },
6671 children
6672 );
6673}
6674
6675function Pane$1({ fixed, sectioned, children }) {
6676 const className = styles.classNames(styles$48.Pane, fixed && styles$48['Pane-fixed']);
6677 const content = sectioned ? reactUtilities.wrapWithComponent(children, Section$5) : children;
6678 return fixed ? React.createElement(
6679 'div',
6680 { className: className },
6681 content
6682 ) : React.createElement(
6683 Scrollable$2,
6684 { hint: true, shadow: true, className: className },
6685 content
6686 );
6687}
6688
6689class KeypressListener$1 extends React.Component {
6690 componentDidMount() {
6691 events.addEventListener(document, 'keyup', this.handleKeyEvent);
6692 }
6693 componentWillUnmount() {
6694 events.removeEventListener(document, 'keyup', this.handleKeyEvent);
6695 }
6696 render() {
6697 return null;
6698 }
6699 handleKeyEvent(event) {
6700 var _props = this.props;
6701 const keyCode = _props.keyCode,
6702 handler = _props.handler;
6703
6704 if (event.keyCode === keyCode) {
6705 handler(event);
6706 }
6707 }
6708}
6709tslib_1.__decorate([decorators.autobind], KeypressListener$1.prototype, "handleKeyEvent", null);
6710
6711function calculateVerticalPosition(activatorRect, overlayRect, overlayMargins, scrollableContainerRect, containerRect, preferredPosition, fixed) {
6712 const activatorTop = activatorRect.top;
6713 const activatorBottom = activatorTop + activatorRect.height;
6714 const spaceAbove = activatorRect.top;
6715 const spaceBelow = containerRect.height - activatorRect.top - activatorRect.height;
6716 const desiredHeight = overlayRect.height;
6717 const verticalMargins = overlayMargins.activator + overlayMargins.container;
6718 const minimumSpaceToScroll = overlayMargins.container;
6719 const distanceToTopScroll = activatorRect.top - Math.max(scrollableContainerRect.top, 0);
6720 const distanceToBottomScroll = containerRect.top + Math.min(containerRect.height, scrollableContainerRect.top + scrollableContainerRect.height) - (activatorRect.top + activatorRect.height);
6721 const enoughSpaceFromTopScroll = distanceToTopScroll >= minimumSpaceToScroll;
6722 const enoughSpaceFromBottomScroll = distanceToBottomScroll >= minimumSpaceToScroll;
6723 const heightIfBelow = Math.min(spaceBelow, desiredHeight);
6724 const heightIfAbove = Math.min(spaceAbove, desiredHeight);
6725 const containerRectTop = fixed ? 0 : containerRect.top;
6726 const positionIfAbove = {
6727 height: heightIfAbove - verticalMargins,
6728 top: activatorTop + containerRectTop - heightIfAbove,
6729 positioning: 'above'
6730 };
6731 const positionIfBelow = {
6732 height: heightIfBelow - verticalMargins,
6733 top: activatorBottom + containerRectTop,
6734 positioning: 'below'
6735 };
6736 if (preferredPosition === 'above') {
6737 return (enoughSpaceFromTopScroll || distanceToTopScroll >= distanceToBottomScroll && !enoughSpaceFromBottomScroll) && (spaceAbove > desiredHeight || spaceAbove > spaceBelow) ? positionIfAbove : positionIfBelow;
6738 }
6739 if (preferredPosition === 'below') {
6740 return (enoughSpaceFromBottomScroll || distanceToBottomScroll >= distanceToTopScroll && !enoughSpaceFromTopScroll) && (spaceBelow > desiredHeight || spaceBelow > spaceAbove) ? positionIfBelow : positionIfAbove;
6741 }
6742 if (enoughSpaceFromTopScroll && enoughSpaceFromBottomScroll) {
6743 return spaceAbove > spaceBelow ? positionIfAbove : positionIfBelow;
6744 }
6745 return distanceToTopScroll > minimumSpaceToScroll ? positionIfAbove : positionIfBelow;
6746}
6747function calculateHorizontalPosition(activatorRect, overlayRect, containerRect, overlayMargins, preferredAlignment) {
6748 const maximum = containerRect.width - overlayRect.width;
6749 if (preferredAlignment === 'left') {
6750 return Math.min(maximum, Math.max(0, activatorRect.left - overlayMargins.horizontal));
6751 } else if (preferredAlignment === 'right') {
6752 const activatorRight = activatorRect.left + activatorRect.width;
6753 return Math.min(maximum, Math.max(0, activatorRight - overlayRect.width + overlayMargins.horizontal));
6754 }
6755 return Math.min(maximum, Math.max(0, activatorRect.center.x - overlayRect.width / 2));
6756}
6757function rectIsOutsideOfRect(inner, outer) {
6758 const center = inner.center;
6759
6760 return center.y < outer.top || center.y > outer.top + outer.height;
6761}
6762
6763var styles$49 = {
6764 "PositionedOverlay": "p_gv",
6765 "fixed": "p_gu",
6766 "calculating": "p_vm",
6767};
6768
6769class PositionedOverlay$1 extends React.PureComponent {
6770 constructor() {
6771 super(...arguments);
6772 this.state = {
6773 measuring: true,
6774 activatorRect: geometry.getRectForNode(this.props.activator),
6775 left: 0,
6776 top: 0,
6777 height: 0,
6778 width: null,
6779 positioning: 'below',
6780 zIndex: null,
6781 outsideScrollableContainer: false,
6782 lockPosition: false
6783 };
6784 this.overlay = null;
6785 this.scrollableContainer = null;
6786 }
6787 componentDidMount() {
6788 this.scrollableContainer = Scrollable$2.forNode(this.props.activator);
6789 if (this.scrollableContainer && !this.props.fixed) {
6790 this.scrollableContainer.addEventListener('scroll', this.handleMeasurement);
6791 }
6792 this.handleMeasurement();
6793 }
6794 componentWillUnmount() {
6795 if (this.scrollableContainer && !this.props.fixed) {
6796 this.scrollableContainer.removeEventListener('scroll', this.handleMeasurement);
6797 }
6798 }
6799 // eslint-disable-next-line react/no-deprecated
6800 componentWillReceiveProps() {
6801 this.handleMeasurement();
6802 }
6803 componentDidUpdate() {
6804 var _state = this.state;
6805 const outsideScrollableContainer = _state.outsideScrollableContainer,
6806 top = _state.top;
6807 var _props = this.props;
6808 const onScrollOut = _props.onScrollOut,
6809 active = _props.active;
6810
6811 if (active && onScrollOut != null && top !== 0 && outsideScrollableContainer) {
6812 onScrollOut();
6813 }
6814 }
6815 render() {
6816 var _state2 = this.state;
6817 const left = _state2.left,
6818 top = _state2.top,
6819 zIndex = _state2.zIndex,
6820 width = _state2.width;
6821 var _props2 = this.props;
6822 const render = _props2.render,
6823 fixed = _props2.fixed;
6824
6825 const style = {
6826 top: top == null ? undefined : top,
6827 left: left == null ? undefined : left,
6828 width: width == null ? undefined : width,
6829 zIndex: zIndex == null ? undefined : zIndex
6830 };
6831 const className = styles.classNames(styles$49.PositionedOverlay, fixed && styles$49.fixed);
6832 return React.createElement(
6833 'div',
6834 { className: className, style: style, ref: this.setOverlay },
6835 React.createElement(EventListener$1, { event: 'resize', handler: this.handleMeasurement }),
6836 render(this.overlayDetails())
6837 );
6838 }
6839 overlayDetails() {
6840 var _state3 = this.state;
6841 const measuring = _state3.measuring,
6842 left = _state3.left,
6843 positioning = _state3.positioning,
6844 height = _state3.height,
6845 activatorRect = _state3.activatorRect;
6846
6847 return {
6848 measuring,
6849 left,
6850 desiredHeight: height,
6851 positioning,
6852 activatorRect
6853 };
6854 }
6855 setOverlay(node) {
6856 this.overlay = node;
6857 }
6858 handleMeasurement() {
6859 var _state4 = this.state;
6860 const lockPosition = _state4.lockPosition,
6861 top = _state4.top;
6862
6863 this.setState({
6864 left: 0,
6865 top: lockPosition ? top : 0,
6866 height: 0,
6867 positioning: 'below',
6868 measuring: true
6869 }, () => {
6870 if (this.overlay == null || this.scrollableContainer == null) {
6871 return;
6872 }
6873 var _props3 = this.props;
6874 const activator = _props3.activator;
6875 var _props3$preferredPosi = _props3.preferredPosition;
6876 const preferredPosition = _props3$preferredPosi === undefined ? 'below' : _props3$preferredPosi;
6877 var _props3$preferredAlig = _props3.preferredAlignment;
6878 const preferredAlignment = _props3$preferredAlig === undefined ? 'center' : _props3$preferredAlig,
6879 onScrollOut = _props3.onScrollOut,
6880 fullWidth = _props3.fullWidth,
6881 fixed = _props3.fixed;
6882
6883 const activatorRect = geometry.getRectForNode(activator);
6884 const currentOverlayRect = geometry.getRectForNode(this.overlay);
6885 const scrollableElement = isDocument$1(this.scrollableContainer) ? document.body : this.scrollableContainer;
6886 const scrollableContainerRect = geometry.getRectForNode(scrollableElement);
6887 const overlayRect = fullWidth ? Object.assign({}, currentOverlayRect, { width: activatorRect.width }) : currentOverlayRect;
6888 // If `body` is 100% height, it still acts as though it were not constrained
6889 // to that size. This adjusts for that.
6890 if (scrollableElement === document.body) {
6891 scrollableContainerRect.height = document.body.scrollHeight;
6892 }
6893 const overlayMargins = this.overlay.firstElementChild ? getMarginsForNode(this.overlay.firstElementChild) : { activator: 0, container: 0, horizontal: 0 };
6894 const containerRect = windowRect();
6895 const zIndexForLayer = getZIndexForLayerFromNode(activator);
6896 const zIndex = zIndexForLayer == null ? zIndexForLayer : zIndexForLayer + 1;
6897 const verticalPosition = calculateVerticalPosition(activatorRect, overlayRect, overlayMargins, scrollableContainerRect, containerRect, preferredPosition, fixed);
6898 const horizontalPosition = calculateHorizontalPosition(activatorRect, overlayRect, containerRect, overlayMargins, preferredAlignment);
6899 this.setState({
6900 measuring: false,
6901 activatorRect: geometry.getRectForNode(activator),
6902 left: horizontalPosition,
6903 top: lockPosition ? top : verticalPosition.top,
6904 lockPosition: Boolean(fixed),
6905 height: verticalPosition.height || 0,
6906 width: fullWidth ? overlayRect.width : null,
6907 positioning: verticalPosition.positioning,
6908 outsideScrollableContainer: onScrollOut != null && rectIsOutsideOfRect(activatorRect, intersectionWithViewport(scrollableContainerRect)),
6909 zIndex
6910 });
6911 });
6912 }
6913}
6914tslib_1.__decorate([decorators.autobind], PositionedOverlay$1.prototype, "overlayDetails", null);
6915tslib_1.__decorate([decorators.autobind], PositionedOverlay$1.prototype, "setOverlay", null);
6916tslib_1.__decorate([decorators.autobind], PositionedOverlay$1.prototype, "handleMeasurement", null);
6917function intersectionWithViewport(rect) {
6918 const viewport = windowRect();
6919 return new geometry.Rect({
6920 top: Math.max(rect.top, 0),
6921 left: Math.max(rect.left, 0),
6922 height: Math.min(rect.height - rect.top + viewport.top, viewport.height, viewport.height - rect.top),
6923 width: Math.min(rect.width - rect.left + viewport.left, viewport.width, viewport.width - rect.left)
6924 });
6925}
6926function getMarginsForNode(node) {
6927 const nodeStyles = window.getComputedStyle(node);
6928 return {
6929 activator: parseFloat(nodeStyles.marginTop || ''),
6930 container: parseFloat(nodeStyles.marginBottom || ''),
6931 horizontal: parseFloat(nodeStyles.marginLeft || '')
6932 };
6933}
6934function getZIndexForLayerFromNode(node) {
6935 const layerNode = dom.closest(node, layer.selector) || document.body;
6936 const zIndex = layerNode === document.body ? 'auto' : parseInt(window.getComputedStyle(layerNode).zIndex || '0', 10);
6937 return zIndex === 'auto' || isNaN(zIndex) ? null : zIndex;
6938}
6939function windowRect() {
6940 return new geometry.Rect({
6941 top: window.scrollY,
6942 left: window.scrollX,
6943 height: window.innerHeight,
6944 width: window.innerWidth
6945 });
6946}
6947function isDocument$1(node) {
6948 return node === document;
6949}
6950
6951(function (CloseSource) {
6952 CloseSource[CloseSource["Click"] = 0] = "Click";
6953 CloseSource[CloseSource["EscapeKeypress"] = 1] = "EscapeKeypress";
6954 CloseSource[CloseSource["FocusOut"] = 2] = "FocusOut";
6955 CloseSource[CloseSource["ScrollOut"] = 3] = "ScrollOut";
6956})(exports.PopoverCloseSource || (exports.PopoverCloseSource = {}));
6957class PopoverOverlay$1 extends React.PureComponent {
6958 constructor() {
6959 super(...arguments);
6960 this.contentNode = React.createRef();
6961 this.transitionStatus = null;
6962 }
6963 componentDidMount() {
6964 if (this.props.active) {
6965 this.focusContent();
6966 }
6967 }
6968 componentDidUpdate(oldProps) {
6969 if (this.props.active && !oldProps.active) {
6970 this.focusContent();
6971 }
6972 }
6973 render() {
6974 const active = this.props.active;
6975
6976 return React.createElement(
6977 reactTransitionGroup.Transition,
6978 { 'in': active, timeout: Duration.Fast, mountOnEnter: true, unmountOnExit: true },
6979 this.renderOverlay
6980 );
6981 }
6982 focusContent() {
6983 if (this.props.preventAutofocus) {
6984 return;
6985 }
6986 if (this.contentNode == null) {
6987 return;
6988 }
6989 fastdom.write(() => {
6990 if (this.contentNode.current == null) {
6991 return;
6992 }
6993 this.contentNode.current.focus();
6994 });
6995 }
6996 renderOverlay(transitionStatus) {
6997 var _props = this.props;
6998 const active = _props.active,
6999 activator = _props.activator,
7000 fullWidth = _props.fullWidth;
7001 var _props$preferredPosit = _props.preferredPosition;
7002 const preferredPosition = _props$preferredPosit === undefined ? 'below' : _props$preferredPosit;
7003 var _props$preferredAlign = _props.preferredAlignment;
7004 const preferredAlignment = _props$preferredAlign === undefined ? 'center' : _props$preferredAlign,
7005 fixed = _props.fixed;
7006
7007 return React.createElement(PositionedOverlay$1, { fullWidth: fullWidth, active: active, activator: activator, preferredPosition: preferredPosition, preferredAlignment: preferredAlignment
7008 // eslint-disable-next-line react/jsx-no-bind
7009 , render: this.renderPopover.bind(this, transitionStatus), fixed: fixed, onScrollOut: this.handleScrollOut });
7010 }
7011 renderPopover(transitionStatus, overlayDetails) {
7012 const measuring = overlayDetails.measuring,
7013 desiredHeight = overlayDetails.desiredHeight,
7014 positioning = overlayDetails.positioning;
7015 var _props2 = this.props;
7016 const id = _props2.id,
7017 children = _props2.children,
7018 sectioned = _props2.sectioned,
7019 fullWidth = _props2.fullWidth,
7020 fullHeight = _props2.fullHeight;
7021
7022 const className = styles.classNames(styles$48.Popover, transitionStatus && animationVariations(transitionStatus), positioning === 'above' && styles$48.positionedAbove, fullWidth && styles$48.fullWidth, measuring && styles$48.measuring);
7023 this.transitionStatus = transitionStatus;
7024 const contentStyles = measuring ? undefined : { height: desiredHeight };
7025 const contentClassNames = styles.classNames(styles$48.Content, fullHeight && styles$48['Content-fullHeight']);
7026 const content = React.createElement(
7027 'div',
7028 { id: id, tabIndex: -1, className: contentClassNames, style: contentStyles, ref: this.contentNode },
7029 renderPopoverContent(children, { sectioned })
7030 );
7031 return React.createElement(
7032 'div',
7033 Object.assign({ className: className }, overlay.props),
7034 React.createElement(EventListener$1, { event: 'click', handler: this.handleClick }),
7035 React.createElement(EventListener$1, { event: 'touchstart', handler: this.handleClick }),
7036 React.createElement(KeypressListener$1, { keyCode: exports.Keys.ESCAPE, handler: this.handleEscape }),
7037 React.createElement('div', { className: styles$48.FocusTracker
7038 // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
7039 , tabIndex: 0, onFocus: this.handleFocusFirstItem }),
7040 React.createElement(
7041 'div',
7042 { className: styles$48.Wrapper },
7043 content
7044 ),
7045 React.createElement('div', { className: styles$48.FocusTracker
7046 // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
7047 , tabIndex: 0, onFocus: this.handleFocusLastItem })
7048 );
7049 }
7050 handleClick(event) {
7051 const target$$1 = event.target;
7052 const contentNode = this.contentNode;
7053 var _props3 = this.props;
7054 const activator = _props3.activator,
7055 onClose = _props3.onClose;
7056
7057 const isDescendant = contentNode.current != null && dom.nodeContainsDescendant(contentNode.current, target$$1);
7058 const isActivatorDescendant = dom.nodeContainsDescendant(activator, target$$1);
7059 if (isDescendant || isActivatorDescendant || this.transitionStatus !== 'entered') {
7060 return;
7061 }
7062 onClose(exports.PopoverCloseSource.Click);
7063 }
7064 handleScrollOut() {
7065 this.props.onClose(exports.PopoverCloseSource.ScrollOut);
7066 }
7067 handleEscape() {
7068 this.props.onClose(exports.PopoverCloseSource.EscapeKeypress);
7069 }
7070 handleFocusFirstItem() {
7071 this.props.onClose(exports.PopoverCloseSource.FocusOut);
7072 }
7073 handleFocusLastItem() {
7074 this.props.onClose(exports.PopoverCloseSource.FocusOut);
7075 }
7076}
7077tslib_1.__decorate([decorators.autobind], PopoverOverlay$1.prototype, "renderOverlay", null);
7078tslib_1.__decorate([decorators.autobind], PopoverOverlay$1.prototype, "renderPopover", null);
7079tslib_1.__decorate([decorators.autobind], PopoverOverlay$1.prototype, "handleClick", null);
7080tslib_1.__decorate([decorators.autobind], PopoverOverlay$1.prototype, "handleScrollOut", null);
7081tslib_1.__decorate([decorators.autobind], PopoverOverlay$1.prototype, "handleEscape", null);
7082tslib_1.__decorate([decorators.autobind], PopoverOverlay$1.prototype, "handleFocusFirstItem", null);
7083tslib_1.__decorate([decorators.autobind], PopoverOverlay$1.prototype, "handleFocusLastItem", null);
7084function renderPopoverContent(children, props) {
7085 const childrenArray = React.Children.toArray(children);
7086 if (reactUtilities.isElementOfType(childrenArray[0], Pane$1)) {
7087 return childrenArray;
7088 }
7089 return reactUtilities.wrapWithComponent(childrenArray, Pane$1, props);
7090}
7091function animationVariations(status) {
7092 switch (status) {
7093 case 'exiting':
7094 return styles$48.exiting;
7095 default:
7096 return null;
7097 }
7098}
7099
7100const getUniqueID$6 = other.createUniqueIDFactory('Popover');
7101class Popover$1 extends React.PureComponent {
7102 constructor() {
7103 super(...arguments);
7104 this.state = {
7105 activatorNode: null
7106 };
7107 this.activatorContainer = null;
7108 this.id = getUniqueID$6();
7109 }
7110 componentDidMount() {
7111 this.setAccessibilityAttributes();
7112 }
7113 componentDidUpdate() {
7114 if (this.activatorContainer && this.state.activatorNode && !this.activatorContainer.contains(this.state.activatorNode)) {
7115 this.setActivator(this.activatorContainer);
7116 }
7117 this.setAccessibilityAttributes();
7118 }
7119 render() {
7120 const _a = this.props;var _a$activatorWrapper = _a.activatorWrapper;
7121 const WrapperComponent = _a$activatorWrapper === undefined ? 'div' : _a$activatorWrapper,
7122 children = _a.children,
7123 onClose = _a.onClose,
7124 activator = _a.activator,
7125 activatorWrapper = _a.activatorWrapper,
7126 active = _a.active,
7127 fixed = _a.fixed;
7128 var _a$preventAutofocus = _a.preventAutofocus;
7129 const preventAutofocus = _a$preventAutofocus === undefined ? true : _a$preventAutofocus,
7130 rest = tslib_1.__rest(_a, ["activatorWrapper", "children", "onClose", "activator", "activatorWrapper", "active", "fixed", "preventAutofocus"]);const activatorNode = this.state.activatorNode;
7131
7132 const portal = activatorNode ? React.createElement(
7133 Portal$1,
7134 { idPrefix: 'popover' },
7135 React.createElement(
7136 PopoverOverlay$1,
7137 Object.assign({ id: this.id, activator: activatorNode, onClose: this.handleClose, active: active, fixed: fixed, preventAutofocus: preventAutofocus }, rest),
7138 children
7139 )
7140 ) : null;
7141 return React.createElement(
7142 WrapperComponent,
7143 { ref: this.setActivator },
7144 React.Children.only(this.props.activator),
7145 portal
7146 );
7147 }
7148 setAccessibilityAttributes() {
7149 const id = this.id,
7150 activatorContainer = this.activatorContainer;
7151
7152 if (activatorContainer == null) {
7153 return;
7154 }
7155 const firstFocusable = focus.findFirstFocusableNode(activatorContainer);
7156 const focusableActivator = firstFocusable || activatorContainer;
7157 focusableActivator.tabIndex = focusableActivator.tabIndex || 0;
7158 focusableActivator.setAttribute('aria-controls', id);
7159 focusableActivator.setAttribute('aria-owns', id);
7160 focusableActivator.setAttribute('aria-haspopup', 'true');
7161 focusableActivator.setAttribute('aria-expanded', String(this.props.active));
7162 }
7163 handleClose(source) {
7164 this.props.onClose(source);
7165 if (this.activatorContainer == null) {
7166 return;
7167 }
7168 if (source === exports.PopoverCloseSource.FocusOut || source === exports.PopoverCloseSource.EscapeKeypress) {
7169 focus.focusFirstFocusableNode(this.activatorContainer, false);
7170 }
7171 }
7172 setActivator(node) {
7173 if (node == null) {
7174 this.activatorContainer = null;
7175 this.setState({ activatorNode: null });
7176 return;
7177 }
7178 this.setState({ activatorNode: node.firstElementChild });
7179 this.activatorContainer = node;
7180 }
7181}
7182Popover$1.Pane = Pane$1;
7183Popover$1.Section = Section$5;
7184tslib_1.__decorate([decorators.autobind], Popover$1.prototype, "handleClose", null);
7185tslib_1.__decorate([decorators.autobind], Popover$1.prototype, "setActivator", null);
7186
7187const SELECT_ALL_ITEMS = 'All';
7188
7189var styles$50 = {
7190 "CheckboxWrapper": "p_vq",
7191 "Item": "p_ja",
7192 "persistActions": "p_x8",
7193 "Actions": "p_lp",
7194 "selected": "p_k4",
7195 "focused": "p_l3",
7196 "focusedInner": "p_u5",
7197 "Link": "p_y8",
7198 "Button": "p_lz",
7199 "Container": "p_th",
7200 "Owned": "p_pu",
7201 "Handle": "p_ab",
7202 "selectable": "p_n1",
7203 "selectMode": "p_gw",
7204 "Media": "p_f8",
7205 "Content": "p_ba",
7206 "Disclosure": "p_di",
7207};
7208
7209const intl = new Intl(undefined);
7210
7211var _React$createContext$2 = React.createContext({
7212 selectMode: false,
7213 resourceName: {
7214 singular: intl.translate('Polaris.ResourceList.defaultItemSingular'),
7215 plural: intl.translate('Polaris.ResourceList.defaultItemPlural')
7216 }
7217});
7218
7219const Provider$2 = _React$createContext$2.Provider;
7220const Consumer$2 = _React$createContext$2.Consumer;
7221
7222const getUniqueCheckboxID = other.createUniqueIDFactory('ResourceListItemCheckbox');
7223class Item$9 extends React.PureComponent {
7224 constructor() {
7225 super(...arguments);
7226 this.state = {
7227 actionsMenuVisible: false,
7228 focused: false,
7229 focusedInner: false
7230 };
7231 this.node = null;
7232 this.checkboxId = getUniqueCheckboxID();
7233 }
7234 render() {
7235 var _props = this.props;
7236 const children = _props.children,
7237 url = _props.url,
7238 media = _props.media,
7239 shortcutActions = _props.shortcutActions,
7240 ariaControls = _props.ariaControls,
7241 ariaExpanded = _props.ariaExpanded;
7242 var _props$persistActions = _props.persistActions;
7243 const persistActions = _props$persistActions === undefined ? false : _props$persistActions,
7244 intl = _props.polaris.intl,
7245 accessibilityLabel = _props.accessibilityLabel;
7246 var _props$context = _props.context;
7247 const selectable = _props$context.selectable,
7248 selectMode = _props$context.selectMode,
7249 loading = _props$context.loading;
7250 var _state = this.state;
7251 const actionsMenuVisible = _state.actionsMenuVisible,
7252 focused = _state.focused,
7253 focusedInner = _state.focusedInner;
7254
7255 const selected = this.isSelected();
7256 // let mediaMarkup: React.ReactNode = null;
7257 let ownedMarkup = null;
7258 let handleMarkup = null;
7259 const mediaMarkup = media ? React.createElement(
7260 'div',
7261 { className: styles$50.Media },
7262 media
7263 ) : null;
7264 const checkboxAccessibilityLabel = accessibilityLabel || intl.translate('Polaris.Common.checkbox');
7265 if (selectable) {
7266 const label = selected ? intl.translate('Polaris.ResourceList.Item.deselectItem', {
7267 accessibilityLabel: checkboxAccessibilityLabel
7268 }) : intl.translate('Polaris.ResourceList.Item.selectItem', {
7269 accessibilityLabel: checkboxAccessibilityLabel
7270 });
7271 handleMarkup = React.createElement(
7272 'div',
7273 { className: styles$50.Handle, onClick: this.handleLargerSelectionArea },
7274 React.createElement(
7275 'div',
7276 { onClick: stopPropagation, className: styles$50.CheckboxWrapper },
7277 React.createElement(Checkbox$2, { id: this.checkboxId, label: label, labelHidden: true, onChange: this.handleSelection, checked: selected, disabled: loading })
7278 )
7279 );
7280 }
7281 if (media || selectable) {
7282 ownedMarkup = React.createElement(
7283 'div',
7284 { className: styles$50.Owned },
7285 handleMarkup,
7286 mediaMarkup
7287 );
7288 }
7289 const className = styles.classNames(styles$50.Item, focused && styles$50.focused, selectable && styles$50.selectable, selected && styles$50.selected, selectMode && styles$50.selectMode, persistActions && styles$50.persistActions, focusedInner && styles$50.focusedInner);
7290 let actionsMarkup = null;
7291 let disclosureMarkup = null;
7292 if (shortcutActions) {
7293 if (persistActions) {
7294 actionsMarkup = React.createElement(
7295 'div',
7296 { className: styles$50.Actions, onClick: stopPropagation },
7297 React.createElement(
7298 ButtonGroup$1,
7299 null,
7300 buttonsFrom(shortcutActions, { size: 'slim', plain: true })
7301 )
7302 );
7303 disclosureMarkup = React.createElement(
7304 'div',
7305 { className: styles$50.Disclosure, onClick: stopPropagation },
7306 React.createElement(
7307 Popover$1,
7308 { activator: React.createElement(Button$2, { 'aria-label': intl.translate('Polaris.ResourceList.Item.actionsDropdown'), onClick: this.handleActionsClick, plain: true, icon: 'horizontalDots' }), onClose: this.handleCloseRequest, active: actionsMenuVisible },
7309 React.createElement(ActionList$1, { items: shortcutActions })
7310 )
7311 );
7312 } else {
7313 actionsMarkup = React.createElement(
7314 'div',
7315 { className: styles$50.Actions, onClick: stopPropagation },
7316 React.createElement(
7317 ButtonGroup$1,
7318 { segmented: true },
7319 buttonsFrom(shortcutActions, { size: 'slim' })
7320 )
7321 );
7322 }
7323 }
7324 const content = children ? React.createElement(
7325 'div',
7326 { className: styles$50.Content },
7327 children
7328 ) : null;
7329 const containerMarkup = React.createElement(
7330 'div',
7331 { className: styles$50.Container, id: this.props.id },
7332 ownedMarkup,
7333 content,
7334 actionsMarkup,
7335 disclosureMarkup
7336 );
7337 const accessibleMarkup = url ? React.createElement(UnstyledLink$2, { 'aria-describedby': this.props.id, 'aria-label': accessibilityLabel, className: styles$50.Link, url: url, onFocus: this.handleAnchorFocus, onBlur: this.handleFocusedBlur }) : React.createElement('button', { className: styles$50.Button, 'aria-label': accessibilityLabel, 'aria-controls': ariaControls, 'aria-expanded': ariaExpanded, onClick: this.handleClick, onFocus: this.handleAnchorFocus, onBlur: this.handleFocusedBlur });
7338 return React.createElement(
7339 'div',
7340 { ref: this.setNode, className: className, onClick: this.handleClick, onFocus: this.handleFocus, onBlur: this.handleBlur, onMouseDown: this.handleMouseDown, onKeyUp: this.handleKeypress },
7341 accessibleMarkup,
7342 containerMarkup
7343 );
7344 }
7345 setNode(node) {
7346 this.node = node;
7347 }
7348 handleAnchorFocus() {
7349 this.setState({ focused: true, focusedInner: false });
7350 }
7351 handleFocusedBlur() {
7352 this.setState({ focused: true, focusedInner: true });
7353 }
7354 handleFocus() {
7355 this.setState({ focused: true });
7356 }
7357 handleBlur(event) {
7358 const isInside = this.compareEventNode(event);
7359 if (this.node == null || !this.node.contains(event.relatedTarget)) {
7360 this.setState({ focused: false });
7361 } else if (isInside) {
7362 this.setState({ focusedInner: true });
7363 }
7364 }
7365 handleMouseDown() {
7366 this.setState({ focusedInner: true });
7367 }
7368 handleLargerSelectionArea(event) {
7369 stopPropagation(event);
7370 this.handleSelection(!this.isSelected());
7371 }
7372 handleSelection(value) {
7373 var _props2 = this.props;
7374 const id = _props2.id,
7375 onSelectionChange = _props2.context.onSelectionChange;
7376
7377 if (id == null || onSelectionChange == null) {
7378 return;
7379 }
7380 this.setState({ focused: true, focusedInner: true });
7381 onSelectionChange(value, id);
7382 }
7383 handleClick(event) {
7384 var _props3 = this.props;
7385 const id = _props3.id,
7386 onClick = _props3.onClick,
7387 url = _props3.url,
7388 selectMode = _props3.context.selectMode;
7389
7390 const anchor = this.node && this.node.querySelector('a');
7391 if (selectMode) {
7392 this.handleLargerSelectionArea(event);
7393 return;
7394 }
7395 if (anchor === event.target) {
7396 return;
7397 }
7398 if (onClick) {
7399 onClick(id);
7400 }
7401 if (url && anchor) {
7402 anchor.click();
7403 }
7404 }
7405 handleKeypress(event) {
7406 var _props4 = this.props,
7407 _props4$onClick = _props4.onClick;
7408 const onClick = _props4$onClick === undefined ? other.noop : _props4$onClick,
7409 selectMode = _props4.context.selectMode;
7410 const key = event.key;
7411
7412 if (key === 'Enter' && !selectMode) {
7413 onClick();
7414 }
7415 }
7416 handleActionsClick() {
7417 this.setState(({ actionsMenuVisible }) => ({
7418 actionsMenuVisible: !actionsMenuVisible
7419 }));
7420 }
7421 handleCloseRequest() {
7422 this.setState({ actionsMenuVisible: false });
7423 }
7424 isSelected() {
7425 var _props5 = this.props;
7426 const id = _props5.id,
7427 selectedItems = _props5.context.selectedItems;
7428
7429 return selectedItems && (Array.isArray(selectedItems) && selectedItems.includes(id) || selectedItems === SELECT_ALL_ITEMS);
7430 }
7431 compareEventNode(event) {
7432 return this.props.onClick ? event.target === this.node : event.target.tagName.toLowerCase() === 'a';
7433 }
7434}
7435tslib_1.__decorate([decorators.autobind], Item$9.prototype, "setNode", null);
7436tslib_1.__decorate([decorators.autobind], Item$9.prototype, "handleAnchorFocus", null);
7437tslib_1.__decorate([decorators.autobind], Item$9.prototype, "handleFocusedBlur", null);
7438tslib_1.__decorate([decorators.autobind], Item$9.prototype, "handleFocus", null);
7439tslib_1.__decorate([decorators.autobind], Item$9.prototype, "handleBlur", null);
7440tslib_1.__decorate([decorators.autobind], Item$9.prototype, "handleMouseDown", null);
7441tslib_1.__decorate([decorators.autobind], Item$9.prototype, "handleLargerSelectionArea", null);
7442tslib_1.__decorate([decorators.autobind], Item$9.prototype, "handleSelection", null);
7443tslib_1.__decorate([decorators.autobind], Item$9.prototype, "handleClick", null);
7444tslib_1.__decorate([decorators.autobind], Item$9.prototype, "handleKeypress", null);
7445tslib_1.__decorate([decorators.autobind], Item$9.prototype, "handleActionsClick", null);
7446tslib_1.__decorate([decorators.autobind], Item$9.prototype, "handleCloseRequest", null);
7447function stopPropagation(event) {
7448 event.stopPropagation();
7449}
7450var Item$10 = compose(withContext$1(Consumer$2), withAppProvider())(Item$9);
7451
7452var styles$51 = {
7453 "FiltersWrapper": "p_rf",
7454 "ResourceList": "p_ij",
7455 "HeaderOuterWrapper": "p_qh",
7456 "HeaderWrapper-disabled": "p_ut",
7457 "HeaderWrapper-overlay": "p_rz",
7458 "HeaderWrapper": "p_nt",
7459 "HeaderWrapper-isSticky": "p_q2",
7460 "HeaderContentWrapper": "p_k5",
7461 "HeaderWrapper-inSelectMode": "p_vi",
7462 "SortWrapper": "p_jh",
7463 "HeaderWrapper-hasSelect": "p_vr",
7464 "HeaderWrapper-hasSort": "p_na",
7465 "SortLabel": "p_eo",
7466 "ItemCountTextWrapper": "p_gs",
7467 "BulkActionsWrapper": "p_pp",
7468 "CheckableButtonWrapper": "p_j9",
7469 "SelectButtonWrapper": "p_r1",
7470 "EmptySearchResultWrapper": "p_es",
7471 "ResourceListWrapper": "p_y5",
7472 "ItemWrapper": "p_f0",
7473 "SpinnerContainer": "p_k0",
7474 "LoadingOverlay": "p_c7",
7475 "DisabledPointerEvents": "p_kh",
7476};
7477
7478const SMALL_SCREEN_WIDTH = 458;
7479const SMALL_SPINNER_HEIGHT = 28;
7480const LARGE_SPINNER_HEIGHT = 45;
7481const getUniqueID$4 = other.createUniqueIDFactory('Select');
7482class ResourceList$1 extends React.Component {
7483 constructor(props) {
7484 super(props);
7485 this.state = {
7486 selectMode: false,
7487 loadingPosition: 0,
7488 listNode: null
7489 };
7490 this.listRef = React.createRef();
7491 const intl = props.polaris.intl;
7492
7493 this.defaultResourceName = {
7494 singular: intl.translate('Polaris.ResourceList.defaultItemSingular'),
7495 plural: intl.translate('Polaris.ResourceList.defaultItemPlural')
7496 };
7497 }
7498 get selectable() {
7499 var _props = this.props;
7500 const promotedBulkActions = _props.promotedBulkActions,
7501 bulkActions = _props.bulkActions;
7502
7503 return Boolean(promotedBulkActions && promotedBulkActions.length > 0 || bulkActions && bulkActions.length > 0);
7504 }
7505 get bulkSelectState() {
7506 var _props2 = this.props;
7507 const selectedItems = _props2.selectedItems,
7508 items = _props2.items;
7509
7510 let selectState = 'indeterminate';
7511 if (!selectedItems || Array.isArray(selectedItems) && selectedItems.length === 0) {
7512 selectState = false;
7513 } else if (selectedItems === SELECT_ALL_ITEMS || Array.isArray(selectedItems) && selectedItems.length === items.length) {
7514 selectState = true;
7515 }
7516 return selectState;
7517 }
7518 get itemCountText() {
7519 var _props3 = this.props,
7520 _props3$resourceName = _props3.resourceName;
7521 const resourceName = _props3$resourceName === undefined ? this.defaultResourceName : _props3$resourceName,
7522 items = _props3.items,
7523 intl = _props3.polaris.intl;
7524
7525 const itemsCount = items.length;
7526 const resource = itemsCount === 1 ? resourceName.singular : resourceName.plural;
7527 return intl.translate('Polaris.ResourceList.showing', {
7528 itemsCount,
7529 resource
7530 });
7531 }
7532 get bulkActionsLabel() {
7533 var _props4 = this.props,
7534 _props4$selectedItems = _props4.selectedItems;
7535 const selectedItems = _props4$selectedItems === undefined ? [] : _props4$selectedItems,
7536 items = _props4.items,
7537 intl = _props4.polaris.intl;
7538
7539 const selectedItemsCount = selectedItems === SELECT_ALL_ITEMS ? `${items.length}+` : selectedItems.length;
7540 return intl.translate('Polaris.ResourceList.selected', {
7541 selectedItemsCount
7542 });
7543 }
7544 get bulkActionsAccessibilityLabel() {
7545 var _props5 = this.props,
7546 _props5$resourceName = _props5.resourceName;
7547 const resourceName = _props5$resourceName === undefined ? this.defaultResourceName : _props5$resourceName;
7548 var _props5$selectedItems = _props5.selectedItems;
7549 const selectedItems = _props5$selectedItems === undefined ? [] : _props5$selectedItems,
7550 items = _props5.items,
7551 intl = _props5.polaris.intl;
7552
7553 const selectedItemsCount = selectedItems.length;
7554 const totalItemsCount = items.length;
7555 const allSelected = selectedItemsCount === totalItemsCount;
7556 if (totalItemsCount === 1 && allSelected) {
7557 return intl.translate('Polaris.ResourceList.a11yCheckboxDeselectAllSingle', { resourceNameSingular: resourceName.singular });
7558 } else if (totalItemsCount === 1) {
7559 return intl.translate('Polaris.ResourceList.a11yCheckboxSelectAllSingle', {
7560 resourceNameSingular: resourceName.singular
7561 });
7562 } else if (allSelected) {
7563 return intl.translate('Polaris.ResourceList.a11yCheckboxDeselectAllMultiple', {
7564 itemsLength: items.length,
7565 resourceNamePlural: resourceName.plural
7566 });
7567 } else {
7568 return intl.translate('Polaris.ResourceList.a11yCheckboxSelectAllMultiple', {
7569 itemsLength: items.length,
7570 resourceNamePlural: resourceName.plural
7571 });
7572 }
7573 }
7574 get paginatedSelectAllText() {
7575 var _props6 = this.props;
7576 const hasMoreItems = _props6.hasMoreItems,
7577 selectedItems = _props6.selectedItems,
7578 items = _props6.items;
7579 var _props6$resourceName = _props6.resourceName;
7580 const resourceName = _props6$resourceName === undefined ? this.defaultResourceName : _props6$resourceName,
7581 intl = _props6.polaris.intl;
7582
7583 if (!this.selectable || !hasMoreItems) {
7584 return;
7585 }
7586 if (selectedItems === SELECT_ALL_ITEMS) {
7587 return intl.translate('Polaris.ResourceList.allItemsSelected', {
7588 itemsLength: items.length,
7589 resourceNamePlural: resourceName.plural
7590 });
7591 }
7592 }
7593 get paginatedSelectAllAction() {
7594 var _props7 = this.props;
7595 const hasMoreItems = _props7.hasMoreItems,
7596 selectedItems = _props7.selectedItems,
7597 items = _props7.items;
7598 var _props7$resourceName = _props7.resourceName;
7599 const resourceName = _props7$resourceName === undefined ? this.defaultResourceName : _props7$resourceName,
7600 intl = _props7.polaris.intl;
7601
7602 if (!this.selectable || !hasMoreItems) {
7603 return;
7604 }
7605 const actionText = selectedItems === SELECT_ALL_ITEMS ? intl.translate('Polaris.Common.undo') : intl.translate('Polaris.ResourceList.selectAllItems', {
7606 itemsLength: items.length,
7607 resourceNamePlural: resourceName.plural
7608 });
7609 return {
7610 content: actionText,
7611 onAction: this.handleSelectAllItemsInStore
7612 };
7613 }
7614 get emptySearchResultText() {
7615 var _props8 = this.props;
7616 const intl = _props8.polaris.intl;
7617 var _props8$resourceName = _props8.resourceName;
7618 const resourceName = _props8$resourceName === undefined ? this.defaultResourceName : _props8$resourceName;
7619
7620 return {
7621 title: intl.translate('Polaris.ResourceList.emptySearchResultTitle', {
7622 resourceNamePlural: resourceName.plural
7623 }),
7624 description: intl.translate('Polaris.ResourceList.emptySearchResultDescription')
7625 };
7626 }
7627 get getContext() {
7628 var _props9 = this.props;
7629 const selectedItems = _props9.selectedItems;
7630 var _props9$resourceName = _props9.resourceName;
7631 const resourceName = _props9$resourceName === undefined ? this.defaultResourceName : _props9$resourceName,
7632 loading = _props9.loading;
7633 const selectMode = this.state.selectMode;
7634
7635 return {
7636 selectable: this.selectable,
7637 selectedItems,
7638 selectMode,
7639 resourceName,
7640 loading,
7641 onSelectionChange: this.handleSelectionChange
7642 };
7643 }
7644 // eslint-disable-next-line react/no-deprecated
7645 componentWillReceiveProps(nextProps) {
7646 const selectedItems = this.props.selectedItems;
7647
7648 if (selectedItems && selectedItems.length > 0 && (!nextProps.selectedItems || nextProps.selectedItems.length === 0) && !isSmallScreen()) {
7649 this.setState({ selectMode: false });
7650 }
7651 }
7652 componentDidMount() {
7653 this.setState({
7654 listNode: this.listRef.current
7655 }, () => {
7656 if (this.props.loading) {
7657 this.setLoadingPosition();
7658 }
7659 });
7660 }
7661 componentDidUpdate(prevProps) {
7662 if (this.props.loading && !prevProps.loading) {
7663 this.setLoadingPosition();
7664 }
7665 }
7666 render() {
7667 var _props10 = this.props;
7668 const items = _props10.items,
7669 promotedBulkActions = _props10.promotedBulkActions,
7670 bulkActions = _props10.bulkActions,
7671 filterControl = _props10.filterControl,
7672 loading = _props10.loading;
7673 var _props10$showHeader = _props10.showHeader;
7674 const showHeader = _props10$showHeader === undefined ? false : _props10$showHeader,
7675 sortOptions = _props10.sortOptions,
7676 sortValue = _props10.sortValue,
7677 onSortChange = _props10.onSortChange,
7678 intl = _props10.polaris.intl;
7679 var _state = this.state;
7680 const selectMode = _state.selectMode,
7681 loadingPosition = _state.loadingPosition,
7682 listNode = _state.listNode;
7683
7684 const itemsExist = items.length > 0;
7685 const filterControlMarkup = filterControl ? React.createElement(
7686 'div',
7687 { className: styles$51.FiltersWrapper },
7688 filterControl
7689 ) : null;
7690 const bulkActionsMarkup = this.selectable ? React.createElement(
7691 'div',
7692 { className: styles$51.BulkActionsWrapper },
7693 React.createElement(BulkActions$2, { label: this.bulkActionsLabel, accessibilityLabel: this.bulkActionsAccessibilityLabel, selected: this.bulkSelectState, onToggleAll: this.handleToggleAll, selectMode: selectMode, onSelectModeToggle: this.handleSelectMode, promotedActions: promotedBulkActions, paginatedSelectAllAction: this.paginatedSelectAllAction, paginatedSelectAllText: this.paginatedSelectAllText, actions: bulkActions, disabled: loading }),
7694 React.createElement(EventListener$1, { event: 'resize', handler: this.handleResize })
7695 ) : null;
7696 const selectId = getUniqueID$4();
7697 const sortingLabelMarkup = React.createElement(
7698 'label',
7699 { className: styles$51.SortLabel, htmlFor: selectId },
7700 intl.translate('Polaris.ResourceList.sortingLabel')
7701 );
7702 const sortingSelectMarkup = sortOptions && sortOptions.length > 0 ? React.createElement(
7703 'div',
7704 { className: styles$51.SortWrapper },
7705 sortingLabelMarkup,
7706 React.createElement(Select$1, { label: intl.translate('Polaris.ResourceList.sortingLabel'), labelHidden: true, options: sortOptions, onChange: onSortChange, value: sortValue, disabled: selectMode })
7707 ) : null;
7708 const itemCountTextMarkup = React.createElement(
7709 'div',
7710 { className: styles$51.ItemCountTextWrapper },
7711 this.itemCountText
7712 );
7713 const selectButtonMarkup = this.selectable ? React.createElement(
7714 'div',
7715 { className: styles$51.SelectButtonWrapper },
7716 React.createElement(
7717 Button$2,
7718 { disabled: selectMode, icon: selectIcon
7719 // eslint-disable-next-line react/jsx-no-bind
7720 , onClick: this.handleSelectMode.bind(this, true) },
7721 intl.translate('Polaris.ResourceList.selectButtonText')
7722 )
7723 ) : null;
7724 const checkableButtonMarkup = this.selectable ? React.createElement(
7725 'div',
7726 { className: styles$51.CheckableButtonWrapper },
7727 React.createElement(CheckableButton$2, { accessibilityLabel: this.bulkActionsAccessibilityLabel, label: this.itemCountText, onToggleAll: this.handleToggleAll, plain: true, disabled: loading })
7728 ) : null;
7729 const needsHeader = this.selectable || sortOptions && sortOptions.length > 0;
7730 const headerWrapperOverlay = loading ? React.createElement('div', { className: styles$51['HeaderWrapper-overlay'] }) : null;
7731 const headerMarkup = (showHeader || needsHeader) && listNode && itemsExist && React.createElement(
7732 'div',
7733 { className: styles$51.HeaderOuterWrapper },
7734 React.createElement(
7735 Sticky$1,
7736 { boundingElement: listNode },
7737 isSticky => {
7738 const headerClassName = styles.classNames(styles$51.HeaderWrapper, sortOptions && sortOptions.length > 0 && styles$51['HeaderWrapper-hasSort'], this.selectable && styles$51['HeaderWrapper-hasSelect'], loading && styles$51['HeaderWrapper-disabled'], this.selectable && selectMode && styles$51['HeaderWrapper-inSelectMode'], isSticky && styles$51['HeaderWrapper-isSticky']);
7739 return React.createElement(
7740 'div',
7741 { className: headerClassName },
7742 headerWrapperOverlay,
7743 React.createElement(
7744 'div',
7745 { className: styles$51.HeaderContentWrapper },
7746 itemCountTextMarkup,
7747 checkableButtonMarkup,
7748 sortingSelectMarkup,
7749 selectButtonMarkup
7750 ),
7751 bulkActionsMarkup
7752 );
7753 }
7754 )
7755 );
7756 const emptyStateMarkup = filterControl && !itemsExist ? React.createElement(
7757 'div',
7758 { className: styles$51.EmptySearchResultWrapper },
7759 React.createElement(EmptySearchResult$2, Object.assign({}, this.emptySearchResultText, { withIllustration: true }))
7760 ) : null;
7761 const defaultTopPadding = 8;
7762 const topPadding = loadingPosition > 0 ? loadingPosition : defaultTopPadding;
7763 const spinnerStyle = { paddingTop: `${topPadding}px` };
7764 const spinnerSize = items.length === 1 ? 'small' : 'large';
7765 const loadingOverlay = loading ? React.createElement(
7766 React.Fragment,
7767 null,
7768 React.createElement(
7769 'div',
7770 { className: styles$51.SpinnerContainer, style: spinnerStyle },
7771 React.createElement(Spinner$2, { size: spinnerSize, accessibilityLabel: 'Items are loading' })
7772 ),
7773 React.createElement('div', { className: styles$51.LoadingOverlay })
7774 ) : null;
7775 const resourceListClassName = styles.classNames(styles$51.ResourceList, loading && styles$51.disabledPointerEvents);
7776 const listMarkup = itemsExist ? React.createElement(
7777 'ul',
7778 { className: resourceListClassName, ref: this.listRef, 'aria-live': 'polite', 'aria-busy': loading },
7779 loadingOverlay,
7780 items.map(this.renderItem)
7781 ) : emptyStateMarkup;
7782 return React.createElement(
7783 Provider$2,
7784 { value: this.getContext },
7785 React.createElement(
7786 'div',
7787 { className: styles$51.ResourceListWrapper },
7788 filterControlMarkup,
7789 headerMarkup,
7790 listMarkup
7791 )
7792 );
7793 }
7794 handleResize() {
7795 const selectedItems = this.props.selectedItems;
7796 const selectMode = this.state.selectMode;
7797
7798 if (selectedItems && selectedItems.length === 0 && selectMode && !isSmallScreen()) {
7799 this.handleSelectMode(false);
7800 }
7801 }
7802 setLoadingPosition() {
7803 const listNode = this.state.listNode;
7804
7805 if (listNode != null) {
7806 if (typeof window === 'undefined') {
7807 return;
7808 }
7809 const overlay = listNode.getBoundingClientRect();
7810 const viewportHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
7811 const overflow = viewportHeight - overlay.height;
7812 const spinnerHeight = this.props.items.length === 1 ? SMALL_SPINNER_HEIGHT : LARGE_SPINNER_HEIGHT;
7813 const spinnerPosition = overflow > 0 ? (overlay.height - spinnerHeight) / 2 : (viewportHeight - overlay.top - spinnerHeight) / 2;
7814 this.setState({ loadingPosition: spinnerPosition });
7815 }
7816 }
7817 handleSelectAllItemsInStore() {
7818 var _props11 = this.props;
7819 const onSelectionChange = _props11.onSelectionChange,
7820 selectedItems = _props11.selectedItems,
7821 items = _props11.items;
7822 var _props11$idForItem = _props11.idForItem;
7823 const idForItem = _props11$idForItem === undefined ? defaultIdForItem : _props11$idForItem;
7824
7825 const newlySelectedItems = selectedItems === SELECT_ALL_ITEMS ? getAllItemsOnPage(items, idForItem) : SELECT_ALL_ITEMS;
7826 if (onSelectionChange) {
7827 onSelectionChange(newlySelectedItems);
7828 }
7829 }
7830 renderItem(item, index) {
7831 var _props12 = this.props;
7832 const renderItem = _props12.renderItem;
7833 var _props12$idForItem = _props12.idForItem;
7834 const idForItem = _props12$idForItem === undefined ? defaultIdForItem : _props12$idForItem,
7835 loading = _props12.loading;
7836
7837 const id = idForItem(item, index);
7838 const tabIndex = loading ? -1 : 0;
7839 return React.createElement(
7840 'li',
7841 { key: id, className: styles$51.ItemWrapper, tabIndex: tabIndex },
7842 renderItem(item, id)
7843 );
7844 }
7845 handleSelectionChange(selected, id) {
7846 var _props13 = this.props;
7847 const onSelectionChange = _props13.onSelectionChange,
7848 selectedItems = _props13.selectedItems,
7849 items = _props13.items;
7850 var _props13$idForItem = _props13.idForItem;
7851 const idForItem = _props13$idForItem === undefined ? defaultIdForItem : _props13$idForItem;
7852
7853 if (selectedItems == null || onSelectionChange == null) {
7854 return;
7855 }
7856 const newlySelectedItems = selectedItems === SELECT_ALL_ITEMS ? getAllItemsOnPage(items, idForItem) : [...selectedItems];
7857 if (selected) {
7858 newlySelectedItems.push(id);
7859 } else {
7860 newlySelectedItems.splice(newlySelectedItems.indexOf(id), 1);
7861 }
7862 if (newlySelectedItems.length === 0 && !isSmallScreen()) {
7863 this.handleSelectMode(false);
7864 } else if (newlySelectedItems.length > 0) {
7865 this.handleSelectMode(true);
7866 }
7867 if (onSelectionChange) {
7868 onSelectionChange(newlySelectedItems);
7869 }
7870 }
7871 handleSelectMode(selectMode) {
7872 const onSelectionChange = this.props.onSelectionChange;
7873
7874 this.setState({ selectMode });
7875 if (!selectMode && onSelectionChange) {
7876 onSelectionChange([]);
7877 }
7878 }
7879 handleToggleAll() {
7880 var _props14 = this.props;
7881 const onSelectionChange = _props14.onSelectionChange,
7882 selectedItems = _props14.selectedItems,
7883 items = _props14.items;
7884 var _props14$idForItem = _props14.idForItem;
7885 const idForItem = _props14$idForItem === undefined ? defaultIdForItem : _props14$idForItem;
7886
7887 let newlySelectedItems = [];
7888 if (Array.isArray(selectedItems) && selectedItems.length === items.length || selectedItems === SELECT_ALL_ITEMS) {
7889 newlySelectedItems = [];
7890 } else {
7891 newlySelectedItems = items.map((item, index) => {
7892 const id = idForItem(item, index);
7893 return id;
7894 });
7895 }
7896 if (newlySelectedItems.length === 0 && !isSmallScreen()) {
7897 this.handleSelectMode(false);
7898 } else if (newlySelectedItems.length > 0) {
7899 this.handleSelectMode(true);
7900 }
7901 if (onSelectionChange) {
7902 onSelectionChange(newlySelectedItems);
7903 }
7904 }
7905}
7906ResourceList$1.Item = Item$10;
7907ResourceList$1.FilterControl = FilterControl$2;
7908tslib_1.__decorate([decorators.autobind], ResourceList$1.prototype, "bulkSelectState", null);
7909tslib_1.__decorate([decorators.autobind], ResourceList$1.prototype, "itemCountText", null);
7910tslib_1.__decorate([decorators.autobind], ResourceList$1.prototype, "bulkActionsLabel", null);
7911tslib_1.__decorate([decorators.autobind], ResourceList$1.prototype, "bulkActionsAccessibilityLabel", null);
7912tslib_1.__decorate([decorators.autobind], ResourceList$1.prototype, "paginatedSelectAllText", null);
7913tslib_1.__decorate([decorators.autobind], ResourceList$1.prototype, "paginatedSelectAllAction", null);
7914tslib_1.__decorate([decorators.debounce(50), decorators.autobind], ResourceList$1.prototype, "handleResize", null);
7915tslib_1.__decorate([decorators.autobind], ResourceList$1.prototype, "setLoadingPosition", null);
7916tslib_1.__decorate([decorators.autobind], ResourceList$1.prototype, "handleSelectAllItemsInStore", null);
7917tslib_1.__decorate([decorators.autobind], ResourceList$1.prototype, "renderItem", null);
7918tslib_1.__decorate([decorators.autobind], ResourceList$1.prototype, "handleSelectionChange", null);
7919tslib_1.__decorate([decorators.autobind], ResourceList$1.prototype, "handleSelectMode", null);
7920tslib_1.__decorate([decorators.autobind], ResourceList$1.prototype, "handleToggleAll", null);
7921function getAllItemsOnPage(items, idForItem) {
7922 return items.map((item, index) => {
7923 return idForItem(item, index);
7924 });
7925}
7926function defaultIdForItem(item, index) {
7927 return item.hasOwnProperty('id') ? item.id : index.toString();
7928}
7929function isSmallScreen() {
7930 return typeof window === 'undefined' ? false : window.innerWidth <= SMALL_SCREEN_WIDTH;
7931}
7932var ResourceList$2 = withAppProvider()(ResourceList$1);
7933
7934var styles$52 = {
7935 "marginNone": "p_sr",
7936 "paddingNone": "p_ow",
7937 "marginExtraTight": "p_vf",
7938 "paddingExtraTight": "p_z8",
7939 "marginTight": "p_dt",
7940 "paddingTight": "p_zi",
7941 "marginBase": "p_pc",
7942 "paddingBase": "p_z6",
7943 "marginLoose": "p_rj",
7944 "paddingLoose": "p_fh",
7945 "marginExtraLoose": "p_hk",
7946 "paddingExtraLoose": "p_a7",
7947 "marginTopNone": "p_cd",
7948 "paddingTopNone": "p_mg",
7949 "marginTopExtraTight": "p_om",
7950 "paddingTopExtraTight": "p_pe",
7951 "marginTopTight": "p_or",
7952 "paddingTopTight": "p_cc",
7953 "marginTopBase": "p_xw",
7954 "paddingTopBase": "p_vs",
7955 "marginTopLoose": "p_gd",
7956 "paddingTopLoose": "p_eb",
7957 "marginTopExtraLoose": "p_x6",
7958 "paddingTopExtraLoose": "p_iy",
7959 "marginLeftNone": "p_lh",
7960 "paddingLeftNone": "p_gp",
7961 "marginLeftExtraTight": "p_jq",
7962 "paddingLeftExtraTight": "p_sb",
7963 "marginLeftTight": "p_s7",
7964 "paddingLeftTight": "p_zq",
7965 "marginLeftBase": "p_xk",
7966 "paddingLeftBase": "p_g5",
7967 "marginLeftLoose": "p_s4",
7968 "paddingLeftLoose": "p_g9",
7969 "marginLeftExtraLoose": "p_uz",
7970 "paddingLeftExtraLoose": "p_nj",
7971 "marginRightNone": "p_kc",
7972 "paddingRightNone": "p_c8",
7973 "marginRightExtraTight": "p_fj",
7974 "paddingRightExtraTight": "p_bs",
7975 "marginRightTight": "p_xj",
7976 "paddingRightTight": "p_um",
7977 "marginRightBase": "p_gf",
7978 "paddingRightBase": "p_yh",
7979 "marginRightLoose": "p_uq",
7980 "paddingRightLoose": "p_t6",
7981 "marginRightExtraLoose": "p_io",
7982 "paddingRightExtraLoose": "p_sv",
7983 "marginBottomNone": "p_s1",
7984 "paddingBottomNone": "p_a9",
7985 "marginBottomExtraTight": "p_nh",
7986 "paddingBottomExtraTight": "p_hy",
7987 "marginBottomTight": "p_ps",
7988 "paddingBottomTight": "p_ue",
7989 "marginBottomBase": "p_f4",
7990 "paddingBottomBase": "p_xm",
7991 "marginBottomLoose": "p_lo",
7992 "paddingBottomLoose": "p_xu",
7993 "marginBottomExtraLoose": "p_ac",
7994 "paddingBottomExtraLoose": "p_v7",
7995};
7996
7997function Spacing$1({ children, margin, marginTop, marginLeft, marginRight, marginBottom, padding, paddingTop, paddingLeft, paddingRight, paddingBottom }) {
7998 const className = styles.classNames(styles$52.Spacing, margin && styles$52[styles.variationName('margin', stringSpacing(margin))], marginTop && styles$52[styles.variationName('marginTop', stringSpacing(marginTop))], marginLeft && styles$52[styles.variationName('marginLeft', stringSpacing(marginLeft))], marginRight && styles$52[styles.variationName('marginRight', stringSpacing(marginRight))], marginBottom && styles$52[styles.variationName('marginBottom', stringSpacing(marginBottom))], padding && styles$52[styles.variationName('padding', stringSpacing(padding))], paddingTop && styles$52[styles.variationName('paddingTop', stringSpacing(paddingTop))], paddingLeft && styles$52[styles.variationName('paddingLeft', stringSpacing(paddingLeft))], paddingRight && styles$52[styles.variationName('paddingRight', stringSpacing(paddingRight))], paddingBottom && styles$52[styles.variationName('paddingBottom', stringSpacing(paddingBottom))]);
7999 return React.createElement(
8000 'div',
8001 { className: className },
8002 children
8003 );
8004}
8005function stringSpacing(value) {
8006 if (typeof value === 'string') {
8007 return value;
8008 }
8009 if (value === true) {
8010 return 'base';
8011 }
8012 return 'none';
8013}
8014
8015class FilterControl$1 extends React.Component {
8016 render() {
8017 var _props = this.props;
8018 const searchValue = _props.searchValue;
8019 var _props$appliedFilters = _props.appliedFilters;
8020 const appliedFilters = _props$appliedFilters === undefined ? [] : _props$appliedFilters,
8021 additionalAction = _props.additionalAction;
8022 var _props$focused = _props.focused;
8023 const focused = _props$focused === undefined ? false : _props$focused;
8024 var _props$filters = _props.filters;
8025 const filters = _props$filters === undefined ? [] : _props$filters,
8026 onSearchBlur = _props.onSearchBlur,
8027 onSearchChange = _props.onSearchChange,
8028 names = _props.names,
8029 intl = _props.polaris.intl,
8030 selectMode = _props.context.selectMode;
8031
8032 let resourceName = this.props.context.resourceName;
8033 if (names) {
8034 resourceName = {
8035 singular: names.singular,
8036 plural: names.plural
8037 };
8038 }
8039 let textFieldLabel = intl.translate('Polaris.ResourceList.FilterControl.textFieldLabel', {
8040 resourceNamePlural: resourceName.plural.toLocaleLowerCase()
8041 });
8042 textFieldLabel = `${textFieldLabel}...`;
8043 if (additionalAction) {
8044 additionalAction.disabled = selectMode;
8045 }
8046 const additionalActionButton = additionalAction && buttonsFrom(additionalAction) || null;
8047 const filterCreatorMarkup = filters.length > 0 ? React.createElement(
8048 Spacing$1,
8049 { marginRight: true },
8050 React.createElement(FilterCreator$1, { resourceName: resourceName, filters: filters, onAddFilter: this.handleAddFilter, disabled: selectMode })
8051 ) : null;
8052 const appliedFiltersMarkup = appliedFilters.map(appliedFilter => {
8053 const activeFilterLabel = this.getFilterLabel(appliedFilter);
8054 const filterId = idFromFilter(appliedFilter);
8055 return React.createElement(
8056 'li',
8057 { className: styles$43.AppliedFilter, key: filterId },
8058 React.createElement(
8059 Tag$2,
8060 { onRemove: this.getRemoveFilterCallback(filterId), disabled: selectMode },
8061 activeFilterLabel
8062 )
8063 );
8064 });
8065 const appliedFiltersWrapper = appliedFilters.length > 0 ? React.createElement(
8066 'ul',
8067 { className: styles$43.AppliedFilters },
8068 appliedFiltersMarkup
8069 ) : null;
8070 return React.createElement(
8071 FormLayout$1,
8072 null,
8073 React.createElement(
8074 'div',
8075 { className: styles$43.Controls },
8076 filterCreatorMarkup,
8077 React.createElement(
8078 'div',
8079 { className: styles$43.Search },
8080 React.createElement(TextField$1, { label: textFieldLabel, labelHidden: true, placeholder: textFieldLabel, prefix: React.createElement(Icon$2, { source: 'search', color: 'inkLightest' }), value: searchValue, onChange: onSearchChange, onBlur: onSearchBlur, focused: focused, disabled: selectMode })
8081 ),
8082 additionalActionButton
8083 ),
8084 appliedFiltersWrapper
8085 );
8086 }
8087 handleAddFilter(newFilter) {
8088 var _props2 = this.props;
8089 const onFiltersChange = _props2.onFiltersChange;
8090 var _props2$appliedFilter = _props2.appliedFilters;
8091 const appliedFilters = _props2$appliedFilter === undefined ? [] : _props2$appliedFilter;
8092
8093 if (!onFiltersChange) {
8094 return;
8095 }
8096 const foundFilter = appliedFilters.find(appliedFilter => idFromFilter(appliedFilter) === idFromFilter(newFilter));
8097 if (foundFilter) {
8098 return;
8099 }
8100 const newAppliedFilters = [...appliedFilters, newFilter];
8101 onFiltersChange(newAppliedFilters);
8102 }
8103 getRemoveFilterCallback(filterId) {
8104 return () => {
8105 this.handleRemoveFilter(filterId);
8106 };
8107 }
8108 handleRemoveFilter(filterId) {
8109 var _props3 = this.props;
8110 const onFiltersChange = _props3.onFiltersChange;
8111 var _props3$appliedFilter = _props3.appliedFilters;
8112 const appliedFilters = _props3$appliedFilter === undefined ? [] : _props3$appliedFilter;
8113
8114 if (!onFiltersChange) {
8115 return;
8116 }
8117 const foundIndex = appliedFilters.findIndex(appliedFilter => idFromFilter(appliedFilter) === filterId);
8118 const newAppliedFilters = foundIndex >= 0 ? [...appliedFilters.slice(0, foundIndex), ...appliedFilters.slice(foundIndex + 1, appliedFilters.length)] : [...appliedFilters];
8119 onFiltersChange(newAppliedFilters);
8120 }
8121 getFilterLabel(appliedFilter) {
8122 const key = appliedFilter.key,
8123 value = appliedFilter.value,
8124 label = appliedFilter.label;
8125
8126 if (label) {
8127 return label;
8128 }
8129 var _props$filters2 = this.props.filters;
8130 const filters = _props$filters2 === undefined ? [] : _props$filters2;
8131
8132 const filter = filters.find(filter => {
8133 const minKey = filter.minKey,
8134 maxKey = filter.maxKey,
8135 operatorText = filter.operatorText;
8136
8137 if (minKey || maxKey) {
8138 return filter.key === key || minKey === key || maxKey === key;
8139 }
8140 if (operatorText && typeof operatorText !== 'string') {
8141 return filter.key === key || operatorText.filter(({ key: operatorKey }) => operatorKey === key).length === 1;
8142 }
8143 return filter.key === key;
8144 });
8145 if (!filter) {
8146 return value;
8147 }
8148 const filterOperatorLabel = findOperatorLabel(filter, appliedFilter);
8149 const filterLabelByType = this.findFilterLabelByType(filter, appliedFilter);
8150 if (!filterOperatorLabel) {
8151 return `${filter.label} ${filterLabelByType}`;
8152 }
8153 return `${filter.label} ${filterOperatorLabel} ${filterLabelByType}`;
8154 }
8155 findFilterLabelByType(filter, appliedFilter) {
8156 const intl = this.props.polaris.intl;
8157 const appliedFilterValue = appliedFilter.value;
8158
8159 if (filter.type === exports.FilterType.Select) {
8160 const foundFilterOption = filter.options.find(option => typeof option === 'string' ? option === appliedFilterValue : option.value === appliedFilterValue);
8161 if (foundFilterOption) {
8162 return typeof foundFilterOption === 'string' ? foundFilterOption : foundFilterOption.label;
8163 }
8164 }
8165 if (filter.type === exports.FilterType.DateSelector) {
8166 if (filter.key === appliedFilter.key) {
8167 const filterLabelKey = `Polaris.ResourceList.DateSelector.FilterLabelForValue.${appliedFilter.value}`;
8168 return intl.translationKeyExists(filterLabelKey) ? intl.translate(filterLabelKey) : appliedFilter.value;
8169 }
8170 if (appliedFilter.key === filter.maxKey) {
8171 return intl.translate('Polaris.ResourceList.DateSelector.FilterLabelForValue.on_or_before', {
8172 date: formatDateForLabelDisplay(appliedFilter.value)
8173 });
8174 }
8175 if (appliedFilter.key === filter.minKey) {
8176 return intl.translate('Polaris.ResourceList.DateSelector.FilterLabelForValue.on_or_after', {
8177 date: formatDateForLabelDisplay(appliedFilter.value)
8178 });
8179 }
8180 }
8181 return appliedFilterValue;
8182 }
8183}
8184tslib_1.__decorate([decorators.autobind], FilterControl$1.prototype, "handleAddFilter", null);
8185tslib_1.__decorate([decorators.memoize()], FilterControl$1.prototype, "getRemoveFilterCallback", null);
8186function idFromFilter(appliedFilter) {
8187 return `${appliedFilter.key}-${appliedFilter.value}`;
8188}
8189function formatDateForLabelDisplay(date) {
8190 if (isNaN(new Date(date).getTime())) {
8191 return date;
8192 }
8193 return new Date(date.replace(/-/g, '/')).toLocaleDateString();
8194}
8195function findOperatorLabel(filter, appliedFilter) {
8196 const operatorText = filter.operatorText;
8197
8198 if (filter.type === exports.FilterType.DateSelector && (appliedFilter.key === filter.minKey || appliedFilter.key === filter.maxKey)) {
8199 return '';
8200 }
8201 if (!operatorText || typeof operatorText === 'string') {
8202 return operatorText;
8203 }
8204 const appliedOperator = operatorText.find(operator => {
8205 return operator.key === appliedFilter.key;
8206 });
8207 if (appliedOperator) {
8208 return appliedOperator.filterLabel || appliedOperator.optionLabel;
8209 }
8210}
8211var FilterControl$2 = compose(withAppProvider(), withContext$1(Consumer$2))(FilterControl$1);
8212
8213class Focus$1 extends React.PureComponent {
8214 componentDidMount() {
8215 fastdom.write(() => {
8216 const root = ReactDOM.findDOMNode(this);
8217 if (root) {
8218 if (!root.querySelector('[autofocus]')) {
8219 focus.focusFirstFocusableNode(root, false);
8220 }
8221 }
8222 });
8223 }
8224 render() {
8225 const Fragment$$1 = React.Fragment;
8226 const children = this.props.children;
8227
8228 return React.createElement(
8229 Fragment$$1,
8230 null,
8231 children
8232 );
8233 }
8234}
8235
8236class TrapFocus extends React.PureComponent {
8237 render() {
8238 const children = this.props.children;
8239
8240 return React.createElement(
8241 Focus$1,
8242 null,
8243 React.createElement(
8244 'div',
8245 { ref: this.setFocusTrapWrapper },
8246 React.createElement(EventListener$1, { event: 'focusout', handler: this.handleBlur }),
8247 children
8248 )
8249 );
8250 }
8251 setFocusTrapWrapper(node) {
8252 this.focusTrapWrapper = node;
8253 }
8254 handleBlur(event) {
8255 const relatedTarget = event.relatedTarget;
8256 const focusTrapWrapper = this.focusTrapWrapper;
8257 var _props$trapping = this.props.trapping;
8258 const trapping = _props$trapping === undefined ? true : _props$trapping;
8259
8260 if (relatedTarget == null || !trapping) {
8261 return;
8262 }
8263 if (focusTrapWrapper && !focusTrapWrapper.contains(relatedTarget) && !dom.closest(relatedTarget, '[data-polaris-overlay]')) {
8264 event.preventDefault();
8265 if (event.srcElement === focus.findFirstFocusableNode(focusTrapWrapper)) {
8266 return focus.focusLastFocusableNode(focusTrapWrapper);
8267 }
8268 focus.focusFirstFocusableNode(focusTrapWrapper);
8269 }
8270 }
8271}
8272tslib_1.__decorate([decorators.autobind], TrapFocus.prototype, "setFocusTrapWrapper", null);
8273tslib_1.__decorate([decorators.autobind], TrapFocus.prototype, "handleBlur", null);
8274
8275var styles$53 = {
8276 "FooterHelp": "p_i2",
8277 "Content": "p_xg",
8278 "Icon": "p_uv",
8279 "Text": "p_yc",
8280};
8281
8282function FooterHelp$1({ children }) {
8283 return React.createElement(
8284 'div',
8285 { className: styles$53.FooterHelp },
8286 React.createElement(
8287 'div',
8288 { className: styles$53.Content },
8289 React.createElement(
8290 'div',
8291 { className: styles$53.Icon },
8292 React.createElement(Icon$2, { source: 'help', color: 'teal', backdrop: true })
8293 ),
8294 React.createElement(
8295 'div',
8296 { className: styles$53.Text },
8297 children
8298 )
8299 )
8300 );
8301}
8302
8303var styles$54 = {
8304 "FormLayout": "p_uw",
8305 "condensed": "p_ke",
8306 "Item": "p_to",
8307 "Title": "p_ji",
8308 "Items": "p_ez",
8309 "HelpText": "p_b1",
8310 "Footer": "p_ss",
8311};
8312
8313function Group({ children }) {
8314 const itemsMarkup = React.Children.map(children, child => child);
8315 return React.createElement(
8316 'footer',
8317 { role: 'footer', className: styles$54.Footer },
8318 React.createElement(
8319 Stack$1,
8320 { distribution: 'trailing' },
8321 itemsMarkup
8322 )
8323 );
8324}
8325
8326function Item$12(props) {
8327 return React.createElement(
8328 'div',
8329 { className: styles$54.Item },
8330 props.children
8331 );
8332}
8333
8334const getUniqueID$8 = other.createUniqueIDFactory('FormLayoutGroup');
8335function Group$2({ children, condensed, title, helpText }) {
8336 const className = styles.classNames(condensed && styles$54.condensed);
8337 const id = getUniqueID$8();
8338 let helpTextElement = null;
8339 let helpTextID;
8340 let titleElement = null;
8341 let titleID;
8342 if (helpText) {
8343 helpTextID = `${id}HelpText`;
8344 helpTextElement = React.createElement(
8345 'div',
8346 { id: helpTextID, className: styles$54.HelpText },
8347 helpText
8348 );
8349 }
8350 if (title) {
8351 titleID = `${id}Title`;
8352 titleElement = React.createElement(
8353 'div',
8354 { id: titleID, className: styles$54.Title },
8355 title
8356 );
8357 }
8358 const itemsMarkup = React.Children.map(children, child => reactUtilities.wrapWithComponent(child, Item$12));
8359 return React.createElement(
8360 'div',
8361 { role: 'group', className: className, 'aria-labelledby': titleID, 'aria-describedby': helpTextID },
8362 titleElement,
8363 React.createElement(
8364 'div',
8365 { className: styles$54.Items },
8366 itemsMarkup
8367 ),
8368 helpTextElement
8369 );
8370}
8371
8372class FormLayout$1 extends React.PureComponent {
8373 render() {
8374 const children = this.props.children;
8375
8376 return React.createElement(
8377 'div',
8378 { className: styles$54.FormLayout },
8379 React.Children.map(children, wrapChildren)
8380 );
8381 }
8382}
8383FormLayout$1.Group = Group$2;
8384FormLayout$1.Footer = Group;
8385function wrapChildren(child, index) {
8386 if (reactUtilities.isElementOfType(child, Group$2)) {
8387 return child;
8388 }
8389 if (reactUtilities.isElementOfType(child, Group)) {
8390 return child;
8391 }
8392 const props = { key: index };
8393 return reactUtilities.wrapWithComponent(child, Item$12, props);
8394}
8395
8396var styles$55 = {
8397 "always": "p_zn",
8398 "whenTablet": "p_jt",
8399 "whenLaptop": "p_ox",
8400 "whenDesktop": "p_o1",
8401 "belowMobile": "p_pg",
8402 "belowTablet": "p_o8",
8403 "belowLaptop": "p_xi",
8404};
8405
8406function Hide$1({ children, when, below }) {
8407 const className = styles.classNames(styles$55.Hide, when && styles$55[styles.variationName('when', when)], below && styles$55[styles.variationName('below', below)], !when && !below && styles$55.always);
8408 return React.createElement(
8409 'div',
8410 { className: className },
8411 children
8412 );
8413}
8414
8415var styles$56 = {
8416 "variationPositive": "p_go",
8417 "variationNegative": "p_lg",
8418 "variationWarning": "p_h5",
8419 "variationCode": "p_df",
8420 "variationStrong": "p_sx",
8421 "variationSubdued": "p_b9",
8422};
8423
8424var VariationValue;
8425(function (VariationValue) {
8426 VariationValue["Positive"] = "positive";
8427 VariationValue["Warning"] = "warning";
8428 VariationValue["Negative"] = "negative";
8429 VariationValue["Strong"] = "strong";
8430 VariationValue["Subdued"] = "subdued";
8431 VariationValue["Code"] = "code";
8432})(VariationValue || (VariationValue = {}));
8433function TextStyle$1({ variation, children }) {
8434 const className = styles.classNames(variation && styles$56[styles.variationName('variation', variation)], variation === VariationValue.Code && styles$56.code);
8435 const Element = variationElement(variation);
8436 return React.createElement(
8437 Element,
8438 { className: className },
8439 children
8440 );
8441}
8442function variationElement(variation) {
8443 switch (variation) {
8444 case VariationValue.Code:
8445 return 'code';
8446 case VariationValue.Strong:
8447 return 'b';
8448 case VariationValue.Positive:
8449 case VariationValue.Warning:
8450 case VariationValue.Negative:
8451 case VariationValue.Subdued:
8452 default:
8453 return 'span';
8454 }
8455}
8456
8457var styles$57 = {
8458 "InlineValidation": "p_gg",
8459 "Icon": "p_b2",
8460};
8461
8462function InlineValidation$1({ message, fieldID, status }) {
8463 if (!message) {
8464 return null;
8465 }
8466 let color = 'red';
8467 let icon = 'alert';
8468 let textStyle = 'negative';
8469 switch (status) {
8470 case 'success':
8471 color = 'green';
8472 icon = 'circleCheckmark';
8473 textStyle = null;
8474 break;
8475 case 'info':
8476 color = 'blue';
8477 icon = 'circleInformationFilled';
8478 textStyle = null;
8479 break;
8480 case 'attention':
8481 color = 'orange';
8482 icon = 'attentionFilled';
8483 textStyle = 'warning';
8484 break;
8485 default:
8486 color = 'red';
8487 icon = 'alert';
8488 textStyle = 'negative';
8489 }
8490 return React.createElement(
8491 'div',
8492 { id: `${fieldID}Error`, className: styles$57.InlineValidation },
8493 React.createElement(
8494 'div',
8495 { className: styles$57.Icon },
8496 React.createElement(Icon$2, { source: icon, color: color })
8497 ),
8498 textStyle ? React.createElement(
8499 TextStyle$1,
8500 { variation: textStyle },
8501 message
8502 ) : React.createElement(
8503 TextStyle$1,
8504 null,
8505 message
8506 )
8507 );
8508}
8509
8510var styles$58 = {
8511 "KeyboardKey": "p_ka",
8512};
8513
8514function KeyboardKey$1({ children }) {
8515 let key = children || '';
8516 key = key.length > 1 ? key.toLowerCase() : key.toUpperCase();
8517 return React.createElement(
8518 'kbd',
8519 { className: styles$58.KeyboardKey },
8520 key
8521 );
8522}
8523
8524var styles$59 = {
8525 "Layout": "p_sy",
8526 "Section": "p_xa",
8527 "Section-secondary": "p_tz",
8528 "Section-fullWidth": "p_wd",
8529 "AnnotatedSection": "p_ve",
8530 "AnnotationWrapper": "p_ey",
8531 "AnnotationContent": "p_ko",
8532 "Annotation": "p_mo",
8533 "AnnotationDescription": "p_y4",
8534};
8535
8536function AnnotatedSection$1(props) {
8537 const children = props.children,
8538 title = props.title,
8539 description = props.description;
8540
8541 const descriptionMarkup = typeof description === 'string' ? React.createElement(
8542 'p',
8543 null,
8544 description
8545 ) : description;
8546 return React.createElement(
8547 'div',
8548 { className: styles$59.AnnotatedSection },
8549 React.createElement(
8550 'div',
8551 { className: styles$59.AnnotationWrapper },
8552 React.createElement(
8553 'div',
8554 { className: styles$59.Annotation },
8555 React.createElement(
8556 TextContainer$1,
8557 null,
8558 React.createElement(
8559 Heading$1,
8560 null,
8561 title
8562 ),
8563 descriptionMarkup && React.createElement(
8564 'div',
8565 { className: styles$59.AnnotationDescription },
8566 descriptionMarkup
8567 )
8568 )
8569 ),
8570 React.createElement(
8571 'div',
8572 { className: styles$59.AnnotationContent },
8573 children
8574 )
8575 )
8576 );
8577}
8578
8579function Section$7({ children, secondary, fullWidth }) {
8580 const className = styles.classNames(styles$59.Section, secondary && styles$59['Section-secondary'], fullWidth && styles$59['Section-fullWidth']);
8581 return React.createElement(
8582 'div',
8583 { className: className },
8584 children
8585 );
8586}
8587
8588class Layout$1 extends React.Component {
8589 render() {
8590 var _props = this.props;
8591 const children = _props.children,
8592 sectioned = _props.sectioned;
8593
8594 const content = sectioned ? React.createElement(
8595 Section$7,
8596 null,
8597 children
8598 ) : children;
8599 return React.createElement(
8600 'div',
8601 { className: styles$59.Layout },
8602 content
8603 );
8604 }
8605}
8606Layout$1.AnnotatedSection = AnnotatedSection$1;
8607Layout$1.Section = Section$7;
8608
8609var styles$60 = {
8610 "Link": "p_d5",
8611};
8612
8613function Link$2({ url, children, onClick, external, id }) {
8614 return url ? React.createElement(
8615 UnstyledLink$2,
8616 { onClick: onClick, className: styles$60.Link, url: url, external: external, id: id },
8617 children
8618 ) : React.createElement(
8619 'button',
8620 { onClick: onClick, className: styles$60.Link, id: id },
8621 children
8622 );
8623}
8624
8625var styles$61 = {
8626 "List": "p_hf",
8627 "typeNumber": "p_y6",
8628 "Item": "p_tn",
8629};
8630
8631function Item$14({ children }) {
8632 return React.createElement(
8633 'li',
8634 { className: styles$61.Item },
8635 children
8636 );
8637}
8638
8639class ContentList extends React.PureComponent {
8640 render() {
8641 var _props = this.props;
8642 const children = _props.children;
8643 var _props$type = _props.type;
8644 const type = _props$type === undefined ? 'bullet' : _props$type;
8645
8646 const className = styles.classNames(styles$61.List, type && styles$61[styles.variationName('type', type)]);
8647 const ListElement = type === 'bullet' ? 'ul' : 'ol';
8648 return React.createElement(
8649 ListElement,
8650 { className: className },
8651 children
8652 );
8653 }
8654}
8655ContentList.Item = Item$14;
8656
8657var styles$62 = {
8658 "Media": "p_tc",
8659 "link": "p_t5",
8660 "active": "p_e2",
8661 "Title": "p_m6",
8662 "Image": "p_zb",
8663 "Content": "p_ot",
8664 "Link": "p_wh",
8665 "Button": "p_z3",
8666 "Header": "p_rm",
8667 "Badge": "p_sq",
8668};
8669
8670var styles$63 = {
8671 "Thumbnail": "p_ks",
8672 "sizeExtraSmall": "p_q6",
8673 "sizeSmall": "p_wt",
8674 "sizeMedium": "p_ro",
8675 "sizeLarge": "p_cw",
8676 "Image": "p_r8",
8677 "File": "p_xd",
8678};
8679
8680function Thumbnail$1({ source, alt, abbr, size = 'medium' }) {
8681 const className = styles.classNames(styles$63.Thumbnail, size && styles$63[styles.variationName('size', size)]);
8682 const contentMarkup = source ? React.createElement(Image$1, { alt: alt, source: source, className: styles$63.Image }) : React.createElement(
8683 'div',
8684 { className: styles$63.File },
8685 abbr
8686 );
8687 return React.createElement(
8688 'span',
8689 { className: className },
8690 contentMarkup
8691 );
8692}
8693
8694function Media$1({
8695 // children,
8696 // data,
8697 // content,
8698 // label,
8699 header, body, bodySpacing, url, avatar, avatarSource, thumbnailSource, thumbnailAbbr, thumbnailSize, icon, iconColor, iconBackdrop, badgeText, badgeStatus, active }) {
8700 const className = reactUtilities.classNames(styles$62.Media, url && styles$62.link, active && styles$62.active);
8701 const iconMarkup = icon ? React.createElement(
8702 'div',
8703 { className: styles$62.Image },
8704 React.createElement(Icon$2, { source: icon, color: iconColor ? iconColor : "inkLighter", backdrop: iconBackdrop ? true : false })
8705 ) : null;
8706 const badgeMarkup = badgeText ? React.createElement(
8707 Hide$1,
8708 { below: 'mobile' },
8709 React.createElement(
8710 'div',
8711 { className: styles$62.Badge },
8712 React.createElement(
8713 Badge$2,
8714 { status: badgeStatus },
8715 badgeText
8716 )
8717 )
8718 ) : null;
8719 const headerMarkup = header ? React.createElement(
8720 'header',
8721 { className: styles$62.Header },
8722 React.createElement(
8723 'span',
8724 { className: styles$62.Title },
8725 header
8726 ),
8727 badgeMarkup
8728 ) : null;
8729 const bodyMarkup = body ? React.createElement(
8730 'div',
8731 { className: styles$62.Body },
8732 body
8733 ) : null;
8734 const linkMarkup = url ? React.createElement(UnstyledLink$2, { className: styles$62.Link, url: url }) : null;
8735 const avatarMarkup = avatar ? React.createElement(
8736 'div',
8737 { className: styles$62.Image },
8738 React.createElement(Avatar$2, { size: 'small', customer: true, name: avatar, source: avatarSource })
8739 ) : null;
8740 const thumbnailMarkup = thumbnailSource ? React.createElement(
8741 'div',
8742 { className: styles$62.Image },
8743 React.createElement(Thumbnail$1, { alt: 'thumbnail', size: thumbnailSize ? thumbnailSize : "small", source: thumbnailSource })
8744 ) : thumbnailAbbr ? React.createElement(
8745 'div',
8746 { className: styles$62.Image },
8747 React.createElement(Thumbnail$1, { alt: 'thumbnail', size: thumbnailSize ? thumbnailSize : "small", abbr: thumbnailAbbr })
8748 ) : null;
8749 return React.createElement(
8750 'div',
8751 { className: className },
8752 iconMarkup,
8753 avatarMarkup,
8754 thumbnailMarkup,
8755 React.createElement(
8756 'div',
8757 { className: styles$62.Content },
8758 React.createElement(
8759 Stack$1,
8760 { vertical: true, spacing: bodySpacing ? bodySpacing : 'none' },
8761 headerMarkup,
8762 bodyMarkup
8763 )
8764 ),
8765 linkMarkup
8766 );
8767}
8768
8769function memoizedBind(callback, ...args) {
8770 return function bound() {
8771 return callback(...args);
8772 };
8773}
8774var memoizedBind$1 = memoize$1(memoizedBind);
8775
8776var styles$64 = {
8777 "Container": "p_af",
8778 "Modal": "p_dy",
8779 "limitHeight": "p_bo",
8780 "sizeLarge": "p_me",
8781 "animateFadeUp": "p_px",
8782 "entering": "p_ev",
8783 "exiting": "p_lc",
8784 "exited": "p_ul",
8785 "entered": "p_pa",
8786};
8787
8788function DialogContainer(props) {
8789 return React.createElement(
8790 'div',
8791 { className: styles$64.Container, 'data-polaris-layer': true, 'data-polaris-overlay': true },
8792 props.children
8793 );
8794}
8795function Dialog$1(_a) {
8796 var instant = _a.instant,
8797 labelledBy = _a.labelledBy,
8798 children = _a.children,
8799 onClose = _a.onClose,
8800 onExited = _a.onExited,
8801 onEntered = _a.onEntered,
8802 large = _a.large,
8803 limitHeight = _a.limitHeight,
8804 props = tslib_1.__rest(_a, ["instant", "labelledBy", "children", "onClose", "onExited", "onEntered", "large", "limitHeight"]);
8805
8806 const classes = styles.classNames(styles$64.Modal, large && styles$64.sizeLarge, limitHeight && styles$64.limitHeight);
8807 const handleClose = memoizedBind$1(onClose);
8808 const TransitionChild = instant ? reactTransitionGroup.Transition : FadeUp;
8809 return React.createElement(
8810 TransitionChild,
8811 Object.assign({}, props, { mountOnEnter: true, unmountOnExit: true, timeout: Duration.Base, onEntered: onEntered, onExited: onExited }),
8812 React.createElement(
8813 DialogContainer,
8814 null,
8815 React.createElement(
8816 TrapFocus,
8817 null,
8818 React.createElement(
8819 'div',
8820 { className: classes, role: 'dialog', 'aria-labelledby': labelledBy, tabIndex: -1 },
8821 React.createElement(KeypressListener$1, { keyCode: exports.Keys.ESCAPE, handler: handleClose }),
8822 children
8823 )
8824 )
8825 )
8826 );
8827}
8828const fadeUpClasses = {
8829 enter: styles.classNames(styles$64.animateFadeUp, styles$64.entering),
8830 enterActive: styles.classNames(styles$64.animateFadeUp, styles$64.entered),
8831 exit: styles.classNames(styles$64.animateFadeUp, styles$64.exiting),
8832 exitActive: styles.classNames(styles$64.animateFadeUp, styles$64.exited)
8833};
8834function FadeUp(_a) {
8835 var children = _a.children,
8836 props = tslib_1.__rest(_a, ["children"]);
8837 return React.createElement(
8838 reactTransitionGroup.CSSTransition,
8839 Object.assign({}, props, { classNames: fadeUpClasses }),
8840 children
8841 );
8842}
8843
8844var styles$65 = {
8845 "Footer": "p_ie",
8846 "FooterContent": "p_wu",
8847};
8848
8849function Footer$1({ primaryAction, secondaryActions, children }) {
8850 const primaryActionButton = primaryAction && buttonsFrom(primaryAction, { primary: true }) || null;
8851 const secondaryActionButtons = secondaryActions && buttonsFrom(secondaryActions) || null;
8852 const actions = primaryActionButton || secondaryActionButtons ? React.createElement(
8853 ButtonGroup$1,
8854 null,
8855 secondaryActionButtons,
8856 primaryActionButton
8857 ) : null;
8858 return React.createElement(
8859 'div',
8860 { className: styles$65.Footer },
8861 React.createElement(
8862 'div',
8863 { className: styles$65.FooterContent },
8864 React.createElement(
8865 Stack$1,
8866 { alignment: 'center' },
8867 React.createElement(
8868 Stack$1.Item,
8869 { fill: true },
8870 children
8871 ),
8872 actions
8873 )
8874 )
8875 );
8876}
8877
8878var styles$66 = {
8879 "CloseButton": "p_aa",
8880 "withoutTitle": "p_gl",
8881};
8882
8883function CloseButton$1({ title = true, onClick }) {
8884 const className = reactUtilities.classNames(styles$66.CloseButton, !title && styles$66.withoutTitle);
8885 return React.createElement(
8886 'button',
8887 { onClick: onClick, className: className },
8888 React.createElement(Icon$2, { source: 'cancel', color: 'inkLighter' })
8889 );
8890}
8891
8892var styles$67 = {
8893 "Header": "p_v3",
8894 "Title": "p_n6",
8895};
8896
8897function Header$3({ id, children, onClose }) {
8898 const handleClose = memoizedBind$1(onClose);
8899 return React.createElement(
8900 'div',
8901 { className: styles$67.Header },
8902 React.createElement(
8903 'div',
8904 { id: id, className: styles$67.Title },
8905 React.createElement(
8906 DisplayText$1,
8907 { element: 'h2', size: 'small' },
8908 children
8909 )
8910 ),
8911 React.createElement(CloseButton$1, { onClick: handleClose })
8912 );
8913}
8914
8915var styles$68 = {
8916 "Section": "p_dv",
8917 "subdued": "p_q8",
8918 "flush": "p_qt",
8919};
8920
8921function Section$9({ children, flush = false, subdued = false }) {
8922 const className = styles.classNames(styles$68.Section, flush && styles$68.flush, subdued && styles$68.subdued);
8923 return React.createElement(
8924 'section',
8925 { className: className },
8926 children
8927 );
8928}
8929
8930var styles$69 = {
8931 "BodyWrapper": "p_jl",
8932 "Body": "p_a8",
8933 "IFrame": "p_be",
8934 "Backdrop": "p_qo",
8935 "Spinner": "p_oi",
8936 "fade-in": "p_qd",
8937};
8938
8939const IFRAME_LOADING_HEIGHT = 200;
8940const getUniqueID$9 = other.createUniqueIDFactory('modal-header');
8941class Modal$2 extends React.Component {
8942 constructor() {
8943 super(...arguments);
8944 this.state = {
8945 iframeHeight: IFRAME_LOADING_HEIGHT
8946 };
8947 this.headerId = getUniqueID$9();
8948 }
8949 getChildContext() {
8950 return {
8951 withinContentContainer: true
8952 };
8953 }
8954 componentDidMount() {
8955 if (this.context.easdk == null) {
8956 return;
8957 }
8958 const open = this.props.open;
8959
8960 if (open) {
8961 this.handleEASDKMessaging();
8962 this.focusReturnPointNode = document.activeElement;
8963 }
8964 }
8965 componentDidUpdate({ open: wasOpen }) {
8966 if (this.context.easdk == null) {
8967 return;
8968 }
8969 const open = this.props.open;
8970
8971 if (wasOpen !== open) {
8972 this.handleEASDKMessaging();
8973 }
8974 if (!wasOpen && open) {
8975 this.focusReturnPointNode = document.activeElement;
8976 } else if (wasOpen && !open && this.focusReturnPointNode != null && document.contains(this.focusReturnPointNode)) {
8977 this.focusReturnPointNode.focus();
8978 this.focusReturnPointNode = null;
8979 }
8980 }
8981 render() {
8982 if (this.context.easdk != null) {
8983 return null;
8984 }
8985 var _props = this.props;
8986 const children = _props.children,
8987 onClose = _props.onClose,
8988 title = _props.title,
8989 src = _props.src,
8990 iFrameName = _props.iFrameName,
8991 open = _props.open;
8992 var _props$instant = _props.instant;
8993 const instant = _props$instant === undefined ? true : _props$instant,
8994 sectioned = _props.sectioned,
8995 loading = _props.loading,
8996 large = _props.large,
8997 limitHeight = _props.limitHeight,
8998 footer = _props.footer,
8999 primaryAction = _props.primaryAction,
9000 secondaryActions = _props.secondaryActions,
9001 intl = _props.polaris.intl;
9002 const iframeHeight = this.state.iframeHeight;
9003
9004 const iframeTitle = intl.translate('Polaris.Modal.iFrameTitle');
9005 const handleClose = memoizedBind$1(onClose);
9006 let dialog;
9007 let backdrop;
9008 if (open) {
9009 const footerMarkup = !footer && !primaryAction && !secondaryActions ? null : React.createElement(
9010 Footer$1,
9011 { primaryAction: primaryAction, secondaryActions: secondaryActions },
9012 footer
9013 );
9014 const content = sectioned ? reactUtilities.wrapWithComponent(children, Section$9) : children;
9015 const body = loading ? React.createElement(
9016 'div',
9017 { className: styles$69.Spinner },
9018 React.createElement(Spinner$2, null)
9019 ) : content;
9020 const bodyMarkup = src ? React.createElement('iframe', { name: iFrameName, title: iframeTitle, src: src, className: styles$69.IFrame, onLoad: this.handleIFrameLoad, style: { height: `${iframeHeight}px` } }) : React.createElement(
9021 Scrollable$2,
9022 { shadow: true, className: styles$69.Body },
9023 body
9024 );
9025 const headerMarkup = title ? React.createElement(
9026 Header$3,
9027 { id: this.headerId, onClose: handleClose },
9028 title
9029 ) : React.createElement(CloseButton$1, { onClick: handleClose, title: false });
9030 dialog = React.createElement(
9031 Dialog$1,
9032 { instant: instant, labelledBy: this.headerId, onClose: handleClose, onEntered: this.handleEntered, onExited: this.handleExited, large: large, limitHeight: limitHeight },
9033 headerMarkup,
9034 React.createElement(
9035 'div',
9036 { className: styles$69.BodyWrapper },
9037 bodyMarkup
9038 ),
9039 footerMarkup
9040 );
9041 backdrop = React.createElement('div', { className: styles$69.Backdrop, onClick: handleClose });
9042 }
9043 const animated = !instant;
9044 this.handleWarning('modal');
9045 return React.createElement(
9046 Portal$1,
9047 { idPrefix: 'modal' },
9048 React.createElement(
9049 reactTransitionGroup.TransitionGroup,
9050 { appear: animated, enter: animated, exit: animated },
9051 dialog
9052 ),
9053 backdrop
9054 );
9055 }
9056 handleEntered() {
9057 const onTransitionEnd = this.props.onTransitionEnd;
9058
9059 if (onTransitionEnd) {
9060 onTransitionEnd();
9061 }
9062 }
9063 handleExited() {
9064 this.setState({
9065 iframeHeight: IFRAME_LOADING_HEIGHT
9066 });
9067 if (this.focusReturnPointNode) {
9068 fastdom.write(() => focus.focusFirstFocusableNode(this.focusReturnPointNode, false));
9069 }
9070 }
9071 handleIFrameLoad(evt) {
9072 const iframe = evt.target;
9073 if (iframe && iframe.contentWindow) {
9074 this.setState({
9075 iframeHeight: iframe.contentWindow.document.body.scrollHeight
9076 });
9077 }
9078 const onIFrameLoad = this.props.onIFrameLoad;
9079
9080 if (onIFrameLoad != null) {
9081 onIFrameLoad(evt);
9082 }
9083 }
9084 handleEASDKMessaging() {
9085 const easdk = this.context.easdk;
9086 const open = this.props.open;
9087
9088 if (easdk == null) {
9089 return;
9090 }
9091 if (open) {
9092 this.handleWarning('easdk');
9093 easdk.Modal.open(this.props);
9094 } else {
9095 easdk.Modal.close();
9096 }
9097 }
9098 handleWarning(type) {
9099 const intl = this.props.polaris.intl;
9100
9101 const reqProps = {
9102 modal: {
9103 open: 'open',
9104 onClose: 'onClose'
9105 },
9106 easdk: {
9107 open: 'open',
9108 src: 'src',
9109 onClose: 'onClose'
9110 }
9111 };
9112 const missingProps = Object.keys(reqProps[type]).reduce((acc, key) => {
9113 if (!this.props.hasOwnProperty(key)) {
9114 acc.push(key);
9115 }
9116 return acc;
9117 }, []);
9118 if (missingProps.length > 0) {
9119 // eslint-disable-next-line no-console
9120 console.warn(intl.translate('Polaris.Modal.modalWarning', {
9121 missingProps: missingProps.join(', ')
9122 }));
9123 }
9124 const actionWarnings = handleActionWanrings(this.props.primaryAction, this.props.secondaryActions);
9125 if (type === 'easdk' && actionWarnings.length > 0) {
9126 // eslint-disable-next-line no-console
9127 console.warn(intl.translate('Polaris.Modal.actionWarning', {
9128 actionWarnings: actionWarnings.join(', ')
9129 }));
9130 }
9131 }
9132}
9133Modal$2.contextTypes = { easdk: PropTypes.object };
9134Modal$2.childContextTypes = contentContextTypes;
9135Modal$2.Dialog = Dialog$1;
9136Modal$2.Section = Section$9;
9137tslib_1.__decorate([decorators.autobind], Modal$2.prototype, "handleEntered", null);
9138tslib_1.__decorate([decorators.autobind], Modal$2.prototype, "handleExited", null);
9139tslib_1.__decorate([decorators.autobind], Modal$2.prototype, "handleIFrameLoad", null);
9140function handleActionWanrings(primary = {}, secondary = []) {
9141 const actions = [primary, ...secondary];
9142 const actionKeysToIgnore = ['icon', 'loading'];
9143 return actions.reduce((acc, action) => {
9144 return acc.concat(...actionKeysToIgnore.filter(val => action[val] && acc.indexOf(val) === -1 && val));
9145 }, []);
9146}
9147var Modal$3 = withAppProvider()(Modal$2);
9148
9149var styles$70 = {
9150 "Option": "p_cx",
9151 "SingleSelectOption": "p_my",
9152 "disabled": "p_n0",
9153 "Media": "p_tt",
9154 "Label": "p_ek",
9155 "Checkbox": "p_oj",
9156 "focused": "p_mk",
9157 "select": "p_s6",
9158 "active": "p_hl",
9159};
9160
9161class Option$1 extends React.Component {
9162 constructor() {
9163 super(...arguments);
9164 this.state = {
9165 focused: false,
9166 active: false
9167 };
9168 }
9169 static getDerivedStateFromProps(nextProps, prevState) {
9170 if (nextProps.active !== undefined && nextProps.active !== prevState.active) {
9171 return nextProps.active ? { active: true } : { active: false };
9172 }
9173 return null;
9174 }
9175 render() {
9176 var _props = this.props;
9177 const label = _props.label,
9178 value = _props.value,
9179 id = _props.id,
9180 select = _props.select,
9181 active = _props.active,
9182 allowMultiple = _props.allowMultiple,
9183 disabled = _props.disabled,
9184 role = _props.role,
9185 media = _props.media;
9186 const focused = this.state.focused;
9187
9188 const mediaMarkup = media ? React.createElement(
9189 'div',
9190 { className: styles$70.Media },
9191 media
9192 ) : null;
9193 const singleSelectClassName = styles.classNames(styles$70.SingleSelectOption, focused && styles$70.focused, disabled && styles$70.disabled, select && styles$70.select, active && styles$70.active);
9194 const multiSelectClassName = styles.classNames(styles$70.Label, active && styles$70.active);
9195 const checkBoxRole = role === 'option' ? 'presentation' : undefined;
9196 const optionMarkup = allowMultiple ? React.createElement(
9197 'label',
9198 { htmlFor: id, className: multiSelectClassName },
9199 React.createElement(
9200 'div',
9201 { className: styles$70.Checkbox },
9202 React.createElement(Checkbox$4, { id: id, value: value, checked: select, active: active, disabled: disabled, onChange: this.handleClick, role: checkBoxRole })
9203 ),
9204 mediaMarkup,
9205 label
9206 ) : React.createElement(
9207 'button',
9208 { type: 'button', className: singleSelectClassName, onClick: this.handleClick, disabled: disabled, onFocus: this.toggleFocus, onBlur: this.toggleFocus },
9209 mediaMarkup,
9210 label
9211 );
9212 const scrollMarkup = active ? React.createElement(Scrollable$2.ScrollTo, null) : null;
9213 return React.createElement(
9214 'li',
9215 { key: id, className: styles$70.Option, tabIndex: -1, 'aria-selected': active, role: role },
9216 scrollMarkup,
9217 optionMarkup
9218 );
9219 }
9220 handleClick() {
9221 var _props2 = this.props;
9222 const onClick = _props2.onClick,
9223 section = _props2.section,
9224 index = _props2.index,
9225 disabled = _props2.disabled;
9226
9227 if (disabled) {
9228 return;
9229 }
9230 onClick(section, index);
9231 }
9232 toggleFocus() {
9233 this.setState(prevState => ({ focused: !prevState.focused }));
9234 }
9235}
9236tslib_1.__decorate([decorators.autobind], Option$1.prototype, "handleClick", null);
9237tslib_1.__decorate([decorators.autobind], Option$1.prototype, "toggleFocus", null);
9238
9239var styles$71 = {
9240 "Checkbox": "p_n5",
9241 "Input": "p_q4",
9242 "Backdrop": "p_je",
9243 "Input-indeterminate": "p_bx",
9244 "Icon": "p_iv",
9245 "active": "p_oo",
9246};
9247
9248const getUniqueID$10 = other.createUniqueIDFactory('Checkbox');
9249function Checkbox$4({ id = getUniqueID$10(), checked = false, disabled, active, onChange, name, value, role }) {
9250 const className = styles.classNames(styles$71.Checkbox, active && styles$71.active);
9251 return React.createElement(
9252 'div',
9253 { className: className },
9254 React.createElement('input', { id: id, name: name, value: value, type: 'checkbox', checked: checked, disabled: disabled, className: styles$71.Input, 'aria-checked': checked, onChange: onChange, role: role }),
9255 React.createElement('div', { className: styles$71.Backdrop }),
9256 React.createElement(
9257 'div',
9258 { className: styles$71.Icon },
9259 React.createElement(Icon$2, { source: 'checkmark' })
9260 )
9261 );
9262}
9263
9264function arraysAreEqual(firstArray, secondArray, comparator) {
9265 if (firstArray.length !== secondArray.length) {
9266 return false;
9267 }
9268 return firstArray.every((firstItem, index) => {
9269 const secondItem = secondArray[index];
9270 if (comparator != null) {
9271 return comparator(firstItem, secondItem);
9272 }
9273 return firstItem === secondItem;
9274 });
9275}
9276
9277var styles$72 = {
9278 "OptionList": "p_z5",
9279 "Options": "p_up",
9280 "Title": "p_ea",
9281};
9282
9283const getUniqueId = other.createUniqueIDFactory('OptionList');
9284class OptionList$1 extends React.Component {
9285 constructor() {
9286 super(...arguments);
9287 this.state = {
9288 normalizedOptions: createNormalizedOptions(this.props.options, this.props.sections, this.props.title)
9289 };
9290 this.id = this.props.id || getUniqueId();
9291 }
9292 // eslint-disable-next-line react/no-deprecated
9293 componentWillReceiveProps({ options: nextOptions = [], sections: nextSections = [], id: nextID, title: nextTitle }) {
9294 var _props = this.props,
9295 _props$options = _props.options;
9296 const options = _props$options === undefined ? [] : _props$options;
9297 var _props$sections = _props.sections;
9298 const sections = _props$sections === undefined ? [] : _props$sections,
9299 id = _props.id,
9300 title = _props.title;
9301
9302 if (id !== nextID) {
9303 this.id = nextID || this.id;
9304 }
9305 const optionsChanged = !arraysAreEqual(nextOptions, options);
9306 const sectionsChanged = !arraysAreEqual(nextSections, sections, testSectionsPropEquality);
9307 const titleChanged = title !== nextTitle;
9308 if (optionsChanged || sectionsChanged || titleChanged) {
9309 this.setState({
9310 normalizedOptions: createNormalizedOptions(nextOptions, nextSections, nextTitle)
9311 });
9312 }
9313 }
9314 render() {
9315 const normalizedOptions = this.state.normalizedOptions;
9316 var _props2 = this.props;
9317 const selected = _props2.selected,
9318 allowMultiple = _props2.allowMultiple,
9319 role = _props2.role,
9320 optionRole = _props2.optionRole;
9321
9322 const optionsExist = normalizedOptions.length > 0;
9323 const optionsMarkup = optionsExist ? normalizedOptions.map(({ title, options }, sectionIndex) => {
9324 const titleMarkup = title ? React.createElement(
9325 'p',
9326 { className: styles$72.Title, role: 'presentation' },
9327 title
9328 ) : null;
9329 const optionsMarkup = options && options.map((option, optionIndex) => {
9330 const isSelected = selected.includes(option.value);
9331 const id = option.id || `${this.id}-${sectionIndex}-${optionIndex}`;
9332 return React.createElement(Option$1, Object.assign({}, option, { key: id, id: id, section: sectionIndex, index: optionIndex, onClick: this.handleClick, select: isSelected, allowMultiple: allowMultiple, role: optionRole }));
9333 });
9334 return React.createElement(
9335 'li',
9336 { key: title || `noTitle-${sectionIndex}` },
9337 titleMarkup,
9338 React.createElement(
9339 'ul',
9340 { className: styles$72.Options, id: this.id, role: role, 'aria-multiselectable': allowMultiple },
9341 optionsMarkup
9342 )
9343 );
9344 }) : null;
9345 return React.createElement(
9346 'ul',
9347 { className: styles$72.OptionList },
9348 optionsMarkup
9349 );
9350 }
9351 handleClick(sectionIndex, optionIndex) {
9352 var _props3 = this.props;
9353 const selected = _props3.selected,
9354 onChange = _props3.onChange,
9355 allowMultiple = _props3.allowMultiple;
9356
9357 const selectedValue = this.state.normalizedOptions[sectionIndex].options[optionIndex].value;
9358 const foundIndex = selected.indexOf(selectedValue);
9359 if (allowMultiple) {
9360 const newSelection = foundIndex === -1 ? [selectedValue, ...selected] : [...selected.slice(0, foundIndex), ...selected.slice(foundIndex + 1, selected.length)];
9361 onChange(newSelection);
9362 return;
9363 }
9364 onChange([selectedValue]);
9365 }
9366}
9367tslib_1.__decorate([decorators.autobind], OptionList$1.prototype, "handleClick", null);
9368function createNormalizedOptions(options, sections, title) {
9369 if (options == null) {
9370 const section = { options: [], title };
9371 return sections == null ? [] : [section, ...sections];
9372 }
9373 if (sections == null) {
9374 return [{
9375 title,
9376 options
9377 }];
9378 }
9379 return [{
9380 title,
9381 options
9382 }, ...sections];
9383}
9384function testSectionsPropEquality(previousSection, currentSection) {
9385 const previousOptions = previousSection.options;
9386 const currentOptions = currentSection.options;
9387
9388 const optionsAreEqual = arraysAreEqual(previousOptions, currentOptions);
9389 const titlesAreEqual = previousSection.title === currentSection.title;
9390 return optionsAreEqual && titlesAreEqual;
9391}
9392var OptionList$2 = withAppProvider()(OptionList$1);
9393
9394var styles$73 = {
9395 "Page": "p_zl",
9396 "fullWidth": "p_te",
9397 "singleColumn": "p_yf",
9398 "Header": "p_rd",
9399 "Header-hasPagination": "p_mp",
9400 "Header-hasBreadcrumbs": "p_g2",
9401 "Header-hasSecondaryActions": "p_at",
9402 "Header-hasSeparator": "p_qs",
9403 "Content": "p_hb",
9404 "Header-hasRollup": "p_u7",
9405 "IndividualActions": "p_lf",
9406 "Rollup": "p_r0",
9407 "Navigation": "p_qz",
9408 "Pagination": "p_jm",
9409 "MainContent": "p_ua",
9410 "TitleAndActions": "p_tl",
9411 "Title": "p_wf",
9412 "Title-hidden": "p_c6",
9413 "Actions": "p_iu",
9414 "SecondaryActions": "p_kz",
9415 "Action": "p_w2",
9416 "ActionGroup": "p_no",
9417 "PrimaryAction": "p_ds",
9418 "ActionIcon": "p_bl",
9419 "disabled": "p_ju",
9420 "ActionContent": "p_q7",
9421 "Details": "p_uu",
9422 "withActions": "p_kj",
9423 "Action-outline": "p_aw",
9424};
9425
9426function Action$1({ icon, url, external, onAction, children, disclosure, accessibilityLabel, disabled, showIndicator, hasIndicator }) {
9427 const iconMarkup = icon ? React.createElement(
9428 'span',
9429 { className: styles$73.ActionIcon },
9430 React.createElement(Icon$2, { source: icon })
9431 ) : null;
9432 const disclosureIconMarkup = disclosure ? React.createElement(
9433 'span',
9434 { className: styles$73.ActionIcon },
9435 React.createElement(Icon$2, { source: 'caretDown' })
9436 ) : null;
9437 const contentMarkup = iconMarkup || disclosureIconMarkup ? React.createElement(
9438 'span',
9439 { className: styles$73.ActionContent },
9440 iconMarkup,
9441 React.createElement(
9442 'span',
9443 null,
9444 children
9445 ),
9446 disclosureIconMarkup
9447 ) : children;
9448 if (url) {
9449 return React.createElement(
9450 UnstyledLink$2,
9451 { key: children, external: external, url: url, onMouseUp: handleMouseUpByBlurring, className: styles$73.Action, 'aria-label': accessibilityLabel },
9452 contentMarkup
9453 );
9454 }
9455 const indicatorMarkup = false && showIndicator && !hasIndicator && React.createElement(Indicator$1, null);
9456 const className = reactUtilities.classNames(styles$73.Action, disabled && styles$73.disabled, icon && children == null && styles$73.iconOnly, false && showIndicator && styles$73['Action-outline']);
9457 return React.createElement(
9458 'button',
9459 { key: children, className: className, onClick: onAction, onMouseUp: handleMouseUpByBlurring, 'aria-label': accessibilityLabel, type: 'button', disabled: disabled },
9460 indicatorMarkup,
9461 contentMarkup
9462 );
9463}
9464
9465var EditableTarget;
9466(function (EditableTarget) {
9467 EditableTarget["Input"] = "INPUT";
9468 EditableTarget["Textarea"] = "TEXTAREA";
9469 EditableTarget["Select"] = "SELECT";
9470 EditableTarget["ContentEditable"] = "contenteditable";
9471})(EditableTarget || (EditableTarget = {}));
9472function isInputFocused() {
9473 if (document == null) {
9474 return false;
9475 }
9476 const tagName = document.activeElement.tagName;
9477
9478 return tagName === EditableTarget.Input || tagName === EditableTarget.Textarea || tagName === EditableTarget.Select || document.activeElement.hasAttribute(EditableTarget.ContentEditable);
9479}
9480
9481var styles$74 = {
9482 "Tooltip": "p_gz",
9483 "measuring": "p_j3",
9484 "positionedAbove": "p_v4",
9485 "Tip": "p_p4",
9486 "light": "p_se",
9487 "Wrapper": "p_yt",
9488 "Content": "p_zj",
9489 "Label": "p_dc",
9490};
9491
9492class TooltipOverlay$1 extends React.PureComponent {
9493 render() {
9494 const markup = this.props.active ? this.renderOverlay() : null;
9495 return markup;
9496 }
9497 renderOverlay() {
9498 var _props = this.props;
9499 const active = _props.active,
9500 activator = _props.activator;
9501 var _props$preferredPosit = _props.preferredPosition;
9502 const preferredPosition = _props$preferredPosit === undefined ? 'below' : _props$preferredPosit;
9503
9504 return React.createElement(PositionedOverlay$1, { active: active, activator: activator, preferredPosition: preferredPosition, render: this.renderTooltip });
9505 }
9506 renderTooltip(overlayDetails) {
9507 const measuring = overlayDetails.measuring,
9508 desiredHeight = overlayDetails.desiredHeight,
9509 positioning = overlayDetails.positioning;
9510 var _props2 = this.props;
9511 const id = _props2.id,
9512 children = _props2.children,
9513 light = _props2.light;
9514
9515 const containerClassName = styles.classNames(styles$74.Tooltip, light && styles$74.light, measuring && styles$74.measuring, positioning === 'above' && styles$74.positionedAbove);
9516 const contentStyles = measuring ? undefined : { maxHeight: desiredHeight };
9517 return React.createElement(
9518 'div',
9519 Object.assign({ className: containerClassName }, layer.props),
9520 React.createElement(
9521 'div',
9522 { className: styles$74.Wrapper },
9523 React.createElement(
9524 'div',
9525 { id: id, role: 'tooltip', className: styles$74.Content, style: contentStyles },
9526 children
9527 )
9528 )
9529 );
9530 }
9531}
9532tslib_1.__decorate([decorators.autobind], TooltipOverlay$1.prototype, "renderOverlay", null);
9533tslib_1.__decorate([decorators.autobind], TooltipOverlay$1.prototype, "renderTooltip", null);
9534
9535const getUniqueID$11 = other.createUniqueIDFactory('TooltipContent');
9536class Tooltip$1 extends React.PureComponent {
9537 constructor() {
9538 super(...arguments);
9539 this.state = {
9540 active: Boolean(this.props.active),
9541 activatorNode: null
9542 };
9543 this.id = getUniqueID$11();
9544 }
9545 componentDidMount() {
9546 this.setAccessibilityAttributes();
9547 }
9548 componentDidUpdate() {
9549 this.setAccessibilityAttributes();
9550 }
9551 render() {
9552 const id = this.id;
9553 var _props = this.props;
9554 const children = _props.children,
9555 content = _props.content,
9556 light = _props.light;
9557 var _props$preferredPosit = _props.preferredPosition;
9558 const preferredPosition = _props$preferredPosit === undefined ? 'above' : _props$preferredPosit;
9559 var _props$activatorWrapp = _props.activatorWrapper;
9560 const WrapperComponent = _props$activatorWrapp === undefined ? 'span' : _props$activatorWrapp;
9561 var _state = this.state;
9562 const active = _state.active,
9563 activatorNode = _state.activatorNode;
9564
9565 const portal = activatorNode ? React.createElement(
9566 Portal$1,
9567 { idPrefix: 'tooltip' },
9568 React.createElement(
9569 TooltipOverlay$1,
9570 { id: id, preferredPosition: preferredPosition, activator: activatorNode, active: active, onClose: other.noop, light: light },
9571 React.createElement(
9572 'div',
9573 { className: styles$74.Label },
9574 content
9575 )
9576 )
9577 ) : null;
9578 return React.createElement(
9579 WrapperComponent,
9580 { onFocus: this.handleFocus, onBlur: this.handleBlur, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, ref: this.setActivator },
9581 children,
9582 portal
9583 );
9584 }
9585 setActivator(node) {
9586 if (node == null) {
9587 this.activatorContainer = null;
9588 this.setState({ activatorNode: null });
9589 return;
9590 }
9591 this.setState({ activatorNode: node.firstElementChild });
9592 this.activatorContainer = node;
9593 }
9594 handleFocus() {
9595 this.setState({ active: true });
9596 }
9597 handleBlur() {
9598 this.setState({ active: false });
9599 }
9600 handleMouseEnter() {
9601 this.setState({ active: true });
9602 }
9603 handleMouseLeave() {
9604 this.setState({ active: false });
9605 }
9606 setAccessibilityAttributes() {
9607 const activatorContainer = this.activatorContainer,
9608 id = this.id;
9609
9610 if (activatorContainer == null) {
9611 return;
9612 }
9613 const firstFocusable = focus.findFirstFocusableNode(activatorContainer);
9614 const accessibilityNode = firstFocusable || activatorContainer;
9615 accessibilityNode.tabIndex = 0;
9616 accessibilityNode.setAttribute('aria-describedby', id);
9617 }
9618}
9619tslib_1.__decorate([decorators.autobind], Tooltip$1.prototype, "setActivator", null);
9620tslib_1.__decorate([decorators.autobind], Tooltip$1.prototype, "handleFocus", null);
9621tslib_1.__decorate([decorators.autobind], Tooltip$1.prototype, "handleBlur", null);
9622tslib_1.__decorate([decorators.autobind], Tooltip$1.prototype, "handleMouseEnter", null);
9623tslib_1.__decorate([decorators.autobind], Tooltip$1.prototype, "handleMouseLeave", null);
9624
9625var styles$75 = {
9626 "Pagination": "p_kq",
9627 "plain": "p_c3",
9628 "Button": "p_hs",
9629};
9630
9631function Pagination$1({ hasNext, hasPrevious, nextURL, previousURL, onNext, onPrevious, nextTooltip, previousTooltip, nextKeys, previousKeys, plain, accessibilityLabel, polaris: { intl } }) {
9632 const node = React.createRef();
9633 let label;
9634 if (accessibilityLabel) {
9635 label = accessibilityLabel;
9636 } else {
9637 label = intl.translate('Polaris.Pagination.pagination');
9638 }
9639 const className = reactUtilities.classNames(styles$75.Pagination, plain && styles$75.plain);
9640 const previousButton = previousURL ? React.createElement(
9641 UnstyledLink$2,
9642 { className: styles$75.Button, url: previousURL, onMouseUp: handleMouseUpByBlurring, 'aria-label': intl.translate('Polaris.Pagination.previous'), id: 'previousURL' },
9643 React.createElement(Icon$2, { source: 'arrowLeft' })
9644 ) : React.createElement(
9645 'button',
9646 { onClick: onPrevious, type: 'button', onMouseUp: handleMouseUpByBlurring, className: styles$75.Button, 'aria-label': intl.translate('Polaris.Pagination.previous'), disabled: !hasPrevious },
9647 React.createElement(Icon$2, { source: 'arrowLeft' })
9648 );
9649 const nextButton = nextURL ? React.createElement(
9650 UnstyledLink$2,
9651 { className: styles$75.Button, url: nextURL, onMouseUp: handleMouseUpByBlurring, 'aria-label': intl.translate('Polaris.Pagination.next'), id: 'nextURL' },
9652 React.createElement(Icon$2, { source: 'arrowRight' })
9653 ) : React.createElement(
9654 'button',
9655 { onClick: onNext, type: 'button', onMouseUp: handleMouseUpByBlurring, className: styles$75.Button, 'aria-label': intl.translate('Polaris.Pagination.next'), disabled: !hasNext },
9656 React.createElement(Icon$2, { source: 'arrowRight' })
9657 );
9658 const constructedPrevious = previousTooltip ? React.createElement(
9659 Tooltip$1,
9660 { content: previousTooltip },
9661 previousButton
9662 ) : previousButton;
9663 const constructedNext = nextTooltip ? React.createElement(
9664 Tooltip$1,
9665 { content: nextTooltip },
9666 nextButton
9667 ) : nextButton;
9668 const previousButtonEvents = previousKeys && (previousURL || onPrevious) && previousKeys.map(key => React.createElement(KeypressListener$1, { key: key, keyCode: key, handler: previousURL ? handleCallback(clickPaginationLink('previousURL', node)) : handleCallback(onPrevious) }));
9669 const nextButtonEvents = nextKeys && (nextURL || onNext) && nextKeys.map(key => React.createElement(KeypressListener$1, { key: key, keyCode: key, handler: nextURL ? handleCallback(clickPaginationLink('nextURL', node)) : handleCallback(onNext) }));
9670 return React.createElement(
9671 'nav',
9672 { className: className, 'aria-label': label, ref: node },
9673 previousButtonEvents,
9674 constructedPrevious,
9675 nextButtonEvents,
9676 constructedNext
9677 );
9678}
9679function clickPaginationLink(id, node) {
9680 return () => {
9681 if (node.current == null) {
9682 return;
9683 }
9684 const link = node.current.querySelector(`#${id}`);
9685 if (link) {
9686 link.click();
9687 }
9688 };
9689}
9690function handleCallback(fn) {
9691 return () => {
9692 if (isInputFocused()) {
9693 return;
9694 }
9695 fn();
9696 };
9697}
9698var Pagination$2 = withAppProvider()(Pagination$1);
9699
9700class Header$5 extends React.PureComponent {
9701 constructor() {
9702 super(...arguments);
9703 this.state = {
9704 rollupOpen: false
9705 };
9706 }
9707 render() {
9708 var _props = this.props;
9709 const title = _props.title,
9710 titleMetadata = _props.titleMetadata;
9711 var _props$breadcrumbs = _props.breadcrumbs;
9712 const breadcrumbs = _props$breadcrumbs === undefined ? [] : _props$breadcrumbs;
9713 var _props$titleHidden = _props.titleHidden;
9714 const titleHidden = _props$titleHidden === undefined ? false : _props$titleHidden,
9715 primaryAction = _props.primaryAction,
9716 pagination = _props.pagination,
9717 separator = _props.separator,
9718 secondaryActions = _props.secondaryActions;
9719
9720 const className = styles.classNames(styles$73.Header, titleHidden && styles$73['Title-hidden'], pagination && styles$73['Header-hasPagination'], separator && styles$73['Header-hasSeparator'], breadcrumbs && breadcrumbs.length && styles$73['Header-hasBreadcrumbs'], this.hasRollup && styles$73['Header-hasRollup'], secondaryActions && secondaryActions.length && styles$73['Header-hasSecondaryActions']);
9721 const breadcrumbMarkup = breadcrumbs.length > 0 ? React.createElement(Breadcrumbs$1, { breadcrumbs: breadcrumbs }) : null;
9722 const primary = primaryAction && (primaryAction.primary === undefined ? true : primaryAction.primary);
9723 const primaryActionMarkup = primaryAction ? React.createElement(
9724 'div',
9725 { className: styles$73.PrimaryAction },
9726 buttonsFrom(primaryAction, { primary })
9727 ) : null;
9728 const paginationMarkup = pagination ? React.createElement(
9729 'div',
9730 { className: styles$73.Pagination },
9731 React.createElement(Pagination$2, Object.assign({}, pagination, { plain: true }))
9732 ) : null;
9733 const nonPrimaryActionsMarkup = this.renderSecondaryActions();
9734 const actionsMarkup = React.createElement(
9735 'div',
9736 { className: styles$73.Actions },
9737 primaryActionMarkup,
9738 nonPrimaryActionsMarkup
9739 );
9740 const navigationMarkup = breadcrumbMarkup || paginationMarkup ? React.createElement(
9741 'div',
9742 { className: styles$73.Navigation },
9743 breadcrumbMarkup,
9744 paginationMarkup
9745 ) : null;
9746 const titleMarkup = React.createElement(
9747 'div',
9748 { className: styles$73.Title },
9749 React.createElement(
9750 'div',
9751 null,
9752 React.createElement(
9753 DisplayText$1,
9754 { size: 'large', element: 'h1' },
9755 title
9756 )
9757 ),
9758 React.createElement(
9759 'div',
9760 null,
9761 titleMetadata
9762 )
9763 );
9764 return primaryActionMarkup ? React.createElement(
9765 'div',
9766 { className: className },
9767 navigationMarkup,
9768 React.createElement(
9769 'div',
9770 { className: styles$73.MainContent },
9771 React.createElement(
9772 'div',
9773 { className: styles$73.TitleAndActions },
9774 titleMarkup,
9775 actionsMarkup
9776 ),
9777 primaryActionMarkup
9778 )
9779 ) : React.createElement(
9780 'div',
9781 { className: className },
9782 navigationMarkup,
9783 titleMarkup,
9784 actionsMarkup
9785 );
9786 }
9787 get hasRollup() {
9788 var _props2 = this.props,
9789 _props2$secondaryActi = _props2.secondaryActions;
9790 const secondaryActions = _props2$secondaryActi === undefined ? [] : _props2$secondaryActi;
9791 var _props2$actionGroups = _props2.actionGroups;
9792 const actionGroups = _props2$actionGroups === undefined ? [] : _props2$actionGroups;
9793
9794 return secondaryActions.length + actionGroups.length > 1;
9795 }
9796 renderSecondaryActions() {
9797 var _state = this.state;
9798 const openActionGroup = _state.openActionGroup,
9799 rollupOpen = _state.rollupOpen;
9800 var _props3 = this.props,
9801 _props3$secondaryActi = _props3.secondaryActions;
9802 const secondaryActions = _props3$secondaryActi === undefined ? [] : _props3$secondaryActi;
9803 var _props3$actionGroups = _props3.actionGroups;
9804 const actionGroups = _props3$actionGroups === undefined ? [] : _props3$actionGroups;
9805
9806 if (secondaryActions.length === 0 && actionGroups.length === 0) {
9807 return null;
9808 }
9809 const secondaryActionMarkup = secondaryActions.length > 0 ? secondaryActionsFrom(secondaryActions) : null;
9810 const actionGroupsMarkup = actionGroups.length > 0 ? actionGroups.map(({ title, icon, actions, details }) => {
9811 const detailsClassName = styles.classNames(styles$73.Details, actions && Array.isArray(actions) && actions.length > 0 && styles$73.withActions);
9812 const detailsMarkup = details ? React.createElement(
9813 'div',
9814 { className: detailsClassName },
9815 details
9816 ) : null;
9817 const showIndicator = hasNewStatus(actions);
9818 const active = title === openActionGroup;
9819 return React.createElement(
9820 'div',
9821 { className: styles$73.ActionGroup, key: `ActionGroup-${title}` },
9822 React.createElement(
9823 Popover$1,
9824 { key: title, active: active
9825 // eslint-disable-next-line react/jsx-no-bind
9826 , onClose: this.handleActionGroupClose.bind(this, title), activator: React.createElement(
9827 Action$1,
9828 { showIndicator: showIndicator, hasIndicator: active, disclosure: true, icon: icon
9829 // eslint-disable-next-line react/jsx-no-bind
9830 , onAction: this.handleActionGroupOpen.bind(this, title) },
9831 title
9832 ) },
9833 React.createElement(ActionList$1, { items: actions
9834 // eslint-disable-next-line react/jsx-no-bind
9835 , onActionAnyItem: this.handleActionGroupClose.bind(this, title) }),
9836 detailsMarkup
9837 )
9838 );
9839 }) : null;
9840 const showIndicator = false && actionGroups.filter(group => hasNewStatus(group.actions)).length > 0;
9841 const rollupMarkup = this.hasRollup ? React.createElement(
9842 'div',
9843 { className: styles$73.Rollup },
9844 React.createElement(
9845 Popover$1,
9846 { active: rollupOpen, onClose: this.handleRollupToggle, activator: React.createElement(
9847 Button$2,
9848 { outline: false && showIndicator, disclosure: true, onClick: this.handleRollupToggle },
9849 'Actions'
9850 ) },
9851 React.createElement(ActionList$1, { items: secondaryActions, sections: actionGroups.map(convertActionGroupToActionListSection), onActionAnyItem: this.handleRollupToggle })
9852 )
9853 ) : null;
9854 return React.createElement(
9855 'div',
9856 { className: styles$73.SecondaryActions },
9857 rollupMarkup,
9858 React.createElement(
9859 'div',
9860 { className: styles$73.IndividualActions },
9861 secondaryActionMarkup,
9862 actionGroupsMarkup
9863 )
9864 );
9865 }
9866 handleRollupToggle() {
9867 this.setState(({ rollupOpen }) => ({ rollupOpen: !rollupOpen }));
9868 }
9869 handleActionGroupClose(group) {
9870 this.setState(({ openActionGroup }) => openActionGroup === group ? { openActionGroup: undefined } : {});
9871 }
9872 handleActionGroupOpen(group) {
9873 this.setState({ openActionGroup: group });
9874 }
9875}
9876tslib_1.__decorate([decorators.autobind], Header$5.prototype, "handleRollupToggle", null);
9877function hasNewStatus(actions) {
9878 for (let i = 0; i < actions.length; i++) {
9879 const badge = actions[i].badge;
9880
9881 if (badge && badge.status === 'new') {
9882 return true;
9883 }
9884 }
9885 return false;
9886}
9887function convertActionGroupToActionListSection({ title, actions }) {
9888 return { title, items: actions };
9889}
9890function secondaryActionsFrom(actions) {
9891 return actions.map((_a, index) => {
9892 var content = _a.content,
9893 action = tslib_1.__rest(_a, ["content"]);
9894 return React.createElement(
9895 Action$1,
9896 Object.assign({}, action, { key: `Action-${content || index}` }),
9897 content
9898 );
9899 });
9900}
9901
9902const EASDK_PROPS = ['title', 'icon', 'breadcrumbs', 'secondaryActions', 'actionGroups', 'primaryAction', 'pagination'];
9903class Page$1 extends React.PureComponent {
9904 componentDidMount() {
9905 if (this.props.polaris.easdk == null) {
9906 return;
9907 }
9908 this.handleEASDKMessaging();
9909 }
9910 componentDidUpdate(prevProps) {
9911 if (this.props.polaris.easdk == null) {
9912 return;
9913 }
9914 const prevEASDKProps = pick(prevProps, EASDK_PROPS);
9915 const currentEASDKProps = pick(this.props, EASDK_PROPS);
9916 if (!isEqual(prevEASDKProps, currentEASDKProps)) {
9917 this.handleEASDKMessaging();
9918 }
9919 }
9920 render() {
9921 const _a = this.props,
9922 children = _a.children,
9923 fullWidth = _a.fullWidth,
9924 singleColumn = _a.singleColumn,
9925 rest = tslib_1.__rest(_a, ["children", "fullWidth", "singleColumn"]);
9926 const className = styles.classNames(styles$73.Page, fullWidth && styles$73.fullWidth, singleColumn && styles$73.singleColumn);
9927 const headerMarkup = this.props.polaris.easdk || !this.hasHeaderContent() ? null : React.createElement(Header$5, rest);
9928 return React.createElement(
9929 'div',
9930 { className: className },
9931 headerMarkup,
9932 React.createElement(
9933 'div',
9934 { className: styles$73.Content },
9935 children
9936 )
9937 );
9938 }
9939 handleEASDKMessaging() {
9940 const easdk = this.props.polaris.easdk;
9941
9942 if (easdk) {
9943 easdk.Bar.update(this.props);
9944 }
9945 }
9946 hasHeaderContent() {
9947 var _props = this.props;
9948 const title = _props.title,
9949 primaryAction = _props.primaryAction,
9950 secondaryActions = _props.secondaryActions,
9951 breadcrumbs = _props.breadcrumbs;
9952
9953 return title && title !== '' || primaryAction || secondaryActions && secondaryActions.length > 0 || breadcrumbs && breadcrumbs.length > 0;
9954 }
9955}
9956var Page$2 = withAppProvider()(Page$1);
9957
9958var styles$76 = {
9959 "PageActions": "p_t4",
9960 "temporary": "p_rn",
9961 "translateUp": "p_vt",
9962};
9963
9964function PageActions$1({ primaryAction, secondaryActions, temporary }) {
9965 const className = styles.classNames(styles$76.PageActions, temporary && styles$76.temporary);
9966 const primaryActionMarkup = primaryAction ? buttonsFrom(primaryAction, { primary: true }) : null;
9967 const secondaryActionsMarkup = secondaryActions ? React.createElement(
9968 ButtonGroup$1,
9969 null,
9970 buttonsFrom(secondaryActions)
9971 ) : null;
9972 const distribution = secondaryActionsMarkup ? 'equalSpacing' : 'trailing';
9973 const unsavedChangesMarkup = temporary ? React.createElement(
9974 TextStyle$1,
9975 { variation: 'subdued' },
9976 'You have unsaved changes.'
9977 ) : null;
9978 return React.createElement(
9979 'div',
9980 { className: className },
9981 React.createElement(
9982 Stack$1,
9983 { distribution: distribution, spacing: 'tight', alignment: 'center' },
9984 secondaryActionsMarkup,
9985 unsavedChangesMarkup,
9986 primaryActionMarkup
9987 )
9988 );
9989}
9990
9991var styles$77 = {
9992 "RangeSlider": "p_zg",
9993 "disabled": "p_cm",
9994 "InputWrapper": "p_m9",
9995 "Prefix": "p_hg",
9996 "Suffix": "p_bn",
9997 "Input": "p_jg",
9998 "error": "p_k1",
9999 "Output": "p_r9",
10000 "OutputBubble": "p_w8",
10001 "OutputText": "p_oe",
10002};
10003
10004const getUniqueID$12 = other.createUniqueIDFactory('RangeSlider');
10005const cssVarPrefix = '--Polaris-RangeSlider-';
10006class RangeSlider$1 extends React.PureComponent {
10007 constructor(props) {
10008 super(props);
10009 this.state = {
10010 id: props.id || getUniqueID$12()
10011 };
10012 }
10013 static getDerivedStateFromProps(nextProps, prevState) {
10014 return nextProps.id != null && nextProps.id !== prevState.id ? {
10015 id: nextProps.id || prevState.id
10016 } : null;
10017 }
10018 render() {
10019 const id = this.state.id;
10020 var _props = this.props,
10021 _props$min = _props.min;
10022 const min = _props$min === undefined ? 0 : _props$min;
10023 var _props$max = _props.max;
10024 const max = _props$max === undefined ? 100 : _props$max;
10025 var _props2 = this.props;
10026 const label = _props2.label,
10027 labelAction = _props2.labelAction,
10028 labelHidden = _props2.labelHidden,
10029 step = _props2.step,
10030 value = _props2.value,
10031 output = _props2.output,
10032 helpText = _props2.helpText,
10033 error = _props2.error,
10034 disabled = _props2.disabled,
10035 prefix = _props2.prefix,
10036 suffix = _props2.suffix,
10037 onFocus = _props2.onFocus,
10038 onBlur = _props2.onBlur;
10039
10040 const describedBy = [];
10041 if (error) {
10042 describedBy.push(`${id}Error`);
10043 }
10044 if (helpText) {
10045 describedBy.push(helpTextID$1(id));
10046 }
10047 const ariaDescribedBy = describedBy.length ? describedBy.join(' ') : undefined;
10048 const sliderProgress = (value - min) * 100 / (max - min);
10049 const cssVars = {
10050 [`${cssVarPrefix}min`]: min,
10051 [`${cssVarPrefix}max`]: max,
10052 [`${cssVarPrefix}current`]: value,
10053 [`${cssVarPrefix}progress`]: `${sliderProgress}%`,
10054 [`${cssVarPrefix}output-factor`]: invertNumber((sliderProgress - 50) / 100)
10055 };
10056 const outputMarkup = !disabled && output && React.createElement(
10057 'output',
10058 { htmlFor: id, className: styles$77.Output },
10059 React.createElement(
10060 'div',
10061 { className: styles$77.OutputBubble },
10062 React.createElement(
10063 'span',
10064 { className: styles$77.OutputText },
10065 value
10066 )
10067 )
10068 );
10069 const prefixMarkup = prefix && React.createElement(
10070 'div',
10071 { className: styles$77.Prefix },
10072 prefix
10073 );
10074 const suffixMarkup = suffix && React.createElement(
10075 'div',
10076 { className: styles$77.Suffix },
10077 suffix
10078 );
10079 const className = styles.classNames(styles$77.RangeSlider, error && styles$77.error, disabled && styles$77.disabled);
10080 return React.createElement(
10081 Labelled$1,
10082 { id: id, label: label, error: error, action: labelAction, labelHidden: labelHidden, helpText: helpText },
10083 React.createElement(
10084 'div',
10085 { className: className, style: cssVars },
10086 prefixMarkup,
10087 React.createElement(
10088 'div',
10089 { className: styles$77.InputWrapper },
10090 React.createElement('input', { type: 'range', className: styles$77.Input, id: id, name: id, min: min, max: max, step: step, value: value, disabled: disabled, onChange: this.handleChange, onFocus: onFocus, onBlur: onBlur, 'aria-valuemin': min, 'aria-valuemax': max, 'aria-valuenow': value, 'aria-invalid': Boolean(error), 'aria-describedby': ariaDescribedBy }),
10091 outputMarkup
10092 ),
10093 suffixMarkup
10094 )
10095 );
10096 }
10097 handleChange(event) {
10098 const onChange = this.props.onChange;
10099
10100 if (onChange == null) {
10101 return;
10102 }
10103 onChange(parseFloat(event.currentTarget.value), this.state.id);
10104 }
10105}
10106tslib_1.__decorate([decorators.autobind], RangeSlider$1.prototype, "handleChange", null);
10107function invertNumber(number) {
10108 if (Math.sign(number) === 1) {
10109 return -Math.abs(number);
10110 } else if (Math.sign(number) === -1) {
10111 return Math.abs(number);
10112 } else {
10113 return 0;
10114 }
10115}
10116var RangeSlider$2 = withAppProvider()(RangeSlider$1);
10117
10118// eslint-disable-next-line shopify/strict-component-boundaries
10119function SettingToggle$1({ enabled, action, children }) {
10120 const actionMarkup = action ? buttonFrom(action, { primary: !enabled }) : null;
10121 return React.createElement(
10122 Card$1,
10123 { sectioned: true },
10124 React.createElement(
10125 SettingAction$1,
10126 { action: actionMarkup },
10127 children
10128 )
10129 );
10130}
10131
10132class Sticky$1 extends React.Component {
10133 constructor() {
10134 super(...arguments);
10135 this.state = {
10136 isSticky: false,
10137 style: {}
10138 };
10139 this.placeHolderNode = null;
10140 this.stickyNode = null;
10141 }
10142 componentDidMount() {
10143 const stickyManager = this.context.polaris.stickyManager;
10144 var _props = this.props;
10145 const boundingElement = _props.boundingElement,
10146 offset = _props.offset,
10147 disableWhenStacked = _props.disableWhenStacked;
10148
10149 stickyManager.registerStickyItem({
10150 stickyNode: this.stickyNode,
10151 placeHolderNode: this.placeHolderNode,
10152 handlePositioning: this.handlePositioning,
10153 offset,
10154 boundingElement,
10155 disableWhenStacked
10156 });
10157 }
10158 componentWillUnmount() {
10159 const stickyManager = this.context.polaris.stickyManager;
10160
10161 stickyManager.unregisterStickyItem(this.stickyNode);
10162 }
10163 render() {
10164 var _state = this.state;
10165 const style = _state.style,
10166 isSticky = _state.isSticky;
10167 const children = this.props.children;
10168
10169 const childrenContent = typeof children === 'function' ? children(isSticky) : children;
10170 return React.createElement(
10171 'div',
10172 null,
10173 React.createElement('div', { ref: this.setPlaceHolderNode }),
10174 React.createElement(
10175 'div',
10176 { ref: this.setStickyNode, style: style },
10177 childrenContent
10178 )
10179 );
10180 }
10181 setPlaceHolderNode(node) {
10182 this.placeHolderNode = node;
10183 }
10184 setStickyNode(node) {
10185 this.stickyNode = node;
10186 }
10187 handlePositioning(stick, top = 0, left = 0, width = 0) {
10188 const isSticky = this.state.isSticky;
10189
10190 if (stick && !isSticky || !stick && isSticky) {
10191 this.adjustPlaceHolderNode(stick);
10192 this.setState({ isSticky: !isSticky });
10193 }
10194 const style = stick ? {
10195 position: 'fixed',
10196 top,
10197 left,
10198 width
10199 } : {};
10200 this.setState({ style });
10201 }
10202 adjustPlaceHolderNode(add) {
10203 if (this.placeHolderNode && this.stickyNode) {
10204 this.placeHolderNode.style.paddingBottom = add ? `${geometry.getRectForNode(this.stickyNode).height}px` : '0px';
10205 }
10206 }
10207}
10208Sticky$1.contextTypes = polarisAppProviderContextTypes;
10209tslib_1.__decorate([decorators.autobind], Sticky$1.prototype, "setPlaceHolderNode", null);
10210tslib_1.__decorate([decorators.autobind], Sticky$1.prototype, "setStickyNode", null);
10211tslib_1.__decorate([decorators.autobind], Sticky$1.prototype, "handlePositioning", null);
10212tslib_1.__decorate([decorators.autobind], Sticky$1.prototype, "adjustPlaceHolderNode", null);
10213
10214var styles$78 = {
10215 "Tabs": "p_j7",
10216 "fitted": "p_l7",
10217 "TabContainer": "p_l5",
10218 "Tab": "p_s5",
10219 "Title": "p_wz",
10220 "fillSpace": "p_bh",
10221 "Tab-selected": "p_ze",
10222 "Panel": "p_kw",
10223 "List": "p_x2",
10224 "Item": "p_wv",
10225 "DisclosureTab": "p_oq",
10226 "DisclosureTab-visible": "p_zr",
10227 "DisclosureActivator": "p_po",
10228 "TabMeasurer": "p_x9",
10229};
10230
10231class Item$16 extends React.PureComponent {
10232 constructor() {
10233 super(...arguments);
10234 this.focusedNode = null;
10235 }
10236 componentDidMount() {
10237 const focusedNode = this.focusedNode;
10238 const focused = this.props.focused;
10239
10240 if (focusedNode && focusedNode instanceof HTMLElement && focused) {
10241 focusedNode.focus();
10242 }
10243 }
10244 componentDidUpdate() {
10245 const focusedNode = this.focusedNode;
10246 const focused = this.props.focused;
10247
10248 if (focusedNode && focusedNode instanceof HTMLElement && focused) {
10249 focusedNode.focus();
10250 }
10251 }
10252 render() {
10253 var _props = this.props;
10254 const id = _props.id,
10255 panelID = _props.panelID,
10256 children = _props.children,
10257 url = _props.url,
10258 accessibilityLabel = _props.accessibilityLabel;
10259 var _props$onClick = _props.onClick;
10260 const onClick = _props$onClick === undefined ? other.noop : _props$onClick;
10261
10262 const sharedProps = {
10263 id,
10264 ref: this.setFocusedNode,
10265 onClick,
10266 className: styles$78.Item,
10267 'aria-controls': panelID,
10268 'aria-selected': false,
10269 'aria-label': accessibilityLabel
10270 };
10271 const markup = url ? React.createElement(UnstyledLink$2, Object.assign({ url }, sharedProps), children) : React.createElement(
10272 'button',
10273 Object.assign({}, sharedProps, { type: 'button' }),
10274 children
10275 );
10276 return React.createElement(
10277 'li',
10278 { role: 'presentation' },
10279 markup
10280 );
10281 }
10282 setFocusedNode(node) {
10283 this.focusedNode = node;
10284 }
10285}
10286tslib_1.__decorate([decorators.autobind], Item$16.prototype, "setFocusedNode", null);
10287
10288class List$2 extends React.PureComponent {
10289 render() {
10290 var _props = this.props;
10291 const focusIndex = _props.focusIndex,
10292 disclosureTabs = _props.disclosureTabs;
10293 var _props$onClick = _props.onClick;
10294 const onClick = _props$onClick === undefined ? other.noop : _props$onClick;
10295
10296 const tabs = disclosureTabs.map((_a, index) => {
10297 var id = _a.id,
10298 content = _a.content,
10299 tabProps = tslib_1.__rest(_a, ["id", "content"]);
10300
10301 return React.createElement(
10302 Item$16,
10303 Object.assign({}, tabProps, { key: id, id: id, focused: index === focusIndex
10304 // eslint-disable-next-line react/jsx-no-bind
10305 , onClick: onClick.bind(null, id) }),
10306 content
10307 );
10308 });
10309 return React.createElement(
10310 'ul',
10311 { className: styles$78.List, onKeyDown: handleKeyDown$2, onKeyUp: this.handleKeypress },
10312 tabs
10313 );
10314 }
10315 handleKeypress(event) {
10316 var _props$onKeyPress = this.props.onKeyPress;
10317 const onKeyPress = _props$onKeyPress === undefined ? other.noop : _props$onKeyPress;
10318
10319 onKeyPress(event);
10320 }
10321}
10322tslib_1.__decorate([decorators.autobind], List$2.prototype, "handleKeypress", null);
10323function handleKeyDown$2(event) {
10324 const key = event.key;
10325
10326 if (key === 'ArrowUp' || key === 'ArrowDown' || key === 'ArrowLeft' || key === 'ArrowRight') {
10327 event.preventDefault();
10328 event.stopPropagation();
10329 }
10330}
10331
10332function Panel$1({ id, tabID, children }) {
10333 return React.createElement(
10334 'div',
10335 { className: styles$78.Panel, id: id, role: 'tabpanel', 'aria-labelledby': tabID, tabIndex: -1 },
10336 children
10337 );
10338}
10339
10340class Tab$1 extends React.PureComponent {
10341 constructor() {
10342 super(...arguments);
10343 this.node = null;
10344 }
10345 // A tab can start selected when it is moved from the disclosure dropdown
10346 // into the main list, so we need to send focus from the tab to the panel
10347 // on mount and update
10348 componentDidMount() {
10349 var _props = this.props;
10350 const id = _props.id,
10351 measuring = _props.measuring,
10352 selected = _props.selected,
10353 panelID = _props.panelID,
10354 focused = _props.focused;
10355
10356 if (measuring) {
10357 return;
10358 }
10359 // Because of timing issues with the render, we may still have the old,
10360 // in-disclosure version of the tab that has focus. Check for this
10361 // as a second indicator of focus
10362 const itemHadFocus = focused || document.activeElement && document.activeElement.id === id;
10363 // If we just check for selected, the panel for the active tab will
10364 // be focused on page load, which we don’t want
10365 if (itemHadFocus && selected && panelID != null) {
10366 focusPanelID(panelID);
10367 }
10368 }
10369 componentDidUpdate(previousProps) {
10370 const wasSelected = previousProps.selected;
10371 var _props2 = this.props;
10372 const focused = _props2.focused,
10373 measuring = _props2.measuring,
10374 selected = _props2.selected,
10375 panelID = _props2.panelID;
10376
10377 if (measuring) {
10378 return;
10379 }
10380 if (selected && !wasSelected && panelID != null) {
10381 focusPanelID(panelID);
10382 } else if (focused && this.node != null) {
10383 focus.focusFirstFocusableNode(this.node);
10384 }
10385 }
10386 render() {
10387 var _props3 = this.props;
10388 const id = _props3.id,
10389 focused = _props3.focused,
10390 siblingTabHasFocus = _props3.siblingTabHasFocus,
10391 children = _props3.children,
10392 onClick = _props3.onClick,
10393 selected = _props3.selected,
10394 url = _props3.url,
10395 panelID = _props3.panelID,
10396 measuring = _props3.measuring,
10397 accessibilityLabel = _props3.accessibilityLabel;
10398
10399 const handleClick = onClick && onClick.bind(null, id);
10400 const className = styles.classNames(styles$78.Tab, selected && styles$78['Tab-selected']);
10401 let tabIndex;
10402 if (selected && !siblingTabHasFocus && !measuring) {
10403 tabIndex = 0;
10404 } else if (focused && !measuring) {
10405 tabIndex = 0;
10406 } else {
10407 tabIndex = -1;
10408 }
10409 const markup = url ? React.createElement(
10410 UnstyledLink$2,
10411 { id: id, url: url, role: 'tab', tabIndex: tabIndex, onClick: handleClick, className: className, 'aria-selected': selected, 'aria-controls': panelID, 'aria-label': accessibilityLabel, onMouseUp: handleMouseUpByBlurring },
10412 React.createElement(
10413 'span',
10414 { className: styles$78.Title },
10415 children
10416 )
10417 ) : React.createElement(
10418 'button',
10419 { id: id, role: 'tab', type: 'button', tabIndex: tabIndex, className: className, onClick: handleClick, 'aria-selected': selected, 'aria-controls': panelID, 'aria-label': accessibilityLabel, onMouseUp: handleMouseUpByBlurring },
10420 React.createElement(
10421 'span',
10422 { className: styles$78.Title },
10423 children
10424 )
10425 );
10426 return React.createElement(
10427 'li',
10428 { role: 'presentation', className: styles$78.TabContainer, ref: this.setNode },
10429 markup
10430 );
10431 }
10432 setNode(node) {
10433 this.node = node;
10434 }
10435}
10436tslib_1.__decorate([decorators.autobind], Tab$1.prototype, "setNode", null);
10437function focusPanelID(panelID) {
10438 const panel = document.getElementById(panelID);
10439 if (panel) {
10440 panel.focus();
10441 }
10442}
10443var Tab$2 = withAppProvider()(Tab$1);
10444
10445class TabMeasurer$1 extends React.PureComponent {
10446 constructor() {
10447 super(...arguments);
10448 this.containerNode = null;
10449 }
10450 componentDidMount() {
10451 this.handleMeasurement();
10452 if (process.env.NODE_ENV === 'development') {
10453 // We need to defer the calculation in development so the
10454 // styles have time to be injected.
10455 setTimeout(this.handleMeasurement, 0);
10456 }
10457 }
10458 componentDidUpdate(prevProps) {
10459 if (prevProps.tabs !== this.props.tabs) {
10460 this.handleMeasurement();
10461 }
10462 }
10463 render() {
10464 var _props = this.props;
10465 const selected = _props.selected,
10466 tabs = _props.tabs,
10467 activator = _props.activator,
10468 tabToFocus = _props.tabToFocus,
10469 siblingTabHasFocus = _props.siblingTabHasFocus;
10470
10471 const tabsMarkup = tabs.map((tab, index) => {
10472 return React.createElement(
10473 Tab$2,
10474 { measuring: true, key: `${index}${tab.id}Hidden`, id: `${tab.id}Measurer`, siblingTabHasFocus: siblingTabHasFocus, focused: index === tabToFocus, selected: index === selected, onClick: other.noop, url: tab.url },
10475 tab.content
10476 );
10477 });
10478 const classname = styles.classNames(styles$78.Tabs, styles$78.TabMeasurer);
10479 return React.createElement(
10480 'div',
10481 { className: classname, ref: this.setContainerNode },
10482 React.createElement(EventListener$1, { event: 'resize', handler: this.handleMeasurement }),
10483 tabsMarkup,
10484 activator
10485 );
10486 }
10487 setContainerNode(node) {
10488 this.containerNode = node;
10489 }
10490 handleMeasurement() {
10491 if (this.containerNode == null) {
10492 return;
10493 }
10494 const domNode = ReactDOM.findDOMNode(this);
10495 if (domNode == null) {
10496 return;
10497 }
10498 // const hiddenTabNodes = domNode.children
10499 const handleMeasurement = this.props.handleMeasurement;
10500
10501 const containerWidth = this.containerNode.offsetWidth;
10502 const tabMeasurerNode = ReactDOM.findDOMNode(this);
10503 const hiddenTabNodes = tabMeasurerNode instanceof Element && tabMeasurerNode.children;
10504 const hiddenTabNodesArray = [].slice.call(hiddenTabNodes);
10505 const hiddenTabWidths = hiddenTabNodesArray.map(node => {
10506 return node.getBoundingClientRect().width;
10507 });
10508 const disclosureWidth = hiddenTabWidths.pop();
10509 handleMeasurement({
10510 containerWidth,
10511 disclosureWidth,
10512 hiddenTabWidths
10513 });
10514 }
10515}
10516tslib_1.__decorate([decorators.autobind], TabMeasurer$1.prototype, "setContainerNode", null);
10517tslib_1.__decorate([decorators.autobind], TabMeasurer$1.prototype, "handleMeasurement", null);
10518
10519class Tabs$1 extends React.PureComponent {
10520 constructor() {
10521 super(...arguments);
10522 this.state = {
10523 disclosureWidth: 0,
10524 containerWidth: Infinity,
10525 tabWidths: [],
10526 visibleTabs: [],
10527 hiddenTabs: [],
10528 showDisclosure: false,
10529 tabToFocus: -1
10530 };
10531 }
10532 // eslint-disable-next-line react/no-deprecated
10533 componentWillReceiveProps(nextProps) {
10534 const selected = this.props.selected;
10535 var _state = this.state;
10536 const disclosureWidth = _state.disclosureWidth,
10537 tabWidths = _state.tabWidths,
10538 containerWidth = _state.containerWidth,
10539 tabToFocus = _state.tabToFocus;
10540
10541 var _getVisibleAndHiddenT = getVisibleAndHiddenTabIndices(nextProps.tabs, nextProps.selected, disclosureWidth, tabWidths, containerWidth);
10542
10543 const visibleTabs = _getVisibleAndHiddenT.visibleTabs,
10544 hiddenTabs = _getVisibleAndHiddenT.hiddenTabs;
10545
10546 this.setState({
10547 visibleTabs,
10548 hiddenTabs,
10549 tabToFocus: selected === nextProps.selected ? -1 : tabToFocus,
10550 showDisclosure: false
10551 });
10552 }
10553 render() {
10554 var _props = this.props;
10555 const tabs = _props.tabs,
10556 selected = _props.selected,
10557 fitted = _props.fitted,
10558 children = _props.children;
10559 var _state2 = this.state;
10560 const tabToFocus = _state2.tabToFocus,
10561 visibleTabs = _state2.visibleTabs,
10562 hiddenTabs = _state2.hiddenTabs,
10563 showDisclosure = _state2.showDisclosure;
10564
10565 const disclosureTabs = hiddenTabs.map(tabIndex => tabs[tabIndex]);
10566 const panelMarkup = children ? React.createElement(
10567 Panel$1,
10568 { id: tabs[selected].panelID || `${tabs[selected].id}-panel`, tabID: tabs[selected].id },
10569 children
10570 ) : null;
10571 const tabsMarkup = visibleTabs.sort((tabA, tabB) => tabA - tabB).map(tabIndex => this.renderTabMarkup(tabs[tabIndex], tabIndex));
10572 const disclosureActivatorVisible = visibleTabs.length < tabs.length;
10573 const classname = styles.classNames(styles$78.Tabs, fitted && styles$78.fitted, disclosureActivatorVisible && styles$78.fillSpace);
10574 const disclosureTabClassName = styles.classNames(styles$78.DisclosureTab, disclosureActivatorVisible && styles$78['DisclosureTab-visible']);
10575 const activator = React.createElement(
10576 'button',
10577 { tabIndex: -1, className: styles$78.DisclosureActivator, onClick: this.handleDisclosureActivatorClick },
10578 React.createElement(Icon$2, { source: 'horizontalDots' })
10579 );
10580 return React.createElement(
10581 'div',
10582 null,
10583 React.createElement(
10584 'ul',
10585 { role: 'tablist', className: classname, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: handleKeyDown$1, onKeyUp: this.handleKeyPress },
10586 tabsMarkup,
10587 React.createElement(
10588 'li',
10589 { role: 'presentation', className: disclosureTabClassName },
10590 React.createElement(
10591 Popover$1,
10592 { preferredPosition: 'below', activator: activator, active: disclosureActivatorVisible && showDisclosure, onClose: this.handleClose },
10593 React.createElement(List$2, { focusIndex: hiddenTabs.indexOf(tabToFocus), disclosureTabs: disclosureTabs, onClick: this.handleTabClick, onKeyPress: this.handleKeyPress })
10594 )
10595 )
10596 ),
10597 React.createElement(TabMeasurer$1, { tabToFocus: tabToFocus, activator: activator, selected: selected, tabs: tabs, siblingTabHasFocus: tabToFocus > -1, handleMeasurement: this.handleMeasurement }),
10598 panelMarkup
10599 );
10600 }
10601 handleKeyPress(event) {
10602 var _state3 = this.state;
10603 const tabToFocus = _state3.tabToFocus,
10604 visibleTabs = _state3.visibleTabs,
10605 hiddenTabs = _state3.hiddenTabs;
10606
10607 const tabsArrayInOrder = visibleTabs.concat(hiddenTabs);
10608 const key = event.key;
10609 let newFocus = tabsArrayInOrder.indexOf(tabToFocus);
10610 if (key === 'ArrowRight' || key === 'ArrowDown') {
10611 newFocus += 1;
10612 if (newFocus === tabsArrayInOrder.length) {
10613 newFocus = 0;
10614 }
10615 }
10616 if (key === 'ArrowLeft' || key === 'ArrowUp') {
10617 newFocus -= 1;
10618 if (newFocus === -1) {
10619 newFocus = tabsArrayInOrder.length - 1;
10620 }
10621 }
10622 this.setState({
10623 showDisclosure: hiddenTabs.indexOf(tabsArrayInOrder[newFocus]) > -1,
10624 tabToFocus: tabsArrayInOrder[newFocus]
10625 });
10626 }
10627 renderTabMarkup(tab, index) {
10628 const selected = this.props.selected;
10629 const tabToFocus = this.state.tabToFocus;
10630
10631 return React.createElement(
10632 Tab$2,
10633 { key: `${index}-${tab.id}`, id: tab.id, siblingTabHasFocus: tabToFocus > -1, focused: index === tabToFocus, selected: index === selected, onClick: this.handleTabClick, panelID: tab.panelID || `${tab.id}-panel`, accessibilityLabel: tab.accessibilityLabel, url: tab.url },
10634 tab.content
10635 );
10636 }
10637 handleFocus(event) {
10638 var _props2 = this.props;
10639 const selected = _props2.selected,
10640 tabs = _props2.tabs;
10641 // If we are explicitly focusing one of the non-selected tabs, use it
10642 // move the focus to it
10643
10644 const target$$1 = event.target;
10645 if (target$$1.classList.contains(styles$78.Tab) || target$$1.classList.contains(styles$78.Item)) {
10646 let tabToFocus = -1;
10647 tabs.every((tab, index) => {
10648 if (tab.id === target$$1.id) {
10649 tabToFocus = index;
10650 return false;
10651 }
10652 return true;
10653 });
10654 this.setState({ tabToFocus });
10655 return;
10656 }
10657 if (target$$1.classList.contains(styles$78.DisclosureActivator)) {
10658 return;
10659 }
10660 // If we are coming in from somewhere other than another tab, focus the
10661 // selected tab, and the focus (click) is not on the disclosure activator,
10662 // focus the selected tab
10663 if (!event.relatedTarget) {
10664 this.setState({ tabToFocus: selected });
10665 return;
10666 }
10667 const relatedTarget = event.relatedTarget;
10668 if (!relatedTarget.classList.contains(styles$78.Tab) && !relatedTarget.classList.contains(styles$78.Item) && !relatedTarget.classList.contains(styles$78.DisclosureActivator)) {
10669 this.setState({ tabToFocus: selected });
10670 }
10671 }
10672 handleBlur(event) {
10673 // If we blur and the target is not another tab, forget the focus position
10674 if (event.relatedTarget == null) {
10675 this.setState({ tabToFocus: -1 });
10676 return;
10677 }
10678 const target$$1 = event.relatedTarget;
10679 // If we are going to anywhere other than another tab, lose the last focused tab
10680 if (!target$$1.classList.contains(styles$78.Tab) && !target$$1.classList.contains(styles$78.Item)) {
10681 this.setState({ tabToFocus: -1 });
10682 }
10683 }
10684 handleDisclosureActivatorClick() {
10685 this.setState(({ showDisclosure }) => ({ showDisclosure: !showDisclosure }));
10686 }
10687 handleClose() {
10688 this.setState({
10689 showDisclosure: false
10690 });
10691 }
10692 handleMeasurement(measurements) {
10693 var _props3 = this.props;
10694 const tabs = _props3.tabs,
10695 selected = _props3.selected;
10696 const tabToFocus = this.state.tabToFocus;
10697 const tabWidths = measurements.hiddenTabWidths,
10698 containerWidth = measurements.containerWidth,
10699 disclosureWidth = measurements.disclosureWidth;
10700
10701 var _getVisibleAndHiddenT2 = getVisibleAndHiddenTabIndices(tabs, selected, disclosureWidth, tabWidths, containerWidth);
10702
10703 const visibleTabs = _getVisibleAndHiddenT2.visibleTabs,
10704 hiddenTabs = _getVisibleAndHiddenT2.hiddenTabs;
10705
10706 this.setState({
10707 tabToFocus: tabToFocus === -1 ? -1 : selected,
10708 visibleTabs,
10709 hiddenTabs,
10710 disclosureWidth,
10711 containerWidth,
10712 tabWidths
10713 });
10714 }
10715 handleTabClick(id) {
10716 var _props4 = this.props;
10717 const tabs = _props4.tabs;
10718 var _props4$onSelect = _props4.onSelect;
10719 const onSelect = _props4$onSelect === undefined ? other.noop : _props4$onSelect;
10720
10721 const tab = tabs.find(aTab => aTab.id === id);
10722 if (tab == null) {
10723 return;
10724 }
10725 const selectedIndex = tabs.indexOf(tab);
10726 onSelect(selectedIndex);
10727 }
10728}
10729Tabs$1.Panel = Panel$1;
10730tslib_1.__decorate([decorators.autobind], Tabs$1.prototype, "handleKeyPress", null);
10731tslib_1.__decorate([decorators.autobind], Tabs$1.prototype, "renderTabMarkup", null);
10732tslib_1.__decorate([decorators.autobind], Tabs$1.prototype, "handleFocus", null);
10733tslib_1.__decorate([decorators.autobind], Tabs$1.prototype, "handleBlur", null);
10734tslib_1.__decorate([decorators.autobind], Tabs$1.prototype, "handleDisclosureActivatorClick", null);
10735tslib_1.__decorate([decorators.autobind], Tabs$1.prototype, "handleClose", null);
10736tslib_1.__decorate([decorators.autobind], Tabs$1.prototype, "handleMeasurement", null);
10737tslib_1.__decorate([decorators.autobind], Tabs$1.prototype, "handleTabClick", null);
10738function handleKeyDown$1(event) {
10739 const key = event.key;
10740
10741 if (key === 'ArrowUp' || key === 'ArrowDown' || key === 'ArrowLeft' || key === 'ArrowRight') {
10742 event.preventDefault();
10743 event.stopPropagation();
10744 }
10745}
10746function getVisibleAndHiddenTabIndices(tabs, selected, disclosureWidth, tabWidths, containerWidth) {
10747 const sumTabWidths = tabWidths.reduce((sum, width) => sum + width, 0);
10748 const arrayOfTabIndices = tabs.map((_, index) => {
10749 return index;
10750 });
10751 const visibleTabs = [];
10752 const hiddenTabs = [];
10753 if (containerWidth > sumTabWidths) {
10754 visibleTabs.push(...arrayOfTabIndices);
10755 } else {
10756 visibleTabs.push(selected);
10757 let newTabWidth = tabWidths[selected];
10758 arrayOfTabIndices.forEach(index => {
10759 if (index !== selected) {
10760 if (newTabWidth + tabWidths[index] > containerWidth - disclosureWidth) {
10761 hiddenTabs.push(index);
10762 return;
10763 }
10764 visibleTabs.push(index);
10765 newTabWidth += tabWidths[index];
10766 }
10767 });
10768 }
10769 return {
10770 visibleTabs,
10771 hiddenTabs
10772 };
10773}
10774
10775var styles$79 = {
10776 "Tag": "p_qk",
10777 "disabled": "p_ct",
10778 "TagText": "p_e9",
10779 "Button": "p_hw",
10780};
10781
10782function Tag$1({ children, disabled = false, onRemove, polaris: { intl } }) {
10783 const className = reactUtilities.classNames(disabled && styles$79.disabled, styles$79.Tag);
10784 const ariaLabel = intl.translate('Polaris.Tag.ariaLabel', { children });
10785 return React.createElement(
10786 'span',
10787 { className: className },
10788 React.createElement(
10789 'span',
10790 { title: children, className: styles$79.TagText },
10791 children
10792 ),
10793 React.createElement(
10794 'button',
10795 { type: 'button', 'aria-label': ariaLabel, className: styles$79.Button, onClick: onRemove, onMouseUp: handleMouseUpByBlurring, disabled: disabled },
10796 React.createElement(Icon$2, { source: 'cancelSmall' })
10797 )
10798 );
10799}
10800var Tag$2 = withAppProvider()(Tag$1);
10801
10802var styles$80 = {
10803 "TextField": "p_t8",
10804 "multiline": "p_el",
10805 "Input": "p_oh",
10806 "minimal": "p_mf",
10807 "focus": "p_og",
10808 "Backdrop": "p_q0",
10809 "hasValue": "p_ml",
10810 "error": "p_tr",
10811 "readOnly": "p_ou",
10812 "disabled": "p_bg",
10813 "Prefix": "p_fe",
10814 "Input-suffixed": "p_tv",
10815 "Suffix": "p_p7",
10816 "Spinner": "p_vv",
10817 "SpinnerIcon": "p_uf",
10818 "Resizer": "p_yz",
10819 "DummyInput": "p_hm",
10820 "Segment": "p_kk",
10821};
10822
10823class Resizer$1 extends React.PureComponent {
10824 constructor() {
10825 super(...arguments);
10826 this.contentNode = null;
10827 this.minimumLinesNode = null;
10828 }
10829 componentDidMount() {
10830 this.handleHeightCheck();
10831 if (process.env.NODE_ENV === 'development') {
10832 // We need to defer the calculation in development so the
10833 // styles have time to be injected.
10834 setTimeout(this.handleHeightCheck, 0);
10835 }
10836 }
10837 componentDidUpdate() {
10838 this.handleHeightCheck();
10839 }
10840 render() {
10841 var _props = this.props;
10842 const contents = _props.contents,
10843 minimumLines = _props.minimumLines;
10844
10845 const minimumLinesMarkup = minimumLines ? React.createElement('div', { ref: this.setMinimumLinesNode, className: styles$80.DummyInput, dangerouslySetInnerHTML: {
10846 __html: getContentsForMinimumLines(minimumLines)
10847 } }) : null;
10848 return React.createElement(
10849 'div',
10850 { 'aria-hidden': true, className: styles$80.Resizer },
10851 React.createElement(EventListener$1, { event: 'resize', handler: this.handleHeightCheck }),
10852 React.createElement('div', { ref: this.setContentNode, className: styles$80.DummyInput, dangerouslySetInnerHTML: { __html: getFinalContents(contents) } }),
10853 minimumLinesMarkup
10854 );
10855 }
10856 handleHeightCheck() {
10857 if (this.contentNode == null || this.minimumLinesNode == null) {
10858 return;
10859 }
10860 const contentHeight = this.contentNode.offsetHeight;
10861 const minimumHeight = this.setMinimumLinesNode ? this.minimumLinesNode.offsetHeight : 0;
10862 const newHeight = Math.max(contentHeight, minimumHeight);
10863 var _props2 = this.props;
10864 const currentHeight = _props2.currentHeight,
10865 onHeightChange = _props2.onHeightChange;
10866
10867 if (newHeight !== currentHeight) {
10868 onHeightChange(newHeight);
10869 }
10870 }
10871 setContentNode(node) {
10872 this.contentNode = node;
10873 }
10874 setMinimumLinesNode(node) {
10875 this.minimumLinesNode = node;
10876 }
10877}
10878tslib_1.__decorate([decorators.autobind], Resizer$1.prototype, "handleHeightCheck", null);
10879tslib_1.__decorate([decorators.autobind], Resizer$1.prototype, "setContentNode", null);
10880tslib_1.__decorate([decorators.autobind], Resizer$1.prototype, "setMinimumLinesNode", null);
10881const ENTITIES_TO_REPLACE = {
10882 '&': '&amp;',
10883 '<': '&lt;',
10884 '>': '&gt;',
10885 '\n': '<br>'
10886};
10887const REPLACE_REGEX$1 = /[\n&<>]/g;
10888function replaceEntity(entity) {
10889 return ENTITIES_TO_REPLACE[entity] || entity;
10890}
10891function getContentsForMinimumLines(minimumLines) {
10892 let content = '';
10893 for (let line = 0; line < minimumLines; line++) {
10894 content += '<br>';
10895 }
10896 return content;
10897}
10898function getFinalContents(contents) {
10899 return contents ? `${contents.replace(REPLACE_REGEX$1, replaceEntity)}<br>` : '<br>';
10900}
10901
10902function Spinner$4({ onChange, onClick }) {
10903 function handleStep(step) {
10904 return () => onChange(step);
10905 }
10906 return React.createElement(
10907 'div',
10908 { className: styles$80.Spinner, onClick: onClick, 'aria-hidden': true },
10909 React.createElement(
10910 'div',
10911 { role: 'button', className: styles$80.Segment, tabIndex: -1, onClick: handleStep(1) },
10912 React.createElement(
10913 'div',
10914 { className: styles$80.SpinnerIcon },
10915 React.createElement(Icon$2, { source: 'caretUp' })
10916 )
10917 ),
10918 React.createElement(
10919 'div',
10920 { role: 'button', className: styles$80.Segment, tabIndex: -1, onClick: handleStep(-1) },
10921 React.createElement(
10922 'div',
10923 { className: styles$80.SpinnerIcon },
10924 React.createElement(Icon$2, { source: 'caretDown' })
10925 )
10926 )
10927 );
10928}
10929
10930const getUniqueID$13 = other.createUniqueIDFactory('TextField');
10931class TextField$1 extends React.PureComponent {
10932 constructor(props) {
10933 super(props);
10934 this.state = {
10935 height: null,
10936 focus: false,
10937 id: props.id || getUniqueID$13()
10938 };
10939 }
10940 componentDidUpdate({ focused }) {
10941 if (this.input && focused !== this.props.focused && this.props.focused === true) {
10942 this.input.focus();
10943 }
10944 }
10945 // eslint-disable-next-line react/no-deprecated
10946 componentWillReceiveProps(newProps) {
10947 this.setState(prevState => ({
10948 id: newProps.id || prevState.id
10949 }));
10950 }
10951 render() {
10952 var _props = this.props,
10953 _props$id = _props.id;
10954 const id = _props$id === undefined ? this.state.id : _props$id;
10955 var _props$value = _props.value;
10956 const value = _props$value === undefined ? '' : _props$value,
10957 placeholder = _props.placeholder,
10958 minimal = _props.minimal,
10959 disabled = _props.disabled,
10960 readOnly = _props.readOnly,
10961 role = _props.role,
10962 autoFocus = _props.autoFocus,
10963 type = _props.type,
10964 name = _props.name,
10965 error = _props.error,
10966 multiline = _props.multiline,
10967 connectedRight = _props.connectedRight,
10968 connectedLeft = _props.connectedLeft,
10969 label = _props.label,
10970 labelAction = _props.labelAction,
10971 labelHidden = _props.labelHidden,
10972 helpText = _props.helpText,
10973 prefix = _props.prefix,
10974 suffix = _props.suffix,
10975 onFocus = _props.onFocus,
10976 onBlur = _props.onBlur,
10977 autoComplete = _props.autoComplete,
10978 min = _props.min,
10979 max = _props.max,
10980 minLength = _props.minLength,
10981 maxLength = _props.maxLength,
10982 spellCheck = _props.spellCheck,
10983 optional = _props.optional,
10984 pattern = _props.pattern,
10985 ariaOwns = _props.ariaOwns,
10986 ariaActiveDescendant = _props.ariaActiveDescendant,
10987 ariaAutocomplete = _props.ariaAutocomplete,
10988 ariaControls = _props.ariaControls;
10989 const height = this.state.height;
10990
10991 const className = styles.classNames(styles$80.TextField, Boolean(value) && styles$80.hasValue, minimal && styles$80.minimal, disabled && styles$80.disabled, readOnly && styles$80.readOnly, error && styles$80.error, multiline && styles$80.multiline, this.state.focus && styles$80.focus);
10992 const inputType = type === 'currency' ? 'text' : type;
10993 const prefixMarkup = prefix ? React.createElement(
10994 'div',
10995 { className: styles$80.Prefix, id: `${id}Prefix` },
10996 prefix
10997 ) : null;
10998 const suffixMarkup = suffix ? React.createElement(
10999 'div',
11000 { className: styles$80.Suffix, id: `${id}Suffix` },
11001 suffix
11002 ) : null;
11003 const spinnerMarkup = type === 'number' && !disabled ? React.createElement(Spinner$4, { onChange: this.handleNumberChange }) : null;
11004 const style = multiline && height ? { height } : null;
11005 const resizer = multiline ? React.createElement(Resizer$1, { contents: value || placeholder, currentHeight: height, minimumLines: typeof multiline === 'number' ? multiline : 1, onHeightChange: this.handleExpandingResize }) : null;
11006 const describedBy = [];
11007 if (error) {
11008 describedBy.push(`${id}Error`);
11009 }
11010 if (helpText) {
11011 describedBy.push(helpTextID$1(id));
11012 }
11013 const labelledBy = [labelID(id)];
11014 if (prefix) {
11015 labelledBy.push(`${id}Prefix`);
11016 }
11017 if (suffix) {
11018 labelledBy.push(`${id}Suffix`);
11019 }
11020 const inputClassName = styles.classNames(styles$80.Input, suffix && styles$80['Input-suffixed']);
11021 const input = React.createElement(multiline ? 'textarea' : 'input', {
11022 name,
11023 id,
11024 disabled,
11025 readOnly,
11026 role,
11027 autoFocus,
11028 value,
11029 placeholder,
11030 onFocus,
11031 onBlur,
11032 onKeyPress: this.handleKeyPress,
11033 style,
11034 autoComplete: normalizeAutoComplete$1(autoComplete),
11035 className: inputClassName,
11036 onChange: this.handleChange,
11037 ref: this.setInput,
11038 min,
11039 max,
11040 minLength,
11041 maxLength,
11042 spellCheck,
11043 pattern,
11044 type: inputType,
11045 'aria-describedby': describedBy.length ? describedBy.join(' ') : undefined,
11046 'aria-label': label,
11047 'aria-labelledby': labelledBy.join(' '),
11048 'aria-invalid': Boolean(error),
11049 'aria-owns': ariaOwns,
11050 'aria-activedescendant': ariaActiveDescendant,
11051 'aria-autocomplete': ariaAutocomplete,
11052 'aria-controls': ariaControls,
11053 'aria-multiline': multiline
11054 });
11055 return React.createElement(
11056 Labelled$1,
11057 { label: label, id: id, error: error, action: labelAction, labelHidden: labelHidden, helpText: helpText, optional: optional },
11058 React.createElement(
11059 Connected$1,
11060 { left: connectedLeft, right: connectedRight },
11061 React.createElement(
11062 'div',
11063 { className: className, onFocus: this.handleFocus, onBlur: this.handleBlur, onClick: this.handleClick },
11064 prefixMarkup,
11065 input,
11066 suffixMarkup,
11067 spinnerMarkup,
11068 React.createElement('div', { className: styles$80.Backdrop }),
11069 resizer
11070 )
11071 )
11072 );
11073 }
11074 setInput(input) {
11075 this.input = input;
11076 }
11077 handleNumberChange(steps) {
11078 var _props2 = this.props;
11079 const onChange = _props2.onChange,
11080 value = _props2.value;
11081 var _props2$step = _props2.step;
11082 const step = _props2$step === undefined ? 1 : _props2$step;
11083 var _props2$min = _props2.min;
11084 const min = _props2$min === undefined ? -Infinity : _props2$min;
11085 var _props2$max = _props2.max;
11086 const max = _props2$max === undefined ? Infinity : _props2$max;
11087
11088 if (onChange == null) {
11089 return;
11090 }
11091 // Returns the length of decimal places in a number
11092 const dpl = num => (num.toString().split('.')[1] || []).length;
11093 const numericValue = value ? parseFloat(value) : 0;
11094 if (isNaN(numericValue)) {
11095 return;
11096 }
11097 // Making sure the new value has the same length of decimal places as the
11098 // step / value has.
11099 const decimalPlaces = Math.max(dpl(numericValue), dpl(step));
11100 const newValue = Math.min(max, Math.max(numericValue + steps * step, min));
11101 onChange(String(newValue.toFixed(decimalPlaces)), this.state.id);
11102 }
11103 handleExpandingResize(height) {
11104 this.setState({ height });
11105 }
11106 handleKeyPress(event) {
11107 const key = event.key,
11108 which = event.which;
11109 const type = this.props.type;
11110
11111 const numbersSpec = /[\d.eE+-]$/;
11112 if (type !== 'number' || which === exports.Keys.ENTER || key.match(numbersSpec)) {
11113 return;
11114 }
11115 event.preventDefault();
11116 }
11117 handleChange(event) {
11118 const onChange = this.props.onChange;
11119
11120 if (onChange == null) {
11121 return;
11122 }
11123 onChange(event.currentTarget.value, this.state.id);
11124 }
11125 handleFocus() {
11126 this.setState({ focus: true });
11127 }
11128 handleBlur() {
11129 this.setState({ focus: false });
11130 }
11131 handleClick() {
11132 this.input.focus();
11133 }
11134}
11135tslib_1.__decorate([decorators.autobind], TextField$1.prototype, "setInput", null);
11136tslib_1.__decorate([decorators.autobind], TextField$1.prototype, "handleNumberChange", null);
11137tslib_1.__decorate([decorators.autobind], TextField$1.prototype, "handleExpandingResize", null);
11138tslib_1.__decorate([decorators.autobind], TextField$1.prototype, "handleKeyPress", null);
11139tslib_1.__decorate([decorators.autobind], TextField$1.prototype, "handleChange", null);
11140tslib_1.__decorate([decorators.autobind], TextField$1.prototype, "handleFocus", null);
11141tslib_1.__decorate([decorators.autobind], TextField$1.prototype, "handleBlur", null);
11142tslib_1.__decorate([decorators.autobind], TextField$1.prototype, "handleClick", null);
11143function normalizeAutoComplete$1(autoComplete) {
11144 if (autoComplete == null) {
11145 return autoComplete;
11146 }
11147 return autoComplete ? 'on' : 'off';
11148}
11149
11150var styles$81 = {
11151 "DisplayText": "p_ub",
11152 "sizeSmall": "p_jx",
11153 "sizeMedium": "p_j1",
11154 "sizeLarge": "p_bd",
11155 "sizeExtraLarge": "p_rw",
11156};
11157
11158function SkeletonDisplayText$1({ size = 'medium' }) {
11159 const className = styles.classNames(styles$81.DisplayText, size && styles$81[styles.variationName('size', size)]);
11160 return React.createElement('div', { className: className });
11161}
11162
11163var styles$82 = {
11164 "SkeletonBodyTextContainer": "p_v9",
11165 "SkeletonBodyText": "p_nn",
11166};
11167
11168function SkeletonBodyText$1({ lines = 3 }) {
11169 const bodyTextLines = [];
11170 for (let i = 0; i < lines; i++) {
11171 bodyTextLines.push(React.createElement('div', { className: styles$82.SkeletonBodyText, key: i }));
11172 }
11173 return React.createElement(
11174 'div',
11175 { className: styles$82.SkeletonBodyTextContainer },
11176 bodyTextLines
11177 );
11178}
11179
11180var styles$83 = {
11181 "Page": "p_m3",
11182 "fullWidth": "p_et",
11183 "singleColumn": "p_vw",
11184 "Header": "p_fv",
11185 "Header-hasSecondaryActions": "p_l0",
11186 "BreadcrumbAction": "p_tf",
11187 "Actions": "p_h1",
11188 "Action": "p_fn",
11189};
11190
11191class SkeletonPage extends React.PureComponent {
11192 render() {
11193 var _props = this.props;
11194 const children = _props.children,
11195 fullWidth = _props.fullWidth,
11196 singleColumn = _props.singleColumn,
11197 secondaryActions = _props.secondaryActions;
11198 var _props$title = _props.title;
11199 const title = _props$title === undefined ? '' : _props$title,
11200 breadcrumbs = _props.breadcrumbs;
11201
11202 const className = styles.classNames(styles$83.Page, fullWidth && styles$83.fullWidth, singleColumn && styles$83.singleColumn);
11203 const headerClassName = styles.classNames(styles$83.Header, breadcrumbs && styles$83['Header-hasBreadcrumbs'], secondaryActions && styles$83['Header-hasSecondaryActions']);
11204 const titleMarkup = title !== null ? renderTitle(title) : null;
11205 const secondaryActionsMarkup = secondaryActions ? renderSecondaryActions(secondaryActions) : null;
11206 const breadcrumbMarkup = breadcrumbs ? React.createElement(
11207 'div',
11208 { className: styles$83.BreadcrumbAction, style: { width: 60 } },
11209 React.createElement(SkeletonBodyText$1, { lines: 1 })
11210 ) : null;
11211 const headerMarkup = !this.props.polaris.easdk ? React.createElement(
11212 'div',
11213 { className: headerClassName },
11214 breadcrumbMarkup,
11215 titleMarkup,
11216 secondaryActionsMarkup
11217 ) : null;
11218 return React.createElement(
11219 'div',
11220 { className: className, role: 'status', 'aria-label': 'Page loading' },
11221 headerMarkup,
11222 React.createElement(
11223 'div',
11224 { className: styles$83.Content },
11225 children
11226 )
11227 );
11228 }
11229}
11230function renderSecondaryActions(actionCount) {
11231 const actions = [];
11232 for (let i = 0; i < actionCount; i++) {
11233 const width = Math.round(Math.random() * 40 + 60);
11234 actions.push(React.createElement(
11235 'div',
11236 { className: styles$83.Action, style: { width }, key: i },
11237 React.createElement(SkeletonBodyText$1, { lines: 1 })
11238 ));
11239 }
11240 return React.createElement(
11241 'div',
11242 { className: styles$83.Actions },
11243 actions
11244 );
11245}
11246function renderTitle(title) {
11247 const titleContent = title === '' ? React.createElement(SkeletonDisplayText$1, { size: 'large' }) : React.createElement(
11248 DisplayText$1,
11249 { size: 'large', element: 'h1' },
11250 title
11251 );
11252 return React.createElement(
11253 'div',
11254 { className: styles$83.Title },
11255 titleContent
11256 );
11257}
11258var SkeletongBodyText$1 = withAppProvider()(SkeletonPage);
11259
11260var styles$84 = {
11261 "ProgressBar": "p_tq",
11262 "sizeExtraSmall": "p_wb",
11263 "sizeSmall": "p_wc",
11264 "sizeMedium": "p_ra",
11265 "sizeLarge": "p_ql",
11266 "Indicator": "p_bi",
11267 "fillup": "p_jw",
11268 "Progress": "p_gm",
11269 "Label": "p_ns",
11270};
11271
11272function ProgressBar$1({ progress = 0, size = 'medium', polaris: { intl } }) {
11273 const className = styles.classNames(styles$84.ProgressBar, size && styles$84[styles.variationName('size', size)]);
11274 const warningMessage = intl.translate(progress < 0 ? 'Polaris.ProgressBar.negativeWarningMessage' : 'Polaris.ProgressBar.exceedWarningMessage', { progress });
11275 const parsedProgress = parseProgress(progress, warningMessage);
11276 return React.createElement(
11277 'div',
11278 { className: className },
11279 React.createElement('progress', { className: styles$84.Progress, value: parsedProgress, max: '100' }),
11280 React.createElement(
11281 'div',
11282 { className: styles$84.Indicator, style: { width: `${parsedProgress}%` } },
11283 React.createElement(
11284 'span',
11285 { className: styles$84.Label },
11286 parsedProgress,
11287 '%'
11288 )
11289 )
11290 );
11291}
11292function parseProgress(progress, warningMessage) {
11293 let progressWidth;
11294 if (progress < 0) {
11295 if (process.env.NODE_ENV === 'development') {
11296 // eslint-disable-next-line no-console
11297 console.warn(warningMessage);
11298 }
11299 progressWidth = 0;
11300 } else if (progress > 100) {
11301 if (process.env.NODE_ENV === 'development') {
11302 // eslint-disable-next-line no-console
11303 console.warn(warningMessage);
11304 }
11305 progressWidth = 100;
11306 } else {
11307 progressWidth = progress;
11308 }
11309 return progressWidth;
11310}
11311var ProgressBar$2 = withAppProvider()(ProgressBar$1);
11312
11313var styles$85 = {
11314 "DataTable": "p_em",
11315 "collapsed": "p_tg",
11316 "Table": "p_xo",
11317 "Navigation": "p_ce",
11318 "hasFooter": "p_lu",
11319 "ScrollContainer": "p_ws",
11320 "Pip": "p_it",
11321 "Pip-visible": "p_yb",
11322 "TableFoot": "p_a5",
11323 "Cell": "p_i1",
11324 "Cell-numeric": "p_fl",
11325 "Cell-fixed": "p_yp",
11326 "Cell-header": "p_h8",
11327 "Cell-truncated": "p_vx",
11328 "Cell-presentational": "p_ep",
11329 "Cell-sortable": "p_zh",
11330 "Heading": "p_pf",
11331 "Heading-left": "p_jr",
11332 "Heading-sortable": "p_fu",
11333 "Cell-total": "p_ej",
11334 "Cell-footer": "p_b8",
11335};
11336
11337function Cell$3({ height, content, contentType, fixed, truncate, presentational, header, total, footer, sorted, sortable, sortDirection, defaultSortDirection, polaris: { intl: { translate } }, onSort }) {
11338 const numeric = contentType === 'numeric';
11339 const className = styles.classNames(styles$85.Cell, fixed && styles$85['Cell-fixed'], truncate && styles$85['Cell-truncated'], presentational && styles$85['Cell-presentational'], header && styles$85['Cell-header'], total && styles$85['Cell-total'], footer && styles$85['Cell-footer'], numeric && styles$85['Cell-numeric'], sorted && styles$85['Cell-sorted'], sortable && styles$85['Cell-sortable']);
11340 const style = height ? { height: `${height}px` } : undefined;
11341 const headerClassName = styles.classNames(header && styles$85.Heading, header && contentType === 'text' && styles$85['Heading-left']);
11342 const iconClassName = styles.classNames(sortable && styles$85['Heading-sortable']);
11343 // TODO work out a better way for fix this lint violation
11344 const presentationalMarkup = header ?
11345 // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role
11346 React.createElement('th', { 'aria-hidden': true, role: 'presentation', className: className, style: style }) :
11347 // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role
11348 React.createElement('td', { 'aria-hidden': true, role: 'presentation', className: className, style: style });
11349 let sortedIconMarkup = null;
11350 let sortableIconMarkup = null;
11351 let sortAccessibilityLabel;
11352 if (sortable) {
11353 // i18n string variable
11354 sortAccessibilityLabel = translate('Polaris.DataTable.sortAccessibilityLabel', { content: content.toLowerCase() });
11355 if (sorted) {
11356 const direction = sortDirection === 'ascending' ? 'Up' : 'Down';
11357 const source = `caret${direction}`;
11358 sortedIconMarkup = React.createElement(Icon$2, { source: source });
11359 } else {
11360 const direction = defaultSortDirection === 'ascending' ? 'Up' : 'Down';
11361 const source = `caret${direction}`;
11362 sortableIconMarkup = React.createElement(Icon$2, { source: source });
11363 }
11364 }
11365 const sortableHeadingContent = contentType === 'text' ? React.createElement(
11366 'span',
11367 { className: headerClassName },
11368 content,
11369 React.createElement(
11370 'span',
11371 { className: iconClassName },
11372 sortableIconMarkup
11373 ),
11374 React.createElement(
11375 'span',
11376 null,
11377 sortedIconMarkup
11378 )
11379 ) : React.createElement(
11380 'span',
11381 { className: headerClassName },
11382 React.createElement(
11383 'span',
11384 { className: iconClassName },
11385 sortableIconMarkup
11386 ),
11387 React.createElement(
11388 'span',
11389 null,
11390 sortedIconMarkup
11391 ),
11392 content
11393 );
11394 const columnHeadingContent = sortable ? sortableHeadingContent : content;
11395 const sortProps = sortable ? {
11396 role: 'button',
11397 onClick: onSort,
11398 onKeyDown: onKeyDownEnter(onSort),
11399 'aria-sort': sortDirection,
11400 'aria-label': sortAccessibilityLabel,
11401 tabIndex: 0
11402 } : { 'aria-disabled': true };
11403 const headingMarkup = header ? React.createElement(
11404 'th',
11405 Object.assign({ className: className, scope: 'col', style: style }, sortProps),
11406 columnHeadingContent
11407 ) : React.createElement(
11408 'th',
11409 { className: className, scope: 'row', style: style },
11410 content
11411 );
11412 const title = truncate ? content : '';
11413 const nonPresentationalMarkup = header || fixed ? headingMarkup : React.createElement(
11414 'td',
11415 { className: className, style: style, title: title },
11416 content
11417 );
11418 const cellMarkup = presentational ? presentationalMarkup : nonPresentationalMarkup;
11419 return cellMarkup;
11420}
11421function onKeyDownEnter(sortFunc) {
11422 return function handleKeyPress(event) {
11423 const keyCode = event.keyCode;
11424
11425 if (keyCode === 13 && sortFunc !== undefined) {
11426 sortFunc();
11427 }
11428 };
11429}
11430var Cell$4 = withAppProvider()(Cell$3);
11431
11432class DataTable$3 extends React.PureComponent {
11433 constructor(props) {
11434 super(props);
11435 this.state = {
11436 collapsed: false,
11437 columnVisibilityData: [],
11438 sorted: this.props.sortable && this.props.sortable.length > 0,
11439 heights: [],
11440 preservedScrollPosition: {}
11441 };
11442 const translate = props.polaris.intl.translate;
11443
11444 this.totalsRowHeading = translate('Polaris.DataTable.totalsRowHeading');
11445 }
11446 componentDidMount() {
11447 // We need to defer the calculation in development so the styles have time to be injected.
11448 if (process.env.NODE_ENV === 'development') {
11449 setTimeout(() => {
11450 this.handleResize();
11451 }, 10);
11452 } else {
11453 this.handleResize();
11454 }
11455 }
11456 render() {
11457 var _props = this.props;
11458 const headings = _props.headings,
11459 totals = _props.totals,
11460 rows = _props.rows,
11461 truncate = _props.truncate,
11462 footerContent = _props.footerContent,
11463 sortable = _props.sortable;
11464 var _props$defaultSortDir = _props.defaultSortDirection;
11465 const defaultSortDirection = _props$defaultSortDir === undefined ? 'ascending' : _props$defaultSortDir;
11466 var _props$initialSortCol = _props.initialSortColumnIndex;
11467 const initialSortColumnIndex = _props$initialSortCol === undefined ? 0 : _props$initialSortCol;
11468 var _state = this.state;
11469 const collapsed = _state.collapsed,
11470 heights = _state.heights;
11471 var _state$sortedColumnIn = _state.sortedColumnIndex;
11472 const sortedColumnIndex = _state$sortedColumnIn === undefined ? initialSortColumnIndex : _state$sortedColumnIn;
11473 var _state$sortDirection = _state.sortDirection;
11474 const sortDirection = _state$sortDirection === undefined ? defaultSortDirection : _state$sortDirection;
11475
11476 const className = styles.classNames(styles$85.DataTable, collapsed && styles$85.collapsed, footerContent && styles$85.hasFooter);
11477 const wrapperClassName = styles.classNames(styles$85.TableWrapper, collapsed && styles$85.collapsed);
11478 const footerClassName = styles.classNames(footerContent && styles$85.TableFoot);
11479 const footerMarkup = footerContent ? React.createElement(
11480 'tfoot',
11481 { className: footerClassName },
11482 React.createElement(
11483 'tr',
11484 null,
11485 this.renderFooter()
11486 )
11487 ) : null;
11488 const totalsMarkup = totals ? React.createElement(
11489 'tr',
11490 null,
11491 insertPresentationalCell(totals).map(this.renderTotals)
11492 ) : null;
11493 const headingMarkup = React.createElement(
11494 'tr',
11495 null,
11496 insertPresentationalCell(headings).map((heading, headingIndex) => {
11497 let sortableHeadingProps = {};
11498 const id = `heading-cell-${headingIndex}`;
11499 // we account for the presentational heading cell’s index when
11500 // accessing elements from arrays passed as props and when comparing
11501 // a heading index with the sorted column’s index
11502 const index = headingIndex <= 1 ? headingIndex : headingIndex - 1;
11503 const contentTypes = this.getContentTypes();
11504 if (sortable) {
11505 const isSortable = sortable[index];
11506 const isSorted = isSortable && sortedColumnIndex === index;
11507 const direction = isSorted && sortedColumnIndex === index ? sortDirection : 'none';
11508 sortableHeadingProps = {
11509 defaultSortDirection,
11510 sorted: isSorted,
11511 sortable: isSortable,
11512 sortDirection: direction,
11513 onSort: this.defaultOnSort(index)
11514 };
11515 }
11516 const height = !truncate ? heights[0] : undefined;
11517 return React.createElement(Cell$4, Object.assign({ header: true, key: id, height: height, content: heading, contentType: contentTypes[headingIndex], fixed: headingIndex === 0, truncate: truncate, presentational: headingIndex === 1 }, sortableHeadingProps));
11518 })
11519 );
11520 const bodyMarkup = rows.map(this.defaultRenderRow);
11521 const style = footerContent ? { marginBottom: `${heights[heights.length - 1]}px` } : {};
11522 return React.createElement(
11523 'div',
11524 { className: wrapperClassName },
11525 React.createElement(
11526 'div',
11527 { className: className, ref: this.setDataTable },
11528 React.createElement(
11529 'div',
11530 { className: styles$85.ScrollContainer, ref: this.setScrollContainer, style: style },
11531 React.createElement(EventListener$1, { event: 'resize', handler: this.handleResize }),
11532 React.createElement(EventListener$1, { capture: true, event: 'scroll', handler: this.scrollListener }),
11533 React.createElement(
11534 'table',
11535 { className: styles$85.Table, ref: this.setTable },
11536 React.createElement(
11537 'thead',
11538 null,
11539 headingMarkup,
11540 totalsMarkup
11541 ),
11542 React.createElement(
11543 'tbody',
11544 null,
11545 bodyMarkup
11546 ),
11547 footerMarkup
11548 )
11549 )
11550 )
11551 );
11552 }
11553 setDataTable(dataTable) {
11554 this.dataTable = dataTable;
11555 }
11556 setScrollContainer(scrollContainer) {
11557 this.scrollContainer = scrollContainer;
11558 }
11559 setTable(table) {
11560 this.table = table;
11561 }
11562 handleResize() {
11563 var _props2 = this.props;
11564 const footerContent = _props2.footerContent,
11565 truncate = _props2.truncate;
11566
11567 const collapsed = this.table.scrollWidth > this.dataTable.offsetWidth;
11568 this.scrollContainer.scrollLeft = 0;
11569 this.setState(Object.assign({ collapsed, heights: [] }, this.calculateColumnVisibilityData(collapsed)), () => {
11570 if (footerContent || !truncate) {
11571 this.setHeightsAndScrollPosition();
11572 }
11573 });
11574 }
11575 tallestCellHeights() {
11576 var _props3 = this.props;
11577 const footerContent = _props3.footerContent,
11578 truncate = _props3.truncate;
11579
11580 const rows = Array.from(this.table.getElementsByTagName('tr'));
11581 let heights = this.state.heights;
11582
11583 if (!truncate) {
11584 return heights = rows.map(row => {
11585 const fixedCell = row.childNodes[0];
11586 return Math.max(row.clientHeight, fixedCell.clientHeight);
11587 });
11588 }
11589 if (footerContent) {
11590 const footerCellHeight = rows[rows.length - 1].childNodes[0].clientHeight;
11591 heights = [footerCellHeight];
11592 }
11593 return heights;
11594 }
11595 resetScrollPosition() {
11596 var _state$preservedScrol = this.state.preservedScrollPosition;
11597 const left = _state$preservedScrol.left,
11598 top = _state$preservedScrol.top;
11599
11600 if (left) {
11601 this.scrollContainer.scrollLeft = left;
11602 }
11603 if (top) {
11604 window.scrollTo(0, top);
11605 }
11606 }
11607 setHeightsAndScrollPosition() {
11608 this.setState({ heights: this.tallestCellHeights() }, this.resetScrollPosition);
11609 }
11610 calculateColumnVisibilityData(collapsed) {
11611 if (collapsed) {
11612 const headerCells = this.table.querySelectorAll('[class*=header]');
11613 const collapsedHeaderCells = Array.from(headerCells).slice(2);
11614 const fixedColumnWidth = headerCells[0].offsetWidth;
11615 const tableData = {
11616 fixedColumnWidth,
11617 firstVisibleColumnIndex: collapsedHeaderCells.length - 1,
11618 tableLeftVisibleEdge: this.scrollContainer.scrollLeft,
11619 tableRightVisibleEdge: this.scrollContainer.scrollLeft + (this.dataTable.offsetWidth - fixedColumnWidth)
11620 };
11621 const columnVisibilityData = collapsedHeaderCells.map(measureColumn$1(tableData));
11622 return Object.assign({ columnVisibilityData }, getPrevAndCurrentColumns$1(tableData, columnVisibilityData));
11623 }
11624 return {
11625 columnVisibilityData: [],
11626 previousColumn: undefined,
11627 currentColumn: undefined
11628 };
11629 }
11630 scrollListener() {
11631 this.setState(Object.assign({}, this.calculateColumnVisibilityData(this.state.collapsed)));
11632 }
11633 getContentTypes() {
11634 const columnContentTypes = this.props.columnContentTypes;
11635
11636 const fixedCellType = columnContentTypes[0];
11637 return [fixedCellType, ...columnContentTypes];
11638 }
11639 renderFirstTwoTotalsCells(index) {
11640 let height;
11641 const id = `totals-cell-${index}`;
11642 const heights = this.state.heights;
11643 var _props$truncate = this.props.truncate;
11644 const truncate = _props$truncate === undefined ? false : _props$truncate;
11645
11646 if (!truncate) {
11647 height = heights[1];
11648 }
11649 if (index === 0) {
11650 return React.createElement(Cell$4, { fixed: true, total: true, key: id, height: height, content: this.totalsRowHeading, truncate: truncate });
11651 }
11652 if (index === 1) {
11653 return React.createElement(Cell$4, { key: id, presentational: true, height: height });
11654 }
11655 return React.createElement(Cell$4, { total: true, key: id, contentType: 'numeric', height: height });
11656 }
11657 renderTotals(total, index) {
11658 let height;
11659 const id = `totals-cell-${index}`;
11660 const heights = this.state.heights;
11661 var _props$truncate2 = this.props.truncate;
11662 const truncate = _props$truncate2 === undefined ? false : _props$truncate2;
11663
11664 if (!truncate) {
11665 height = heights[1];
11666 }
11667 return total === '' ? this.renderFirstTwoTotalsCells(index) : React.createElement(Cell$4, { total: true, key: id, height: height, contentType: 'numeric', content: total });
11668 }
11669 defaultRenderRow(row, index) {
11670 const className = styles.classNames(styles$85.TableRow);
11671 const contentTypes = this.getContentTypes();
11672 var _props4 = this.props;
11673 const totals = _props4.totals,
11674 footerContent = _props4.footerContent;
11675 var _props4$truncate = _props4.truncate;
11676 const truncate = _props4$truncate === undefined ? false : _props4$truncate;
11677 const heights = this.state.heights;
11678
11679 const bodyCellHeights = totals ? heights.slice(2) : heights.slice(1);
11680 if (footerContent) {
11681 bodyCellHeights.pop();
11682 }
11683 return React.createElement(
11684 'tr',
11685 { key: `row-${index}`, className: className },
11686 insertPresentationalCell(row).map((content, cellIndex) => {
11687 const id = `cell-${cellIndex}-row-${index}`;
11688 return React.createElement(Cell$4, { key: id, height: bodyCellHeights[index], content: content, contentType: contentTypes[cellIndex], fixed: cellIndex === 0, truncate: truncate, presentational: cellIndex === 1 });
11689 })
11690 );
11691 }
11692 renderFooter() {
11693 const heights = this.state.heights;
11694
11695 const footerCellHeight = heights[heights.length - 1];
11696 return React.createElement(Cell$4, { footer: true, height: footerCellHeight, content: this.props.footerContent, truncate: this.props.truncate });
11697 }
11698 defaultOnSort(headingIndex) {
11699 var _props5 = this.props;
11700 const onSort = _props5.onSort,
11701 truncate = _props5.truncate;
11702 var _props5$defaultSortDi = _props5.defaultSortDirection;
11703 const defaultSortDirection = _props5$defaultSortDi === undefined ? 'ascending' : _props5$defaultSortDi,
11704 initialSortColumnIndex = _props5.initialSortColumnIndex;
11705 var _state2 = this.state;
11706 const sortDirection = _state2.sortDirection;
11707 var _state2$sortedColumnI = _state2.sortedColumnIndex;
11708 const sortedColumnIndex = _state2$sortedColumnI === undefined ? initialSortColumnIndex : _state2$sortedColumnI;
11709
11710 let newSortDirection = defaultSortDirection;
11711 if (sortedColumnIndex === headingIndex) {
11712 newSortDirection = sortDirection === 'ascending' ? 'descending' : 'ascending';
11713 }
11714 const handleSort = () => {
11715 this.setState({
11716 sorted: true,
11717 sortDirection: newSortDirection,
11718 sortedColumnIndex: headingIndex
11719 }, () => {
11720 if (onSort) {
11721 onSort(headingIndex, newSortDirection);
11722 if (!truncate) {
11723 const preservedScrollPosition = {
11724 left: this.scrollContainer.scrollLeft,
11725 top: window.scrollY
11726 };
11727 this.setState({ preservedScrollPosition });
11728 this.handleResize();
11729 }
11730 }
11731 });
11732 };
11733 return handleSort;
11734 }
11735}
11736tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "setDataTable", null);
11737tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "setScrollContainer", null);
11738tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "setTable", null);
11739tslib_1.__decorate([decorators.autobind, decorators.debounce()], DataTable$3.prototype, "handleResize", null);
11740tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "tallestCellHeights", null);
11741tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "resetScrollPosition", null);
11742tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "setHeightsAndScrollPosition", null);
11743tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "calculateColumnVisibilityData", null);
11744tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "scrollListener", null);
11745tslib_1.__decorate([decorators.autobind
11746// function is never called
11747// private navigateTable(direction: string) {
11748// const {scrollContainer} = this;
11749// const {currentColumn, previousColumn} = this.state;
11750//
11751// const handleScroll = () => {
11752// if (direction === 'right' && currentColumn) {
11753// scrollContainer.scrollLeft = currentColumn.rightEdge;
11754// } else if (previousColumn) {
11755// scrollContainer.scrollLeft =
11756// previousColumn.leftEdge < 10 ? 0 : previousColumn.leftEdge;
11757// }
11758//
11759// requestAnimationFrame(() => {
11760// this.setState({
11761// ...this.calculateColumnVisibilityData(this.state.collapsed),
11762// });
11763// });
11764// };
11765//
11766// return handleScroll;
11767// }
11768
11769, decorators.autobind], DataTable$3.prototype, "getContentTypes", null);
11770tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "renderFirstTwoTotalsCells", null);
11771tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "renderTotals", null);
11772tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "defaultRenderRow", null);
11773tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "renderFooter", null);
11774tslib_1.__decorate([decorators.autobind], DataTable$3.prototype, "defaultOnSort", null);
11775function insertPresentationalCell(arr = []) {
11776 const fixedCell = arr[0];
11777 const presentationalCell = '';
11778 return [fixedCell, presentationalCell, ...arr.slice(1)];
11779}
11780function measureColumn$1(tableData) {
11781 return function (column, index) {
11782 const tableLeftVisibleEdge = tableData.tableLeftVisibleEdge,
11783 tableRightVisibleEdge = tableData.tableRightVisibleEdge,
11784 firstVisibleColumnIndex = tableData.firstVisibleColumnIndex,
11785 fixedColumnWidth = tableData.fixedColumnWidth;
11786
11787 const width = column.offsetWidth;
11788 const leftEdge = column.offsetLeft - fixedColumnWidth;
11789 const rightEdge = leftEdge + width;
11790 const leftEdgeIsVisible = isEdgeVisible$1(leftEdge, tableLeftVisibleEdge, tableRightVisibleEdge);
11791 const rightEdgeIsVisible = isEdgeVisible$1(rightEdge, tableLeftVisibleEdge, tableRightVisibleEdge);
11792 const isCompletelyVisible = leftEdge < tableLeftVisibleEdge && rightEdge > tableRightVisibleEdge;
11793 const isVisible = isCompletelyVisible || leftEdgeIsVisible || rightEdgeIsVisible;
11794 if (isVisible) {
11795 tableData.firstVisibleColumnIndex = Math.min(firstVisibleColumnIndex, index);
11796 }
11797 return { leftEdge, rightEdge, isVisible };
11798 };
11799}
11800function isEdgeVisible$1(target$$1, start, end) {
11801 const minVisiblePixels = 30;
11802 return target$$1 >= start + minVisiblePixels && target$$1 <= end - minVisiblePixels;
11803}
11804function getPrevAndCurrentColumns$1(tableData, columnData) {
11805 const tableRightVisibleEdge = tableData.tableRightVisibleEdge,
11806 tableLeftVisibleEdge = tableData.tableLeftVisibleEdge,
11807 firstVisibleColumnIndex = tableData.firstVisibleColumnIndex;
11808
11809 const previousColumnIndex = Math.max(firstVisibleColumnIndex - 1, 0);
11810 const previousColumn = columnData[previousColumnIndex];
11811 const lastColumnIndex = columnData.length - 1;
11812 const lastColumn = columnData[lastColumnIndex];
11813 const currentColumn = Object.assign({ isScrolledFarthestLeft: firstVisibleColumnIndex === 0 && tableLeftVisibleEdge === 0, isScrolledFarthestRight: lastColumn.rightEdge <= tableRightVisibleEdge }, columnData[firstVisibleColumnIndex]);
11814 return { previousColumn, currentColumn };
11815}
11816var MobileTable$1 = withAppProvider()(DataTable$3);
11817
11818exports.handleMouseUpByBlurring = handleMouseUpByBlurring;
11819exports.contentContextTypes = contentContextTypes;
11820exports.AccountConnection = AccountConnection$1;
11821exports.ActionList = ActionList$1;
11822exports.AppProvider = AppProvider$1;
11823exports.polarisContextTypes = polarisAppProviderContextTypes;
11824exports.createPolarisContext = createPolarisContext;
11825exports.withAppProvider = withAppProvider;
11826exports.Avatar = Avatar$2;
11827exports.Badge = Badge$2;
11828exports.Banner = Banner$1;
11829exports.Breadcrumbs = Breadcrumbs$1;
11830exports.Button = Button$2;
11831exports.buttonFrom = buttonFrom;
11832exports.buttonsFrom = buttonsFrom;
11833exports.ButtonGroup = ButtonGroup$1;
11834exports.CalloutCard = CalloutCard$1;
11835exports.Caption = Caption$1;
11836exports.Card = Card$1;
11837exports.Checkbox = Checkbox$2;
11838exports.ChoiceList = ChoiceList$2;
11839exports.Collapsible = Collapsible$2;
11840exports.ColorPicker = ColorPicker$1;
11841exports.rgbToHex = rgbToHex;
11842exports.rgbToHsb = rgbToHsb;
11843exports.hsbToRgb = hsbToRgb;
11844exports.hsbToHex = hsbToHex;
11845exports.rgbString = rgbString;
11846exports.rgbaString = rgbaString;
11847exports.Connected = Connected$1;
11848exports.DataField = DataField$1;
11849exports.DataTable = DataTable$2;
11850exports.DatePreference = DatePreference$1;
11851exports.DatePicker = DatePicker$2;
11852exports.Months = dates.Months;
11853exports.DescriptionList = DescriptionList$1;
11854exports.DisplayText = DisplayText$1;
11855exports.DropZone = DropZone$2;
11856exports.EmptySearchResult = EmptySearchResult$2;
11857exports.EmptyState = EmptyState$1;
11858exports.EventListener = EventListener$1;
11859exports.ExceptionList = ExceptionList$1;
11860exports.FilterControl = FilterControl$2;
11861exports.Focus = Focus$1;
11862exports.TrapFocus = TrapFocus;
11863exports.FooterHelp = FooterHelp$1;
11864exports.Form = Form$1;
11865exports.FormLayout = FormLayout$1;
11866exports.Heading = Heading$1;
11867exports.Hide = Hide$1;
11868exports.Icon = Icon$2;
11869exports.Image = Image$1;
11870exports.InlineError = InlineError$1;
11871exports.InlineValidation = InlineValidation$1;
11872exports.Indicator = Indicator$1;
11873exports.KeyboardKey = KeyboardKey$1;
11874exports.KeypressListener = KeypressListener$1;
11875exports.Label = Label$1;
11876exports.Labelled = Labelled$1;
11877exports.Layout = Layout$1;
11878exports.Link = Link$2;
11879exports.List = ContentList;
11880exports.Media = Media$1;
11881exports.Modal = Modal$3;
11882exports.OptionList = OptionList$2;
11883exports.Page = Page$2;
11884exports.PageActions = PageActions$1;
11885exports.Pagination = Pagination$2;
11886exports.Popover = Popover$1;
11887exports.Portal = Portal$1;
11888exports.RadioButton = RadioButton$1;
11889exports.RangeSlider = RangeSlider$2;
11890exports.ResourceList = ResourceList$2;
11891exports.Scrollable = Scrollable$2;
11892exports.Select = Select$1;
11893exports.SettingToggle = SettingToggle$1;
11894exports.Spacing = Spacing$1;
11895exports.Spinner = Spinner$2;
11896exports.Stack = Stack$1;
11897exports.Sticky = Sticky$1;
11898exports.Subheading = Subheading$1;
11899exports.Tabs = Tabs$1;
11900exports.Tag = Tag$2;
11901exports.TextContainer = TextContainer$1;
11902exports.TextField = TextField$1;
11903exports.TextStyle = TextStyle$1;
11904exports.Thumbnail = Thumbnail$1;
11905exports.Tooltip = Tooltip$1;
11906exports.Truncate = Truncate$1;
11907exports.UnstyledLink = UnstyledLink$2;
11908exports.VisuallyHidden = VisuallyHidden$1;
11909exports.SkeletonPage = SkeletongBodyText$1;
11910exports.SkeletonBodyText = SkeletonBodyText$1;
11911exports.SkeletonDisplayText = SkeletonDisplayText$1;
11912exports.ProgressBar = ProgressBar$2;
11913exports.withContext = withContext$1;
11914exports.withRef = withRef$1;
11915exports.MobileTable = MobileTable$1;