@elastic/eui 96.0.0 → 97.0.0-backport.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/README.md +19 -1
  2. package/es/components/button/button_display/_button_display.styles.js +2 -2
  3. package/es/components/datagrid/body/data_grid_body_custom.js +48 -31
  4. package/es/components/date_picker/date_picker_range.styles.js +1 -1
  5. package/es/components/date_picker/super_date_picker/date_popover/absolute_tab.js +8 -2
  6. package/es/components/date_picker/super_date_picker/date_popover/date_popover_button.js +8 -2
  7. package/es/components/date_picker/super_date_picker/date_popover/date_popover_content.js +8 -2
  8. package/es/components/date_picker/super_date_picker/super_date_picker.js +27 -5
  9. package/es/components/link/external_link_icon.js +10 -8
  10. package/eui.d.ts +31 -5
  11. package/i18ntokens.json +64 -64
  12. package/lib/components/button/button_display/_button_display.styles.js +1 -1
  13. package/lib/components/datagrid/body/data_grid_body_custom.js +47 -30
  14. package/lib/components/date_picker/date_picker_range.styles.js +1 -1
  15. package/lib/components/date_picker/super_date_picker/date_popover/absolute_tab.js +8 -2
  16. package/lib/components/date_picker/super_date_picker/date_popover/date_popover_button.js +8 -2
  17. package/lib/components/date_picker/super_date_picker/date_popover/date_popover_content.js +8 -2
  18. package/lib/components/date_picker/super_date_picker/super_date_picker.js +27 -5
  19. package/lib/components/link/external_link_icon.js +9 -7
  20. package/optimize/es/components/button/button_display/_button_display.styles.js +2 -2
  21. package/optimize/es/components/datagrid/body/data_grid_body_custom.js +47 -30
  22. package/optimize/es/components/date_picker/date_picker_range.styles.js +1 -1
  23. package/optimize/es/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
  24. package/optimize/es/components/date_picker/super_date_picker/date_popover/date_popover_button.js +6 -2
  25. package/optimize/es/components/date_picker/super_date_picker/date_popover/date_popover_content.js +6 -2
  26. package/optimize/es/components/date_picker/super_date_picker/super_date_picker.js +11 -5
  27. package/optimize/es/components/link/external_link_icon.js +10 -8
  28. package/optimize/lib/components/button/button_display/_button_display.styles.js +1 -1
  29. package/optimize/lib/components/datagrid/body/data_grid_body_custom.js +46 -29
  30. package/optimize/lib/components/date_picker/date_picker_range.styles.js +1 -1
  31. package/optimize/lib/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
  32. package/optimize/lib/components/date_picker/super_date_picker/date_popover/date_popover_button.js +6 -2
  33. package/optimize/lib/components/date_picker/super_date_picker/date_popover/date_popover_content.js +6 -2
  34. package/optimize/lib/components/date_picker/super_date_picker/super_date_picker.js +11 -5
  35. package/optimize/lib/components/link/external_link_icon.js +9 -7
  36. package/package.json +3 -2
  37. package/src/global_styling/mixins/_index.scss +1 -4
  38. package/src/global_styling/mixins/_tool_tip.scss +0 -7
  39. package/src/themes/amsterdam/global_styling/mixins/_index.scss +1 -4
  40. package/test-env/components/button/button_display/_button_display.styles.js +1 -1
  41. package/test-env/components/datagrid/body/data_grid_body_custom.js +47 -30
  42. package/test-env/components/date_picker/date_picker_range.styles.js +1 -1
  43. package/test-env/components/date_picker/super_date_picker/date_popover/absolute_tab.js +8 -2
  44. package/test-env/components/date_picker/super_date_picker/date_popover/date_popover_button.js +8 -2
  45. package/test-env/components/date_picker/super_date_picker/date_popover/date_popover_content.js +8 -2
  46. package/test-env/components/date_picker/super_date_picker/super_date_picker.js +27 -5
  47. package/test-env/components/link/external_link_icon.js +9 -7
  48. package/src/global_styling/mixins/_button.scss +0 -149
  49. package/src/global_styling/mixins/_form.scss +0 -28
  50. package/src/global_styling/mixins/_panel.scss +0 -55
@@ -36,14 +36,16 @@ var EuiExternalLinkIcon = exports.EuiExternalLinkIcon = function EuiExternalLink
36
36
  rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
37
37
  var iconCssStyle = (0, _services.useEuiMemoizedStyles)(iconStyle);
38
38
  var showExternalLinkIcon = target === '_blank' && external !== false || external === true;
