so we can target it specifically\r\n var htmlInput = this.datePickerRef.current.querySelector('.DateInput_input');\r\n\r\n if (this.props.size === 'small' && htmlInput && htmlInput.classList && htmlInput.parentElement.parentElement.parentElement) {\r\n htmlInput.parentElement.parentElement.parentElement.classList.add('div_small');\r\n }\r\n\r\n // DatePicker with appendToBody doesn't respect calendar's top positioning because of where it's rendered\r\n // Need to be more aggressive setting it\r\n var datePickers = document.querySelectorAll('body > div > div.SingleDatePicker_picker');\r\n\r\n if (datePickers.length > 0) {\r\n for (var i = 0; i < datePickers.length; i++) {\r\n var datePicker = datePickers[i];\r\n if (datePicker && datePicker.classList && !datePicker.classList.contains('SingleDatePicker_picker_small')) {\r\n datePicker.classList.add('SingleDatePicker_picker_small');\r\n }\r\n }\r\n }\r\n }\r\n\r\n // add the correct aria-label to the datepicker input field\r\n\r\n }, {\r\n key: 'HACK_updateAriaLabel',\r\n value: function HACK_updateAriaLabel() {\r\n\r\n // add a \"hasPopup\" aria attribute to the button that pops up the date picker\r\n if (this.props['aria-label']) {\r\n\r\n var htmlInput = this.datePickerRef.current.querySelector('.DateInput_input');\r\n\r\n if (htmlInput.getAttribute('aria-label') !== this.props['aria-label']) {\r\n\r\n // note -- we need to hack this in, because the placeholder text always overrides\r\n // whatever you pass in for ariaLabel, effectively making it impossible to have\r\n // different placeholder and aria-label text\r\n htmlInput.setAttribute('aria-label', this.props['aria-label']);\r\n }\r\n }\r\n }\r\n\r\n // builds a month selection dropdown\r\n\r\n }, {\r\n key: 'buildSelector',\r\n value: function buildSelector(menuItems, callback, value) {\r\n\r\n var classes = this.props.classes;\r\n\r\n return _react2.default.createElement(\r\n _Select2.default,\r\n {\r\n IconComponent: _ChevronDown2.default,\r\n onChange: callback,\r\n MenuProps: {\r\n id: this.selectorId,\r\n MenuListProps: {\r\n classes: {\r\n root: classes.monthYearSelectMenu\r\n }\r\n }\r\n },\r\n classes: {\r\n icon: classes.monthYearSelectIcon\r\n },\r\n value: value,\r\n input: _react2.default.createElement(_Input2.default, { classes: {\r\n root: classes.monthYearSelectInput,\r\n input: classes.monthYearSelectInputInput }, disableUnderline: true })\r\n },\r\n menuItems\r\n );\r\n }\r\n\r\n // Method will close the calender if user clicks outside of the calendar container.\r\n\r\n }, {\r\n key: 'render',\r\n value: function render() {\r\n var _this3 = this,\r\n _cn,\r\n _cn2;\r\n\r\n var _props2 = this.props,\r\n classes = _props2.classes,\r\n error = _props2.error,\r\n variant = _props2.variant,\r\n className = _props2.className,\r\n helperText = _props2.helperText,\r\n fullWidth = _props2.fullWidth,\r\n edsContext = _props2.edsContext,\r\n FormControlProps = _props2.FormControlProps,\r\n FormHelperTextProps = _props2.FormHelperTextProps,\r\n InputLabelProps = _props2.InputLabelProps,\r\n labelProp = _props2.label,\r\n startYear = _props2.startYear,\r\n endYear = _props2.endYear,\r\n autoPosition = _props2.autoPosition,\r\n screenReaderInputMessageProp = _props2.screenReaderInputMessage,\r\n placeholderProp = _props2.placeholder,\r\n onFocusChange = _props2.onFocusChange,\r\n monthSelectionVariant = _props2.monthSelectionVariant,\r\n isOutsideRange = _props2.isOutsideRange,\r\n ariaLabel = _props2['aria-label'],\r\n size = _props2.size,\r\n props = _objectWithoutProperties(_props2, ['classes', 'error', 'variant', 'className', 'helperText', 'fullWidth', 'edsContext', 'FormControlProps', 'FormHelperTextProps', 'InputLabelProps', 'label', 'startYear', 'endYear', 'autoPosition', 'screenReaderInputMessage', 'placeholder', 'onFocusChange', 'monthSelectionVariant', 'isOutsideRange', 'aria-label', 'size']);\r\n\r\n var shrink = this.state.shrink;\r\n\r\n\r\n var label = labelProp;\r\n var hasLabel = !(0, _isNil2.default)(labelProp);\r\n var helperTextId = helperText && props.id ? props.id + '-helper-text' : undefined;\r\n var shouldShrink = props.focused || props.date !== null || shrink;\r\n\r\n // translate placeholder text if we're displaying the default\r\n var placeholder = placeholderProp === DEFAULT_PLACEHOLDER ? edsContext.formatMessage('component.DatePicker.dateLabel') : placeholderProp;\r\n\r\n // Add asterisk to label or placeholder if required\r\n if (props.required) {\r\n if (hasLabel) {\r\n label = labelProp + ' *';\r\n } else {\r\n placeholder = placeholder + ' *';\r\n }\r\n }\r\n\r\n // set up the default screen reader input message\r\n var screenReaderInputMessage = screenReaderInputMessageProp || edsContext.formatMessage('component.DatePicker.a11y.inputDescription', {\r\n dateFormat: this.props.displayFormat\r\n });\r\n\r\n var showMonthSelectors = this.props.monthSelectionVariant === MONTH_YEAR_SELECTION;\r\n\r\n // Month/Year Calendar Hack\r\n //\r\n // The month/year variant of the calendar has an issue where the transitions from one month\r\n // to another gets 'stuck' when using the month selector; you wind up with the calendar\r\n // half-shifted out of the viewport. This only happens when you put a MUI select in the month\r\n // header; something about it throws off the fragile timing of the transition in the bowels\r\n // of react-dates.\r\n //\r\n // The most consistent/least intrusive way we've found to solve this is by making the month/\r\n // year calendar *vertically*-oriented. This appears to satisfy the transition that is\r\n // causing us so many problems, without any visual impact to the component (since we only\r\n // show one calendar at a time).\r\n //\r\n // We had to add a few CSS tweaks to make this work (see the monthYearPickerFix class, above).\r\n // They are only applied for the month/year version of the calendar.\r\n\r\n var DatePickerPropOverrides = {\r\n inputIconPosition: ICON_AFTER_POSITION,\r\n orientation: monthSelectionVariant === MONTH_YEAR_SELECTION ? VERTICAL_ORIENTATION : HORIZONTAL_ORIENTATION,\r\n customInputIcon: _react2.default.createElement(\r\n _react2.default.Fragment,\r\n null,\r\n _react2.default.createElement(\r\n 'span',\r\n { className: classes.srOnly },\r\n edsContext.formatMessage('component.DatePicker.inputCalendarIconButton')\r\n ),\r\n _react2.default.createElement(_Calendar2.default, null)\r\n ),\r\n numberOfMonths: 1,\r\n displayFormat: DEFAULT_DISPLAY_FORMAT,\r\n weekDayFormat: DEFAULT_WEEK_DAY_FORMAT,\r\n anchorDirection: this.variants === props.isRTL ? ANCHOR_RIGHT : ANCHOR_LEFT,\r\n screenReaderInputMessage: screenReaderInputMessage,\r\n placeholder: placeholder,\r\n navPrev: showMonthSelectors ? _react2.default.createElement('span', null) : props.isRTL ? _react2.default.createElement(\r\n DatePickerNavigationButton,\r\n {\r\n className: classes.srOnly,\r\n phrase: props.phrases.jumpToNextMonth\r\n },\r\n _react2.default.createElement(_ChevronRight2.default, null)\r\n ) : _react2.default.createElement(\r\n DatePickerNavigationButton,\r\n {\r\n className: classes.srOnly,\r\n phrase: props.phrases.jumpToPrevMonth\r\n },\r\n _react2.default.createElement(_ChevronLeft2.default, null)\r\n ),\r\n navNext: showMonthSelectors ? _react2.default.createElement('span', null) : props.isRTL ? _react2.default.createElement(\r\n DatePickerNavigationButton,\r\n {\r\n className: classes.srOnly,\r\n phrase: props.phrases.jumpToPrevMonth\r\n },\r\n _react2.default.createElement(_ChevronLeft2.default, null)\r\n ) : _react2.default.createElement(\r\n DatePickerNavigationButton,\r\n {\r\n className: classes.srOnly,\r\n phrase: props.phrases.jumpToNextMonth\r\n },\r\n _react2.default.createElement(_ChevronRight2.default, null)\r\n ),\r\n\r\n onFocusChange: function onFocusChange(focused) {\r\n\r\n // this is to get past react-dates' stubborn insistence on closing whenever you click\r\n // outside the calendar; selecting a dropdown item is considered an outside click, so\r\n // without this code the calendar would close (in non-standalone mode) whenever you\r\n // select a new date/year\r\n if (focused.focused || !showMonthSelectors || variant === STANDALONE) {\r\n _this3.props.onFocusChange(focused);\r\n } else {\r\n\r\n // if the month/year selection menu is visible, abort the close\r\n if (document.getElementById(_this3.selectorId)) {\r\n _this3.props.onFocusChange({ focused: true });\r\n } else {\r\n _this3.props.onFocusChange(focused);\r\n }\r\n }\r\n },\r\n\r\n onClose: function onClose() {\r\n\r\n // if the appendToBody prop is specified, users might run afoul of a react-date bug\r\n // where, if you invoke a date picker calendar while another one is already open,\r\n // react-date's scroll-disabling code gets confused, and turns off scrolling forever\r\n // (or until the page refreshes, whichever comes first)\r\n\r\n // work around this by explicitly setting overflow-y back to its previous value,\r\n // whenever a calendar closes\r\n\r\n if (_this3.props.appendToBody) {\r\n\r\n setTimeout(function () {\r\n\r\n // both html & body tags might have their overflows disabled (it appears to be\r\n // browser-dependent); so check both, and reset them if necessary\r\n var html = document.querySelector('html');\r\n var body = document.querySelector('body');\r\n\r\n if (html.style.overflowY === 'hidden' && _this3.htmlOverflowY !== 'hidden') {\r\n html.style.overflowY = _this3.htmlOverflowY;\r\n }\r\n\r\n if (body.style.overflowY === 'hidden' && _this3.bodyOverflowY !== 'hidden') {\r\n body.style.overflowY = _this3.bodyOverflowY;\r\n }\r\n }, 1);\r\n }\r\n\r\n // if the caller provided their own onClose, call it\r\n if (_this3.props.onClose) {\r\n _this3.props.onClose();\r\n }\r\n },\r\n\r\n // if we're showing month selectors, don't allow selections of years outside of the\r\n // given year range\r\n isOutsideRange: this.props.isOutsideRange ? this.props.isOutsideRange : showMonthSelectors ? function (day) {\r\n return day.year() < startYear || day.year() > endYear;\r\n } : function () {\r\n return false;\r\n },\r\n\r\n renderMonthElement: showMonthSelectors ? function (_ref2) {\r\n var month = _ref2.month,\r\n onMonthSelect = _ref2.onMonthSelect,\r\n onYearSelect = _ref2.onYearSelect;\r\n return _react2.default.createElement(\r\n 'div',\r\n { className: classes.monthYearSelector },\r\n _react2.default.createElement(\r\n 'div',\r\n null,\r\n _this3.buildSelector(_moment2.default.months().map(function (monthLabel, value) {\r\n return _react2.default.createElement(\r\n _MenuItem2.default,\r\n {\r\n classes: {\r\n root: classes.monthYearSelectMenuItem,\r\n selected: classes.monthYearSelectMenuItemSelected\r\n },\r\n key: value,\r\n value: value,\r\n disableRipple: true,\r\n disableTouchRipple: true\r\n },\r\n monthLabel\r\n );\r\n }), function (e) {\r\n onMonthSelect(month, e.target.value);\r\n }, month.month())\r\n ),\r\n _react2.default.createElement(\r\n 'div',\r\n null,\r\n _this3.buildSelector((0, _range2.default)(startYear, endYear + 1, 1).map(function (year) {\r\n return _react2.default.createElement(\r\n _MenuItem2.default,\r\n {\r\n classes: {\r\n root: classes.monthYearSelectMenuItem,\r\n selected: classes.monthYearSelectMenuItemSelected\r\n },\r\n key: year,\r\n value: year,\r\n disableRipple: true,\r\n disableTouchRipple: true\r\n },\r\n (0, _moment2.default)(year, 'YYYY').format('YYYY')\r\n );\r\n }), function (e) {\r\n onYearSelect(month, e.target.value);\r\n }, month.year())\r\n )\r\n );\r\n } : null,\r\n enableOutsideDays: true,\r\n daySize: DEFAULT_DAY_SIZE,\r\n hideKeyboardShortcutsPanel: true,\r\n transitionDuration: 0\r\n };\r\n\r\n var autoPositionOverrides = {};\r\n\r\n if (autoPosition && this.datePickerRef.current && this.props.focused) {\r\n\r\n var rect = this.datePickerRef.current.getBoundingClientRect();\r\n\r\n // determine if the datepicker will fit in the available vertical space, and if not\r\n // if it makes more sense to open it *above* the field\r\n var verticalFit = rect.bottom + AUTOPOSITION_CALENDAR_HEIGHT <= document.documentElement.clientHeight;\r\n var bottomDelta = document.documentElement.clientHeight - rect.bottom;\r\n var topDelta = rect.top;\r\n var openDirection = !verticalFit && bottomDelta <= topDelta ? OPEN_UP : OPEN_DOWN;\r\n\r\n // determine if the datepicker will fit in the available horizontal space, and if not\r\n // if it makes more sense to anchor it to the *right* of the field\r\n var horizontalFit = rect.left + AUTOPOSITION_CALENDAR_WIDTH <= document.documentElement.clientWidth;\r\n var leftDelta = document.documentElement.clientWidth - rect.left;\r\n var rightDelta = rect.right;\r\n var anchorDirection = !horizontalFit && leftDelta <= rightDelta ? ANCHOR_RIGHT : ANCHOR_LEFT;\r\n\r\n // add positioning overrides\r\n autoPositionOverrides = {\r\n openDirection: openDirection,\r\n anchorDirection: anchorDirection\r\n };\r\n }\r\n\r\n var datePicker = variant === STANDALONE ?\r\n // Standalone\r\n _react2.default.createElement(\r\n 'div',\r\n {\r\n className: (0, _classnames2.default)(classes.root, classes.standalone, (_cn = {}, _defineProperty(_cn, classes.monthYearPickerFix, showMonthSelectors), _defineProperty(_cn, classes.rootRTL, props.isRTL), _defineProperty(_cn, classes.standaloneRTL, props.isRTL), _cn), className)\r\n },\r\n _react2.default.createElement(_reactDates.DayPickerSingleDateController, Object.assign({}, (0, _omit2.default)(DatePickerPropOverrides, INPUT_SPECIFIC_PROPS), (0, _omit2.default)(props, INPUT_SPECIFIC_PROPS)))\r\n ) :\r\n // With input\r\n _react2.default.createElement(\r\n _FormControl2.default,\r\n Object.assign({\r\n className: (0, _classnames2.default)(classes.root, (_cn2 = {}, _defineProperty(_cn2, classes.focused, props.focused), _defineProperty(_cn2, classes.monthYearPickerFix, showMonthSelectors), _defineProperty(_cn2, classes.showPlaceholder, props.focused), _defineProperty(_cn2, classes.rootRTL, props.isRTL), _defineProperty(_cn2, classes.fullWidth, fullWidth), _defineProperty(_cn2, (0, _classnames2.default)(classes.noLabel, classes.noLabelMedium), !hasLabel && size !== 'small'), _defineProperty(_cn2, (0, _classnames2.default)(classes.noLabel, classes.noLabelSmall), !hasLabel && size === 'small'), _defineProperty(_cn2, classes.error, error), _defineProperty(_cn2, classes.focusedError, error && props.focused), _defineProperty(_cn2, classes.smallDatePicker, size === 'small'), _cn2), className),\r\n fullWidth: fullWidth,\r\n error: error\r\n }, FormControlProps),\r\n hasLabel && _react2.default.createElement(\r\n _InputLabel2.default,\r\n Object.assign({\r\n htmlFor: props.id,\r\n classes: {\r\n formControl: classes.inputLabelFormControl,\r\n shrink: classes.inputLabelShrink\r\n },\r\n className: (0, _classnames2.default)(_defineProperty({}, classes.inputLabelSmall, size === 'small')),\r\n shrink: shouldShrink,\r\n error: error\r\n }, InputLabelProps),\r\n label\r\n ),\r\n _react2.default.createElement(\r\n _ClickAwayListener2.default,\r\n { onClickAway: this.handleClose },\r\n _react2.default.createElement(_reactDates.SingleDatePicker, Object.assign({\r\n id: this.singleDatePickerId\r\n }, DatePickerPropOverrides, props, autoPositionOverrides))\r\n ),\r\n helperText && _react2.default.createElement(\r\n _FormHelperText2.default,\r\n Object.assign({ id: helperTextId }, FormHelperTextProps),\r\n helperText\r\n )\r\n );\r\n\r\n // if we're autopositioning, wrap the datepicker in a span so that\r\n // it can be referenced by the autopositioning algorithm\r\n datePicker = _react2.default.createElement(\r\n 'span',\r\n { ref: this.datePickerRef },\r\n datePicker\r\n );\r\n\r\n return datePicker;\r\n }\r\n }]);\r\n\r\n return DatePicker;\r\n}(_react2.default.Component);\r\n\r\nDatePicker.defaultProps = {\r\n placeholder: DEFAULT_PLACEHOLDER,\r\n anchorDirection: ANCHOR_LEFT,\r\n disableScroll: false,\r\n displayFormat: DEFAULT_DISPLAY_FORMAT,\r\n enableOutsideDays: true,\r\n firstDayOfWeek: 0,\r\n inputIconPosition: ICON_AFTER_POSITION,\r\n isDayBlocked: function isDayBlocked() {\r\n return false;\r\n },\r\n isDayHighlighted: function isDayHighlighted() {\r\n return false;\r\n },\r\n isOutsideRange: null,\r\n isRTL: false,\r\n keepOpenOnDateSelect: false,\r\n openDirection: OPEN_DOWN,\r\n variant: WITH_TEXT_FIELD,\r\n weekDayFormat: DEFAULT_WEEK_DAY_FORMAT,\r\n phrases: _defaultPhrases.SingleDatePickerPhrases,\r\n monthSelectionVariant: INCREMENTAL_SELECTION,\r\n startYear: (0, _moment2.default)().year() - 3,\r\n endYear: (0, _moment2.default)().year() + 3,\r\n autoPosition: false,\r\n size: 'medium'\r\n};\r\n\r\nDatePicker.propTypes = {\r\n /**\r\n * @ignore\r\n * Added to allow for global JSS styling (and theme usage).\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * @ignore\r\n */\r\n edsContext: _propTypes2.default.object,\r\n\r\n /****\r\n * FormControl, Input\r\n ****/\r\n /**\r\n * Custom class name to be applied on the `div` when `variant=\"standalone\"` or the `FormControl`\r\n * when `variant=\"with-text-field\"` (default).\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * Mark the `FormControl`, `FormHelperText` and `Input` in an error state.\r\n */\r\n error: _propTypes2.default.bool,\r\n /**\r\n * The helper text content.\r\n */\r\n helperText: _propTypes2.default.node,\r\n /**\r\n * Input label text. This is rendered as the child within the `InputLabel` component.\r\n */\r\n label: _propTypes2.default.string,\r\n /**\r\n * Properties applied to the [`FormControl`](#/components/FormControl) element.\r\n */\r\n FormControlProps: _propTypes2.default.object,\r\n /**\r\n * Properties applied to the [`FormHelperText`](#/components/FormControl) element.\r\n */\r\n FormHelperTextProps: _propTypes2.default.object,\r\n /**\r\n * Render the input field full width of the parent container.\r\n */\r\n fullWidth: _propTypes2.default.bool,\r\n /**\r\n * Properties applied to the [`InputLabel`](#/components/FormControl) element.\r\n */\r\n InputLabelProps: _propTypes2.default.object,\r\n /**\r\n * Render the `DatePicker` with input field or as a standalone calendar UI.\r\n *\r\n * Options are `WITH_TEXT_FIELD` ('with-text-field') or `STANDALONE` ('standalone') and must be imported from `@hedtech/react-design-system/core/DatePicker`.\r\n */\r\n variant: _propTypes2.default.oneOf([WITH_TEXT_FIELD, STANDALONE]),\r\n\r\n /****\r\n * Required props for a function interactive SingleDatePicker\r\n ****/\r\n /**\r\n * The selected date to display in the `DatePicker` input field.\r\n *\r\n * This prop expects a `moment` object.\r\n */\r\n date: _reactMomentProptypes2.default.momentObj,\r\n /**\r\n * Function that handles setting the date.\r\n * This function receives a `date` parameter.\r\n *\r\n * i.e. `date => this.setState({ date })`\r\n */\r\n onDateChange: _propTypes2.default.func.isRequired,\r\n /**\r\n * Handles the focused state of the component.\r\n */\r\n focused: _propTypes2.default.bool,\r\n /**\r\n * Function to set whether the `DatePicker` has a focused state or not.\r\n *\r\n * i.e. `({ focused }) => this.setState({ focused })`\r\n */\r\n onFocusChange: _propTypes2.default.func.isRequired,\r\n\r\n /**\r\n * How months are selected; incrementally, or by month/year:\r\n * * `INCREMENTAL_SELECTION`: Shows next/previous navigation arrows on the date picker\r\n * * `MONTH_YEAR_SELECTION`: Shows month/year selection dropdowns on the date picker\r\n *\r\n * Note: If month/year selection is enabled, the calendar will not allow selection of dates\r\n * before the start year, or after the end year.\r\n */\r\n monthSelectionVariant: _propTypes2.default.oneOf([INCREMENTAL_SELECTION, MONTH_YEAR_SELECTION]),\r\n\r\n /**\r\n * The first year in the year selection dropdown. Only applies when\r\n * `monthSelectionVariant` === `MONTH_YEAR_SELECTION`.\r\n *\r\n * Defaults to three years before current year.\r\n */\r\n startYear: _propTypes2.default.number,\r\n\r\n /**\r\n * The last year in the year selection dropdown. Only applies when\r\n * `monthSelectionVariant` === `MONTH_YEAR_SELECTION`.\r\n *\r\n * Defaults to three years after current year.\r\n */\r\n endYear: _propTypes2.default.number,\r\n\r\n /****\r\n * Input related props\r\n ****/\r\n /**\r\n * A unique identifier of the `DatePicker` to assist with ARIA attribute.\r\n */\r\n id: _propTypes2.default.string,\r\n /**\r\n * Placeholder text in the input field.\r\n */\r\n placeholder: _propTypes2.default.string,\r\n /**\r\n * @ignore\r\n */\r\n 'aria-label': _propTypes2.default.string,\r\n /**\r\n * ARIA label for the HTML input field.\r\n *\r\n * **DEPRECATED** Use `aria-label` instead.\r\n */\r\n ariaLabel: _propTypes2.default.string,\r\n /**\r\n * Set the input field to disabled.\r\n */\r\n disabled: _propTypes2.default.bool,\r\n /**\r\n * Set the input field to required.\r\n */\r\n required: _propTypes2.default.bool,\r\n /**\r\n * Set the input to `readOnly`. This prevents the users from being able to type into the input field. The date can only be selected from the `DatePicker` UI.\r\n */\r\n readOnly: _propTypes2.default.bool,\r\n /**\r\n * Inform screen reader users of the date format, minimum days, blocked out dates, etc.\r\n */\r\n screenReaderInputMessage: _propTypes2.default.string,\r\n\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * If a date is selected, the Calendar icon will be swapped out with a Clear icon.\r\n // */\r\n // showClearDate: PropTypes.bool,\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Render a custom close icon. `showClearDate` has to be `true`.\r\n // */\r\n // customCloseIcon: PropTypes.node,\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Show the default input icon.\r\n // */\r\n // showDefaultInputIcon: PropTypes.bool,\r\n\r\n /**\r\n * Render the icon before the input, or after.\r\n *\r\n * Options are `ICON_BEFORE_POSITION` ('before') or `ICON_AFTER_POSITION` ('after') and must be imported from `@hedtech/react-design-system/core/DatePicker`.\r\n */\r\n inputIconPosition: _propTypes2.default.oneOf([ICON_BEFORE_POSITION, ICON_AFTER_POSITION]),\r\n\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Render a custom input icon. `showDefaultInputIcon` has to be `true`.\r\n // */\r\n // customInputIcon: PropTypes.node,\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Render the `DatePicker` with no border.\r\n // */\r\n // noBorder: PropTypes.bool,\r\n\r\n /**\r\n * Render the `DatePicker` with `display` set to `'block'`.\r\n */\r\n block: _propTypes2.default.bool,\r\n\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Render `DatePicker` with size small.\r\n // */\r\n // small: PropTypes.bool,\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Render `DatePicker` with size regular.\r\n // */\r\n // regular: PropTypes.bool,\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Set the vertical spacing between the input field and the calendar UI.\r\n // */\r\n // verticalSpacing: PropTypes.number,\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Keep focus on the `input` after selecting a date.\r\n // */\r\n // keepFocusOnInput: PropTypes.bool,\r\n\r\n /****\r\n * Calendar presentation and interaction related props\r\n ****/\r\n /**\r\n * Customize the month text rendered in the `DatePicker` UI.\r\n *\r\n * i.e. month => momentJalaali(month).format('jMMMM jYYYY') or 'MM YY'\r\n */\r\n renderMonthText: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func]), // (month) => PropTypes.string,\r\n\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Render custom month calendar.\r\n // *\r\n // * See the airbnb 'single month, custom caption' DayPickerSingleDateController example.\r\n // *\r\n // * i.e. `({ month, onMonthSelect, onYearSelect }) =>
`\r\n // */\r\n // renderMonthElement: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Define the orientation of the `DatePicker` calendar UI.\r\n // */\r\n // orientation: PropTypes.oneOf([HORIZONTAL_ORIENTATION, VERTICAL_ORIENTATION]),\r\n\r\n /**\r\n * Set the direction of the calendar UI to be anchored to the left or the right of the input.\r\n *\r\n * Options are `ANCHOR_LEFT` ('left') or `ANCHOR_RIGHT` ('right') and must be imported from `@hedtech/react-design-system/core/DatePicker`.\r\n */\r\n anchorDirection: _propTypes2.default.oneOf([ANCHOR_LEFT, ANCHOR_RIGHT]),\r\n /**\r\n * Open the `DatePicker` from the top or bottom of the input. This is useful to use when the `DatePicker` selection is near the bottom of the screen.\r\n *\r\n * Options are `OPEN_DOWN` ('down') or `OPEN_UP` ('up') and must be imported from `@hedtech/react-design-system/core/DatePicker`.\r\n */\r\n openDirection: _propTypes2.default.oneOf([OPEN_DOWN, OPEN_UP]),\r\n\r\n // NOTE: Hidden until needed\r\n // horizontalMargin: PropTypes.number,\r\n // withPortal: PropTypes.bool,\r\n // withFullScreenPortal: PropTypes.bool,\r\n\r\n /**\r\n * Render the `DatePicker` as the last child in the HTML `body` element.\r\n *\r\n * This is particularly useful when rendering a `DatePicker` in a `Dialog`.\r\n */\r\n appendToBody: _propTypes2.default.bool,\r\n /**\r\n * Disable the scrolling behavior of the parent container when the `DatePicker` is open.\r\n */\r\n disableScroll: _propTypes2.default.bool,\r\n /**\r\n * Function to set whether the initial month shown.\r\n *\r\n * i.e. This function will force the `DatePicker` to open 10 months from today's month: `() => moment().add(10, 'months')`\r\n */\r\n initialVisibleMonth: _propTypes2.default.func,\r\n /**\r\n * Set the first day of the week.\r\n *\r\n * Options are `0`, `1`, `2`, `3`, `4`, `5`, or `6`.\r\n */\r\n firstDayOfWeek: _propTypes2.default.oneOf([0, 1, 2, 3, 4, 5, 6]),\r\n /**\r\n * Positions the DatePicker so that it doesn't go off the screen.\r\n *\r\n * If this is specified, the `openDirection` and `anchorDirection` props are ignored.\r\n */\r\n autoPosition: _propTypes2.default.bool,\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Set the number of months visible when the DatePicker is open.\r\n // */\r\n // numberOfMonths: PropTypes.number,\r\n\r\n /**\r\n * Keep the `DatePicker` open after selecting a date.\r\n */\r\n keepOpenOnDateSelect: _propTypes2.default.bool,\r\n\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Open the `DatePicker` back up when the date is cleared.\r\n // */\r\n // reopenPickerOnClearDate: PropTypes.bool,\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Render custom calendar information.\r\n // */\r\n // renderCalendarInfo: PropTypes.func,\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Define where to render the additional calendar info. Use with `renderCalendarInfo`.\r\n // */\r\n // calendarInfoPosition: PropTypes.oneOf([\r\n // INFO_POSITION_TOP,\r\n // INFO_POSITION_BOTTOM,\r\n // INFO_POSITION_BEFORE,\r\n // INFO_POSITION_AFTER,\r\n // ]),\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Hide the keyboard shortcuts panel.\r\n // */\r\n // hideKeyboardShortcutsPanel: PropTypes.bool,\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Customize the size of the days. This number should be a non-negative integer.\r\n // */\r\n // daySize: PropTypes.number,\r\n\r\n /**\r\n * Change the reading direction of the `DatePicker`.\r\n */\r\n isRTL: _propTypes2.default.bool,\r\n\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Change the duration of the month transition, measured in `milliseconds`.\r\n // */\r\n // verticalHeight: PropTypes.number,\r\n // /**\r\n // * Change the duration of the month transition, measured in `milliseconds`.\r\n // */\r\n // transitionDuration: PropTypes.number,\r\n // /**\r\n // * Change the horizontal month padding.\r\n // */\r\n // horizontalMonthPadding: PropTypes.number,\r\n\r\n /****\r\n * Navigation related props\r\n ****/\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Render a custom element in place of the `previous` chevron button.\r\n // */\r\n // navPrev: PropTypes.node,\r\n // /**\r\n // * Render a custom element in place of the `next` chevron button.\r\n // */\r\n // navNext: PropTypes.node,\r\n\r\n /**\r\n * Event handler called when the `previous` chevron button is clicked.\r\n */\r\n onPrevMonthClick: _propTypes2.default.func,\r\n /**\r\n * Event handler called when the `next` chevron button is clicked.\r\n */\r\n onNextMonthClick: _propTypes2.default.func,\r\n /**\r\n * Event handler called when the `DatePicker` is closed.\r\n */\r\n onClose: _propTypes2.default.func,\r\n\r\n /****\r\n * Day presentation and interaction props\r\n ****/\r\n // NOTE: Hidden until needed\r\n // /**\r\n // * Customize the contents of the Calendar day elements.\r\n // *\r\n // * See https://github.com/airbnb/react-dates/blob/master/stories/DateRangePicker_day.js#L136 and\r\n // * https://github.com/airbnb/react-dates/blob/master/src/components/CustomizableCalendarDay.jsx.\r\n // */\r\n // renderCalendarDay: PropTypes.func,\r\n\r\n // NOTE: We do not want consumers to customize this prop\r\n // it should be removed in an upcoming release.\r\n /**\r\n * Toggles if days outside of the shown month are visible.\r\n *\r\n * i.e. When March 2019 is shown, the overlapping dates in February and April will show.\r\n */\r\n enableOutsideDays: _propTypes2.default.bool,\r\n /**\r\n * A function that blocks specific days.\r\n * This function receives a `day` (a `moment` object) parameter.\r\n *\r\n * i.e. This function disables all Fridays: `day => moment.weekdays(day.weekday()) === 'Friday'`\r\n */\r\n isDayBlocked: _propTypes2.default.func,\r\n /**\r\n * A function that blocks a range of dates.\r\n * This function receives a `day` (a `moment` object) parameter.\r\n *\r\n * Note: `isInclusivelyAfterDay` is a utility function provided by `react-dates/utils`.\r\n *\r\n * i.e. This function allows for the next two weeks to be available: `day => !isInclusivelyAfterDay(day, moment()) || isInclusivelyAfterDay(day, moment().add(2, 'weeks'))`\r\n */\r\n isOutsideRange: _propTypes2.default.func,\r\n /**\r\n * A function that highlights a specific dates.\r\n * This function receives a `day` (a `moment` object) parameter.\r\n *\r\n * Note: `isSameDay` is a utility function provided by `react-dates/utils`.\r\n *\r\n * i.e. This function highlights dates that match a `moment` date stored in an `Array`: `day1 => datesList.some(day2 => isSameDay(day1, day2))`\r\n */\r\n isDayHighlighted: _propTypes2.default.func,\r\n\r\n /****\r\n * Internationalization props\r\n ****/\r\n\r\n /**\r\n * Date format of the date displayed in the input.\r\n *\r\n * See https://momentjs.com/docs/#/displaying/format/ for more information.\r\n *\r\n * i.e. `() => moment.localeData().longDateFormat('L')` or `'MM DD, YYYY'`\r\n */\r\n displayFormat: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func]),\r\n /**\r\n * Date format of the month displayed.\r\n *\r\n * See https://momentjs.com/docs/#/displaying/format/ for more information.\r\n *\r\n * i.e. `'MMM'`\r\n */\r\n monthFormat: _propTypes2.default.string,\r\n /**\r\n * Date format of weekday headers.\r\n *\r\n * See https://momentjs.com/docs/#/displaying/format/ for more information.\r\n *\r\n * i.e. `'dd'`\r\n */\r\n weekDayFormat: _propTypes2.default.string,\r\n /**\r\n * Override default component phrases.\r\n *\r\n * See https://github.com/airbnb/react-dates/blob/master/src/defaultPhrases.js for more information.\r\n */\r\n phrases: _propTypes2.default.shape((0, _getPhrasePropTypes2.default)(_defaultPhrases.SingleDatePickerPhrases)),\r\n /**\r\n * ARIA label given to the focus-able days.\r\n */\r\n dayAriaLabelFormat: _propTypes2.default.string,\r\n /**\r\n * The size of the `DatePicker`. Small size is recommended to be used within the `TableEditableCell` component.\r\n */\r\n size: _propTypes2.default.oneOf(['small', 'medium'])\r\n};\r\n\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _styles2.default)(styles)(DatePicker));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _Tabs = require('./Tabs');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_Tabs).default;\r\n }\r\n});\r\n\r\nvar _Tab = require('./Tab');\r\n\r\nObject.defineProperty(exports, 'Tab', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_Tab).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _core = require('@material-ui/core');\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _TabScrollButton = require('./internal/TabScrollButton');\r\n\r\nvar _TabScrollButton2 = _interopRequireDefault(_TabScrollButton);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\r\n\r\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\r\n\r\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nvar styles = function styles(theme) {\r\n return _defineProperty({\r\n root: {\r\n backgroundColor: 'transparent'\r\n },\r\n cardLevelFlexContainer: {\r\n boxShadow: 'inset 0 -1px 0 0 ' + theme.palette.grey[300]\r\n },\r\n indicator: {\r\n height: '0.125rem',\r\n backgroundColor: theme.palette.ctaColor.base\r\n }\r\n }, theme.breakpoints.down('sm'), {\r\n scrollButtonsDesktop: {\r\n display: 'inherit !important' // Forcing to display on mobile\r\n }\r\n });\r\n};\r\n\r\n/**\r\n * Use `Tabs` to group similar content into different sections on the same page.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.2\r\n * @examples\r\n * TabsWithContent\r\n * ScrollableButtonTab\r\n * CardLevelTabs\r\n * CardLevelTabsScrollableButtons\r\n */\r\n\r\nvar Tabs = function (_Component) {\r\n _inherits(Tabs, _Component);\r\n\r\n function Tabs(props) {\r\n _classCallCheck(this, Tabs);\r\n\r\n // create a ref to store the Tabs DOM element\r\n var _this = _possibleConstructorReturn(this, (Tabs.__proto__ || Object.getPrototypeOf(Tabs)).call(this, props));\r\n\r\n _this.state = {\r\n hideScrollButtons: false\r\n };\r\n _this.tabsContainer = _react2.default.createRef();\r\n _this.updateScrollButtonsOnLoad = false;\r\n return _this;\r\n }\r\n\r\n _createClass(Tabs, [{\r\n key: 'componentDidMount',\r\n value: function componentDidMount() {\r\n var _this2 = this;\r\n\r\n // Options for the observer (which mutations to observe)\r\n var config = { attributes: true, childList: true, subtree: true };\r\n\r\n // Callback function to execute when mutations are observed\r\n var callback = function callback(mutationsList, observer) {\r\n if (mutationsList && mutationsList.length > 0) {\r\n var _iteratorNormalCompletion = true;\r\n var _didIteratorError = false;\r\n var _iteratorError = undefined;\r\n\r\n try {\r\n for (var _iterator = mutationsList[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {\r\n var mutation = _step.value;\r\n\r\n if (mutation.attributeName === 'disabled' && mutation.target.nodeName === 'BUTTON') {\r\n _this2.showOrHideScrollButtons();\r\n }\r\n }\r\n } catch (err) {\r\n _didIteratorError = true;\r\n _iteratorError = err;\r\n } finally {\r\n try {\r\n if (!_iteratorNormalCompletion && _iterator.return) {\r\n _iterator.return();\r\n }\r\n } finally {\r\n if (_didIteratorError) {\r\n throw _iteratorError;\r\n }\r\n }\r\n }\r\n }\r\n };\r\n\r\n // Create an observer instance linked to the callback function\r\n this.observer = new MutationObserver(callback);\r\n\r\n // Start observing the target node for configured mutations\r\n this.observer.observe(this.tabsContainer.current, config);\r\n\r\n // Call this here so that it triggers `componentDidUpdate()`\r\n this.showOrHideScrollButtons();\r\n }\r\n }, {\r\n key: 'componentDidUpdate',\r\n value: function componentDidUpdate(prevProps, prevState) {\r\n // This need to be called only once when the component is loaded.\r\n // With `componentDidMount()` it did not work and maybe DOM state\r\n // was not updated which is strange. After the first update MutationObserver\r\n // will take care of updating the state of scroll buttons.\r\n if (!this.updateScrollButtonsOnLoad) {\r\n this.showOrHideScrollButtons();\r\n this.updateScrollButtonsOnLoad = true;\r\n }\r\n }\r\n }, {\r\n key: 'showOrHideScrollButtons',\r\n value: function showOrHideScrollButtons() {\r\n var buttons = this.tabsContainer.current.querySelectorAll('.tab-scroll-button:disabled');\r\n this.setState(function (state) {\r\n return { hideScrollButtons: buttons.length === 2 };\r\n });\r\n }\r\n }, {\r\n key: 'componentWillUnmount',\r\n value: function componentWillUnmount() {\r\n this.observer.disconnect();\r\n }\r\n }, {\r\n key: 'render',\r\n value: function render() {\r\n var _this3 = this;\r\n\r\n var _props = this.props,\r\n classes = _props.classes,\r\n TabIndicatorProps = _props.TabIndicatorProps,\r\n childrenProp = _props.children,\r\n scrollButtons = _props.scrollButtons,\r\n scrollButtonsOnMobile = _props.scrollButtonsOnMobile,\r\n variant = _props.variant,\r\n widthVariant = _props.widthVariant,\r\n rest = _objectWithoutProperties(_props, ['classes', 'TabIndicatorProps', 'children', 'scrollButtons', 'scrollButtonsOnMobile', 'variant', 'widthVariant']);\r\n\r\n var _TabIndicatorProps = void 0,\r\n children = childrenProp;\r\n\r\n if (variant === 'card') {\r\n _TabIndicatorProps = Object.assign({\r\n style: { display: 'none' }\r\n }, TabIndicatorProps);\r\n\r\n children = _react2.default.Children.map(this.props.children, function (child) {\r\n return _react2.default.cloneElement(child, {\r\n variant: _this3.props.variant\r\n });\r\n });\r\n } else {\r\n _TabIndicatorProps = Object.assign({}, TabIndicatorProps);\r\n }\r\n\r\n var scrollButtonsProp = scrollButtons;\r\n if (scrollButtons) {\r\n scrollButtonsProp = 'auto';\r\n } else {\r\n scrollButtonsProp = 'off';\r\n }\r\n\r\n return _react2.default.createElement(\r\n 'div',\r\n { ref: this.tabsContainer },\r\n _react2.default.createElement(\r\n _core.Tabs,\r\n Object.assign({\r\n classes: {\r\n root: classes.root,\r\n scroller: variant === 'card' && classes.cardLevelFlexContainer,\r\n indicator: classes.indicator,\r\n scrollButtonsDesktop: scrollButtonsOnMobile ? classes.scrollButtonsDesktop : ''\r\n },\r\n ScrollButtonComponent: function ScrollButtonComponent(props) {\r\n return _react2.default.createElement(_TabScrollButton2.default, Object.assign({\r\n hideScrollButtons: _this3.state.hideScrollButtons\r\n }, props));\r\n },\r\n TabIndicatorProps: _TabIndicatorProps,\r\n scrollButtons: scrollButtonsProp,\r\n variant: widthVariant\r\n }, rest),\r\n children\r\n )\r\n );\r\n }\r\n }]);\r\n\r\n return Tabs;\r\n}(_react.Component);\r\n\r\nTabs.muiName = 'Tabs';\r\n\r\nTabs.propTypes = {\r\n /**\r\n * Callback fired when the component mounts.\r\n * This is useful when you want to trigger an action programmatically.\r\n * It currently only supports `updateIndicator()` action.\r\n *\r\n * @param {object} actions This object contains all possible actions\r\n * that can be triggered programmatically.\r\n */\r\n action: _propTypes2.default.func,\r\n /**\r\n * If `true`, the tabs will be centered.\r\n * This property is intended for large views.\r\n */\r\n centered: _propTypes2.default.bool,\r\n /**\r\n * The content of the component.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Useful to extend the style applied to components.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * Send a custom class name.\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * @ignore\r\n * Determines the color of the indicator.\r\n */\r\n indicatorColor: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.oneOf(['secondary', 'primary'])]),\r\n /**\r\n * Callback fired when the value changes.\r\n *\r\n * @param {object} event The event source of the callback\r\n * @param {number} value We default to the index of the child\r\n */\r\n onChange: _propTypes2.default.func,\r\n /**\r\n * Render the scroll buttons. If set to `true`, scroll buttons will be rendered if the tabs\r\n * don't fit in the current viewport.\r\n *\r\n * On mobile viewports the Tabs container has horizontal scrolling. To suppress scroll buttons\r\n * on mobile viewports, use the `scrollButtonsOnMobile` prop.\r\n */\r\n scrollButtons: _propTypes2.default.bool,\r\n /**\r\n * Whether to show scroll buttons in the mobile viewport (when `scrollButtons` is `true`).\r\n */\r\n scrollButtonsOnMobile: _propTypes2.default.bool,\r\n /**\r\n * @ignore\r\n * The component used to render the scroll buttons.\r\n */\r\n ScrollButtonComponent: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * @ignore\r\n * Properties applied to the private `TabIndicator` element.\r\n */\r\n TabIndicatorProps: _propTypes2.default.object,\r\n /**\r\n * The value of the currently selected `Tab`.\r\n * If you don't want any selected `Tab`, you can set this property to `false`.\r\n */\r\n value: _propTypes2.default.any,\r\n /**\r\n * Set the variant to `page` to render a page level Tab.\r\n * Set the variant to `card` to render a card level Tab.\r\n */\r\n variant: _propTypes2.default.oneOf(['page', 'card']),\r\n\r\n /**\r\n * Determines additional display behavior of the tabs:\r\n * - scrollable will invoke scrolling properties and allow for horizontally scrolling (or swiping) of the tab bar.\r\n * - fullWidth will make the tabs grow to use all the available space, which should be used for small views, like on mobile.\r\n * - standard will render the default state.\r\n */\r\n widthVariant: _propTypes2.default.oneOf(['scrollable', 'standard', 'fullWidth'])\r\n};\r\n\r\nTabs.defaultProps = {\r\n centered: false,\r\n widthVariant: 'scrollable',\r\n scrollButtons: false,\r\n scrollButtonsOnMobile: true,\r\n variant: 'page'\r\n};\r\n\r\nexports.default = (0, _styles.withStyles)(styles, { index: 0 })(Tabs);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\nexports.styles = undefined;\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _ChevronRight = require('@eui/ds-icons/lib/ChevronRight');\r\n\r\nvar _ChevronRight2 = _interopRequireDefault(_ChevronRight);\r\n\r\nvar _ChevronLeft = require('@eui/ds-icons/lib/ChevronLeft');\r\n\r\nvar _ChevronLeft2 = _interopRequireDefault(_ChevronLeft);\r\n\r\nvar _withStyles = require('../../styles/withStyles');\r\n\r\nvar _withStyles2 = _interopRequireDefault(_withStyles);\r\n\r\nvar _IconButton = require('../../IconButton');\r\n\r\nvar _IconButton2 = _interopRequireDefault(_IconButton);\r\n\r\nvar _tokens = require('../../styles/tokens');\r\n\r\nvar _EDSContext = require('../../EDSContext/EDSContext');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = exports.styles = {\r\n /* Styles applied to the root element. */\r\n root: {\r\n color: 'inherit',\r\n flexBasis: 'auto',\r\n alignSelf: 'center',\r\n margin: '0 2px'\r\n },\r\n icon: {\r\n height: _tokens.spacingSmall,\r\n width: _tokens.spacingSmall\r\n },\r\n scrollLeftIcon: {\r\n marginRight: _tokens.spacingXSmall\r\n },\r\n scrollRightIcon: {\r\n marginLeft: _tokens.spacingXSmall\r\n },\r\n hideScrollButtons: {\r\n display: 'none'\r\n }\r\n};\r\n\r\nvar TabScrollButton = _react2.default.forwardRef(function (props, ref) {\r\n var _classNames2;\r\n\r\n var classes = props.classes,\r\n classNameProp = props.className,\r\n direction = props.direction,\r\n edsContext = props.edsContext,\r\n onClick = props.onClick,\r\n visible = props.visible,\r\n hideScrollButtons = props.hideScrollButtons,\r\n other = _objectWithoutProperties(props, ['classes', 'className', 'direction', 'edsContext', 'onClick', 'visible', 'hideScrollButtons']);\r\n\r\n var className = (0, _classnames2.default)('tab-scroll-button', classes.root, _defineProperty({}, classes.hideScrollButtons, hideScrollButtons), classNameProp, (_classNames2 = {}, _defineProperty(_classNames2, classes.scrollLeftIcon, direction === 'left'), _defineProperty(_classNames2, classes.scrollRightIcon, direction === 'right'), _classNames2));\r\n\r\n return (\r\n // NOTE: This should use the gray version of the icon-only IconButton\r\n _react2.default.createElement(\r\n _IconButton2.default,\r\n Object.assign({\r\n 'aria-label': edsContext.formatMessage('component.Tabs.scrollButtons'),\r\n title: edsContext.formatMessage('component.Tabs.scrollButtons'),\r\n className: className,\r\n onClick: onClick,\r\n tabIndex: -1,\r\n color: 'secondary',\r\n disabled: !visible\r\n }, other, {\r\n ref: ref\r\n }),\r\n direction === 'left' ? _react2.default.createElement(_ChevronLeft2.default, { className: classes.icon }) : _react2.default.createElement(_ChevronRight2.default, { className: classes.icon })\r\n )\r\n );\r\n});\r\n\r\nTabScrollButton.propTypes = {\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * The direction of icon to render.\r\n */\r\n direction: _propTypes2.default.oneOf(['left', 'right']),\r\n /**\r\n * @ignore\r\n */\r\n edsContext: _propTypes2.default.object,\r\n /**\r\n * Callback to execute for button press.\r\n */\r\n onClick: _propTypes2.default.func,\r\n /**\r\n * Should the button be present or just consume space.\r\n */\r\n visible: _propTypes2.default.bool,\r\n /**\r\n * For auto mode, buttons will be hidden if tabs don't need scrolling\r\n */\r\n hideScrollButtons: _propTypes2.default.bool\r\n};\r\n\r\nTabScrollButton.defaultProps = {\r\n visible: true\r\n};\r\n\r\nTabScrollButton.muiName = 'MuiPrivateTabScrollButton';\r\n\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _withStyles2.default)(styles)(TabScrollButton));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _core = require('@material-ui/core');\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nvar styles = function styles(theme) {\r\n var _tabRoot, _cardLevelTabRoot;\r\n\r\n return {\r\n tabRoot: (_tabRoot = {\r\n textTransform: 'none',\r\n minWidth: 'auto',\r\n margin: '0 ' + _tokens.spacingSmall,\r\n padding: '0px ' + _tokens.spacingXxSmall,\r\n lineHeight: '' + _tokens.lineHeightParagraphSmall\r\n }, _defineProperty(_tabRoot, theme.breakpoints.up('md'), {\r\n minWidth: 'auto'\r\n }), _defineProperty(_tabRoot, '&:hover', {\r\n color: theme.palette.ctaColor.hover\r\n }), _defineProperty(_tabRoot, '&:focus', {\r\n boxShadow: _tokens.boxShadowFocusInset,\r\n color: theme.palette.ctaColor.active\r\n }), _defineProperty(_tabRoot, '&$disabled', {\r\n color: theme.palette.text.disabled\r\n }), _defineProperty(_tabRoot, 'fontFamily', theme.typography.fontFamily), _defineProperty(_tabRoot, 'fontWeight', theme.typography.button.fontWeight), _defineProperty(_tabRoot, 'fontSize', theme.typography.body1.fontSize), _tabRoot),\r\n cardLevelTabRoot: (_cardLevelTabRoot = {\r\n fontFamily: theme.typography.fontFamily,\r\n fontWeight: theme.typography.button.fontWeight,\r\n fontSize: theme.typography.body1.fontSize,\r\n textTransform: 'none',\r\n minWidth: 'auto',\r\n padding: '0px ' + _tokens.spacingSmall\r\n }, _defineProperty(_cardLevelTabRoot, theme.breakpoints.up('md'), {\r\n minWidth: 'auto'\r\n }), _defineProperty(_cardLevelTabRoot, '&:hover', {\r\n color: theme.palette.ctaColor.hover\r\n }), _defineProperty(_cardLevelTabRoot, '&:focus', {\r\n boxShadow: _tokens.boxShadowFocusInset,\r\n color: theme.palette.ctaColor.active\r\n }), _defineProperty(_cardLevelTabRoot, '&$disabled', {\r\n color: theme.palette.text.disabled\r\n }), _cardLevelTabRoot),\r\n selected: {\r\n color: theme.palette.ctaColor.base\r\n },\r\n // Inherit styles\r\n textColorInherit: {\r\n color: theme.palette.text.secondary,\r\n opacity: '1',\r\n '&$selected': {\r\n color: theme.palette.ctaColor.base\r\n },\r\n '&$disabled': {\r\n opacity: 1,\r\n color: theme.palette.grey[400]\r\n }\r\n },\r\n // Primary styles\r\n textColorPrimary: {\r\n color: theme.palette.text.secondary,\r\n opacity: '1',\r\n '&$selected': {\r\n color: theme.palette.ctaColor.base\r\n },\r\n '&$disabled': {\r\n opacity: '1'\r\n }\r\n },\r\n // Secondary styles\r\n textColorSecondary: {\r\n color: theme.palette.text.secondary,\r\n opacity: '1',\r\n '&$selected': {\r\n color: theme.palette.ctaColor.base\r\n },\r\n '&$disabled': {\r\n opacity: '1',\r\n '&:hover': {\r\n color: theme.palette.grey[400]\r\n }\r\n }\r\n },\r\n // label: {\r\n // fontFamily: theme.typography.fontFamily,\r\n // fontWeight: theme.typography.button.fontWeight,\r\n // fontSize: theme.typography.body1.fontSize,\r\n // },\r\n // labelContainer: {\r\n // width: '100%', // Fix an IE 11 issue\r\n // boxSizing: 'border-box',\r\n // padding: `0 ${spacingXxSmall}`,\r\n // },\r\n cardLevel: {\r\n border: '1px solid transparent', // Fix text/tab shift with border\r\n '&$selected': {\r\n borderColor: theme.palette.grey[300] + ' ' + theme.palette.grey[300] + ' #fff',\r\n borderTopRightRadius: 4,\r\n borderTopLeftRadius: 4\r\n }\r\n },\r\n disabled: {\r\n opacity: '1',\r\n color: theme.palette.grey[400]\r\n }\r\n };\r\n};\r\n\r\nvar Tab = _react2.default.forwardRef(function (props, ref) {\r\n var _classNames;\r\n\r\n var classes = props.classes,\r\n classNameProp = props.className,\r\n variant = props.variant,\r\n rest = _objectWithoutProperties(props, ['classes', 'className', 'variant']);\r\n\r\n return _react2.default.createElement(_core.Tab, Object.assign({}, rest, {\r\n classes: {\r\n root: variant === 'card' ? classes.cardLevelTabRoot : classes.tabRoot,\r\n selected: classes.selected,\r\n textColorInherit: classes.textColorInherit,\r\n textColorPrimary: classes.textColorPrimary,\r\n textColorSecondary: classes.textColorSecondary,\r\n // label: classes.label,\r\n // labelContainer: classes.labelContainer,\r\n disabled: classes.disabled\r\n },\r\n className: (0, _classnames2.default)((_classNames = {}, _defineProperty(_classNames, classes.cardLevel, variant === 'card'), _defineProperty(_classNames, 'classNameProp', classNameProp), _classNames)),\r\n disableRipple: true,\r\n ref: ref\r\n }));\r\n});\r\n\r\nTab.muiName = 'Tab';\r\nTab.displayName = 'Tab';\r\n\r\nTab.propTypes = {\r\n /**\r\n * Useful to extend the style applied to components.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * If `true`, the tab will be disabled.\r\n */\r\n disabled: _propTypes2.default.bool,\r\n /**\r\n * @ignore\r\n */\r\n fullWidth: _propTypes2.default.bool,\r\n /**\r\n * @ignore\r\n * For server side rendering consideration, we let the selected tab\r\n * render the indicator.\r\n */\r\n indicator: _propTypes2.default.node,\r\n /**\r\n * The label element.\r\n */\r\n label: _propTypes2.default.node,\r\n /**\r\n * @ignore\r\n */\r\n onChange: _propTypes2.default.func,\r\n /**\r\n * @ignore\r\n */\r\n onClick: _propTypes2.default.func,\r\n /**\r\n * @ignore\r\n */\r\n selected: _propTypes2.default.bool,\r\n /**\r\n * @ignore\r\n */\r\n textColor: _propTypes2.default.oneOf(['secondary', 'primary', 'inherit']),\r\n /**\r\n * You can provide your own value. Otherwise, we fallback to the child position index.\r\n */\r\n value: _propTypes2.default.any,\r\n /**\r\n * @ignore\r\n * Internal value to check if the Tab should have Card Level styling.\r\n */\r\n variant: _propTypes2.default.oneOf(['page', 'card'])\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(Tab);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\nexports.styles = exports.TEXT_STYLING_INLINE = exports.TEXT_STYLING_STANDALONE = undefined;\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Button = require('@material-ui/core/Button');\r\n\r\nvar _Button2 = _interopRequireDefault(_Button);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// text styling variants\r\nvar TEXT_STYLING_STANDALONE = exports.TEXT_STYLING_STANDALONE = 'standalone';\r\nvar TEXT_STYLING_INLINE = exports.TEXT_STYLING_INLINE = 'inline';\r\n\r\n/**\r\n * TODO: Need to implement the css for outlined buttons now that they are available.\r\n */\r\nvar styles = exports.styles = function styles(theme) {\r\n return {\r\n // Shared Button styles\r\n root: {\r\n // fontFamily is being updated from theme object for fontFamilies: { button: ... }\r\n lineHeight: 1.5,\r\n boxShadow: 'none',\r\n textTransform: 'none',\r\n color: theme.palette.text.white,\r\n borderRadius: _tokens.borderRadiusXLarge,\r\n padding: _tokens.spacingXxSmall + ' ' + _tokens.spacingMedium,\r\n fontSize: theme.typography.body1.fontSize,\r\n minHeight: _tokens.sizingXLarge,\r\n outline: 'none',\r\n '&$disabled': {\r\n color: theme.palette.text.white\r\n },\r\n '& svg': {\r\n flex: '1 0 auto'\r\n }\r\n },\r\n // Sizes\r\n sizeSmall: {\r\n fontSize: theme.typography.body2.fontSize,\r\n minHeight: '2.375rem',\r\n padding: _tokens.spacingXxSmall + ' ' + _tokens.spacingSmall\r\n },\r\n sizeLarge: {\r\n fontSize: theme.typography.body1.fontSize,\r\n minHeight: '3.125rem',\r\n padding: _tokens.spacingXxSmall + ' ' + _tokens.spacingLarge\r\n },\r\n // Shared Disabled Button styles\r\n disabled: {\r\n backgroundColor: theme.palette.disabled.background,\r\n color: theme.palette.grey[100]\r\n },\r\n // Primary Button\r\n contained: {\r\n backgroundColor: theme.palette.ctaColor.base,\r\n '&:hover': {\r\n backgroundColor: theme.palette.ctaColor.hover,\r\n borderColor: theme.palette.ctaColor.hover\r\n },\r\n '&:active': {\r\n boxShadow: 'none',\r\n backgroundColor: theme.palette.ctaColor.active,\r\n borderColor: theme.palette.ctaColor.active\r\n },\r\n '&$disabled': {\r\n boxShadow: 'none',\r\n border: 'none',\r\n backgroundColor: theme.palette.disabled.background,\r\n color: theme.palette.text.white\r\n },\r\n '&:focus': {\r\n outline: 'none',\r\n boxShadow: _tokens.boxShadowFocus\r\n },\r\n '&:focus:hover': {\r\n backgroundColor: theme.palette.ctaColor.active,\r\n borderColor: theme.palette.ctaColor.active,\r\n boxShadow: _tokens.boxShadowFocus\r\n }\r\n },\r\n textPrimary: {\r\n backgroundColor: 'transparent',\r\n color: _tokens.colorCtaBlueBase, // text buttons do not respond to theme changes\r\n borderRadius: _tokens.borderRadiusSmall,\r\n minWidth: 'inherit',\r\n minHeight: 'inherit',\r\n height: 'auto',\r\n padding: '0 ' + _tokens.spacingXxSmall + ' 0 ' + _tokens.spacingXxSmall,\r\n textDecoration: 'underline',\r\n '&$disabled': {\r\n boxShadow: 'none',\r\n border: 'none',\r\n color: theme.palette.action.disabled,\r\n backgroundColor: 'transparent'\r\n },\r\n '&:focus:active': {\r\n color: theme.palette.ctaColor.active,\r\n boxShadow: 'none'\r\n },\r\n '&:hover': {\r\n backgroundColor: 'transparent',\r\n color: theme.palette.ctaColor.hover,\r\n textDecoration: 'underline',\r\n boxShadow: 'none'\r\n },\r\n '&:focus': {\r\n outline: 'none',\r\n boxShadow: _tokens.boxShadowFocus\r\n },\r\n '&:focus:hover': {\r\n boxShadow: 'none'\r\n }\r\n },\r\n textStandalone: {\r\n fontFamily: _tokens.fontFamilyDefault,\r\n fontWeight: _tokens.fontWeightStrong\r\n },\r\n textInline: {\r\n fontFamily: 'inherit',\r\n fontSize: 'inherit',\r\n fontWeight: 'inherit',\r\n verticalAlign: 'inherit',\r\n padding: 0\r\n },\r\n textPrimaryDark: {\r\n color: theme.palette.grey[100],\r\n '&:hover': {\r\n color: theme.palette.grey[200]\r\n },\r\n '&:focus:active': {\r\n color: theme.palette.grey[300]\r\n }\r\n },\r\n // Secondary Button\r\n containedSecondary: {\r\n backgroundColor: theme.palette.grey[100],\r\n color: theme.palette.ctaColor.base,\r\n border: _tokens.borderWidthThin + ' solid',\r\n '&:hover': {\r\n backgroundColor: theme.palette.ctaColor.hover,\r\n borderColor: theme.palette.ctaColor.hover,\r\n color: theme.palette.grey[100]\r\n },\r\n '&:active': {\r\n boxShadow: 'none',\r\n backgroundColor: theme.palette.ctaColor.active,\r\n borderColor: theme.palette.ctaColor.active,\r\n color: theme.palette.grey[100]\r\n },\r\n '&$disabled': {\r\n boxShadow: 'none',\r\n border: 'none',\r\n backgroundColor: theme.palette.disabled.background,\r\n color: theme.palette.text.white\r\n },\r\n '&:focus': {\r\n outline: 'none',\r\n boxShadow: _tokens.boxShadowFocus\r\n },\r\n '&:focus:hover': {\r\n backgroundColor: theme.palette.ctaColor.active,\r\n borderColor: theme.palette.ctaColor.active,\r\n boxShadow: _tokens.boxShadowFocus,\r\n color: theme.palette.text.white\r\n }\r\n }\r\n // Outlined => Inverted Buttons\r\n // outlined: {\r\n // backgroundColor: \"transparent\",\r\n // color: \"#FFFFFF\",\r\n // border: \"1px solid #FFFFFF\",\r\n // \"&:hover\": {\r\n // backgroundColor: \"#FFFFFF\",\r\n // color: \"transparent\" // TODO: verify with UXD about color fo rtext on hover, pressed, focused\r\n // },\r\n // \"&:active\": {\r\n // boxShadow: \"none\",\r\n // backgroundColor: \"#0A4982\",\r\n // borderColor: \"#0A4982\",\r\n // color: \"#FFFFFF\"\r\n // },\r\n // \"&$disabled\": {\r\n // color: \"#FFFFFF\", // FIXME: not showing up properly, being overridden\r\n // boxShadow: \"none\",\r\n // backgroundColor: \"#B2B3B7\",\r\n // border: \"none\"\r\n // },\r\n // \"&:focus\": {\r\n // boxShadow: \"0 0 0 2px #FFFFFF\"\r\n // },\r\n // \"&:focus:hover\": {\r\n // backgroundColor: \"#FFFFFF\",\r\n // borderColor: \"#FFFFFF\",\r\n // boxShadow: \"0 0 0 2px #FFFFFF\",\r\n // color: \"transparent\"\r\n // }\r\n // },\r\n };\r\n};\r\n\r\n/**\r\n * Use `Button` to show a call to action.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.5\r\n * @examples\r\n * SimpleExample\r\n * SizesExample\r\n * FluidExample\r\n * TextWithIconExample\r\n * ButtonGroupExample\r\n * TextButtonExample\r\n * TextOverflowExample\r\n */\r\nvar Button = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n fluid = props.fluid,\r\n textVariantStyling = props.textVariantStyling,\r\n variant = props.variant,\r\n withDarkBackground = props.withDarkBackground,\r\n rest = _objectWithoutProperties(props, ['classes', 'fluid', 'textVariantStyling', 'variant', 'withDarkBackground']);\r\n\r\n var textClass = classes.textPrimary + '\\n ' + (withDarkBackground ? classes.textPrimaryDark : '') + '\\n ' + (textVariantStyling === TEXT_STYLING_INLINE ? classes.textInline : classes.textStandalone) + '\\n ';\r\n\r\n var classOverrides = {\r\n root: classes.root,\r\n contained: classes.contained,\r\n text: textClass,\r\n containedSecondary: classes.containedSecondary,\r\n sizeSmall: classes.sizeSmall,\r\n sizeLarge: classes.sizeLarge,\r\n disabled: classes.disabled\r\n };\r\n\r\n var propOverrides = {\r\n disableRipple: true, // disable the click ripple by default\r\n disableFocusRipple: true // disable the default MUI focus ripple effect\r\n };\r\n\r\n if (variant === 'text') {\r\n // Need to override these props to prevent styling issues\r\n propOverrides.color = 'primary';\r\n propOverrides.fullWidth = false;\r\n };\r\n\r\n return _react2.default.createElement(\r\n _Button2.default,\r\n Object.assign({\r\n variant: variant,\r\n classes: classOverrides,\r\n fullWidth: fluid,\r\n ref: ref\r\n }, rest, propOverrides),\r\n props.children\r\n );\r\n});\r\n\r\nButton.propTypes = {\r\n /**\r\n * Class name to assign the component.\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * Classes used to extend original style object.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The content of the button.\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * The color of the component.\r\n */\r\n color: _propTypes2.default.oneOf(['primary', 'secondary']),\r\n /**\r\n * If `true`, the button will be disabled.\r\n */\r\n disabled: _propTypes2.default.bool,\r\n /**\r\n * If `true`, the button will take up the full width of its container.\r\n */\r\n fluid: _propTypes2.default.bool,\r\n /**\r\n * The URL to link to when the button is clicked.\r\n * If defined, an `a` element will be used as the root node.\r\n */\r\n href: _propTypes2.default.string,\r\n /**\r\n * The size of the button.\r\n *\r\n * **DEPRECATION NOTICE**\r\n *\r\n * In the next major version:\r\n *\r\n * 1. The `large` button size will be removed\r\n * 2. The `medium` button size will be renamed 'default'\r\n *\r\n */\r\n size: _propTypes2.default.oneOf(['small', 'medium', 'large']),\r\n /**\r\n * The font configuration of the `text` variant\r\n *\r\n * * `standalone` - Use standard text-button styling\r\n * * `inline` - Inherits styling from context. Used for text buttons placed inline with other text.\r\n */\r\n textVariantStyling: _propTypes2.default.oneOf(['standalone', 'inline']),\r\n /**\r\n * The HTML button type.\r\n */\r\n type: _propTypes2.default.string,\r\n /**\r\n * The type of button.\r\n */\r\n variant: _propTypes2.default.oneOf(['contained', 'text']),\r\n /**\r\n * With `variant=\"text\"`, use this if you want to render a button on Snackbar or any dark background.\r\n */\r\n withDarkBackground: _propTypes2.default.bool\r\n // We should use \"flat\" for our \"text\" buttons, and \"outlined\" for our \"inverted\", and \"fab\" for our floating action button.\r\n};\r\n\r\nButton.defaultProps = {\r\n variant: 'contained',\r\n color: 'primary',\r\n size: 'medium',\r\n textVariantStyling: 'standalone',\r\n fluid: false,\r\n withDarkBackground: false\r\n};\r\n\r\n// necessary to add an explicit display name, since docgen can't seem to\r\n// extract one from a forwardRef'd component\r\nButton.displayName = 'Button';\r\n\r\n/**\r\n * We order Button styles at index: 0 to avoid improper ordering\r\n * of Dropdown styles.\r\n */\r\nexports.default = (0, _styles2.default)(styles, { name: 'Button', index: 0 })(Button);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\nexports.styles = undefined;\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = exports.styles = function styles(theme) {\r\n return {\r\n root: {\r\n '& button': {\r\n margin: '0 8px',\r\n marginBottom: '8px'\r\n }\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * Use a `ButtonGroup` for two or more buttons that are grouped together.\r\n */\r\nvar ButtonGroup = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n className = props.className,\r\n children = props.children,\r\n rest = _objectWithoutProperties(props, ['classes', 'className', 'children']);\r\n\r\n // showcase all class overrides\r\n\r\n\r\n var buttonGroupClasses = (0, _classnames2.default)(classes.root, className);\r\n\r\n return _react2.default.createElement(\r\n 'div',\r\n Object.assign({ className: buttonGroupClasses }, rest, { ref: ref }),\r\n children\r\n );\r\n});\r\n\r\nButtonGroup.displayName = 'ButtonGroup';\r\n\r\nButtonGroup.propTypes = {\r\n /**\r\n * Class name to assign the component.\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * Classes used to extend original style object.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The buttons that are passed in as children within ButtonGroups.\r\n */\r\n children: _propTypes2.default.node.isRequired\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(ButtonGroup);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\nexports.styles = undefined;\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _EDSContext = require('../EDSContext/EDSContext');\r\n\r\nvar _v = require('uuid/v4');\r\n\r\nvar _v2 = _interopRequireDefault(_v);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// TODO: Account for custom logos\r\n\r\nvar styles = exports.styles = function styles(theme) {\r\n return {\r\n root: {\r\n height: _tokens.sizingXxLarge1,\r\n minWidth: '7.5rem',\r\n padding: _tokens.spacingSmall\r\n },\r\n logoContainer: {\r\n height: _tokens.heightFluid,\r\n width: _tokens.widthFluid,\r\n display: 'inline-block',\r\n maxHeight: 'none',\r\n fill: _tokens.colorFillLogoPreferred // by default assign to preferred fill color\r\n },\r\n logoAlternativeLogo: {\r\n fill: _tokens.colorFillLogoAlternativePowerButton\r\n },\r\n logoAlternativeText: {\r\n fill: _tokens.colorFillLogoAlternativeText\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * Use `Logo` to display the logo within the top header bar.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.5\r\n * @examples\r\n * SimpleExample\r\n * ClickExample\r\n * NavLinkExample\r\n * RedirectExample\r\n */\r\nvar Logo = _react2.default.forwardRef(function (props, ref) {\r\n var logo = props.logo,\r\n id = props.id,\r\n classes = props.classes,\r\n classNameProp = props.className,\r\n component = props.component,\r\n edsContext = props.edsContext,\r\n rest = _objectWithoutProperties(props, ['logo', 'id', 'classes', 'className', 'component', 'edsContext']);\r\n\r\n var logoPowerButtonClasses = (0, _classnames2.default)(_defineProperty({}, classes.logoAlternativeLogo, logo === 'alternative'));\r\n\r\n var logoTextClasses = (0, _classnames2.default)(_defineProperty({}, classes.logoAlternativeText, logo === 'alternative'));\r\n\r\n var ComponentProp = component;\r\n // Only id the logo if original id present.\r\n var svgId = id ? id + '_LogoSvg' : '' + (0, _v2.default)();\r\n\r\n return _react2.default.createElement(\r\n ComponentProp,\r\n Object.assign({\r\n id: id,\r\n className: (0, _classnames2.default)(classes.root, classNameProp)\r\n }, rest, {\r\n ref: ref\r\n }),\r\n _react2.default.createElement(\r\n 'svg',\r\n {\r\n className: (0, _classnames2.default)(classes.logoContainer),\r\n role: 'img',\r\n 'aria-labelledby': 'logo_description_' + svgId,\r\n id: svgId,\r\n xmlns: 'http://www.w3.org/2000/svg',\r\n viewBox: '0 0 431.49 88.05'\r\n },\r\n _react2.default.createElement(\r\n 'desc',\r\n { id: 'logo_description_' + svgId },\r\n edsContext.formatMessage('component.Logo.logo')\r\n ),\r\n _react2.default.createElement('path', {\r\n className: logoPowerButtonClasses,\r\n d: 'M135.2,124a44,44,0,1,0,24.33,57.3A44,44,0,0,0,135.2,124Zm14.1,53.17a33,33,0,1,1-23.69-44.59,31,31,0,0,1,10.54,4.26l-4.3,10.64-10.11,25-10.53-4.25,10.1-25A21.78,21.78,0,1,0,139,156.94l5.26-13A33,33,0,0,1,149.3,177.14Z',\r\n transform: 'translate(-74.69 -120.75)'\r\n }),\r\n _react2.default.createElement('path', {\r\n className: logoTextClasses,\r\n d: 'M506.18,191.09a4.38,4.38,0,1,1-4.37-4.26A4.29,4.29,0,0,1,506.18,191.09Zm-7.67,0a3.31,3.31,0,0,0,3.33,3.41,3.41,3.41,0,0,0,0-6.81A3.31,3.31,0,0,0,498.51,191.09Zm2.63,2.24h-1v-4.27a9.4,9.4,0,0,1,1.64-.13,2.58,2.58,0,0,1,1.48.32,1.19,1.19,0,0,1,.42.93,1.1,1.1,0,0,1-.89,1v.05a1.26,1.26,0,0,1,.78,1,3.47,3.47,0,0,0,.31,1.07h-1.06a3.73,3.73,0,0,1-.34-1c-.08-.47-.34-.68-.88-.68h-.47Zm0-2.42h.47c.55,0,1-.18,1-.62s-.29-.65-.91-.65a2.26,2.26,0,0,0-.55.05Z',\r\n transform: 'translate(-74.69 -120.75)'\r\n }),\r\n _react2.default.createElement('path', {\r\n className: logoTextClasses,\r\n d: 'M235,172.54H200.62a17.9,17.9,0,0,0,4.7,12.2,12.17,12.17,0,0,0,8.94,3.46c3.84,0,7-1.06,9-3.17a10.29,10.29,0,0,0,2.88-5.28h8a17.85,17.85,0,0,1-7.49,12,22.36,22.36,0,0,1-12.39,3.66,20.76,20.76,0,0,1-16.14-7.3c-4-4.71-6.05-11.14-6.05-18.06,0-5.86,1.05-11.05,3.75-15.57a20.81,20.81,0,0,1,18.34-10.18,19.61,19.61,0,0,1,14.8,6.25,25.1,25.1,0,0,1,6.15,17.09Zm-11.24-16.9a11.55,11.55,0,0,0-9.61-4.42c-8.84,0-13.16,7.2-13.35,14.31h25.94A17,17,0,0,0,223.77,155.64Zm93.59,38.52-.67-7.4c-2.5,5.57-8.74,8.55-14.41,8.55-11,0-16.62-6.63-16.62-17.87V145.55h8.17v30.74c0,7.3,2.69,11.63,10.37,11.63a11,11,0,0,0,8.07-3.65c3.07-3.17,4-8.46,4-13.45V145.55h8.16v48.61Zm51.73-4c-3.46,3.36-8.07,5.29-14,5.29-8.74,0-14.31-4-17.77-9.13-2.6-3.84-4-9.12-4-16.42s1.43-12.59,4-16.43c3.46-5.09,8.93-9.13,17.67-9.13a19.33,19.33,0,0,1,13.84,5.19A18.7,18.7,0,0,1,374.57,162h-8.26a12.18,12.18,0,0,0-3.46-7.59,11.37,11.37,0,0,0-7.88-3,12.25,12.25,0,0,0-8.45,3.17c-3.84,3.27-4.9,9.32-4.9,15.28s1.06,12,4.9,15.27a12.29,12.29,0,0,0,8.45,3.16,11.34,11.34,0,0,0,8.26-3.26,11.9,11.9,0,0,0,3.27-7.2h8.26A18.23,18.23,0,0,1,369.09,190.12Zm14.16-51.57V130.1h8.88v8.45Zm.26,55.61V145.55h8.36v48.61Zm56.25.67c-4.32,0-7-3.27-7-7.4h-.19c-2.78,4.9-8.83,8-15.66,8-11.14,0-16.71-7.49-16.71-15,0-6.25,4-14.41,17.29-15.17l14.8-.87v-3.56c0-2.4-.29-5.37-2.5-7.39-1.64-1.54-4-2.5-8-2.5-4.41,0-7.2,1.25-8.84,2.88a8,8,0,0,0-2.4,5.86h-8a14.39,14.39,0,0,1,4.23-10.18c3.27-3.46,9-5.19,15-5.19,9.42,0,14.8,4,17.1,9.32a18.63,18.63,0,0,1,1.44,7.49v23.54c0,2.59,1.06,3.27,2.69,3.27a11.79,11.79,0,0,0,2.12-.29v6.05A11.36,11.36,0,0,1,439.76,194.83Zm-7.49-24.11-13.07.77c-4.9.29-10.66,2.59-10.66,8.74,0,4.32,2.69,8.35,9.6,8.35a13.67,13.67,0,0,0,10-3.93,15.72,15.72,0,0,0,4.14-11.05Zm51.63,23.44V163.32c0-7.3-3-11.62-10.66-11.62-4.71,0-8.46,3.07-10.57,7.49-1.63,3.56-1.73,8.64-1.73,12.39v22.58h-8.16V145.55h7.1l.68,7.3c2.5-5.57,9.22-8.55,14.7-8.55,11,0,16.8,6.63,16.8,17.87v32Zm-231.45,0V124.8h-8.16v69.36Zm22.27,0V124.8h-8.17v69.36Z',\r\n transform: 'translate(-74.69 -120.75)'\r\n })\r\n )\r\n );\r\n});\r\n\r\nLogo.propTypes = {\r\n /** Class name prop for logo container. */\r\n className: _propTypes2.default.string,\r\n /** Prop used to add additional styling to the component. */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * The component used for the root node.\r\n * Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /** HTML ID attribute for uniqueness. */\r\n id: _propTypes2.default.string,\r\n /** Set the color style of the logo. */\r\n logo: _propTypes2.default.oneOf(['preferred', 'alternative']),\r\n /**\r\n * @ignore\r\n */\r\n edsContext: _propTypes2.default.object\r\n};\r\n\r\nLogo.displayName = 'Logo';\r\n\r\nLogo.defaultProps = {\r\n logo: 'preferred',\r\n component: 'div'\r\n};\r\n\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _styles2.default)(styles)(Logo));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _Dialog = require('./Dialog');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_Dialog).default;\r\n }\r\n});\r\n\r\nvar _DialogActions = require('./DialogActions');\r\n\r\nObject.defineProperty(exports, 'DialogActions', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_DialogActions).default;\r\n }\r\n});\r\n\r\nvar _DialogContent = require('./DialogContent');\r\n\r\nObject.defineProperty(exports, 'DialogContent', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_DialogContent).default;\r\n }\r\n});\r\n\r\nvar _DialogContentText = require('./DialogContentText');\r\n\r\nObject.defineProperty(exports, 'DialogContentText', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_DialogContentText).default;\r\n }\r\n});\r\n\r\nvar _DialogTitle = require('./DialogTitle');\r\n\r\nObject.defineProperty(exports, 'DialogTitle', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_DialogTitle).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"]) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError(\"Invalid attempt to destructure non-iterable instance\"); } }; }();\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Dialog = require('@material-ui/core/Dialog');\r\n\r\nvar _Dialog2 = _interopRequireDefault(_Dialog);\r\n\r\nvar _lib = require('@eui/ds-icons/lib');\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _EDSContext = require('../EDSContext/EDSContext');\r\n\r\nvar _useEnforceFocusFlag3 = require('./internal/useEnforceFocusFlag');\r\n\r\nvar _useEnforceFocusFlag4 = _interopRequireDefault(_useEnforceFocusFlag3);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nvar styles = function styles(theme) {\r\n var _paper, _internalDialog;\r\n\r\n return {\r\n\r\n // Styles applied to the root element.\r\n root: {\r\n '&.fullScreen': {\r\n padding: 0,\r\n '& .dialog-close-button': {\r\n top: _tokens.spacingXSmall,\r\n right: _tokens.spacingXSmall\r\n }\r\n }\r\n },\r\n\r\n // Styles applied to the Paper component.\r\n paper: (_paper = {\r\n borderRadius: _tokens.borderRadiusMedium,\r\n minHeight: '12.5rem',\r\n padding: _tokens.spacingSmall,\r\n width: '21rem'\r\n }, _defineProperty(_paper, '@media ' + _tokens.mqSmall, {\r\n padding: _tokens.spacingLarge,\r\n width: '37.5rem'\r\n }), _defineProperty(_paper, '@media ' + _tokens.mqMedium, {\r\n padding: _tokens.spacingLarge,\r\n width: '39.625rem'\r\n }), _defineProperty(_paper, '@media ' + _tokens.mqLarge, {\r\n padding: _tokens.spacingLarge,\r\n width: '53rem'\r\n }), _paper),\r\n\r\n // Styles applied to the Paper component if fullWidth=true.\r\n paperFullWidth: {\r\n width: _tokens.widthFluid + ' !important'\r\n },\r\n\r\n dialogXButton: {\r\n background: 'none',\r\n border: 'none',\r\n width: _tokens.sizingXxLarge,\r\n height: _tokens.sizingXxLarge,\r\n position: 'absolute',\r\n top: _tokens.spacingSmall,\r\n right: _tokens.spacingSmall,\r\n textAlign: 'center',\r\n '&:active': {\r\n color: theme.palette.ctaColor.active\r\n },\r\n '&:hover': {\r\n color: theme.palette.ctaColor.hover\r\n },\r\n '&:active:hover': {\r\n color: theme.palette.ctaColor.active\r\n }\r\n },\r\n paperFullScreen: {\r\n // TODO: Find a better way to increase the opacity.\r\n // internalDialog classes are overriding this class for now,\r\n // hence !important.\r\n width: _tokens.widthFluid + ' !important',\r\n borderRadius: _tokens.borderRadiusReset + ' !important'\r\n },\r\n\r\n internalDialog: (_internalDialog = {\r\n padding: '1.25rem',\r\n borderRadius: _tokens.sizingXSmall,\r\n position: 'relative',\r\n minHeight: '12.5rem',\r\n width: '21.5rem'\r\n }, _defineProperty(_internalDialog, '@media ' + _tokens.mqSmall, {\r\n width: '37.5rem'\r\n }), _defineProperty(_internalDialog, '@media ' + _tokens.mqMedium, {\r\n width: '39.625rem'\r\n }), _defineProperty(_internalDialog, '@media ' + _tokens.mqLarge, {\r\n width: '53rem'\r\n }), _internalDialog)\r\n };\r\n};\r\n\r\nvar paperClassName = 'eds-dialog-paper';\r\n\r\n/**\r\n * Use `Dialog` to display information without losing the context of the page.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.10\r\n * @examples\r\n * DialogA11y\r\n */\r\nvar Dialog = _react2.default.forwardRef(function (props, ref) {\r\n var _useEnforceFocusFlag = (0, _useEnforceFocusFlag4.default)(),\r\n _useEnforceFocusFlag2 = _slicedToArray(_useEnforceFocusFlag, 3),\r\n disableEnforceFocusFlag = _useEnforceFocusFlag2[0],\r\n onFocus = _useEnforceFocusFlag2[1],\r\n onBlur = _useEnforceFocusFlag2[2];\r\n\r\n var children = props.children,\r\n classesProp = props.classes,\r\n onClose = props.onClose,\r\n showTitleBarClose = props.showTitleBarClose,\r\n PaperPropsProp = props.PaperProps,\r\n edsContext = props.edsContext,\r\n open = props.open,\r\n fullScreen = props.fullScreen,\r\n rest = _objectWithoutProperties(props, ['children', 'classes', 'onClose', 'showTitleBarClose', 'PaperProps', 'edsContext', 'open', 'fullScreen']);\r\n\r\n var classes = {\r\n root: classesProp.root,\r\n paper: classesProp.paper,\r\n paperWidthXs: classesProp.paperWidthXs,\r\n paperWidthSm: classesProp.paperWidthSm,\r\n paperWidthMd: classesProp.paperWidthMd,\r\n paperFullWidth: classesProp.paperFullWidth,\r\n paperFullScreen: classesProp.paperFullScreen\r\n };\r\n\r\n // local overrides to the dialog's internal paper\r\n var internalPaperProps = {\r\n classes: {\r\n root: classesProp.internalDialog\r\n },\r\n className: paperClassName\r\n };\r\n\r\n // incorporate consumer's paper overrides as well (if any)\r\n var PaperProps2 = Object.assign(internalPaperProps, PaperPropsProp);\r\n\r\n // style the close 'x' in the title\r\n var buttonClasses = (0, _classnames2.default)(undefined !== props.className ? props.className : '', 'dialog-close-button', classesProp.dialogXButton);\r\n\r\n var onFocusCallback = function onFocusCallback(e) {\r\n var propsOnFocus = props.onFocus;\r\n\r\n onFocus(e);\r\n propsOnFocus && propsOnFocus(e);\r\n };\r\n\r\n var onBlurCallback = function onBlurCallback(e) {\r\n var propsOnBlur = props.onFocus;\r\n\r\n onBlur(e);\r\n propsOnBlur && propsOnBlur(e);\r\n };\r\n\r\n return _react2.default.createElement(\r\n _Dialog2.default,\r\n Object.assign({\r\n classes: classes,\r\n disableBackdropClick: true,\r\n disableEscapeKeyDown: true,\r\n PaperProps: PaperProps2,\r\n onClose: onClose,\r\n className: 'eds-dialog',\r\n open: open,\r\n fullScreen: fullScreen,\r\n onFocus: onFocusCallback,\r\n onBlur: onBlurCallback\r\n }, rest, {\r\n ref: ref,\r\n disableEnforceFocus: disableEnforceFocusFlag\r\n }),\r\n showTitleBarClose && _react2.default.createElement(\r\n 'button',\r\n {\r\n 'aria-label': edsContext.formatMessage('component.Dialog.close'),\r\n title: edsContext.formatMessage('component.Dialog.close'),\r\n className: buttonClasses,\r\n onClick: onClose },\r\n _react2.default.createElement(_lib.Icon, { name: 'close', large: true })\r\n ),\r\n children\r\n );\r\n});\r\n\r\nDialog.muiName = 'Dialog';\r\nDialog.displayName = 'Dialog';\r\n\r\nDialog.propTypes = {\r\n /**\r\n * @ignore\r\n */\r\n BackdropProps: _propTypes2.default.object,\r\n /**\r\n * Dialog children, usually the included sub-components.\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * If `true`, clicking the backdrop will not fire the `onClose` callback.\r\n */\r\n disableBackdropClick: _propTypes2.default.bool,\r\n /**\r\n * If `true`, hitting escape will not fire the `onClose` callback.\r\n */\r\n disableEscapeKeyDown: _propTypes2.default.bool,\r\n /**\r\n * If `true`, the dialog will be full-screen\r\n */\r\n fullScreen: _propTypes2.default.bool,\r\n /**\r\n * If `true`, the dialog stretches to `maxWidth`.\r\n */\r\n fullWidth: _propTypes2.default.bool,\r\n /**\r\n * @ignore\r\n */\r\n edsContext: _propTypes2.default.object,\r\n /**\r\n * Determine the max width of the dialog.\r\n *\r\n * The dialog width grows with the size of the screen, this property is useful\r\n * on the desktop where you might need some different widths across your\r\n * application.\r\n *\r\n * Valid values:\r\n *\r\n * * `xs`\r\n * * `sm`\r\n * * `md`\r\n * * `lg`\r\n * * `false` (disables max width)\r\n */\r\n maxWidth: _propTypes2.default.oneOf(['xs', 'sm', 'md', 'lg', false]),\r\n /**\r\n * Callback fired when the backdrop is clicked.\r\n */\r\n onBackdropClick: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the component requests to be closed.\r\n *\r\n * @param {object} event The event source of the callback\r\n */\r\n onClose: _propTypes2.default.func,\r\n /**\r\n * Callback fired before the dialog enters.\r\n */\r\n onEnter: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the dialog has entered.\r\n */\r\n onEntered: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the dialog is entering.\r\n */\r\n onEntering: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the escape key is pressed,\r\n * `disableKeyboard` is false and the modal is in focus.\r\n */\r\n onEscapeKeyDown: _propTypes2.default.func,\r\n /**\r\n * Callback fired before the dialog exits.\r\n */\r\n onExit: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the dialog has exited.\r\n */\r\n onExited: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the dialog is exiting.\r\n */\r\n onExiting: _propTypes2.default.func,\r\n /**\r\n * If `true`, the Dialog is open.\r\n */\r\n open: _propTypes2.default.bool.isRequired,\r\n /**\r\n * Properties applied to the dialog's internal Paper element.\r\n */\r\n PaperProps: _propTypes2.default.object,\r\n /**\r\n * Determine the container for scrolling the dialog.\r\n */\r\n scroll: _propTypes2.default.oneOf(['body', 'paper']),\r\n /**\r\n * Whether to show a close 'x' in the title bar. Clicking this invokes the\r\n * `onClose` handler.\r\n */\r\n showTitleBarClose: _propTypes2.default.bool,\r\n /**\r\n * Transition component.\r\n */\r\n TransitionComponent: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * The duration for the transition, in milliseconds.\r\n * You may specify a single timeout for all transitions, or individually with an object.\r\n */\r\n transitionDuration: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.shape({ enter: _propTypes2.default.number, exit: _propTypes2.default.number })]),\r\n /**\r\n * Properties applied to the `Transition` element.\r\n */\r\n TransitionProps: _propTypes2.default.object\r\n};\r\n\r\nDialog.defaultProps = {\r\n disableBackdropClick: false,\r\n disableEscapeKeyDown: false,\r\n fullScreen: false,\r\n fullWidth: false,\r\n maxWidth: 'sm',\r\n scroll: 'paper',\r\n showTitleBarClose: true\r\n};\r\n\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _styles2.default)(styles)(Dialog));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"]) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError(\"Invalid attempt to destructure non-iterable instance\"); } }; }();\r\n\r\nvar _react = require('react');\r\n\r\n/**\r\n * This is a custom hook to determine if the dialog consists of a `Datepicker` component.\r\n * If so the `enforceFocusFlag` is set to `true` momentarily to allow the control to go out of a `Dialog`.\r\n * TODO: This is a dirty hack and get rid of this code once we switch the date picker with some other lib.\r\n */\r\nfunction useEnforceFocusFlag() {\r\n var _useState = (0, _react.useState)(false),\r\n _useState2 = _slicedToArray(_useState, 2),\r\n disableEnforceFocusFlag = _useState2[0],\r\n setEnforceFocusFlag = _useState2[1];\r\n\r\n var onFocus = function onFocus(e) {\r\n if (e.target.querySelector('.DateInput_input')) {\r\n setEnforceFocusFlag(true);\r\n }\r\n };\r\n\r\n var onBlur = function onBlur(e) {\r\n if (e.target.getAttribute && e.target.getAttribute('tabindex') === '0') {\r\n setEnforceFocusFlag(false);\r\n }\r\n };\r\n\r\n return [disableEnforceFocusFlag, onFocus, onBlur];\r\n}\r\n\r\nexports.default = useEnforceFocusFlag;","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _DialogActions = require('@material-ui/core/DialogActions');\r\n\r\nvar _DialogActions2 = _interopRequireDefault(_DialogActions);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: _defineProperty({\r\n display: 'flex',\r\n flexDirection: 'column-reverse',\r\n margin: 0,\r\n padding: 0\r\n }, theme.breakpoints.up('sm'), {\r\n justifyContent: 'flex-end',\r\n flexDirection: 'row'\r\n }),\r\n\r\n spacing: {\r\n '& > button ': _defineProperty({\r\n margin: _tokens.spacingXSmall + ' 0',\r\n width: '100%'\r\n\r\n }, theme.breakpoints.up('sm'), {\r\n margin: '0 ' + _tokens.spacingXSmall,\r\n width: 'auto'\r\n })\r\n }\r\n\r\n };\r\n};\r\n\r\n/**\r\n * DialogActions are controls that live within a Dialog.\r\n */\r\nvar DialogActions = _react2.default.forwardRef(function (props, ref) {\r\n var children = props.children,\r\n classesProp = props.classes,\r\n rest = _objectWithoutProperties(props, ['children', 'classes']);\r\n\r\n var classes = {\r\n root: classesProp.root,\r\n spacing: classesProp.spacing\r\n };\r\n\r\n return _react2.default.createElement(\r\n _DialogActions2.default,\r\n Object.assign({ classes: classes }, rest, { ref: ref }),\r\n children\r\n );\r\n});\r\n\r\nDialogActions.muiName = 'DialogActions';\r\nDialogActions.displayName = 'DialogActions';\r\n\r\nDialogActions.propTypes = {\r\n /**\r\n * The content of the component.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * If `true`, the dialog actions do not have additional margin.\r\n */\r\n disableSpacing: _propTypes2.default.bool\r\n};\r\n\r\nDialogActions.defaultProps = {\r\n disableSpacing: false\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles, { index: 0 })(DialogActions);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _DialogContent = require('@material-ui/core/DialogContent');\r\n\r\nvar _DialogContent2 = _interopRequireDefault(_DialogContent);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n padding: '0 ' + _tokens.spacingMedium + ' ' + _tokens.spacingMedium\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * DialogContent is the main content that lives within a Dialog.\r\n */\r\nvar DialogContent = _react2.default.forwardRef(function (props, ref) {\r\n var children = props.children,\r\n classesProp = props.classes,\r\n rest = _objectWithoutProperties(props, ['children', 'classes']);\r\n\r\n var classes = {\r\n root: classesProp.root\r\n };\r\n\r\n return _react2.default.createElement(\r\n _DialogContent2.default,\r\n Object.assign({ classes: classes }, rest, { ref: ref }),\r\n children\r\n );\r\n});\r\n\r\nDialogContent.muiName = 'DialogContent';\r\nDialogContent.displayName = 'DialogContent';\r\n\r\nDialogContent.propTypes = {\r\n /**\r\n * The content of the component.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(DialogContent);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _DialogContentText = require('@material-ui/core/DialogContentText');\r\n\r\nvar _DialogContentText2 = _interopRequireDefault(_DialogContentText);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: _defineProperty({\r\n fontFamily: theme.typography.fontFamily,\r\n fontSize: theme.typography.body2.fontSize,\r\n fontWeight: theme.typography.fontWeight,\r\n lineHeight: theme.typography.body2.lineHeight,\r\n marginBottom: _tokens.spacingSmall\r\n }, theme.breakpoints.up('sm'), {\r\n marginBottom: _tokens.spacingSmall\r\n })\r\n };\r\n};\r\n\r\n/**\r\n * DialogContentText is the text of the main content within a Dialog.\r\n */\r\nvar DialogContentText = _react2.default.forwardRef(function (props, ref) {\r\n var children = props.children,\r\n classesProp = props.classes,\r\n rest = _objectWithoutProperties(props, ['children', 'classes']);\r\n\r\n var classes = {\r\n root: classesProp.root\r\n };\r\n\r\n return _react2.default.createElement(\r\n _DialogContentText2.default,\r\n Object.assign({ classes: classes }, rest, { ref: ref }),\r\n children\r\n );\r\n});\r\n\r\nDialogContentText.muiName = 'DialogContentText';\r\nDialogContentText.displayName = 'DialogContentText';\r\n\r\nDialogContentText.propTypes = {\r\n /**\r\n * The content of the component.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(DialogContentText);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _ = require('../');\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _DialogTitle = require('@material-ui/core/DialogTitle');\r\n\r\nvar _DialogTitle2 = _interopRequireDefault(_DialogTitle);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n fontFamily: theme.typography.fontFamily,\r\n fontSize: theme.typography.h2.fontSize,\r\n fontWeight: theme.typography.fontWeight,\r\n lineHeight: theme.typography.h2.lineHeight,\r\n margin: 0,\r\n padding: _tokens.spacingXSmall2 + ' ' + _tokens.spacingXSmall2 + ' ' + _tokens.spacingSmall + ' ' + _tokens.spacingXSmall2\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * DialogTitle is the title within a Dialog.\r\n */\r\nvar DialogTitle = _react2.default.forwardRef(function (props, ref) {\r\n var children = props.children,\r\n disableTypography = props.disableTypography,\r\n classesProp = props.classes,\r\n rest = _objectWithoutProperties(props, ['children', 'disableTypography', 'classes']);\r\n\r\n var classes = {\r\n root: classesProp.root\r\n };\r\n\r\n // use our own typography element (if the user hasn't disabled typography for titles),\r\n // so that we can control the variant\r\n var titleContents = disableTypography ? children : _react2.default.createElement(\r\n _.Typography,\r\n { variant: 'h2' },\r\n children\r\n );\r\n\r\n return _react2.default.createElement(\r\n _DialogTitle2.default,\r\n Object.assign({ disableTypography: true, classes: classes }, rest, { ref: ref }),\r\n titleContents\r\n );\r\n});\r\n\r\nDialogTitle.muiName = 'DialogTitle';\r\nDialogTitle.displayName = 'DialogTitle';\r\n\r\nDialogTitle.propTypes = {\r\n /**\r\n * The content of the component.\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * If `true`, the children won't be wrapped by a typography component.\r\n * For instance, this can be useful to render an h4 instead of the default h2.\r\n */\r\n disableTypography: _propTypes2.default.bool\r\n};\r\n\r\nDialogTitle.defaultProps = {\r\n disableTypography: false\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(DialogTitle);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _ActionMenu = require('./ActionMenu');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_ActionMenu).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\nexports.styles = undefined;\r\n\r\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _v = require('uuid/v4');\r\n\r\nvar _v2 = _interopRequireDefault(_v);\r\n\r\nvar _reactPopper = require('react-popper');\r\n\r\nvar _debounce = require('lodash/debounce');\r\n\r\nvar _debounce2 = _interopRequireDefault(_debounce);\r\n\r\nvar _ClickAwayListener = require('@material-ui/core/ClickAwayListener');\r\n\r\nvar _ClickAwayListener2 = _interopRequireDefault(_ClickAwayListener);\r\n\r\nvar _Grow = require('@material-ui/core/Grow');\r\n\r\nvar _Grow2 = _interopRequireDefault(_Grow);\r\n\r\nvar _Paper = require('@material-ui/core/Paper');\r\n\r\nvar _Paper2 = _interopRequireDefault(_Paper);\r\n\r\nvar _MenuItem = require('@material-ui/core/MenuItem');\r\n\r\nvar _MenuItem2 = _interopRequireDefault(_MenuItem);\r\n\r\nvar _MenuList = require('@material-ui/core/MenuList');\r\n\r\nvar _MenuList2 = _interopRequireDefault(_MenuList);\r\n\r\nvar _EDSContext = require('../EDSContext/EDSContext');\r\n\r\nvar _IconButton = require('../IconButton/IconButton');\r\n\r\nvar _IconButton2 = _interopRequireDefault(_IconButton);\r\n\r\nvar _MoreVertical = require('@eui/ds-icons/lib/MoreVertical');\r\n\r\nvar _MoreVertical2 = _interopRequireDefault(_MoreVertical);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\r\n\r\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\r\n\r\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\r\n\r\nvar styles = exports.styles = function styles(theme) {\r\n return {\r\n root: {\r\n display: 'inline-block',\r\n '& .paper': {\r\n boxShadow: 'none'\r\n }\r\n },\r\n iconButton: {\r\n borderRadius: _tokens.borderRadiusSmall,\r\n fontSize: '1.2rem',\r\n '&:focus': {\r\n boxShadow: '0 0 0 ' + _tokens.borderWidthThick + ' ' + theme.palette.focus\r\n },\r\n '&.color': {\r\n color: theme.palette.grey[500]\r\n },\r\n '&.color:hover': {\r\n background: 'none',\r\n color: theme.palette.ctaColor.base\r\n },\r\n '&.color:active': {\r\n background: 'none',\r\n color: theme.palette.ctaColor.base\r\n },\r\n '&.actionMenuOpen': {\r\n color: theme.palette.ctaColor.base\r\n },\r\n '&.actionMenuOpen:after': {\r\n position: 'absolute',\r\n width: '0.625rem',\r\n height: '0.625rem',\r\n top: 'auto',\r\n bottom: '-0.3rem',\r\n left: '1.05rem',\r\n content: '\"\"',\r\n background: 'linear-gradient(-45deg, white 0%, white 54%, rgba(255,255,255,0) 75%, rgba(255,255,255,0) 100%)',\r\n borderRight: _tokens.borderWidthThin + ' solid ' + theme.palette.grey[400],\r\n borderBottom: _tokens.borderWidthThin + ' solid ' + theme.palette.grey[400],\r\n transform: 'rotate(-135deg)',\r\n borderBottomRightRadius: _tokens.borderRadiusXSmall,\r\n zIndex: theme.zIndex.actionMenu + 1\r\n },\r\n '&.actionMenuOpen.topPlacement:after': {\r\n bottom: 'auto',\r\n top: '-0.3rem',\r\n transform: 'rotate(45deg)'\r\n }\r\n },\r\n popperClose: {\r\n pointerEvents: 'none'\r\n },\r\n popperOpen: {\r\n zIndex: theme.zIndex.actionMenu\r\n },\r\n menuList: {\r\n maxWidth: '18.750rem',\r\n borderRadius: '' + _tokens.borderRadiusXSmall,\r\n border: _tokens.borderWidthThin + ' solid ' + theme.palette.grey[400],\r\n boxShadow: 'none'\r\n },\r\n menuListItem: {\r\n // Since menu list item is pulling from MUI, have to override to match recommended list\r\n fontFamily: theme.typography.fontFamily,\r\n fontSize: theme.typography.fontSize,\r\n fontWeight: theme.typography.fontWeightNormal,\r\n lineHeight: _tokens.lineHeightParagraphMedium,\r\n textOverflow: 'ellipsis',\r\n '&.padding': {\r\n padding: _tokens.spacingSmall + ' 1.25rem',\r\n display: 'block'\r\n },\r\n '&:hover': {\r\n color: '' + theme.palette.grey[600],\r\n backgroundColor: theme.palette.grey[250]\r\n },\r\n '&:focus': {\r\n color: '' + theme.palette.grey[100],\r\n backgroundColor: theme.palette.action.hover\r\n },\r\n '&:active': {\r\n backgroundColor: theme.palette.ctaColor.base\r\n }\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * Use `ActionMenu` to give users access to additional actions related to a field.\r\n * @done true\r\n * @updated true\r\n * @versionAdded v0.0.8\r\n * @examples\r\n * BasicActionMenuExamples\r\n * PlacementActionMenuExamples\r\n */\r\n\r\nvar ActionMenu = function (_React$Component) {\r\n _inherits(ActionMenu, _React$Component);\r\n\r\n function ActionMenu(props) {\r\n _classCallCheck(this, ActionMenu);\r\n\r\n var _this = _possibleConstructorReturn(this, (ActionMenu.__proto__ || Object.getPrototypeOf(ActionMenu)).call(this, props));\r\n\r\n _this.handleToggle = function () {\r\n _this.setState({ open: !_this.state.open }, function () {\r\n if (_this.state.open) {\r\n _this.registerEvents();\r\n } else {\r\n _this.removeEvents();\r\n }\r\n\r\n // Queue it for execution from event queue as there is some timing issue.\r\n // TODO: Revisit this code later\r\n setTimeout(function () {\r\n return _this.setInverted();\r\n });\r\n });\r\n };\r\n\r\n _this.handleClose = function (event, item) {\r\n if (_this.target.contains(event.target)) {\r\n return;\r\n }\r\n\r\n if (item) {\r\n item.callback(item);\r\n }\r\n\r\n _this.removeEvents();\r\n _this.setState({ open: false });\r\n };\r\n\r\n _this.popperRef = _react2.default.createRef();\r\n _this.findMenuPlacement = (0, _debounce2.default)(_this.findMenuPlacement.bind(_this), 0);\r\n _this.placements = ['top-start', 'top-end'];\r\n\r\n _this.state = {\r\n open: props.initialOpenOverride, // action menu is closed by default, unless an override is passed in\r\n invertedMenu: false\r\n };\r\n return _this;\r\n }\r\n\r\n _createClass(ActionMenu, [{\r\n key: 'registerEvents',\r\n value: function registerEvents() {\r\n window.addEventListener('resize', this.findMenuPlacement);\r\n window.addEventListener('scroll', this.findMenuPlacement, true);\r\n }\r\n }, {\r\n key: 'removeEvents',\r\n value: function removeEvents() {\r\n window.removeEventListener('resize', this.findMenuPlacement);\r\n window.removeEventListener('scroll', this.findMenuPlacement, true);\r\n }\r\n }, {\r\n key: 'componentWillUnmount',\r\n value: function componentWillUnmount() {\r\n // Making sure to remove listeners\r\n this.removeEvents();\r\n }\r\n }, {\r\n key: 'findMenuPlacement',\r\n value: function findMenuPlacement() {\r\n if (this.state.open) {\r\n this.setInverted();\r\n }\r\n }\r\n }, {\r\n key: 'setInverted',\r\n value: function setInverted() {\r\n var placement = this.popperRef.current.state.data.placement;\r\n\r\n this.setState({\r\n invertedMenu: this.placements.indexOf(placement) !== -1\r\n });\r\n }\r\n }, {\r\n key: 'render',\r\n value: function render() {\r\n var _this2 = this,\r\n _classNames2;\r\n\r\n var _props = this.props,\r\n classes = _props.classes,\r\n actions = _props.actions,\r\n placement = _props.placement,\r\n menuId = _props.menuId,\r\n edsContext = _props.edsContext;\r\n var _state = this.state,\r\n open = _state.open,\r\n invertedMenu = _state.invertedMenu;\r\n // const classOverrides = {\r\n // root:\r\n // selelcted: classes.selected\r\n // }\r\n\r\n var menuItems = actions.map(function (item, index) {\r\n return _react2.default.createElement(\r\n _MenuItem2.default,\r\n {\r\n onClick: function onClick(e) {\r\n return _this2.handleClose(e, item);\r\n },\r\n key: (0, _v2.default)(),\r\n tabIndex: index === 0 ? 0 : -1,\r\n className: classes.menuListItem + ' padding' // Not sure if this is the way to increase the Specificity of css\r\n },\r\n item.label\r\n );\r\n });\r\n\r\n return _react2.default.createElement(\r\n 'div',\r\n { className: classes.root },\r\n _react2.default.createElement(\r\n _reactPopper.Manager,\r\n null,\r\n _react2.default.createElement(\r\n _reactPopper.Target,\r\n { className: 'menuTarget' },\r\n _react2.default.createElement(\r\n 'div',\r\n {\r\n ref: function ref(node) {\r\n _this2.target = node;\r\n },\r\n className: 'menuTargetInner'\r\n },\r\n _react2.default.createElement(\r\n _IconButton2.default,\r\n {\r\n disableRipple: true,\r\n title: edsContext.formatMessage('component.ActionMenu.more'),\r\n 'aria-label': edsContext.formatMessage('component.ActionMenu.more'),\r\n 'aria-expanded': open,\r\n 'aria-haspopup': 'true',\r\n 'aria-controls': menuId,\r\n onClick: this.handleToggle,\r\n color: 'gray',\r\n className: (0, _classnames2.default)(_defineProperty({}, classes.iconButton + ' color', true), { 'actionMenuOpen': open }, { 'topPlacement': invertedMenu }),\r\n tabIndex: 0\r\n },\r\n _react2.default.createElement(_MoreVertical2.default, null)\r\n )\r\n )\r\n ),\r\n _react2.default.createElement(\r\n _reactPopper.Popper,\r\n {\r\n ref: this.popperRef,\r\n placement: placement,\r\n eventsEnabled: open,\r\n className: (0, _classnames2.default)('eds-actionmenu-popper', (_classNames2 = {}, _defineProperty(_classNames2, classes.popperClose, !open), _defineProperty(_classNames2, classes.popperOpen, open), _classNames2))\r\n },\r\n _react2.default.createElement(\r\n _ClickAwayListener2.default,\r\n { onClickAway: this.handleClose },\r\n _react2.default.createElement(\r\n _Grow2.default,\r\n { 'in': open, className: 'eds-action-menu', style: { transformOrigin: '0 0 0' } },\r\n _react2.default.createElement(\r\n _Paper2.default,\r\n { className: classes.root + ' paper' },\r\n _react2.default.createElement(\r\n _MenuList2.default,\r\n { id: menuId, role: 'menu', className: classes.menuList },\r\n menuItems\r\n )\r\n )\r\n )\r\n )\r\n )\r\n )\r\n );\r\n }\r\n }]);\r\n\r\n return ActionMenu;\r\n}(_react2.default.Component);\r\n\r\nActionMenu.propTypes = {\r\n /**\r\n * Classes used to extend original style object.\r\n */\r\n classes: _propTypes2.default.object,\r\n\r\n /**\r\n * Actions and label for the actions to be taken from the `ActionMenu`.\r\n */\r\n actions: _propTypes2.default.arrayOf(_propTypes2.default.object).isRequired,\r\n /**\r\n * @ignore\r\n */\r\n edsContext: _propTypes2.default.object,\r\n\r\n /**\r\n * Menu HTML ID for uniqueness.\r\n */\r\n menuId: _propTypes2.default.string,\r\n\r\n /**\r\n * Placement is used to place the menu at start or end of the container or screen.\r\n * Values include `bottom-start` or `bottom-end`.\r\n */\r\n placement: _propTypes2.default.string,\r\n\r\n /**\r\n * @ignore\r\n *\r\n * Externally set the initial open state of the action menu. For testing purposes only.\r\n */\r\n initialOpenOverride: _propTypes2.default.bool\r\n\r\n};\r\n\r\nActionMenu.defaultProps = {\r\n placement: 'bottom-end',\r\n initialOpenOverride: false\r\n};\r\n\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _styles2.default)(styles)(ActionMenu));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _Switch = require('./Switch');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_Switch).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Switch = require('@material-ui/core/Switch');\r\n\r\nvar _Switch2 = _interopRequireDefault(_Switch);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\r\n\r\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\r\n\r\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n width: '3.75rem',\r\n height: '3rem',\r\n padding: '0.9375rem 0.5rem 0.75rem 0.75rem'\r\n },\r\n switchBase: {\r\n '&$checked': {\r\n color: theme.palette.grey[100],\r\n '& + $barBase': {\r\n opacity: 1,\r\n backgroundColor: theme.palette.ctaColor.base,\r\n border: 'none'\r\n },\r\n '& $iconBase': {\r\n boxShadow: 'none',\r\n border: 'none !important'\r\n },\r\n '&:hover': {\r\n backgroundColor: 'transparent'\r\n }\r\n },\r\n '&:hover': {\r\n backgroundColor: 'transparent'\r\n },\r\n top: '8px',\r\n left: '5px'\r\n },\r\n checked: {\r\n left: '58px !important',\r\n display: 'block'\r\n },\r\n barBase: {\r\n borderRadius: '0.75rem',\r\n width: _tokens.sizingXLarge,\r\n height: '1.25rem',\r\n backgroundColor: theme.palette.grey[100],\r\n opacity: 1,\r\n transition: 'none'\r\n },\r\n bar: {\r\n '& + $barBase': {\r\n border: _tokens.borderWidthThick + ' solid ' + theme.palette.grey[400]\r\n }\r\n },\r\n barFocused: {\r\n '& + $barBase': {\r\n border: _tokens.borderWidthThick + ' solid ' + theme.palette.grey[400],\r\n boxShadow: _tokens.boxShadowFocus\r\n },\r\n '&$checked': {\r\n '& + $barBase': {\r\n boxShadow: _tokens.boxShadowFocus\r\n }\r\n }\r\n },\r\n disabledOff: {\r\n '& + $barBase': {\r\n opacity: 1,\r\n backgroundColor: theme.palette.grey[300]\r\n },\r\n '&$switchBase': {\r\n color: theme.palette.grey[300], //disabled off circle\r\n boxShadow: 'none',\r\n '& + $barBase': {\r\n opacity: 1,\r\n backgroundColor: theme.palette.grey[300], //disabled off background\r\n border: _tokens.borderWidthThick + ' solid ' + theme.palette.grey[400] //disabled off border\r\n }\r\n }\r\n },\r\n disabledOn: {\r\n '& + $barBase': {\r\n opacity: 1,\r\n backgroundColor: theme.palette.grey[300]\r\n },\r\n '&$switchBase': {\r\n color: theme.palette.grey[300], //disabled on circle\r\n boxShadow: 'none',\r\n '& + $barBase': {\r\n opacity: 1,\r\n backgroundColor: theme.palette.grey[400], //disabled on background\r\n border: _tokens.borderWidthThick + ' solid ' + theme.palette.grey[400] //disabled on border\r\n }\r\n }\r\n },\r\n iconBase: {\r\n width: _tokens.sizingSmall,\r\n height: _tokens.sizingSmall\r\n },\r\n iconOn: {\r\n boxShadow: 'none',\r\n border: 'none !important'\r\n },\r\n iconOnDisabled: {\r\n boxShadow: 'none',\r\n border: 'none !important',\r\n color: theme.palette.grey[300]\r\n },\r\n iconOff: {\r\n color: theme.palette.grey[100],\r\n border: _tokens.borderWidthThin + ' solid ' + theme.palette.grey[400],\r\n boxShadow: 'none !important' //MUI applies a very stubborn box-shadow when a border is added\r\n },\r\n iconOffDisabled: {\r\n border: _tokens.borderWidthThin + ' solid ' + theme.palette.grey[400],\r\n boxShadow: 'none !important' //MUI applies a very stubborn box-shadow when a border is added\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * Use `Switch` to select one of two options, typically a \"yes/no\" or an \"on/off\" selection.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.8\r\n * @examples\r\n * SwitchExamples\r\n * ControlledExample\r\n * SwitchFormGroup\r\n * SwitchLabels\r\n */\r\n\r\nvar Switch = function (_React$Component) {\r\n _inherits(Switch, _React$Component);\r\n\r\n function Switch(props) {\r\n _classCallCheck(this, Switch);\r\n\r\n var _this = _possibleConstructorReturn(this, (Switch.__proto__ || Object.getPrototypeOf(Switch)).call(this, props));\r\n\r\n _this.state = {\r\n isFocused: false\r\n };\r\n _this.handleFocus = _this.handleFocus.bind(_this);\r\n _this.handleBlur = _this.handleBlur.bind(_this);\r\n return _this;\r\n }\r\n\r\n _createClass(Switch, [{\r\n key: 'handleFocus',\r\n value: function handleFocus(e) {\r\n if (this.props.onFocus) {\r\n this.props.onFocus(e);\r\n }\r\n this.setState(function (prevState) {\r\n return {\r\n isFocused: true\r\n };\r\n });\r\n }\r\n }, {\r\n key: 'handleBlur',\r\n value: function handleBlur(e) {\r\n if (this.props.onBlur) {\r\n this.props.onBlur(e);\r\n }\r\n this.setState(function (prevState) {\r\n return {\r\n isFocused: false\r\n };\r\n });\r\n }\r\n }, {\r\n key: 'render',\r\n value: function render() {\r\n var isFocused = this.state.isFocused;\r\n\r\n var _props = this.props,\r\n classes = _props.classes,\r\n checked = _props.checked,\r\n disabled = _props.disabled,\r\n rest = _objectWithoutProperties(_props, ['classes', 'checked', 'disabled']);\r\n\r\n var classOverrides = {\r\n switchBase: (0, _classnames2.default)(classes.switchBase, isFocused ? classes.barFocused : classes.bar),\r\n track: classes.barBase,\r\n root: classes.root,\r\n disabled: checked ? classes.disabledOn : classes.disabledOff,\r\n thumb: (0, _classnames2.default)(classes.iconBase, disabled ? classes.iconOffDisabled : classes.iconOff),\r\n checked: classes.checked\r\n };\r\n\r\n return _react2.default.createElement(_Switch2.default, Object.assign({\r\n onFocus: this.handleFocus,\r\n onBlur: this.handleBlur,\r\n color: 'secondary',\r\n disableRipple: true,\r\n classes: classOverrides,\r\n checked: checked,\r\n disabled: disabled\r\n }, rest));\r\n }\r\n }]);\r\n\r\n return Switch;\r\n}(_react2.default.Component);\r\n\r\nSwitch.muiName = 'Switch';\r\nSwitch.displayName = 'Switch';\r\n\r\nSwitch.propTypes = {\r\n /**\r\n * If `true`, the component is checked.\r\n */\r\n checked: _propTypes2.default.bool,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * If true, the switch will be disabled.\r\n */\r\n disabled: _propTypes2.default.bool,\r\n /**\r\n * The id of the input element.\r\n */\r\n id: _propTypes2.default.string,\r\n /**\r\n * Attributes applied to the input element.\r\n */\r\n inputProps: _propTypes2.default.object,\r\n /**\r\n * Use this property to pass a ref callback to the native input component.\r\n */\r\n inputRef: _propTypes2.default.oneOfType([_propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * Callback fired when the state is changed.\r\n */\r\n onChange: _propTypes2.default.func,\r\n /**\r\n * @ignore\r\n */\r\n onBlur: _propTypes2.default.func,\r\n /**\r\n * @ignore\r\n */\r\n onFocus: _propTypes2.default.func\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(Switch);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Divider = require('@material-ui/core/Divider');\r\n\r\nvar _Divider2 = _interopRequireDefault(_Divider);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n backgroundColor: theme.palette.grey[400],\r\n marginTop: _tokens.spacingSmall,\r\n marginBottom: _tokens.spacingSmall\r\n },\r\n middle: {\r\n marginLeft: _tokens.spacingSmall,\r\n marginRight: _tokens.spacingSmall\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * Use `Divider` to group and separate content within lists and page layouts.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.11\r\n * @examples\r\n * FullBleedDividerExample\r\n * MiddleDividerExample\r\n */\r\nvar Divider = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n variant = props.variant,\r\n rest = _objectWithoutProperties(props, ['classes', 'variant']);\r\n\r\n var classOverrides = {\r\n root: (0, _classnames2.default)(classes.root, _defineProperty({}, classes.middle, variant === 'middle'))\r\n };\r\n\r\n return _react2.default.createElement(_Divider2.default, Object.assign({}, rest, { classes: classOverrides, ref: ref }));\r\n});\r\n\r\nDivider.muiName = 'Divider';\r\nDivider.displayName = 'Divider';\r\n\r\nDivider.propTypes = {\r\n absolute: _propTypes2.default.bool,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * The component used for the root node.\r\n * Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * Specifies fullbleed or middle Divider styling. Default is fullbleed.\r\n */\r\n variant: _propTypes2.default.oneOf(['fullbleed', 'middle'])\r\n};\r\n\r\nDivider.defaultProps = {\r\n variant: 'fullbleed'\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(Divider);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _Snackbar = require('./Snackbar');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_Snackbar).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Snackbar = require('@material-ui/core/Snackbar');\r\n\r\nvar _Snackbar2 = _interopRequireDefault(_Snackbar);\r\n\r\nvar _useWidth = require('./../useWidth');\r\n\r\nvar _useWidth2 = _interopRequireDefault(_useWidth);\r\n\r\nvar _ = require('../');\r\n\r\nvar _CheckFeedback = require('@eui/ds-icons/lib/CheckFeedback');\r\n\r\nvar _CheckFeedback2 = _interopRequireDefault(_CheckFeedback);\r\n\r\nvar _Warning = require('@eui/ds-icons/lib/Warning');\r\n\r\nvar _Warning2 = _interopRequireDefault(_Warning);\r\n\r\nvar _Error = require('@eui/ds-icons/lib/Error');\r\n\r\nvar _Error2 = _interopRequireDefault(_Error);\r\n\r\nvar _Info = require('@eui/ds-icons/lib/Info');\r\n\r\nvar _Info2 = _interopRequireDefault(_Info);\r\n\r\nvar _EDSContext = require('../EDSContext/EDSContext');\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nvar commonStyles = {\r\n top: _tokens.sizingXxLarge1,\r\n margin: _tokens.spacingLarge\r\n};\r\n\r\nvar commonMobileStyles = {\r\n margin: _tokens.spacingSmall\r\n};\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n zIndex: _tokens.zIndexSnackbar\r\n },\r\n anchorOriginTopRight: Object.assign({}, commonStyles, _defineProperty({\r\n right: 0\r\n }, theme.breakpoints.between('xs', 'sm'), Object.assign({}, commonMobileStyles))),\r\n anchorOriginTopCenter: Object.assign({}, commonStyles, _defineProperty({}, theme.breakpoints.between('xs', 'sm'), Object.assign({}, commonMobileStyles))),\r\n anchorOriginTopLeft: Object.assign({}, commonStyles, _defineProperty({}, theme.breakpoints.between('xs', 'sm'), Object.assign({}, commonMobileStyles))),\r\n anchorOriginBottomCenter: _defineProperty({\r\n margin: _tokens.spacingLarge\r\n }, theme.breakpoints.between('xs', 'sm'), Object.assign({}, commonMobileStyles)),\r\n anchorOriginBottomLeft: _defineProperty({}, theme.breakpoints.between('xs', 'sm'), Object.assign({}, commonMobileStyles)),\r\n anchorOriginBottomRight: _defineProperty({}, theme.breakpoints.between('xs', 'sm'), Object.assign({}, commonMobileStyles)),\r\n contentPropsStyles: _defineProperty({\r\n minWidth: '21.5rem',\r\n backgroundColor: _tokens.colorBrandNeutral500,\r\n color: _tokens.colorTextNeutral100,\r\n fontSize: _tokens.fontSizeLarge\r\n }, theme.breakpoints.between('xs', 'sm'), {\r\n borderRadius: _tokens.borderRadiusMedium\r\n }),\r\n contentMessage: {\r\n marginRight: _tokens.spacingLarge,\r\n flex: 1\r\n },\r\n message: {\r\n width: _tokens.widthFluid\r\n },\r\n snackbarContent: {\r\n display: 'flex',\r\n alignItems: 'center'\r\n },\r\n undoAction: {\r\n '& a, a:hover': {\r\n color: _tokens.colorTextNeutral100,\r\n textDecoration: 'underline'\r\n }\r\n },\r\n customAction: {\r\n marginRight: _tokens.spacingXSmall\r\n },\r\n icon: {\r\n marginRight: _tokens.spacingXSmall,\r\n height: _tokens.sizingMedium,\r\n width: _tokens.sizingMedium,\r\n fill: _tokens.colorTextNeutral100\r\n }\r\n };\r\n};\r\n\r\nvar snackbarVariant = {\r\n success: _CheckFeedback2.default,\r\n warning: _Warning2.default,\r\n error: _Error2.default,\r\n info: _Info2.default\r\n};\r\n\r\nvar CustomMessage = _react2.default.forwardRef(function (props, ref) {\r\n var variant = props.variant,\r\n message = props.message,\r\n onUndoClick = props.onUndoClick,\r\n action = props.action,\r\n classes = props.classes,\r\n edsContext = props.edsContext;\r\n\r\n var SnackbarIcon = function SnackbarIcon() {\r\n return null;\r\n };\r\n var undoAction = null;\r\n\r\n if (variant) {\r\n SnackbarIcon = snackbarVariant[variant];\r\n }\r\n\r\n if (onUndoClick) {\r\n undoAction = _react2.default.createElement(\r\n _.Button,\r\n {\r\n variant: 'text',\r\n withDarkBackground: true,\r\n onClick: onUndoClick\r\n },\r\n edsContext.formatMessage('component.Snackbar.undo')\r\n );\r\n }\r\n\r\n return _react2.default.createElement(\r\n 'div',\r\n { className: classes.snackbarContent },\r\n _react2.default.createElement(SnackbarIcon, { className: classes.icon, ref: ref }),\r\n _react2.default.createElement(\r\n 'span',\r\n { className: classes.contentMessage },\r\n message\r\n ),\r\n action && _react2.default.createElement(\r\n 'span',\r\n { className: classes.customAction },\r\n action\r\n ),\r\n undoAction && _react2.default.createElement(\r\n 'span',\r\n { className: classes.undoAction },\r\n undoAction\r\n )\r\n );\r\n});\r\n\r\nCustomMessage.propTypes = {\r\n /**\r\n * The action to display.\r\n */\r\n action: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * The message to display.\r\n */\r\n message: _propTypes2.default.node,\r\n /**\r\n * Variants of the Snackbar. Choose from these ['success', 'error', 'warning', 'info'].\r\n */\r\n variant: _propTypes2.default.oneOf(['success', 'error', 'warning', 'info']),\r\n /**\r\n * Callback fired when the undo action is clicked.\r\n * If this callback is present Snackbar will add Undo button automatically\r\n */\r\n onUndoClick: _propTypes2.default.func,\r\n /**\r\n * @ignore\r\n */\r\n edsContext: _propTypes2.default.object\r\n};\r\n\r\nvar DEFAULT_DURATION = 5000;\r\nvar ACTIONABLE_DEFAULT_DURATION = 7000;\r\n\r\n/**\r\n * Use `Snackbar` to deliver low-urgency communication to the user.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.8\r\n * @examples\r\n * SnackbarExamples\r\n */\r\nvar Snackbar = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n ContentProps = props.ContentProps,\r\n action = props.action,\r\n onUndoClick = props.onUndoClick,\r\n anchorOrigin = props.anchorOrigin,\r\n bottom = props.bottom,\r\n edsContext = props.edsContext,\r\n autoHideDuration = props.autoHideDuration,\r\n rest = _objectWithoutProperties(props, ['classes', 'ContentProps', 'action', 'onUndoClick', 'anchorOrigin', 'bottom', 'edsContext', 'autoHideDuration']);\r\n\r\n var width = (0, _useWidth2.default)();\r\n var shouldAddMobileCustomStyles = function shouldAddMobileCustomStyles() {\r\n return (width === 'xs' || width === 'sm') && !anchorOrigin;\r\n };\r\n var getNewAutoHideDuration = function getNewAutoHideDuration() {\r\n var defatulDuration = onUndoClick || action ? ACTIONABLE_DEFAULT_DURATION : DEFAULT_DURATION;\r\n\r\n return autoHideDuration || defatulDuration;\r\n };\r\n\r\n var classOverrides = {\r\n root: classes.root,\r\n anchorOriginTopRight: classes.anchorOriginTopRight,\r\n anchorOriginTopCenter: classes.anchorOriginTopCenter,\r\n anchorOriginTopLeft: classes.anchorOriginTopLeft,\r\n anchorOriginBottomCenter: classes.anchorOriginBottomCenter,\r\n anchorOriginBottomRight: classes.anchorOriginBottomRight,\r\n anchorOriginBottomLeft: classes.anchorOriginBottomLeft\r\n };\r\n\r\n // This line will help screen read to read popper content.\r\n if (!ContentProps['aria-live']) {\r\n ContentProps['aria-live'] = 'assertive';\r\n }\r\n var contentProps = Object.assign({\r\n classes: {\r\n root: classes.contentPropsStyles,\r\n message: classes.message\r\n },\r\n style: shouldAddMobileCustomStyles() && bottom ? { marginBottom: bottom } : {}\r\n }, ContentProps);\r\n\r\n var propOverrides = {\r\n autoHideDuration: getNewAutoHideDuration(),\r\n // Custom actions need to be inserted in particular order which is done in `
`.\r\n action: null,\r\n anchorOrigin: anchorOrigin || { vertical: 'top', horizontal: 'right' }\r\n };\r\n\r\n if (shouldAddMobileCustomStyles()) {\r\n propOverrides.anchorOrigin = { vertical: 'bottom', horizontal: 'center' };\r\n }\r\n\r\n return _react2.default.createElement(_Snackbar2.default, Object.assign({}, rest, propOverrides, {\r\n classes: classOverrides,\r\n message: _react2.default.createElement(CustomMessage, Object.assign({ formatMessage: edsContext.formatMessage }, props, { ref: ref })),\r\n ContentProps: contentProps,\r\n ClickAwayListenerProps: {\r\n onClickAway: function onClickAway() {} // Prevent hiding on clickway\r\n },\r\n ref: ref\r\n }));\r\n});\r\n\r\nSnackbar.muiName = 'Snackbar';\r\nSnackbar.displayName = 'Snackbar';\r\n\r\nSnackbar.propTypes = {\r\n /**\r\n * The number of milliseconds to wait before `Snackbar` automatically closes.\r\n * Defaults to 5secs for nonactionable `Snackbar`s and 7secs for actionable `Snackbar`s.\r\n * This can be overridden by the users.\r\n */\r\n autoHideDuration: _propTypes2.default.number,\r\n /**\r\n * The custom action for Snackbar to display.\r\n * Undo action is built in to Snackbar but if you need more actions to perform, you can use `action` prop.\r\n */\r\n action: _propTypes2.default.node,\r\n /**\r\n * The anchor of the `Snackbar`. Defaults to top, right.\r\n */\r\n anchorOrigin: _propTypes2.default.shape({\r\n horizontal: _propTypes2.default.oneOf(['left', 'center', 'right']).isRequired,\r\n vertical: _propTypes2.default.oneOf(['top', 'bottom']).isRequired\r\n }),\r\n /**\r\n * If you wish the take control over the children of the component you can use this property.\r\n * When used, you replace the `SnackbarContent` component with the children.\r\n */\r\n children: _propTypes2.default.element,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * Properties applied to the `SnackbarContent` element.\r\n */\r\n ContentProps: _propTypes2.default.object,\r\n /**\r\n * If `true`, the `autoHideDuration` timer will expire even if the window is not focused.\r\n */\r\n disableWindowBlurListener: _propTypes2.default.bool,\r\n /**\r\n * When displaying multiple consecutive Snackbars from a parent rendering a single\r\n *
, add the key property to ensure independent treatment of each message.\r\n * e.g.
, otherwise, the message may update-in-place and\r\n * features such as autoHideDuration may be canceled.\r\n */\r\n key: _propTypes2.default.any,\r\n /**\r\n * The message to display.\r\n */\r\n message: _propTypes2.default.node,\r\n /**\r\n * Callback fired when the component requests to be closed.\r\n * Typically `onClose` is used to set state in the parent component,\r\n * which is used to control the `Snackbar` `open` prop.\r\n * The `reason` parameter can optionally be used to control the response to `onClose`,\r\n * for example ignoring `clickaway`.\r\n *\r\n * @param {object} event The event source of the callback\r\n * @param {string} reason Can be:`\"timeout\"` (`autoHideDuration` expired) or: `\"clickaway\"`\r\n */\r\n onClose: _propTypes2.default.func,\r\n /**\r\n * Callback fired before the transition is entering.\r\n */\r\n onEnter: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the transition has entered.\r\n */\r\n onEntered: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the transition is entering.\r\n */\r\n onEntering: _propTypes2.default.func,\r\n /**\r\n * Callback fired before the transition is exiting.\r\n */\r\n onExit: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the transition has exited.\r\n */\r\n onExited: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the transition is exiting.\r\n */\r\n onExiting: _propTypes2.default.func,\r\n /**\r\n * @ignore\r\n */\r\n onMouseEnter: _propTypes2.default.func,\r\n /**\r\n * @ignore\r\n */\r\n onMouseLeave: _propTypes2.default.func,\r\n /**\r\n * If true, `Snackbar` is open.\r\n */\r\n open: _propTypes2.default.bool,\r\n /**\r\n * The number of milliseconds to wait before dismissing after user interaction.\r\n * If `autoHideDuration` property isn't specified, it does nothing.\r\n * If `autoHideDuration` property is specified but `resumeHideDuration` isn't,\r\n * we default to `autoHideDuration / 2` ms.\r\n */\r\n resumeHideDuration: _propTypes2.default.number,\r\n /**\r\n * Transition component.\r\n */\r\n TransitionComponent: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * The duration for the transition, in milliseconds.\r\n * You may specify a single timeout for all transitions, or individually with an object.\r\n */\r\n transitionDuration: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.shape({ enter: _propTypes2.default.number, exit: _propTypes2.default.number })]),\r\n /**\r\n * Properties applied to the `Transition` element.\r\n */\r\n TransitionProps: _propTypes2.default.object,\r\n /**\r\n * Variants of the Snackbar. Choose from these ['success', 'error', 'warning', 'info'].\r\n */\r\n variant: _propTypes2.default.oneOf(['success', 'error', 'warning', 'info']),\r\n /**\r\n * Callback fired when the undo action is clicked.\r\n * If this callback is present Snackbar will add Undo button automatically\r\n */\r\n onUndoClick: _propTypes2.default.func,\r\n /**\r\n * @ignore\r\n * Width based on the viewport size like xs, sm, md etc\r\n */\r\n width: _propTypes2.default.string,\r\n /**\r\n * Set the bottom in case of CTA bottom actions on mobile or floating button desktop.\r\n * Use the CSS units like `rem` or `px`\r\n */\r\n bottom: _propTypes2.default.string,\r\n /**\r\n * @ignore\r\n */\r\n edsContext: _propTypes2.default.object\r\n};\r\n\r\nSnackbar.defaultProps = {\r\n ContentProps: {}\r\n};\r\n\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _styles2.default)(styles)(Snackbar));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _styles = require('@material-ui/core/styles');\r\n\r\nvar _useMediaQuery = require('../useMediaQuery');\r\n\r\nvar _useMediaQuery2 = _interopRequireDefault(_useMediaQuery);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }\r\n\r\n/**\r\n * Be careful using this hook. It only works because the number of\r\n * breakpoints in theme is static. It will break once you change the number of\r\n * breakpoints. See https://reactjs.org/docs/hooks-rules.html#only-call-hooks-at-the-top-level\r\n * https://material-ui.com/components/use-media-query/#migrating-from-withwidth\r\n */\r\n\r\n/**\r\n * This method returns the size of the viewport on which an app is running.\r\n * Return value would be one of 'xs', 'sm', 'md', 'lg', 'xl'.\r\n */\r\nvar useWidth = function useWidth() {\r\n var theme = (0, _styles.useTheme)();\r\n var keys = [].concat(_toConsumableArray(theme.breakpoints.keys)).reverse();\r\n\r\n return keys.reduce(function (output, key) {\r\n // eslint-disable-next-line react-hooks/rules-of-hooks\r\n var matches = (0, _useMediaQuery2.default)(theme.breakpoints.up(key));\r\n return !output && matches ? key : output;\r\n }, null) || 'xs';\r\n};\r\n\r\nexports.default = useWidth;","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _useMediaQuery = require('./useMediaQuery');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_useMediaQuery).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _useMediaQuery = require('@material-ui/core/useMediaQuery');\r\n\r\nvar _useMediaQuery2 = _interopRequireDefault(_useMediaQuery);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nexports.default = _useMediaQuery2.default;","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _ExpansionPanel = require('./ExpansionPanel');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_ExpansionPanel).default;\r\n }\r\n});\r\n\r\nvar _ExpansionPanelActions = require('./ExpansionPanelActions');\r\n\r\nObject.defineProperty(exports, 'ExpansionPanelActions', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_ExpansionPanelActions).default;\r\n }\r\n});\r\n\r\nvar _ExpansionPanelDetails = require('./ExpansionPanelDetails');\r\n\r\nObject.defineProperty(exports, 'ExpansionPanelDetails', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_ExpansionPanelDetails).default;\r\n }\r\n});\r\n\r\nvar _ExpansionPanelSummary = require('./ExpansionPanelSummary');\r\n\r\nObject.defineProperty(exports, 'ExpansionPanelSummary', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_ExpansionPanelSummary).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _ExpansionPanel = require('@material-ui/core/ExpansionPanel');\r\n\r\nvar _ExpansionPanel2 = _interopRequireDefault(_ExpansionPanel);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = {\r\n card: {\r\n boxShadow: '0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.21)'\r\n },\r\n default: {\r\n boxShadow: '0 19px 20px 0 rgba(0, 0, 0, 0.03), 0 3px 8px 0 rgba(0, 0, 0, 0.06)'\r\n }\r\n};\r\n\r\n/**\r\n * Use `ExpansionPanel` to organize content into expandable and collapsible sections.\r\n * @done true\r\n * @updated true\r\n * @versionAdded v0.0.13\r\n * @examples\r\n * ExpansionPanelSimple\r\n * ExpansionPanelCard\r\n * ExpansionPanelControlledAccordion\r\n * ExpansionPanelLeftIcon\r\n * ExpansionPanelSecondary\r\n */\r\nvar ExpansionPanel = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n variant = props.variant,\r\n rest = _objectWithoutProperties(props, ['classes', 'variant']);\r\n\r\n var classOverrides = {};\r\n classOverrides.root = variant === 'card' ? classes.card : classes.default;\r\n\r\n return _react2.default.createElement(_ExpansionPanel2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nExpansionPanel.muiName = 'ExpansionPanel';\r\nExpansionPanel.displayName = 'ExpansionPanel';\r\n\r\nExpansionPanel.propTypes = {\r\n /**\r\n * The content of the expansion panel.\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * Properties applied to the `Collapse` element.\r\n */\r\n CollapseProps: _propTypes2.default.object,\r\n /**\r\n * If `true`, expands the panel by default.\r\n */\r\n defaultExpanded: _propTypes2.default.bool,\r\n /**\r\n * If `true`, the panel will be displayed in a disabled state.\r\n */\r\n disabled: _propTypes2.default.bool,\r\n /**\r\n * If `true`, expands the panel, otherwise collapse it.\r\n * Setting this prop enables control over the panel.\r\n */\r\n expanded: _propTypes2.default.bool,\r\n /**\r\n * Callback fired when the expand/collapse state is changed.\r\n *\r\n * @param {object} event The event source of the callback\r\n * @param {boolean} expanded The `expanded` state of the panel\r\n */\r\n onChange: _propTypes2.default.func,\r\n /**\r\n * Styles the ExpansionPanel for the context it is on, either 'default' or 'card'.\r\n */\r\n variant: _propTypes2.default.oneOf(['default', 'card'])\r\n};\r\n\r\n// If default props are needed, they must be set here\r\nExpansionPanel.defaultProps = {\r\n variant: 'default',\r\n defaultExpanded: false,\r\n disabled: false\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(ExpansionPanel);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _ExpansionPanelActions = require('@material-ui/core/ExpansionPanelActions');\r\n\r\nvar _ExpansionPanelActions2 = _interopRequireDefault(_ExpansionPanelActions);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: {}\r\n};\r\n\r\n/**\r\n * A component that....\r\n */\r\nvar ExpansionPanelActions = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_ExpansionPanelActions2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nExpansionPanelActions.muiName = 'ExpansionPanelActions';\r\nExpansionPanelActions.displayName = 'ExpansionPanelActions';\r\n\r\nExpansionPanelActions.propTypes = {\r\n /**\r\n * The content of the component.\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string\r\n};\r\n\r\n// If default props are needed, they must be set here\r\n// ExpansionPanelActions.defaultProps = { };\r\n\r\nexports.default = (0, _styles2.default)(styles)(ExpansionPanelActions);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _ExpansionPanelDetails = require('@material-ui/core/ExpansionPanelDetails');\r\n\r\nvar _ExpansionPanelDetails2 = _interopRequireDefault(_ExpansionPanelDetails);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: {}\r\n};\r\n\r\n/**\r\n * A component that....\r\n */\r\nvar ExpansionPanelDetails = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_ExpansionPanelDetails2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nExpansionPanelDetails.muiName = 'ExpansionPanelDetails';\r\nExpansionPanelDetails.displayName = 'ExpansionPanelDetails';\r\n\r\nExpansionPanelDetails.propTypes = {\r\n /**\r\n * The content of the expansion panel details.\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string\r\n};\r\n\r\n// If default props are needed, they must be set here\r\n// ExpansionPanelDetails.defaultProps = { };\r\n\r\nexports.default = (0, _styles2.default)(styles)(ExpansionPanelDetails);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _ExpansionPanelSummary = require('@material-ui/core/ExpansionPanelSummary');\r\n\r\nvar _ExpansionPanelSummary2 = _interopRequireDefault(_ExpansionPanelSummary);\r\n\r\nvar _ChevronDown = require('@eui/ds-icons/lib/ChevronDown');\r\n\r\nvar _ChevronDown2 = _interopRequireDefault(_ChevronDown);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n color: _tokens.colorTextPrimary,\r\n outline: 'none',\r\n '&$focused': {\r\n backgroundColor: 'transparent'\r\n },\r\n '&$disabled': {\r\n opacity: 1\r\n }\r\n },\r\n disabled: {\r\n color: _tokens.colorBrandNeutral400,\r\n backgroundColor: _tokens.colorBrandNeutral100\r\n },\r\n focused: {\r\n boxShadow: _tokens.boxShadowFocusInset,\r\n outline: 'none'\r\n },\r\n iconButtonRoot: {\r\n fontSize: _tokens.fontSizeLarge,\r\n '&$disabled': {\r\n color: _tokens.colorBrandNeutral400\r\n }\r\n },\r\n iconLeftPosition: {\r\n top: '0.25rem',\r\n left: '0.5625rem',\r\n right: 'auto',\r\n position: 'absolute'\r\n },\r\n iconLeftPositionExpanded: {\r\n '& $iconLeftPosition': {\r\n top: '0.75rem'\r\n }\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * A component that....\r\n */\r\nvar ExpansionPanelSummary = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n leftIconDisplay = props.leftIconDisplay,\r\n expandIcon = props.expandIcon,\r\n expandIconProps = props.expandIconProps,\r\n rest = _objectWithoutProperties(props, ['classes', 'leftIconDisplay', 'expandIcon', 'expandIconProps']);\r\n\r\n var classOverrides = {\r\n root: classes.root,\r\n disabled: classes.disabled,\r\n focused: classes.focused\r\n };\r\n\r\n if (leftIconDisplay) {\r\n classOverrides.expandIcon = (0, _classnames2.default)(classOverrides.expandIcon, classes.iconLeftPosition, 'eds-expansion-panel-icon-left-position');\r\n classOverrides.expanded = classes.iconLeftPositionExpanded;\r\n }\r\n\r\n return _react2.default.createElement(_ExpansionPanelSummary2.default, Object.assign({\r\n expandIcon: expandIcon ? expandIcon : _react2.default.createElement(_ChevronDown2.default, Object.assign({ fill: props.disabled ? _tokens.colorBrandNeutral400 : _tokens.colorBrandNeutral500 }, expandIconProps)),\r\n IconButtonProps: { classes: { root: classes.iconButtonRoot } },\r\n classes: classOverrides,\r\n ref: ref\r\n }, rest));\r\n});\r\n\r\nExpansionPanelSummary.muiName = 'ExpansionPanelSummary';\r\nExpansionPanelSummary.displayName = 'ExpansionPanelSummary';\r\n\r\nExpansionPanelSummary.propTypes = {\r\n /**\r\n * The content of the expansion panel summary.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * @ignore\r\n * If `true`, the summary will be displayed in a disabled state.\r\n */\r\n disabled: _propTypes2.default.bool,\r\n /**\r\n * @ignore\r\n * If `true`, expands the summary, otherwise collapse it.\r\n */\r\n expanded: _propTypes2.default.bool,\r\n /**\r\n * **DEPRECATED** This is now handled by the component.\r\n *\r\n * The icon to display as the expand indicator.\r\n */\r\n expandIcon: _propTypes2.default.node,\r\n /**\r\n * Properties applied to the icon element.\r\n */\r\n expandIconProps: _propTypes2.default.object,\r\n /**\r\n * Displays the expandIcon on the left side of the ExpansionPanel.\r\n */\r\n leftIconDisplay: _propTypes2.default.bool,\r\n /**\r\n * @ignore\r\n */\r\n onChange: _propTypes2.default.func,\r\n /**\r\n * @ignore\r\n */\r\n onClick: _propTypes2.default.func\r\n};\r\n\r\nExpansionPanelSummary.defaultProps = {\r\n leftIconDisplay: false\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(ExpansionPanelSummary);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _Table = require('./Table');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_Table).default;\r\n }\r\n});\r\n\r\nvar _TableHead = require('./TableHead');\r\n\r\nObject.defineProperty(exports, 'TableHead', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_TableHead).default;\r\n }\r\n});\r\n\r\nvar _TableCell = require('./TableCell');\r\n\r\nObject.defineProperty(exports, 'TableCell', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_TableCell).default;\r\n }\r\n});\r\n\r\nvar _TableExpandableRow = require('./TableExpandableRow');\r\n\r\nObject.defineProperty(exports, 'TableExpandableRow', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_TableExpandableRow).default;\r\n }\r\n});\r\n\r\nvar _TableFooter = require('./TableFooter');\r\n\r\nObject.defineProperty(exports, 'TableFooter', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_TableFooter).default;\r\n }\r\n});\r\n\r\nvar _TableRow = require('./TableRow');\r\n\r\nObject.defineProperty(exports, 'TableRow', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_TableRow).default;\r\n }\r\n});\r\n\r\nvar _TableBody = require('./TableBody');\r\n\r\nObject.defineProperty(exports, 'TableBody', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_TableBody).default;\r\n }\r\n});\r\n\r\nvar _TableSortLabel = require('./TableSortLabel');\r\n\r\nObject.defineProperty(exports, 'TableSortLabel', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_TableSortLabel).default;\r\n }\r\n});\r\n\r\nvar _TableToolbar = require('./TableToolbar');\r\n\r\nObject.defineProperty(exports, 'TableToolbar', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_TableToolbar).default;\r\n }\r\n});\r\n\r\nvar _TableEditableCell = require('./TableEditableCell');\r\n\r\nObject.defineProperty(exports, 'TableEditableCell', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_TableEditableCell).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _expansionPanelStyles;\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _styles2 = require('../styles');\r\n\r\nvar _styles3 = _interopRequireDefault(_styles2);\r\n\r\nvar _Table = require('@material-ui/core/Table');\r\n\r\nvar _Table2 = _interopRequireDefault(_Table);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nvar defaultResponsiveStyles = {\r\n border: 0,\r\n position: 'relative',\r\n '& thead': {\r\n // `display: 'none'` will not be read by screen readers\r\n // hence hiding it through visibility property.\r\n border: 'none',\r\n clip: 'rect(0 0 0 0)',\r\n height: _tokens.borderWidthThin,\r\n margin: _tokens.borderWidthThin,\r\n overflow: 'hidden',\r\n padding: 0,\r\n position: 'absolute',\r\n width: _tokens.borderWidthThin\r\n },\r\n '& tbody tr': {\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n height: 'auto',\r\n marginBottom: _tokens.spacingMedium,\r\n borderBottom: _tokens.borderWidthThin + ' solid ' + _tokens.colorBrandNeutral300,\r\n paddingBottom: _tokens.spacingMedium,\r\n position: 'relative'\r\n },\r\n '& tbody td:before, & tbody th:before': {\r\n content: 'attr(data-label)',\r\n fontWeight: 'bold',\r\n whiteSpace: 'normal',\r\n wordBreak: 'break-all',\r\n left: 0,\r\n color: _tokens.colorBrandNeutral600,\r\n float: 'left',\r\n width: '6rem',\r\n minWidth: '6rem',\r\n marginRight: _tokens.spacingMedium\r\n },\r\n '& tbody td, & tbody th': {\r\n borderBottom: 'none',\r\n fontSize: _tokens.fontSizeDefault,\r\n textAlign: 'left',\r\n width: _tokens.widthFluid,\r\n padding: _tokens.spacingXSmall + ' 0',\r\n color: _tokens.colorBrandNeutral500,\r\n display: 'block'\r\n },\r\n '& tbody td > *, & tbody th > *': {\r\n display: 'flex'\r\n }\r\n};\r\n\r\nvar expansionPanelStyles = (_expansionPanelStyles = {\r\n '& tbody tr': {\r\n padding: _tokens.spacingXSmall + ' !important',\r\n paddingRight: _tokens.spacingXxLarge + ' !important',\r\n marginBottom: '0 !important',\r\n borderColor: 'transparent'\r\n },\r\n '& tbody tr td, & tbody tr th': {\r\n wordBreak: 'break-all'\r\n }\r\n}, _defineProperty(_expansionPanelStyles, '& thead th:last-child,\\n & tbody td:last-child,\\n & tbody th:last-child', {\r\n // On mobile should be always visible\r\n display: 'inherit !important'\r\n}), _defineProperty(_expansionPanelStyles, '& tbody td:not(:first-child), & tbody th:not(:first-child)', {\r\n display: 'none'\r\n}), _defineProperty(_expansionPanelStyles, '& tbody tr.table-row-expanded td:not(:first-child),\\n & tbody tr.table-row-expanded th:not(:first-child),\\n & tbody td.no-expanded-row-content span,\\n & tbody th.no-expanded-row-content span', {\r\n display: 'inherit'\r\n}), _defineProperty(_expansionPanelStyles, '& tbody tr td.expand-row-button', {\r\n position: 'absolute',\r\n width: 'auto',\r\n top: 0,\r\n right: 0,\r\n paddingRight: _tokens.spacingSmall\r\n}), _defineProperty(_expansionPanelStyles, '& tbody tr.table-row-expanded-content', {\r\n paddingRight: _tokens.spacingMedium\r\n}), _defineProperty(_expansionPanelStyles, '& tbody tr.table-row-expanded-content td,\\n & tbody tr.table-row-expanded-content th', {\r\n wordBreak: 'break-word',\r\n paddingRight: 0\r\n}), _defineProperty(_expansionPanelStyles, '& tbody tr.table-row-expanded-content td:before,\\n & tbody tr.table-row-expanded-content th:before', {\r\n display: 'none'\r\n}), _defineProperty(_expansionPanelStyles, '& tbody tr.table-row-expanded-content td > *,\\n & tbody tr.table-row-expanded-content th > *', {\r\n display: 'inline-block'\r\n}), _expansionPanelStyles);\r\n\r\nvar generateResponsiveBreakpoints = function generateResponsiveBreakpoints(breakpoints) {\r\n var styles = {};\r\n\r\n // Create responsive styles for each breakpoint\r\n // When responsive='xl', it will always show\r\n breakpoints.keys.forEach(function (breakpoint) {\r\n var _styles;\r\n\r\n styles['responsive_' + breakpoint] = (_styles = {\r\n width: 'calc(100% - 0.8rem)'\r\n }, _defineProperty(_styles, '& tbody td.no-expanded-row-content span,\\n & tbody th.no-expanded-row-content span', {\r\n display: 'none'\r\n }), _defineProperty(_styles, '&$responsive', _defineProperty({}, breakpoints.down(breakpoint), Object.assign({}, defaultResponsiveStyles))), _defineProperty(_styles, '&$expansionPanels', _defineProperty({}, breakpoints.down(breakpoint), Object.assign({}, expansionPanelStyles))), _styles);\r\n });\r\n\r\n return styles;\r\n};\r\n\r\nvar styles = function styles(theme) {\r\n return Object.assign({\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: {},\r\n responsive: _defineProperty({\r\n width: 'calc(100% - 0.8rem)'\r\n }, '& tbody td.no-expanded-row-content span,\\n & tbody th.no-expanded-row-content span', {\r\n display: 'none'\r\n }),\r\n expansionPanels: {}\r\n }, generateResponsiveBreakpoints(theme.breakpoints));\r\n};\r\n\r\n/**\r\n * Use `Table` to display sets of data within a grid.\r\n * @done true\r\n * @updated true\r\n * @versionAdded v0.0.10\r\n * @examples\r\n TableExample\r\n TableWithPagination\r\n AnytimeEditableTableExample\r\n ResponsiveTableExample\r\n ResponsiveTableExpansionPanels\r\n ResponsiveTableExpansionAll\r\n */\r\nvar Table = _react2.default.forwardRef(function (props, ref) {\r\n var _classNames;\r\n\r\n var classes = props.classes,\r\n onExpand = props.onExpand,\r\n onClick = props.onClick,\r\n layoutProp = props.layout,\r\n rest = _objectWithoutProperties(props, ['classes', 'onExpand', 'onClick', 'layout']);\r\n\r\n var layout = Object.assign({\r\n // declare default values to compare if consumer sent in a prop or not, but hide from prop API\r\n variant: '',\r\n breakpoint: ''\r\n }, layoutProp);\r\n\r\n var classOverrides = {\r\n root: (0, _classnames2.default)(classes.root, (_classNames = {}, _defineProperty(_classNames, classes.responsive, layoutProp), _defineProperty(_classNames, classes.responsive_xs, layout.breakpoint === 'xs'), _defineProperty(_classNames, classes.responsive_sm, layout.breakpoint === 'sm'), _defineProperty(_classNames, classes.responsive_md, layout.breakpoint === 'md'), _defineProperty(_classNames, classes.responsive_lg, layout.breakpoint === 'lg'), _defineProperty(_classNames, classes.responsive_xl, layout.variant !== '' && layout.breakpoint === ''), _defineProperty(_classNames, classes.expansionPanels, layout.variant === 'expansionPanels'), _classNames))\r\n };\r\n\r\n var callback = function callback(e) {\r\n var targetClassList = e.target.classList;\r\n var isTargetExpandButton = targetClassList ? targetClassList.contains('expand-icon-container') || targetClassList.contains('expand-icon') : false;\r\n\r\n if (isTargetExpandButton && onExpand) {\r\n var _target = e.currentTarget;\r\n\r\n // NOTE: The code coverage tool is not counting statements within `setTimeout()` for some reason.\r\n // Ignoring this for a while until we find a solution.\r\n // However, this block is always executed when expand all is clicked for which I have added UTs\r\n // TODO: Find how to get around `setTimeout()` for code coverage\r\n /* istanbul ignore next */\r\n // Break out of execution stack.\r\n setTimeout(function () {\r\n var rowsExpanded = _target.querySelectorAll('.table-row-expanded');\r\n var rowsNotExpanded = _target.querySelectorAll('.not-table-row-expanded');\r\n var rows = _target.querySelectorAll('.table-expandable-row');\r\n\r\n if (rowsExpanded.length === rows.length) {\r\n onExpand(e, true);\r\n } else if (rowsNotExpanded.length === rows.length) {\r\n onExpand(e, false);\r\n }\r\n });\r\n }\r\n\r\n onClick && onClick(e);\r\n };\r\n\r\n return _react2.default.createElement(_Table2.default, Object.assign({}, rest, { onClick: callback, classes: classOverrides, ref: ref }));\r\n});\r\n\r\nTable.muiName = 'Table';\r\nTable.displayName = 'Table';\r\n\r\nTable.propTypes = {\r\n /**\r\n * The content of the table, normally `TableHeader` and `TableBody`.\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * Class name to be applied to the `Table` container.\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * The component used for the root node.\r\n * Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * Specify the cell size\r\n */\r\n size: _propTypes2.default.oneOf(['small', 'medium']),\r\n\r\n /**\r\n * Set the responsive layout `variant` and the `breakpoint` to trigger the responsive layout of the table.\r\n *\r\n * The shape of this prop is `{ variant: ['card', 'expansionPanels'], breakpoint: ['xs', 'sm', 'md', 'lg'] }`.\r\n *\r\n * If you do not specify a `breakpoint`, then the table will always show the given responsive layout variant.\r\n *\r\n * e.g.\r\n *\r\n * - `{ variant: 'card', breakpoint: 'sm' }` will result in the table rendering in the default table layout for viewports\r\n * greater than or equal to `sm` (960px) and the 'card' responsive layout when the viewport is smaller than `sm`.\r\n * - `{ variant: 'expansionPanels' }` will result in the table always showing the responsive expansion panel layout\r\n */\r\n layout: _propTypes2.default.shape({\r\n variant: _propTypes2.default.string,\r\n breakpoint: _propTypes2.default.oneOf(['xs', 'sm', 'md', 'lg'])\r\n }),\r\n /**\r\n * Callback to toggle the boolean value\r\n */\r\n onExpand: _propTypes2.default.func,\r\n /**\r\n * Callback triggered when expand all is clicked.\r\n */\r\n onClick: _propTypes2.default.func\r\n};\r\n\r\n// default props\r\nTable.defaultProps = {\r\n size: 'medium'\r\n};\r\n\r\nexports.default = (0, _styles3.default)(styles)(Table);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _TableHead = require('@material-ui/core/TableHead');\r\n\r\nvar _TableHead2 = _interopRequireDefault(_TableHead);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: {}\r\n};\r\n\r\n/**\r\n * Table header\r\n */\r\nvar TableHead = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_TableHead2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nTableHead.muiName = 'TableHead';\r\nTableHead.displayName = 'TableHead';\r\n\r\nTableHead.propTypes = {\r\n /**\r\n * The content of the table head, normally `TableRow`\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The component used for the root node. Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object])\r\n};\r\n\r\n// If default props are needed, they must be set here\r\nTableHead.defaultProps = {\r\n component: 'thead'\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(TableHead);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _TableCell = require('@material-ui/core/TableCell');\r\n\r\nvar _TableCell2 = _interopRequireDefault(_TableCell);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = {\r\n root: {\r\n paddingTop: _tokens.spacingXxSmall,\r\n paddingBottom: _tokens.spacingXxSmall\r\n },\r\n head: {},\r\n body: {}\r\n};\r\n\r\n/**\r\n * Table cell\r\n */\r\nvar TableCell = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n columnName = props.columnName,\r\n rest = _objectWithoutProperties(props, ['classes', 'columnName']);\r\n\r\n var classOverrides = {\r\n root: classes.root,\r\n head: classes.head,\r\n body: classes.body\r\n };\r\n\r\n return _react2.default.createElement(_TableCell2.default, Object.assign({}, rest, {\r\n 'data-label': columnName || '',\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nTableCell.muiName = 'TableCell';\r\nTableCell.displayName = 'TableCell';\r\n\r\nTableCell.propTypes = {\r\n /**\r\n * Set the text-align on the table cell content. Monetary or generally number fields should\r\n * be right aligned as that allows you to add them up quickly in your head without having\r\n * to worry about decimals.\r\n */\r\n align: _propTypes2.default.oneOf(['inherit', 'left', 'right', 'center', 'justify']),\r\n /**\r\n * The table cell contents\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * The component used for the root node. Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * Sets the padding applied to the cell.\r\n */\r\n padding: _propTypes2.default.oneOf(['default', 'checkbox', 'none']),\r\n /**\r\n * Specify the size of the cell. By default, inherits `size` from the parent `Table`.\r\n */\r\n size: _propTypes2.default.oneOf(['small', 'medium']),\r\n /**\r\n * Set scope attribute.\r\n */\r\n scope: _propTypes2.default.string,\r\n /**\r\n * Set aria-sort direction.\r\n */\r\n sortDirection: _propTypes2.default.oneOf(['asc', 'desc', false]),\r\n /**\r\n * Specify the cell type. By default, the `TableHead`, `TableBody` or `TableFooter` parent component set the value.\r\n */\r\n variant: _propTypes2.default.oneOf(['head', 'body', 'footer']),\r\n /**\r\n * Set this if you want to render a responsive Table\r\n */\r\n columnName: _propTypes2.default.string\r\n};\r\n\r\n// default props\r\nTableCell.defaultProps = {\r\n align: 'inherit',\r\n padding: 'default'\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(TableCell);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _EDSContext = require('../EDSContext/EDSContext');\r\n\r\nvar _TableCell = require('@material-ui/core/TableCell');\r\n\r\nvar _TableCell2 = _interopRequireDefault(_TableCell);\r\n\r\nvar _TableRow = require('@material-ui/core/TableRow');\r\n\r\nvar _TableRow2 = _interopRequireDefault(_TableRow);\r\n\r\nvar _ChevronDown = require('@eui/ds-icons/lib/ChevronDown');\r\n\r\nvar _ChevronDown2 = _interopRequireDefault(_ChevronDown);\r\n\r\nvar _classnames3 = require('classnames');\r\n\r\nvar _classnames4 = _interopRequireDefault(_classnames3);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\r\n\r\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\r\n\r\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: _defineProperty({\r\n height: '3rem'\r\n }, '@media ' + _tokens.mqSmallDown, {\r\n '&.table-row-expanded': {\r\n backgroundColor: theme.palette.grey[200]\r\n }\r\n }),\r\n iconContainer: {\r\n cursor: 'pointer',\r\n padding: _tokens.spacingXSmall,\r\n '&:focus': {\r\n outline: _tokens.borderWidthThick + ' solid ' + _tokens.colorBrandSecondary\r\n }\r\n },\r\n expandIcon: {\r\n transform: 'rotate(0deg)',\r\n transition: theme.transitions.create('transform', {\r\n duration: theme.transitions.duration.shortest\r\n }),\r\n verticalAlign: 'middle'\r\n },\r\n expandIconOpen: {\r\n transform: 'rotate(180deg)'\r\n },\r\n tableRowExpandedBackground: {\r\n backgroundColor: theme.palette.grey[200]\r\n },\r\n tableRowExpand: {\r\n padding: _tokens.spacingSmall + ' ' + _tokens.spacingMedium\r\n },\r\n muiTableCellRoot: {\r\n '&:last-child': {\r\n paddingRight: _tokens.spacingSmall,\r\n textAlign: 'right'\r\n }\r\n }\r\n };\r\n};\r\n\r\nvar TableExpandableRow = function (_React$Component) {\r\n _inherits(TableExpandableRow, _React$Component);\r\n\r\n function TableExpandableRow(props) {\r\n _classCallCheck(this, TableExpandableRow);\r\n\r\n var _this = _possibleConstructorReturn(this, (TableExpandableRow.__proto__ || Object.getPrototypeOf(TableExpandableRow)).call(this, props));\r\n\r\n _this.toggleExpand = function (e) {\r\n if (e.type === 'keypress' && (e.key === 'Enter' || e.key === ' ')) {\r\n e.preventDefault();\r\n _this.updateState();\r\n } else if (e.type === 'click') {\r\n _this.updateState();\r\n }\r\n };\r\n\r\n _this.state = {\r\n expanded: false\r\n };\r\n return _this;\r\n }\r\n\r\n _createClass(TableExpandableRow, [{\r\n key: 'componentDidUpdate',\r\n value: function componentDidUpdate(prevProps, prevState) {\r\n var _this2 = this;\r\n\r\n if (this.props.expand !== prevProps.expand) {\r\n this.setState(function (state) {\r\n return { expanded: _this2.props.expand };\r\n });\r\n }\r\n }\r\n }, {\r\n key: 'updateState',\r\n value: function updateState() {\r\n this.setState(function (state) {\r\n return {\r\n expanded: !state.expanded\r\n };\r\n });\r\n }\r\n }, {\r\n key: 'render',\r\n value: function render() {\r\n var _classnames,\r\n _this3 = this;\r\n\r\n var _props = this.props,\r\n classes = _props.classes,\r\n children = _props.children,\r\n expandedRowClassName = _props.expandedRowClassName,\r\n expandedRowContent = _props.expandedRowContent,\r\n expandToggleAriaLabel = _props.expandToggleAriaLabel,\r\n TableRowProps = _props.TableRowProps,\r\n ExpandedTableRowProps = _props.ExpandedTableRowProps,\r\n edsContext = _props.edsContext,\r\n expand = _props.expand,\r\n rest = _objectWithoutProperties(_props, ['classes', 'children', 'expandedRowClassName', 'expandedRowContent', 'expandToggleAriaLabel', 'TableRowProps', 'ExpandedTableRowProps', 'edsContext', 'expand']);\r\n\r\n var expanded = this.state.expanded;\r\n\r\n\r\n var expandLabel = expandToggleAriaLabel === TableExpandableRow.defaultProps.expandToggleAriaLabel ? // translate unless a label was provided\r\n edsContext.formatMessage('component.Table.showMore') : expandToggleAriaLabel;\r\n\r\n return _react2.default.createElement(\r\n _react2.default.Fragment,\r\n null,\r\n _react2.default.createElement(\r\n _TableRow2.default,\r\n Object.assign({\r\n className: (0, _classnames4.default)(classes.root, (_classnames = {}, _defineProperty(_classnames, classes.tableRowExpandedBackground, expanded && expandedRowContent), _defineProperty(_classnames, 'table-row-expanded', expanded), _defineProperty(_classnames, 'not-table-row-expanded', !expanded && expandedRowContent), _defineProperty(_classnames, 'table-expandable-row', expandedRowContent), _classnames))\r\n }, TableRowProps, rest),\r\n children,\r\n _react2.default.createElement(\r\n _TableCell2.default,\r\n {\r\n className: (0, _classnames4.default)('expand-row-button', { 'no-expanded-row-content': !expandedRowContent }),\r\n classes: { root: classes.muiTableCellRoot }\r\n },\r\n _react2.default.createElement(\r\n 'span',\r\n {\r\n className: 'expand-icon-container ' + classes.iconContainer,\r\n 'aria-expanded': expanded,\r\n 'aria-label': expandLabel,\r\n title: expandLabel,\r\n onClick: function onClick(e) {\r\n return _this3.toggleExpand(e);\r\n },\r\n onKeyPress: function onKeyPress(e) {\r\n return _this3.toggleExpand(e);\r\n },\r\n role: 'button',\r\n tabIndex: 0 },\r\n _react2.default.createElement(_ChevronDown2.default, {\r\n className: (0, _classnames4.default)(classes.expandIcon, 'expand-icon', _defineProperty({}, classes.expandIconOpen, expanded))\r\n })\r\n )\r\n )\r\n ),\r\n expandedRowContent && expanded && _react2.default.createElement(\r\n _TableRow2.default,\r\n Object.assign({ className: (0, _classnames4.default)(classes.tableRowExpandedBackground, expandedRowClassName, 'table-row-expanded-content')\r\n }, ExpandedTableRowProps),\r\n _react2.default.createElement(\r\n _TableCell2.default,\r\n { className: classes.tableRowExpand, colSpan: children.length + 1 },\r\n expandedRowContent\r\n )\r\n )\r\n );\r\n }\r\n }]);\r\n\r\n return TableExpandableRow;\r\n}(_react2.default.Component);\r\n\r\nTableExpandableRow.propTypes = {\r\n /**\r\n * Common children are the TableCells with information you want to show on the TableRow.\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * This is the custom prop for developers to control the expand collapse.\r\n * Useful when you want to expand / collapse all section in one click.\r\n */\r\n expand: _propTypes2.default.bool,\r\n /**\r\n * This is the actual content that should be shown when the TableExpandableRow is expanded.\r\n * When used for responsive table, you can choose not to supply any content.\r\n */\r\n expandedRowContent: _propTypes2.default.node,\r\n /**\r\n * Custom string name to send to the TableRow that is shown when expanded.\r\n */\r\n expandedRowClassName: _propTypes2.default.string,\r\n /**\r\n * Override the aria-label for the toggle arrow button.\r\n */\r\n expandToggleAriaLabel: _propTypes2.default.string,\r\n /**\r\n * @ignore\r\n */\r\n edsContext: _propTypes2.default.object,\r\n /**\r\n * Object of props to send to the TableRow with the toggle arrow.\r\n */\r\n TableRowProps: _propTypes2.default.object,\r\n /**\r\n * Object of props to send to the TableRow that is shown when expanded.\r\n */\r\n ExpandedTableRowProps: _propTypes2.default.object\r\n};\r\n\r\nTableExpandableRow.defaultProps = {\r\n expandToggleAriaLabel: 'Show More'\r\n};\r\n\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _styles.withStyles)(styles)(TableExpandableRow));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _TableFooter = require('@material-ui/core/TableFooter');\r\n\r\nvar _TableFooter2 = _interopRequireDefault(_TableFooter);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: {}\r\n};\r\n\r\n/**\r\n * Table component for displaying table footers\r\n */\r\nvar TableFooter = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_TableFooter2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nTableFooter.muiName = 'TableFooter';\r\nTableFooter.displayName = 'TableFooter';\r\n\r\nTableFooter.propTypes = {\r\n /**\r\n * The content of the table head, normally `TableRow`\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The component used for the root node. Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object])\r\n};\r\n\r\n// If default props are needed, they must be set here\r\nTableFooter.defaultProps = {\r\n component: 'tfoot'\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(TableFooter);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _TableRow = require('@material-ui/core/TableRow');\r\n\r\nvar _TableRow2 = _interopRequireDefault(_TableRow);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: {\r\n height: '3rem',\r\n '&$hover:hover': {\r\n backgroundColor: theme.palette.grey[250]\r\n }\r\n },\r\n hover: {}\r\n };\r\n};\r\n\r\n/**\r\n * Table component for displaying a row\r\n */\r\nvar TableRow = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: classes.root,\r\n hover: classes.hover\r\n };\r\n\r\n return _react2.default.createElement(_TableRow2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nTableRow.muiName = 'TableRow';\r\nTableRow.displayName = 'TableRow';\r\n\r\nTableRow.propTypes = {\r\n /**\r\n * Should be valid `
`children such as `TableCell`.\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The component used for the root node. Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * If `true`, the table row will shade on hover.\r\n */\r\n hover: _propTypes2.default.bool,\r\n /**\r\n * If `true`, the table row will have the selected shading.\r\n */\r\n selected: _propTypes2.default.bool\r\n\r\n};\r\n\r\n// If default props are needed, they must be set here\r\nTableRow.defaultProps = {\r\n component: 'tr',\r\n hover: false,\r\n selected: false\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(TableRow);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _TableBody = require('@material-ui/core/TableBody');\r\n\r\nvar _TableBody2 = _interopRequireDefault(_TableBody);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: {}\r\n};\r\n\r\n/**\r\n * The body of the table\r\n */\r\nvar TableBody = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_TableBody2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nTableBody.muiName = 'TableBody';\r\nTableBody.displayName = 'TableBody';\r\n\r\nTableBody.propTypes = {\r\n /**\r\n * The content of the component, normally `TableRow`.\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The component used for the root node. Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object])\r\n\r\n};\r\n\r\n// default props\r\nTableBody.defaultProps = {\r\n component: 'tbody'\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(TableBody);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _TableSortLabel = require('@material-ui/core/TableSortLabel');\r\n\r\nvar _TableSortLabel2 = _interopRequireDefault(_TableSortLabel);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: {}\r\n};\r\n\r\n/**\r\n * Table component for the label of a column sort\r\n */\r\nvar TableSortLabel = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_TableSortLabel2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nTableSortLabel.muiName = 'TableSortLabel';\r\n\r\nTableSortLabel.propTypes = {\r\n /**\r\n * If true, the table row will have the selected shading.\r\n */\r\n active: _propTypes2.default.bool,\r\n /**\r\n * Label contents, the arrow will be appended automatically.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The current sort direction.\r\n */\r\n direction: _propTypes2.default.oneOf(['asc', 'desc'])\r\n\r\n};\r\n\r\nTableSortLabel.displayName = 'TableSortLabel';\r\n\r\n// If default props are needed, they must be set here\r\nTableSortLabel.defaultProps = {\r\n active: false,\r\n direction: 'desc'\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(TableSortLabel);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _classnames3 = require('classnames');\r\n\r\nvar _classnames4 = _interopRequireDefault(_classnames3);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Toolbar = require('@material-ui/core/Toolbar');\r\n\r\nvar _Toolbar2 = _interopRequireDefault(_Toolbar);\r\n\r\nvar _ChevronDown = require('@eui/ds-icons/lib/ChevronDown');\r\n\r\nvar _ChevronDown2 = _interopRequireDefault(_ChevronDown);\r\n\r\nvar _Edit = require('@eui/ds-icons/lib/Edit');\r\n\r\nvar _Edit2 = _interopRequireDefault(_Edit);\r\n\r\nvar _ = require('../');\r\n\r\nvar _EDSContext = require('../EDSContext/EDSContext');\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n display: 'flex',\r\n padding: _tokens.spacingSmall\r\n },\r\n flex: {\r\n flexGrow: 1,\r\n fontSize: _tokens.fontSizeHeader2Small,\r\n color: _tokens.colorTextNeutral500\r\n },\r\n iconContainer: {\r\n cursor: 'pointer',\r\n padding: _tokens.spacingXSmall,\r\n '&:not(:last-child)': {\r\n marginRight: _tokens.spacingMedium\r\n },\r\n '&:focus': {\r\n outline: _tokens.borderWidthThin + ' solid ' + _tokens.colorBrandSecondary\r\n }\r\n },\r\n expandIcon: {\r\n transform: 'rotate(0deg)',\r\n transition: theme.transitions.create('transform', {\r\n duration: theme.transitions.duration.shortest\r\n }),\r\n verticalAlign: 'middle'\r\n },\r\n expandIconOpen: {\r\n transform: 'rotate(180deg)'\r\n },\r\n footer: {\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n width: _tokens.widthFluid,\r\n alignItems: 'center'\r\n },\r\n footerLeft: {\r\n justifyContent: 'flex-start'\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * TableToolbar\r\n */\r\nvar TableToolbar = _react2.default.forwardRef(function (props, ref) {\r\n var _classnames;\r\n\r\n var classes = props.classes,\r\n caption = props.caption,\r\n showExpandAllToggle = props.showExpandAllToggle,\r\n expandAllToggleAriaLabel = props.expandAllToggleAriaLabel,\r\n showEditToggle = props.showEditToggle,\r\n children = props.children,\r\n expanded = props.expanded,\r\n onExpand = props.onExpand,\r\n onEdit = props.onEdit,\r\n location = props.location,\r\n footerAlignItems = props.footerAlignItems,\r\n showFooterToolbarOnEdit = props.showFooterToolbarOnEdit,\r\n edsContext = props.edsContext,\r\n rest = _objectWithoutProperties(props, ['classes', 'caption', 'showExpandAllToggle', 'expandAllToggleAriaLabel', 'showEditToggle', 'children', 'expanded', 'onExpand', 'onEdit', 'location', 'footerAlignItems', 'showFooterToolbarOnEdit', 'edsContext']);\r\n\r\n var showToolbar = location === 'footer' && showFooterToolbarOnEdit || location === 'header';\r\n\r\n var toggleExpand = function toggleExpand(e) {\r\n if (e.type === 'keypress' && (e.key === 'Enter' || e.key === ' ')) {\r\n e.preventDefault();\r\n onExpand(e);\r\n } else if (e.type === 'click') {\r\n onExpand(e);\r\n }\r\n };\r\n\r\n var toggleEdit = function toggleEdit(e) {\r\n if (e.type === 'keypress' && (e.key === 'Enter' || e.key === ' ')) {\r\n e.preventDefault();\r\n onEdit(e);\r\n } else if (e.type === 'click') {\r\n onEdit(e);\r\n }\r\n };\r\n\r\n var expandLabel = expandAllToggleAriaLabel === TableToolbar.defaultProps.expandAllToggleAriaLabel ? // translate unless a label was provided\r\n edsContext.formatMessage('component.Table.showAll') : expandAllToggleAriaLabel;\r\n\r\n return _react2.default.createElement(\r\n _react2.default.Fragment,\r\n null,\r\n showToolbar && _react2.default.createElement(\r\n _Toolbar2.default,\r\n Object.assign({ className: classes.root }, rest, { ref: ref }),\r\n caption && _react2.default.createElement(\r\n _.Typography,\r\n { variant: 'h1', className: classes.flex },\r\n caption\r\n ),\r\n _react2.default.createElement(\r\n 'div',\r\n { className: (0, _classnames4.default)((_classnames = {}, _defineProperty(_classnames, classes.footer, location === 'footer'), _defineProperty(_classnames, classes.footerLeft, footerAlignItems === 'left'), _classnames)) },\r\n children,\r\n showEditToggle && _react2.default.createElement(\r\n 'span',\r\n {\r\n className: classes.iconContainer,\r\n onClick: function onClick(e) {\r\n return toggleEdit(e);\r\n },\r\n onKeyPress: function onKeyPress(e) {\r\n return toggleEdit(e);\r\n },\r\n 'aria-label': edsContext.formatMessage('component.Table.edit'),\r\n title: edsContext.formatMessage('component.Table.edit'),\r\n role: 'button',\r\n tabIndex: 0 },\r\n _react2.default.createElement(_Edit2.default, null)\r\n ),\r\n showExpandAllToggle && _react2.default.createElement(\r\n 'span',\r\n {\r\n className: classes.iconContainer,\r\n 'aria-expanded': expanded,\r\n 'aria-label': expandLabel,\r\n title: expandLabel,\r\n onClick: function onClick(e) {\r\n return toggleExpand(e);\r\n },\r\n onKeyPress: function onKeyPress(e) {\r\n return toggleExpand(e);\r\n },\r\n role: 'button',\r\n tabIndex: 0 },\r\n _react2.default.createElement(_ChevronDown2.default, {\r\n className: (0, _classnames4.default)(classes.expandIcon, _defineProperty({}, classes.expandIconOpen, expanded))\r\n })\r\n )\r\n )\r\n )\r\n );\r\n});\r\n\r\nTableToolbar.muiName = 'TableToolbar';\r\nTableToolbar.displayName = 'TableToolbar';\r\n\r\nTableToolbar.propTypes = {\r\n /**\r\n * The content of the table, normally `TableHeader` and `TableBody`.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * Class name to be applied to the Alert container.\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * Table caption or table title\r\n */\r\n caption: _propTypes2.default.string,\r\n /**\r\n * Show expand all or collapse all icon for expansion panels on mobile or expandable rows.\r\n */\r\n showExpandAllToggle: _propTypes2.default.bool,\r\n /**\r\n * Override the aria-label for the toggle all.\r\n */\r\n expandAllToggleAriaLabel: _propTypes2.default.string,\r\n /**\r\n * Prop to toggle expand all.\r\n */\r\n expanded: _propTypes2.default.bool,\r\n /**\r\n * @ignore\r\n */\r\n edsContext: _propTypes2.default.object,\r\n /**\r\n * Callback to toggle the boolean value\r\n */\r\n onExpand: _propTypes2.default.func,\r\n /**\r\n * Show editable toggle button to switch between edit and read-only table mode.\r\n */\r\n showEditToggle: _propTypes2.default.bool,\r\n /**\r\n * Callback when edit toggle button is clicked\r\n */\r\n onEdit: _propTypes2.default.func,\r\n /**\r\n * Align items for footer actions.\r\n */\r\n footerAlignItems: _propTypes2.default.oneOf(['left', 'right']),\r\n /**\r\n * If you need to use actions along with table caption,\r\n * use `header` location. For action with footer, use `footer` location.\r\n * NOTE: Captions actions are always right aligned.\r\n * For footer actions, you can choose left or right.\r\n */\r\n location: _propTypes2.default.oneOf(['header', 'footer']),\r\n /**\r\n * For footer, show the footer actions only when table is in edit mode.\r\n */\r\n showFooterToolbarOnEdit: _propTypes2.default.bool\r\n};\r\n\r\nTableToolbar.defaultProps = {\r\n showExpandAllToggle: false,\r\n showEditToggle: false,\r\n expandAllToggleAriaLabel: 'Show All',\r\n expanded: false,\r\n location: 'header',\r\n footerAlignItems: 'right'\r\n};\r\n\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _styles2.default)(styles)(TableToolbar));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _classnames2 = require('classnames');\r\n\r\nvar _classnames3 = _interopRequireDefault(_classnames2);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _TableCell = require('@material-ui/core/TableCell');\r\n\r\nvar _TableCell2 = _interopRequireDefault(_TableCell);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = {\r\n root: {\r\n paddingTop: _tokens.spacingXxSmall,\r\n paddingBottom: _tokens.spacingXxSmall\r\n },\r\n head: {},\r\n body: {},\r\n error: {\r\n backgroundColor: _tokens.colorBackgroundAlertError\r\n }\r\n};\r\n\r\n/**\r\n * Table cell\r\n */\r\nvar TableEditableCell = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n columnName = props.columnName,\r\n edit = props.edit,\r\n content = props.content,\r\n editableComponent = props.editableComponent,\r\n error = props.error,\r\n rest = _objectWithoutProperties(props, ['classes', 'columnName', 'edit', 'content', 'editableComponent', 'error']);\r\n\r\n var classOverrides = {\r\n root: classes.root,\r\n head: classes.head,\r\n body: classes.body\r\n };\r\n\r\n return _react2.default.createElement(\r\n _TableCell2.default,\r\n Object.assign({}, rest, {\r\n 'data-label': columnName || '',\r\n classes: classOverrides,\r\n className: (0, _classnames3.default)(_defineProperty({}, classes.error, error)),\r\n ref: ref\r\n }),\r\n edit ? editableComponent : content\r\n );\r\n});\r\n\r\nTableEditableCell.muiName = 'TableEditableCell';\r\nTableEditableCell.displayName = 'TableEditableCell';\r\n\r\nTableEditableCell.propTypes = {\r\n /**\r\n * Set the text-align on the table cell content. Monetary or generally number fields should\r\n * be right aligned as that allows you to add them up quickly in your head without having\r\n * to worry about decimals.\r\n */\r\n align: _propTypes2.default.oneOf(['inherit', 'left', 'right', 'center', 'justify']),\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * The component used for the root node. Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * Sets the padding applied to the cell.\r\n */\r\n padding: _propTypes2.default.oneOf(['default', 'checkbox', 'dense', 'none']),\r\n /**\r\n * Set scope attribute.\r\n */\r\n scope: _propTypes2.default.string,\r\n /**\r\n * Set aria-sort direction.\r\n */\r\n sortDirection: _propTypes2.default.oneOf(['asc', 'desc', false]),\r\n /**\r\n * Specify the cell type. By default, the `TableHead`, `TableBody` or `TableFooter` parent component set the value.\r\n */\r\n variant: _propTypes2.default.oneOf(['head', 'body', 'footer']),\r\n /**\r\n * Set this if you want to render a responsive Table\r\n */\r\n columnName: _propTypes2.default.string,\r\n /**\r\n * If true, the cells will turn to edit mode. Defaults to `true`\r\n */\r\n edit: _propTypes2.default.bool,\r\n /**\r\n * Content to be shown when table is in read-only mode\r\n */\r\n content: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.node, _propTypes2.default.object]),\r\n /**\r\n * This will be rendered when table is in editable mode.\r\n */\r\n editableComponent: _propTypes2.default.node.isRequired,\r\n /**\r\n * If true, the cell will be displayed in an error state.\r\n */\r\n error: _propTypes2.default.bool\r\n};\r\n\r\n// default props\r\nTableEditableCell.defaultProps = {\r\n align: 'inherit',\r\n padding: 'default',\r\n edit: true\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(TableEditableCell);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _Pagination = require('./Pagination');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_Pagination).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _IconButton = require('../IconButton');\r\n\r\nvar _IconButton2 = _interopRequireDefault(_IconButton);\r\n\r\nvar _TextField = require('../TextField');\r\n\r\nvar _TextField2 = _interopRequireDefault(_TextField);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _TablePagination = require('@material-ui/core/TablePagination');\r\n\r\nvar _TablePagination2 = _interopRequireDefault(_TablePagination);\r\n\r\nvar _ChevronDown = require('@eui/ds-icons/lib/ChevronDown');\r\n\r\nvar _ChevronDown2 = _interopRequireDefault(_ChevronDown);\r\n\r\nvar _ArrowEndLeft = require('@eui/ds-icons/lib/ArrowEndLeft');\r\n\r\nvar _ArrowEndLeft2 = _interopRequireDefault(_ArrowEndLeft);\r\n\r\nvar _ArrowEndRight = require('@eui/ds-icons/lib/ArrowEndRight');\r\n\r\nvar _ArrowEndRight2 = _interopRequireDefault(_ArrowEndRight);\r\n\r\nvar _ChevronRight = require('@eui/ds-icons/lib/ChevronRight');\r\n\r\nvar _ChevronRight2 = _interopRequireDefault(_ChevronRight);\r\n\r\nvar _ChevronLeft = require('@eui/ds-icons/lib/ChevronLeft');\r\n\r\nvar _ChevronLeft2 = _interopRequireDefault(_ChevronLeft);\r\n\r\nvar _Typography = require('../Typography');\r\n\r\nvar _Typography2 = _interopRequireDefault(_Typography);\r\n\r\nvar _EDSContext = require('../EDSContext/EDSContext');\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\r\n\r\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\r\n\r\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\n// PaginationAction Styles\r\nvar actionStyles = function actionStyles(theme) {\r\n var _root;\r\n\r\n return {\r\n root: (_root = {\r\n alignItems: 'center',\r\n display: 'flex',\r\n flex: 1,\r\n order: 2\r\n }, _defineProperty(_root, theme.breakpoints.between('xs', 'sm'), {\r\n flex: '1 1 100%',\r\n textAlign: 'center',\r\n paddingBottom: _tokens.spacingXSmall,\r\n borderBottom: _tokens.borderWidthThin + ' solid ' + theme.palette.grey[300],\r\n marginBottom: _tokens.spacingXSmall,\r\n justifyContent: 'space-between'\r\n }), _defineProperty(_root, '& $paginationButtons', {\r\n color: theme.palette.grey[500] + ' ',\r\n fill: theme.palette.grey[500] + ' ',\r\n backgroundColor: 'transparent ',\r\n '&:hover': {\r\n backgroundColor: 'transparent ',\r\n color: theme.palette.ctaColor.base + ' ',\r\n fill: theme.palette.ctaColor.base + ' '\r\n },\r\n '&:active': {\r\n backgroundColor: 'transparent ',\r\n color: theme.palette.ctaColor.hover + ' ',\r\n fill: theme.palette.ctaColor.hover + ' '\r\n },\r\n '&:disabled': {\r\n backgroundColor: 'transparent ',\r\n fill: theme.palette.grey[400] + ' '\r\n },\r\n // NOTE: Could create an 'icon' classes prop to handle this sizing\r\n '& svg': {\r\n width: 16,\r\n height: 16\r\n }\r\n }), _defineProperty(_root, '& $textField', {\r\n // NOTE: Remove when Textfield supports us overriding the classes prop\r\n width: '40px',\r\n marginLeft: '' + _tokens.spacingXSmall,\r\n marginRight: '' + _tokens.spacingXSmall,\r\n verticalAlign: 'baseline',\r\n '& input': {\r\n padding: '0.1rem',\r\n textAlign: 'center',\r\n fontSize: theme.typography.caption.fontSize\r\n }\r\n }), _root),\r\n typography: {\r\n display: 'flex',\r\n alignSelf: 'center'\r\n },\r\n // NOTE: This should be sent to the TextField classes.root\r\n // But our implementation doesn't allow this\r\n // textFieldRoot: {\r\n // width: 32,\r\n // marginLeft: 8,\r\n // marginRight: 8,\r\n // verticalAlign: 'baseline',\r\n // },\r\n // Remove if TextField can support classes override\r\n textField: {},\r\n // Remove after transparent IconButtons variant is created\r\n paginationButtons: {},\r\n pageNumberInput: _defineProperty({\r\n display: 'flex',\r\n margin: '0 ' + _tokens.spacingXxLarge\r\n }, theme.breakpoints.between('xs', 'sm'), {\r\n margin: 0\r\n }),\r\n buttonSpacer: _defineProperty({\r\n marginRight: _tokens.spacingMedium\r\n }, theme.breakpoints.between('xs', 'sm'), {\r\n marginRight: 0\r\n })\r\n };\r\n};\r\n\r\nvar PaginationActions = function (_React$Component) {\r\n _inherits(PaginationActions, _React$Component);\r\n\r\n function PaginationActions() {\r\n var _ref;\r\n\r\n var _temp, _this, _ret;\r\n\r\n _classCallCheck(this, PaginationActions);\r\n\r\n for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {\r\n args[_key] = arguments[_key];\r\n }\r\n\r\n return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = PaginationActions.__proto__ || Object.getPrototypeOf(PaginationActions)).call.apply(_ref, [this].concat(args))), _this), _this.state = {\r\n pageNumberInput: _this.props.page + 1 || 1 // zero-based number\r\n }, _this.handleFirstPageButtonClick = function (event) {\r\n _this.setState({\r\n pageNumberInput: 1\r\n }, function () {\r\n return _this.props.onChangePage(event, 0);\r\n });\r\n }, _this.handleBackButtonClick = function (event) {\r\n var page = _this.props.page - 1;\r\n\r\n _this.setState({\r\n pageNumberInput: page + 1\r\n }, function () {\r\n return _this.props.onChangePage(event, page);\r\n });\r\n }, _this.handleNextButtonClick = function (event) {\r\n var page = _this.props.page + 1;\r\n _this.setState({\r\n pageNumberInput: page + 1\r\n }, function () {\r\n return _this.props.onChangePage(event, page);\r\n });\r\n }, _this.handleLastPageButtonClick = function (event) {\r\n // returns 0-based\r\n var page = Math.max(0, Math.ceil(_this.props.count / _this.props.rowsPerPage) - 1);\r\n\r\n // display value non-0 based\r\n _this.setState({\r\n pageNumberInput: page + 1\r\n }, function () {\r\n return _this.props.onChangePage(event, page);\r\n });\r\n }, _this.handleTextFieldOnChange = function (event) {\r\n var value = event.target.value;\r\n if (!isNaN(Number(value))) {\r\n _this.setState({\r\n pageNumberInput: value\r\n });\r\n }\r\n }, _this.handleTextFieldOnBlur = function (event) {\r\n event.preventDefault();\r\n if (_this.paginationPageTextField.value - 1 !== _this.props.page) {\r\n _this.handlePageChange(event);\r\n }\r\n }, _this.handleTextFieldFocus = function () {\r\n _this.paginationPageTextField.select();\r\n }, _this.handleEnterKeyPress = function (event) {\r\n if (event.key === 'Enter') {\r\n event.preventDefault();\r\n if (_this.paginationPageTextField.value - 1 !== _this.props.page) {\r\n _this.handlePageChange(event);\r\n }\r\n }\r\n }, _temp), _possibleConstructorReturn(_this, _ret);\r\n }\r\n\r\n _createClass(PaginationActions, [{\r\n key: 'componentDidUpdate',\r\n value: function componentDidUpdate(prevProps) {\r\n var _this2 = this;\r\n\r\n if (prevProps.rowsPerPage !== this.props.rowsPerPage || prevProps.count !== this.props.count) {\r\n this.setState({\r\n pageNumberInput: 1\r\n }, function () {\r\n return _this2.props.onChangePage({}, 0);\r\n });\r\n }\r\n }\r\n }, {\r\n key: 'handlePageChange',\r\n\r\n\r\n // Shared function to change page or alter state\r\n // Receives `value` from the TextField\r\n value: function handlePageChange(event) {\r\n var _this3 = this;\r\n\r\n // 1-based\r\n var value = this.paginationPageTextField.value;\r\n\r\n // 0-based\r\n var totalNumberOfPages = Math.max(0, Math.ceil(this.props.count / this.props.rowsPerPage) - 1);\r\n\r\n if (value <= 0) {\r\n // If value is zero or negative\r\n // Go to first page\r\n this.setState({ pageNumberInput: 1 }, function () {\r\n return _this3.props.onChangePage(event, 0);\r\n });\r\n } else if (value >= 1 && value <= totalNumberOfPages) {\r\n // If value is greater than 1\r\n // and value is less than or equal totalNumberOfPages\r\n this.setState({\r\n pageNumberInput: value\r\n }, this.props.onChangePage(event, Number(value) - 1));\r\n } else if (value >= totalNumberOfPages + 1) {\r\n // If value is greater than total number of pages\r\n // Go to last page\r\n this.setState({\r\n pageNumberInput: totalNumberOfPages + 1\r\n }, this.props.onChangePage(event, totalNumberOfPages));\r\n }\r\n }\r\n }, {\r\n key: 'render',\r\n value: function render() {\r\n var _this4 = this;\r\n\r\n var _props = this.props,\r\n classes = _props.classes,\r\n count = _props.count,\r\n page = _props.page,\r\n rowsPerPage = _props.rowsPerPage,\r\n theme = _props.theme,\r\n edsContext = _props.edsContext;\r\n var pageNumberInput = this.state.pageNumberInput;\r\n\r\n\r\n var totalNumberOfPages = Math.max(0, Math.ceil(count / rowsPerPage) - 1);\r\n var disablePreviousButtons = page === 0;\r\n var disableNextButtons = page >= Math.ceil(count / rowsPerPage) - 1;\r\n\r\n // TODO: Change IconButtons to different transparent variant\r\n return _react2.default.createElement(\r\n 'div',\r\n { className: '' + classes.root },\r\n _react2.default.createElement(\r\n _IconButton2.default,\r\n {\r\n onClick: this.handleFirstPageButtonClick,\r\n disabled: disablePreviousButtons,\r\n color: 'secondary',\r\n 'aria-label': edsContext.formatMessage('component.Pagination.firstPage'),\r\n title: edsContext.formatMessage('component.Pagination.firstPage'),\r\n className: classes.paginationButtons + ' ' + classes.buttonSpacer\r\n },\r\n theme.direction === 'rtl' ? _react2.default.createElement(_ArrowEndRight2.default, null) : _react2.default.createElement(_ArrowEndLeft2.default, null)\r\n ),\r\n _react2.default.createElement(\r\n _IconButton2.default,\r\n {\r\n onClick: this.handleBackButtonClick,\r\n disabled: disablePreviousButtons,\r\n color: 'secondary',\r\n 'aria-label': edsContext.formatMessage('component.Pagination.previousPage'),\r\n title: edsContext.formatMessage('component.Pagination.previousPage'),\r\n className: classes.paginationButtons\r\n },\r\n theme.direction === 'rtl' ? _react2.default.createElement(_ChevronRight2.default, null) : _react2.default.createElement(_ChevronLeft2.default, null)\r\n ),\r\n _react2.default.createElement(\r\n 'span',\r\n { className: classes.pageNumberInput + ' page-input' },\r\n _react2.default.createElement(\r\n _Typography2.default,\r\n { variant: 'body3', className: classes.typography },\r\n edsContext.formatMessage('component.Pagination.page')\r\n ),\r\n _react2.default.createElement(_TextField2.default, {\r\n className: (0, _classnames2.default)(classes.textField),\r\n inputRef: function inputRef(input) {\r\n return _this4.paginationPageTextField = input;\r\n },\r\n value: pageNumberInput,\r\n inputProps: { 'aria-label': '' + pageNumberInput },\r\n onChange: this.handleTextFieldOnChange,\r\n margin: 'normal',\r\n onKeyPress: this.handleEnterKeyPress,\r\n onFocus: this.handleTextFieldFocus,\r\n onBlur: this.handleTextFieldOnBlur,\r\n disabled: totalNumberOfPages === 0\r\n }),\r\n _react2.default.createElement(\r\n _Typography2.default,\r\n { variant: 'body3', className: classes.typography },\r\n edsContext.formatMessage('component.Pagination.ofTotalCount', { count: totalNumberOfPages + 1 })\r\n )\r\n ),\r\n _react2.default.createElement(\r\n _IconButton2.default,\r\n {\r\n onClick: this.handleNextButtonClick,\r\n disabled: disableNextButtons,\r\n color: 'secondary',\r\n 'aria-label': edsContext.formatMessage('component.Pagination.nextPage'),\r\n title: edsContext.formatMessage('component.Pagination.nextPage'),\r\n className: classes.paginationButtons + ' ' + classes.buttonSpacer\r\n },\r\n theme.direction === 'rtl' ? _react2.default.createElement(_ChevronLeft2.default, null) : _react2.default.createElement(_ChevronRight2.default, null)\r\n ),\r\n _react2.default.createElement(\r\n _IconButton2.default,\r\n {\r\n onClick: this.handleLastPageButtonClick,\r\n disabled: disableNextButtons,\r\n color: 'secondary',\r\n 'aria-label': edsContext.formatMessage('component.Pagination.lastPage'),\r\n title: edsContext.formatMessage('component.Pagination.lastPage'),\r\n className: classes.paginationButtons\r\n },\r\n theme.direction === 'rtl' ? _react2.default.createElement(_ArrowEndLeft2.default, null) : _react2.default.createElement(_ArrowEndRight2.default, null)\r\n )\r\n );\r\n }\r\n }]);\r\n\r\n return PaginationActions;\r\n}(_react2.default.Component);\r\n\r\nPaginationActions.propTypes = {\r\n classes: _propTypes2.default.object.isRequired,\r\n count: _propTypes2.default.number.isRequired,\r\n onChangePage: _propTypes2.default.func.isRequired,\r\n page: _propTypes2.default.number.isRequired,\r\n rowsPerPage: _propTypes2.default.number.isRequired,\r\n theme: _propTypes2.default.object.isRequired,\r\n edsContext: _propTypes2.default.object.isRequired\r\n};\r\n\r\nvar PaginationActionsWrapped = (0, _EDSContext.withEDSContext)((0, _styles2.default)(actionStyles, { withTheme: true })(PaginationActions));\r\n\r\n// Pagination Styles\r\nvar styles = function styles(theme) {\r\n return {\r\n root: _defineProperty({\r\n // Target the \"Total results...\" text\r\n '& $caption:nth-last-child(2)': _defineProperty({\r\n order: 4,\r\n marginRight: 0,\r\n marginLeft: 'auto'\r\n }, theme.breakpoints.between('xs', 'sm'), {\r\n marginRight: _tokens.spacingXSmall\r\n })\r\n }, theme.breakpoints.between('xs', 'sm'), {\r\n width: _tokens.widthFluid,\r\n paddingTop: _tokens.spacingXSmall,\r\n paddingBottom: _tokens.spacingLarge\r\n // TODO: To be used if it needs to be attached to bottom or made configurable\r\n // bottom: \"0\",\r\n // zIndex: \"99\",\r\n // background: \"rgba(255, 255, 255, 1)\",\r\n // position: \"fixed\",\r\n // left: 0,\r\n // boxShadow: \"0px -3px 10px #ccc\",\r\n }),\r\n toolbar: _defineProperty({\r\n padding: 0,\r\n margin: '0 ' + _tokens.spacingSmall + ' ' + _tokens.spacingSmall + ' ' + _tokens.spacingXSmall\r\n }, theme.breakpoints.between('xs', 'sm'), {\r\n justifyContent: 'flex-start',\r\n flexWrap: 'wrap',\r\n margin: '0 ' + _tokens.spacingXSmall + ' 0 ' + _tokens.spacingXSmall\r\n }),\r\n spacer: {\r\n flex: 'none',\r\n order: 1\r\n },\r\n caption: {\r\n color: theme.palette.grey[500],\r\n order: 3,\r\n marginRight: _tokens.spacingSmall,\r\n marginLeft: _tokens.spacingXSmall\r\n },\r\n selectRoot: _defineProperty({\r\n marginRight: _tokens.spacingXxLarge\r\n }, theme.breakpoints.between('xs', 'sm'), {\r\n marginRight: 0\r\n }),\r\n selectIcon: {\r\n top: _tokens.spacingXSmall,\r\n right: _tokens.spacingXxSmall,\r\n fill: theme.palette.grey[500]\r\n },\r\n select: {\r\n fontSize: theme.typography.caption.fontSize,\r\n paddingRight: _tokens.spacingLarge,\r\n '&:focus': {\r\n borderRadius: _tokens.borderRadiusSmall,\r\n boxShadow: _tokens.boxShadowFocusInset,\r\n backgroundColor: 'transparent'\r\n }\r\n },\r\n input: {\r\n order: 4\r\n },\r\n menuList: {\r\n border: theme.palette.ctaColor.base + ' ' + _tokens.borderWidthThin + ' solid',\r\n borderRadius: _tokens.borderRadiusMedium\r\n },\r\n menuListItem: {\r\n '& :first-child': {\r\n borderTopRightRadius: _tokens.borderRadiusSmall,\r\n borderTopLeftRadius: _tokens.borderRadiusSmall\r\n },\r\n '& :last-child': {\r\n borderBottomRightRadius: _tokens.borderRadiusSmall,\r\n borderBottomLeftRadius: _tokens.borderRadiusSmall\r\n }\r\n },\r\n menuItem: {\r\n padding: _tokens.spacingXSmall + ' ' + _tokens.spacingXSmall2,\r\n borderBottom: _tokens.borderWidthThin + ' solid ' + theme.palette.grey[300],\r\n // Had to use `!important` below to override styles as MUI Pagination is adding inline styles.\r\n minWidth: _tokens.spacingLarge + ' !important',\r\n '&:last-child': {\r\n borderBottom: 'transparent ' + _tokens.borderWidthThin + ' solid'\r\n },\r\n fontSize: _tokens.fontSizeDefault,\r\n '&:hover': {\r\n color: theme.palette.grey[600],\r\n backgroundColor: theme.palette.grey[250]\r\n },\r\n //Using aria-selected as a workaround as accessing the selected styles of menuItem was not possible\r\n '&[aria-selected=true]': {\r\n backgroundColor: theme.palette.ctaColor.base,\r\n color: theme.palette.grey[100],\r\n '&:hover': {\r\n backgroundColor: theme.palette.ctaColor.active\r\n }\r\n }\r\n },\r\n\r\n menuPaper: {\r\n boxShadow: 'none'\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * Use `Pagination` to allow users to navigate large data sets by breaking out the data into smaller, more consumable \"pages.\"\r\n * @done true\r\n * @updated true\r\n * @versionAdded v0.0.8\r\n * @examples\r\n * PaginationExamples\r\n * PaginationWithListExamples\r\n * PaginationWithTableExamples\r\n */\r\n\r\nvar Pagination = function (_React$Component2) {\r\n _inherits(Pagination, _React$Component2);\r\n\r\n function Pagination() {\r\n _classCallCheck(this, Pagination);\r\n\r\n return _possibleConstructorReturn(this, (Pagination.__proto__ || Object.getPrototypeOf(Pagination)).apply(this, arguments));\r\n }\r\n\r\n _createClass(Pagination, [{\r\n key: 'render',\r\n value: function render() {\r\n var _props2 = this.props,\r\n classes = _props2.classes,\r\n rowsPerPageOptions = _props2.rowsPerPageOptions,\r\n count = _props2.count,\r\n edsContext = _props2.edsContext,\r\n rowsPerPageShowAll = _props2.rowsPerPageShowAll,\r\n labelRowsPerPage = _props2.labelRowsPerPage,\r\n SelectProps = _props2.SelectProps,\r\n rest = _objectWithoutProperties(_props2, ['classes', 'rowsPerPageOptions', 'count', 'edsContext', 'rowsPerPageShowAll', 'labelRowsPerPage', 'SelectProps']);\r\n\r\n // Append `count` to the Select input\r\n\r\n\r\n var _rowsPerPageOption = rowsPerPageOptions;\r\n if (rowsPerPageShowAll) {\r\n _rowsPerPageOption = [].concat(_toConsumableArray(rowsPerPageOptions), [count]);\r\n }\r\n\r\n var classOverrides = {\r\n root: classes.root,\r\n toolbar: classes.toolbar,\r\n spacer: classes.spacer,\r\n caption: classes.caption,\r\n selectRoot: classes.selectRoot,\r\n select: classes.select,\r\n selectIcon: classes.selectIcon,\r\n input: classes.input,\r\n menuItem: classes.menuItem\r\n };\r\n\r\n var selectProps = Object.assign({\r\n IconComponent: _ChevronDown2.default,\r\n MenuProps: {\r\n classes: {\r\n paper: classes.menuPaper\r\n },\r\n MenuListProps: {\r\n className: classes.menuList,\r\n disablePadding: true,\r\n classes: {\r\n root: classes.menuListItem\r\n }\r\n }\r\n }\r\n }, SelectProps);\r\n\r\n return _react2.default.createElement(_TablePagination2.default, Object.assign({\r\n ActionsComponent: PaginationActionsWrapped,\r\n classes: classOverrides,\r\n className: classes.root,\r\n count: count,\r\n rowsPerPageOptions: _rowsPerPageOption,\r\n labelRowsPerPage: labelRowsPerPage === Pagination.defaultProps.labelRowsPerPage ? // translate unless a label was provided\r\n edsContext.formatMessage('component.Pagination.perPage') : labelRowsPerPage,\r\n labelDisplayedRows: function labelDisplayedRows(rows) {\r\n return edsContext.formatMessage('component.Pagination.totalResults') + ' ' + rows.count;\r\n },\r\n SelectProps: selectProps\r\n }, rest));\r\n }\r\n }]);\r\n\r\n return Pagination;\r\n}(_react2.default.Component);\r\n\r\n;\r\n\r\nPagination.muiName = 'Pagination';\r\n\r\nPagination.propTypes = {\r\n /**\r\n * The component used for the root node.\r\n * Either a string to use a DOM element or a component.\r\n * EX: Use TableCell if used within Table\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func]),\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * The total number of rows.\r\n */\r\n count: _propTypes2.default.number.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n edsContext: _propTypes2.default.object,\r\n /**\r\n * Customize the rows per page label. Invoked with a `{ from, to, count, page }`\r\n * object.\r\n */\r\n labelRowsPerPage: _propTypes2.default.node,\r\n /**\r\n * Callback fired when the page is changed.\r\n *\r\n * @param {object} event The event source of the callback\r\n * @param {number} page The page selected\r\n */\r\n onChangePage: _propTypes2.default.func.isRequired,\r\n /**\r\n * Callback fired when the number of rows per page is changed.\r\n *\r\n * @param {object} event The event source of the callback\r\n */\r\n onChangeRowsPerPage: _propTypes2.default.func,\r\n /**\r\n * The zero-based index of the current page.\r\n */\r\n page: _propTypes2.default.number,\r\n /**\r\n * The number of rows per page.\r\n */\r\n rowsPerPage: _propTypes2.default.number.isRequired,\r\n /**\r\n * Customizes the options of the rows per page select field. If less than two options are\r\n * available, no select field will be displayed.\r\n */\r\n rowsPerPageOptions: _propTypes2.default.array,\r\n /**\r\n * Set to `true` to render a total count option in the `Select` in the last index.\r\n */\r\n rowsPerPageShowAll: _propTypes2.default.bool,\r\n /**\r\n * Properties applied to the rows per page `Select` element.\r\n */\r\n SelectProps: _propTypes2.default.object\r\n};\r\n\r\n// If default props are needed, they must be set here\r\nPagination.defaultProps = {\r\n labelRowsPerPage: 'Per page:',\r\n component: 'div',\r\n rowsPerPageOptions: [10, 20],\r\n rowsPerPageShowAll: false\r\n};\r\n\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _styles2.default)(styles)(Pagination));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _List = require('@material-ui/core/List');\r\n\r\nvar _List2 = _interopRequireDefault(_List);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n backgroundColor: theme.palette.common.white,\r\n width: _tokens.widthFluid\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * Use `List` to display a continuous, vertical index of text and/or images.\r\n * @done true\r\n * @updated true\r\n * @versionAdded v0.0.15\r\n * @examples\r\n * PrimaryTextExample\r\n * SecondaryTextExample\r\n * ControlsExample\r\n * ListItemWithButtonExample\r\n * IconsExample\r\n * ComplexListExample\r\n * MultilineExample\r\n * NestedListExample\r\n */\r\nvar List = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // Style overrides\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_List2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nList.muiName = 'List';\r\nList.displayName = 'List';\r\n\r\nList.propTypes = {\r\n /**\r\n * The content of the component.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * The component used for the root node.\r\n * Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func]),\r\n /**\r\n * If `true`, compact vertical padding designed for keyboard and mouse input will be used for\r\n * the list and list items. The property is available to descendant components as the\r\n * `dense` context.\r\n */\r\n dense: _propTypes2.default.bool,\r\n /**\r\n * If `true`, vertical padding will be removed from the list.\r\n */\r\n disablePadding: _propTypes2.default.bool,\r\n /**\r\n * The content of the subheader, normally `ListSubheader`.\r\n */\r\n subheader: _propTypes2.default.node\r\n};\r\n\r\nList.defaultProps = {\r\n dense: false,\r\n disablePadding: true\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(List);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _ListItem = require('@material-ui/core/ListItem');\r\n\r\nvar _ListItem2 = _interopRequireDefault(_ListItem);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nvar FOCUS_VISIBLE_CLASSNAME = 'eds-list-item-focus-visible';\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: _defineProperty({\r\n cursor: 'pointer',\r\n padding: _tokens.spacingSmall,\r\n '&:hover': {\r\n backgroundColor: theme.palette.grey['250']\r\n }\r\n }, '&.' + FOCUS_VISIBLE_CLASSNAME, {\r\n backgroundColor: '' + theme.palette.grey['250']\r\n })\r\n };\r\n};\r\n\r\n/**\r\n * An item in a list.\r\n */\r\nvar ListItem = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_ListItem2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n focusVisibleClassName: FOCUS_VISIBLE_CLASSNAME,\r\n ref: ref\r\n }));\r\n});\r\n\r\nListItem.muiName = 'ListItem';\r\nListItem.displayName = 'ListItem';\r\n\r\nListItem.propTypes = {\r\n /**\r\n * If `true`, the list item will be a button (using `ButtonBase`).\r\n */\r\n button: _propTypes2.default.bool,\r\n /**\r\n * The content of the component.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The component used for the root node.\r\n * Either a string to use a DOM element or a component.\r\n * By default, it's a `li` when `button` is `false` and a `div` when `button` is `true`.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * The container component used when a `ListItemSecondaryAction` is rendered.\r\n */\r\n ContainerComponent: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * Properties applied to the container element when the component\r\n * is used to display a `ListItemSecondaryAction`.\r\n */\r\n ContainerProps: _propTypes2.default.object,\r\n /**\r\n * If `true`, compact vertical padding designed for keyboard and mouse input will be used.\r\n */\r\n dense: _propTypes2.default.bool,\r\n /**\r\n * If `true`, the list item will be disabled.\r\n */\r\n disabled: _propTypes2.default.bool,\r\n /**\r\n * If `true`, the left and right padding is removed.\r\n */\r\n disableGutters: _propTypes2.default.bool,\r\n /**\r\n * If `true`, a 1px light border is added to the bottom of the list item.\r\n */\r\n divider: _propTypes2.default.bool\r\n};\r\n\r\nListItem.defaultProps = {\r\n button: false,\r\n ContainerComponent: 'li',\r\n dense: false,\r\n disabled: false,\r\n disableGutters: false,\r\n divider: false\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(ListItem);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _ListItemAvatar = require('@material-ui/core/ListItemAvatar');\r\n\r\nvar _ListItemAvatar2 = _interopRequireDefault(_ListItemAvatar);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n // Necessary style overrides are set here\r\n root: {}\r\n };\r\n};\r\n\r\n/**\r\n * A simple wrapper component to apply avavtar styles to ListItems.\r\n */\r\nvar ListItemAvatar = function ListItemAvatar(props) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // See Material UI documentation for available CSS classes can be passed through to override\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_ListItemAvatar2.default, Object.assign({}, rest, {\r\n classes: classOverrides\r\n }));\r\n};\r\n\r\nListItemAvatar.muiName = 'ListItemAvatar';\r\n\r\nListItemAvatar.propTypes = {\r\n /**\r\n * The content of the component – normally `Avatar`.\r\n */\r\n children: _propTypes2.default.element.isRequired,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object\r\n};\r\n\r\n// If default props are needed, they must be set here\r\n// ListItemAvatar.defaultProps = { };\r\n\r\nexports.default = (0, _styles2.default)(styles)(ListItemAvatar);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _ListItemIcon = require('@material-ui/core/ListItemIcon');\r\n\r\nvar _ListItemIcon2 = _interopRequireDefault(_ListItemIcon);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n // Necessary style overrides are set here\r\n root: {}\r\n };\r\n};\r\n\r\n/**\r\n * A simple wrapper component to apply icon styles to ListItems.\r\n */\r\nvar ListItemIcon = function ListItemIcon(props) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // See Material UI documentation for available CSS classes can be passed through to override\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_ListItemIcon2.default, Object.assign({}, rest, {\r\n classes: classOverrides }));\r\n};\r\n\r\nListItemIcon.muiName = 'ListItemIcon';\r\n\r\nListItemIcon.propTypes = {\r\n /**\r\n * The content of the component, normally an icon\r\n */\r\n children: _propTypes2.default.element.isRequired,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(ListItemIcon);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _ListItemSecondaryAction = require('@material-ui/core/ListItemSecondaryAction');\r\n\r\nvar _ListItemSecondaryAction2 = _interopRequireDefault(_ListItemSecondaryAction);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {}\r\n };\r\n};\r\n\r\n/**\r\n * A simple wrapper component to apply secondary action styles to ListItems.\r\n */\r\nvar ListItemSecondaryAction = function ListItemSecondaryAction(props) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // See Material UI documentation for available CSS classes can be passed through to override\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_ListItemSecondaryAction2.default, Object.assign({}, rest, {\r\n classes: classOverrides\r\n }));\r\n};\r\n\r\nListItemSecondaryAction.muiName = 'ListItemSecondaryAction';\r\n\r\nListItemSecondaryAction.propTypes = {\r\n /**\r\n * The content of the component, normally an `IconButton` or selection control.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object\r\n};\r\n\r\n// If default props are needed, they must be set here\r\n// ListItemSecondaryAction.defaultProps = { };\r\n\r\nexports.default = (0, _styles2.default)(styles)(ListItemSecondaryAction);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _ListItemText = require('@material-ui/core/ListItemText');\r\n\r\nvar _ListItemText2 = _interopRequireDefault(_ListItemText);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n margin: 0\r\n },\r\n // Note that these styles propagate out to components that use List, e.g. Dropdown\r\n primary: { // Primary typography components\r\n fontFamily: theme.typography.fontFamily,\r\n fontSize: theme.typography.body1.fontSize,\r\n fontWeight: theme.typography.fontWeightNormal,\r\n lineHeight: theme.typography.body2.lineHeight\r\n },\r\n secondary: { // Secondary typography components\r\n fontFamily: theme.typography.fontFamily,\r\n fontSize: theme.typography.caption.fontSize,\r\n fontWeight: theme.typography.fontWeightNormal,\r\n lineHeight: theme.typography.caption.lineHeight\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * A component that applies correct text styling to ListItems.\r\n */\r\nvar ListItemText = function ListItemText(props) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n root: classes.root,\r\n primary: classes.primary,\r\n secondary: classes.secondary\r\n };\r\n\r\n return _react2.default.createElement(_ListItemText2.default, Object.assign({}, rest, {\r\n classes: classOverrides\r\n }));\r\n};\r\n\r\nListItemText.muiName = 'ListItemText';\r\n\r\nListItemText.propTypes = {\r\n /**\r\n * Alias for the `primary` property.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * If `true`, the children won't be wrapped by a Typography component.\r\n * This can be useful to render an alternative Typography variant by wrapping\r\n * the `children` (or `primary`) text, and optional `secondary` text\r\n * with the Typography component.\r\n */\r\n disableTypography: _propTypes2.default.bool,\r\n /**\r\n * If `true`, the children will be indented.\r\n * This should be used if there is no left avatar or left icon.\r\n */\r\n inset: _propTypes2.default.bool,\r\n /**\r\n * The main content element.\r\n */\r\n primary: _propTypes2.default.node,\r\n /**\r\n * These props will be forwarded to the primary typography component\r\n * (as long as disableTypography is not `true`).\r\n */\r\n primaryTypographyProps: _propTypes2.default.object,\r\n /**\r\n * The secondary content element.\r\n */\r\n secondary: _propTypes2.default.node,\r\n /**\r\n * These props will be forwarded to the secondary typography component\r\n * (as long as disableTypography is not `true`).\r\n */\r\n secondaryTypographyProps: _propTypes2.default.object\r\n};\r\n\r\nListItemText.defaultProps = {\r\n disableTypography: false,\r\n inset: false\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(ListItemText);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _ListSubheader = require('@material-ui/core/ListSubheader');\r\n\r\nvar _ListSubheader2 = _interopRequireDefault(_ListSubheader);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n // Necessary style overrides are set here\r\n root: {}\r\n };\r\n};\r\n\r\n/**\r\n * A component that....\r\n */\r\nvar ListSubheader = function ListSubheader(props) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // See Material UI documentation for available CSS classes can be passed through to override\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_ListSubheader2.default, Object.assign({}, rest, {\r\n classes: classOverrides\r\n }));\r\n};\r\n\r\nListSubheader.muiName = 'ListSubheader';\r\n\r\nListSubheader.propTypes = {\r\n /**\r\n * The content of the component.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The color of the component. It supports those theme colors that make sense for this component.\r\n */\r\n color: _propTypes2.default.oneOf(['default', 'primary', 'inherit']),\r\n /**\r\n * The component used for the root node.\r\n * Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * If `true`, the List Subheader will not stick to the top during scroll.\r\n */\r\n disableSticky: _propTypes2.default.bool,\r\n /**\r\n * If `true`, the List Subheader will be indented.\r\n */\r\n inset: _propTypes2.default.bool\r\n};\r\n\r\nListSubheader.defaultProps = {\r\n color: 'default',\r\n component: 'li',\r\n disableSticky: false,\r\n inset: false\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(ListSubheader);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _StepProgress = require('./StepProgress');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_StepProgress).default;\r\n }\r\n});\r\n\r\nvar _MobileStepper = require('./MobileStepper');\r\n\r\nObject.defineProperty(exports, 'MobileStepper', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_MobileStepper).default;\r\n }\r\n});\r\n\r\nvar _MobileStepperCounter = require('./MobileStepperCounter');\r\n\r\nObject.defineProperty(exports, 'MobileStepperCounter', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_MobileStepperCounter).default;\r\n }\r\n});\r\n\r\nvar _MobileStepperStep = require('./MobileStepperStep');\r\n\r\nObject.defineProperty(exports, 'MobileStepperStep', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_MobileStepperStep).default;\r\n }\r\n});\r\n\r\nvar _MobileStepperLabel = require('./MobileStepperLabel');\r\n\r\nObject.defineProperty(exports, 'MobileStepperLabel', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_MobileStepperLabel).default;\r\n }\r\n});\r\n\r\nvar _MobileStepperTitle = require('./MobileStepperTitle');\r\n\r\nObject.defineProperty(exports, 'MobileStepperTitle', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_MobileStepperTitle).default;\r\n }\r\n});\r\n\r\nvar _Step = require('./Step');\r\n\r\nObject.defineProperty(exports, 'Step', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_Step).default;\r\n }\r\n});\r\n\r\nvar _StepButton = require('./StepButton');\r\n\r\nObject.defineProperty(exports, 'StepButton', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_StepButton).default;\r\n }\r\n});\r\n\r\nvar _StepContent = require('./StepContent');\r\n\r\nObject.defineProperty(exports, 'StepContent', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_StepContent).default;\r\n }\r\n});\r\n\r\nvar _StepLabel = require('./StepLabel');\r\n\r\nObject.defineProperty(exports, 'StepLabel', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_StepLabel).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"]) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError(\"Invalid attempt to destructure non-iterable instance\"); } }; }();\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _EDSContext = require('./../EDSContext/EDSContext');\r\n\r\nvar _core = require('@material-ui/core');\r\n\r\nvar _constants = require('./internal/constants.js');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n background: 'transparent',\r\n },\r\n hidden: {\r\n width: 0,\r\n height: 0,\r\n color: 'transparent'\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * Use `StepProgress` to display a user's progress through numbered steps.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.14\r\n * @examples\r\n * LinearHorizontalExample\r\n * NonLinearExample\r\n * AlternativeLabelExample\r\n * VerticalExample\r\n * ErrorStateExample\r\n * MobileStepperExample\r\n * NonLinearDisabledExample\r\n */\r\nvar StepProgress = _react2.default.forwardRef(function (props, ref) {\r\n var _useState = (0, _react.useState)(''),\r\n _useState2 = _slicedToArray(_useState, 2),\r\n stepLabel = _useState2[0],\r\n setStepLabel = _useState2[1];\r\n\r\n var _useState3 = (0, _react.useState)(false),\r\n _useState4 = _slicedToArray(_useState3, 2),\r\n hasStepError = _useState4[0],\r\n setHasStepError = _useState4[1];\r\n\r\n var _useState5 = (0, _react.useState)(''),\r\n _useState6 = _slicedToArray(_useState5, 2),\r\n errorLabel = _useState6[0],\r\n setErrorLabel = _useState6[1];\r\n\r\n var localRef = ref || (0, _react.useRef)();\r\n\r\n var classes = props.classes,\r\n edsContext = props.edsContext,\r\n rest = _objectWithoutProperties(props, ['classes', 'edsContext']);\r\n\r\n var classOverrides = {\r\n root: classes.root\r\n };\r\n\r\n // This effect sets the `aria-label` to say `, / \r\n // by the screen reader by extracting all the step labels\r\n (0, _react.useEffect)(function () {\r\n var stepLabels = localRef.current.querySelectorAll('.' + _constants.STEP_LABEL_CLASSNAME);\r\n\r\n stepLabels.forEach(function (localStepLabel, i) {\r\n localStepLabel.setAttribute('aria-label', edsContext.formatMessage('component.StepProgress.a11yLabel', {\r\n label: localStepLabel.textContent.replace(/^[0-9]/, ''),\r\n step: i + 1,\r\n totalSteps: stepLabels.length\r\n }));\r\n });\r\n }, [localRef, edsContext]);\r\n\r\n // This effect sets the div with current step content with error message if there is one.\r\n (0, _react.useEffect)(function () {\r\n try {\r\n var stepLabels = localRef.current.querySelectorAll('.' + _constants.STEP_LABEL_CLASSNAME);\r\n var activeStep = stepLabels[props.activeStep];\r\n var localStepLabel = localRef.current.querySelectorAll('.' + _constants.STEP_PROGRESS_STEP_CLASSNAME)[props.activeStep];\r\n var localErrorLabel = localStepLabel && localStepLabel.querySelector('.' + _constants.STEP_LABEL_ERROR_CLASSNAME);\r\n var secondaryLabel = localErrorLabel ? localErrorLabel.textContent : '';\r\n setHasStepError(activeStep ? activeStep.classList.contains(_constants.STEP_LABEL_HAS_ERROR_CLASSNAME) : '');\r\n setErrorLabel(secondaryLabel);\r\n setStepLabel(props.activeStep + 1 > stepLabels.length ? edsContext.formatMessage('component.MobileStepper.allStepsCompleted') : activeStep && activeStep.getAttribute('aria-label'));\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n }, [props.activeStep, localRef, edsContext]);\r\n\r\n var getText = function getText() {\r\n var errorMessage = edsContext.formatMessage('component.StepProgress.errorMessage', {\r\n errorMessage: errorLabel\r\n });\r\n var text = stepLabel;\r\n\r\n text += hasStepError ? ', ' + edsContext.formatMessage('component.StepProgress.errorMessageTitle') : '';\r\n text += errorLabel.length ? ', ' + errorMessage : '';\r\n\r\n return text;\r\n };\r\n\r\n return _react2.default.createElement(\r\n _react2.default.Fragment,\r\n null,\r\n _react2.default.createElement(_core.Stepper, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: localRef\r\n })),\r\n _react2.default.createElement(\r\n 'div',\r\n { 'aria-live': 'assertive', className: classes.hidden + ' ' + _constants.ACTIVE_STEP_SCREEN_READER_TEXT },\r\n getText()\r\n )\r\n );\r\n});\r\n\r\nStepProgress.muiName = 'Stepper';\r\nStepProgress.displayName = 'StepProgress';\r\n\r\nStepProgress.propTypes = {\r\n /**\r\n * Set the active step (zero based index).\r\n */\r\n activeStep: _propTypes2.default.number,\r\n /**\r\n * If set to 'true' and orientation is `horizontal`,\r\n * then the step label will be positioned under the icon.\r\n */\r\n alternativeLabel: _propTypes2.default.bool,\r\n /**\r\n * Two or more `` components.\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * A component to be placed between each step.\r\n */\r\n connector: _propTypes2.default.element,\r\n /**\r\n * If set the `StepProgress` will not assist in controlling steps for linear flow.\r\n */\r\n nonLinear: _propTypes2.default.bool,\r\n /**\r\n * The stepper orientation (layout flow direction).\r\n */\r\n orientation: _propTypes2.default.oneOf(['horizontal', 'vertical'])\r\n};\r\n\r\nStepProgress.defaultProps = {\r\n activeStep: 0,\r\n alternativeLabel: false,\r\n connector: _react2.default.createElement(_core.StepConnector, null),\r\n nonLinear: false,\r\n orientation: 'horizontal'\r\n};\r\n\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _styles2.default)(styles)(StepProgress));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"]) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError(\"Invalid attempt to destructure non-iterable instance\"); } }; }();\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _capitalize = require('lodash/capitalize');\r\n\r\nvar _capitalize2 = _interopRequireDefault(_capitalize);\r\n\r\nvar _EDSContext = require('./../EDSContext/EDSContext');\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _core = require('@material-ui/core');\r\n\r\nvar _MobileStepperCounter = require('./MobileStepperCounter');\r\n\r\nvar _MobileStepperCounter2 = _interopRequireDefault(_MobileStepperCounter);\r\n\r\nvar _constants = require('./internal/constants');\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n backgroundColor: theme.palette.grey[200],\r\n height: _tokens.sizingXxLarge1,\r\n padding: '0 ' + _tokens.spacingMedium\r\n },\r\n // StepCounter styles when position is bottom\r\n stepCounterBottom: {\r\n position: 'fixed',\r\n transform: 'translate(-50%, -50%)',\r\n textAlign: 'center',\r\n left: '50%',\r\n bottom: _tokens.spacingXSmall,\r\n zIndex: theme.zIndex.mobileStepper + 1 // MUI defined z-index + 1 to show on top of the MuiMobileStepper\r\n },\r\n // StepCounter styles when position is static\r\n stepCounterStatic: {\r\n position: 'relative',\r\n textAlign: 'center',\r\n top: 40\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * Mobile step progress\r\n */\r\nvar MobileStepper = _react2.default.forwardRef(function (props, ref) {\r\n var _useState = (0, _react.useState)(''),\r\n _useState2 = _slicedToArray(_useState, 2),\r\n label = _useState2[0],\r\n setLabel = _useState2[1];\r\n\r\n var localRef = ref || (0, _react.useRef)();\r\n\r\n var classes = props.classes,\r\n activeStep = props.activeStep,\r\n steps = props.steps,\r\n StepCounterContent = props.StepCounterContent,\r\n position = props.position,\r\n children = props.children,\r\n edsContext = props.edsContext,\r\n rest = _objectWithoutProperties(props, ['classes', 'activeStep', 'steps', 'StepCounterContent', 'position', 'children', 'edsContext']);\r\n\r\n var classOverrides = {\r\n root: classes.root\r\n };\r\n\r\n var mobileStepperCounterClassName = (0, _classnames2.default)(classes['stepCounter' + (0, _capitalize2.default)(position)]);\r\n\r\n // This effect sets the div with current step content with error message if there is one.\r\n (0, _react.useEffect)(function () {\r\n var mobileStepLabel = localRef.current.querySelector('.' + _constants.MOBILE_STEPPER_LABEL_CLASSNAME);\r\n setLabel(props.activeStep + 1 > steps ? edsContext.formatMessage('component.MobileStepper.allStepsCompleted') : edsContext.formatMessage('component.MobileStepper.a11yLabel', {\r\n label: mobileStepLabel && mobileStepLabel.textContent\r\n }));\r\n }, [props.activeStep, steps, edsContext, localRef]);\r\n\r\n return _react2.default.createElement(\r\n 'div',\r\n { ref: localRef },\r\n children,\r\n StepCounterContent ? _react2.default.createElement(\r\n 'div',\r\n { className: mobileStepperCounterClassName },\r\n StepCounterContent\r\n ) : _react2.default.createElement(\r\n 'div',\r\n { className: mobileStepperCounterClassName,\r\n 'aria-atomic': 'false',\r\n 'aria-live': 'assertive',\r\n 'aria-label': label\r\n },\r\n _react2.default.createElement(_MobileStepperCounter2.default, { activeStep: activeStep, steps: steps, position: position })\r\n ),\r\n _react2.default.createElement(_core.MobileStepper, Object.assign({\r\n steps: steps,\r\n activeStep: activeStep,\r\n position: position,\r\n classes: classOverrides,\r\n variant: null\r\n }, rest))\r\n );\r\n});\r\n\r\nMobileStepper.muiName = 'MobileStepper';\r\nMobileStepper.displayName = 'MobileStepper';\r\n\r\nMobileStepper.propTypes = {\r\n /**\r\n * Set the active step (zero based index).\r\n */\r\n activeStep: _propTypes2.default.number,\r\n /**\r\n * A back button element. For instance, it can be be a `Button` or a `IconButton`.\r\n */\r\n backButton: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The children will be rendered before the `` and the bottom control bar.\r\n */\r\n children: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object, _propTypes2.default.node]),\r\n /**\r\n * A next button element. For instance, it can be be a `Button` or a `IconButton`.\r\n */\r\n nextButton: _propTypes2.default.node,\r\n /**\r\n * Set the positioning type.\r\n */\r\n position: _propTypes2.default.oneOf(['bottom', 'static']),\r\n /**\r\n * The total steps.\r\n */\r\n steps: _propTypes2.default.number.isRequired,\r\n /**\r\n * Sent in a custom step counter.\r\n */\r\n StepCounterContent: _propTypes2.default.node\r\n};\r\n\r\n// default property values\r\nMobileStepper.defaultProps = {\r\n activeStep: 0,\r\n position: 'bottom'\r\n};\r\n\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _styles2.default)(styles)(MobileStepper));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Typography = require('../Typography');\r\n\r\nvar _Typography2 = _interopRequireDefault(_Typography);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n currentStepContainer: {\r\n alignContent: 'stretch',\r\n alignItems: 'center',\r\n display: 'flex',\r\n flexDirection: 'row',\r\n flexWrap: 'nowrap',\r\n justifyContent: 'flex-start',\r\n marginBottom: _tokens.spacingMedium\r\n },\r\n currentStep: {\r\n alignSelf: 'auto',\r\n backgroundColor: theme.palette.ctaColor.base,\r\n borderRadius: '100%',\r\n flex: '0 1 auto',\r\n height: _tokens.spacingLarge,\r\n order: 0,\r\n textAlign: 'center',\r\n width: _tokens.spacingLarge\r\n },\r\n currentStepNumber: {\r\n fontSize: _tokens.fontSizeSmall,\r\n color: theme.palette.grey[100],\r\n position: 'relative',\r\n top: _tokens.spacingXSmall\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * A component that displays the current step of the total steps\r\n */\r\nvar MobileStepperStep = _react2.default.forwardRef(function (props, ref) {\r\n var activeStep = props.activeStep,\r\n classes = props.classes;\r\n\r\n\r\n return _react2.default.createElement(\r\n 'div',\r\n { className: classes.currentStepContainer, ref: ref },\r\n _react2.default.createElement(\r\n 'div',\r\n { className: classes.currentStep },\r\n _react2.default.createElement(\r\n _Typography2.default,\r\n { className: classes.currentStepNumber },\r\n activeStep + 1\r\n )\r\n ),\r\n props.children && props.children\r\n );\r\n});\r\n\r\nMobileStepperStep.propTypes = {\r\n /**\r\n * Set the active step (zero based index). This should be the same value that is being sent to the component.\r\n */\r\n activeStep: _propTypes2.default.number,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The step title component node.\r\n */\r\n children: _propTypes2.default.node\r\n};\r\n\r\nMobileStepperStep.displayName = 'MobileStepperStep';\r\n\r\nexports.default = (0, _styles2.default)(styles)(MobileStepperStep);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Typography = require('../Typography');\r\n\r\nvar _Typography2 = _interopRequireDefault(_Typography);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nvar _constants = require('./internal/constants');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n currentStepTitle: {\r\n order: 0,\r\n marginLeft: _tokens.spacingXSmall,\r\n flex: '1 1 auto',\r\n alignSelf: 'auto'\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * A component that displays the current step of the total steps\r\n */\r\nvar MobileStepperLabel = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n return (\r\n /* These marker class names will be used by its parent component MobileStepper */\r\n _react2.default.createElement(\r\n _Typography2.default,\r\n Object.assign({ variant: 'h3',\r\n className: (0, _classnames2.default)(classes.currentStepTitle, _constants.MOBILE_STEPPER_LABEL_CLASSNAME),\r\n component: 'span'\r\n }, rest, {\r\n ref: ref\r\n }),\r\n props.children\r\n )\r\n );\r\n});\r\n\r\nMobileStepperLabel.propTypes = {\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The step title component.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Props will be passed into the rendered `` component.\r\n */\r\n props: _propTypes2.default.object\r\n};\r\n\r\nMobileStepperLabel.displayName = 'MobileStepperLabel';\r\n\r\nexports.default = (0, _styles2.default)(styles)(MobileStepperLabel);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Typography = require('../Typography');\r\n\r\nvar _Typography2 = _interopRequireDefault(_Typography);\r\n\r\nvar _Divider = require('../Divider');\r\n\r\nvar _Divider2 = _interopRequireDefault(_Divider);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = {\r\n root: {\r\n marginBottom: _tokens.spacingMedium\r\n }\r\n};\r\n\r\n/**\r\n * A component that displays the current step of the total steps\r\n */\r\nvar MobileStepperTitle = _react2.default.forwardRef(function (props, ref) {\r\n var withDivider = props.withDivider,\r\n children = props.children,\r\n classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['withDivider', 'children', 'classes']);\r\n\r\n return _react2.default.createElement(\r\n 'div',\r\n { className: classes.root, ref: ref },\r\n _react2.default.createElement(\r\n _Typography2.default,\r\n Object.assign({ variant: 'h2' }, rest),\r\n children\r\n ),\r\n withDivider && _react2.default.createElement(_Divider2.default, null)\r\n );\r\n});\r\n\r\nMobileStepperTitle.propTypes = {\r\n /**\r\n * The MobileStepper title value.\r\n */\r\n children: _propTypes2.default.oneOfType([_propTypes2.default.node, _propTypes2.default.string]),\r\n /**\r\n * @ignore\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * Props will be passed into the rendered `` component.\r\n */\r\n props: _propTypes2.default.object,\r\n /**\r\n * Render the MobileStepperTitle with a divider. Set false to use without a Divider.\r\n */\r\n withDivider: _propTypes2.default.bool\r\n};\r\n\r\nMobileStepperTitle.defaultProps = {\r\n withDivider: true\r\n};\r\n\r\nMobileStepperTitle.displayName = 'MobileStepperTitle';\r\n\r\nexports.default = (0, _styles2.default)(styles)(MobileStepperTitle);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _core = require('@material-ui/core');\r\n\r\nvar _constants = require('./internal/constants');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n borderColor: theme.palette.ctaColor.base\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * A single step in a stepper\r\n */\r\nvar Step = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n root: classes.root\r\n };\r\n\r\n return (\r\n /* These marker class names will be used by its parent component StepProgress */\r\n _react2.default.createElement(_core.Step, Object.assign({}, rest, {\r\n className: _constants.STEP_PROGRESS_STEP_CLASSNAME,\r\n classes: classOverrides,\r\n ref: ref\r\n }))\r\n );\r\n});\r\n\r\nStep.muiName = 'Step';\r\nStep.displayName = 'Step';\r\n\r\nStep.propTypes = {\r\n /**\r\n * Sets the step as active. Is passed to child components.\r\n */\r\n active: _propTypes2.default.bool,\r\n /**\r\n * Should be `Step` sub-components such as `StepLabel`, `StepContent`.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * Mark the step as completed. Is passed to child components.\r\n */\r\n completed: _propTypes2.default.bool,\r\n /**\r\n * Mark the step as disabled, will also disable the button if\r\n * `StepButton` is a child of `Step`. Is passed to child components.\r\n */\r\n disabled: _propTypes2.default.bool\r\n};\r\n\r\n// NOTE: we are very intentionally NOT providing defaults for these props; if any\r\n// value is assigned to the active, completed, or disabled props, those values will\r\n// supercede the directives of the parent StepProgress; ie, if the stepper tries to\r\n// set a Step to active, any defaults we declare here will override those settings\r\n\r\nexports.default = (0, _styles2.default)(styles)(Step);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _core = require('@material-ui/core');\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n outline: 'none',\r\n '&:focus': {\r\n boxShadow: '0 0 0 ' + _tokens.borderWidthThick + ' ' + _tokens.colorBrandSecondary\r\n }\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * A component that displays progress through numbered steps.\r\n */\r\nvar StepButton = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_core.StepButton, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nStepButton.muiName = 'StepButton';\r\nStepButton.displayName = 'StepButton';\r\n\r\nStepButton.propTypes = {\r\n /**\r\n * Can be a `StepLabel` or a node to place inside `StepLabel` as children.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The icon displayed by the step label.\r\n */\r\n icon: _propTypes2.default.node,\r\n /**\r\n * The optional node to display.\r\n */\r\n optional: _propTypes2.default.node\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(StepButton);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _core = require('@material-ui/core');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = {\r\n root: {}\r\n};\r\n\r\n/**\r\n * A component that displays progress through numbered steps.\r\n */\r\nvar StepContent = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_core.StepContent, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nStepContent.muiName = 'StepContent';\r\nStepContent.displayName = 'StepContent';\r\n\r\nStepContent.propTypes = {\r\n /**\r\n * Step content.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * Collapse component.\r\n */\r\n TransitionComponent: _propTypes2.default.elementType,\r\n /**\r\n * Adjust the duration of the content expand transition.\r\n * Passed as a property to the transition component.\r\n *\r\n * Set to 'auto' to automatically calculate transition time based on height.\r\n */\r\n transitionDuration: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.shape({ enter: _propTypes2.default.number, exit: _propTypes2.default.number }), _propTypes2.default.oneOf(['auto'])]),\r\n /**\r\n * Properties applied to the `Transition` element.\r\n */\r\n TransitionProps: _propTypes2.default.object\r\n};\r\n\r\nStepContent.defaultProps = {\r\n TransitionComponent: _core.Collapse,\r\n transitionDuration: 'auto'\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(StepContent);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _core = require('@material-ui/core');\r\n\r\nvar _Warning = require('@eui/ds-icons/lib/Warning');\r\n\r\nvar _Warning2 = _interopRequireDefault(_Warning);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nvar _Typography = require('../Typography');\r\n\r\nvar _Typography2 = _interopRequireDefault(_Typography);\r\n\r\nvar _constants = require('./internal/constants.js');\r\n\r\nvar _StepEdit = require('./internal/StepEdit');\r\n\r\nvar _StepEdit2 = _interopRequireDefault(_StepEdit);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n labelRoot: {\r\n fontFamily: theme.typography.body1.fontFamily,\r\n fontSize: theme.typography.body1.fontSize,\r\n fontWeight: theme.typography.body1.fontWeight,\r\n lineHeight: theme.typography.body1.lineHeight,\r\n color: theme.palette.grey[600]\r\n },\r\n labelError: {\r\n color: theme.palette.status.error.fill\r\n },\r\n stepIconRoot: {\r\n color: theme.palette.grey[100],\r\n borderRadius: '100%',\r\n border: _tokens.borderWidthThin + ' solid ' + theme.palette.ctaColor.base,\r\n '&$stepIconActive': {\r\n border: 'none',\r\n color: theme.palette.ctaColor.base,\r\n '&> text': {\r\n color: theme.palette.grey[100],\r\n fill: theme.palette.grey[100]\r\n }\r\n }\r\n },\r\n stepIconText: {\r\n fill: theme.palette.ctaColor.base\r\n },\r\n stepIconActive: {\r\n color: theme.palette.ctaColor.base\r\n },\r\n stepIconCustomRoot: {\r\n border: 'none',\r\n width: _tokens.sizingMedium,\r\n height: _tokens.sizingMedium,\r\n verticalAlign: 'middle'\r\n },\r\n stepIconError: {\r\n color: theme.palette.status.error.fill,\r\n fill: theme.palette.status.error.fill\r\n },\r\n stepIconCompleted: {\r\n color: theme.palette.ctaColor.base,\r\n fill: theme.palette.ctaColor.base\r\n },\r\n stepIconDisabled: {\r\n '& svg': {\r\n border: _tokens.borderWidthThin + ' solid ' + theme.palette.grey[400],\r\n '&> text': {\r\n color: theme.palette.grey[400],\r\n fill: theme.palette.grey[400]\r\n }\r\n }\r\n },\r\n stepLabelDisabled: {\r\n color: theme.palette.grey[400]\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * A component that displays progress through numbered steps.\r\n */\r\nvar StepLabel = _react2.default.forwardRef(function (props, ref) {\r\n var _classNames;\r\n\r\n var classes = props.classes,\r\n children = props.children,\r\n error = props.error,\r\n completed = props.completed,\r\n optional = props.optional,\r\n disabled = props.disabled,\r\n StepIconProps = props.StepIconProps,\r\n rest = _objectWithoutProperties(props, ['classes', 'children', 'error', 'completed', 'optional', 'disabled', 'StepIconProps']);\r\n\r\n var defaultOverrides = {\r\n StepIconProps: Object.assign({\r\n classes: {\r\n root: classes.stepIconRoot,\r\n text: classes.stepIconText,\r\n active: classes.stepIconActive,\r\n completed: classes.stepIconActive,\r\n error: classes.stepIconError\r\n }\r\n }, StepIconProps)\r\n };\r\n\r\n if (optional) {\r\n defaultOverrides.optional = _react2.default.createElement(\r\n _Typography2.default,\r\n {\r\n variant: 'body3',\r\n color: 'textSecondary',\r\n align: props.alternativeLabel ? 'center' : 'left'\r\n },\r\n optional\r\n );\r\n }\r\n\r\n if (error) {\r\n // Assign new error icon\r\n defaultOverrides.StepIconProps.icon = _react2.default.createElement(_Warning2.default, { className: (0, _classnames2.default)(classes.stepIconError, classes.stepIconCustomRoot) });\r\n\r\n // if error is a string make the optional prop print the error message\r\n if (error.length > 0) {\r\n /* These marker class names will be used by its parent component StepProgress */\r\n defaultOverrides.optional = _react2.default.createElement(\r\n _Typography2.default,\r\n {\r\n variant: 'body3',\r\n className: (0, _classnames2.default)(classes.labelError, _constants.STEP_LABEL_ERROR_CLASSNAME),\r\n align: props.alternativeLabel ? 'center' : 'left'\r\n },\r\n error\r\n );\r\n }\r\n }\r\n\r\n if (props.active) {\r\n defaultOverrides.StepIconProps.icon = _react2.default.createElement(_StepEdit2.default, { className: classes.stepIconActive });\r\n }\r\n\r\n // NOTE: This icon is not in the @eui/ds-icons package\r\n // if (completed) {\r\n // // Assign new check icon\r\n // defaultOverrides.StepIconProps.icon = (\r\n // \r\n // );\r\n // }\r\n\r\n return _react2.default.createElement(\r\n _core.StepLabel,\r\n Object.assign({}, defaultOverrides, {\r\n classes: {\r\n disabled: !error && disabled && classes.stepIconDisabled\r\n },\r\n disabled: disabled,\r\n completed: completed\r\n }, rest, {\r\n ref: ref\r\n }),\r\n _react2.default.createElement(\r\n 'span',\r\n { className: (0, _classnames2.default)(classes.labelRoot, '' + _constants.STEP_LABEL_CLASSNAME, (_classNames = {}, _defineProperty(_classNames, classes.labelError, error), _defineProperty(_classNames, _constants.STEP_LABEL_HAS_ERROR_CLASSNAME, error), _defineProperty(_classNames, classes.stepLabelDisabled, disabled && !error), _classNames)) },\r\n children\r\n )\r\n );\r\n});\r\n\r\nStepLabel.muiName = 'StepLabel';\r\nStepLabel.displayName = 'StepLabel';\r\n\r\nStepLabel.propTypes = {\r\n /**\r\n * @ignore\r\n * Sets the step as active. Is passed to child components.\r\n */\r\n active: _propTypes2.default.bool,\r\n /**\r\n * @ignore\r\n * Set internally by Stepper when it's supplied with the alternativeLabel property.\r\n */\r\n alternativeLabel: _propTypes2.default.bool,\r\n /**\r\n * In most cases will simply be a string containing a title for the label.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * @ignore\r\n * Mark the step as completed. Is passed to child components.\r\n */\r\n completed: _propTypes2.default.bool,\r\n /**\r\n * Mark the step as disabled, will also disable the button if\r\n * `StepLabelButton` is a child of `StepLabel`. Is passed to child components.\r\n */\r\n disabled: _propTypes2.default.bool,\r\n /**\r\n * Used to mark the step in an error state and provide an error message.\r\n */\r\n error: _propTypes2.default.any,\r\n /**\r\n * Override the default icon.\r\n */\r\n icon: _propTypes2.default.node,\r\n /**\r\n * The optional text to display.\r\n */\r\n optional: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.object])\r\n};\r\n\r\nStepLabel.defaultProps = {\r\n error: false\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(StepLabel);","\"use strict\";\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require(\"react\");\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nvar StepEdit = function StepEdit(props) {\r\n return _react2.default.createElement(\r\n \"svg\",\r\n Object.assign({}, props, { width: \"24px\", height: \"24px\", viewBox: \"0 0 32 32\", xmlns: \"http://www.w3.org/2000/svg\" }),\r\n _react2.default.createElement(\r\n \"defs\",\r\n null,\r\n _react2.default.createElement(\"path\", { d: \"M15.3627681,2.30077663 L13.6796131,0.61830983 C12.8553012,-0.206032963 11.5209897,-0.206157963 10.6964903,0.61827858 L0.778435041,10.4715172 L0.0102793522,15.1276367 C-0.0733143368,15.6343549 0.365529093,16.0732919 0.872372473,15.9897295 L5.52846282,15.2215429 L15.3823931,5.3034919 C16.205205,4.4806491 16.2130488,3.15102564 15.3627681,2.30077663 Z M3.77012036,9.4374871 L9.09071022,4.15139948 L11.848552,6.90924003 L6.56249332,12.2298276 L6.56249332,10.9374854 L5.06249441,10.9374854 L5.06249441,9.4374871 L3.77012036,9.4374871 Z M2.56662124,14.3166064 L1.68340313,13.4333887 L2.06277785,11.1337976 L2.63777743,10.5624858 L3.93749523,10.5624858 L3.93749523,12.0624858 L5.43749414,12.0624858 L5.43749414,13.36217 L4.86618206,13.9372006 L2.56662124,14.3166064 L2.56662124,14.3166064 Z M14.4098938,4.33121177 L14.4083001,4.33280552 L14.4067063,4.33439927 L12.9057699,5.84514752 L10.1548344,3.09421321 L11.6655833,1.59327745 L11.6671458,1.59171495 L11.6687083,1.59015245 C11.9545519,1.30434028 12.4180203,1.30080904 12.7073326,1.5901212 L14.3902689,3.27305675 C14.6989561,3.58171264 14.7008624,4.04021211 14.4098938,4.33121177 L14.4098938,4.33121177 Z\", id: \"path-1\" })\r\n ),\r\n _react2.default.createElement(\r\n \"g\",\r\n { id: \"Components\", stroke: \"none\", strokeWidth: \"1\", fill: \"none\", fillRule: \"evenodd\" },\r\n _react2.default.createElement(\r\n \"g\",\r\n { id: \"Step-Progress\", transform: \"translate(-288.000000, -636.000000)\" },\r\n _react2.default.createElement(\r\n \"g\",\r\n { id: \"Steps-[16h]\", transform: \"translate(69.000000, 636.000000)\" },\r\n _react2.default.createElement(\r\n \"g\",\r\n { id: \"Step\", transform: \"translate(219.000000, 0.000000)\" },\r\n _react2.default.createElement(\r\n \"g\",\r\n { id: \"Group\" },\r\n _react2.default.createElement(\r\n \"g\",\r\n { id: \"Misc/Pagination/Button/Outline\" },\r\n _react2.default.createElement(\"circle\", { id: \"Circle\", stroke: \"currentColor\", strokeWidth: \"1\", fill: \"#FFFFFF\", fillRule: \"evenodd\", cx: \"16\", cy: \"16\", r: \"15.5\" }),\r\n _react2.default.createElement(\"g\", { id: \"Buttons/zFocused/Off\" }),\r\n _react2.default.createElement(\r\n \"g\",\r\n { id: \"1)-Main-Use/edit\", transform: \"translate(8.000000, 8.000000)\" },\r\n _react2.default.createElement(\r\n \"mask\",\r\n { id: \"mask-2\", fill: \"white\" },\r\n _react2.default.createElement(\"use\", { xlinkHref: \"#path-1\" })\r\n ),\r\n _react2.default.createElement(\"use\", { id: \"1---Main-Use/edit\", fill: \"currentColor\", fillRule: \"evenodd\", xlinkHref: \"#path-1\" })\r\n )\r\n )\r\n )\r\n )\r\n )\r\n )\r\n )\r\n );\r\n};\r\n\r\nexports.default = StepEdit;","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _Slider = require('./Slider');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_Slider).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\nexports.styles = undefined;\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Slider = require('@material-ui/core/Slider');\r\n\r\nvar _Slider2 = _interopRequireDefault(_Slider);\r\n\r\nvar _EDSContext = require('../EDSContext/EDSContext');\r\n\r\nvar _Circle = require('@eui/ds-icons/lib/Circle');\r\n\r\nvar _Circle2 = _interopRequireDefault(_Circle);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n// import { } from '../styles/tokens';\r\n\r\nvar styles = exports.styles = function styles(theme) {\r\n return {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: {},\r\n sliderThumb: {\r\n fill: theme.palette.primary.main,\r\n backgroundColor: theme.palette.primary.main,\r\n borderRadius: '2.5rem'\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * A tool to select a value within a range.\r\n * @done false\r\n * @updated false\r\n * @versionAdded v0.0.8\r\n * @examples\r\n * SliderExample\r\n */\r\nvar Slider = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n edsContext = props.edsContext,\r\n rest = _objectWithoutProperties(props, ['classes', 'edsContext']);\r\n\r\n var classOverrides = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_Slider2.default, Object.assign({}, rest, {\r\n thumb: _react2.default.createElement(_Circle2.default, { 'aria-label': edsContext.formatMessage('component.Slider.thumb'), className: classes.sliderThumb }),\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nSlider.muiName = 'Slider';\r\nSlider.displayName = 'Slider';\r\n\r\nSlider.propTypes = {\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * The component used for the root node.\r\n * Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * If `true`, the slider will be disabled.\r\n */\r\n disabled: _propTypes2.default.bool,\r\n /**\r\n * @ignore\r\n */\r\n edsContext: _propTypes2.default.object,\r\n /**\r\n * The maximum allowed value of the slider.\r\n * Should not be equal to min.\r\n */\r\n max: _propTypes2.default.number,\r\n /**\r\n * The minimum allowed value of the slider.\r\n * Should not be equal to max.\r\n */\r\n min: _propTypes2.default.number,\r\n /**\r\n * Callback function that is fired when the slider's value changed.\r\n */\r\n onChange: _propTypes2.default.func,\r\n /**\r\n * The granularity the slider can step through values.\r\n */\r\n step: _propTypes2.default.number,\r\n /**\r\n * @ignore\r\n */\r\n theme: _propTypes2.default.object,\r\n /**\r\n * The value of the slider.\r\n */\r\n value: _propTypes2.default.number.isRequired,\r\n /**\r\n * The slider orientation.\r\n */\r\n orientation: _propTypes2.default.oneOf(['horizontal', 'vertical'])\r\n};\r\n\r\n// If default props are needed, they must be set here\r\nSlider.defaultProps = {\r\n orientation: 'horizontal'\r\n};\r\n\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _styles2.default)(styles)(Slider));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _Avatar = require('./Avatar');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_Avatar).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Avatar = require('@material-ui/core/Avatar');\r\n\r\nvar _Avatar2 = _interopRequireDefault(_Avatar);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n// Necessary design tokens are imported here\r\n\r\n\r\nvar styles = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: {},\r\n colorDefault: {\r\n backgroundColor: _tokens.colorBrandNeutral500\r\n }\r\n};\r\n\r\n/**\r\n * A component that creates a graphical representation of a user.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.8\r\n * @examples\r\n * AvatarIcon\r\n * AvatarImage\r\n * AvatarLetter\r\n */\r\nvar Avatar = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: classes.root,\r\n colorDefault: classes.colorDefault\r\n };\r\n\r\n return _react2.default.createElement(_Avatar2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nAvatar.muiName = 'Avatar';\r\n\r\nAvatar.propTypes = {\r\n /**\r\n * Used in combination with src or srcSet to provide an alt attribute for the rendered img element.\r\n */\r\n alt: _propTypes2.default.string,\r\n /**\r\n * Used to render icon or text elements inside the Avatar. src and alt props will not be used and no img will be rendered by default.\r\n * This can be an element, or just a string.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The component used for the root node. Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOf(['string', 'func', 'object']),\r\n /**\r\n * Attributes applied to the img element when the component is used to display an image.\r\n */\r\n imgProps: _propTypes2.default.object,\r\n /**\r\n * The sizes attribute for the img element.\r\n */\r\n sizes: _propTypes2.default.string,\r\n /**\r\n * The src attribute for the img element.\r\n */\r\n src: _propTypes2.default.string,\r\n /**\r\n * The srcSet attribute for the img element.\r\n */\r\n srcSet: _propTypes2.default.string\r\n};\r\n\r\n// necessary to add an explicit display name, since docgen can't seem to\r\n// extract one from a forwardRef'd component\r\nAvatar.displayName = 'Avatar';\r\n\r\n// If default props are needed, they must be set here\r\n//Avatar.defaultProps = {\r\n//};\r\n\r\nexports.default = (0, _styles2.default)(styles)(Avatar);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _Popover = require('./Popover');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_Popover).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Popover = require('@material-ui/core/Popover');\r\n\r\nvar _Popover2 = _interopRequireDefault(_Popover);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n paperRoot: {}\r\n};\r\n\r\n/**\r\n * Use `Popover` to display additional content.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.8\r\n * @examples\r\n * PopoverExamples\r\n */\r\nvar Popover = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n // This component passes through to an internal paper element to style the pertinent area\r\n // By default it passes the paper class above, but that can be overridden by downstream\r\n // NOTE! There appears to be a problem preventing styling currently, see the expected behavior here: https://codesandbox.io/s/wq78039yol\r\n\r\n\r\n var PaperProps = {\r\n classes: {\r\n root: classes.paperRoot\r\n }\r\n };\r\n\r\n return _react2.default.createElement(_Popover2.default, Object.assign({}, rest, {\r\n PaperProps: PaperProps,\r\n ref: ref\r\n }));\r\n});\r\n\r\nPopover.muiName = 'Popover';\r\nPopover.displayName = 'Popover';\r\n\r\nPopover.propTypes = {\r\n /**\r\n * This is callback property. It's called by the component on mount.\r\n * This is useful when you want to trigger an action programmatically.\r\n * It currently only supports updatePosition() action.\r\n *\r\n * @param {object} actions This object contains all posible actions\r\n * that can be triggered programmatically.\r\n */\r\n action: _propTypes2.default.func,\r\n /**\r\n * This is the DOM element, or a function that returns the DOM element,\r\n * that may be used to set the position of the popover.\r\n */\r\n anchorEl: _propTypes2.default.oneOfType([_propTypes2.default.object, _propTypes2.default.func]),\r\n /**\r\n * This is the point on the anchor where the popover's\r\n * `anchorEl` will attach to. This is not used when the\r\n * anchorReference is 'anchorPosition'.\r\n *\r\n * Options:\r\n * vertical: [top, center, bottom];\r\n * horizontal: [left, center, right].\r\n */\r\n anchorOrigin: _propTypes2.default.shape({\r\n horizontal: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.oneOf(['left', 'center', 'right'])]),\r\n vertical: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.oneOf(['top', 'center', 'bottom'])])\r\n }),\r\n /**\r\n * This is the position that may be used\r\n * to set the position of the popover.\r\n * The coordinates are relative to\r\n * the application's client area.\r\n */\r\n anchorPosition: _propTypes2.default.shape({\r\n top: _propTypes2.default.number,\r\n left: _propTypes2.default.number\r\n }),\r\n /*\r\n * This determines which anchor prop to refer to to set\r\n * the position of the popover.\r\n */\r\n anchorReference: _propTypes2.default.oneOf(['anchorEl', 'anchorPosition', 'none']),\r\n /**\r\n * Supported props for the Backdrop of Popover:\r\n *\r\n * children: The content of the component.\r\n *\r\n * classes: Override or extend the styles applied to the component.\r\n *\r\n * invisible: If true, the backdrop is invisible.\r\n *\r\n * open: If true, the backdrop is open.\r\n *\r\n * tranistionDuration: The duration for the transition, in milliseconds. You may specify a single timeout for all transitions, or individually with an object.\r\n *\r\n * See more detailed information here: https://material-ui.com/api/backdrop/\r\n */\r\n BackdropProps: _propTypes2.default.object,\r\n /**\r\n * The content of the component.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * A node, component instance, or function that returns either.\r\n * The `container` will passed to the Modal component.\r\n * By default, it uses the body of the anchorEl's top-level document object,\r\n * so it's simply `document.body` most of the time.\r\n */\r\n container: _propTypes2.default.oneOfType([_propTypes2.default.object, _propTypes2.default.func]),\r\n /**\r\n * The elevation of the popover.\r\n */\r\n elevation: _propTypes2.default.number,\r\n /**\r\n * This function is called in order to retrieve the content anchor element.\r\n * It's the opposite of the `anchorEl` property.\r\n * The content anchor element should be an element inside the popover.\r\n * It's used to correctly scroll and set the position of the popover.\r\n * The positioning strategy tries to make the content anchor element just above the\r\n * anchor element.\r\n */\r\n getContentAnchorEl: _propTypes2.default.func,\r\n /**\r\n * Specifies how close to the edge of the window the popover can appear.\r\n */\r\n marginThreshold: _propTypes2.default.number,\r\n /**\r\n * Callback fired when the component requests to be closed.\r\n *\r\n * @param {object} event The event source of the callback.\r\n */\r\n onClose: _propTypes2.default.func,\r\n /**\r\n * Callback fired before the component is entering.\r\n */\r\n onEnter: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the component has entered.\r\n */\r\n onEntered: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the component is entering.\r\n */\r\n onEntering: _propTypes2.default.func,\r\n /**\r\n * Callback fired before the component is exiting.\r\n */\r\n onExit: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the component has exited.\r\n */\r\n onExited: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the component is exiting.\r\n */\r\n onExiting: _propTypes2.default.func,\r\n /**\r\n * If `true`, the popover is visible.\r\n */\r\n open: _propTypes2.default.bool.isRequired,\r\n /**\r\n * Properties applied to the `Paper` element.\r\n */\r\n PaperProps: _propTypes2.default.object,\r\n /**\r\n * @ignore\r\n */\r\n role: _propTypes2.default.string,\r\n /**\r\n * This is the point on the popover which\r\n * will attach to the anchor's origin.\r\n *\r\n * Options:\r\n * vertical: [top, center, bottom, x(px)];\r\n * horizontal: [left, center, right, x(px)].\r\n */\r\n transformOrigin: _propTypes2.default.shape({\r\n horizontal: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.oneOf(['left', 'center', 'right'])]),\r\n vertical: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.oneOf(['top', 'center', 'bottom'])])\r\n }),\r\n /**\r\n * Transition component.\r\n */\r\n TransitionComponent: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * Set to 'auto' to automatically calculate transition time based on height.\r\n */\r\n transitionDuration: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.shape({ enter: _propTypes2.default.number, exit: _propTypes2.default.number }), _propTypes2.default.oneOf(['auto'])]),\r\n /**\r\n * Properties applied to the `Transition` element.\r\n */\r\n TransitionProps: _propTypes2.default.object\r\n};\r\n\r\n// If default props are needed, they must be set here\r\n// Popover.defaultProps = { };\r\n\r\nexports.default = (0, _styles2.default)(styles)(Popover);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _Chip = require('./Chip');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_Chip).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Chip = require('@material-ui/core/Chip');\r\n\r\nvar _Chip2 = _interopRequireDefault(_Chip);\r\n\r\nvar _Close = require('@eui/ds-icons/lib/Close');\r\n\r\nvar _Close2 = _interopRequireDefault(_Close);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {\r\n backgroundColor: theme.palette.grey[100],\r\n border: _tokens.borderWidthThin + ' solid ' + theme.palette.grey[400],\r\n color: theme.palette.grey[500],\r\n fontSize: _tokens.fontSizeDefault\r\n },\r\n activatedRoot: {\r\n backgroundColor: theme.palette.ctaColor.tint,\r\n border: _tokens.borderWidthThin + ' solid ' + theme.palette.ctaColor.base,\r\n color: theme.palette.ctaColor.base,\r\n '&:hover': {\r\n backgroundColor: theme.palette.ctaColor.tint\r\n },\r\n '&:active': {\r\n boxShadow: 'none',\r\n backgroundColor: theme.palette.ctaColor.tint\r\n }\r\n },\r\n label: {\r\n paddingLeft: _tokens.spacingSmall,\r\n paddingRight: _tokens.spacingSmall,\r\n paddingBottom: '0.125rem' // Push label up by 2px to perfectly center\r\n },\r\n labelWithIcon: {\r\n paddingRight: _tokens.spacingXSmall2\r\n },\r\n clickable: {\r\n WebkitTapHighlightColor: 'transparent', // Remove grey highlight\r\n cursor: 'pointer',\r\n '&:hover': {\r\n backgroundColor: theme.palette.grey[100]\r\n },\r\n '&:focus': {\r\n backgroundColor: theme.palette.grey[100],\r\n boxShadow: '0 0 0 ' + _tokens.borderWidthThick + ' ' + _tokens.colorBrandSecondary\r\n },\r\n '&:active': {\r\n backgroundColor: theme.palette.grey[300],\r\n boxShadow: 'none'\r\n },\r\n '&:active:focus': {\r\n boxShadow: 'none',\r\n backgroundColor: theme.palette.grey[300]\r\n },\r\n '&$activatedRoot': {\r\n backgroundColor: theme.palette.ctaColor.tint,\r\n border: _tokens.borderWidthThin + ' solid ' + theme.palette.ctaColor.base,\r\n color: theme.palette.ctaColor.base,\r\n '&:hover': {\r\n backgroundColor: theme.palette.ctaColor.tint\r\n },\r\n '&:focus': {\r\n backgroundColor: theme.palette.ctaColor.tint,\r\n boxShadow: '0 0 0 ' + _tokens.borderWidthThick + ' ' + _tokens.colorBrandSecondary\r\n },\r\n '&:active': {\r\n boxShadow: 'none',\r\n backgroundColor: theme.palette.ctaColor.tint\r\n }\r\n }\r\n },\r\n deletable: {\r\n '&:focus': {\r\n backgroundColor: theme.palette.grey[100],\r\n boxShadow: '0 0 0 ' + _tokens.borderWidthThick + ' ' + _tokens.colorBrandSecondary\r\n },\r\n '&$activatedRoot': {\r\n '&:focus': {\r\n backgroundColor: theme.palette.ctaColor.tint,\r\n boxShadow: '0 0 0 ' + _tokens.borderWidthThick + ' ' + _tokens.colorBrandSecondary\r\n }\r\n }\r\n },\r\n deleteIcon: {\r\n boxSizing: 'initial', // required to fix stylistic differences between storybook and doc site\r\n height: _tokens.sizingSmall,\r\n width: _tokens.sizingSmall,\r\n color: theme.palette.grey[500],\r\n fill: theme.palette.grey[500],\r\n borderRadius: _tokens.borderRadiusCircle,\r\n padding: _tokens.spacingXxSmall,\r\n '&:hover': {\r\n backgroundColor: theme.palette.grey[300]\r\n },\r\n '&:active': {\r\n backgroundColor: theme.palette.grey[400]\r\n }\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * Use `Chip` to represent a selected item or filter.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.8\r\n * @examples\r\n * ChipExamples\r\n * ChipActions\r\n * ChipGroup\r\n * ListActivatedChips\r\n * SelectedContentWithChips\r\n */\r\nvar Chip = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n activated = props.activated,\r\n rest = _objectWithoutProperties(props, ['classes', 'activated']);\r\n\r\n return _react2.default.createElement(_Chip2.default, Object.assign({\r\n classes: {\r\n root: (0, _classnames2.default)(classes.root, _defineProperty({}, classes.activatedRoot, activated)),\r\n label: (0, _classnames2.default)(classes.label, _defineProperty({}, classes.labelWithIcon, props.onDelete)),\r\n clickable: classes.clickable,\r\n deletable: classes.deletable,\r\n deleteIcon: classes.deleteIcon\r\n },\r\n deleteIcon: _react2.default.createElement(_Close2.default, null)\r\n }, rest, {\r\n ref: ref\r\n }));\r\n});\r\n\r\nChip.muiName = 'Chip';\r\n\r\nChip.propTypes = {\r\n /**\r\n * Set the chip to active, using the theme CTA color.\r\n */\r\n activated: _propTypes2.default.bool,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * If true, the chip will appear clickable, and will raise when pressed,\r\n * even if the onClick property is not defined. This can be used, for example,\r\n * along with the component property to indicate an anchor Chip is clickable.\r\n */\r\n clickable: _propTypes2.default.bool,\r\n /**\r\n * The component used for the root node.\r\n * Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * The content of the `Chip` label.\r\n */\r\n label: _propTypes2.default.node,\r\n /**\r\n * Callback to fire when the `Chip` is clicked on or `space` or `enter` keys are pressed when the Chip has focus.\r\n */\r\n onClick: _propTypes2.default.func,\r\n /**\r\n * Callback function fired when the delete icon is clicked or `backspace` key is pressed when the `Chip` has focus.\r\n * If set, the delete icon will be shown.\r\n */\r\n onDelete: _propTypes2.default.func,\r\n /**\r\n * @ignore\r\n */\r\n onKeyDown: _propTypes2.default.func,\r\n /**\r\n * @ignore\r\n */\r\n tabIndex: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.string])\r\n};\r\n\r\nChip.displayName = 'Chip';\r\n\r\nexports.default = (0, _styles2.default)(styles)(Chip);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _CircularProgress = require('./CircularProgress');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_CircularProgress).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _CircularProgress = require('@material-ui/core/CircularProgress');\r\n\r\nvar _CircularProgress2 = _interopRequireDefault(_CircularProgress);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\n// Necessary design tokens are imported here\r\n//import { } from '../styles/tokens';\r\n\r\nvar styles = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: {}\r\n};\r\n\r\n/**\r\n * Use `CircularProgress` to indicate work is being done \"behind the scenes\" when a user initiates a call to action (loading, working, etc).\r\n * @done false\r\n * @updated false\r\n * @versionAdded v0.0.8\r\n * @examples\r\n * CircularProgressIndeterminate\r\n * CircularProgressDeterminate\r\n * CircularProgressStatic\r\n */\r\nvar CircularProgress = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n // Necessary style overrides are set here\r\n // See Material UI documentation for available CSS classes to override\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_CircularProgress2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nCircularProgress.muiName = 'CircularProgress';\r\nCircularProgress.displayName = 'CircularProgress';\r\n\r\nCircularProgress.propTypes = {\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * The color of the component. It supports those theme colors that make sense for this component.\r\n */\r\n color: _propTypes2.default.oneOf(['primary', 'secondary', 'inherit']),\r\n /**\r\n * If true, the shrink animation is disabled. This only works if variant is indeterminate.\r\n */\r\n disableShrink: _propTypes2.default.bool,\r\n /**\r\n * The size of the circle.\r\n * If using a number, the pixel unit is assumed.\r\n * If using a string, you need to provide the CSS unit, e.g '3rem'.\r\n */\r\n size: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.string]),\r\n /**\r\n * @ignore\r\n */\r\n style: _propTypes2.default.object,\r\n /**\r\n * The thickness of the circle.\r\n */\r\n thickness: _propTypes2.default.number,\r\n /**\r\n * The value of the progress indicator for the determinate and static variants.\r\n * Value between 0 and 100.\r\n */\r\n value: _propTypes2.default.number,\r\n /**\r\n * The variant to use.\r\n * Use indeterminate when there is no progress value.\r\n */\r\n variant: _propTypes2.default.oneOf(['determinate', 'indeterminate', 'static'])\r\n};\r\n\r\nCircularProgress.defaultProps = {\r\n color: 'primary',\r\n disableShrink: false,\r\n size: 40,\r\n thickness: 3.6,\r\n value: 0,\r\n variant: 'indeterminate'\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(CircularProgress);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _PageHeader = require('./PageHeader');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_PageHeader).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Typography = require('../Typography');\r\n\r\nvar _Typography2 = _interopRequireDefault(_Typography);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nvar styles = function styles(theme) {\r\n var _pageHeader;\r\n\r\n return {\r\n pageHeader: (_pageHeader = {\r\n paddingTop: _tokens.spacingLarge,\r\n paddingBottom: _tokens.spacingMedium,\r\n lineHeight: '2.625rem',\r\n color: theme.palette.grey[600]\r\n }, _defineProperty(_pageHeader, theme.breakpoints.up('lg'), {\r\n fontSize: _tokens.fontSizeHeader1\r\n }), _defineProperty(_pageHeader, theme.breakpoints.down('md'), {\r\n fontSize: _tokens.fontSizeHeader1Small\r\n }), _pageHeader)\r\n };\r\n};\r\n\r\n/**\r\n * Use `PageHeader` to display a page title at the top of a page.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.8\r\n * @examples\r\n * PageHeaderExample\r\n */\r\nvar PageHeader = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n text = props.text,\r\n rest = _objectWithoutProperties(props, ['classes', 'text']);\r\n\r\n var classOverrides = {\r\n h1: classes.pageHeader\r\n };\r\n\r\n return _react2.default.createElement(\r\n _Typography2.default,\r\n Object.assign({}, rest, { classes: classOverrides, variant: 'h1', ref: ref }),\r\n text\r\n );\r\n});\r\n\r\nPageHeader.muiName = 'PageHeader';\r\nPageHeader.displayName = 'PageHeader';\r\n\r\nPageHeader.propTypes = {\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * The content to be displayed as the page header.\r\n */\r\n text: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.node])\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(PageHeader);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _StatusLabel = require('./StatusLabel');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_StatusLabel).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Typography = require('../Typography');\r\n\r\nvar _Typography2 = _interopRequireDefault(_Typography);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n // Necessary style overrides are set here\r\n root: {\r\n display: 'inline-block',\r\n fontFamily: theme.typography.fontFamily,\r\n fontSize: theme.typography.caption.fontSize,\r\n fontWeight: theme.typography.button.fontWeight,\r\n padding: _tokens.spacingXxSmall + ' ' + _tokens.spacingXSmall\r\n },\r\n default: {\r\n backgroundColor: theme.palette.status.default.background,\r\n color: theme.palette.status.default.text\r\n },\r\n draft: {\r\n backgroundColor: theme.palette.status.warning.background,\r\n color: theme.palette.status.warning.text\r\n },\r\n error: {\r\n backgroundColor: theme.palette.status.error.background,\r\n color: theme.palette.status.error.text\r\n },\r\n pending: {\r\n backgroundColor: theme.palette.status.neutral.background,\r\n color: theme.palette.status.neutral.text\r\n },\r\n success: {\r\n backgroundColor: theme.palette.status.success.background,\r\n color: theme.palette.status.success.text\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * Use a `StatusLabel` to indicate the status or category of an item.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.10\r\n * @examples\r\n * StatusLabelExample\r\n * StatusLabelTableExample\r\n * StatusLabelText\r\n */\r\nvar StatusLabel = _react2.default.forwardRef(function (props, ref) {\r\n var _classNames;\r\n\r\n var classes = props.classes,\r\n className = props.className,\r\n textProp = props.text,\r\n typeProp = props.type,\r\n rest = _objectWithoutProperties(props, ['classes', 'className', 'text', 'type']);\r\n\r\n var text = textProp.toUpperCase();\r\n var type = typeProp.toLowerCase();\r\n\r\n var classOverrides = {\r\n //CSS classes to override from Material UI Typography CSS API\r\n root: (0, _classnames2.default)(classes.root, (_classNames = {}, _defineProperty(_classNames, classes.default, type === 'default'), _defineProperty(_classNames, classes.draft, type === 'draft'), _defineProperty(_classNames, classes.error, type === 'error'), _defineProperty(_classNames, classes.pending, type === 'pending'), _defineProperty(_classNames, classes.success, type === 'success'), _classNames), className)\r\n };\r\n\r\n return _react2.default.createElement(\r\n _Typography2.default,\r\n Object.assign({ component: 'span',\r\n classes: classOverrides,\r\n ref: ref\r\n }, rest),\r\n text\r\n );\r\n});\r\n\r\nStatusLabel.muiName = 'StatusLabel';\r\n\r\nStatusLabel.propTypes = {\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * Text for the component to display\r\n */\r\n text: _propTypes2.default.string.isRequired,\r\n /**\r\n * Type of status to indicate (default, draft, error, pending, success)\r\n */\r\n type: _propTypes2.default.oneOf(['default', 'draft', 'error', 'pending', 'success'])\r\n};\r\n\r\nStatusLabel.displayName = 'StatusLabel';\r\n\r\nStatusLabel.defaultProps = {\r\n type: 'default'\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(StatusLabel);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nvar _isEmpty = require('lodash/isEmpty');\r\n\r\nvar _isEmpty2 = _interopRequireDefault(_isEmpty);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n link: {\r\n color: theme.palette.ctaColor.base,\r\n textDecoration: 'underline',\r\n '&:hover': {\r\n color: theme.palette.ctaColor.hover,\r\n textDecoration: 'underline',\r\n cursor: 'pointer'\r\n },\r\n '&:active': {\r\n color: theme.palette.ctaColor.active,\r\n textDecoration: 'underline'\r\n },\r\n '&:focus': {\r\n outline: 'none',\r\n textDecoration: 'underline',\r\n borderRadius: _tokens.borderRadiusSmall,\r\n boxShadow: '0 0 0 ' + _tokens.borderWidthThick + ' ' + _tokens.colorBorderGlobalFocus\r\n }\r\n },\r\n disabled: {\r\n fontFamily: 'inherit',\r\n fontSize: 'inherit',\r\n fontWeight: 'inherit',\r\n textDecoration: 'underline',\r\n color: _tokens.colorTextNeutral400\r\n },\r\n standalone: {\r\n fontFamily: _tokens.fontFamilyDefault,\r\n fontSize: _tokens.fontSizeDefault,\r\n fontWeight: _tokens.fontWeightStrong\r\n },\r\n inline: {\r\n fontFamily: 'inherit',\r\n fontSize: 'inherit',\r\n fontWeight: 'inherit'\r\n }\r\n };\r\n};\r\n\r\n/**\r\n * Use `TextLink` to take the user to a new page.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.10\r\n * @examples\r\n * TextLinkExample\r\n * CustomComponent\r\n */\r\nvar TextLink = _react2.default.forwardRef(function (props, ref) {\r\n var _classNames;\r\n\r\n var classes = props.classes,\r\n className = props.className,\r\n Component = props.component,\r\n disabled = props.disabled,\r\n text = props.text,\r\n url = props.url,\r\n variant = props.variant,\r\n rest = _objectWithoutProperties(props, ['classes', 'className', 'component', 'disabled', 'text', 'url', 'variant']);\r\n\r\n var classOverrides = {\r\n stateStyle: (0, _classnames2.default)((_classNames = {}, _defineProperty(_classNames, classes.disabled, disabled), _defineProperty(_classNames, classes.link, !disabled), _defineProperty(_classNames, classes.standalone, variant === 'standalone'), _defineProperty(_classNames, classes.inline, variant === 'inline'), _classNames), className)\r\n };\r\n\r\n (0, _react.useEffect)(function () {\r\n if (props.component === 'a' && (0, _isEmpty2.default)(props.url)) {\r\n console.warn('url prop is required for TextLink component.');\r\n }\r\n }, [props.component, props.url]);\r\n\r\n if (disabled) {\r\n return _react2.default.createElement(\r\n Component,\r\n Object.assign({\r\n 'aria-disabled': 'true',\r\n className: classOverrides.stateStyle\r\n }, rest),\r\n text\r\n );\r\n } else {\r\n return _react2.default.createElement(\r\n Component,\r\n Object.assign({\r\n href: url,\r\n className: classOverrides.stateStyle\r\n }, rest, {\r\n ref: ref\r\n }),\r\n text\r\n );\r\n }\r\n});\r\n\r\nTextLink.muiName = 'TextLink';\r\nTextLink.displayName = 'TextLink';\r\n\r\nTextLink.propTypes = {\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * Custom className for additional styling\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * The component used for the root node. We recommend using a component or element\r\n * that supports the `href` prop.\r\n */\r\n component: _propTypes2.default.elementType,\r\n /**\r\n * Set to true to disable the link\r\n */\r\n disabled: _propTypes2.default.bool,\r\n /**\r\n * The text that the link will display\r\n */\r\n text: _propTypes2.default.string.isRequired,\r\n /**\r\n * The redirect URL. This prop is required if replacement `component` prop is not specified.\r\n */\r\n url: _propTypes2.default.string,\r\n /**\r\n * Style variant of the TextLink to be displayed. inherit
will inherit font weight, font size, and font family from surrounding text. standalone
is to be used for a TextLink
that is not surrounded by other text.\r\n */\r\n variant: _propTypes2.default.oneOf(['standalone', 'inherit'])\r\n};\r\n\r\nTextLink.defaultProps = {\r\n component: 'a',\r\n disabled: false,\r\n variant: 'standalone'\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(TextLink);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _ConfirmationDialog = require('./ConfirmationDialog');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_ConfirmationDialog).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _ = require('../');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\n/**\r\n * Use `ConfirmationDialog` to require user action before closing a dialog.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.10\r\n * @examples\r\n * ConfirmationDialogExample\r\n * FormDialogExample\r\n */\r\nvar ConfirmationDialog = _react2.default.forwardRef(function (props, ref) {\r\n var content = props.content,\r\n contentText = props.contentText,\r\n DialogProps = props.DialogProps,\r\n DialogActionsProps = props.DialogActionsProps,\r\n DialogContentProps = props.DialogContentProps,\r\n DialogContentTextProps = props.DialogContentTextProps,\r\n DialogTitleProps = props.DialogTitleProps,\r\n open = props.open,\r\n primaryActionOnClick = props.primaryActionOnClick,\r\n primaryActionProps = props.primaryActionProps,\r\n primaryActionText = props.primaryActionText,\r\n secondaryActionOnClick = props.secondaryActionOnClick,\r\n secondaryActionProps = props.secondaryActionProps,\r\n secondaryActionText = props.secondaryActionText,\r\n title = props.title;\r\n\r\n /**\r\n * Override `disableBackdropClick` and `disableEscapeKeyDown` to true\r\n * Pass `open` for convenience\r\n */\r\n\r\n DialogProps['disableBackdropClick'] = true;\r\n DialogProps['disableEscapeKeyDown'] = true;\r\n DialogProps['maxWidth'] = false;\r\n DialogProps['open'] = open;\r\n DialogProps['showTitleBarClose'] = false;\r\n\r\n // Override color for primary action\r\n primaryActionProps['color'] = 'primary';\r\n primaryActionProps['onClick'] = primaryActionOnClick;\r\n\r\n // Override color for secondary action\r\n secondaryActionProps['color'] = 'secondary';\r\n secondaryActionProps['onClick'] = secondaryActionOnClick;\r\n\r\n return _react2.default.createElement(\r\n _.Dialog,\r\n Object.assign({}, DialogProps, { ref: ref }),\r\n _react2.default.createElement(\r\n _.DialogTitle,\r\n DialogTitleProps,\r\n title\r\n ),\r\n _react2.default.createElement(\r\n _.DialogContent,\r\n DialogContentProps,\r\n _react2.default.createElement(\r\n _.DialogContentText,\r\n DialogContentTextProps,\r\n contentText\r\n ),\r\n content\r\n ),\r\n _react2.default.createElement(\r\n _.DialogActions,\r\n DialogActionsProps,\r\n _react2.default.createElement(\r\n _.Button,\r\n secondaryActionProps,\r\n secondaryActionText\r\n ),\r\n _react2.default.createElement(\r\n _.Button,\r\n primaryActionProps,\r\n primaryActionText\r\n )\r\n )\r\n );\r\n});\r\n\r\nConfirmationDialog.muiName = 'ConfirmationDialog';\r\nConfirmationDialog.displayName = 'ConfirmationDialog';\r\n\r\nConfirmationDialog.propTypes = {\r\n /**\r\n * Content displayed by the `DialogContent` element.\r\n */\r\n content: _propTypes2.default.node,\r\n /**\r\n * Text displayed by the `DialogContentText` element.\r\n */\r\n contentText: _propTypes2.default.string,\r\n /**\r\n * Props that will be applied to the `Dialog` element.\r\n */\r\n DialogProps: _propTypes2.default.object,\r\n /**\r\n * Props that will be applied to the `DialogActions` element.\r\n */\r\n DialogActionsProps: _propTypes2.default.object,\r\n /**\r\n * Props that will be applied to the `DialogContent` element.\r\n */\r\n DialogContentProps: _propTypes2.default.object,\r\n /**\r\n * Props that will be applied to the `DialogContentText` element.\r\n */\r\n DialogContentTextProps: _propTypes2.default.object,\r\n /**\r\n * Props that will be applied to the `DialogTitle` element.\r\n */\r\n DialogTitleProps: _propTypes2.default.object,\r\n /**\r\n * If `true`, the Dialog is open.\r\n */\r\n open: _propTypes2.default.bool.isRequired,\r\n /**\r\n * onClick applied to the primary action Button element.\r\n */\r\n primaryActionOnClick: _propTypes2.default.func.isRequired,\r\n /**\r\n * Props applied to the primary action Button element.\r\n */\r\n primaryActionProps: _propTypes2.default.object.isRequired,\r\n /**\r\n * Text applied to the primary action Button element.\r\n */\r\n primaryActionText: _propTypes2.default.string.isRequired,\r\n /**\r\n * onClick applied to the secondary action Button element.\r\n */\r\n secondaryActionOnClick: _propTypes2.default.func.isRequired,\r\n /**\r\n * Props applied to the secondary action Button element.\r\n */\r\n secondaryActionProps: _propTypes2.default.object.isRequired,\r\n /**\r\n * Text applied to the secondary action Button element.\r\n */\r\n secondaryActionText: _propTypes2.default.string.isRequired,\r\n /**\r\n * Title displayed by the DialogTitle element.\r\n */\r\n title: _propTypes2.default.string.isRequired\r\n};\r\n\r\nConfirmationDialog.defaultProps = {\r\n DialogProps: {},\r\n DialogActionsProps: {},\r\n DialogContentProps: {},\r\n DialogContentTextProps: {},\r\n DialogTitleProps: {},\r\n primaryActionProps: {},\r\n secondaryActionProps: {}\r\n};\r\n\r\nexports.default = ConfirmationDialog;","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _v = require('uuid/v4');\r\n\r\nvar _v2 = _interopRequireDefault(_v);\r\n\r\nvar _get = require('lodash/get');\r\n\r\nvar _get2 = _interopRequireDefault(_get);\r\n\r\nvar _flattenDeep = require('lodash/flattenDeep');\r\n\r\nvar _flattenDeep2 = _interopRequireDefault(_flattenDeep);\r\n\r\nvar _filter = require('lodash/filter');\r\n\r\nvar _filter2 = _interopRequireDefault(_filter);\r\n\r\nvar _reduce = require('lodash/reduce');\r\n\r\nvar _reduce2 = _interopRequireDefault(_reduce);\r\n\r\nvar _isEqual = require('lodash/isEqual');\r\n\r\nvar _isEqual2 = _interopRequireDefault(_isEqual);\r\n\r\nvar _isNil = require('lodash/isNil');\r\n\r\nvar _isNil2 = _interopRequireDefault(_isNil);\r\n\r\nvar _InputLabel = require('@material-ui/core/InputLabel');\r\n\r\nvar _InputLabel2 = _interopRequireDefault(_InputLabel);\r\n\r\nvar _Select = require('@material-ui/core/Select');\r\n\r\nvar _Select2 = _interopRequireDefault(_Select);\r\n\r\nvar _Checkbox = require('../Checkbox');\r\n\r\nvar _Checkbox2 = _interopRequireDefault(_Checkbox);\r\n\r\nvar _Dropdown = require('../Dropdown');\r\n\r\nvar _FormControl = require('../FormControl');\r\n\r\nvar _FormControl2 = _interopRequireDefault(_FormControl);\r\n\r\nvar _EDSContext = require('../EDSContext/EDSContext');\r\n\r\nvar _IOSBodyScroll = require('./../IOSBodyScroll');\r\n\r\nvar _IOSBodyScroll2 = _interopRequireDefault(_IOSBodyScroll);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nvar _ChevronDown = require('@eui/ds-icons/lib/ChevronDown');\r\n\r\nvar _ChevronDown2 = _interopRequireDefault(_ChevronDown);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\r\n\r\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\r\n\r\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\r\n\r\n// MUI imports\r\n\r\n\r\n// select all selection states\r\nvar ALL = 0;\r\nvar INDETERMINATE = 1;\r\nvar NONE = 2;\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n select: {\r\n backgroundColor: theme.palette.grey['100'],\r\n '&$disabled': {\r\n backgroundColor: theme.palette.grey['200'],\r\n cursor: 'not-allowed'\r\n },\r\n '&:focus': {\r\n backgroundColor: theme.palette.grey['100'],\r\n borderRadius: _tokens.borderRadiusMedium,\r\n boxShadow: _tokens.boxShadowFocus\r\n }\r\n },\r\n selectIcon: {\r\n '&:hover': {\r\n '& $icon': {\r\n fill: theme.palette.ctaColor.active\r\n }\r\n }\r\n },\r\n paper: {\r\n border: _tokens.borderWidthThin + ' solid ' + theme.palette.grey[400],\r\n boxShadow: '0 0.125rem 0.0625rem -0.0625rem rgba(0, 0, 0, 0.12), 0 0.0625rem 0.0625rem 0 rgba(0, 0, 0, 0.14), 0 0.0625rem 0.1875rem 0 rgba(0, 0, 0, 0.21)'\r\n },\r\n selectMenu: {\r\n border: _tokens.borderWidthThin + ' solid ' + theme.palette.grey['400'],\r\n borderRadius: _tokens.borderRadiusMedium,\r\n lineHeight: '1.3rem',\r\n padding: _tokens.spacingMedium + ' 3.5rem ' + _tokens.spacingXSmall + ' ' + _tokens.spacingSmall,\r\n textOverflow: 'ellipsis',\r\n whiteSpace: 'nowrap'\r\n },\r\n nativeSelect: {\r\n backgroundColor: theme.palette.grey['100'],\r\n border: _tokens.borderWidthThin + ' solid ' + theme.palette.grey['400'],\r\n borderRadius: _tokens.borderRadiusMedium,\r\n padding: _tokens.spacingMedium + ' 3.5rem ' + _tokens.spacingXSmall + ' ' + _tokens.spacingSmall,\r\n textOverflow: 'ellipsis',\r\n whiteSpace: 'nowrap',\r\n width: 'calc(100% - 4.625rem)',\r\n height: 'auto',\r\n '&$disabled': {\r\n backgroundColor: theme.palette.grey['200'],\r\n cursor: 'not-allowed'\r\n },\r\n '&:focus': {\r\n backgroundColor: theme.palette.grey['100'],\r\n borderRadius: _tokens.borderRadiusMedium,\r\n boxShadow: _tokens.boxShadowFocus\r\n }\r\n },\r\n icon: {\r\n right: _tokens.spacingSmall,\r\n top: '1.1875rem',\r\n fill: theme.palette.grey['500']\r\n },\r\n inputLabelRoot: {\r\n fontSize: _tokens.fontSizeLarge,\r\n color: theme.palette.grey['500'],\r\n left: '1.0625rem',\r\n top: '-0.375rem',\r\n zIndex: theme.zIndex.textFieldLabel,\r\n pointerEvents: 'none'\r\n },\r\n inputLabelShrink: {\r\n top: _tokens.spacingXSmall\r\n },\r\n disabled: {\r\n cursor: 'not-allowed'\r\n },\r\n zIndex: {\r\n zIndex: theme.zIndex.dropdown + 1\r\n },\r\n small: {\r\n fontSize: _tokens.fontSizeDefault,\r\n '& $icon': {\r\n top: _tokens.spacingXSmall2\r\n },\r\n '& $inputLabelRoot': {\r\n top: '-' + _tokens.spacingXSmall2,\r\n fontSize: _tokens.fontSizeDefault\r\n },\r\n '& $selectMenu': {\r\n padding: '\\n ' + _tokens.spacingXSmall1 + '\\n 3.5rem\\n ' + _tokens.spacingXSmall1 + '\\n ' + _tokens.spacingXSmall1 + '\\n ',\r\n lineHeight: 'unset'\r\n },\r\n '& $nativeSelect': {\r\n padding: _tokens.spacingXSmall1 + ' 3.5rem ' + _tokens.spacingXSmall1 + ' ' + _tokens.spacingXSmall1,\r\n lineHeight: 'unset'\r\n }\r\n },\r\n inputLabelSmall: {\r\n top: '-' + _tokens.spacingXSmall2,\r\n left: _tokens.spacingXSmall2,\r\n fontSize: _tokens.fontSizeDefault,\r\n '&[data-shrink=true]': {\r\n display: 'none'\r\n }\r\n },\r\n error: {\r\n border: _tokens.borderWidthThick + ' solid ' + theme.palette.status.error.fill,\r\n '&:focus': {\r\n boxShadow: '0 0 0 ' + _tokens.borderWidthThin + ' ' + _tokens.colorFillAlertError,\r\n '-webkit-box-shadow': '0 0 0 ' + _tokens.borderWidthThin + ' ' + _tokens.colorFillAlertError,\r\n '-moz-box-shadow:': '0 0 0 ' + _tokens.borderWidthThin + ' ' + _tokens.colorFillAlertError\r\n }\r\n },\r\n ffErrorTextAdjuster: {\r\n '-moz-transform': 'translateY(-' + _tokens.spacingSmall + ')'\r\n },\r\n formControlWidth: {\r\n maxWidth: _tokens.widthInputFields\r\n }\r\n };\r\n};\r\n\r\nvar menuListClassName = 'menu-list';\r\n\r\n/**\r\n * Use `Dropdown` to make selections from a list.\r\n * @done true\r\n * @updated true\r\n * @versionAdded v0.0.10\r\n * @examples\r\n * ControlledDropdownExample\r\n * ErrorDropdownExample\r\n * FullWidthDropdownExample\r\n * IconDropdownExample\r\n * LongTextDropdownExample\r\n * MultiSelectDropdownExample\r\n * SelectAllDropdownExample\r\n * PerformanceTestDropdownExample\r\n * NativeExample\r\n */\r\n\r\nvar Dropdown = function (_React$Component) {\r\n _inherits(Dropdown, _React$Component);\r\n\r\n function Dropdown(props) {\r\n _classCallCheck(this, Dropdown);\r\n\r\n // the internal value of the 'select all' item\r\n var _this = _possibleConstructorReturn(this, (Dropdown.__proto__ || Object.getPrototypeOf(Dropdown)).call(this, props));\r\n\r\n _this.onDropDownOpen = function (e) {\r\n var onOpen = _this.props.onOpen;\r\n\r\n\r\n _IOSBodyScroll2.default.lock('.' + menuListClassName);\r\n onOpen && onOpen(e);\r\n };\r\n\r\n _this.onDropDownClose = function (e) {\r\n var onClose = _this.props.onClose;\r\n\r\n\r\n _IOSBodyScroll2.default.unlock();\r\n onClose && onClose(e);\r\n };\r\n\r\n _this.selectAllValue = (0, _v2.default)();\r\n\r\n _this.state = {\r\n selectionState: NONE,\r\n allItems: {}\r\n };\r\n\r\n _this.onDropDownOpen = _this.onDropDownOpen.bind(_this);\r\n _this.onDropDownClose = _this.onDropDownClose.bind(_this);\r\n return _this;\r\n }\r\n\r\n /**\r\n * Called when the dropdown value changes\r\n *\r\n * @param {Event} event The event that spurred this callback\r\n * @param {object} child The react element that was selected\r\n */\r\n\r\n\r\n _createClass(Dropdown, [{\r\n key: 'handleChange',\r\n value: function handleChange(event, child) {\r\n var _this2 = this;\r\n\r\n // if the user click the 'select all' item in a multi-select dropdown\r\n if (this.props.multiple && event.target.value.indexOf(this.selectAllValue) > -1) {\r\n // if no items are selected, select everything; otherwise unselect everything\r\n var newState = this.state.selectionState === NONE ? ALL : NONE;\r\n\r\n // set the new select all state\r\n this.setState({ selectionState: newState }, function () {\r\n // either select or unselect everything (overriding the value in the\r\n // event with the results of doing so)\r\n if (_this2.state.selectionState === ALL) {\r\n event.target.value = Object.keys(_this2.state.allItems);\r\n } else {\r\n event.target.value = [];\r\n }\r\n\r\n // let the caller know\r\n _this2.props.onChange && _this2.props.onChange(event, child);\r\n });\r\n } else {\r\n this.props.onChange && this.props.onChange(event, child);\r\n }\r\n }\r\n\r\n /**\r\n * Grab the label/value of each item\r\n */\r\n\r\n }, {\r\n key: 'objectifyItems',\r\n value: function objectifyItems() {\r\n // grab all the dropdown items\r\n\r\n var filteredDropdownItems = (0, _filter2.default)((0, _flattenDeep2.default)(this.props.children), function (item) {\r\n return (0, _get2.default)(item, 'type.muiName') === 'DropdownItem';\r\n });\r\n\r\n return (0, _reduce2.default)(filteredDropdownItems, function (mapping, item) {\r\n mapping[item.props.value] = item.props.label;\r\n return mapping;\r\n }, {});\r\n }\r\n\r\n /**\r\n * Render a single value.\r\n *\r\n * @param {*} val The value to render\r\n * @return The rendered value\r\n */\r\n\r\n }, {\r\n key: 'renderSingleValue',\r\n value: function renderSingleValue(val) {\r\n return this.state.allItems[val];\r\n }\r\n\r\n /**\r\n * Render multiple values.\r\n *\r\n * @param {Array.<*>} values The values to render\r\n * @return The rendered values\r\n */\r\n\r\n }, {\r\n key: 'renderMultipleValues',\r\n value: function renderMultipleValues(values) {\r\n var _this3 = this;\r\n\r\n return values.map(function (val) {\r\n return _this3.renderSingleValue(val);\r\n }).join(', ');\r\n }\r\n }, {\r\n key: 'componentDidMount',\r\n value: function componentDidMount() {\r\n // retain a catalog of each dropdown item\r\n this.setState({\r\n allItems: this.objectifyItems()\r\n });\r\n }\r\n }, {\r\n key: 'componentDidUpdate',\r\n value: function componentDidUpdate(prevProps) {\r\n // if the list of items has changed, update our internal catalog\r\n var itemsHaveChanged = (0, _get2.default)(this.props, 'children.length', 0) !== (0, _get2.default)(prevProps, 'children.length', 0) || !(0, _isEqual2.default)(this.objectifyItems(), this.state.allItems);\r\n\r\n if (itemsHaveChanged) {\r\n this.setState({\r\n allItems: this.objectifyItems()\r\n });\r\n }\r\n\r\n // if the select-all item is visible, update it based on current selections\r\n if (this.props.multiple && this.props.showSelectAll) {\r\n var selectionState = NONE;\r\n\r\n if (this.props.value.length === Object.keys(this.state.allItems).length) {\r\n selectionState = ALL;\r\n } else if (this.props.value.length > 0) {\r\n selectionState = INDETERMINATE;\r\n }\r\n\r\n // if selection state changed, update it\r\n if (this.state.selectionState !== selectionState) {\r\n this.setState({\r\n selectionState: selectionState\r\n });\r\n }\r\n }\r\n }\r\n }, {\r\n key: 'render',\r\n value: function render() {\r\n var _classNames3, _classNames4;\r\n\r\n var _props = this.props,\r\n childrenProp = _props.children,\r\n classes = _props.classes,\r\n disabled = _props.disabled,\r\n error = _props.error,\r\n edsContext = _props.edsContext,\r\n helperText = _props.helperText,\r\n id = _props.id,\r\n inputProps = _props.inputProps,\r\n labelProp = _props.label,\r\n multiple = _props.multiple,\r\n required = _props.required,\r\n value = _props.value,\r\n size = _props.size,\r\n onChange = _props.onChange,\r\n showSelectAll = _props.showSelectAll,\r\n fullWidth = _props.fullWidth,\r\n FormControlProps = _props.FormControlProps,\r\n FormHelperTextProps = _props.FormHelperTextProps,\r\n rest = _objectWithoutProperties(_props, ['children', 'classes', 'disabled', 'error', 'edsContext', 'helperText', 'id', 'inputProps', 'label', 'multiple', 'required', 'value', 'size', 'onChange', 'showSelectAll', 'fullWidth', 'FormControlProps', 'FormHelperTextProps']);\r\n\r\n var cleanedId = id || (0, _v2.default)();\r\n var selectLabelId = cleanedId + '_label';\r\n\r\n var newInputProps = Object.assign({}, inputProps, {\r\n id: cleanedId\r\n });\r\n\r\n var children = childrenProp;\r\n var label = labelProp;\r\n\r\n // we do this to handle a bug within MUI - if the initial value is nil, then the label does not correctly\r\n // shrink out of the way when an item is selected. so we set the initial value to empty string instead, which\r\n // appears to solve the issue\r\n var localValue = (0, _isNil2.default)(value) ? '' : value;\r\n\r\n if (multiple) {\r\n children = _react2.default.Children.map(childrenProp, function (child, index) {\r\n return (0, _react.cloneElement)(child, { multiple: true });\r\n });\r\n\r\n // add the current selection count to the label\r\n if (localValue && this.state.allItems) {\r\n var countString = '(' + this.props.value.length + '/' + Object.keys(this.state.allItems).length + ')';\r\n label = labelProp + ' ' + countString;\r\n }\r\n }\r\n\r\n return _react2.default.createElement(\r\n _FormControl2.default,\r\n Object.assign({\r\n className: (0, _classnames2.default)(_defineProperty({}, classes.formControlWidth, !fullWidth))\r\n }, FormControlProps),\r\n _react2.default.createElement(\r\n _react.Fragment,\r\n null,\r\n _react2.default.createElement(\r\n _InputLabel2.default,\r\n {\r\n id: selectLabelId,\r\n classes: {\r\n root: classes.inputLabelRoot,\r\n shrink: classes.inputLabelShrink,\r\n disabled: (0, _classnames2.default)(classes.disabled, classes.zIndex)\r\n },\r\n disabled: disabled,\r\n htmlFor: cleanedId,\r\n className: (0, _classnames2.default)(_defineProperty({}, classes.inputLabelSmall, size === 'small'))\r\n },\r\n required ? label + ' *' : label\r\n ),\r\n _react2.default.createElement(\r\n _Select2.default,\r\n Object.assign({\r\n className: (0, _classnames2.default)((_classNames3 = {}, _defineProperty(_classNames3, classes.small, size === 'small'), _defineProperty(_classNames3, classes.selectIcon, !disabled), _classNames3)),\r\n classes: {\r\n select: (0, _classnames2.default)((_classNames4 = {}, _defineProperty(_classNames4, classes.select, !this.props.native), _defineProperty(_classNames4, classes.nativeSelect, this.props.native), _defineProperty(_classNames4, classes.error, this.props.native && error), _classNames4)),\r\n selectMenu: (0, _classnames2.default)(classes.selectMenu, _defineProperty({}, classes.error, error)),\r\n icon: classes.icon,\r\n disabled: classes.disabled\r\n },\r\n onChange: this.handleChange.bind(this),\r\n disabled: disabled,\r\n disableUnderline: true,\r\n IconComponent: _ChevronDown2.default,\r\n inputProps: newInputProps,\r\n 'aria-labelledby': selectLabelId,\r\n MenuProps: {\r\n MenuListProps: {\r\n disablePadding: true,\r\n className: menuListClassName\r\n },\r\n classes: {\r\n paper: classes.paper\r\n }\r\n },\r\n multiple: multiple,\r\n renderValue: multiple ? this.renderMultipleValues.bind(this) : this.renderSingleValue.bind(this),\r\n value: localValue\r\n }, rest, {\r\n onOpen: this.onDropDownOpen,\r\n onClose: this.onDropDownClose\r\n }),\r\n showSelectAll && _react2.default.createElement(\r\n _Dropdown.DropdownItem,\r\n {\r\n label: edsContext.formatMessage('component.Dropdown.selectAll'),\r\n selectAll: true,\r\n multiple: true,\r\n value: this.selectAllValue\r\n },\r\n _react2.default.createElement(_Checkbox2.default, {\r\n indeterminate: this.state.selectionState === INDETERMINATE,\r\n checked: this.state.selectionState !== NONE\r\n })\r\n ),\r\n children\r\n ),\r\n helperText && _react2.default.createElement(\r\n _FormControl.FormHelperText,\r\n Object.assign({\r\n className: size === 'medium' && !this.props.native ? classes.ffErrorTextAdjuster : null,\r\n error: error,\r\n id: cleanedId + '_HelperText'\r\n }, FormHelperTextProps),\r\n helperText\r\n )\r\n )\r\n );\r\n }\r\n }, {\r\n key: 'componentWillUnmount',\r\n value: function componentWillUnmount() {\r\n // Just making sure to unlock the body scroll\r\n _IOSBodyScroll2.default.unlock();\r\n }\r\n }]);\r\n\r\n return Dropdown;\r\n}(_react2.default.Component);\r\n\r\n/**\r\n * The following should be used to enable Tooltip hover once bugs have been tested\r\n *\r\n \r\n \r\n \r\n */\r\n\r\nDropdown.muiName = 'Dropdown';\r\n\r\nDropdown.propTypes = {\r\n /**\r\n * If `true`, the width of the popover will automatically be set according to the items inside the\r\n * menu, otherwise it will be at least the width of the select input.\r\n */\r\n autoWidth: _propTypes2.default.bool,\r\n /**\r\n * The elements to populate the select with.\r\n *\r\n * - If `native` it true, these must be `option` elements\r\n * - if `native` is false, these must be `DropdownItem` elements\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * If `true`, the dropdown will be disabled.\r\n */\r\n disabled: _propTypes2.default.bool,\r\n /**\r\n * If `true`, the selected item is displayed even if its value is empty.\r\n */\r\n displayEmpty: _propTypes2.default.bool,\r\n /**\r\n * If `true`, the dropdown will display in an error state\r\n */\r\n error: _propTypes2.default.bool,\r\n /**\r\n * Properties applied to the [`FormControl`](#/components/FormControl) element.\r\n */\r\n FormControlProps: _propTypes2.default.object,\r\n /**\r\n * Properties applied to the [`FormHelperText`](#/components/FormControl) element.\r\n */\r\n FormHelperTextProps: _propTypes2.default.object,\r\n /**\r\n * If `true`, the dropdown will take up the full width of its container.\r\n */\r\n fullWidth: _propTypes2.default.bool,\r\n /**\r\n * Text to be displayed by the FormHelperText component\r\n */\r\n helperText: _propTypes2.default.string,\r\n /**\r\n * The icon that displays the arrow.\r\n */\r\n IconComponent: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),\r\n /**\r\n * Id assigned to the input element and referenced by label element\r\n */\r\n id: _propTypes2.default.string,\r\n /**\r\n * An `Input` element; does not have to be a material-ui specific `Input`.\r\n */\r\n input: _propTypes2.default.element,\r\n /**\r\n * Attributes applied to the `input` element. When `native` is `true`,\r\n * the attributes are applied on the `select` element.\r\n */\r\n inputProps: _propTypes2.default.object,\r\n /**\r\n * @ignore\r\n */\r\n edsContext: _propTypes2.default.object,\r\n /**\r\n * Label that is attached to the `Dropdown`\r\n */\r\n label: _propTypes2.default.string.isRequired,\r\n /**\r\n * Properties applied to the [`Menu`](https://material-ui.com/api/menu/) element.\r\n */\r\n MenuProps: _propTypes2.default.object,\r\n /**\r\n * If true, `value` must be an array and the menu will support multiple selections.\r\n * This feature will only work if `native` is `false`.\r\n */\r\n multiple: _propTypes2.default.bool,\r\n /**\r\n * If `true`, the component will be using a native `select` element.\r\n * Be sure to use the `option` element to create dropdown items when\r\n * `native` is set to `true`, instead of our `DropdownItem` component.\r\n */\r\n native: _propTypes2.default.bool,\r\n /**\r\n * Callback function fired when a menu item is selected.\r\n *\r\n * Signature:\r\n * ```\r\n * function(event: object, child?: object) => void\r\n * ```\r\n * _event_: The event source of the callback. You can pull out the new value by accessing `event.target.value`.\r\n *\r\n * _child_: The react element that was selected\r\n */\r\n onChange: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the component requests to be closed.\r\n * Use in controlled mode (see open).\r\n *\r\n * Signature:\r\n * ```\r\n * function(event: object) => void\r\n * ```\r\n * _event_: The event source of the callback\r\n */\r\n onClose: _propTypes2.default.func,\r\n /**\r\n * Callback fired when the component requests to be opened.\r\n * Use in controlled mode (see open).\r\n *\r\n * Signature:\r\n * ```\r\n * function(event: object) => void\r\n * ```\r\n *\r\n * _event_: The event source of the callback\r\n */\r\n onOpen: _propTypes2.default.func,\r\n /**\r\n * Control `select` open state. You can only use it when the `native` property is `false` (default).\r\n *\r\n * If you use `onOpen` or `onClose` callbacks, you must always provide the `open` prop.\r\n */\r\n open: _propTypes2.default.bool,\r\n /**\r\n * Render the selected value.\r\n *\r\n * Signature:\r\n * ```\r\n * function(value: any) => ReactElement\r\n * ```\r\n *\r\n * _value_: The `value` provided to the component.\r\n */\r\n renderValue: _propTypes2.default.func,\r\n /**\r\n * Whether this dropdown is required.\r\n */\r\n required: _propTypes2.default.bool,\r\n /**\r\n * Properties applied to the clickable div element.\r\n */\r\n SelectDisplayProps: _propTypes2.default.object,\r\n /**\r\n * Whether to provide a \"select all\" option for multi-select dropdowns\r\n */\r\n showSelectAll: _propTypes2.default.bool,\r\n /**\r\n * The input value.\r\n */\r\n value: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number, _propTypes2.default.bool, _propTypes2.default.arrayOf(_propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number, _propTypes2.default.bool]))]),\r\n /**\r\n * The size of the Dropdown. Small size is recommended to be used within the `TableEditableCell` component.\r\n */\r\n size: _propTypes2.default.oneOf(['small', 'medium'])\r\n};\r\n\r\nDropdown.defaultProps = {\r\n autoWidth: false,\r\n displayEmpty: false,\r\n fullWidth: false,\r\n multiple: false,\r\n required: false,\r\n showSelectAll: false,\r\n size: 'medium',\r\n value: ''\r\n};\r\nexports.default = (0, _EDSContext.withEDSContext)((0, _styles2.default)(styles)(Dropdown));","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _Paper = require('@material-ui/core/Paper');\r\n\r\nvar _Paper2 = _interopRequireDefault(_Paper);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n root: {}\r\n };\r\n};\r\n\r\n/**\r\n * A component that is the basis for many of other components.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.11\r\n */\r\nvar Paper = _react2.default.forwardRef(function (props, ref) {\r\n var classes = props.classes,\r\n rest = _objectWithoutProperties(props, ['classes']);\r\n\r\n var classOverrides = {\r\n root: classes.root\r\n };\r\n\r\n return _react2.default.createElement(_Paper2.default, Object.assign({}, rest, {\r\n classes: classOverrides,\r\n ref: ref\r\n }));\r\n});\r\n\r\nPaper.muiName = 'Paper';\r\nPaper.displayName = 'Paper';\r\n\r\nPaper.propTypes = {\r\n /**\r\n * The content of the component.\r\n */\r\n children: _propTypes2.default.node,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object.isRequired,\r\n /**\r\n * @ignore\r\n */\r\n className: _propTypes2.default.string,\r\n /**\r\n * The component used for the root node.\r\n * Either a string to use a DOM element or a component.\r\n */\r\n component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func]),\r\n /**\r\n * Shadow depth, corresponds to `dp` in the spec.\r\n * It's accepting values between 0 and 24 inclusive.\r\n */\r\n elevation: _propTypes2.default.number,\r\n /**\r\n * If `true`, rounded corners are disabled.\r\n */\r\n square: _propTypes2.default.bool\r\n};\r\n\r\nPaper.defaultProps = {\r\n component: 'div',\r\n elevation: 2,\r\n square: false\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(Paper);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _SimpleDialog = require('./SimpleDialog');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_SimpleDialog).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _ = require('../');\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\r\n\r\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\r\n\r\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nvar overlayActionsMobileStyles = {\r\n flexFlow: 'column',\r\n '& button': {\r\n marginBottom: _tokens.spacingSmall,\r\n marginRight: 0,\r\n textAlign: 'center',\r\n width: _tokens.widthFluid,\r\n '&:last-child': {\r\n marginBottom: 0\r\n }\r\n }\r\n};\r\n\r\nvar styles = function styles(theme) {\r\n return {\r\n actionRoot: _defineProperty({\r\n justifyContent: 'flex-start',\r\n margin: '0.7rem',\r\n '& button': {\r\n marginRight: _tokens.spacingSmall\r\n }\r\n }, '@media ' + _tokens.mqSmallDown, overlayActionsMobileStyles),\r\n actionsRight: _defineProperty({\r\n flexFlow: 'row-reverse',\r\n '& button': _defineProperty({\r\n marginLeft: _tokens.spacingSmall,\r\n marginRight: 0\r\n }, '@media ' + _tokens.mqSmallDown, {\r\n marginLeft: 0\r\n })\r\n }, '@media ' + _tokens.mqSmallDown, overlayActionsMobileStyles)\r\n };\r\n};\r\n\r\n/**\r\n * Use `SimpleDialog` to create a dialog, without having to explicitly specify each individual aspect of it.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.13\r\n * @examples\r\n * SimpleDialogExample\r\n * SimpleDialogOverflowExample\r\n * SimpleDialogResponsiveExample\r\n */\r\n\r\nvar SimpleDialog = function (_React$Component) {\r\n _inherits(SimpleDialog, _React$Component);\r\n\r\n function SimpleDialog() {\r\n _classCallCheck(this, SimpleDialog);\r\n\r\n return _possibleConstructorReturn(this, (SimpleDialog.__proto__ || Object.getPrototypeOf(SimpleDialog)).apply(this, arguments));\r\n }\r\n\r\n _createClass(SimpleDialog, [{\r\n key: 'componentDidMount',\r\n value: function componentDidMount() {\r\n\r\n // complain if caller gave us more than 3 buttons\r\n if (this.props.buttonConfig.length > 3) {\r\n console.warn('Dialogs should not have more than three buttons');\r\n }\r\n }\r\n }, {\r\n key: 'render',\r\n value: function render() {\r\n var _this2 = this;\r\n\r\n var _props = this.props,\r\n DialogProps = _props.DialogProps,\r\n DialogActionsProps = _props.DialogActionsProps,\r\n DialogContentProps = _props.DialogContentProps,\r\n DialogTitleProps = _props.DialogTitleProps,\r\n rightAlignButtons = _props.rightAlignButtons,\r\n classes = _props.classes,\r\n maxWidth = _props.maxWidth,\r\n title = _props.title,\r\n showTitleBarClose = _props.showTitleBarClose,\r\n closeOnClickOut = _props.closeOnClickOut,\r\n fullScreen = _props.fullScreen,\r\n fullWidth = _props.fullWidth,\r\n buttonConfig = _props.buttonConfig,\r\n PaperProps = _props.PaperProps,\r\n children = _props.children;\r\n\r\n\r\n var actionClassOverrides = {\r\n root: classes.actionRoot\r\n };\r\n\r\n return _react2.default.createElement(\r\n _.Dialog,\r\n Object.assign({}, DialogProps, {\r\n open: this.props.open,\r\n onClose: this.props.onClose,\r\n disableBackdropClick: !closeOnClickOut,\r\n showTitleBarClose: showTitleBarClose,\r\n fullScreen: fullScreen,\r\n fullWidth: fullWidth,\r\n PaperProps: PaperProps,\r\n maxWidth: maxWidth\r\n }),\r\n title && _react2.default.createElement(\r\n _.DialogTitle,\r\n DialogTitleProps,\r\n title\r\n ),\r\n _react2.default.createElement(\r\n _.DialogContent,\r\n DialogContentProps,\r\n children\r\n ),\r\n _react2.default.createElement(\r\n _.DialogActions,\r\n Object.assign({}, DialogActionsProps, {\r\n classes: actionClassOverrides,\r\n 'data-id': 'hed-simpleDialog-dialogActions',\r\n className: (0, _classnames2.default)(_defineProperty({}, classes.actionsRight, rightAlignButtons)) }),\r\n buttonConfig.map(function (config, index) {\r\n return _react2.default.createElement(\r\n _.Button,\r\n {\r\n color: index === 0 ? 'primary' : 'secondary',\r\n key: config.id,\r\n 'data-key': config.id,\r\n onClick: function onClick() {\r\n return _this2.props.handleButtonClick(config.id);\r\n }\r\n },\r\n config.title\r\n );\r\n })\r\n )\r\n );\r\n }\r\n }]);\r\n\r\n return SimpleDialog;\r\n}(_react2.default.Component);\r\n\r\n;\r\n\r\nSimpleDialog.muiName = 'SimpleDialog';\r\n\r\nSimpleDialog.propTypes = {\r\n /**\r\n * The contents of the dialog.\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * Props that will be applied to the `Dialog` element.\r\n */\r\n DialogProps: _propTypes2.default.object,\r\n /**\r\n * Props that will be applied to the `DialogActions` element.\r\n */\r\n DialogActionsProps: _propTypes2.default.object,\r\n /**\r\n * Props that will be applied to the `DialogContent` element.\r\n */\r\n DialogContentProps: _propTypes2.default.object,\r\n /**\r\n * Props that will be applied to the `DialogTitle` element.\r\n */\r\n DialogTitleProps: _propTypes2.default.object,\r\n /**\r\n * Whether the dialog is open\r\n */\r\n open: _propTypes2.default.bool.isRequired,\r\n /**\r\n * The dialog title.\r\n */\r\n title: _propTypes2.default.string,\r\n /**\r\n * The buttons to display in the action area. An array of objects with the following properties:\r\n *\r\n * * `id`: The button's unique identifier\r\n * * `title`: The button title\r\n *\r\n * Dialogs should have a maximum of three buttons.\r\n */\r\n buttonConfig: _propTypes2.default.arrayOf(_propTypes2.default.object),\r\n /**\r\n * If true, shows an 'x' in the title bar, which closes the dialog\r\n */\r\n showTitleBarClose: _propTypes2.default.bool,\r\n /**\r\n * If true, clicking outside the dialog will close it\r\n */\r\n closeOnClickOut: _propTypes2.default.bool,\r\n /**\r\n * Determine the max width of the dialog.\r\n *\r\n * The dialog width grows with the size of the screen, this property is useful\r\n * on the desktop where you might need some different widths across your\r\n * application.\r\n *\r\n * Valid values:\r\n *\r\n * * `xs`\r\n * * `sm`\r\n * * `md`\r\n * * `lg`\r\n * * `false` (disables max width)\r\n */\r\n maxWidth: _propTypes2.default.oneOf(['xs', 'sm', 'md', 'lg', false]),\r\n /**\r\n * If `true`, the dialog stretches to `maxWidth`.\r\n */\r\n fullWidth: _propTypes2.default.bool,\r\n /**\r\n * If true, dialog will appear in full screen\r\n */\r\n fullScreen: _propTypes2.default.bool,\r\n /**\r\n * If true, the action buttons will be aligned right\r\n */\r\n rightAlignButtons: _propTypes2.default.bool,\r\n /**\r\n * Invoked when the dialog wants to close\r\n */\r\n onClose: _propTypes2.default.func,\r\n /**\r\n * Properties applied to the dialog's internal Paper element.\r\n */\r\n PaperProps: _propTypes2.default.object,\r\n /**\r\n * Invoked when the user clicks on one of the buttons. Is passed a single argument, the button id.\r\n */\r\n handleButtonClick: _propTypes2.default.func,\r\n /**\r\n * Override or extend the styles applied to the component.\r\n */\r\n classes: _propTypes2.default.object\r\n};\r\n\r\n// default prop values\r\nSimpleDialog.defaultProps = {\r\n showTitleBarClose: true,\r\n closeOnClickOut: true,\r\n fullScreen: false,\r\n fullWidth: false,\r\n rightAlignButtons: true,\r\n maxWidth: false,\r\n buttonConfig: []\r\n};\r\n\r\nexports.default = (0, _styles2.default)(styles)(SimpleDialog);","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\nexports.cdn = exports.config = undefined;\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _MuiThemeProvider = require('@material-ui/core/styles/MuiThemeProvider');\r\n\r\nvar _MuiThemeProvider2 = _interopRequireDefault(_MuiThemeProvider);\r\n\r\nvar _styles = require('@material-ui/styles');\r\n\r\nvar _themes = require('@hedtech/react-design-system/core/themes');\r\n\r\nvar _styles2 = require('../styles/');\r\n\r\nvar _EDSContext = require('../EDSContext/EDSContext');\r\n\r\nvar _CssBaseline = require('./internal/CssBaseline');\r\n\r\nvar _CssBaseline2 = _interopRequireDefault(_CssBaseline);\r\n\r\nvar _edsconfig = require('./internal/edsconfig.js');\r\n\r\nvar _edsconfig2 = _interopRequireDefault(_edsconfig);\r\n\r\nvar _urls = require('./internal/urls');\r\n\r\nvar _urls2 = _interopRequireDefault(_urls);\r\n\r\nvar _moment = require('moment');\r\n\r\nvar _moment2 = _interopRequireDefault(_moment);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nvar DEFAULT_LOCALE = 'en_US';\r\n\r\n/**\r\n * `EDSApplication` is the top-level component of an EDS application. All apps must be wrapped in this component.\r\n *\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.13\r\n * @examples\r\n * EDSApplicationExample\r\n */\r\nvar EDSApplication = function EDSApplication(props) {\r\n\r\n (0, _react.useEffect)(function () {\r\n // if the caller wants us to automatically set the global moment locale, do so\r\n if (props.locale && props.autosetMomentLocale) {\r\n _moment2.default.locale(props.locale);\r\n }\r\n }, [props.locale]); // eslint-disable-line react-hooks/exhaustive-deps\r\n\r\n return _react2.default.createElement(\r\n _EDSContext.EDSContext.Provider,\r\n { value: {\r\n locale: props.locale,\r\n labelOverrides: props.labelOverrides\r\n } },\r\n _react2.default.createElement(\r\n _styles.StylesProvider,\r\n { generateClassName: _styles2.classNameGenerator },\r\n _react2.default.createElement(\r\n _MuiThemeProvider2.default,\r\n { theme: props.theme },\r\n _react2.default.createElement(_CssBaseline2.default, null),\r\n props.children\r\n )\r\n )\r\n );\r\n};\r\n\r\nEDSApplication.muiName = 'EDSApplication';\r\nEDSApplication.displayName = 'EDSApplication';\r\n\r\nEDSApplication.propTypes = {\r\n\r\n /**\r\n * The nodes comprising the wrapped application\r\n */\r\n children: _propTypes2.default.node.isRequired,\r\n /**\r\n * The application's theme.\r\n */\r\n theme: _propTypes2.default.object,\r\n /**\r\n * Overrides for the translated labels.\r\n */\r\n labelOverrides: _propTypes2.default.object,\r\n /**\r\n * Locale to use for translations\r\n */\r\n locale: _propTypes2.default.string,\r\n /**\r\n * Whether to set the global moment context to the locale specified by the `locale` prop.\r\n */\r\n autosetMomentLocale: _propTypes2.default.bool\r\n\r\n};\r\n\r\n// If default props are needed, they must be set here\r\nEDSApplication.defaultProps = {\r\n theme: (0, _themes.createEDSTheme)('light'),\r\n labelOverrides: {},\r\n locale: DEFAULT_LOCALE,\r\n autosetMomentLocale: true\r\n};\r\n\r\nexports.config = _edsconfig2.default;\r\nexports.cdn = _urls2.default;\r\nexports.default = EDSApplication;","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _styles = require('@material-ui/styles');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nvar useStyles = (0, _styles.makeStyles)(function (theme) {\r\n return {\r\n '@global': {\r\n html: {\r\n WebkitFontSmoothing: 'antialiased', // Antialiasing.\r\n MozOsxFontSmoothing: 'grayscale', // Antialiasing.\r\n // Change from `box-sizing: content-box` so that `width`\r\n // is not affected by `padding` or `border`.\r\n boxSizing: 'border-box'\r\n },\r\n '*, *::before, *::after': {\r\n boxSizing: 'inherit'\r\n },\r\n body: {\r\n margin: 0, // Remove the margin in all browsers.\r\n backgroundColor: theme.palette.background.default,\r\n '@media print': {\r\n // Save printer ink.\r\n backgroundColor: theme.palette.common.white\r\n }\r\n }\r\n }\r\n };\r\n}, { name: 'CssBaseline' });\r\n\r\nfunction CssBaseline(props) {\r\n var _props$children = props.children,\r\n children = _props$children === undefined ? null : _props$children;\r\n\r\n useStyles();\r\n return _react2.default.createElement(\r\n _react2.default.Fragment,\r\n null,\r\n children\r\n );\r\n}\r\n\r\nCssBaseline.propTypes = {\r\n /**\r\n * You can wrap a node.\r\n */\r\n children: _propTypes2.default.node\r\n};\r\n\r\nexports.default = CssBaseline;","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _edsconfig = require('./edsconfig.js');\r\n\r\nvar _edsconfig2 = _interopRequireDefault(_edsconfig);\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nvar cdnBaseUrlWithVersion = '' + _edsconfig2.default.cdnBaseUrl + _edsconfig2.default.appVersion;\r\nvar getLargeIllustrationsUrl = function getLargeIllustrationsUrl(assetName) {\r\n return cdnBaseUrlWithVersion + '/img/illustrations/large/' + assetName;\r\n};\r\n\r\nvar getFontsUrl = function getFontsUrl() {\r\n return cdnBaseUrlWithVersion + '/fonts/fonts.css';\r\n};\r\n\r\nvar getBackgroundImageUrl = function getBackgroundImageUrl(assetName) {\r\n return cdnBaseUrlWithVersion + '/img/bg/' + assetName;\r\n};\r\n\r\nvar getFavIconUrl = function getFavIconUrl(assetName) {\r\n return assetName ? cdnBaseUrlWithVersion + '/img/favicons/' + assetName : cdnBaseUrlWithVersion + '/img/favicons/favicon.svg';\r\n};\r\n\r\nvar cdn = {\r\n getLargeIllustrationsUrl: getLargeIllustrationsUrl,\r\n getFontsUrl: getFontsUrl,\r\n getBackgroundImageUrl: getBackgroundImageUrl,\r\n getFavIconUrl: getFavIconUrl\r\n};\r\n\r\nexports.default = cdn;","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _MegaMenu = require('./MegaMenu');\r\n\r\nObject.defineProperty(exports, 'default', {\r\n enumerable: true,\r\n get: function get() {\r\n return _interopRequireDefault(_MegaMenu).default;\r\n }\r\n});\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }","'use strict';\r\n\r\nObject.defineProperty(exports, \"__esModule\", {\r\n value: true\r\n});\r\n\r\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\r\n\r\nvar _react = require('react');\r\n\r\nvar _react2 = _interopRequireDefault(_react);\r\n\r\nvar _propTypes = require('prop-types');\r\n\r\nvar _propTypes2 = _interopRequireDefault(_propTypes);\r\n\r\nvar _ = require('../');\r\n\r\nvar _EDSContext = require('../EDSContext/EDSContext');\r\n\r\nvar _Icon = require('@eui/ds-icons/lib/Icon');\r\n\r\nvar _Icon2 = _interopRequireDefault(_Icon);\r\n\r\nvar _styles = require('../styles');\r\n\r\nvar _styles2 = _interopRequireDefault(_styles);\r\n\r\nvar _classnames = require('classnames');\r\n\r\nvar _classnames2 = _interopRequireDefault(_classnames);\r\n\r\nvar _withWidth = require('./../withWidth');\r\n\r\nvar _withWidth2 = _interopRequireDefault(_withWidth);\r\n\r\nvar _Grid = require('./../Grid');\r\n\r\nvar _Grid2 = _interopRequireDefault(_Grid);\r\n\r\nvar _find = require('lodash/find');\r\n\r\nvar _find2 = _interopRequireDefault(_find);\r\n\r\nvar _v = require('uuid/v4');\r\n\r\nvar _v2 = _interopRequireDefault(_v);\r\n\r\nvar _tokens = require('../styles/tokens');\r\n\r\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\r\n\r\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\r\n\r\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\r\n\r\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\r\n\r\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\r\n\r\nvar styles = function styles(theme) {\r\n var _ref;\r\n\r\n return _ref = {\r\n\r\n megaMenu: {\r\n position: 'fixed',\r\n color: _tokens.colorBrandNeutral600,\r\n bottom: 0,\r\n left: 0,\r\n right: 0,\r\n opacity: 1,\r\n willChange: 'opacity',\r\n backgroundColor: '#FFF',\r\n zIndex: theme.zIndex.megaMenu,\r\n overflowX: 'hidden',\r\n\r\n '&.useFluidTransition': {\r\n transition: 'all 0.15s ease-in-out',\r\n transformOrigin: '0 0'\r\n }\r\n\r\n },\r\n\r\n megaMenuHidden: {\r\n maxHeight: '0'\r\n },\r\n\r\n wrapper: {\r\n padding: '6rem 5rem'\r\n }\r\n\r\n }, _defineProperty(_ref, '@media ' + _tokens.mqLarge, {\r\n wrapper: {\r\n padding: '6rem 10rem'\r\n }\r\n }), _defineProperty(_ref, 'staticAreaStart', {\r\n borderLeft: '1px solid black'\r\n }), _defineProperty(_ref, 'footerArea', {\r\n paddingTop: '5rem',\r\n justifyContent: 'center',\r\n display: 'flex'\r\n }), _defineProperty(_ref, 'listItemRoot', {\r\n backgroundColor: 'white',\r\n outline: '1px solid blue'\r\n }), _defineProperty(_ref, 'section', {\r\n\r\n // remove top padding to ensure that the top of the dividing line between static and dynamic area lines up correctly\r\n '&.first-row': {\r\n paddingTop: '0 !important'\r\n },\r\n\r\n '&.last-row': {\r\n paddingBottom: '0 !important'\r\n },\r\n\r\n '& .section-header': {\r\n color: theme.palette.grey[600],\r\n paddingBottom: _tokens.spacingSmall\r\n },\r\n '& .section-link': {\r\n color: theme.palette.action.selected,\r\n cursor: 'pointer',\r\n lineHeight: _tokens.spacingMedium\r\n },\r\n '& .section-link:hover': {\r\n textDecoration: 'underline'\r\n },\r\n '& .section-link a': {\r\n color: theme.palette.action.selected,\r\n textDecoration: 'none'\r\n },\r\n '& .section-link.disabled': {\r\n color: _tokens.colorTextDisabled,\r\n textDecoration: 'none',\r\n cursor: 'auto',\r\n pointerEvents: 'none'\r\n },\r\n '& .section-link.disabled a': {\r\n color: _tokens.colorTextDisabled\r\n }\r\n }), _defineProperty(_ref, 'logo', {\r\n height: '0.875rem !important',\r\n marginTop: '0.125rem',\r\n minWidth: '0 !important',\r\n padding: '0 0 0 ' + _tokens.spacingXSmall + ' !important',\r\n '& svg': {\r\n width: 'auto'\r\n }\r\n }), _defineProperty(_ref, 'topLevelMenuItem', {\r\n borderBottom: _tokens.borderWidthThin + ' solid ' + theme.palette.grey[300]\r\n }), _defineProperty(_ref, 'smallListItemOverrides', {\r\n padding: '1rem 0 !important', // TODO this class always appears below native list item classes in precedence, so need the !important\r\n backgroundColor: 'transparent !important'\r\n }), _defineProperty(_ref, 'smallMenuTopLevelItemText', {\r\n fontFamily: _tokens.fontFamilyHeader + ' !important'\r\n }), _defineProperty(_ref, 'smallMenu', {\r\n display: 'flex',\r\n flexDirection: 'column'\r\n }), _defineProperty(_ref, 'smallMenuHeader', {\r\n\r\n display: 'flex',\r\n borderBottom: _tokens.borderWidthThick + ' solid ' + theme.palette.grey[400],\r\n padding: '0.5rem 0',\r\n minHeight: '3.375rem', // necessary to maintain consistent height in iOS Safari\r\n\r\n marginLeft: _tokens.spacingMedium,\r\n marginRight: _tokens.spacingMedium,\r\n\r\n '& > .back-nav': {\r\n marginLeft: '-1rem'\r\n },\r\n\r\n '& > .back-icon': {\r\n color: theme.palette.grey[600]\r\n },\r\n\r\n '& > .back-icon:hover': {\r\n cursor: 'pointer'\r\n },\r\n\r\n '& > .header-title': {\r\n margin: 'auto'\r\n }\r\n\r\n }), _defineProperty(_ref, 'smallMenuSubHeader', {\r\n borderBottom: _tokens.borderWidthThick + ' solid ' + theme.palette.grey[400],\r\n padding: '1rem 0',\r\n marginLeft: _tokens.spacingMedium,\r\n marginRight: _tokens.spacingMedium,\r\n\r\n '& > .back-icon': {\r\n color: theme.palette.grey[600]\r\n },\r\n\r\n '& > .back-icon:hover': {\r\n cursor: 'pointer'\r\n },\r\n '& > .submenu-header-title': {\r\n margin: 'auto'\r\n },\r\n\r\n '& > .header-title': {\r\n paddingTop: '1.5rem'\r\n }\r\n\r\n }), _defineProperty(_ref, 'smallMenuIcon', {\r\n marginRight: 0,\r\n color: theme.palette.grey[600]\r\n }), _defineProperty(_ref, 'smallMenuList', {\r\n flexGrow: 1,\r\n margin: '0 ' + _tokens.spacingMedium,\r\n width: 'auto !important'\r\n }), _defineProperty(_ref, 'smallMenuItem', {\r\n color: theme.palette.action.selected,\r\n fontWeight: _tokens.fontWeightStrong,\r\n\r\n '& a': {\r\n color: theme.palette.action.selected,\r\n textDecoration: 'none'\r\n },\r\n '& a:visited': {\r\n color: theme.palette.action.selected,\r\n textDecoration: 'none'\r\n },\r\n '& a:hover': {\r\n color: theme.palette.action.selected,\r\n textDecoration: 'none'\r\n }\r\n }), _defineProperty(_ref, 'smallMenuItemContents', {\r\n display: 'flex',\r\n '&> div': {\r\n paddingRight: _tokens.spacingSmall\r\n }\r\n }), _defineProperty(_ref, 'smallMenuItemDisabled', {\r\n color: theme.palette.grey[400],\r\n cursor: 'default'\r\n }), _defineProperty(_ref, 'menuFooter', {\r\n display: 'flex',\r\n margin: 'auto',\r\n padding: _tokens.spacingLarge + ' 0',\r\n\r\n '&.smallMenuFooter': {\r\n paddingBottom: '5rem'\r\n }\r\n }), _ref;\r\n};\r\n\r\n// detects when we've switched size classes that necessitate a change in the megamenu's form\r\nvar withMobileMegaMenu = function withMobileMegaMenu() {\r\n var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\r\n return function (Component) {\r\n var _options$breakpoint = options.breakpoint,\r\n breakpoint = _options$breakpoint === undefined ? 'xs' : _options$breakpoint;\r\n\r\n\r\n function WithMobileMegaMenu(props) {\r\n return _react2.default.createElement(Component, Object.assign({ variant: (0, _withWidth.isWidthDown)(breakpoint, props.width) ? 'small' : 'large' }, props));\r\n }\r\n\r\n WithMobileMegaMenu.propTypes = {\r\n width: _propTypes2.default.oneOf(['xs', 'sm', 'md', 'lg', 'xl']).isRequired\r\n };\r\n\r\n return (0, _withWidth2.default)()(WithMobileMegaMenu);\r\n };\r\n};\r\n\r\n/**\r\n * Use `MegaMenu` to display all menu and utility options.\r\n * @done true\r\n * @updated false\r\n * @versionAdded v0.0.15\r\n*/\r\n\r\nvar MegaMenu = function (_React$Component) {\r\n _inherits(MegaMenu, _React$Component);\r\n\r\n function MegaMenu() {\r\n var _ref2;\r\n\r\n var _temp, _this, _ret;\r\n\r\n _classCallCheck(this, MegaMenu);\r\n\r\n for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {\r\n args[_key] = arguments[_key];\r\n }\r\n\r\n return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref2 = MegaMenu.__proto__ || Object.getPrototypeOf(MegaMenu)).call.apply(_ref2, [this].concat(args))), _this), _this.state = {\r\n selectedItemKey: null,\r\n previousBodyScroll: 'auto'\r\n\r\n /**\r\n * Calculates dynamic styles for the menu (based on its size, and it's positioning)\r\n *\r\n * @returns {object} Dynamic menu styles\r\n */\r\n }, _this.previousSelected = function (event) {\r\n if (event.type !== 'keydown' || event.key === 'Enter') {\r\n _this.setState({\r\n selectedItemKey: null\r\n });\r\n }\r\n }, _temp), _possibleConstructorReturn(_this, _ret);\r\n }\r\n\r\n _createClass(MegaMenu, [{\r\n key: 'getMenuStyles',\r\n value: function getMenuStyles() {\r\n var _props = this.props,\r\n classes = _props.classes,\r\n parentElementRef = _props.parentElementRef,\r\n open = _props.open,\r\n topOffset = _props.topOffset,\r\n variant = _props.variant;\r\n\r\n // figure out the height of the megamenu\r\n\r\n var height = 'calc(100vh - ' + topOffset + 'px';\r\n\r\n var menuStyles = {\r\n display: variant === 'small' ? 'flex' : 'block',\r\n top: topOffset + 'px'\r\n };\r\n\r\n // if we're provided with a parent element, place the menu within that element\r\n if (parentElementRef && parentElementRef.current) {\r\n\r\n var el = parentElementRef.current;\r\n var rect = el.getBoundingClientRect();\r\n\r\n height = rect.height + 'px';\r\n\r\n // position the menu within the element\r\n menuStyles = Object.assign(menuStyles, {\r\n position: 'absolute',\r\n top: topOffset + 'px',\r\n left: 0,\r\n width: rect.width - classes.megaMenu.top + 'px'\r\n });\r\n }\r\n\r\n var menuHeight = open ? height : 0;\r\n\r\n // set the height of the megamenu\r\n Object.assign(menuStyles, {\r\n maxHeight: menuHeight, // need to specify max height as well, because transitions don't work with just height\r\n height: menuHeight\r\n });\r\n\r\n return menuStyles;\r\n }\r\n\r\n /**\r\n * Handle item selection.\r\n *\r\n * @param {object} item The selected item\r\n */\r\n\r\n }, {\r\n key: 'selectItem',\r\n value: function selectItem(event, item) {\r\n\r\n // if this element contains an href somewhere in its hierarchy, invoke it\r\n var anchor = event.target && event.target.querySelector('a');\r\n\r\n if (anchor) {\r\n anchor.click();\r\n } else {\r\n\r\n // do whatever our caller tells us to do\r\n if (this.props.onItemSelected) {\r\n this.props.onItemSelected(item);\r\n }\r\n\r\n // tell our caller that we're ready to close\r\n this.props.onClose();\r\n }\r\n }\r\n\r\n /**\r\n * Whether the item event should be handled.\r\n *\r\n * @param {Event} event Selection event\r\n * @param {object} item Selected item\r\n * @return {boolean} True if event should be handled\r\n */\r\n\r\n }, {\r\n key: 'shouldHandleSelection',\r\n value: function shouldHandleSelection(event, item) {\r\n return !item.disabled && ((event.type === 'keydown' || event.type === 'keypress') && event.key === 'Enter' || event.type === 'click');\r\n }\r\n\r\n /**\r\n * Handle larege menu item selection.\r\n *\r\n * @param {Event} event Selection event\r\n * @param {object} sectionItem The selected item\r\n */\r\n\r\n }, {\r\n key: 'largeMenuItemSelected',\r\n value: function largeMenuItemSelected(event, sectionItem) {\r\n\r\n // check if the event is a keypress event, then check for the key pressed\r\n if (this.shouldHandleSelection(event, sectionItem)) {\r\n this.selectItem(event, sectionItem);\r\n }\r\n }\r\n\r\n /**\r\n * Handle small menu item selection.\r\n *\r\n * @param {Event} event Selection event\r\n * @param {object} item Selected item\r\n */\r\n\r\n }, {\r\n key: 'smallMenuItemSelected',\r\n value: function smallMenuItemSelected(event, item) {\r\n\r\n if (this.shouldHandleSelection(event, item)) {\r\n\r\n // item has submenus, navigate to them\r\n if (item.items) {\r\n this.setState({\r\n selectedItemKey: item.key\r\n });\r\n\r\n // leaf node, engage selection apparatus\r\n } else {\r\n this.selectItem(event, item);\r\n }\r\n }\r\n }\r\n\r\n /**\r\n * We were asked to go up a level\r\n */\r\n\r\n }, {\r\n key: 'getSelectedItem',\r\n\r\n\r\n /**\r\n * Returns the item corresponding to the given key\r\n *\r\n * @param {string} key Item key\r\n * @return {object} Corresponding item\r\n */\r\n value: function getSelectedItem(key) {\r\n return (0, _find2.default)(this.props.menuDefinition.concat(this.props.utilityDefinition), function (item) {\r\n return item.key === key;\r\n });\r\n }\r\n\r\n /**\r\n * Renders a single small megamenu items\r\n *\r\n * @param {object} item Item to render\r\n * @return {Element} The rendered element\r\n */\r\n\r\n }, {\r\n key: 'renderSmallItem',\r\n value: function renderSmallItem(item) {\r\n var _this2 = this;\r\n\r\n var classes = this.props.classes;\r\n\r\n // apply special header styling to text if we're at the top level of the menu\r\n var listItemClasses = this.state.selectedItemKey ? null : {\r\n primary: classes.smallMenuTopLevelItemText\r\n };\r\n\r\n return _react2.default.createElement(\r\n 'div',\r\n { key: item.key },\r\n _react2.default.createElement(\r\n _.ListItem,\r\n {\r\n classes: {\r\n root: classes.smallListItemOverrides\r\n },\r\n button: true,\r\n focusVisibleClassName: classes.listItemRoot,\r\n onClick: function onClick(event) {\r\n return _this2.smallMenuItemSelected(event, item);\r\n },\r\n onKeyPress: function onKeyPress(event) {\r\n return _this2.smallMenuItemSelected(event, item);\r\n },\r\n className: this.state.selectedItemKey ? null : classes.topLevelMenuItem,\r\n disabled: item.disabled,\r\n tabIndex: this.props.open ? 0 : -1\r\n },\r\n _react2.default.createElement(\r\n _.ListItemText,\r\n {\r\n classes: listItemClasses,\r\n className: item.disabled ? 'disabled' : null,\r\n primaryTypographyProps: this.getSmallListItemTypographyClass(item)\r\n },\r\n _react2.default.createElement(\r\n 'div',\r\n { className: this.props.classes.smallMenuItemContents },\r\n _react2.default.createElement(\r\n 'div',\r\n null,\r\n item.megaMenuContent || item.content\r\n ),\r\n item.label && _react2.default.createElement(\r\n 'div',\r\n null,\r\n item.label\r\n )\r\n )\r\n ),\r\n item.items && _react2.default.createElement(\r\n _.ListItemIcon,\r\n { className: classes.smallMenuIcon },\r\n _react2.default.createElement(_Icon2.default, { name: 'chevron-right' })\r\n )\r\n )\r\n );\r\n }\r\n\r\n /**\r\n * Renders the small version of the menu\r\n *\r\n * @param {Array.