@elastic/eui 118.0.0 → 119.0.0

package/optimize/es/components/expression/expression.js

@@ -19,6 +19,9 @@ import { EuiIcon } from '../icon';
 import { euiExpressionStyles, euiExpressionDescriptionStyles, euiExpressionValueStyles as valueStyles, euiExpressionIconStyles } from './expression.styles';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export var COLORS = ['subdued', 'primary', 'success', 'accent', 'warning', 'danger'];
+/**
+ * @see {@link https://eui.elastic.co/docs/components/forms/search-and-filter/expression/|EuiExpression documentation}
+ */
 export var EuiExpression = function EuiExpression(_ref) {
   var className = _ref.className,
     description = _ref.description,

package/optimize/es/components/facet/facet_button.js

@@ -21,6 +21,9 @@ import { useEuiMemoizedStyles, cloneElementWithCss } from '../../services';
 import { euiFacetButtonStyles, euiFacetButtonTextStyles, euiFacetButton__disabled } from './facet_button.styles';
 import { EuiButtonDisplay, isButtonDisabled } from '../button/button_display/_button_display';
 import { jsx as ___EmotionJSX } from "@emotion/react";
+/**
+ * @see {@link https://eui.elastic.co/docs/components/navigation/facet/|EuiFacetButton documentation}
+ */
 export var EuiFacetButton = function EuiFacetButton(_ref) {
   var children = _ref.children,
     className = _ref.className,

package/optimize/es/components/filter_group/filter_group.js

@@ -14,6 +14,9 @@ import classNames from 'classnames';
 import { useEuiMemoizedStyles } from '../../services';
 import { euiFilterGroupStyles } from './filter_group.styles';
 import { jsx as ___EmotionJSX } from "@emotion/react";
+/**
+ * @see {@link https://eui.elastic.co/docs/components/navigation/buttons/filter-group/|EuiFilterGroup documentation}
+ */
 export var EuiFilterGroup = function EuiFilterGroup(_ref) {
   var children = _ref.children,
     className = _ref.className,

package/optimize/es/components/flex/flex_grid.js

@@ -20,6 +20,9 @@ import { jsx as ___EmotionJSX } from "@emotion/react";
 export var DIRECTIONS = ['row', 'column'];
 export var ALIGN_ITEMS = ['stretch', 'start', 'end', 'center', 'baseline'];
 export var GUTTER_SIZES = ['none', 's', 'm', 'l', 'xl'];
+/**
+ * @see {@link https://eui.elastic.co/docs/components/layout/flex/grid/|EuiFlexGrid documentation}
+ */
 export var EuiFlexGrid = function EuiFlexGrid(_ref) {
   var children = _ref.children,
     className = _ref.className,

package/optimize/es/components/flex/flex_group.js

@@ -53,5 +53,8 @@ var EuiFlexGroupInternal = function EuiFlexGroupInternal(_ref, ref) {
 
 // Cast forwardRef return type to work with the generic TComponent type
 // and not fallback to implicit any typing
+/**
+ * @see {@link https://eui.elastic.co/docs/components/layout/flex/|EuiFlexGroup documentation}
+ */
 export var EuiFlexGroup = /*#__PURE__*/forwardRef(EuiFlexGroupInternal);
 EuiFlexGroup.displayName = 'EuiFlexGroup';

package/optimize/es/components/flex/flex_item.js

@@ -46,5 +46,8 @@ var EuiFlexItemInternal = function EuiFlexItemInternal(_ref, ref) {
 
 // Cast forwardRef return type to work with the generic TComponent type
 // and not fallback to implicit any typing
+/**
+ * @see {@link https://eui.elastic.co/docs/components/layout/flex/item/|EuiFlexItem documentation}
+ */
 export var EuiFlexItem = /*#__PURE__*/forwardRef(EuiFlexItemInternal);
 EuiFlexItem.displayName = 'EuiFlexItem';

package/optimize/es/components/flyout/const.js

@@ -20,12 +20,17 @@ export var FLYOUT_SIZES = ['s', 'm', 'l', 'fill'];
 
 /** Menu display mode: always render menu when flyoutMenuProps is provided. */
 export var MENU_DISPLAY_ALWAYS = 'always';
-/** Menu display mode: only render menu when it has content (back button, history, title, or custom actions). */
+/** Menu display mode: only render menu when it has content (back button, history, title, or actions). */
 export var MENU_DISPLAY_AUTO = 'auto';
 /** Allowed flyout menu display modes. */
 export var FLYOUT_MENU_DISPLAY_MODES = [MENU_DISPLAY_ALWAYS, MENU_DISPLAY_AUTO];
 /** Type representing a supported flyout menu display mode. */
 
+/**
+ * Minimum number of history items required to render the flyout menu's history popover.
+ */
+export var MIN_HISTORY_ITEMS = 2;
+
 /** Allowed padding sizes for flyout content. */
 export var FLYOUT_PADDING_SIZES = ['none', 's', 'm', 'l'];
 /** Type representing a supported flyout padding size. */

package/optimize/es/components/flyout/flyout_menu/action_button.js

@@ -0,0 +1,32 @@
+import _extends from "@babel/runtime/helpers/extends";
+/*
+ * 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.
+ */
+
+import React from 'react';
+import { EuiButtonIcon } from '../../button';
+import { EuiToolTip } from '../../tool_tip';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var MenuActionButton = function MenuActionButton(_ref) {
+  var action = _ref.action;
+  var iconType = action.iconType,
+    onClick = action.onClick,
+    ariaLabel = action['aria-label'],
+    toolTipContent = action.toolTipContent,
+    toolTipProps = action.toolTipProps;
+  var sharedProps = {
+    'aria-label': ariaLabel,
+    iconType: iconType,
+    onClick: onClick,
+    color: 'text',
+    size: 'xs'
+  };
+  return toolTipContent ? ___EmotionJSX(EuiToolTip, _extends({
+    content: toolTipContent,
+    disableScreenReaderOutput: true
+  }, toolTipProps), ___EmotionJSX(EuiButtonIcon, sharedProps)) : ___EmotionJSX(EuiButtonIcon, sharedProps);
+};

package/optimize/es/components/flyout/flyout_menu/back_button.js

@@ -0,0 +1,28 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["label"];
+/*
+ * 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.
+ */
+
+import React from 'react';
+import { EuiButtonEmpty } from '../../button';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+/**
+ * `label` is resolved by `EuiFlyoutMenu`, which owns the `euiFlyoutMenu.*`
+ * i18n token namespace.
+ */
+export var BackButton = function BackButton(_ref) {
+  var label = _ref.label,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return ___EmotionJSX(EuiButtonEmpty, _extends({
+    size: "xs",
+    color: "text",
+    iconType: "undo",
+    "data-test-subj": "euiFlyoutMenuBackButton"
+  }, rest), label);
+};

package/optimize/es/components/flyout/flyout_menu/close_spacer.js

@@ -0,0 +1,29 @@
+/*
+ * 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.
+ */
+
+import React from 'react';
+import { useEuiMemoizedStyles } from '../../../services';
+import { EuiFlexItem } from '../../flex';
+import { euiFlyoutMenuStyles } from './flyout_menu.styles';
+
+/**
+ * Spacer that gives trailing actions room around the absolutely-positioned
+ * close button. When `showDivider` is true, it doubles as the visual divider
+ * between trailing actions and the close button.
+ */
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var CloseButtonSpacer = function CloseButtonSpacer(_ref) {
+  var showDivider = _ref.showDivider;
+  var styles = useEuiMemoizedStyles(euiFlyoutMenuStyles);
+  return ___EmotionJSX(EuiFlexItem, {
+    grow: false,
+    css: [styles.euiFlyoutMenu__spacer, showDivider && styles.euiFlyoutMenu__divider, ";label:CloseButtonSpacer;"],
+    className: showDivider ? 'euiFlyoutMenu__divider' : undefined,
+    "aria-hidden": showDivider ? 'true' : undefined
+  });
+};

package/optimize/es/components/flyout/flyout_menu/divider.js

@@ -0,0 +1,22 @@
+/*
+ * 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.
+ */
+
+import React from 'react';
+import { useEuiMemoizedStyles } from '../../../services';
+import { EuiFlexItem } from '../../flex';
+import { euiFlyoutMenuStyles } from './flyout_menu.styles';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var MenuDivider = function MenuDivider() {
+  var styles = useEuiMemoizedStyles(euiFlyoutMenuStyles);
+  return ___EmotionJSX(EuiFlexItem, {
+    grow: false,
+    css: styles.euiFlyoutMenu__divider,
+    "aria-hidden": "true",
+    className: "euiFlyoutMenu__divider"
+  });
+};

package/optimize/es/components/flyout/flyout_menu/flyout_menu.js

@@ -0,0 +1,151 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["className", "title", "titleId", "hideTitle", "hideCloseButton", "historyItems", "showBackButton", "backButtonProps", "leadingActions", "trailingActions", "customActions", "iconType", "pagination"];
+/*
+ * 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.
+ */
+
+import classNames from 'classnames';
+import React, { useContext } from 'react';
+import { useEuiMemoizedStyles } from '../../../services';
+import { EuiFlexGroup, EuiFlexItem } from '../../flex';
+import { useEuiI18n } from '../../i18n';
+import { EuiTitle } from '../../title';
+import { EuiFlyoutCloseButton } from '../_flyout_close_button';
+import { MIN_HISTORY_ITEMS } from '../const';
+import { EuiFlyoutMenuContext } from '../flyout_menu_context';
+import { euiFlyoutMenuStyles } from './flyout_menu.styles';
+import { BackButton } from './back_button';
+import { CloseButtonSpacer } from './close_spacer';
+import { HistoryPopover } from './history_popover';
+import { MenuActionButton } from './action_button';
+import { MenuDivider } from './divider';
+import { PaginationControls } from './pagination';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+/**
+ * The component for the top menu bar inside a flyout. Since this is a private
+ * component, rendering is controlled using the `flyoutMenuProps` prop on
+ * `EuiFlyout`. In managed session flyouts, the Flyout Manager controls a back
+ * button and history popover for navigating to different flyout sessions
+ * within the managed context.
+ *
+ * @private
+ */
+export var EuiFlyoutMenu = function EuiFlyoutMenu(_ref) {
+  var _pagination$currentIn, _pagination$total;
+  var className = _ref.className,
+    title = _ref.title,
+    titleId = _ref.titleId,
+    _ref$hideTitle = _ref.hideTitle,
+    hideTitle = _ref$hideTitle === void 0 ? true : _ref$hideTitle,
+    hideCloseButton = _ref.hideCloseButton,
+    _ref$historyItems = _ref.historyItems,
+    historyItems = _ref$historyItems === void 0 ? [] : _ref$historyItems,
+    showBackButton = _ref.showBackButton,
+    backButtonProps = _ref.backButtonProps,
+    _ref$leadingActions = _ref.leadingActions,
+    leadingActions = _ref$leadingActions === void 0 ? [] : _ref$leadingActions,
+    trailingActions = _ref.trailingActions,
+    customActions = _ref.customActions,
+    _iconType = _ref.iconType,
+    pagination = _ref.pagination,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _useContext = useContext(EuiFlyoutMenuContext),
+    onClose = _useContext.onClose;
+  var styles = useEuiMemoizedStyles(euiFlyoutMenuStyles);
+  var classes = classNames('euiFlyoutMenu', className);
+  var showPaginationControls = pagination != null && pagination.total >= 1;
+  var hasBackButton = !showPaginationControls && !!showBackButton;
+  var hasHistory = !showPaginationControls && historyItems.length >= MIN_HISTORY_ITEMS;
+
+  // `trailingActions` takes precedence over the deprecated `customActions` alias
+  var effectiveTrailingActions = trailingActions !== undefined ? trailingActions : customActions !== null && customActions !== void 0 ? customActions : [];
+  var hasBuiltInLeadingContent = showPaginationControls || hasBackButton || hasHistory;
+  var showBackHistoryDivider = hasBackButton && hasHistory;
+  var showLeadingBoundaryDivider = hasBuiltInLeadingContent && leadingActions.length > 0;
+  var showTrailingCloseDivider = effectiveTrailingActions.length > 0 && !hideCloseButton;
+
+  // Sub-components are presentational, so all `euiFlyoutMenu.*` tokens are
+  // resolved here, in the file that owns the namespace
+  var backButtonLabel = useEuiI18n('euiFlyoutMenu.back', 'Back');
+  var historyLabel = useEuiI18n('euiFlyoutMenu.history', 'History');
+  var recentlyVisitedLabel = useEuiI18n('euiFlyoutMenu.history.tooltip', 'Recently visited');
+  var paginationLabels = {
+    first: useEuiI18n('euiFlyoutMenu.pagination.first', 'First'),
+    previous: useEuiI18n('euiFlyoutMenu.pagination.previous', 'Previous'),
+    next: useEuiI18n('euiFlyoutMenu.pagination.next', 'Next'),
+    last: useEuiI18n('euiFlyoutMenu.pagination.last', 'Last'),
+    counter: useEuiI18n('euiFlyoutMenu.pagination.counter', '{position} of {total}', {
+      position: ((_pagination$currentIn = pagination === null || pagination === void 0 ? void 0 : pagination.currentIndex) !== null && _pagination$currentIn !== void 0 ? _pagination$currentIn : 0) + 1,
+      total: (_pagination$total = pagination === null || pagination === void 0 ? void 0 : pagination.total) !== null && _pagination$total !== void 0 ? _pagination$total : 0
+    })
+  };
+  var titleNode;
+  if (title) {
+    titleNode = ___EmotionJSX(EuiTitle, {
+      size: "xxs",
+      id: titleId
+    }, ___EmotionJSX("h3", {
+      css: hideTitle && styles.euiFlyoutMenu__hiddenTitle
+    }, title));
+  }
+  var handleClose = function handleClose(event) {
+    onClose === null || onClose === void 0 || onClose(event, {
+      reason: 'close-button'
+    });
+  };
+  return ___EmotionJSX("div", _extends({
+    className: classes,
+    css: styles.euiFlyoutMenu__container,
+    "data-test-subj": "euiFlyoutMenu"
+  }, rest), ___EmotionJSX(EuiFlexGroup, {
+    alignItems: "center",
+    justifyContent: "spaceBetween",
+    gutterSize: "none",
+    responsive: false,
+    css: styles.euiFlyoutMenu__controls
+  }, showPaginationControls ? ___EmotionJSX(PaginationControls, {
+    pagination: pagination,
+    labels: paginationLabels
+  }) : ___EmotionJSX(React.Fragment, null, hasBackButton && ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, ___EmotionJSX(BackButton, _extends({
+    label: backButtonLabel
+  }, backButtonProps))), showBackHistoryDivider && ___EmotionJSX(MenuDivider, null), hasHistory && ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, ___EmotionJSX(HistoryPopover, {
+    items: historyItems,
+    historyLabel: historyLabel,
+    recentlyVisitedLabel: recentlyVisitedLabel
+  }))), showLeadingBoundaryDivider && ___EmotionJSX(MenuDivider, null), leadingActions.map(function (action, actionIndex) {
+    return ___EmotionJSX(EuiFlexItem, {
+      key: "leading-action-".concat(actionIndex),
+      grow: false,
+      css: styles.euiFlyoutMenu__actions
+    }, ___EmotionJSX(MenuActionButton, {
+      action: action
+    }));
+  }), titleNode && ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, titleNode), ___EmotionJSX(EuiFlexItem, {
+    grow: true
+  }), effectiveTrailingActions.map(function (action, actionIndex) {
+    return ___EmotionJSX(EuiFlexItem, {
+      key: "trailing-action-".concat(actionIndex),
+      grow: false,
+      css: styles.euiFlyoutMenu__actions
+    }, ___EmotionJSX(MenuActionButton, {
+      action: action
+    }));
+  }), !hideCloseButton && ___EmotionJSX(CloseButtonSpacer, {
+    showDivider: showTrailingCloseDivider
+  })), !hideCloseButton && ___EmotionJSX(EuiFlyoutCloseButton, {
+    onClose: handleClose,
+    side: "right",
+    closeButtonPosition: "inside"
+  }));
+};

package/optimize/es/components/flyout/flyout_menu/flyout_menu.styles.js

@@ -0,0 +1,38 @@
+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)."; }
+/*
+ * 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.
+ */
+
+import { css } from '@emotion/react';
+import { highContrastModeStyles } from '../../../global_styling';
+import { euiScreenReaderOnly } from '../../accessibility';
+var _ref = process.env.NODE_ENV === "production" ? {
+  name: "1kqtial-euiFlyoutMenu__actions",
+  styles: "align-self:center;label:euiFlyoutMenu__actions;"
+} : {
+  name: "1kqtial-euiFlyoutMenu__actions",
+  styles: "align-self:center;label:euiFlyoutMenu__actions;",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+export var euiFlyoutMenuStyles = function euiFlyoutMenuStyles(euiThemeContext) {
+  var euiTheme = euiThemeContext.euiTheme;
+  return {
+    euiFlyoutMenu__container: /*#__PURE__*/css("block-size:calc(", euiTheme.size.m, " * 3.5);flex-shrink:0;padding-block:", euiTheme.size.s, ";padding-inline:", euiTheme.size.s, ";border-block-end:", euiTheme.border.width.thin, " solid ", euiTheme.border.color, ";.euiTitle{padding-inline:", euiTheme.size.s, ";};label:euiFlyoutMenu__container;"),
+    // Full height in high contrast mode so dividers can bleed to the container edges.
+    euiFlyoutMenu__controls: /*#__PURE__*/css(highContrastModeStyles(euiThemeContext, {
+      preferred: 'block-size: 100%;'
+    }), ";;label:euiFlyoutMenu__controls;"),
+    euiFlyoutMenu__spacer: /*#__PURE__*/css("padding-inline:", euiTheme.size.m, ";;label:euiFlyoutMenu__spacer;"),
+    euiFlyoutMenu__actions: _ref,
+    euiFlyoutMenu__hiddenTitle: /*#__PURE__*/css(euiScreenReaderOnly(), ";;label:euiFlyoutMenu__hiddenTitle;"),
+    euiFlyoutMenu__paginationCounter: /*#__PURE__*/css("color:", euiTheme.colors.textSubdued, ";white-space:nowrap;;label:euiFlyoutMenu__paginationCounter;"),
+    // Border (not background) keeps the line visible in Windows high contrast themes.
+    euiFlyoutMenu__divider: /*#__PURE__*/css("align-self:center;inline-size:0;block-size:", euiTheme.size.l, ";margin-inline:", euiTheme.size.s, ";border-inline-start:", euiTheme.border.thin, ";pointer-events:none;", highContrastModeStyles(euiThemeContext, {
+      preferred: "\n          align-self: stretch;\n          block-size: auto;\n          margin-block: -".concat(euiTheme.size.s, ";\n        ")
+    }), ";;label:euiFlyoutMenu__divider;")
+  };
+};

package/optimize/es/components/flyout/flyout_menu/history_popover.js

@@ -0,0 +1,60 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+/*
+ * 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.
+ */
+
+import React, { useState } from 'react';
+import { EuiButtonIcon } from '../../button';
+import { EuiListGroup, EuiListGroupItem } from '../../list_group';
+import { EuiPopover } from '../../popover';
+import { EuiToolTip } from '../../tool_tip';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+/**
+ * Labels are resolved by `EuiFlyoutMenu`, which owns the `euiFlyoutMenu.*`
+ * i18n token namespace.
+ */
+export var HistoryPopover = function HistoryPopover(_ref) {
+  var items = _ref.items,
+    historyLabel = _ref.historyLabel,
+    recentlyVisitedLabel = _ref.recentlyVisitedLabel;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isPopoverOpen = _useState2[0],
+    setIsPopoverOpen = _useState2[1];
+  return ___EmotionJSX(EuiPopover, {
+    "aria-label": historyLabel,
+    button: ___EmotionJSX(EuiToolTip, {
+      content: recentlyVisitedLabel,
+      disableScreenReaderOutput: true
+    }, ___EmotionJSX(EuiButtonIcon, {
+      iconType: "clockCounter",
+      color: "text",
+      "aria-label": historyLabel,
+      "data-test-subj": "euiFlyoutMenuHistoryButton"
+    })),
+    isOpen: isPopoverOpen,
+    onClick: function onClick() {
+      return setIsPopoverOpen(!isPopoverOpen);
+    },
+    closePopover: function closePopover() {
+      return setIsPopoverOpen(false);
+    },
+    panelPaddingSize: "xs",
+    anchorPosition: "downLeft"
+  }, ___EmotionJSX(EuiListGroup, null, items.map(function (item, index) {
+    return ___EmotionJSX(EuiListGroupItem, {
+      key: "history-item-".concat(index),
+      label: item.title,
+      iconType: item.iconType,
+      onClick: function onClick() {
+        item.onClick();
+        setIsPopoverOpen(false);
+      },
+      "data-test-subj": "euiFlyoutMenuHistoryItem-".concat(index)
+    }, item.title);
+  })));
+};

package/optimize/es/components/flyout/flyout_menu/index.js

@@ -0,0 +1,9 @@
+/*
+ * 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.
+ */
+
+export { EuiFlyoutMenu } from './flyout_menu';

package/optimize/es/components/flyout/flyout_menu/pagination.js

@@ -0,0 +1,112 @@
+import _extends from "@babel/runtime/helpers/extends";
+/*
+ * 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.
+ */
+
+import React from 'react';
+import { useEuiMemoizedStyles } from '../../../services';
+import { EuiButtonIcon } from '../../button';
+import { EuiFlexGroup, EuiFlexItem } from '../../flex';
+import { EuiScreenReaderLive } from '../../accessibility';
+import { EuiText } from '../../text';
+import { EuiToolTip } from '../../tool_tip';
+import { euiFlyoutMenuStyles } from './flyout_menu.styles';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+var PaginationButton = function PaginationButton(_ref) {
+  var iconType = _ref.iconType,
+    label = _ref.label,
+    onClick = _ref.onClick,
+    isDisabled = _ref.isDisabled,
+    dataTestSubj = _ref.dataTestSubj;
+  var sharedProps = {
+    iconType: iconType,
+    color: 'text',
+    size: 'xs',
+    'aria-label': label,
+    onClick: onClick,
+    'data-test-subj': dataTestSubj
+  };
+  return isDisabled ? ___EmotionJSX(EuiButtonIcon, _extends({}, sharedProps, {
+    isDisabled: true
+  })) : ___EmotionJSX(EuiToolTip, {
+    content: label,
+    disableScreenReaderOutput: true
+  }, ___EmotionJSX(EuiButtonIcon, sharedProps));
+};
+/**
+ * `labels` are resolved by `EuiFlyoutMenu`, which owns the `euiFlyoutMenu.*`
+ * i18n token namespace.
+ */
+export var PaginationControls = function PaginationControls(_ref2) {
+  var pagination = _ref2.pagination,
+    labels = _ref2.labels;
+  var styles = useEuiMemoizedStyles(euiFlyoutMenuStyles);
+  var currentIndex = pagination.currentIndex,
+    total = pagination.total,
+    onPrevious = pagination.onPrevious,
+    onNext = pagination.onNext,
+    onFirst = pagination.onFirst,
+    onLast = pagination.onLast;
+
+  // Jump-to-first/last controls read as a horizontal track, so the Prev/Next
+  // chevrons follow that axis unless the consumer overrides them.
+  var hasJumpControls = onFirst != null || onLast != null;
+  var previousIconType = hasJumpControls ? 'chevronSingleLeft' : 'chevronSingleUp';
+  var nextIconType = hasJumpControls ? 'chevronSingleRight' : 'chevronSingleDown';
+  var firstLabel = labels.first,
+    prevLabel = labels.previous,
+    nextLabel = labels.next,
+    lastLabel = labels.last,
+    counterLabel = labels.counter;
+  var isAtStart = currentIndex === 0;
+  var isAtEnd = currentIndex === total - 1;
+  return ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, ___EmotionJSX(EuiFlexGroup, {
+    gutterSize: "xs",
+    alignItems: "center",
+    responsive: false
+  }, onFirst && ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, ___EmotionJSX(PaginationButton, {
+    iconType: "chevronLimitLeft",
+    label: firstLabel,
+    onClick: onFirst,
+    isDisabled: isAtStart,
+    dataTestSubj: "euiFlyoutMenuPaginationFirst"
+  })), ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, ___EmotionJSX(PaginationButton, {
+    iconType: previousIconType,
+    label: prevLabel,
+    onClick: onPrevious,
+    isDisabled: isAtStart,
+    dataTestSubj: "euiFlyoutMenuPaginationPrev"
+  })), ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, ___EmotionJSX(EuiText, {
+    size: "s",
+    css: styles.euiFlyoutMenu__paginationCounter,
+    "aria-hidden": "true"
+  }, counterLabel), ___EmotionJSX(EuiScreenReaderLive, null, counterLabel)), ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, ___EmotionJSX(PaginationButton, {
+    iconType: nextIconType,
+    label: nextLabel,
+    onClick: onNext,
+    isDisabled: isAtEnd,
+    dataTestSubj: "euiFlyoutMenuPaginationNext"
+  })), onLast && ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, ___EmotionJSX(PaginationButton, {
+    iconType: "chevronLimitRight",
+    label: lastLabel,
+    onClick: onLast,
+    isDisabled: isAtEnd,
+    dataTestSubj: "euiFlyoutMenuPaginationLast"
+  }))));
+};

