@elastic/eui 77.1.0 → 77.2.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 (138) hide show
  1. package/README.md +30 -29
  2. package/dist/eui_theme_dark.css +70 -158
  3. package/dist/eui_theme_dark.min.css +1 -1
  4. package/dist/eui_theme_light.css +70 -158
  5. package/dist/eui_theme_light.min.css +1 -1
  6. package/es/components/basic_table/basic_table.a11y.js +202 -0
  7. package/es/components/basic_table/{table.a11y.js → in_memory_table.a11y.js} +1 -1
  8. package/es/components/date_picker/date_picker.js +23 -15
  9. package/es/components/date_picker/date_picker_range.js +36 -42
  10. package/es/components/date_picker/super_date_picker/super_date_picker.js +99 -84
  11. package/es/components/form/field_number/field_number.js +39 -8
  12. package/es/components/form/field_text/field_text.js +1 -1
  13. package/es/components/form/form_control_layout/form_control_layout.js +67 -30
  14. package/es/components/form/form_control_layout/form_control_layout_delimited.js +31 -11
  15. package/es/components/form/form_control_layout/form_control_layout_icons.js +12 -20
  16. package/es/components/form/range/dual_range.js +2 -4
  17. package/es/components/form/range/range.js +0 -2
  18. package/es/components/form/range/range_input.js +54 -13
  19. package/es/components/form/validatable_control/validatable_control.js +15 -5
  20. package/es/components/index.js +0 -1
  21. package/es/components/search_bar/query/ast_to_es_query_dsl.js +6 -1
  22. package/es/components/search_bar/query/ast_to_es_query_string.js +3 -0
  23. package/es/components/suggest/suggest.a11y.js +70 -0
  24. package/es/components/table/table.a11y.js +75 -0
  25. package/eui.d.ts +55 -173
  26. package/i18ntokens.json +26 -44
  27. package/lib/components/basic_table/basic_table.a11y.js +194 -0
  28. package/lib/components/basic_table/{table.a11y.js → in_memory_table.a11y.js} +2 -2
  29. package/lib/components/date_picker/date_picker.js +23 -15
  30. package/lib/components/date_picker/date_picker_range.js +35 -41
  31. package/lib/components/date_picker/super_date_picker/super_date_picker.js +99 -84
  32. package/lib/components/form/field_number/field_number.js +42 -8
  33. package/lib/components/form/field_text/field_text.js +1 -1
  34. package/lib/components/form/form_control_layout/form_control_layout.js +67 -35
  35. package/lib/components/form/form_control_layout/form_control_layout_delimited.js +31 -11
  36. package/lib/components/form/form_control_layout/form_control_layout_icons.js +11 -19
  37. package/lib/components/form/range/dual_range.js +2 -4
  38. package/lib/components/form/range/range.js +0 -2
  39. package/lib/components/form/range/range_input.js +52 -11
  40. package/lib/components/form/validatable_control/validatable_control.js +14 -12
  41. package/lib/components/index.js +0 -11
  42. package/lib/components/search_bar/query/ast_to_es_query_dsl.js +6 -1
  43. package/lib/components/search_bar/query/ast_to_es_query_string.js +3 -0
  44. package/lib/components/suggest/suggest.a11y.js +73 -0
  45. package/lib/components/table/table.a11y.js +78 -0
  46. package/optimize/es/components/basic_table/basic_table.a11y.js +194 -0
  47. package/optimize/es/components/basic_table/{table.a11y.js → in_memory_table.a11y.js} +1 -1
  48. package/optimize/es/components/date_picker/date_picker.js +17 -14
  49. package/optimize/es/components/date_picker/date_picker_range.js +20 -14
  50. package/optimize/es/components/date_picker/super_date_picker/super_date_picker.js +99 -84
  51. package/optimize/es/components/form/field_number/field_number.js +34 -8
  52. package/optimize/es/components/form/field_text/field_text.js +1 -1
  53. package/optimize/es/components/form/form_control_layout/form_control_layout.js +67 -30
  54. package/optimize/es/components/form/form_control_layout/form_control_layout_delimited.js +31 -11
  55. package/optimize/es/components/form/form_control_layout/form_control_layout_icons.js +10 -20
  56. package/optimize/es/components/form/range/dual_range.js +2 -4
  57. package/optimize/es/components/form/range/range.js +0 -2
  58. package/optimize/es/components/form/range/range_input.js +49 -12
  59. package/optimize/es/components/form/validatable_control/validatable_control.js +10 -5
  60. package/optimize/es/components/index.js +0 -1
  61. package/optimize/es/components/search_bar/query/ast_to_es_query_dsl.js +6 -1
  62. package/optimize/es/components/search_bar/query/ast_to_es_query_string.js +3 -0
  63. package/optimize/es/components/suggest/suggest.a11y.js +70 -0
  64. package/optimize/es/components/table/table.a11y.js +75 -0
  65. package/optimize/lib/components/basic_table/basic_table.a11y.js +188 -0
  66. package/{test-env/components/basic_table/table.a11y.js → optimize/lib/components/basic_table/in_memory_table.a11y.js} +2 -2
  67. package/optimize/lib/components/date_picker/date_picker.js +17 -14
  68. package/optimize/lib/components/date_picker/date_picker_range.js +19 -13
  69. package/optimize/lib/components/date_picker/super_date_picker/super_date_picker.js +99 -84
  70. package/optimize/lib/components/form/field_number/field_number.js +37 -8
  71. package/optimize/lib/components/form/field_text/field_text.js +1 -1
  72. package/optimize/lib/components/form/form_control_layout/form_control_layout.js +67 -35
  73. package/optimize/lib/components/form/form_control_layout/form_control_layout_delimited.js +31 -11
  74. package/optimize/lib/components/form/form_control_layout/form_control_layout_icons.js +9 -19
  75. package/optimize/lib/components/form/range/dual_range.js +2 -4
  76. package/optimize/lib/components/form/range/range.js +0 -2
  77. package/optimize/lib/components/form/range/range_input.js +47 -10
  78. package/optimize/lib/components/form/validatable_control/validatable_control.js +10 -4
  79. package/optimize/lib/components/index.js +0 -11
  80. package/optimize/lib/components/search_bar/query/ast_to_es_query_dsl.js +6 -1
  81. package/optimize/lib/components/search_bar/query/ast_to_es_query_string.js +3 -0
  82. package/optimize/lib/components/suggest/suggest.a11y.js +73 -0
  83. package/optimize/lib/components/table/table.a11y.js +78 -0
  84. package/package.json +1 -1
  85. package/src/components/date_picker/_date_picker_range.scss +0 -60
  86. package/src/components/date_picker/super_date_picker/_super_date_picker.scss +23 -11
  87. package/src/components/date_picker/super_date_picker/_variables.scss +3 -0
  88. package/src/components/date_picker/super_date_picker/date_popover/_date_popover_button.scss +5 -7
  89. package/src/components/form/form_control_layout/_form_control_layout.scss +2 -2
  90. package/src/components/form/form_control_layout/_form_control_layout_delimited.scss +12 -36
  91. package/src/components/form/form_control_layout/_form_control_layout_icons.scss +27 -6
  92. package/src/themes/amsterdam/overrides/_date_picker.scss +0 -14
  93. package/src/themes/amsterdam/overrides/_index.scss +0 -1
  94. package/test-env/components/basic_table/basic_table.a11y.js +188 -0
  95. package/{optimize/lib/components/basic_table/table.a11y.js → test-env/components/basic_table/in_memory_table.a11y.js} +2 -2
  96. package/test-env/components/date_picker/date_picker.js +23 -15
  97. package/test-env/components/date_picker/date_picker_range.js +35 -41
  98. package/test-env/components/date_picker/super_date_picker/super_date_picker.js +99 -84
  99. package/test-env/components/form/field_number/field_number.js +37 -8
  100. package/test-env/components/form/field_text/field_text.js +1 -1
  101. package/test-env/components/form/form_control_layout/form_control_layout.js +68 -35
  102. package/test-env/components/form/form_control_layout/form_control_layout_delimited.js +31 -11
  103. package/test-env/components/form/form_control_layout/form_control_layout_icons.js +11 -19
  104. package/test-env/components/form/range/dual_range.js +2 -4
  105. package/test-env/components/form/range/range.js +0 -2
  106. package/test-env/components/form/range/range_input.js +47 -11
  107. package/test-env/components/form/validatable_control/validatable_control.js +9 -4
  108. package/test-env/components/index.js +0 -11
  109. package/test-env/components/search_bar/query/ast_to_es_query_dsl.js +6 -1
  110. package/test-env/components/search_bar/query/ast_to_es_query_string.js +3 -0
  111. package/test-env/components/suggest/suggest.a11y.js +73 -0
  112. package/test-env/components/table/table.a11y.js +78 -0
  113. package/es/components/inline_edit/index.js +0 -10
  114. package/es/components/inline_edit/inline_edit.styles.js +0 -15
  115. package/es/components/inline_edit/inline_edit_form.js +0 -190
  116. package/es/components/inline_edit/inline_edit_text.js +0 -97
  117. package/es/components/inline_edit/inline_edit_title.js +0 -105
  118. package/lib/components/inline_edit/index.js +0 -19
  119. package/lib/components/inline_edit/inline_edit.styles.js +0 -22
  120. package/lib/components/inline_edit/inline_edit_form.js +0 -193
  121. package/lib/components/inline_edit/inline_edit_text.js +0 -97
  122. package/lib/components/inline_edit/inline_edit_title.js +0 -106
  123. package/optimize/es/components/inline_edit/index.js +0 -10
  124. package/optimize/es/components/inline_edit/inline_edit.styles.js +0 -15
  125. package/optimize/es/components/inline_edit/inline_edit_form.js +0 -133
  126. package/optimize/es/components/inline_edit/inline_edit_text.js +0 -52
  127. package/optimize/es/components/inline_edit/inline_edit_title.js +0 -56
  128. package/optimize/lib/components/inline_edit/index.js +0 -19
  129. package/optimize/lib/components/inline_edit/inline_edit.styles.js +0 -22
  130. package/optimize/lib/components/inline_edit/inline_edit_form.js +0 -144
  131. package/optimize/lib/components/inline_edit/inline_edit_text.js +0 -52
  132. package/optimize/lib/components/inline_edit/inline_edit_title.js +0 -57
  133. package/src/themes/amsterdam/overrides/_date_popover_button.scss +0 -14
  134. package/test-env/components/inline_edit/index.js +0 -19
  135. package/test-env/components/inline_edit/inline_edit.styles.js +0 -22
  136. package/test-env/components/inline_edit/inline_edit_form.js +0 -196
  137. package/test-env/components/inline_edit/inline_edit_text.js +0 -96
  138. package/test-env/components/inline_edit/inline_edit_title.js +0 -105
