@elastic/eui 95.1.0 → 95.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.
- package/dist/eui_theme_dark.css +0 -240
- package/dist/eui_theme_dark.min.css +1 -1
- package/dist/eui_theme_light.css +0 -240
- package/dist/eui_theme_light.min.css +1 -1
- package/es/components/combo_box/combo_box_input/combo_box_input.js +2 -1
- package/es/components/context_menu/context_menu_item.js +1 -1
- package/es/components/form/file_picker/file_picker.js +49 -35
- package/es/components/form/file_picker/file_picker.styles.js +98 -0
- package/es/components/icon/assets/app_cases.js +9 -7
- package/es/components/icon/assets/logo_elastic_stack.js +6 -12
- package/es/components/steps/step.js +5 -3
- package/es/components/steps/step.styles.js +13 -5
- package/es/components/steps/step_horizontal.js +8 -3
- package/es/components/steps/step_horizontal.styles.js +1 -0
- package/es/components/steps/step_number.js +48 -24
- package/es/components/steps/step_number.styles.js +4 -2
- package/es/components/steps/steps.js +3 -1
- package/es/components/steps/steps_horizontal.js +1 -1
- package/es/services/theme/warning.js +7 -2
- package/eui.d.ts +72 -20
- package/i18ntokens.json +16 -16
- package/lib/components/combo_box/combo_box_input/combo_box_input.js +2 -1
- package/lib/components/context_menu/context_menu_item.js +1 -1
- package/lib/components/form/file_picker/file_picker.js +51 -37
- package/lib/components/form/file_picker/file_picker.styles.js +102 -0
- package/lib/components/icon/assets/app_cases.js +9 -7
- package/lib/components/icon/assets/logo_elastic_stack.js +6 -12
- package/lib/components/icon/svgs/app_cases.svg +6 -5
- package/lib/components/icon/svgs/logo_elastic_stack.svg +4 -7
- package/lib/components/steps/step.js +5 -3
- package/lib/components/steps/step.styles.js +13 -5
- package/lib/components/steps/step_horizontal.js +8 -3
- package/lib/components/steps/step_horizontal.styles.js +1 -0
- package/lib/components/steps/step_number.js +48 -24
- package/lib/components/steps/step_number.styles.js +3 -1
- package/lib/components/steps/steps.js +3 -1
- package/lib/components/steps/steps_horizontal.js +1 -1
- package/lib/services/theme/warning.js +7 -2
- package/optimize/es/components/combo_box/combo_box_input/combo_box_input.js +2 -1
- package/optimize/es/components/form/file_picker/file_picker.js +40 -34
- package/optimize/es/components/form/file_picker/file_picker.styles.js +98 -0
- package/optimize/es/components/icon/assets/app_cases.js +9 -7
- package/optimize/es/components/icon/assets/logo_elastic_stack.js +6 -12
- package/optimize/es/components/steps/step.js +2 -2
- package/optimize/es/components/steps/step.styles.js +13 -5
- package/optimize/es/components/steps/step_horizontal.js +8 -3
- package/optimize/es/components/steps/step_horizontal.styles.js +1 -0
- package/optimize/es/components/steps/step_number.js +44 -22
- package/optimize/es/components/steps/step_number.styles.js +4 -2
- package/optimize/es/components/steps/steps_horizontal.js +1 -1
- package/optimize/es/services/theme/warning.js +7 -2
- package/optimize/lib/components/combo_box/combo_box_input/combo_box_input.js +2 -1
- package/optimize/lib/components/form/file_picker/file_picker.js +42 -36
- package/optimize/lib/components/form/file_picker/file_picker.styles.js +102 -0
- package/optimize/lib/components/icon/assets/app_cases.js +9 -7
- package/optimize/lib/components/icon/assets/logo_elastic_stack.js +6 -12
- package/optimize/lib/components/icon/svgs/app_cases.svg +6 -5
- package/optimize/lib/components/icon/svgs/logo_elastic_stack.svg +4 -7
- package/optimize/lib/components/steps/step.js +2 -2
- package/optimize/lib/components/steps/step.styles.js +13 -5
- package/optimize/lib/components/steps/step_horizontal.js +8 -3
- package/optimize/lib/components/steps/step_horizontal.styles.js +1 -0
- package/optimize/lib/components/steps/step_number.js +44 -22
- package/optimize/lib/components/steps/step_number.styles.js +3 -1
- package/optimize/lib/components/steps/steps_horizontal.js +1 -1
- package/optimize/lib/services/theme/warning.js +7 -2
- package/package.json +1 -1
- package/src/components/form/_index.scss +0 -1
- package/test-env/components/combo_box/combo_box_input/combo_box_input.js +2 -1
- package/test-env/components/context_menu/context_menu_item.js +1 -1
- package/test-env/components/form/file_picker/file_picker.js +46 -37
- package/test-env/components/form/file_picker/file_picker.styles.js +102 -0
- package/test-env/components/icon/assets/app_cases.js +9 -7
- package/test-env/components/icon/assets/logo_elastic_stack.js +6 -12
- package/test-env/components/steps/step.js +5 -3
- package/test-env/components/steps/step.styles.js +13 -5
- package/test-env/components/steps/step_horizontal.js +8 -3
- package/test-env/components/steps/step_horizontal.styles.js +1 -0
- package/test-env/components/steps/step_number.js +48 -24
- package/test-env/components/steps/step_number.styles.js +3 -1
- package/test-env/components/steps/steps.js +3 -1
- package/test-env/components/steps/steps_horizontal.js +1 -1
- package/test-env/services/theme/warning.js +7 -2
- package/src/components/form/file_picker/_file_picker.scss +0 -212
- package/src/components/form/file_picker/_index.scss +0 -2
- package/src/components/form/file_picker/_variables.scss +0 -1
|
@@ -13,8 +13,8 @@ exports.setEuiDevProviderWarning = exports.getEuiDevProviderWarning = exports.em
|
|
|
13
13
|
*/
|
|
14
14
|
|
|
15
15
|
var providerWarning = undefined;
|
|
16
|
-
var setEuiDevProviderWarning = exports.setEuiDevProviderWarning = function setEuiDevProviderWarning(
|
|
17
|
-
return providerWarning =
|
|
16
|
+
var setEuiDevProviderWarning = exports.setEuiDevProviderWarning = function setEuiDevProviderWarning(warningType) {
|
|
17
|
+
return providerWarning = warningType;
|
|
18
18
|
};
|
|
19
19
|
var getEuiDevProviderWarning = exports.getEuiDevProviderWarning = function getEuiDevProviderWarning() {
|
|
20
20
|
return providerWarning;
|
|
@@ -22,6 +22,11 @@ var getEuiDevProviderWarning = exports.getEuiDevProviderWarning = function getEu
|
|
|
22
22
|
|
|
23
23
|
// Not a public top-level EUI export, currently for internal use
|
|
24
24
|
var emitEuiProviderWarning = exports.emitEuiProviderWarning = function emitEuiProviderWarning(providerMessage) {
|
|
25
|
+
// Handle callback types
|
|
26
|
+
if (typeof providerWarning === 'function') {
|
|
27
|
+
return providerWarning(providerMessage);
|
|
28
|
+
}
|
|
29
|
+
// Handle level types
|
|
25
30
|
switch (providerWarning) {
|
|
26
31
|
case 'log':
|
|
27
32
|
console.log(providerMessage);
|
package/package.json
CHANGED
|
@@ -294,7 +294,8 @@ var EuiComboBoxInput = exports.EuiComboBoxInput = /*#__PURE__*/function (_Compon
|
|
|
294
294
|
},
|
|
295
295
|
placeholder: showPlaceholder ? placeholder : undefined,
|
|
296
296
|
value: this.searchValue,
|
|
297
|
-
autoFocus: autoFocus
|
|
297
|
+
autoFocus: autoFocus,
|
|
298
|
+
autoComplete: "off"
|
|
298
299
|
// Force the menu to re-open on every input click - only necessary when plain text
|
|
299
300
|
,
|
|
300
301
|
onClick: this.asPlainText ? onFocus : undefined // Type shenanigans - event should be mostly the same
|
|
@@ -125,7 +125,7 @@ EuiContextMenuItem.propTypes = {
|
|
|
125
125
|
"aria-label": _propTypes.default.string,
|
|
126
126
|
"data-test-subj": _propTypes.default.string,
|
|
127
127
|
css: _propTypes.default.any,
|
|
128
|
-
icon: _propTypes.default.oneOfType([_propTypes.default.
|
|
128
|
+
icon: _propTypes.default.oneOfType([_propTypes.default.oneOfType([_propTypes.default.oneOf(["accessibility", "addDataApp", "advancedSettingsApp", "agentApp", "aggregate", "analyzeEvent", "annotation", "apmApp", "apmTrace", "appSearchApp", "apps", "arrowDown", "arrowLeft", "arrowRight", "arrowUp", "arrowStart", "arrowEnd", "article", "asterisk", "at", "auditbeatApp", "beaker", "bell", "bellSlash", "beta", "bolt", "boxesHorizontal", "boxesVertical", "branch", "branchUser", "broom", "brush", "bug", "bullseye", "calendar", "canvasApp", "casesApp", "check", "checkInCircleFilled", "cheer", "classificationJob", "clickLeft", "clickRight", "clock", "clockCounter", "cloudDrizzle", "cloudStormy", "cloudSunny", "cluster", "codeApp", "color", "compute", "console", "consoleApp", "container", "continuityAbove", "continuityAboveBelow", "continuityBelow", "continuityWithin", "controlsHorizontal", "controlsVertical", "copy", "copyClipboard", "createAdvancedJob", "createMultiMetricJob", "createPopulationJob", "createSingleMetricJob", "cross", "crossClusterReplicationApp", "crosshairs", "currency", "cut", "dashboardApp", "dataVisualizer", "database", "desktop", "devToolsApp", "diff", "discoverApp", "discuss", "document", "documentEdit", "documentation", "documents", "dot", "dotInCircle", "doubleArrowLeft", "doubleArrowRight", "download", "editorAlignCenter", "editorAlignLeft", "editorAlignRight", "editorBold", "editorChecklist", "editorCodeBlock", "editorComment", "editorDistributeHorizontal", "editorDistributeVertical", "editorHeading", "editorItalic", "editorItemAlignBottom", "editorItemAlignCenter", "editorItemAlignLeft", "editorItemAlignMiddle", "editorItemAlignRight", "editorItemAlignTop", "editorLink", "editorOrderedList", "editorPositionBottomLeft", "editorPositionBottomRight", "editorPositionTopLeft", "editorPositionTopRight", "editorRedo", "editorStrike", "editorTable", "editorUnderline", "editorUndo", "editorUnorderedList", "email", "empty", "emsApp", "endpoint", "eql", "eraser", "error", "errorFilled", "esqlVis", "exit", "expand", "expandMini", "exportAction", "eye", "eyeClosed", "faceHappy", "faceNeutral", "faceSad", "filebeatApp", "filter", "filterExclude", "filterIgnore", "filterInclude", "filterInCircle", "flag", "fleetApp", "fold", "folderCheck", "folderClosed", "folderExclamation", "folderOpen", "frameNext", "framePrevious", "fullScreen", "fullScreenExit", "function", "gear", "gisApp", "glasses", "globe", "grab", "grabHorizontal", "grabOmnidirectional", "gradient", "graphApp", "grid", "grokApp", "heart", "heartbeatApp", "heatmap", "help", "home", "iInCircle", "image", "importAction", "index", "indexClose", "indexEdit", "indexFlush", "indexManagementApp", "indexMapping", "indexOpen", "indexPatternApp", "indexRollupApp", "indexRuntime", "indexSettings", "indexTemporary", "infinity", "inputOutput", "inspect", "invert", "ip", "key", "keyboard", "kqlField", "kqlFunction", "kqlOperand", "kqlSelector", "kqlValue", "kubernetesNode", "kubernetesPod", "launch", "layers", "lensApp", "lettering", "lineDashed", "lineDotted", "lineSolid", "link", "list", "listAdd", "lock", "lockOpen", "logoAWS", "logoAWSMono", "logoAerospike", "logoApache", "logoAppSearch", "logoAzure", "logoAzureMono", "logoBeats", "logoBusinessAnalytics", "logoCeph", "logoCloud", "logoCloudEnterprise", "logoCode", "logoCodesandbox", "logoCouchbase", "logoDocker", "logoDropwizard", "logoElastic", "logoElasticStack", "logoElasticsearch", "logoEnterpriseSearch", "logoEtcd", "logoGCP", "logoGCPMono", "logoGithub", "logoGmail", "logoGolang", "logoGoogleG", "logoHAproxy", "logoIBM", "logoIBMMono", "logoKafka", "logoKibana", "logoKubernetes", "logoLogging", "logoLogstash", "logoMaps", "logoMemcached", "logoMetrics", "logoMongodb", "logoMySQL", "logoNginx", "logoObservability", "logoOsquery", "logoPhp", "logoPostgres", "logoPrometheus", "logoRabbitmq", "logoRedis", "logoSecurity", "logoSiteSearch", "logoSketch", "logoSlack", "logoUptime", "logoVulnerabilityManagement", "logoWebhook", "logoWindows", "logoWorkplaceSearch", "logsApp", "logstashFilter", "logstashIf", "logstashInput", "logstashOutput", "logstashQueue", "machineLearningApp", "magnet", "magnifyWithExclamation", "magnifyWithMinus", "magnifyWithPlus", "managementApp", "mapMarker", "memory", "menu", "menuDown", "menuLeft", "menuRight", "menuUp", "merge", "metricbeatApp", "metricsApp", "minimize", "minus", "minusInCircle", "minusInCircleFilled", "mobile", "monitoringApp", "moon", "move", "namespace", "nested", "newChat", "node", "notebookApp", "number", "offline", "online", "outlierDetectionJob", "package", "packetbeatApp", "pageSelect", "pagesSelect", "palette", "paperClip", "partial", "pause", "payment", "pencil", "percent", "pin", "pinFilled", "pipeBreaks", "pipelineApp", "pipeNoBreaks", "pivot", "play", "playFilled", "plus", "plusInCircle", "plusInCircleFilled", "popout", "push", "questionInCircle", "quote", "recentlyViewedApp", "refresh", "regressionJob", "reporter", "reportingApp", "returnKey", "save", "savedObjectsApp", "scale", "search", "searchProfilerApp", "securityAnalyticsApp", "securityApp", "securitySignal", "securitySignalDetected", "securitySignalResolved", "sessionViewer", "shard", "share", "snowflake", "sortAscending", "sortDescending", "sortDown", "sortLeft", "sortRight", "sortUp", "sortable", "spaces", "spacesApp", "sparkles", "sqlApp", "starEmpty", "starEmptySpace", "starFilled", "starFilledSpace", "starMinusEmpty", "starMinusFilled", "starPlusEmpty", "starPlusFilled", "stats", "stop", "stopFilled", "stopSlash", "storage", "string", "submodule", "sun", "swatchInput", "symlink", "tableDensityCompact", "tableDensityExpanded", "tableDensityNormal", "tableOfContents", "tag", "tear", "temperature", "timeline", "timelineWithArrow", "timelionApp", "timeRefresh", "timeslider", "training", "transitionLeftIn", "transitionLeftOut", "transitionTopIn", "transitionTopOut", "trash", "unfold", "unlink", "upgradeAssistantApp", "uptimeApp", "user", "userAvatar", "users", "usersRolesApp", "vector", "videoPlayer", "visArea", "visAreaStacked", "visBarHorizontal", "visBarHorizontalStacked", "visBarVertical", "visBarVerticalStacked", "visGauge", "visGoal", "visLine", "visMapCoordinate", "visMapRegion", "visMetric", "visPie", "visTable", "visTagCloud", "visText", "visTimelion", "visVega", "visVisualBuilder", "visualizeApp", "vulnerabilityManagementApp", "warning", "warningFilled", "alert", "watchesApp", "wordWrap", "wordWrapDisabled", "workplaceSearchApp", "wrench", "tokenAlias", "tokenAnnotation", "tokenArray", "tokenBinary", "tokenBoolean", "tokenClass", "tokenCompletionSuggester", "tokenConstant", "tokenDate", "tokenDimension", "tokenElement", "tokenEnum", "tokenEnumMember", "tokenEvent", "tokenException", "tokenField", "tokenFile", "tokenFlattened", "tokenFunction", "tokenGeo", "tokenHistogram", "tokenInterface", "tokenIP", "tokenJoin", "tokenKey", "tokenKeyword", "tokenMethod", "tokenMetricCounter", "tokenMetricGauge", "tokenModule", "tokenNamespace", "tokenNested", "tokenNull", "tokenNumber", "tokenObject", "tokenOperator", "tokenPackage", "tokenParameter", "tokenPercolator", "tokenProperty", "tokenRange", "tokenRankFeature", "tokenRankFeatures", "tokenRepo", "tokenSearchType", "tokenShape", "tokenString", "tokenStruct", "tokenSymbol", "tokenTag", "tokenText", "tokenTokenCount", "tokenVariable", "tokenVectorDense", "tokenDenseVector", "tokenVectorSparse"]).isRequired, _propTypes.default.string.isRequired, _propTypes.default.elementType.isRequired]).isRequired, _propTypes.default.element.isRequired, _propTypes.default.any.isRequired]),
|
|
129
129
|
hasPanel: _propTypes.default.bool,
|
|
130
130
|
disabled: _propTypes.default.bool,
|
|
131
131
|
onClick: _propTypes.default.func,
|
|
@@ -5,8 +5,9 @@ var _typeof = require("@babel/runtime/helpers/typeof");
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
|
-
exports.
|
|
8
|
+
exports.EuiFilePickerClass = exports.EuiFilePicker = void 0;
|
|
9
9
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
10
|
+
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
10
11
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
11
12
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
12
13
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
@@ -17,17 +18,18 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
|
|
|
17
18
|
var _react = _interopRequireWildcard(require("react"));
|
|
18
19
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
19
20
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
20
|
-
var
|
|
21
|
-
var _validatable_control = require("../validatable_control");
|
|
21
|
+
var _services = require("../../../services");
|
|
22
22
|
var _button = require("../../button");
|
|
23
23
|
var _progress = require("../../progress");
|
|
24
24
|
var _icon = require("../../icon");
|
|
25
25
|
var _i18n = require("../../i18n");
|
|
26
26
|
var _loading = require("../../loading");
|
|
27
|
-
var _accessibility = require("../../../services/accessibility");
|
|
28
27
|
var _eui_form_context = require("../eui_form_context");
|
|
28
|
+
var _validatable_control = require("../validatable_control");
|
|
29
|
+
var _form_control_layout_clear_button = require("../form_control_layout/form_control_layout_clear_button");
|
|
30
|
+
var _file_picker = require("./file_picker.styles");
|
|
29
31
|
var _react2 = require("@emotion/react");
|
|
30
|
-
var _excluded = ["id", "name", "initialPromptText", "className", "disabled", "compressed", "onChange", "isInvalid", "fullWidth", "isLoading", "display"];
|
|
32
|
+
var _excluded = ["stylesMemoizer", "id", "name", "initialPromptText", "className", "disabled", "compressed", "onChange", "isInvalid", "fullWidth", "isLoading", "display"];
|
|
31
33
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
32
34
|
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
35
|
function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
|
|
@@ -38,25 +40,20 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
|
|
|
38
40
|
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
39
41
|
* Side Public License, v 1.
|
|
40
42
|
*/
|
|
41
|
-
var
|
|
42
|
-
|
|
43
|
-
large: 'euiFilePicker--large'
|
|
44
|
-
};
|
|
45
|
-
var DISPLAYS = exports.DISPLAYS = (0, _common.keysOf)(displayToClassNameMap);
|
|
46
|
-
var EuiFilePicker = exports.EuiFilePicker = /*#__PURE__*/function (_Component) {
|
|
47
|
-
function EuiFilePicker() {
|
|
43
|
+
var EuiFilePickerClass = exports.EuiFilePickerClass = /*#__PURE__*/function (_Component) {
|
|
44
|
+
function EuiFilePickerClass() {
|
|
48
45
|
var _this;
|
|
49
|
-
(0, _classCallCheck2.default)(this,
|
|
46
|
+
(0, _classCallCheck2.default)(this, EuiFilePickerClass);
|
|
50
47
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
51
48
|
args[_key] = arguments[_key];
|
|
52
49
|
}
|
|
53
|
-
_this = _callSuper(this,
|
|
50
|
+
_this = _callSuper(this, EuiFilePickerClass, [].concat(args));
|
|
54
51
|
(0, _defineProperty2.default)(_this, "state", {
|
|
55
52
|
promptText: null,
|
|
56
53
|
isHoveringDrop: false
|
|
57
54
|
});
|
|
58
55
|
(0, _defineProperty2.default)(_this, "fileInput", null);
|
|
59
|
-
(0, _defineProperty2.default)(_this, "generatedId", (0,
|
|
56
|
+
(0, _defineProperty2.default)(_this, "generatedId", (0, _services.htmlIdGenerator)()());
|
|
60
57
|
(0, _defineProperty2.default)(_this, "handleChange", function () {
|
|
61
58
|
if (!_this.fileInput) return;
|
|
62
59
|
if (_this.fileInput.files && _this.fileInput.files.length > 1) {
|
|
@@ -106,8 +103,8 @@ var EuiFilePicker = exports.EuiFilePicker = /*#__PURE__*/function (_Component) {
|
|
|
106
103
|
});
|
|
107
104
|
return _this;
|
|
108
105
|
}
|
|
109
|
-
(0, _inherits2.default)(
|
|
110
|
-
return (0, _createClass2.default)(
|
|
106
|
+
(0, _inherits2.default)(EuiFilePickerClass, _Component);
|
|
107
|
+
return (0, _createClass2.default)(EuiFilePickerClass, [{
|
|
111
108
|
key: "render",
|
|
112
109
|
value: function render() {
|
|
113
110
|
var _this2 = this;
|
|
@@ -118,6 +115,7 @@ var EuiFilePicker = exports.EuiFilePicker = /*#__PURE__*/function (_Component) {
|
|
|
118
115
|
default: "Clear selected files"
|
|
119
116
|
}, function (clearSelectedFiles) {
|
|
120
117
|
var _this2$props = _this2.props,
|
|
118
|
+
stylesMemoizer = _this2$props.stylesMemoizer,
|
|
121
119
|
id = _this2$props.id,
|
|
122
120
|
name = _this2$props.name,
|
|
123
121
|
initialPromptText = _this2$props.initialPromptText,
|
|
@@ -134,34 +132,39 @@ var EuiFilePicker = exports.EuiFilePicker = /*#__PURE__*/function (_Component) {
|
|
|
134
132
|
var promptId = "".concat(id || _this2.generatedId, "-filePicker__prompt");
|
|
135
133
|
var isOverridingInitialPrompt = _this2.state.promptText != null;
|
|
136
134
|
var normalFormControl = display === 'default';
|
|
137
|
-
var classes = (0, _classnames.default)('euiFilePicker',
|
|
138
|
-
|
|
139
|
-
'euiFilePicker--compressed': compressed,
|
|
140
|
-
'euiFilePicker--fullWidth': fullWidth,
|
|
135
|
+
var classes = (0, _classnames.default)('euiFilePicker', {
|
|
136
|
+
'euiFilePicker-isDroppingFile': _this2.state.isHoveringDrop,
|
|
141
137
|
'euiFilePicker-isInvalid': isInvalid,
|
|
142
138
|
'euiFilePicker-isLoading': isLoading,
|
|
143
139
|
'euiFilePicker-hasFiles': isOverridingInitialPrompt
|
|
144
140
|
}, className);
|
|
141
|
+
var styles = stylesMemoizer(_file_picker.euiFilePickerStyles);
|
|
142
|
+
var cssStyles = [styles.euiFilePicker, fullWidth ? styles.fullWidth : styles.formWidth, _this2.state.isHoveringDrop && styles.isDroppingFile, isInvalid && !disabled && styles.invalid, isOverridingInitialPrompt && !disabled && styles.hasFiles, isLoading && styles.loading];
|
|
143
|
+
var inputStyles = [styles.input.euiFilePicker__input, !normalFormControl && !disabled && styles.input.largeInteractive];
|
|
144
|
+
var promptStyles = [styles.euiFilePicker__prompt, disabled && styles.disabled].concat((0, _toConsumableArray2.default)(normalFormControl ? [compressed ? styles.compressed : styles.uncompressed] : [styles.large.large, compressed ? styles.large.compressed : styles.large.uncompressed]));
|
|
145
|
+
var iconStyles = [styles.icon.euiFilePicker__icon].concat((0, _toConsumableArray2.default)(normalFormControl ? [styles.icon.normal, compressed ? styles.icon.compresssed : styles.icon.uncompressed] : [styles.icon.large]));
|
|
146
|
+
var rightIconStyles = normalFormControl ? [styles.rightIcon.euiFilePicker__rightIcon, compressed ? styles.rightIcon.compressed : styles.rightIcon.uncompressed] : undefined;
|
|
145
147
|
var clearButton;
|
|
146
148
|
if (isLoading && normalFormControl) {
|
|
147
149
|
// Override clear button with loading spinner if it is in loading state
|
|
148
150
|
clearButton = (0, _react2.jsx)(_loading.EuiLoadingSpinner, {
|
|
149
|
-
|
|
151
|
+
css: rightIconStyles,
|
|
152
|
+
className: "euiFilePicker__loadingSpinner",
|
|
153
|
+
size: compressed ? 's' : 'm'
|
|
150
154
|
});
|
|
151
155
|
} else if (isOverridingInitialPrompt && !disabled) {
|
|
152
156
|
if (normalFormControl) {
|
|
153
|
-
clearButton = (0, _react2.jsx)(
|
|
154
|
-
type: "button",
|
|
157
|
+
clearButton = (0, _react2.jsx)(_form_control_layout_clear_button.EuiFormControlLayoutClearButton, {
|
|
155
158
|
"aria-label": clearSelectedFiles,
|
|
159
|
+
css: [styles.euiFilePicker__clearButton, rightIconStyles, ";label:clearButton;"],
|
|
156
160
|
className: "euiFilePicker__clearButton",
|
|
157
|
-
onClick: _this2.removeFiles
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
type: "cross"
|
|
161
|
-
}));
|
|
161
|
+
onClick: _this2.removeFiles,
|
|
162
|
+
size: compressed ? 's' : 'm'
|
|
163
|
+
});
|
|
162
164
|
} else {
|
|
163
165
|
clearButton = (0, _react2.jsx)(_button.EuiButtonEmpty, {
|
|
164
166
|
"aria-label": clearSelectedFiles,
|
|
167
|
+
css: styles.euiFilePicker__clearButton,
|
|
165
168
|
className: "euiFilePicker__clearButton",
|
|
166
169
|
size: "xs",
|
|
167
170
|
onClick: _this2.removeFiles
|
|
@@ -179,15 +182,15 @@ var EuiFilePicker = exports.EuiFilePicker = /*#__PURE__*/function (_Component) {
|
|
|
179
182
|
position: "absolute"
|
|
180
183
|
});
|
|
181
184
|
return (0, _react2.jsx)("div", {
|
|
185
|
+
css: cssStyles,
|
|
182
186
|
className: classes
|
|
183
|
-
}, (0, _react2.jsx)("div", {
|
|
184
|
-
className: "euiFilePicker__wrap"
|
|
185
187
|
}, (0, _react2.jsx)(_validatable_control.EuiValidatableControl, {
|
|
186
188
|
isInvalid: isInvalid
|
|
187
189
|
}, (0, _react2.jsx)("input", (0, _extends2.default)({
|
|
188
190
|
type: "file",
|
|
189
191
|
id: id,
|
|
190
192
|
name: name,
|
|
193
|
+
css: inputStyles,
|
|
191
194
|
className: "euiFilePicker__input",
|
|
192
195
|
onChange: _this2.handleChange,
|
|
193
196
|
ref: function ref(input) {
|
|
@@ -199,23 +202,25 @@ var EuiFilePicker = exports.EuiFilePicker = /*#__PURE__*/function (_Component) {
|
|
|
199
202
|
disabled: disabled,
|
|
200
203
|
"aria-describedby": promptId
|
|
201
204
|
}, rest))), (0, _react2.jsx)("div", {
|
|
205
|
+
css: promptStyles,
|
|
202
206
|
className: "euiFilePicker__prompt",
|
|
203
207
|
id: promptId
|
|
204
208
|
}, (0, _react2.jsx)(_icon.EuiIcon, {
|
|
209
|
+
css: iconStyles,
|
|
205
210
|
className: "euiFilePicker__icon",
|
|
206
211
|
color: isInvalid ? 'danger' : disabled ? 'subdued' : 'primary',
|
|
207
212
|
type: isInvalid ? 'alert' : 'importAction',
|
|
208
213
|
size: normalFormControl ? 'm' : 'l',
|
|
209
214
|
"aria-hidden": "true"
|
|
210
|
-
}), (0, _react2.jsx)("
|
|
215
|
+
}), (0, _react2.jsx)("span", {
|
|
211
216
|
className: "euiFilePicker__promptText"
|
|
212
|
-
}, _this2.state.promptText || initialPromptText), clearButton, loader))
|
|
217
|
+
}, _this2.state.promptText || initialPromptText), clearButton, loader));
|
|
213
218
|
});
|
|
214
219
|
}
|
|
215
220
|
}]);
|
|
216
221
|
}(_react.Component);
|
|
217
|
-
(0, _defineProperty2.default)(
|
|
218
|
-
(0, _defineProperty2.default)(
|
|
222
|
+
(0, _defineProperty2.default)(EuiFilePickerClass, "contextType", _eui_form_context.FormContext);
|
|
223
|
+
(0, _defineProperty2.default)(EuiFilePickerClass, "defaultProps", {
|
|
219
224
|
initialPromptText: (0, _react2.jsx)(_i18n.EuiI18n, {
|
|
220
225
|
token: "euiFilePicker.promptText",
|
|
221
226
|
default: "Select or drag and drop a file"
|
|
@@ -223,12 +228,13 @@ var EuiFilePicker = exports.EuiFilePicker = /*#__PURE__*/function (_Component) {
|
|
|
223
228
|
compressed: false,
|
|
224
229
|
display: 'large'
|
|
225
230
|
});
|
|
226
|
-
|
|
231
|
+
EuiFilePickerClass.propTypes = {
|
|
227
232
|
id: _propTypes.default.string,
|
|
228
233
|
name: _propTypes.default.string,
|
|
229
234
|
className: _propTypes.default.string,
|
|
230
235
|
/**
|
|
231
236
|
* The content that appears in the dropzone if no file is attached
|
|
237
|
+
* @default 'Select or drag and drop a file'
|
|
232
238
|
*/
|
|
233
239
|
initialPromptText: _propTypes.default.node,
|
|
234
240
|
/**
|
|
@@ -237,12 +243,14 @@ EuiFilePicker.propTypes = {
|
|
|
237
243
|
onChange: _propTypes.default.func,
|
|
238
244
|
/**
|
|
239
245
|
* Reduces the size to a typical (compressed) input
|
|
246
|
+
* @default false
|
|
240
247
|
*/
|
|
241
248
|
compressed: _propTypes.default.bool,
|
|
242
249
|
/**
|
|
243
250
|
* Size or type of display;
|
|
244
251
|
* `default` for normal height, similar to other controls;
|
|
245
252
|
* `large` for taller size
|
|
253
|
+
* @default large
|
|
246
254
|
*/
|
|
247
255
|
display: _propTypes.default.oneOf(["default", "large"]),
|
|
248
256
|
/**
|
|
@@ -257,4 +265,5 @@ EuiFilePicker.propTypes = {
|
|
|
257
265
|
"aria-label": _propTypes.default.string,
|
|
258
266
|
"data-test-subj": _propTypes.default.string,
|
|
259
267
|
css: _propTypes.default.any
|
|
260
|
-
};
|
|
268
|
+
};
|
|
269
|
+
var EuiFilePicker = exports.EuiFilePicker = (0, _services.withEuiStylesMemoizer)(EuiFilePickerClass);
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.euiFilePickerStyles = void 0;
|
|
7
|
+
var _react = require("@emotion/react");
|
|
8
|
+
var _global_styling = require("../../../global_styling");
|
|
9
|
+
var _form = require("../form.styles");
|
|
10
|
+
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; } /*
|
|
11
|
+
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
12
|
+
* or more contributor license agreements. Licensed under the Elastic License
|
|
13
|
+
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
14
|
+
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
15
|
+
* Side Public License, v 1.
|
|
16
|
+
*/
|
|
17
|
+
var _ref = process.env.NODE_ENV === "production" ? {
|
|
18
|
+
name: "6h1iuq-euiFilePicker__clearButton",
|
|
19
|
+
styles: "pointer-events:auto;position:relative;label:euiFilePicker__clearButton;"
|
|
20
|
+
} : {
|
|
21
|
+
name: "6h1iuq-euiFilePicker__clearButton",
|
|
22
|
+
styles: "pointer-events:auto;position:relative;label:euiFilePicker__clearButton;",
|
|
23
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
24
|
+
};
|
|
25
|
+
var _ref2 = process.env.NODE_ENV === "production" ? {
|
|
26
|
+
name: "d8me89-euiFilePicker__rightIcon",
|
|
27
|
+
styles: "position:absolute;label:euiFilePicker__rightIcon;"
|
|
28
|
+
} : {
|
|
29
|
+
name: "d8me89-euiFilePicker__rightIcon",
|
|
30
|
+
styles: "position:absolute;label:euiFilePicker__rightIcon;",
|
|
31
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
32
|
+
};
|
|
33
|
+
var _ref3 = process.env.NODE_ENV === "production" ? {
|
|
34
|
+
name: "19x04ih-largeInteractive",
|
|
35
|
+
styles: "&:hover,&:focus,.euiFilePicker-isDroppingFile &{&+.euiFilePicker__prompt{.euiFilePicker__promptText{text-decoration:underline;}.euiFilePicker__icon{transform:scale(1.1);}}};label:largeInteractive;"
|
|
36
|
+
} : {
|
|
37
|
+
name: "19x04ih-largeInteractive",
|
|
38
|
+
styles: "&:hover,&:focus,.euiFilePicker-isDroppingFile &{&+.euiFilePicker__prompt{.euiFilePicker__promptText{text-decoration:underline;}.euiFilePicker__icon{transform:scale(1.1);}}};label:largeInteractive;",
|
|
39
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
40
|
+
};
|
|
41
|
+
var _ref4 = process.env.NODE_ENV === "production" ? {
|
|
42
|
+
name: "1j9s7hu-euiFilePicker__input",
|
|
43
|
+
styles: "position:absolute;inset:0;opacity:0;&:hover{cursor:pointer;}&:hover:disabled{cursor:not-allowed;}&:disabled{opacity:0;};label:euiFilePicker__input;"
|
|
44
|
+
} : {
|
|
45
|
+
name: "1j9s7hu-euiFilePicker__input",
|
|
46
|
+
styles: "position:absolute;inset:0;opacity:0;&:hover{cursor:pointer;}&:hover:disabled{cursor:not-allowed;}&:disabled{opacity:0;};label:euiFilePicker__input;",
|
|
47
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
48
|
+
};
|
|
49
|
+
var euiFilePickerStyles = exports.euiFilePickerStyles = function euiFilePickerStyles(euiThemeContext) {
|
|
50
|
+
var euiTheme = euiThemeContext.euiTheme;
|
|
51
|
+
var formStyles = (0, _form.euiFormControlStyles)(euiThemeContext);
|
|
52
|
+
var formVariables = (0, _form.euiFormVariables)(euiThemeContext);
|
|
53
|
+
var _euiFontSize = (0, _global_styling.euiFontSize)(euiThemeContext, 's'),
|
|
54
|
+
fontSize = _euiFontSize.fontSize,
|
|
55
|
+
lineHeight = _euiFontSize.lineHeight;
|
|
56
|
+
return {
|
|
57
|
+
euiFilePicker: /*#__PURE__*/(0, _react.css)("--euiFormControlLeftIconsCount:1;position:relative;&:has(input:focus){--euiFormControlStateColor:", euiTheme.colors.primary, ";};label:euiFilePicker;"),
|
|
58
|
+
isDroppingFile: /*#__PURE__*/(0, _react.css)("--euiFormControlStateColor:", euiTheme.colors.primary, ";;label:isDroppingFile;"),
|
|
59
|
+
invalid: /*#__PURE__*/(0, _react.css)("--euiFormControlStateColor:", euiTheme.colors.danger, ";;label:invalid;"),
|
|
60
|
+
hasFiles: /*#__PURE__*/(0, _react.css)("--euiFormControlRightIconsCount:1;font-weight:", euiTheme.font.weight.bold, ";;label:hasFiles;"),
|
|
61
|
+
loading: /*#__PURE__*/(0, _react.css)("--euiFormControlRightIconsCount:1;border-radius:", formVariables.controlCompressedBorderRadius, ";overflow:hidden;;label:loading;"),
|
|
62
|
+
// Skip the css() on the default width to avoid generating a className
|
|
63
|
+
formWidth: formStyles.formWidth,
|
|
64
|
+
fullWidth: /*#__PURE__*/(0, _react.css)(formStyles.fullWidth, ";label:fullWidth;"),
|
|
65
|
+
// The input is an invisible dropzone / button
|
|
66
|
+
input: {
|
|
67
|
+
euiFilePicker__input: _ref4,
|
|
68
|
+
largeInteractive: _ref3
|
|
69
|
+
},
|
|
70
|
+
euiFilePicker__prompt: /*#__PURE__*/(0, _react.css)("pointer-events:none;font-size:", fontSize, ";line-height:1;", (0, _global_styling.euiTextTruncate)(), " color:", euiTheme.colors.text, ";border:", euiTheme.border.width.thick, " dashed var(--euiFormControlStateColor, ", euiTheme.colors.lightShade, ");", _global_styling.euiCanAnimate, "{transition:border-color ", euiTheme.animation.fast, " ease-in,background-color ", euiTheme.animation.fast, " ease-in;};label:euiFilePicker__prompt;"),
|
|
71
|
+
disabled: /*#__PURE__*/(0, _react.css)(formStyles.disabled, ";label:disabled;"),
|
|
72
|
+
// Skip the css() on the default height to avoid generating a className
|
|
73
|
+
uncompressed: formStyles.uncompressed,
|
|
74
|
+
compressed: /*#__PURE__*/(0, _react.css)(formStyles.compressed, ";label:compressed;"),
|
|
75
|
+
// Completely different rendering style from the normal form controls
|
|
76
|
+
large: {
|
|
77
|
+
large: /*#__PURE__*/(0, _react.css)("padding-inline:", euiTheme.size.l, ";display:flex;flex-direction:column;align-items:center;justify-content:center;.euiFilePicker__promptText{", (0, _global_styling.euiTextTruncate)(), " line-height:", lineHeight, ";};label:large;"),
|
|
78
|
+
// Static heights so that surrounding contents don't shift around
|
|
79
|
+
uncompressed: "\n ".concat((0, _global_styling.logicalCSS)('height', (0, _global_styling.mathWithUnits)(euiTheme.size.base, function (x) {
|
|
80
|
+
return x * 8;
|
|
81
|
+
})), "\n border-radius: ").concat(formVariables.controlBorderRadius, ";\n "),
|
|
82
|
+
compressed: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('height', (0, _global_styling.mathWithUnits)(euiTheme.size.base, function (x) {
|
|
83
|
+
return x * 6.5;
|
|
84
|
+
})), " border-radius:", formVariables.controlCompressedBorderRadius, ";;label:compressed;")
|
|
85
|
+
},
|
|
86
|
+
icon: {
|
|
87
|
+
euiFilePicker__icon: /*#__PURE__*/(0, _react.css)(";label:euiFilePicker__icon;"),
|
|
88
|
+
normal: /*#__PURE__*/(0, _react.css)("position:absolute;", (0, _global_styling.logicalCSS)('top', 0), " ", (0, _global_styling.logicalCSS)('height', '100%'), ";;label:normal;"),
|
|
89
|
+
uncompressed: "\n ".concat((0, _global_styling.logicalCSS)('left', euiTheme.size.m), "\n "),
|
|
90
|
+
compresssed: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('left', euiTheme.size.s), " ", (0, _global_styling.logicalCSS)('width', euiTheme.size.m), ";;label:compresssed;"),
|
|
91
|
+
large: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('margin-bottom', euiTheme.size.base), " ", _global_styling.euiCanAnimate, "{transition:transform ", euiTheme.animation.fast, " ", euiTheme.animation.resistance, ";};label:large;")
|
|
92
|
+
},
|
|
93
|
+
rightIcon: {
|
|
94
|
+
euiFilePicker__rightIcon: _ref2,
|
|
95
|
+
uncompressed: "\n ".concat((0, _global_styling.logicalCSS)('top', euiTheme.size.m), "\n ").concat((0, _global_styling.logicalCSS)('right', euiTheme.size.m), "\n "),
|
|
96
|
+
compressed: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('right', euiTheme.size.s), " ", (0, _global_styling.logicalCSS)('top', '50%'), " ", (0, _global_styling.logicalCSS)('margin-top', (0, _global_styling.mathWithUnits)(euiTheme.size.m, function (x) {
|
|
97
|
+
return x / -2;
|
|
98
|
+
})), ";;label:compressed;")
|
|
99
|
+
},
|
|
100
|
+
euiFilePicker__clearButton: _ref
|
|
101
|
+
};
|
|
102
|
+
};
|
|
@@ -29,21 +29,23 @@ var EuiIconAppCases = function EuiIconAppCases(_ref) {
|
|
|
29
29
|
xmlns: "http://www.w3.org/2000/svg",
|
|
30
30
|
width: 32,
|
|
31
31
|
height: 32,
|
|
32
|
-
fill: "none",
|
|
33
32
|
viewBox: "0 0 32 32",
|
|
34
33
|
"aria-labelledby": titleId
|
|
35
34
|
}, props), title ? (0, _react2.jsx)("title", {
|
|
36
35
|
id: titleId
|
|
37
36
|
}, title) : null, (0, _react2.jsx)("path", {
|
|
38
|
-
|
|
39
|
-
|
|
37
|
+
d: "M4 6h22v7h-2V8H6v19H4V6Z",
|
|
38
|
+
className: "euiIcon__fillSecondary"
|
|
39
|
+
}), (0, _react2.jsx)("path", {
|
|
40
|
+
d: "M10 12H7v-2h3v2Zm1 0h12v-2H11v2Z",
|
|
41
|
+
className: "euiIcon__fillSecondary"
|
|
42
|
+
}), (0, _react2.jsx)("path", {
|
|
43
|
+
d: "M24 1H0v26h1l-1 .001v.026a2.256 2.256 0 0 0 .01.185 4.318 4.318 0 0 0 .563 1.792C1.194 30.064 2.399 31 4.5 31H17v-2H8.429a4.32 4.32 0 0 0 .57-1.927v-.062L9 27.005v-.003S9 27 8 27h1V16h21v3h2v-5H7v12.995l-.003.05a2.32 2.32 0 0 1-.298.95C6.442 28.436 5.898 29 4.5 29c-1.398 0-1.942-.564-2.199-1.004a2.32 2.32 0 0 1-.3-1.001L2 26.992V3h20v3h2V1Z"
|
|
40
44
|
}), (0, _react2.jsx)("path", {
|
|
41
|
-
d: "
|
|
45
|
+
d: "M23 21v3h-3v2h3v3h2v-3h3v-2h-3v-3h-2Z"
|
|
42
46
|
}), (0, _react2.jsx)("path", {
|
|
43
47
|
fillRule: "evenodd",
|
|
44
|
-
d: "
|
|
45
|
-
className: "euiIcon__fillSecondary",
|
|
46
|
-
clipRule: "evenodd"
|
|
48
|
+
d: "M24 32a7 7 0 1 0 0-14 7 7 0 0 0 0 14Zm0-2a5 5 0 1 0 0-10 5 5 0 0 0 0 10Z"
|
|
47
49
|
}));
|
|
48
50
|
};
|
|
49
51
|
var icon = exports.icon = EuiIconAppCases;
|
|
@@ -33,21 +33,15 @@ var EuiIconLogoElasticStack = function EuiIconLogoElasticStack(_ref) {
|
|
|
33
33
|
"aria-labelledby": titleId
|
|
34
34
|
}, props), title ? (0, _react2.jsx)("title", {
|
|
35
35
|
id: titleId
|
|
36
|
-
}, title) : null, (0, _react2.jsx)("
|
|
37
|
-
fill: "none",
|
|
38
|
-
fillRule: "evenodd"
|
|
39
|
-
}, (0, _react2.jsx)("path", {
|
|
36
|
+
}, title) : null, (0, _react2.jsx)("path", {
|
|
40
37
|
fill: "#F04E98",
|
|
41
|
-
d: "
|
|
38
|
+
d: "M0 2.37A2.37 2.37 0 0 1 2.37 0h27.26A2.37 2.37 0 0 1 32 2.37v6.52H0V2.37Z"
|
|
42
39
|
}), (0, _react2.jsx)("path", {
|
|
43
40
|
fill: "#00BFB3",
|
|
44
|
-
d: "M0
|
|
41
|
+
d: "M0 20.148h32v-8.296H0v8.296Z"
|
|
45
42
|
}), (0, _react2.jsx)("path", {
|
|
46
|
-
fill: "#
|
|
47
|
-
d: "
|
|
48
|
-
})
|
|
49
|
-
fill: "#FEC514",
|
|
50
|
-
d: "M17.5 23v9h12a2.5 2.5 0 0 0 2.5-2.5V23H17.5Z"
|
|
51
|
-
})));
|
|
43
|
+
fill: "#07C",
|
|
44
|
+
d: "M0 23.111h32v6.519A2.37 2.37 0 0 1 29.63 32H2.37A2.37 2.37 0 0 1 0 29.63v-6.52Z"
|
|
45
|
+
}));
|
|
52
46
|
};
|
|
53
47
|
var icon = exports.icon = EuiIconLogoElasticStack;
|
|
@@ -56,9 +56,9 @@ var EuiStep = exports.EuiStep = function EuiStep(_ref) {
|
|
|
56
56
|
}, (0, _react2.jsx)(_step_number.EuiStepNumber, {
|
|
57
57
|
number: step,
|
|
58
58
|
status: status,
|
|
59
|
-
titleSize: titleSize
|
|
59
|
+
titleSize: titleSize === 'xxs' ? 'none' : titleSize
|
|
60
60
|
}), (0, _react2.jsx)(_title.EuiTitle, {
|
|
61
|
-
size: titleSize,
|
|
61
|
+
size: titleSize === 'xxs' ? 'xs' : titleSize,
|
|
62
62
|
className: "euiStep__title",
|
|
63
63
|
css: cssStepTitleStyles
|
|
64
64
|
}, /*#__PURE__*/(0, _react.createElement)(headingElement, null, title))), (0, _react2.jsx)("div", {
|
|
@@ -89,7 +89,9 @@ EuiStep.propTypes = {
|
|
|
89
89
|
*/
|
|
90
90
|
status: _propTypes.default.any,
|
|
91
91
|
/**
|
|
92
|
-
* Title sizing equivalent to EuiTitle
|
|
92
|
+
* Title sizing equivalent to **EuiTitle**, but only `m`, `s`, `xs` font sizes.
|
|
93
|
+
* The `xxs` size reduces the size of the accompanying step indicator, but not the title itself.
|
|
94
|
+
* @default s
|
|
93
95
|
*/
|
|
94
96
|
titleSize: _propTypes.default.any
|
|
95
97
|
};
|
|
@@ -19,6 +19,7 @@ var euiStepVariables = exports.euiStepVariables = function euiStepVariables(euiT
|
|
|
19
19
|
return {
|
|
20
20
|
numberSize: euiTheme.size.xl,
|
|
21
21
|
numberXSSize: euiTheme.size.l,
|
|
22
|
+
numberXXSSize: euiTheme.size.base,
|
|
22
23
|
numberMargin: euiTheme.size.base
|
|
23
24
|
};
|
|
24
25
|
};
|
|
@@ -38,9 +39,10 @@ var euiStepStyles = exports.euiStepStyles = function euiStepStyles(euiThemeConte
|
|
|
38
39
|
return {
|
|
39
40
|
euiStep: /*#__PURE__*/(0, _react.css)("&:not(:last-of-type){background-image:", lineGradient, ";background-repeat:no-repeat;};label:euiStep;"),
|
|
40
41
|
// Sizes
|
|
41
|
-
m: /*#__PURE__*/(0, _react.css)("&:not(:last-of-type){background-position:left ",
|
|
42
|
-
s: /*#__PURE__*/(0, _react.css)("&:not(:last-of-type){background-position:left ",
|
|
43
|
-
xs: /*#__PURE__*/(0, _react.css)("&:not(:last-of-type){background-position:-", euiTheme.size.xs, " ",
|
|
42
|
+
m: /*#__PURE__*/(0, _react.css)("&:not(:last-of-type){background-position:left ", euiStep.numberSize, ";};label:m;"),
|
|
43
|
+
s: /*#__PURE__*/(0, _react.css)("&:not(:last-of-type){background-position:left ", euiStep.numberSize, ";};label:s;"),
|
|
44
|
+
xs: /*#__PURE__*/(0, _react.css)("&:not(:last-of-type){background-position:-", euiTheme.size.xs, " ", euiStep.numberXSSize, ";};label:xs;"),
|
|
45
|
+
xxs: /*#__PURE__*/(0, _react.css)("&:not(:last-of-type){background-position:-", euiTheme.size.s, " ", euiStep.numberXXSSize, ";};label:xxs;")
|
|
44
46
|
};
|
|
45
47
|
};
|
|
46
48
|
var euiStepContentStyles = exports.euiStepContentStyles = function euiStepContentStyles(euiThemeContext) {
|
|
@@ -64,7 +66,12 @@ var euiStepContentStyles = exports.euiStepContentStyles = function euiStepConten
|
|
|
64
66
|
return x / 2 + y;
|
|
65
67
|
})), (0, _global_styling.logicalCSS)('margin-left', (0, _global_styling.mathWithUnits)(euiStep.numberXSSize, function (x) {
|
|
66
68
|
return x / 2;
|
|
67
|
-
})), ";;label:xs;")
|
|
69
|
+
})), ";;label:xs;"),
|
|
70
|
+
xxs: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('padding-left', (0, _global_styling.mathWithUnits)([euiStep.numberXXSSize, euiStep.numberMargin], function (x, y) {
|
|
71
|
+
return x / 2 + y;
|
|
72
|
+
})), (0, _global_styling.logicalCSS)('margin-left', (0, _global_styling.mathWithUnits)(euiStep.numberXXSSize, function (x) {
|
|
73
|
+
return x / 2;
|
|
74
|
+
})), ";;label:xxs;")
|
|
68
75
|
};
|
|
69
76
|
};
|
|
70
77
|
var euiStepTitleStyles = exports.euiStepTitleStyles = function euiStepTitleStyles(euiThemeContext) {
|
|
@@ -77,6 +84,7 @@ var euiStepTitleStyles = exports.euiStepTitleStyles = function euiStepTitleStyle
|
|
|
77
84
|
// Sizes
|
|
78
85
|
m: /*#__PURE__*/(0, _react.css)(";label:m;"),
|
|
79
86
|
s: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('padding-top', euiTheme.size.xs), ";;label:s;"),
|
|
80
|
-
xs: /*#__PURE__*/(0, _react.css)(";label:xs;")
|
|
87
|
+
xs: /*#__PURE__*/(0, _react.css)(";label:xs;"),
|
|
88
|
+
xxs: /*#__PURE__*/(0, _react.css)("line-height:", euiStep.numberXXSSize, ";;label:xxs;")
|
|
81
89
|
};
|
|
82
90
|
};
|
|
@@ -10,9 +10,9 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
|
|
|
10
10
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
11
11
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
12
12
|
var _react = _interopRequireDefault(require("react"));
|
|
13
|
+
var _services = require("../../services");
|
|
13
14
|
var _step_number = require("./step_number");
|
|
14
15
|
var _step_strings = require("./step_strings");
|
|
15
|
-
var _services = require("../../services");
|
|
16
16
|
var _step_horizontal = require("./step_horizontal.styles");
|
|
17
17
|
var _react2 = require("@emotion/react");
|
|
18
18
|
var _excluded = ["className", "step", "title", "onClick", "disabled", "status", "size"];
|
|
@@ -23,6 +23,12 @@ var _excluded = ["className", "step", "title", "onClick", "disabled", "status",
|
|
|
23
23
|
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
24
24
|
* Side Public License, v 1.
|
|
25
25
|
*/
|
|
26
|
+
// The titleSize map is not 1 to 1; small == xs on the titleSize map
|
|
27
|
+
var stepNumberSizeMap = {
|
|
28
|
+
xs: 'none',
|
|
29
|
+
s: 'xs',
|
|
30
|
+
m: 'm'
|
|
31
|
+
};
|
|
26
32
|
var EuiStepHorizontal = exports.EuiStepHorizontal = function EuiStepHorizontal(_ref) {
|
|
27
33
|
var className = _ref.className,
|
|
28
34
|
_ref$step = _ref.step,
|
|
@@ -94,8 +100,7 @@ var EuiStepHorizontal = exports.EuiStepHorizontal = function EuiStepHorizontal(_
|
|
|
94
100
|
className: "euiStepHorizontal__number",
|
|
95
101
|
status: status,
|
|
96
102
|
number: step,
|
|
97
|
-
titleSize: size
|
|
98
|
-
,
|
|
103
|
+
titleSize: stepNumberSizeMap[size],
|
|
99
104
|
css: cssNumberStyles
|
|
100
105
|
}), (0, _react2.jsx)("span", {
|
|
101
106
|
className: "euiStepHorizontal__title",
|
|
@@ -44,6 +44,7 @@ var euiStepHorizontalStyles = exports.euiStepHorizontalStyles = function euiStep
|
|
|
44
44
|
// Adjust the size of the step number and connecting lines based on size
|
|
45
45
|
m: _generateStepSizeAndInset(euiStep.numberSize),
|
|
46
46
|
s: _generateStepSizeAndInset(euiStep.numberXSSize),
|
|
47
|
+
xs: _generateStepSizeAndInset(euiStep.numberXXSSize),
|
|
47
48
|
// Note: these selectors must be nested because focus/hover state
|
|
48
49
|
// is on the parent container, but affects specific children
|
|
49
50
|
enabled: /*#__PURE__*/(0, _react.css)("&:focus,&:hover{.euiStepHorizontal__title{text-decoration:underline;}}&:focus{outline:none;.euiStepHorizontal__number{", (0, _global_styling.euiFocusRing)(euiThemeContext), ";}.euiStepHorizontal__number:not(:focus-visible){outline:", euiTheme.focus.width, " solid ", euiTheme.colors.darkestShade, ";}};label:enabled;"),
|