package/optimize/es/components/flyout/flyout_menu/types.js

@@ -0,0 +1 @@
+export {};

package/optimize/es/components/flyout/manager/flyout_managed.js

@@ -285,7 +285,7 @@ export var EuiManagedFlyout = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     console.warn("flyout-pagination-dual-source-".concat(flyoutId), "[EuiFlyoutManager] flyout \"".concat(flyoutId, "\" has pagination set both via the store (setPagination) ") + 'and via flyoutMenuProps.pagination. The store value will be used. Remove one source to avoid confusion.');
   }
   var pagination = storePagination !== null && storePagination !== void 0 ? storePagination : propPagination;
-  var showPaginationControls = pagination != null && pagination.total > 1;
+  var showPaginationControls = pagination != null && pagination.total >= 1;
   var flyoutMenuProps = _objectSpread(_objectSpread({}, _flyoutMenuProps), {}, {
     historyItems: showPaginationControls ? [] : historyItems,
     showBackButton: showPaginationControls ? false : showBackButton,

package/optimize/es/components/flyout/use_flyout_menu.js

@@ -9,7 +9,7 @@ var _excluded = ["titleId"];
  */
 
 import { useGeneratedHtmlId } from '../../services';
-import { MENU_DISPLAY_ALWAYS, MENU_DISPLAY_AUTO } from './const';
+import { MENU_DISPLAY_ALWAYS, MENU_DISPLAY_AUTO, MIN_HISTORY_ITEMS } from './const';
 import { useMemo } from 'react';
 import classnames from 'classnames';
 
@@ -25,7 +25,7 @@ import classnames from 'classnames';
  * @internal
  */
 export var useEuiFlyoutMenu = function useEuiFlyoutMenu(_ref) {
-  var _flyoutMenuProps$hist, _flyoutMenuProps$hist2, _flyoutMenuProps$cust, _flyoutMenuProps$cust2;
+  var _flyoutMenuProps$hist, _flyoutMenuProps$hist2, _flyoutMenuProps$lead, _flyoutMenuProps$lead2, _effectiveTrailingAct;
   var _flyoutMenuProps = _ref.flyoutMenuProps,
     flyoutMenuDisplayMode = _ref.flyoutMenuDisplayMode,
     _ariaLabelledBy = _ref.ariaLabelledBy;
@@ -40,10 +40,12 @@ export var useEuiFlyoutMenu = function useEuiFlyoutMenu(_ref) {
   }, [hasMenu, _titleId, generatedMenuId]);
 
   // Determine if the menu has any content
-  // hasBackButton or hasHistory or hasCustomActions or hasVisibleTitle or hasPagination
-  var menuHasContent = hasMenu && (!!flyoutMenuProps.showBackButton || ((_flyoutMenuProps$hist = (_flyoutMenuProps$hist2 = flyoutMenuProps.historyItems) === null || _flyoutMenuProps$hist2 === void 0 ? void 0 : _flyoutMenuProps$hist2.length) !== null && _flyoutMenuProps$hist !== void 0 ? _flyoutMenuProps$hist : 0) > 0 || ((_flyoutMenuProps$cust = (_flyoutMenuProps$cust2 = flyoutMenuProps.customActions) === null || _flyoutMenuProps$cust2 === void 0 ? void 0 : _flyoutMenuProps$cust2.length) !== null && _flyoutMenuProps$cust !== void 0 ? _flyoutMenuProps$cust : 0) > 0 ||
+  // hasBackButton or hasHistory or hasLeadingActions or hasTrailingActions
+  // or hasCustomActions (deprecated alias) or hasVisibleTitle or hasPagination
+  var effectiveTrailingActions = flyoutMenuProps.trailingActions !== undefined ? flyoutMenuProps.trailingActions : flyoutMenuProps.customActions;
+  var menuHasContent = hasMenu && (!!flyoutMenuProps.showBackButton || ((_flyoutMenuProps$hist = (_flyoutMenuProps$hist2 = flyoutMenuProps.historyItems) === null || _flyoutMenuProps$hist2 === void 0 ? void 0 : _flyoutMenuProps$hist2.length) !== null && _flyoutMenuProps$hist !== void 0 ? _flyoutMenuProps$hist : 0) >= MIN_HISTORY_ITEMS || ((_flyoutMenuProps$lead = (_flyoutMenuProps$lead2 = flyoutMenuProps.leadingActions) === null || _flyoutMenuProps$lead2 === void 0 ? void 0 : _flyoutMenuProps$lead2.length) !== null && _flyoutMenuProps$lead !== void 0 ? _flyoutMenuProps$lead : 0) > 0 || ((_effectiveTrailingAct = effectiveTrailingActions === null || effectiveTrailingActions === void 0 ? void 0 : effectiveTrailingActions.length) !== null && _effectiveTrailingAct !== void 0 ? _effectiveTrailingAct : 0) > 0 ||
   // Component defaults to hiding the title, so only explicit false means the title will be visible
-  !!(flyoutMenuProps.title && flyoutMenuProps.hideTitle === false) || !!(flyoutMenuProps.pagination && flyoutMenuProps.pagination.total > 1));
+  !!(flyoutMenuProps.title && flyoutMenuProps.hideTitle === false) || !!(flyoutMenuProps.pagination && flyoutMenuProps.pagination.total >= 1));
 
   // Determine if the menu should be rendered based on the display mode and menu content
   var shouldRenderMenu = useMemo(function () {

package/optimize/es/components/form/checkbox/checkbox.js

@@ -15,6 +15,9 @@ import { useCombinedRefs, useEuiMemoizedStyles } from '../../../services';
 import { EuiCheckboxControl } from './checkbox_control';
 import { euiCheckboxStyles } from './checkbox.styles';
 import { jsx as ___EmotionJSX } from "@emotion/react";
+/**
+ * @see {@link https://eui.elastic.co/docs/components/forms/selection/checkbox-and-checkbox-group/|EuiCheckbox documentation}
+ */
 export var EuiCheckbox = function EuiCheckbox(_ref) {
   var className = _ref.className,
     id = _ref.id,

package/optimize/es/components/form/described_form_group/described_form_group.js

@@ -18,6 +18,9 @@ import { EuiFlexGroup, EuiFlexItem } from '../../flex';
 import { useFormContext } from '../eui_form_context';
 import { euiDescribedFormGroupStyles } from './described_form_group.styles';
 import { jsx as ___EmotionJSX } from "@emotion/react";
+/**
+ * @see {@link https://eui.elastic.co/docs/components/forms/layouts/described-groups/|EuiDescribedFormGroup documentation}
+ */
 export var EuiDescribedFormGroup = function EuiDescribedFormGroup(props) {
   var _useFormContext = useFormContext(),
     defaultFullWidth = _useFormContext.defaultFullWidth;