@elastic/eui 113.2.1 → 114.0.0

package/es/components/form/file_picker/file_picker.js

@@ -1,4 +1,4 @@
-var _excluded = ["stylesMemoizer", "id", "name", "initialPromptText", "className", "disabled", "compressed", "onChange", "isInvalid", "fullWidth", "isLoading", "display"];
+var _excluded = ["stylesMemoizer", "id", "name", "initialPromptText", "className", "disabled", "compressed", "onChange", "isInvalid", "fullWidth", "isLoading", "display", "files"];
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
@@ -52,36 +52,41 @@ export var EuiFilePickerClass = /*#__PURE__*/function (_Component) {
       args[_key] = arguments[_key];
     }
     _this = _callSuper(this, EuiFilePickerClass, [].concat(args));
+    _defineProperty(_this, "fileInput", null);
+    _defineProperty(_this, "generatedId", htmlIdGenerator()());
+    _defineProperty(_this, "getPromptTextFromFileList", function (files) {
+      if (!files || files.length === 0) {
+        return null;
+      }
+      if (files.length > 1) {
+        return ___EmotionJSX(EuiI18n, {
+          token: "euiFilePicker.filesSelected",
+          default: "{fileCount} files selected",
+          values: {
+            fileCount: files.length
+          }
+        });
+      }
+      return files[0].name;
+    });
     _defineProperty(_this, "state", {
-      promptText: null,
+      promptText: _this.props.files ? _this.getPromptTextFromFileList(_this.props.files) : null,
       isHoveringDrop: false
     });