@@ -1,15 +0,0 @@
1
- /*
2
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
3
- * or more contributor license agreements. Licensed under the Elastic License
4
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
5
- * in compliance with, at your election, the Elastic License 2.0 or the Server
6
- * Side Public License, v 1.
7
- */
8
-
9
- import { css } from '@emotion/react';
10
- export var euiInlineEditStyles = function euiInlineEditStyles(_ref) {
11
- var euiTheme = _ref.euiTheme;
12
- return {
13
- euiInlineEdit: /*#__PURE__*/css("color:", euiTheme.colors.primaryText, ";;label:euiInlineEdit;")
14
- };
15
- };
@@ -1,133 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/extends";
2
- import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
3
- /*
4
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
5
- * or more contributor license agreements. Licensed under the Elastic License
6
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
7
- * in compliance with, at your election, the Elastic License 2.0 or the Server
8
- * Side Public License, v 1.
9
- */
10
-
11
- import React, { useState } from 'react';
12
- import classNames from 'classnames';
13
- import { EuiFormRow, EuiFieldText, EuiForm } from '../form';
14
- import { EuiButtonIcon, EuiButtonEmpty } from '../button';
15
- import { EuiFlexGroup, EuiFlexItem } from '../flex';
16
- import { useEuiI18n } from '../i18n';
17
- import { useGeneratedHtmlId } from '../../services/accessibility';
18
-
19
- // Props shared between the internal form component as well as consumer-facing components
20
- import { jsx as ___EmotionJSX } from "@emotion/react";
21
- export var SMALL_SIZE_FORM = {
22
- iconSize: 's',
23
- compressed: true,
24
- buttonSize: 's'
25
- };
26
- export var MEDIUM_SIZE_FORM = {
27
- iconSize: 'm',
28
- compressed: false,
29
- buttonSize: 'm'
30
- };
31
- export var EuiInlineEditForm = function EuiInlineEditForm(_ref) {
32
- var className = _ref.className,
33
- children = _ref.children,
34
- sizes = _ref.sizes,
35
- defaultValue = _ref.defaultValue,
36
- onConfirm = _ref.onConfirm,
37
- inputAriaLabel = _ref.inputAriaLabel,
38
- saveButtonAriaLabel = _ref.saveButtonAriaLabel,
39
- cancelButtonAriaLabel = _ref.cancelButtonAriaLabel,
40
- startWithEditOpen = _ref.startWithEditOpen,
41
- readModeProps = _ref.readModeProps,
42
- editModeProps = _ref.editModeProps;
43
- var classes = classNames('euiInlineEdit', className);
44
-
45
- // Styles to come later! (Styling editMode text to match the size of its readMode counterpart)
46
- /*const theme = useEuiTheme();
47
- const styles = euiInlineEditStyles(theme);
48
- const cssStyles = [styles.euiInlineEdit];*/
49
-
50
- var defaultSaveButtonAriaLabel = useEuiI18n('euiInlineEditForm.saveButtonAriaLabel', 'Save edit');
51
- var defaultCancelButtonAriaLabel = useEuiI18n('euiInlineEditForm.cancelButtonAriaLabel', 'Cancel edit');
52
- var _useState = useState(false || startWithEditOpen),
53
- _useState2 = _slicedToArray(_useState, 2),
54
- isEditing = _useState2[0],
55
- setIsEditing = _useState2[1];
56
- var inlineEditInputId = useGeneratedHtmlId({
57
- prefix: '__inlineEditInput'
58
- });
59
- var _useState3 = useState(defaultValue),
60
- _useState4 = _slicedToArray(_useState3, 2),
61
- editModeValue = _useState4[0],
62
- setEditModeValue = _useState4[1];
63
- var _useState5 = useState(defaultValue),
64
- _useState6 = _slicedToArray(_useState5, 2),
65
- readModeValue = _useState6[0],
66
- setReadModeValue = _useState6[1];
67
- var cancelInlineEdit = function cancelInlineEdit() {
68
- setEditModeValue(readModeValue);
69
- setIsEditing(!isEditing);
70
- };
71
- var saveInlineEditValue = function saveInlineEditValue() {
72
- if (editModeValue && onConfirm && !onConfirm()) {
73
- // If there is text, an onConfirm method is present, and it has returned false, cancel the action
74
- return;
75
- } else if (editModeValue) {
76
- setReadModeValue(editModeValue);
77
- setIsEditing(!isEditing);
78
- } else {
79
- // If there's no text, cancel the action, reset the input text, and return to readMode
80
- cancelInlineEdit();
81
- }
82
- };
83
- var editModeForm = ___EmotionJSX(EuiForm, {
84
- fullWidth: true
85
- }, ___EmotionJSX(EuiFlexGroup, {
86
- gutterSize: "s"
87
- }, ___EmotionJSX(EuiFlexItem, null, ___EmotionJSX(EuiFieldText, _extends({
88
- id: inlineEditInputId,
89
- value: editModeValue,
90
- onChange: function onChange(e) {
91
- setEditModeValue(e.target.value);
92
- },
93
- "aria-label": inputAriaLabel,
94
- autoFocus: true,
95
- compressed: sizes.compressed
96
- }, editModeProps))), ___EmotionJSX(EuiFlexItem, {
97
- grow: false,
98
- className: classes
99
- }, ___EmotionJSX(EuiFormRow, null, ___EmotionJSX(EuiButtonIcon, {
100
- iconType: "check",
101
- "aria-label": saveButtonAriaLabel || defaultSaveButtonAriaLabel,
102
- onClick: saveInlineEditValue,
103
- color: "success",
104
- display: "base",
105
- size: sizes.buttonSize,
106
- iconSize: sizes.iconSize
107
- }))), ___EmotionJSX(EuiFlexItem, {
108
- grow: false
109
- }, ___EmotionJSX(EuiFormRow, null, ___EmotionJSX(EuiButtonIcon, {
110
- iconType: "cross",
111
- "aria-label": cancelButtonAriaLabel || defaultCancelButtonAriaLabel,
112
- onClick: cancelInlineEdit,
113
- color: "danger",
114
- display: "base",
115
- size: sizes.buttonSize,
116
- iconSize: sizes.iconSize
117
- })))));
118
- var readModeElement = ___EmotionJSX(EuiButtonEmpty, _extends({
119
- color: "text",
120
- iconType: "pencil",
121
- iconSide: "right",
122
- autoFocus: true,
123
- flush: "both",
124
- iconSize: sizes.iconSize,
125
- size: sizes.buttonSize,
126
- onClick: function onClick() {
127
- setIsEditing(!isEditing);
128
- }
129
- }, readModeProps), children(readModeValue));
130
- return ___EmotionJSX("div", {
131
- className: classes
132
- }, isEditing ? editModeForm : readModeElement);
133
- };
@@ -1,52 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/extends";
2
- import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["children", "className", "size", "defaultValue", "onConfirm", "inputAriaLabel", "saveButtonAriaLabel", "cancelButtonAriaLabel", "startWithEditOpen", "readModeProps", "editModeProps"];
4
- /*
5
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
6
- * or more contributor license agreements. Licensed under the Elastic License
7
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
8
- * in compliance with, at your election, the Elastic License 2.0 or the Server
9
- * Side Public License, v 1.
10
- */
11
-
12
- import React from 'react';
13
- import classNames from 'classnames';
14
- import { EuiText } from '../text';
15
- import { EuiInlineEditForm, SMALL_SIZE_FORM, MEDIUM_SIZE_FORM } from './inline_edit_form';
16
- import { jsx as ___EmotionJSX } from "@emotion/react";
17
- export var EuiInlineEditText = function EuiInlineEditText(_ref) {
18
- var children = _ref.children,
19
- className = _ref.className,
20
- _ref$size = _ref.size,
21
- size = _ref$size === void 0 ? 'm' : _ref$size,
22
- defaultValue = _ref.defaultValue,
23
- onConfirm = _ref.onConfirm,
24
- inputAriaLabel = _ref.inputAriaLabel,
25
- saveButtonAriaLabel = _ref.saveButtonAriaLabel,
26
- cancelButtonAriaLabel = _ref.cancelButtonAriaLabel,
27
- startWithEditOpen = _ref.startWithEditOpen,
28
- readModeProps = _ref.readModeProps,
29
- editModeProps = _ref.editModeProps,
30
- rest = _objectWithoutProperties(_ref, _excluded);
31
- var classes = classNames('euiInlineEditText', className);
32
- var isSmallSize = ['xs', 's'].includes(size);
33
- var sizes = isSmallSize ? SMALL_SIZE_FORM : MEDIUM_SIZE_FORM;
34
- var formProps = {
35
- sizes: sizes,
36
- defaultValue: defaultValue,
37
- onConfirm: onConfirm,
38
- inputAriaLabel: inputAriaLabel,
39
- saveButtonAriaLabel: saveButtonAriaLabel,
40
- cancelButtonAriaLabel: cancelButtonAriaLabel,
41
- startWithEditOpen: startWithEditOpen,
42
- readModeProps: readModeProps,
43
- editModeProps: editModeProps
44
- };
45
- return ___EmotionJSX(EuiInlineEditForm, _extends({
46
- className: classes
47
- }, rest, formProps), function (textReadModeValue) {
48
- return ___EmotionJSX(EuiText, {
49
- size: size
50
- }, textReadModeValue);
51
- });
52
- };
@@ -1,56 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/extends";
2
- import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["children", "className", "size", "heading", "defaultValue", "onConfirm", "inputAriaLabel", "saveButtonAriaLabel", "cancelButtonAriaLabel", "startWithEditOpen", "readModeProps", "editModeProps"];
4
- /*
5
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
6
- * or more contributor license agreements. Licensed under the Elastic License
7
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
8
- * in compliance with, at your election, the Elastic License 2.0 or the Server
9
- * Side Public License, v 1.
10
- */
11
-
12
- import React from 'react';
13
- import classNames from 'classnames';
14
- import { EuiTitle } from '../title';
15
- import { EuiInlineEditForm, SMALL_SIZE_FORM, MEDIUM_SIZE_FORM } from './inline_edit_form';
16
- import { jsx as ___EmotionJSX } from "@emotion/react";
17
- export var HEADINGS = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
18
- export var EuiInlineEditTitle = function EuiInlineEditTitle(_ref) {
19
- var children = _ref.children,
20
- className = _ref.className,
21
- _ref$size = _ref.size,
22
- size = _ref$size === void 0 ? 'm' : _ref$size,
23
- heading = _ref.heading,
24
- defaultValue = _ref.defaultValue,
25
- onConfirm = _ref.onConfirm,
26
- inputAriaLabel = _ref.inputAriaLabel,
27
- saveButtonAriaLabel = _ref.saveButtonAriaLabel,
28
- cancelButtonAriaLabel = _ref.cancelButtonAriaLabel,
29
- _ref$startWithEditOpe = _ref.startWithEditOpen,
30
- startWithEditOpen = _ref$startWithEditOpe === void 0 ? false : _ref$startWithEditOpe,
31
- readModeProps = _ref.readModeProps,
32
- editModeProps = _ref.editModeProps,
33
- rest = _objectWithoutProperties(_ref, _excluded);
34
- var classes = classNames('euiInlineEditTitle', className);
35
- var H = heading;
36
- var isSmallSize = ['xxxs', 'xxs', 'xs', 's'].includes(size);
37
- var sizes = isSmallSize ? SMALL_SIZE_FORM : MEDIUM_SIZE_FORM;
38
- var formProps = {
39
- sizes: sizes,
40
- defaultValue: defaultValue,
41
- onConfirm: onConfirm,
42
- inputAriaLabel: inputAriaLabel,
43
- saveButtonAriaLabel: saveButtonAriaLabel,
44
- cancelButtonAriaLabel: cancelButtonAriaLabel,
45
- startWithEditOpen: startWithEditOpen,
46
- readModeProps: readModeProps,
47
- editModeProps: editModeProps
48
- };
49
- return ___EmotionJSX(EuiInlineEditForm, _extends({
50
- className: classes
51
- }, rest, formProps), function (titleReadModeValue) {
52
- return ___EmotionJSX(EuiTitle, {
53
- size: size
54
- }, ___EmotionJSX(H, null, titleReadModeValue));
55
- });
56
- };
@@ -1,19 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "EuiInlineEditText", {
7
- enumerable: true,
8
- get: function get() {
9
- return _inline_edit_text.EuiInlineEditText;
10
- }
11
- });
12
- Object.defineProperty(exports, "EuiInlineEditTitle", {
13
- enumerable: true,
14
- get: function get() {
15
- return _inline_edit_title.EuiInlineEditTitle;
16
- }
17
- });
18
- var _inline_edit_text = require("./inline_edit_text");
19
- var _inline_edit_title = require("./inline_edit_title");
@@ -1,22 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.euiInlineEditStyles = void 0;
7
- var _react = require("@emotion/react");
8
- /*
9
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
10
- * or more contributor license agreements. Licensed under the Elastic License
11
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
12
- * in compliance with, at your election, the Elastic License 2.0 or the Server
13
- * Side Public License, v 1.
14
- */
15
-
16
- var euiInlineEditStyles = function euiInlineEditStyles(_ref) {
17
- var euiTheme = _ref.euiTheme;
18
- return {
19
- euiInlineEdit: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.primaryText, ";;label:euiInlineEdit;")
20
- };
21
- };
22
- exports.euiInlineEditStyles = euiInlineEditStyles;
@@ -1,144 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- var _typeof = require("@babel/runtime/helpers/typeof");
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.SMALL_SIZE_FORM = exports.MEDIUM_SIZE_FORM = exports.EuiInlineEditForm = void 0;
9
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
10
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
11
- var _react = _interopRequireWildcard(require("react"));
12
- var _classnames = _interopRequireDefault(require("classnames"));
13
- var _form = require("../form");
14
- var _button = require("../button");
15
- var _flex = require("../flex");
16
- var _i18n = require("../i18n");
17
- var _accessibility = require("../../services/accessibility");
18
- var _react2 = require("@emotion/react");
19
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
20
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
21
- /*
22
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
23
- * or more contributor license agreements. Licensed under the Elastic License
24
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
25
- * in compliance with, at your election, the Elastic License 2.0 or the Server
26
- * Side Public License, v 1.
27
- */
28
-
29
- var SMALL_SIZE_FORM = {
30
- iconSize: 's',
31
- compressed: true,
32
- buttonSize: 's'
33
- };
34
- exports.SMALL_SIZE_FORM = SMALL_SIZE_FORM;
35
- var MEDIUM_SIZE_FORM = {
36
- iconSize: 'm',
37
- compressed: false,
38
- buttonSize: 'm'
39
- };
40
- exports.MEDIUM_SIZE_FORM = MEDIUM_SIZE_FORM;
41
- var EuiInlineEditForm = function EuiInlineEditForm(_ref) {
42
- var className = _ref.className,
43
- children = _ref.children,
44
- sizes = _ref.sizes,
45
- defaultValue = _ref.defaultValue,
46
- onConfirm = _ref.onConfirm,
47
- inputAriaLabel = _ref.inputAriaLabel,
48
- saveButtonAriaLabel = _ref.saveButtonAriaLabel,
49
- cancelButtonAriaLabel = _ref.cancelButtonAriaLabel,
50
- startWithEditOpen = _ref.startWithEditOpen,
51
- readModeProps = _ref.readModeProps,
52
- editModeProps = _ref.editModeProps;
53
- var classes = (0, _classnames.default)('euiInlineEdit', className);
54
-
55
- // Styles to come later! (Styling editMode text to match the size of its readMode counterpart)
56
- /*const theme = useEuiTheme();
57
- const styles = euiInlineEditStyles(theme);
58
- const cssStyles = [styles.euiInlineEdit];*/
59
-
60
- var defaultSaveButtonAriaLabel = (0, _i18n.useEuiI18n)('euiInlineEditForm.saveButtonAriaLabel', 'Save edit');
61
- var defaultCancelButtonAriaLabel = (0, _i18n.useEuiI18n)('euiInlineEditForm.cancelButtonAriaLabel', 'Cancel edit');
62
- var _useState = (0, _react.useState)(false || startWithEditOpen),
63
- _useState2 = (0, _slicedToArray2.default)(_useState, 2),
64
- isEditing = _useState2[0],
65
- setIsEditing = _useState2[1];
66
- var inlineEditInputId = (0, _accessibility.useGeneratedHtmlId)({
67
- prefix: '__inlineEditInput'
68
- });
69
- var _useState3 = (0, _react.useState)(defaultValue),
70
- _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
71
- editModeValue = _useState4[0],
72
- setEditModeValue = _useState4[1];
73
- var _useState5 = (0, _react.useState)(defaultValue),
74
- _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
75
- readModeValue = _useState6[0],
76
- setReadModeValue = _useState6[1];
77
- var cancelInlineEdit = function cancelInlineEdit() {
78
- setEditModeValue(readModeValue);
79
- setIsEditing(!isEditing);
80
- };
81
- var saveInlineEditValue = function saveInlineEditValue() {
82
- if (editModeValue && onConfirm && !onConfirm()) {
83
- // If there is text, an onConfirm method is present, and it has returned false, cancel the action
84
- return;
85
- } else if (editModeValue) {
86
- setReadModeValue(editModeValue);
87
- setIsEditing(!isEditing);
88
- } else {
89
- // If there's no text, cancel the action, reset the input text, and return to readMode
90
- cancelInlineEdit();
91
- }
92
- };
93
- var editModeForm = (0, _react2.jsx)(_form.EuiForm, {
94
- fullWidth: true
95
- }, (0, _react2.jsx)(_flex.EuiFlexGroup, {
96
- gutterSize: "s"
97
- }, (0, _react2.jsx)(_flex.EuiFlexItem, null, (0, _react2.jsx)(_form.EuiFieldText, (0, _extends2.default)({
98
- id: inlineEditInputId,
99
- value: editModeValue,
100
- onChange: function onChange(e) {
101
- setEditModeValue(e.target.value);
102
- },
103
- "aria-label": inputAriaLabel,
104
- autoFocus: true,
105
- compressed: sizes.compressed
106
- }, editModeProps))), (0, _react2.jsx)(_flex.EuiFlexItem, {
107
- grow: false,
108
- className: classes
109
- }, (0, _react2.jsx)(_form.EuiFormRow, null, (0, _react2.jsx)(_button.EuiButtonIcon, {
110
- iconType: "check",
111
- "aria-label": saveButtonAriaLabel || defaultSaveButtonAriaLabel,
112
- onClick: saveInlineEditValue,
113
- color: "success",
114
- display: "base",
115
- size: sizes.buttonSize,
116
- iconSize: sizes.iconSize
117
- }))), (0, _react2.jsx)(_flex.EuiFlexItem, {
118
- grow: false
119
- }, (0, _react2.jsx)(_form.EuiFormRow, null, (0, _react2.jsx)(_button.EuiButtonIcon, {
120
- iconType: "cross",
121
- "aria-label": cancelButtonAriaLabel || defaultCancelButtonAriaLabel,
122
- onClick: cancelInlineEdit,
123
- color: "danger",
124
- display: "base",
125
- size: sizes.buttonSize,
126
- iconSize: sizes.iconSize
127
- })))));
128
- var readModeElement = (0, _react2.jsx)(_button.EuiButtonEmpty, (0, _extends2.default)({
129
- color: "text",
130
- iconType: "pencil",
131
- iconSide: "right",
132
- autoFocus: true,
133
- flush: "both",
134
- iconSize: sizes.iconSize,
135
- size: sizes.buttonSize,
136
- onClick: function onClick() {
137
- setIsEditing(!isEditing);
138
- }
139
- }, readModeProps), children(readModeValue));
140
- return (0, _react2.jsx)("div", {
141
- className: classes
142
- }, isEditing ? editModeForm : readModeElement);
143
- };
144
- exports.EuiInlineEditForm = EuiInlineEditForm;
@@ -1,52 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.EuiInlineEditText = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
- var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
- var _react = _interopRequireDefault(require("react"));
11
- var _classnames = _interopRequireDefault(require("classnames"));
12
- var _text = require("../text");
13
- var _inline_edit_form = require("./inline_edit_form");
14
- var _react2 = require("@emotion/react");
15
- var _excluded = ["children", "className", "size", "defaultValue", "onConfirm", "inputAriaLabel", "saveButtonAriaLabel", "cancelButtonAriaLabel", "startWithEditOpen", "readModeProps", "editModeProps"];
16
- var EuiInlineEditText = function EuiInlineEditText(_ref) {
17
- var children = _ref.children,
18
- className = _ref.className,
19
- _ref$size = _ref.size,
20
- size = _ref$size === void 0 ? 'm' : _ref$size,
21
- defaultValue = _ref.defaultValue,
22
- onConfirm = _ref.onConfirm,
23
- inputAriaLabel = _ref.inputAriaLabel,
24
- saveButtonAriaLabel = _ref.saveButtonAriaLabel,
25
- cancelButtonAriaLabel = _ref.cancelButtonAriaLabel,
26
- startWithEditOpen = _ref.startWithEditOpen,
27
- readModeProps = _ref.readModeProps,
28
- editModeProps = _ref.editModeProps,
29
- rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
30
- var classes = (0, _classnames.default)('euiInlineEditText', className);
31
- var isSmallSize = ['xs', 's'].includes(size);
32
- var sizes = isSmallSize ? _inline_edit_form.SMALL_SIZE_FORM : _inline_edit_form.MEDIUM_SIZE_FORM;
33
- var formProps = {
34
- sizes: sizes,
35
- defaultValue: defaultValue,
36
- onConfirm: onConfirm,
37
- inputAriaLabel: inputAriaLabel,
38
- saveButtonAriaLabel: saveButtonAriaLabel,
39
- cancelButtonAriaLabel: cancelButtonAriaLabel,
40
- startWithEditOpen: startWithEditOpen,
41
- readModeProps: readModeProps,
42
- editModeProps: editModeProps
43
- };
44
- return (0, _react2.jsx)(_inline_edit_form.EuiInlineEditForm, (0, _extends2.default)({
45
- className: classes
46
- }, rest, formProps), function (textReadModeValue) {
47
- return (0, _react2.jsx)(_text.EuiText, {
48
- size: size
49
- }, textReadModeValue);
50
- });
51
- };
52
- exports.EuiInlineEditText = EuiInlineEditText;
@@ -1,57 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.HEADINGS = exports.EuiInlineEditTitle = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
- var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
- var _react = _interopRequireDefault(require("react"));
11
- var _classnames = _interopRequireDefault(require("classnames"));
12
- var _title = require("../title");
13
- var _inline_edit_form = require("./inline_edit_form");
14
- var _react2 = require("@emotion/react");
15
- var _excluded = ["children", "className", "size", "heading", "defaultValue", "onConfirm", "inputAriaLabel", "saveButtonAriaLabel", "cancelButtonAriaLabel", "startWithEditOpen", "readModeProps", "editModeProps"];
16
- var HEADINGS = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
17
- exports.HEADINGS = HEADINGS;
18
- var EuiInlineEditTitle = function EuiInlineEditTitle(_ref) {
19
- var children = _ref.children,
20
- className = _ref.className,
21
- _ref$size = _ref.size,
22
- size = _ref$size === void 0 ? 'm' : _ref$size,
23
- heading = _ref.heading,
24
- defaultValue = _ref.defaultValue,
25
- onConfirm = _ref.onConfirm,
26
- inputAriaLabel = _ref.inputAriaLabel,
27
- saveButtonAriaLabel = _ref.saveButtonAriaLabel,
28
- cancelButtonAriaLabel = _ref.cancelButtonAriaLabel,
29
- _ref$startWithEditOpe = _ref.startWithEditOpen,
30
- startWithEditOpen = _ref$startWithEditOpe === void 0 ? false : _ref$startWithEditOpe,
31
- readModeProps = _ref.readModeProps,
32
- editModeProps = _ref.editModeProps,
33
- rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
34
- var classes = (0, _classnames.default)('euiInlineEditTitle', className);
35
- var H = heading;
36
- var isSmallSize = ['xxxs', 'xxs', 'xs', 's'].includes(size);
37
- var sizes = isSmallSize ? _inline_edit_form.SMALL_SIZE_FORM : _inline_edit_form.MEDIUM_SIZE_FORM;
38
- var formProps = {
39
- sizes: sizes,
40
- defaultValue: defaultValue,
41
- onConfirm: onConfirm,
42
- inputAriaLabel: inputAriaLabel,
43
- saveButtonAriaLabel: saveButtonAriaLabel,
44
- cancelButtonAriaLabel: cancelButtonAriaLabel,
45
- startWithEditOpen: startWithEditOpen,
46
- readModeProps: readModeProps,
47
- editModeProps: editModeProps
48
- };
49
- return (0, _react2.jsx)(_inline_edit_form.EuiInlineEditForm, (0, _extends2.default)({
50
- className: classes
51
- }, rest, formProps), function (titleReadModeValue) {
52
- return (0, _react2.jsx)(_title.EuiTitle, {
53
- size: size
54
- }, (0, _react2.jsx)(H, null, titleReadModeValue));
55
- });
56
- };
57
- exports.EuiInlineEditTitle = EuiInlineEditTitle;
@@ -1,14 +0,0 @@
1
- .euiDatePopoverButton--start {
2
- text-align: center;
3
- }
4
-
5
- .euiDatePopoverButton--end {
6
- text-align: center;
7
- border-top-right-radius: $euiFormControlBorderRadius;
8
- border-bottom-right-radius: $euiFormControlBorderRadius;
9
-
10
- &.euiDatePopoverButton--compressed {
11
- border-top-right-radius: $euiFormControlCompressedBorderRadius;
12
- border-bottom-right-radius: $euiFormControlCompressedBorderRadius;
13
- }
14
- }
@@ -1,19 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "EuiInlineEditText", {
7
- enumerable: true,
8
- get: function get() {
9
- return _inline_edit_text.EuiInlineEditText;
10
- }
11
- });
12
- Object.defineProperty(exports, "EuiInlineEditTitle", {
13
- enumerable: true,
14
- get: function get() {
15
- return _inline_edit_title.EuiInlineEditTitle;
16
- }
17
- });
18
- var _inline_edit_text = require("./inline_edit_text");
19
- var _inline_edit_title = require("./inline_edit_title");
@@ -1,22 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.euiInlineEditStyles = void 0;
7
- var _react = require("@emotion/react");
8
- /*
9
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
10
- * or more contributor license agreements. Licensed under the Elastic License
11
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
12
- * in compliance with, at your election, the Elastic License 2.0 or the Server
13
- * Side Public License, v 1.
14
- */
15
-
16
- var euiInlineEditStyles = function euiInlineEditStyles(_ref) {
17
- var euiTheme = _ref.euiTheme;
18
- return {
19
- euiInlineEdit: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.primaryText, ";;label:euiInlineEdit;")
20
- };
21
- };
22
- exports.euiInlineEditStyles = euiInlineEditStyles;