39
- var iconAriaLabel = (0, _i18n.useEuiI18n)('euiExternalLinkIcon.ariaLabel', 'External link');
40
- return (0, _react2.jsx)(_react.default.Fragment, null, showExternalLinkIcon && (0, _react2.jsx)(_icon.EuiIcon, (0, _extends2.default)({
39
+ return (0, _react2.jsx)(_react.default.Fragment, null, showExternalLinkIcon && (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_icon.EuiIcon, (0, _extends2.default)({
41
40
  css: iconCssStyle,
42
- "aria-label": iconAriaLabel,
43
41
  size: "s",
44
- type: "popout"
45
- }, rest)), target === '_blank' && (0, _react2.jsx)(_accessibility.EuiScreenReaderOnly, null, (0, _react2.jsx)("span", null, (0, _react2.jsx)(_i18n.EuiI18n, {
42
+ type: "popout",
43
+ role: "presentation"
44
+ }, rest)), target === '_blank' ? (0, _react2.jsx)(_accessibility.EuiScreenReaderOnly, null, (0, _react2.jsx)("span", null, (0, _react2.jsx)(_i18n.EuiI18n, {
46
45
  token: "euiExternalLinkIcon.newTarget.screenReaderOnlyText",
47
- default: "(opens in a new tab or window)"
48
- }))));
46
+ default: "(external, opens in a new tab or window)"
47
+ }))) : (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_accessibility.EuiScreenReaderOnly, null, (0, _react2.jsx)("span", null, (0, _react2.jsx)(_i18n.EuiI18n, {
48
+ token: "euiExternalLinkIcon.externalTarget.screenReaderOnlyText",
49
+ default: "(external)"
50
+ }))))));
49
51
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@elastic/eui",
3
3
  "description": "Elastic UI Component Library",
4
- "version": "96.0.0",
4
+ "version": "97.0.0-backport.0",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "main": "lib",
7
7
  "module": "es",
@@ -276,5 +276,6 @@
276
276
  ],
277
277
  "installConfig": {
278
278
  "hoistingLimits": "workspaces"
279
- }
279
+ },
280
+ "stableVersion": "97.0.0"
280
281
  }
@@ -5,7 +5,4 @@
5
5
  @import 'helpers';
6
6
  @import 'states';
7
7
 
8
- @import 'button';
9
- @import 'form';
10
- @import 'panel';
11
- @import 'tool_tip';
8
+ @import 'tool_tip'; // Needed by Elastic Charts
@@ -16,10 +16,3 @@
16
16
  background-color: $euiTooltipBorderColor;
17
17
  }
18
18
  }
19
-
20
- @mixin euiToolTipTitle {
21
- font-weight: $euiFontWeightBold;
22
- border-bottom: solid $euiBorderWidthThin $euiTooltipBorderColor;
23
- padding-bottom: $euiSizeXS;
24
- margin-bottom: $euiSizeXS;
25
- }
@@ -7,7 +7,4 @@
7
7
  @import '../../../../global_styling/mixins/helpers';
8
8
  @import 'states';
9
9
 
10
- @import '../../../../global_styling/mixins/button';
11
- @import '../../../../global_styling/mixins/form';
12
- @import '../../../../global_styling/mixins/panel';
13
- @import '../../../../global_styling/mixins/tool_tip';
10
+ @import '../../../../global_styling/mixins/tool_tip'; // Needed by Elastic Charts
@@ -17,7 +17,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
17
17
  // Provides a solid reset and base for handling sizing layout
18
18
  // Does not include any visual styles
19
19
  var euiButtonBaseCSS = exports.euiButtonBaseCSS = function euiButtonBaseCSS() {
20
- return "\n display: inline-block;\n appearance: none;\n cursor: pointer;\n ".concat((0, _global_styling.logicalTextAlignStyle)('center'), ";\n white-space: nowrap;\n ").concat((0, _global_styling.logicalCSS)('max-width', '100%'), ";\n vertical-align: middle;\n ");
20
+ return "\n display: inline-block;\n appearance: none;\n cursor: pointer;\n ".concat((0, _global_styling.logicalTextAlignCSS)('center'), ";\n white-space: nowrap;\n ").concat((0, _global_styling.logicalCSS)('max-width', '100%'), ";\n vertical-align: middle;\n ");
21
21
  };
