@elastic/eui 104.0.2 → 104.1.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/es/components/basic_table/in_memory_table.js +18 -2
- package/es/components/code/code.styles.js +1 -1
- package/es/components/code/code_syntax.styles.js +1 -0
- package/es/components/date_picker/date_picker.js +2 -1
- package/es/components/date_picker/date_picker_range.js +18 -16
- package/es/components/date_picker/super_date_picker/super_date_picker.js +5 -9
- package/es/components/form/form_control_layout/form_control_layout_delimited.js +4 -4
- package/es/themes/amsterdam/global_styling/variables/_components.js +315 -310
- package/eui.d.ts +14 -5
- package/lib/components/basic_table/in_memory_table.js +18 -2
- package/lib/components/code/code.styles.js +1 -1
- package/lib/components/code/code_syntax.styles.js +1 -0
- package/lib/components/date_picker/date_picker.js +2 -1
- package/lib/components/date_picker/date_picker_range.js +18 -16
- package/lib/components/date_picker/super_date_picker/super_date_picker.js +5 -9
- package/lib/components/form/form_control_layout/form_control_layout_delimited.js +4 -4
- package/lib/themes/amsterdam/global_styling/variables/_components.js +315 -310
- package/optimize/es/components/basic_table/in_memory_table.js +3 -2
- package/optimize/es/components/code/code.styles.js +1 -1
- package/optimize/es/components/code/code_syntax.styles.js +1 -0
- package/optimize/es/components/date_picker/date_picker.js +2 -1
- package/optimize/es/components/date_picker/date_picker_range.js +16 -14
- package/optimize/es/components/date_picker/super_date_picker/super_date_picker.js +5 -9
- package/optimize/es/components/form/form_control_layout/form_control_layout_delimited.js +2 -2
- package/optimize/es/themes/amsterdam/global_styling/variables/_components.js +315 -310
- package/optimize/lib/components/basic_table/in_memory_table.js +3 -2
- package/optimize/lib/components/code/code.styles.js +1 -1
- package/optimize/lib/components/code/code_syntax.styles.js +1 -0
- package/optimize/lib/components/date_picker/date_picker.js +2 -1
- package/optimize/lib/components/date_picker/date_picker_range.js +16 -14
- package/optimize/lib/components/date_picker/super_date_picker/super_date_picker.js +5 -9
- package/optimize/lib/components/form/form_control_layout/form_control_layout_delimited.js +2 -2
- package/optimize/lib/themes/amsterdam/global_styling/variables/_components.js +315 -310
- package/package.json +4 -4
- package/test-env/components/basic_table/in_memory_table.js +18 -2
- package/test-env/components/code/code.styles.js +1 -1
- package/test-env/components/code/code_syntax.styles.js +1 -0
- package/test-env/components/date_picker/date_picker.js +2 -1
- package/test-env/components/date_picker/date_picker_range.js +18 -16
- package/test-env/components/date_picker/super_date_picker/super_date_picker.js +5 -9
- package/test-env/components/form/form_control_layout/form_control_layout_delimited.js +4 -4
- package/test-env/themes/amsterdam/global_styling/variables/_components.js +315 -310
|
@@ -8,7 +8,7 @@ import _inherits from "@babel/runtime/helpers/inherits";
|
|
|
8
8
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
9
9
|
var _excluded = ["schema"],
|
|
10
10
|
_excluded2 = ["onChange"],
|
|
11
|
-
_excluded3 = ["columns", "loading", "message", "error", "selection", "compressed", "pagination", "sorting", "itemIdToExpandedRowMap", "itemId", "rowProps", "cellProps", "tableLayout", "items", "search", "searchFormat", "onTableChange", "executeQueryOptions", "allowNeutralSort", "childrenBetween"];
|
|
11
|
+
_excluded3 = ["columns", "loading", "message", "noItemsMessage", "error", "selection", "compressed", "pagination", "sorting", "itemIdToExpandedRowMap", "itemId", "rowProps", "cellProps", "tableLayout", "items", "search", "searchFormat", "onTableChange", "executeQueryOptions", "allowNeutralSort", "childrenBetween"];
|
|
12
12
|
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
|
|
13
13
|
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
14
14
|
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; }
|
|
@@ -366,6 +366,7 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
|
|
|
366
366
|
columns = _this$props2.columns,
|
|
367
367
|
loading = _this$props2.loading,
|
|
368
368
|
message = _this$props2.message,
|
|
369
|
+
noItemsMessage = _this$props2.noItemsMessage,
|
|
369
370
|
error = _this$props2.error,
|
|
370
371
|
selection = _this$props2.selection,
|
|
371
372
|
compressed = _this$props2.compressed,
|
|
@@ -427,7 +428,7 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
|
|
|
427
428
|
onChange: this.onTableChange,
|
|
428
429
|
error: error,
|
|
429
430
|
loading: loading,
|
|
430
|
-
noItemsMessage: message,
|
|
431
|
+
noItemsMessage: noItemsMessage || message,
|
|
431
432
|
tableLayout: tableLayout,
|
|
432
433
|
compressed: compressed,
|
|
433
434
|
itemIdToExpandedRowMap: itemIdToExpandedRowMap
|
|
@@ -25,7 +25,7 @@ export var euiCodeStyles = function euiCodeStyles(euiThemeContext) {
|
|
|
25
25
|
/*
|
|
26
26
|
* 1. Size the code against the text its embedded within.
|
|
27
27
|
*/
|
|
28
|
-
euiCode: /*#__PURE__*/css("font-family:", euiTheme.font.familyCode, ";font-size:0.9em;", logicalShorthandCSS('padding', '0.2em 0.5em'), "background-color:", codeSyntaxVariables.
|
|
28
|
+
euiCode: /*#__PURE__*/css("font-family:", euiTheme.font.familyCode, ";font-size:0.9em;", logicalShorthandCSS('padding', '0.2em 0.5em'), "background-color:", codeSyntaxVariables.inlineBackgroundColor, ";", highContrastModeStyles(euiThemeContext, {
|
|
29
29
|
forced: "\n border: ".concat(euiTheme.border.thin, ";\n ")
|
|
30
30
|
}), " border-radius:", euiTheme.border.radius.small, ";font-weight:", euiTheme.font.weight.bold, ";color:", codeSyntaxVariables.inlineCodeColor, ";", codeSyntaxVariables.tokensCss, " .token.atrule .token.rule,.token.keyword{color:", codeSyntaxVariables.inlineCodeKeywordColor, ";};label:euiCode;"),
|
|
31
31
|
transparentBackground: _ref
|
|
@@ -26,6 +26,7 @@ export var euiCodeSyntaxVariables = function euiCodeSyntaxVariables(euiThemeCont
|
|
|
26
26
|
return {
|
|
27
27
|
backgroundColor: backgroundColor,
|
|
28
28
|
color: color,
|
|
29
|
+
inlineBackgroundColor: euiTheme.components.codeInlineBackground,
|
|
29
30
|
inlineCodeColor: euiTheme.components.codeInlineColor,
|
|
30
31
|
selectedBackgroundColor: euiTheme.components.codeBackgroundSelected,
|
|
31
32
|
commentColor: euiTheme.components.codeCommentColor,
|
|
@@ -52,6 +52,7 @@ var unsupportedProps = [
|
|
|
52
52
|
// An internal EUI styling concern that consumers shouldn't need to access
|
|
53
53
|
'defaultInputProps'];
|
|
54
54
|
export var EuiDatePicker = function EuiDatePicker(_ref) {
|
|
55
|
+
var _selected$isValid;
|
|
55
56
|
var _ref$adjustDateOnChan = _ref.adjustDateOnChange,
|
|
56
57
|
adjustDateOnChange = _ref$adjustDateOnChan === void 0 ? true : _ref$adjustDateOnChan,
|
|
57
58
|
append = _ref.append,
|
|
@@ -103,7 +104,7 @@ export var EuiDatePicker = function EuiDatePicker(_ref) {
|
|
|
103
104
|
utcOffset = _ref.utcOffset,
|
|
104
105
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
105
106
|
// Check for whether the passed `selected` moment date is valid
|
|
106
|
-
var isInvalid = _isInvalid || ((selected === null || selected === void 0 ? void 0 :
|
|
107
|
+
var isInvalid = _isInvalid || ((selected === null || selected === void 0 || (_selected$isValid = selected.isValid) === null || _selected$isValid === void 0 ? void 0 : _selected$isValid.call(selected)) === false ? true : undefined);
|
|
107
108
|
var styles = useEuiMemoizedStyles(euiDatePickerStyles);
|
|
108
109
|
var cssStyles = [styles.euiDatePicker].concat(_toConsumableArray(inline ? [styles.inline.inline, isInvalid && !(disabled || readOnly) && styles.inline.invalid, shadow ? styles.inline.shadow : styles.inline.noShadow, disabled && styles.inline.disabled, readOnly && styles.inline.readOnly] : []));
|
|
109
110
|
var calendarStyles = useEuiMemoizedStyles(euiReactDatePickerStyles);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
-
var _excluded = ["children", "className", "startDateControl", "endDateControl", "iconType", "inline", "shadow", "fullWidth", "compressed", "isCustom", "readOnly", "isLoading", "isInvalid", "disabled", "onFocus", "onBlur", "append", "prepend"];
|
|
3
|
+
var _excluded = ["children", "className", "startDateControl", "endDateControl", "iconType", "inline", "shadow", "fullWidth", "compressed", "isCustom", "readOnly", "isLoading", "isInvalid", "disabled", "onFocus", "onBlur", "append", "prepend", "delimiter"];
|
|
4
4
|
/*
|
|
5
5
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
6
6
|
* or more contributor license agreements. Licensed under the Elastic License
|
|
@@ -36,6 +36,7 @@ export var EuiDatePickerRange = function EuiDatePickerRange(_ref) {
|
|
|
36
36
|
_onBlur = _ref.onBlur,
|
|
37
37
|
append = _ref.append,
|
|
38
38
|
prepend = _ref.prepend,
|
|
39
|
+
delimiter = _ref.delimiter,
|
|
39
40
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
40
41
|
// `fullWidth` and `compressed` should not affect inline datepickers (matches non-range behavior)
|
|
41
42
|
var fullWidth = _fullWidth && !inline;
|
|
@@ -44,50 +45,50 @@ export var EuiDatePickerRange = function EuiDatePickerRange(_ref) {
|
|
|
44
45
|
var inlineStyles = useEuiMemoizedStyles(euiDatePickerRangeInlineStyles);
|
|
45
46
|
var cssStyles = !inline ? styles.euiDatePickerRange : [inlineStyles.euiDatePickerRangeInline,
|
|
46
47
|
// Determine the inline container query to use based on the width of the react-datepicker
|
|
47
|
-
startDateControl.props.showTimeSelect || endDateControl.props.showTimeSelect ? inlineStyles.responsiveWithTimeSelect : inlineStyles.responsive, shadow && inlineStyles.shadow];
|
|
48
|
+
startDateControl !== null && startDateControl !== void 0 && startDateControl.props.showTimeSelect || endDateControl !== null && endDateControl !== void 0 && endDateControl.props.showTimeSelect ? inlineStyles.responsiveWithTimeSelect : inlineStyles.responsive, shadow && inlineStyles.shadow];
|
|
48
49
|
var startControl = startDateControl;
|
|
49
50
|
var endControl = endDateControl;
|
|
50
51
|
if (!isCustom) {
|
|
51
|
-
startControl = /*#__PURE__*/cloneElement(startDateControl, {
|
|
52
|
+
startControl = startControl && /*#__PURE__*/cloneElement(startDateControl, {
|
|
52
53
|
controlOnly: true,
|
|
53
54
|
showIcon: false,
|
|
54
55
|
inline: inline,
|
|
55
56
|
compressed: compressed,
|
|
56
57
|
fullWidth: fullWidth,
|
|
57
58
|
readOnly: readOnly,
|
|
58
|
-
disabled: disabled || startDateControl.props.disabled,
|
|
59
|
-
isInvalid: isInvalid || startDateControl.props.isInvalid,
|
|
60
|
-
className: classNames('euiDatePickerRange__start', startDateControl.props.className),
|
|
59
|
+
disabled: disabled || (startDateControl === null || startDateControl === void 0 ? void 0 : startDateControl.props.disabled),
|
|
60
|
+
isInvalid: isInvalid || (startDateControl === null || startDateControl === void 0 ? void 0 : startDateControl.props.isInvalid),
|
|
61
|
+
className: classNames('euiDatePickerRange__start', startDateControl === null || startDateControl === void 0 ? void 0 : startDateControl.props.className),
|
|
61
62
|
onBlur: function onBlur(event) {
|
|
62
63
|
var _startDateControl$pro, _startDateControl$pro2;
|
|
63
|
-
(_startDateControl$pro = startDateControl.props) === null || _startDateControl$pro === void 0 || (_startDateControl$pro2 = _startDateControl$pro.onBlur) === null || _startDateControl$pro2 === void 0 || _startDateControl$pro2.call(_startDateControl$pro, event);
|
|
64
|
+
startDateControl === null || startDateControl === void 0 || (_startDateControl$pro = startDateControl.props) === null || _startDateControl$pro === void 0 || (_startDateControl$pro2 = _startDateControl$pro.onBlur) === null || _startDateControl$pro2 === void 0 || _startDateControl$pro2.call(_startDateControl$pro, event);
|
|
64
65
|
_onBlur === null || _onBlur === void 0 || _onBlur(event);
|
|
65
66
|
},
|
|
66
67
|
onFocus: function onFocus(event) {
|
|
67
68
|
var _startDateControl$pro3, _startDateControl$pro4;
|
|
68
|
-
(_startDateControl$pro3 = startDateControl.props) === null || _startDateControl$pro3 === void 0 || (_startDateControl$pro4 = _startDateControl$pro3.onFocus) === null || _startDateControl$pro4 === void 0 || _startDateControl$pro4.call(_startDateControl$pro3, event);
|
|
69
|
+
startDateControl === null || startDateControl === void 0 || (_startDateControl$pro3 = startDateControl.props) === null || _startDateControl$pro3 === void 0 || (_startDateControl$pro4 = _startDateControl$pro3.onFocus) === null || _startDateControl$pro4 === void 0 || _startDateControl$pro4.call(_startDateControl$pro3, event);
|
|
69
70
|
_onFocus === null || _onFocus === void 0 || _onFocus(event);
|
|
70
71
|
}
|
|
71
72
|
});
|
|
72
|
-
endControl = /*#__PURE__*/cloneElement(endDateControl, {
|
|
73
|
+
endControl = endControl && /*#__PURE__*/cloneElement(endDateControl, {
|
|
73
74
|
controlOnly: true,
|
|
74
75
|
showIcon: false,
|
|
75
76
|
inline: inline,
|
|
76
77
|
compressed: compressed,
|
|
77
78
|
fullWidth: fullWidth,
|
|
78
79
|
readOnly: readOnly,
|
|
79
|
-
disabled: disabled || endDateControl.props.disabled,
|
|
80
|
-
isInvalid: isInvalid || endDateControl.props.isInvalid,
|
|
80
|
+
disabled: disabled || (endDateControl === null || endDateControl === void 0 ? void 0 : endDateControl.props.disabled),
|
|
81
|
+
isInvalid: isInvalid || (endDateControl === null || endDateControl === void 0 ? void 0 : endDateControl.props.isInvalid),
|
|
81
82
|
popoverPlacement: 'downRight',
|
|
82
|
-
className: classNames('euiDatePickerRange__end', endDateControl.props.className),
|
|
83
|
+
className: classNames('euiDatePickerRange__end', endDateControl === null || endDateControl === void 0 ? void 0 : endDateControl.props.className),
|
|
83
84
|
onBlur: function onBlur(event) {
|
|
84
85
|
var _endDateControl$props, _endDateControl$props2;
|
|
85
|
-
(_endDateControl$props = endDateControl.props) === null || _endDateControl$props === void 0 || (_endDateControl$props2 = _endDateControl$props.onBlur) === null || _endDateControl$props2 === void 0 || _endDateControl$props2.call(_endDateControl$props, event);
|
|
86
|
+
endDateControl === null || endDateControl === void 0 || (_endDateControl$props = endDateControl.props) === null || _endDateControl$props === void 0 || (_endDateControl$props2 = _endDateControl$props.onBlur) === null || _endDateControl$props2 === void 0 || _endDateControl$props2.call(_endDateControl$props, event);
|
|
86
87
|
_onBlur === null || _onBlur === void 0 || _onBlur(event);
|
|
87
88
|
},
|
|
88
89
|
onFocus: function onFocus(event) {
|
|
89
90
|
var _endDateControl$props3, _endDateControl$props4;
|
|
90
|
-
(_endDateControl$props3 = endDateControl.props) === null || _endDateControl$props3 === void 0 || (_endDateControl$props4 = _endDateControl$props3.onFocus) === null || _endDateControl$props4 === void 0 || _endDateControl$props4.call(_endDateControl$props3, event);
|
|
91
|
+
endDateControl === null || endDateControl === void 0 || (_endDateControl$props3 = endDateControl.props) === null || _endDateControl$props3 === void 0 || (_endDateControl$props4 = _endDateControl$props3.onFocus) === null || _endDateControl$props4 === void 0 || _endDateControl$props4.call(_endDateControl$props3, event);
|
|
91
92
|
_onFocus === null || _onFocus === void 0 || _onFocus(event);
|
|
92
93
|
}
|
|
93
94
|
});
|
|
@@ -102,6 +103,7 @@ export var EuiDatePickerRange = function EuiDatePickerRange(_ref) {
|
|
|
102
103
|
className: classes,
|
|
103
104
|
css: cssStyles
|
|
104
105
|
}, rest), ___EmotionJSX(EuiFormControlLayoutDelimited, {
|
|
106
|
+
delimiter: delimiter,
|
|
105
107
|
icon: icon,
|
|
106
108
|
startControl: startControl,
|
|
107
109
|
endControl: endControl,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
2
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
3
|
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
4
4
|
import _createClass from "@babel/runtime/helpers/createClass";
|
|
5
5
|
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
|
@@ -288,14 +288,9 @@ export var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
|
|
|
288
288
|
fullWidth: true,
|
|
289
289
|
css: [styles.states.euiSuperDatePicker__formControlLayout, isDisabled ? styles.states.disabled : isInvalid ? styles.states.invalid : hasChanged ? styles.states.needsUpdating : styles.states.default]
|
|
290
290
|
};
|
|
291
|
-
if (isQuickSelectOnly) {
|
|
292
|
-
return ___EmotionJSX(EuiFormControlLayout, _extends({
|
|
293
|
-
iconsPosition: "static"
|
|
294
|
-
}, formControlLayoutProps));
|
|
295
|
-
}
|
|
296
291
|
var isDisabledDisplay = isObject(isDisabled) && (isDisabled === null || isDisabled === void 0 ? void 0 : isDisabled.display);
|
|
297
292
|
if (isDisabledDisplay || showPrettyDuration && !isStartDatePopoverOpen && !isEndDatePopoverOpen) {
|
|
298
|
-
return ___EmotionJSX(EuiFormControlLayout, formControlLayoutProps, ___EmotionJSX("button", {
|
|
293
|
+
return ___EmotionJSX(EuiFormControlLayout, formControlLayoutProps, !isQuickSelectOnly && ___EmotionJSX("button", {
|
|
299
294
|
type: "button",
|
|
300
295
|
css: styles.euiSuperDatePicker__prettyFormat,
|
|
301
296
|
className: classNames('euiSuperDatePicker__prettyFormat', {
|
|
@@ -326,7 +321,8 @@ export var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
|
|
|
326
321
|
css: rangeCssStyles,
|
|
327
322
|
isCustom: true,
|
|
328
323
|
iconType: false,
|
|
329
|
-
|
|
324
|
+
delimiter: isQuickSelectOnly ? '' : undefined,
|
|
325
|
+
startDateControl: isQuickSelectOnly ? undefined : ___EmotionJSX(EuiDatePopoverButton, {
|
|
330
326
|
css: styles.euiSuperDatePicker__rangeInput,
|
|
331
327
|
className: "euiSuperDatePicker__startPopoverButton",
|
|
332
328
|
compressed: compressed,
|
|
@@ -351,7 +347,7 @@ export var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
|
|
|
351
347
|
onFocus: onFocus
|
|
352
348
|
}
|
|
353
349
|
}),
|
|
354
|
-
endDateControl: ___EmotionJSX(EuiDatePopoverButton, {
|
|
350
|
+
endDateControl: isQuickSelectOnly ? undefined : ___EmotionJSX(EuiDatePopoverButton, {
|
|
355
351
|
css: styles.euiSuperDatePicker__rangeInput,
|
|
356
352
|
position: "end",
|
|
357
353
|
compressed: compressed,
|
|
@@ -57,10 +57,10 @@ export var EuiFormControlLayoutDelimited = function EuiFormControlLayoutDelimite
|
|
|
57
57
|
value: {
|
|
58
58
|
defaultFullWidth: fullWidth
|
|
59
59
|
}
|
|
60
|
-
}, addClassesToControl(startControl), ___EmotionJSX(EuiFormControlDelimiter, {
|
|
60
|
+
}, startControl && addClassesToControl(startControl), ___EmotionJSX(EuiFormControlDelimiter, {
|
|
61
61
|
delimiter: delimiter,
|
|
62
62
|
isInvalid: showInvalidState
|
|
63
|
-
}), addClassesToControl(endControl)));
|
|
63
|
+
}), endControl && addClassesToControl(endControl)));
|
|
64
64
|
};
|
|
65
65
|
var addClassesToControl = function addClassesToControl(control) {
|
|
66
66
|
return cloneElementWithCss(control, {
|