@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.
- package/README.md +19 -1
- package/es/components/button/button_display/_button_display.styles.js +2 -2
- package/es/components/datagrid/body/data_grid_body_custom.js +48 -31
- package/es/components/date_picker/date_picker_range.styles.js +1 -1
- package/es/components/date_picker/super_date_picker/date_popover/absolute_tab.js +8 -2
- package/es/components/date_picker/super_date_picker/date_popover/date_popover_button.js +8 -2
- package/es/components/date_picker/super_date_picker/date_popover/date_popover_content.js +8 -2
- package/es/components/date_picker/super_date_picker/super_date_picker.js +27 -5
- package/es/components/link/external_link_icon.js +10 -8
- package/eui.d.ts +31 -5
- package/i18ntokens.json +64 -64
- package/lib/components/button/button_display/_button_display.styles.js +1 -1
- package/lib/components/datagrid/body/data_grid_body_custom.js +47 -30
- package/lib/components/date_picker/date_picker_range.styles.js +1 -1
- package/lib/components/date_picker/super_date_picker/date_popover/absolute_tab.js +8 -2
- package/lib/components/date_picker/super_date_picker/date_popover/date_popover_button.js +8 -2
- package/lib/components/date_picker/super_date_picker/date_popover/date_popover_content.js +8 -2
- package/lib/components/date_picker/super_date_picker/super_date_picker.js +27 -5
- package/lib/components/link/external_link_icon.js +9 -7
- package/optimize/es/components/button/button_display/_button_display.styles.js +2 -2
- package/optimize/es/components/datagrid/body/data_grid_body_custom.js +47 -30
- package/optimize/es/components/date_picker/date_picker_range.styles.js +1 -1
- package/optimize/es/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
- package/optimize/es/components/date_picker/super_date_picker/date_popover/date_popover_button.js +6 -2
- package/optimize/es/components/date_picker/super_date_picker/date_popover/date_popover_content.js +6 -2
- package/optimize/es/components/date_picker/super_date_picker/super_date_picker.js +11 -5
- package/optimize/es/components/link/external_link_icon.js +10 -8
- package/optimize/lib/components/button/button_display/_button_display.styles.js +1 -1
- package/optimize/lib/components/datagrid/body/data_grid_body_custom.js +46 -29
- package/optimize/lib/components/date_picker/date_picker_range.styles.js +1 -1
- package/optimize/lib/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
- package/optimize/lib/components/date_picker/super_date_picker/date_popover/date_popover_button.js +6 -2
- package/optimize/lib/components/date_picker/super_date_picker/date_popover/date_popover_content.js +6 -2
- package/optimize/lib/components/date_picker/super_date_picker/super_date_picker.js +11 -5
- package/optimize/lib/components/link/external_link_icon.js +9 -7
- package/package.json +3 -2
- package/src/global_styling/mixins/_index.scss +1 -4
- package/src/global_styling/mixins/_tool_tip.scss +0 -7
- package/src/themes/amsterdam/global_styling/mixins/_index.scss +1 -4
- package/test-env/components/button/button_display/_button_display.styles.js +1 -1
- package/test-env/components/datagrid/body/data_grid_body_custom.js +47 -30
- package/test-env/components/date_picker/date_picker_range.styles.js +1 -1
- package/test-env/components/date_picker/super_date_picker/date_popover/absolute_tab.js +8 -2
- package/test-env/components/date_picker/super_date_picker/date_popover/date_popover_button.js +8 -2
- package/test-env/components/date_picker/super_date_picker/date_popover/date_popover_content.js +8 -2
- package/test-env/components/date_picker/super_date_picker/super_date_picker.js +27 -5
- package/test-env/components/link/external_link_icon.js +9 -7
- package/src/global_styling/mixins/_button.scss +0 -149
- package/src/global_styling/mixins/_form.scss +0 -28
- 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
|
-
|
|
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
|
-
|
|
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": "
|
|
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
|
}
|
|
@@ -7,7 +7,4 @@
|
|
|
7
7
|
@import '../../../../global_styling/mixins/helpers';
|
|
8
8
|
@import 'states';
|
|
9
9
|
|
|
10
|
-
@import '../../../../global_styling/mixins/
|
|
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.
|
|
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
|
|
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
|
|
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.
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
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
|
-
}),
|
|
175
|
-
|
|
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
|
};
|
package/test-env/components/date_picker/super_date_picker/date_popover/date_popover_button.js
CHANGED
|
@@ -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,
|
package/test-env/components/date_picker/super_date_picker/date_popover/date_popover_content.js
CHANGED
|
@@ -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
|
-
|
|
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
|
-
|
|
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
|
-
}
|