-    _defineProperty(_this, "fileInput", null);
-    _defineProperty(_this, "generatedId", htmlIdGenerator()());
     _defineProperty(_this, "handleChange", function () {
       if (!_this.fileInput) return;
-      if (_this.fileInput.files && _this.fileInput.files.length > 1) {
+      if (_this.fileInput.files && _this.fileInput.files.length === 1) {
         _this.setState({
-          promptText: ___EmotionJSX(EuiI18n, {
-            token: "euiFilePicker.filesSelected",
-            default: "{fileCount} files selected",
-            values: {
-              fileCount: _this.fileInput.files.length
-            }
-          })
-        });
-      } else if (_this.fileInput.files && _this.fileInput.files.length === 0) {
-        _this.setState({
-          promptText: null
+          promptText: _this.fileInput.value.split('\\').pop()
         });
       } else {
         _this.setState({
-          promptText: _this.fileInput.value.split('\\').pop()
+          promptText: _this.getPromptTextFromFileList(_this.fileInput.files ? Array.from(_this.fileInput.files) : null)
         });
       }
       var onChange = _this.props.onChange;
       if (onChange) {
-        onChange(_this.fileInput.files);
+        onChange(_this.fileInput.files && _this.fileInput.files.length > 0 ? _this.fileInput.files : null);
       }
     });
     _defineProperty(_this, "removeFiles", function (e) {
@@ -109,6 +114,17 @@ export var EuiFilePickerClass = /*#__PURE__*/function (_Component) {
   }
   _inherits(EuiFilePickerClass, _Component);
   return _createClass(EuiFilePickerClass, [{
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      // Update prompt text when files prop changes
+      if (this.props.files !== prevProps.files) {
+        var _this$props$files;
+        this.setState({
+          promptText: this.getPromptTextFromFileList((_this$props$files = this.props.files) !== null && _this$props$files !== void 0 ? _this$props$files : null)
+        });
+      }
+    }
+  }, {
     key: "render",
     value: function render() {
       var _this2 = this;
@@ -132,6 +148,7 @@ export var EuiFilePickerClass = /*#__PURE__*/function (_Component) {
           fullWidth = _this2$props$fullWidt === void 0 ? defaultFullWidth : _this2$props$fullWidt,
           isLoading = _this2$props.isLoading,
           display = _this2$props.display,
+          files = _this2$props.files,
           rest = _objectWithoutProperties(_this2$props, _excluded);
         var promptId = "".concat(id || _this2.generatedId, "-filePicker__prompt");
         var isOverridingInitialPrompt = _this2.state.promptText != null;
@@ -246,6 +263,17 @@ EuiFilePickerClass.propTypes = {
      * Use as a callback to access the HTML FileList API
      */
   onChange: PropTypes.func,
+  /**
+     * Optionally pass a `File[]` array to maintain the file picker's displayed
+     * state between re-renders. Useful for multi-step forms where the component
+     * may unmount and remount while the file data is still stored in context.
+     *
+     * Note: Due to browser security restrictions, the actual file input
+     * cannot be programmatically set with files. This prop only controls
+     * the displayed state (file names in the prompt). The actual file data
+     * should be stored and managed separately in your application state.
+     */
+  files: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.any.isRequired).isRequired, PropTypes.oneOf([null])]),
   /**
      * Reduces the size to a typical (compressed) input
      * @default false

package/es/components/markdown_editor/plugins/markdown_default_plugins/parsing_plugins.js

@@ -24,6 +24,7 @@ import markdown from 'remark-parse-no-trim';
 import emoji from 'remark-emoji';
 import breaks from 'remark-breaks';
 import highlight from '../remark/remark_prismjs';
+import intrawordUnderscore from '../remark/remark_intraword_underscore';
 import * as MarkdownTooltip from '../markdown_tooltip';
 import * as MarkdownCheckbox from '../markdown_checkbox';
 import { euiMarkdownLinkValidator, DEFAULT_OPTIONS as LINK_VALIDATOR_DEFAULTS } from '../markdown_link_validator';
@@ -40,7 +41,7 @@ export var getDefaultEuiMarkdownParsingPlugins = function getDefaultEuiMarkdownP
   var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var exclude = _ref.exclude,
     parsingConfig = _objectWithoutProperties(_ref, _excluded);
-  var parsingPlugins = [[markdown, {}], [highlight, {}]];
+  var parsingPlugins = [[markdown, {}], [highlight, {}], [intrawordUnderscore, {}]];
   Object.entries(DEFAULT_PARSING_PLUGINS).forEach(function (_ref2) {
     var _ref3 = _slicedToArray(_ref2, 2),
       pluginName = _ref3[0],

package/es/components/markdown_editor/plugins/remark/remark_intraword_underscore.js

@@ -0,0 +1,172 @@
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+// Temporary workaround for https://github.com/elastic/eui/issues/9404
+// remark-parse v8 doesn't implement the CommonMark rule that underscore
+// emphasis delimiters flanked by alphanumerics on both sides (intraword)
+// cannot open or close emphasis. This causes identifiers like
+// `ABCD__PineappleCherry__e` to render with bold formatting.
+// This plugin walks the parsed AST and reverses incorrectly applied
+// emphasis/strong nodes when both sides are alphanumeric characters.
+
+// eslint-disable-next-line import/no-unresolved
+
+var isTextNode = function isTextNode(node) {
+  return node.type === 'text';
+};
+var isEmphasisOrStrong = function isEmphasisOrStrong(node) {
+  return node.type === 'emphasis' || node.type === 'strong';
+};
+var isAlphanumeric = function isAlphanumeric(ch) {
+  return /[a-zA-Z0-9]/.test(ch);
+};
+
+/**
+ * Recursively converts an emphasis/strong node back into plain text
+ * with underscore delimiters restored.
+ */
+function flattenToText(node) {
+  var delimiter = node.type === 'emphasis' ? '_' : '__';
+  var inner = '';
+  var _iterator = _createForOfIteratorHelper(node.children),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var child = _step.value;
+      if (isTextNode(child)) {
+        inner += child.value;
+      } else if (isEmphasisOrStrong(child)) {
+        inner += flattenToText(child);
+      } else {
+        // Contains non-text children (links, images, etc.) — leave emphasis intact
+        return delimiter + collectText(node) + delimiter;
+      }
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+  return delimiter + inner + delimiter;
+}
+function collectText(node) {
+  if (isTextNode(node)) return node.value;
+  if ('children' in node) {
+    return node.children.map(collectText).join('');
+  }
+  return '';
+}
+function processParent(parent, source) {
+  var modified = false;
+  var i = 0;
+  while (i < parent.children.length) {
+    var child = parent.children[i];
+    if (isEmphasisOrStrong(child) && isIntraword(parent, i, source)) {
+      var textValue = flattenToText(child);
+      var replacement = {
+        type: 'text',
+        value: textValue
+      };
+      parent.children.splice(i, 1, replacement);
+      modified = true;
+      // Don't advance — the replaced node may need to merge with neighbors
+    } else {
+      if ('children' in child) {
+        processParent(child, source);
+      }
+      i++;
+    }
+    if (modified) {
+      mergeAdjacentText(parent);
+      modified = false;
+      // After merging, restart scan since indices shifted
+      i = 0;
+    }
+  }
+}
+function getInnerText(node) {
+  if (isTextNode(node)) return node.value;
+  if ('children' in node) {
+    var children = node.children;
+    if (children.length > 0) return getInnerText(children[0]);
+  }
+  return '';
+}
+function getInnerTextEnd(node) {
+  if (isTextNode(node)) return node.value;
+  if ('children' in node) {
+    var children = node.children;
+    if (children.length > 0) return getInnerTextEnd(children[children.length - 1]);
+  }
+  return '';
+}
+
+/**
+ * Checks whether the emphasis/strong node at `index` within `parent`
+ * is an intraword usage of underscore delimiters.
+ *
+ * A node is intraword when at least one side has an alphanumeric text
+ * neighbor AND the inner content on the corresponding delimiter side
+ * also touches word characters — proving the underscores are embedded
+ * in a word rather than used as formatting.
+ */
+function isIntraword(parent, index, source) {
+  var _node$position;
+  var node = parent.children[index];
+
+  // Verify the delimiter is `_` (not `*`) by inspecting the source
+  if (((_node$position = node.position) === null || _node$position === void 0 || (_node$position = _node$position.start) === null || _node$position === void 0 ? void 0 : _node$position.offset) != null) {
+    var ch = source[node.position.start.offset];
+    if (ch !== '_') return false;
+  }
+  var prev = index > 0 ? parent.children[index - 1] : null;
+  var next = index < parent.children.length - 1 ? parent.children[index + 1] : null;
+  var prevChar = prev != null && isTextNode(prev) && prev.value.length > 0 ? prev.value[prev.value.length - 1] : null;
+  var nextChar = next != null && isTextNode(next) && next.value.length > 0 ? next.value[0] : null;
+  var prevIsAlpha = prevChar != null && isAlphanumeric(prevChar);
+  var nextIsAlpha = nextChar != null && isAlphanumeric(nextChar);
+
+  // Both sides flanked by alphanumeric — classic intraword (e.g. `foo__bar__baz`)
+  if (prevIsAlpha && nextIsAlpha) return true;
+
+  // One-sided: prev is alpha or underscore, no alpha next — check inner text
+  // starts with alpha (e.g. `Lorem__ipsum__` or `Lorem__ipsum_`)
+  if (prevIsAlpha || prevChar === '_') {
+    var inner = getInnerText(node);
+    if (inner.length > 0 && isAlphanumeric(inner[0])) return true;
+  }
+
+  // One-sided: next is alpha or underscore, no alpha prev — check inner text
+  // ends with alpha (e.g. `__Lorem__ipsum` or `_Lorem__ipsum`)
+  if (nextIsAlpha || nextChar === '_') {
+    var _inner = getInnerTextEnd(node);
+    if (_inner.length > 0 && isAlphanumeric(_inner[_inner.length - 1])) return true;
+  }
+  return false;
+}
+function mergeAdjacentText(parent) {
+  var i = 0;
+  while (i < parent.children.length - 1) {
+    if (isTextNode(parent.children[i]) && isTextNode(parent.children[i + 1])) {
+      parent.children[i].value += parent.children[i + 1].value;
+      parent.children.splice(i + 1, 1);
+    } else {
+      i++;
+    }
+  }
+}
+var attacher = function remarkIntrawordUnderscore() {
+  return function (tree, file) {
+    var source = String(file);
+    processParent(tree, source);
+  };
+};
+export default attacher;

package/es/components/overlay_mask/overlay_mask.js

@@ -1,4 +1,4 @@
-var _excluded = ["className", "children", "headerZindexLocation", "maskRef"];
+var _excluded = ["className", "children", "headerZindexLocation", "maskRef", "hasAnimation"];
 function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
@@ -35,6 +35,8 @@ export var EuiOverlayMask = function EuiOverlayMask(_ref) {
     _ref$headerZindexLoca = _ref.headerZindexLocation,
     headerZindexLocation = _ref$headerZindexLoca === void 0 ? 'above' : _ref$headerZindexLoca,
     maskRef = _ref.maskRef,
+    _ref$hasAnimation = _ref.hasAnimation,
+    hasAnimation = _ref$hasAnimation === void 0 ? true : _ref$hasAnimation,
     rest = _objectWithoutProperties(_ref, _excluded);
   var hasRendered = useRef(false);
   var _useState = useState(null),
@@ -46,7 +48,7 @@ export var EuiOverlayMask = function EuiOverlayMask(_ref) {
     hasRendered.current = true;
   }, []);
   var styles = useEuiMemoizedStyles(euiOverlayMaskStyles);
-  var cssStyles = cx([styles.euiOverlayMask, styles["".concat(headerZindexLocation, "Header")], hasRendered.current && styles.noAnimation]);
+  var cssStyles = cx([styles.euiOverlayMask, styles["".concat(headerZindexLocation, "Header")], (hasRendered.current || !hasAnimation) && styles.noAnimation]);
   useEffect(function () {
     if (!overlayMaskNode) return;
     keysOf(rest).forEach(function (key) {
@@ -105,5 +107,10 @@ EuiOverlayMask.propTypes = {
   /**
      * React ref to be passed to the wrapping container
      */
-  maskRef: PropTypes.oneOfType([PropTypes.any.isRequired, PropTypes.any.isRequired])
+  maskRef: PropTypes.oneOfType([PropTypes.any.isRequired, PropTypes.any.isRequired]),
+  /**
+     * If enabled, the mask will have a fade in animation.
+     * @default true
+     */
+  hasAnimation: PropTypes.bool
 };

package/es/components/tree_view/tree_view_item.styles.js

@@ -26,7 +26,7 @@ export var euiTreeViewItemStyles = function euiTreeViewItemStyles(euiThemeContex
       euiTreeView__node: _ref,
       default: /*#__PURE__*/css(logicalCSS('max-height', defaultSize), " line-height:", defaultSize, ";;label:default;"),
       compressed: /*#__PURE__*/css(logicalCSS('max-height', compressedSize), " line-height:", compressedSize, ";;label:compressed;"),
-      expanded: /*#__PURE__*/css(logicalCSS('max-height', '100vh'), ";;label:expanded;")
+      expanded: /*#__PURE__*/css(logicalCSS('max-height', 'none'), ";;label:expanded;")
     },
     button: {
       euiTreeView__nodeInner: /*#__PURE__*/css(logicalCSS('width', '100%'), " ", logicalCSS('padding-left', euiTheme.size.s), " ", logicalCSS('padding-right', euiTheme.size.xxs), " display:flex;align-items:center;&:focus{", euiFocusRing(euiThemeContext, 'inset'), ";}&:hover,&:active,&:focus{background-color:", euiTheme.components.treeViewItemBackgroundHover, ";};label:euiTreeView__nodeInner;"),

package/es/services/hooks/index.js

@@ -6,12 +6,12 @@
  * Side Public License, v 1.
  */
 
-export * from './useDependentState';
-export * from './useCombinedRefs';
-export * from './useForceRender';
-export * from './useLatest';
-export * from './useDeepEqual';
-export * from './useMouseMove';
-export * from './useIsPointerDown';
-export * from './useUpdateEffect';
+export { useDependentState } from './useDependentState';
+export { useCombinedRefs, setMultipleRefs } from './useCombinedRefs';
+export { useForceRender } from './useForceRender';
+export { useLatest } from './useLatest';
+export { useDeepEqual } from './useDeepEqual';
+export { isMouseEvent, useMouseMove } from './useMouseMove';
+export { useIsPointerDown } from './useIsPointerDown';
+export { useUpdateEffect } from './useUpdateEffect';
 export { useEuiDisabledElement } from './useEuiDisabledElement';

package/es/services/hooks/useIsPointerDown.js

@@ -1,9 +1,3 @@
-function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
  * or more contributor license agreements. Licensed under the Elastic License
@@ -12,30 +6,27 @@ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
  * Side Public License, v 1.
  */
 
-import { useState, useEffect } from 'react';
+import { useRef, useEffect } from 'react';
 
 /**
  * A hook that tracks whether the pointer is currently down/pressed.
  * Useful for detecting text selection in progress.
  */
 export function useIsPointerDown(container) {
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    isPointerDown = _useState2[0],
-    setIsPointerDown = _useState2[1];
+  var isPointerDownRef = useRef(false);
   useEffect(function () {
     var handlePointerDown = function handlePointerDown(event) {
       if (container !== null && container !== void 0 && container.current && !container.current.contains(event.target)) {
         return;
       }
-      setIsPointerDown(true);
+      isPointerDownRef.current = true;
     };
     var handlePointerUpOrCancel = function handlePointerUpOrCancel() {
-      setIsPointerDown(false);
+      isPointerDownRef.current = false;
     };
     var handleVisibilityChange = function handleVisibilityChange() {
       if (document.visibilityState === 'hidden') {
-        setIsPointerDown(false);
+        isPointerDownRef.current = false;
       }
     };
     var controller = new AbortController();
@@ -53,5 +44,5 @@ export function useIsPointerDown(container) {
       controller.abort();
     };
   }, [container]);
-  return isPointerDown;
+  return isPointerDownRef;
 }

package/es/services/index.js

@@ -22,7 +22,7 @@ export * from './emotion';
 export * from './findElement';
 export { focusTrapPubSub } from './focus_trap';
 export { dateFormatAliases, formatAuto, formatBoolean, formatDate, formatNumber, formatText } from './format';
-export * from './hooks';
+export { useDependentState, useCombinedRefs, setMultipleRefs, useForceRender, useLatest, useDeepEqual, isMouseEvent, useMouseMove, useUpdateEffect, useEuiDisabledElement } from './hooks';
 export { isEvenlyDivisibleBy, isWithinRange } from './number';
 export { Pager } from './paging';
 export { calculatePopoverPosition, findPopoverPosition } from './popover';