22
22
  var _ref = process.env.NODE_ENV === "production" ? {
23
23
  name: "8595p9-isDisabled",
@@ -32,7 +32,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
32
32
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
33
33
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
34
34
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
35
- var EuiDataGridBodyCustomRender = exports.EuiDataGridBodyCustomRender = function EuiDataGridBodyCustomRender(_ref) {
35
+ var EuiDataGridBodyCustomRender = exports.EuiDataGridBodyCustomRender = /*#__PURE__*/(0, _react.memo)(function (_ref) {
36
36
  var renderCustomGridBody = _ref.renderCustomGridBody,
37
37
  renderCellValue = _ref.renderCellValue,
38
38
  cellContext = _ref.cellContext,
@@ -88,27 +88,31 @@ var EuiDataGridBodyCustomRender = exports.EuiDataGridBodyCustomRender = function
88
88
  }),
89
89
  setRowHeight = _useDefaultRowHeight.setRowHeight,
90
90
  getRowHeight = _useDefaultRowHeight.getRowHeight;
91
-
92
- /**
93
- * Header & footer
94
- */
95
- var _useDataGridHeader = (0, _header.useDataGridHeader)({
91
+ var headerRowProps = (0, _react.useMemo)(function () {
92
+ return {
96
93
  leadingControlColumns: leadingControlColumns,
97
94
  trailingControlColumns: trailingControlColumns,
98
95
  columns: columns,
99
96
  columnWidths: columnWidths,
100
97
  defaultColumnWidth: defaultColumnWidth,
101
98
  setColumnWidth: setColumnWidth,
102
- visibleColCount: visibleColCount,
103
99
  setVisibleColumns: setVisibleColumns,
100
+ visibleColCount: visibleColCount,
104
101
  switchColumnPos: switchColumnPos,
105
102
  sorting: sorting,
106
103
  schema: schema,
107
104
  schemaDetectors: schemaDetectors,
108
105
  gridStyles: gridStyles
109
- }),
106
+ };
107
+ }, [leadingControlColumns, trailingControlColumns, columns, columnWidths, defaultColumnWidth, setColumnWidth, visibleColCount, setVisibleColumns, switchColumnPos, sorting, schema, schemaDetectors, gridStyles]);
108
+
109
+ /**
110
+ * Header & footer
111
+ */
112
+ var _useDataGridHeader = (0, _header.useDataGridHeader)(headerRowProps),
110
113
  headerRow = _useDataGridHeader.headerRow;
111
- var _useDataGridFooter = (0, _footer.useDataGridFooter)({
114
+ var footerRowProps = (0, _react.useMemo)(function () {
115
+ return {
112
116
  renderFooterCellValue: renderFooterCellValue,
113
117
  renderCellPopover: renderCellPopover,
114
118
  rowIndex: visibleRows.visibleRowCount,
@@ -122,7 +126,9 @@ var EuiDataGridBodyCustomRender = exports.EuiDataGridBodyCustomRender = function
122
126
  defaultColumnWidth: defaultColumnWidth,
123
127
  schema: schema,
124
128
  gridStyles: gridStyles
125
- }),
129
+ };
130
+ }, [renderFooterCellValue, renderCellPopover, visibleRows.visibleRowCount, visibleColCount, interactiveCellId, leadingControlColumns, trailingControlColumns, columns, columnWidths, defaultColumnWidth, schema, gridStyles]);
131
+ var _useDataGridFooter = (0, _footer.useDataGridFooter)(footerRowProps),
126
132
  footerRow = _useDataGridFooter.footerRow;
127
133
 
128
134
  /**
@@ -149,19 +155,22 @@ var EuiDataGridBodyCustomRender = exports.EuiDataGridBodyCustomRender = function
149
155
  gridStyles: gridStyles
150
156
  };
151
157
  }, [schema, schemaDetectors, pagination, columns, leadingControlColumns, trailingControlColumns, visibleColCount, columnWidths, defaultColumnWidth, renderCellValue, cellContext, renderCellPopover, interactiveCellId, setRowHeight, rowHeightsOptions, rowHeightUtils, gridStyles]);
152
- var Cell = (0, _react.useCallback)(function (_ref2) {
153
- var colIndex = _ref2.colIndex,
154
- visibleRowIndex = _ref2.visibleRowIndex,
155
- rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
156
- var style = {
157
- height: rowHeightUtils.isAutoHeight(visibleRowIndex, rowHeightsOptions) ? 'auto' : getRowHeight(visibleRowIndex)
158
+ var Cell = (0, _react.useMemo)(function () {
159
+ return function (_ref2) {
160
+ var _rest$rowHeightsOptio;
161
+ var colIndex = _ref2.colIndex,
162
+ visibleRowIndex = _ref2.visibleRowIndex,
163
+ rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
164
+ var style = {
165
+ height: rowHeightUtils.isAutoHeight(visibleRowIndex, (_rest$rowHeightsOptio = rest.rowHeightsOptions) !== null && _rest$rowHeightsOptio !== void 0 ? _rest$rowHeightsOptio : rowHeightsOptions) ? 'auto' : getRowHeight(visibleRowIndex)
166
+ };
167
+ var props = _objectSpread({
168
+ colIndex: colIndex,
169
+ visibleRowIndex: visibleRowIndex,
170
+ style: style
171
+ }, cellProps);
172
+ return (0, _react2.jsx)(_cell.CellWrapper, (0, _extends2.default)({}, props, rest));
158
173
  };
159
- var props = _objectSpread({
160
- colIndex: colIndex,
161
- visibleRowIndex: visibleRowIndex,
162
- style: style
163
- }, cellProps);
164
- return (0, _react2.jsx)(_cell.CellWrapper, (0, _extends2.default)({}, props, rest));
165
174
  }, [cellProps, getRowHeight, rowHeightUtils, rowHeightsOptions]);
166
175
 
167
176
  // Allow consumers to pass custom props/attributes/listeners etc. to the wrapping div
@@ -169,15 +178,22 @@ var EuiDataGridBodyCustomRender = exports.EuiDataGridBodyCustomRender = function
169
178
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
170
179
  customGridBodyProps = _useState2[0],
171
180
  setCustomGridBodyProps = _useState2[1];
181
+ var customDataGridBodyProps = (0, _react.useMemo)(function () {
182
+ return {
183
+ gridWidth: gridWidth,
184
+ visibleColumns: visibleColumns,
185
+ visibleRowData: visibleRows,
186
+ Cell: Cell,
187
+ setCustomGridBodyProps: setCustomGridBodyProps,
188
+ headerRow: headerRow,
189
+ footerRow: footerRow
190
+ };
191
+ }, [gridWidth, visibleColumns, visibleRows, Cell, setCustomGridBodyProps, headerRow, footerRow]);
192
+ var BodyElement = renderCustomGridBody;
172
193
  return (0, _react2.jsx)("div", (0, _extends2.default)({}, customGridBodyProps, {
173
194
  className: (0, _classnames.default)('euiDataGrid__customRenderBody', className, customGridBodyProps === null || customGridBodyProps === void 0 ? void 0 : customGridBodyProps.className)
174
- }), headerRow, renderCustomGridBody({
175
- visibleColumns: visibleColumns,
176
- visibleRowData: visibleRows,
177
- Cell: Cell,
178
- setCustomGridBodyProps: setCustomGridBodyProps
179
- }), footerRow);
180
- };
195
+ }), (0, _react2.jsx)(BodyElement, customDataGridBodyProps));
196
+ });
181
197
  EuiDataGridBodyCustomRender.propTypes = {
182
198
  leadingControlColumns: _propTypes.default.arrayOf(_propTypes.default.shape({
183
199
  /**
@@ -798,4 +814,5 @@ EuiDataGridBodyCustomRender.propTypes = {
798
814
  gridItemsRendered: _propTypes.default.any.isRequired,
799
815
  wrapperRef: _propTypes.default.any.isRequired,
800
816
  className: _propTypes.default.string
801
- };
817
+ };
818
+ EuiDataGridBodyCustomRender.displayName = 'EuiDataGridBodyCustomRender';
@@ -15,7 +15,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
15
15
  * Side Public License, v 1.
16
16
  */
17
17
  var euiDatePickerRangeStyles = exports.euiDatePickerRangeStyles = {
18
- euiDatePickerRange: /*#__PURE__*/(0, _react.css)(".euiPopover,.react-datepicker__input-container,.euiDatePicker{", (0, _global_styling.logicalCSS)('height', '100%'), ";};label:euiDatePickerRange;")
18
+ euiDatePickerRange: /*#__PURE__*/(0, _react.css)(".euiPopover,.react-datepicker__input-container,.euiDatePicker{", (0, _global_styling.logicalCSS)('height', '100%'), ";}.euiPopover{flex:1;};label:euiDatePickerRange;")
19
19
  };
20
20
  var _ref = process.env.NODE_ENV === "production" ? {
21
21
  name: "bicgs9-noShadow",
@@ -42,6 +42,8 @@ var EuiAbsoluteTab = exports.EuiAbsoluteTab = function EuiAbsoluteTab(_ref) {
42
42
  locale = _ref.locale,
43
43
  roundUp = _ref.roundUp,
44
44
  utcOffset = _ref.utcOffset,
45
+ minDate = _ref.minDate,
46
+ maxDate = _ref.maxDate,
45
47
  labelPrefix = _ref.labelPrefix;
46
48
  var styles = (0, _services.useEuiMemoizedStyles)(_absolute_tab.euiAbsoluteTabDateFormStyles);
47
49
  var _useState = (0, _react.useState)(function () {
@@ -135,7 +137,9 @@ var EuiAbsoluteTab = exports.EuiAbsoluteTab = function EuiAbsoluteTab(_ref) {
135
137
  dateFormat: dateFormat,
136
138
  timeFormat: timeFormat,
137
139
  locale: locale,
138
- utcOffset: utcOffset
140
+ utcOffset: utcOffset,
141
+ minDate: minDate,
142
+ maxDate: maxDate
139
143
  }), (0, _react2.jsx)(_flex.EuiFlexGroup, {
140
144
  component: "form",
141
145
  onSubmit: function onSubmit(e) {
@@ -180,5 +184,7 @@ EuiAbsoluteTab.propTypes = {
180
184
  onChange: _propTypes.default.func.isRequired,
181
185
  roundUp: _propTypes.default.bool.isRequired,
182
186
  labelPrefix: _propTypes.default.string.isRequired,
183
- utcOffset: _propTypes.default.number
187
+ utcOffset: _propTypes.default.number,
188
+ minDate: _propTypes.default.any,
189
+ maxDate: _propTypes.default.any
184
190
  };
@@ -17,7 +17,7 @@ var _pretty_duration = require("../pretty_duration");
17
17
  var _date_popover_content = require("./date_popover_content");
18
18
  var _date_popover_button = require("./date_popover_button.styles");
19
19
  var _react2 = require("@emotion/react");
20
- var _excluded = ["position", "isDisabled", "isInvalid", "needsUpdating", "value", "buttonProps", "canRoundRelativeUnits", "roundUp", "onChange", "locale", "dateFormat", "utcOffset", "timeFormat", "isOpen", "onPopoverToggle", "onPopoverClose", "compressed", "timeOptions"];
20
+ var _excluded = ["position", "isDisabled", "isInvalid", "needsUpdating", "value", "buttonProps", "canRoundRelativeUnits", "roundUp", "onChange", "locale", "dateFormat", "utcOffset", "minDate", "maxDate", "timeFormat", "isOpen", "onPopoverToggle", "onPopoverClose", "compressed", "timeOptions"];
21
21
  /*
22
22
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
23
23
  * or more contributor license agreements. Licensed under the Elastic License
@@ -39,6 +39,8 @@ var EuiDatePopoverButton = exports.EuiDatePopoverButton = function EuiDatePopove
39
39
  locale = props.locale,
40
40
  dateFormat = props.dateFormat,
41
41
  utcOffset = props.utcOffset,
42
+ minDate = props.minDate,
43
+ maxDate = props.maxDate,
42
44
  timeFormat = props.timeFormat,
43
45
  isOpen = props.isOpen,
44
46
  onPopoverToggle = props.onPopoverToggle,
@@ -99,7 +101,9 @@ var EuiDatePopoverButton = exports.EuiDatePopoverButton = function EuiDatePopove
99
101
  locale: locale,
100
102
  position: position,
101
103
  utcOffset: utcOffset,
102
- timeOptions: timeOptions
104
+ timeOptions: timeOptions,
105
+ minDate: minDate,
106
+ maxDate: maxDate
103
107
  }));
104
108
  };
105
109
  EuiDatePopoverButton.propTypes = {
@@ -125,6 +129,8 @@ EuiDatePopoverButton.propTypes = {
125
129
  timeFormat: _propTypes.default.string.isRequired,
126
130
  value: _propTypes.default.string.isRequired,
127
131
  utcOffset: _propTypes.default.number,
132
+ minDate: _propTypes.default.any,
133
+ maxDate: _propTypes.default.any,
128
134
  compressed: _propTypes.default.bool,
129
135
  timeOptions: _propTypes.default.shape({
130
136
  timeTenseOptions: _propTypes.default.arrayOf(_propTypes.default.any.isRequired).isRequired,
@@ -38,7 +38,9 @@ var EuiDatePopoverContent = exports.EuiDatePopoverContent = function EuiDatePopo
38
38
  locale = _ref.locale,
39
39
  position = _ref.position,
40
40
  utcOffset = _ref.utcOffset,
41
- timeOptions = _ref.timeOptions;
41
+ timeOptions = _ref.timeOptions,
42
+ minDate = _ref.minDate,
43
+ maxDate = _ref.maxDate;
42
44
  var styles = (0, _services.useEuiMemoizedStyles)(_date_popover_content.euiDatePopoverContentStyles);
43
45
  var onTabClick = function onTabClick(selectedTab) {
44
46
  switch (selectedTab.id) {
@@ -67,7 +69,9 @@ var EuiDatePopoverContent = exports.EuiDatePopoverContent = function EuiDatePopo
67
69
  onChange: onChange,
68
70
  roundUp: roundUp,
69
71
  labelPrefix: labelPrefix,
70
- utcOffset: utcOffset
72
+ utcOffset: utcOffset,
73
+ minDate: minDate,
74
+ maxDate: maxDate
71
75
  }),
72
76
  'data-test-subj': 'superDatePickerAbsoluteTab',
73
77
  'aria-label': "".concat(labelPrefix, ": ").concat(absoluteLabel)
@@ -137,6 +141,8 @@ EuiDatePopoverContent.propTypes = {
137
141
  locale: _propTypes.default.any,
138
142
  position: _propTypes.default.oneOf(["start", "end"]).isRequired,
139
143
  utcOffset: _propTypes.default.number,
144
+ minDate: _propTypes.default.any,
145
+ maxDate: _propTypes.default.any,
140
146
  timeOptions: _propTypes.default.shape({
141
147
  timeTenseOptions: _propTypes.default.arrayOf(_propTypes.default.any.isRequired).isRequired,
142
148
  timeUnitsOptions: _propTypes.default.arrayOf(_propTypes.default.any.isRequired).isRequired,
@@ -46,7 +46,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
46
46
  * in compliance with, at your election, the Elastic License 2.0 or the Server
47
47
  * Side Public License, v 1.
48
48
  */ // eslint-disable-line import/named
49
- function isRangeInvalid(start, end) {
49
+ function isRangeInvalid(start, end, minDate, maxDate) {
50
50
  if (start === 'now' && end === 'now') {
51
51
  return true;
52
52
  }
@@ -54,7 +54,7 @@ function isRangeInvalid(start, end) {
54
54
  var endMoment = _datemath.default.parse(end, {
55
55
  roundUp: true
56
56
  });
57
- var isInvalid = !startMoment || !endMoment || !startMoment.isValid() || !endMoment.isValid() || !(0, _moment.default)(startMoment).isValid() || !(0, _moment.default)(endMoment).isValid() || startMoment.isAfter(endMoment);
57
+ var isInvalid = !startMoment || !endMoment || !startMoment.isValid() || !endMoment.isValid() || !(0, _moment.default)(startMoment).isValid() || !(0, _moment.default)(endMoment).isValid() || startMoment.isAfter(endMoment) || endMoment.isBefore(startMoment) || minDate != null && startMoment.isBefore(minDate) || maxDate != null && endMoment.isAfter(maxDate);
58
58
  return isInvalid;
59
59
  }
60
60
  var EuiSuperDatePickerInternal = exports.EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
@@ -73,7 +73,7 @@ var EuiSuperDatePickerInternal = exports.EuiSuperDatePickerInternal = /*#__PURE_
73
73
  },
74
74
  start: _this.props.start,
75
75
  end: _this.props.end,
76
- isInvalid: isRangeInvalid(_this.props.start, _this.props.end),
76
+ isInvalid: isRangeInvalid(_this.props.start, _this.props.end, _this.props.minDate, _this.props.maxDate),
77
77
  hasChanged: false,
78
78
  showPrettyDuration: (0, _pretty_duration.showPrettyDuration)(_this.props.start, _this.props.end, _this.props.commonlyUsedRanges),
79
79
  isStartDatePopoverOpen: false,
@@ -82,7 +82,7 @@ var EuiSuperDatePickerInternal = exports.EuiSuperDatePickerInternal = /*#__PURE_
82
82
  (0, _defineProperty2.default)(_this, "setTime", function (_ref) {
83
83
  var end = _ref.end,
84
84
  start = _ref.start;
85
- var isInvalid = isRangeInvalid(start, end);
85
+ var isInvalid = isRangeInvalid(start, end, _this.props.minDate, _this.props.maxDate);
86
86
  _this.setState({
87
87
  start: start,
88
88
  end: end,
@@ -271,6 +271,8 @@ var EuiSuperDatePickerInternal = exports.EuiSuperDatePickerInternal = /*#__PURE_
271
271
  locale = _this$props3.locale,
272
272
  timeFormat = _this$props3.timeFormat,
273
273
  utcOffset = _this$props3.utcOffset,
274
+ minDate = _this$props3.minDate,
275
+ maxDate = _this$props3.maxDate,
274
276
  compressed = _this$props3.compressed,
275
277
  onFocus = _this$props3.onFocus,
276
278
  styles = _this$props3.memoizedStyles;
@@ -345,6 +347,8 @@ var EuiSuperDatePickerInternal = exports.EuiSuperDatePickerInternal = /*#__PURE_
345
347
  utcOffset: utcOffset,
346
348
  timeFormat: timeFormat,
347
349
  locale: locale || contextLocale,
350
+ minDate: minDate,
351
+ maxDate: maxDate,
348
352
  canRoundRelativeUnits: canRoundRelativeUnits,
349
353
  isOpen: _this.state.isStartDatePopoverOpen,
350
354
  onPopoverToggle: _this.onStartDatePopoverToggle,
@@ -367,6 +371,8 @@ var EuiSuperDatePickerInternal = exports.EuiSuperDatePickerInternal = /*#__PURE_
367
371
  utcOffset: utcOffset,
368
372
  timeFormat: timeFormat,
369
373
  locale: locale || contextLocale,
374
+ minDate: minDate,
375
+ maxDate: maxDate,
370
376
  canRoundRelativeUnits: canRoundRelativeUnits,
371
377
  roundUp: true,
372
378
  isOpen: _this.state.isEndDatePopoverOpen,
@@ -472,7 +478,7 @@ var EuiSuperDatePickerInternal = exports.EuiSuperDatePickerInternal = /*#__PURE_
472
478
  },
473
479
  start: nextProps.start,
474
480
  end: nextProps.end,
475
- isInvalid: isRangeInvalid(nextProps.start, nextProps.end),
481
+ isInvalid: isRangeInvalid(nextProps.start, nextProps.end, nextProps.minDate, nextProps.maxDate),
476
482
  hasChanged: false,
477
483
  showPrettyDuration: (0, _pretty_duration.showPrettyDuration)(nextProps.start, nextProps.end, nextProps.commonlyUsedRanges)
478
484
  };
@@ -603,6 +609,14 @@ EuiSuperDatePickerInternal.propTypes = {
603
609
  refreshIntervalUnits: _propTypes.default.any,
604
610
  start: _propTypes.default.oneOfType([_propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]), _propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]).isRequired]),
605
611
  end: _propTypes.default.oneOfType([_propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]), _propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]).isRequired]),
612
+ /**
613
+ * Defines min. date accepted as a selection (in moment format)
614
+ */
615
+ minDate: _propTypes.default.any,
616
+ /**
617
+ * Defines max. date accepted as a selection (in moment format)
618
+ */
619
+ maxDate: _propTypes.default.any,
606
620
  /**
607
621
  * Specifies the formatted used when displaying times
608
622
  * @default 'HH:mm'
@@ -786,6 +800,14 @@ EuiSuperDatePicker.propTypes = {
786
800
  */
787
801
  start: _propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]),
788
802
  end: _propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]),
803
+ /**
804
+ * Defines min. date accepted as a selection (in moment format)
805
+ */
806
+ minDate: _propTypes.default.any,
807
+ /**
808
+ * Defines max. date accepted as a selection (in moment format)
809
+ */
810
+ maxDate: _propTypes.default.any,
789
811
  /**
790
812
  * Specifies the formatted used when displaying times
791
813
  * @default 'HH:mm'
@@ -37,16 +37,18 @@ var EuiExternalLinkIcon = exports.EuiExternalLinkIcon = function EuiExternalLink
37
37
  rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
38
38
  var iconCssStyle = (0, _services.useEuiMemoizedStyles)(iconStyle);
39
39
  var showExternalLinkIcon = target === '_blank' && external !== false || external === true;
40
- var iconAriaLabel = (0, _i18n.useEuiI18n)('euiExternalLinkIcon.ariaLabel', 'External link');
41
- return (0, _react2.jsx)(_react.default.Fragment, null, showExternalLinkIcon && (0, _react2.jsx)(_icon.EuiIcon, (0, _extends2.default)({
40
+ return (0, _react2.jsx)(_react.default.Fragment, null, showExternalLinkIcon && (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_icon.EuiIcon, (0, _extends2.default)({
42
41
  css: iconCssStyle,
43
- "aria-label": iconAriaLabel,
44
42
  size: "s",
45
- type: "popout"
46
- }, rest)), target === '_blank' && (0, _react2.jsx)(_accessibility.EuiScreenReaderOnly, null, (0, _react2.jsx)("span", null, (0, _react2.jsx)(_i18n.EuiI18n, {
43
+ type: "popout",
44
+ role: "presentation"
45
+ }, rest)), target === '_blank' ? (0, _react2.jsx)(_accessibility.EuiScreenReaderOnly, null, (0, _react2.jsx)("span", null, (0, _react2.jsx)(_i18n.EuiI18n, {
47
46
  token: "euiExternalLinkIcon.newTarget.screenReaderOnlyText",
48
- default: "(opens in a new tab or window)"
49
- }))));
47
+ default: "(external, opens in a new tab or window)"
48
+ }))) : (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_accessibility.EuiScreenReaderOnly, null, (0, _react2.jsx)("span", null, (0, _react2.jsx)(_i18n.EuiI18n, {
49
+ token: "euiExternalLinkIcon.externalTarget.screenReaderOnlyText",
50
+ default: "(external)"
51
+ }))))));
50
52
  };
51
53
  EuiExternalLinkIcon.propTypes = {
52
54
  target: _propTypes.default.any,
@@ -1,149 +0,0 @@
1
- // Provides a solid reset and base for handling sizing layout
2
- // Does not include any visual styles
3
- @mixin euiButtonBase {
4
- display: inline-block;
5
- appearance: none;
6
- cursor: pointer;
7
- height: $euiButtonHeight;
8
- line-height: $euiButtonHeight; // prevents descenders from getting cut off
9
- text-align: center;
10
- white-space: nowrap;
11
- max-width: 100%;
12
- vertical-align: middle;
13
- }
14
-
15
- // Adds the focus (and hover) animation for translating up 1px
16
- @mixin euiButtonFocus {
17
- @include euiCanAnimate {
18
- transition: transform $euiAnimSpeedNormal ease-in-out, background-color $euiAnimSpeedNormal ease-in-out;
19
-
20
- &:hover:not(:disabled) {
21
- transform: translateY(-1px);
22
- }
23
-
24
- &:focus {
25
- animation: euiButtonActive $euiAnimSpeedNormal $euiAnimSlightBounce;
26
- }
27
-
28
- &:active:not(:disabled) {
29
- transform: translateY(1px);
30
- }
31
- }
32
- }
33
-
34
- // All of the button base styles including the base, focus, font, and initial styles
35
- // Does not include individual alterations like color or sizes
36
- @mixin euiButton {
37
- @include euiButtonBase;
38
- @include euiFont;
39
- @include euiFontSize;
40
- @include euiButtonFocus;
41
-
42
- font-weight: $euiButtonFontWeight;
43
- text-decoration: none;
44
- outline-offset: -1px;
45
-
46
- &:hover:not(:disabled),
47
- &:focus {
48
- text-decoration: underline;
49
- }
50
- }
51
-
52
- // Correctly lays out the contents of a button when using the proper dom elements of:
53
- // <button>
54
- // <span className="__content">
55
- // {icon/spinner}
56
- // {child}
57
- // </span>
58
- // </button>
59
- // 1. Apply margin to all but last item in the flex.
60
- // 2. Margin gets flipped because of the row-reverse.
61
- @mixin euiButtonContent($isReverse: false) {
62
- height: 100%;
63
- width: 100%;
64
- vertical-align: middle;
65
-
66
- .euiButtonContent__icon,
67
- .euiButtonContent__spinner {
68
- flex-shrink: 0; // Ensures the icons/spinner don't scale down below their intended size
69
- }
70
-
71
- @if ($isReverse) {
72
- flex-direction: row-reverse;
73
-
74
- > * + * {
75
- margin-inline-start: 0; // 1, 2
76
- margin-inline-end: $euiSizeS; // 1, 2
77
- }
78
- } @else {
79
- display: flex;
80
- justify-content: center;
81
- align-items: center;
82
-
83
- > * + * {
84
- margin-inline-start: $euiSizeS; // 1
85
- }
86
- }
87
- }
88
-
89
- @mixin euiButtonContentDisabled {
90
- pointer-events: auto;
91
- cursor: not-allowed;
92
-
93
- &:hover,
94
- &:focus,
95
- &:focus-within {
96
- text-decoration: none;
97
- }
98
-
99
- .euiButtonContent__spinner {
100
- border-color: euiLoadingSpinnerBorderColors(currentColor);
101
- }
102
- }
103
-
104
- /*
105
- * Creates the Amsterdam style of button with a transparent background
106
- */
107
- @mixin euiButtonDefaultStyle($color: 'primary', $includeStates: true, $transparency: $euiButtonDefaultTransparency) {
108
- $backgroundColor: $color;
109
-
110
- @if (map-has-key($euiButtonTypes, $color)) {
111
- $backgroundColor: map-get($euiButtonTypes, $color);
112
- }
113
-
114
- $percentConversion: $transparency * 100%;
115
- // This variable simulates the possibly darkest background the button could be on
116
- // Simulates the 20% opaque color on top of the page background color
117
- $backgroundColorSimulated: mix($euiPageBackgroundColor, $backgroundColor, $percentConversion);
118
- // Then we can calculate the darkest text color needed
119
- color: makeHighContrastColor($backgroundColor, $backgroundColorSimulated);
120
- // But still use transparency
121
- background-color: transparentize($backgroundColor, $transparency);
122
-
123
- @if ($includeStates) {
124
- &:not([class*='isDisabled']) {
125
- &:hover,
126
- &:focus {
127
- // Duplicated from inert state simply to override default theme
128
- background-color: transparentize($backgroundColor, $transparency);
129
- }
130
- }
131
- }
132
- }
133
-
134
- /*
135
- * Creates the Amsterdam style of fill button
136
- */
137
- @mixin euiButtonFillStyle($color: 'primary') {
138
- $backgroundColor: $color;
139
-
140
- @if (map-has-key($euiButtonTypes, $color)) {
141
- $backgroundColor: map-get($euiButtonTypes, $color);
142
- }
143
-
144
- background-color: $backgroundColor;
145
- color: chooseLightOrDarkText($backgroundColor);
146
- }
147
-
148
- // Keyframe animation declarations can be found in
149
- // utility/animations.scss
@@ -1,28 +0,0 @@
1
- // 1. Must supply both values to background-size or some browsers apply the single value to both directions
2
-
3
- @mixin euiFormControlDefaultShadow($borderOnly: false) {
4
- background-color: $euiFormBackgroundColor;
5
- background-repeat: no-repeat;
6
- background-size: 0% 100%; // 1
7
-
8
- @if ($borderOnly) {
9
- box-shadow: inset 0 0 0 1px $euiFormBorderColor;
10
- } @else {
11
- box-shadow:
12
- #{$euiFormControlBoxShadow},
13
- inset 0 0 0 1px $euiFormBorderColor;
14
- }
15
-
16
- transition:
17
- box-shadow $euiAnimSpeedFast ease-in,
18
- background-image $euiAnimSpeedFast ease-in,
19
- background-size $euiAnimSpeedFast ease-in,
20
- background-color $euiAnimSpeedFast ease-in;
21
-
22
- // Fixes bug in Firefox where adding a transition to the background-color
23
- // caused a flash of differently styled dropdown.
24
- @supports (-moz-appearance: none) {
25
- // List *must* be in the same order as the above.
26
- transition-property: box-shadow, background-image, background-size;
27
- }
28
- }