@splunk/dashboard-toolbar 29.2.0 → 29.3.0

package/buttons/index.js

@@ -88,6 +88,7 @@ __export(buttons_exports, {
   Config: () => Config_default,
   ContentExport: () => ContentExport_default,
   Data: () => Data_default,
+  Display: () => Display,
   EmptyVisualization: () => EmptyVisualization_default,
   ExportDashboardButton: () => ExportDashboardButton_default,
   Fullscreen: () => Fullscreen_default,
@@ -631,14 +632,106 @@ var Data = ({ dashboardApi }) => {
 };
 var Data_default = Data;
 
+// esm-externals:@splunk/react-icons/Checkmark
+var Checkmark_exports = {};
+__export(Checkmark_exports, {
+  default: () => Checkmark_default
+});
+var defaultImport19 = __toESM(require("@splunk/react-icons/Checkmark"));
+__reExport(Checkmark_exports, require("@splunk/react-icons/Checkmark"));
+var Checkmark_default = "default" in defaultImport19 ? defaultImport19.default : defaultImport19;
+
+// src/buttons/Display/Display.tsx
+var menuStyle = {
+  minWidth: "150px"
+};
+var CheckmarkPlaceholder = styled_components_default.span`
+    display: inline-block;
+    width: 16px;
+`;
+var Display = ({
+  appearance = "default",
+  dashboardApi
+}) => {
+  var _a;
+  const globalInputs = (0, dashboard_state_exports.useSelector)(dashboard_state_exports.selectGlobalInputs);
+  const hasGlobalInputs = ((_a = globalInputs == null ? void 0 : globalInputs.length) != null ? _a : 0) > 0;
+  const areInputsCollapsed = (0, dashboard_state_exports.useSelector)(dashboard_state_exports.selectAreGlobalItemsCollapsed);
+  const showInputs = !areInputsCollapsed;
+  const handleInputsToggle = (0, react_exports.useCallback)(() => {
+    dashboardApi == null ? void 0 : dashboardApi.setAreGlobalInputsCollapsed({
+      collapsed: !areInputsCollapsed
+    });
+  }, [dashboardApi, areInputsCollapsed]);
+  const { handleRequestClose, handleRequestOpen, isOpen } = useDropdown_default({
+    isContentClickClose: true
+  });
+  const buttonToggle = (0, react_exports.useMemo)(
+    () => /* @__PURE__ */ react_default.createElement(
+      Button_default,
+      {
+        "data-clickable": true,
+        "data-test": "display-dropdown-button",
+        appearance,
+        isMenu: true,
+        "aria-label": (0, i18n_exports._)("Display options")
+      },
+      (0, i18n_exports._)("Display")
+    ),
+    [appearance]
+  );
+  const checkmarkIcon = (0, react_exports.useMemo)(() => {
+    return showInputs ? /* @__PURE__ */ react_default.createElement(Checkmark_default, null) : /* @__PURE__ */ react_default.createElement(CheckmarkPlaceholder, null);
+  }, [showInputs]);
+  const dropdownMenuChildren = (0, react_exports.useMemo)(() => {
+    const items = [];
+    if (hasGlobalInputs) {
+      items.push(
+        /* @__PURE__ */ react_default.createElement(
+          Menu_default.Item,
+          {
+            key: "inputs-item",
+            "data-test": "inputs-menu-item",
+            onClick: handleInputsToggle,
+            startAdornment: checkmarkIcon
+          },
+          (0, i18n_exports._)("Inputs")
+        )
+      );
+    }
+    return items;
+  }, [hasGlobalInputs, handleInputsToggle, checkmarkIcon]);
+  if (dropdownMenuChildren.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ react_default.createElement(Tooltip_default, { contentRelationship: "label", content: (0, i18n_exports._)("Display") }, /* @__PURE__ */ react_default.createElement(
+    Dropdown_default,
+    {
+      onRequestClose: handleRequestClose,
+      onRequestOpen: handleRequestOpen,
+      open: isOpen,
+      toggle: buttonToggle
+    },
+    /* @__PURE__ */ react_default.createElement(
+      Menu_default,
+      {
+        style: menuStyle,
+        focusMode: "normal",
+        "aria-label": (0, i18n_exports._)("Display options")
+      },
+      dropdownMenuChildren
+    )
+  ));
+};
+
 // esm-externals:@splunk/react-icons/Square
 var Square_exports = {};
 __export(Square_exports, {
   default: () => Square_default
 });
-var defaultImport19 = __toESM(require("@splunk/react-icons/Square"));
+var defaultImport20 = __toESM(require("@splunk/react-icons/Square"));
 __reExport(Square_exports, require("@splunk/react-icons/Square"));
-var Square_default = "default" in defaultImport19 ? defaultImport19.default : defaultImport19;
+var Square_default = "default" in defaultImport20 ? defaultImport20.default : defaultImport20;
 
 // src/buttons/EmptyVisualization.tsx
 var icon2 = prepareIcon({
@@ -678,6 +771,7 @@ var ExportDashboardButton = ({
   scale = 1
 }) => {
   const [open, setOpen] = (0, react_exports.useState)(false);
+  const buttonRef = (0, react_exports.useRef)(null);
   const handleOpen = (0, react_exports.useCallback)(() => {
     setOpen(true);
   }, []);
@@ -687,6 +781,7 @@ var ExportDashboardButton = ({
   return /* @__PURE__ */ react_default.createElement(react_default.Fragment, null, /* @__PURE__ */ react_default.createElement(
     Button_default,
     {
+      elementRef: buttonRef,
       icon: downloadIcon,
       key: "export-dashboard-button",
       "data-clickable": true,
@@ -701,7 +796,7 @@ var ExportDashboardButton = ({
       open,
       onModalClose: handleClose,
       scale,
-      returnFocus: dashboard_utils_exports.noop
+      returnFocus: buttonRef
     }
   ));
 };
@@ -712,9 +807,9 @@ var ChevronsOut_exports = {};
 __export(ChevronsOut_exports, {
   default: () => ChevronsOut_default
 });
-var defaultImport20 = __toESM(require("@splunk/react-icons/ChevronsOut"));
+var defaultImport21 = __toESM(require("@splunk/react-icons/ChevronsOut"));
 __reExport(ChevronsOut_exports, require("@splunk/react-icons/ChevronsOut"));
-var ChevronsOut_default = "default" in defaultImport20 ? defaultImport20.default : defaultImport20;
+var ChevronsOut_default = "default" in defaultImport21 ? defaultImport21.default : defaultImport21;
 
 // src/buttons/Fullscreen.tsx
 var icon3 = prepareIcon({
@@ -743,9 +838,9 @@ var Switch_exports = {};
 __export(Switch_exports, {
   default: () => Switch_default
 });
-var defaultImport21 = __toESM(require("@splunk/react-ui/Switch"));
+var defaultImport22 = __toESM(require("@splunk/react-ui/Switch"));
 __reExport(Switch_exports, require("@splunk/react-ui/Switch"));
-var Switch_default = "default" in defaultImport21 ? defaultImport21.default : defaultImport21;
+var Switch_default = "default" in defaultImport22 ? defaultImport22.default : defaultImport22;
 
 // src/components/ItemSeparator.tsx
 var ItemSeparator = styled_components_default.div`
@@ -803,9 +898,9 @@ var ChartSingleValueIcon_exports = {};
 __export(ChartSingleValueIcon_exports, {
   default: () => ChartSingleValueIcon_default
 });
-var defaultImport22 = __toESM(require("@splunk/react-icons/ChartSingleValueIcon"));
+var defaultImport23 = __toESM(require("@splunk/react-icons/ChartSingleValueIcon"));
 __reExport(ChartSingleValueIcon_exports, require("@splunk/react-icons/ChartSingleValueIcon"));
-var ChartSingleValueIcon_default = "default" in defaultImport22 ? defaultImport22.default : defaultImport22;
+var ChartSingleValueIcon_default = "default" in defaultImport23 ? defaultImport23.default : defaultImport23;
 
 // src/buttons/IconGallery.tsx
 var MenusContainer = styled_components_default.div`
@@ -886,12 +981,11 @@ var QuestionCircle_exports = {};
 __export(QuestionCircle_exports, {
   default: () => QuestionCircle_default
 });
-var defaultImport23 = __toESM(require("@splunk/react-icons/QuestionCircle"));
+var defaultImport24 = __toESM(require("@splunk/react-icons/QuestionCircle"));
 __reExport(QuestionCircle_exports, require("@splunk/react-icons/QuestionCircle"));
-var QuestionCircle_default = "default" in defaultImport23 ? defaultImport23.default : defaultImport23;
+var QuestionCircle_default = "default" in defaultImport24 ? defaultImport24.default : defaultImport24;
 
 // src/buttons/HelpButton.tsx
-var focusToggleReasons3 = [];
 var HelpIcon = prepareIcon({
   Icon: QuestionCircle_default,
   screenReaderContent: (0, i18n_exports._)("Help links"),
@@ -944,7 +1038,6 @@ var HelpButton = ({ helpLinks = [] }) => {
   return /* @__PURE__ */ react_default.createElement(Item_default, null, /* @__PURE__ */ react_default.createElement(
     Dropdown_default,
     {
-      focusToggleReasons: focusToggleReasons3,
       onRequestClose: handleRequestClose,
       onRequestOpen: handleRequestOpen,
       open: isOpen,
@@ -960,9 +1053,9 @@ var Picture_exports = {};
 __export(Picture_exports, {
   default: () => Picture_default
 });
-var defaultImport24 = __toESM(require("@splunk/react-icons/Picture"));
+var defaultImport25 = __toESM(require("@splunk/react-icons/Picture"));
 __reExport(Picture_exports, require("@splunk/react-icons/Picture"));
-var Picture_default = "default" in defaultImport24 ? defaultImport24.default : defaultImport24;
+var Picture_default = "default" in defaultImport25 ? defaultImport25.default : defaultImport25;
 
 // src/buttons/Image.tsx
 var icon4 = prepareIcon({
@@ -1013,7 +1106,7 @@ var ButtonToggle3 = /* @__PURE__ */ react_default.createElement(
     icon: imageGalleryDropdown
   }
 );
-var focusToggleReasons4 = [];
+var focusToggleReasons3 = [];
 var ImageGallery = ({ dashboardApi }) => {
   const {
     handleForceClose,
@@ -1045,7 +1138,7 @@ var ImageGallery = ({ dashboardApi }) => {
   return /* @__PURE__ */ react_default.createElement(Item_default, null, /* @__PURE__ */ react_default.createElement(
     Dropdown_default,
     {
-      focusToggleReasons: focusToggleReasons4,
+      focusToggleReasons: focusToggleReasons3,
       onRequestClose: handleRequestClose,
       onRequestOpen: handleRequestOpen,
       open: isOpen,
@@ -1067,30 +1160,30 @@ var lodash_exports = {};
 __export(lodash_exports, {
   default: () => lodash_default
 });
-var defaultImport25 = __toESM(require("lodash"));
+var defaultImport26 = __toESM(require("lodash"));
 __reExport(lodash_exports, require("lodash"));
-var lodash_default = "default" in defaultImport25 ? defaultImport25.default : defaultImport25;
+var lodash_default = "default" in defaultImport26 ? defaultImport26.default : defaultImport26;
 
 // esm-externals:@splunk/react-icons/SlidersTripleHorizontal
 var SlidersTripleHorizontal_exports = {};
 __export(SlidersTripleHorizontal_exports, {
   default: () => SlidersTripleHorizontal_default
 });
-var defaultImport26 = __toESM(require("@splunk/react-icons/SlidersTripleHorizontal"));
+var defaultImport27 = __toESM(require("@splunk/react-icons/SlidersTripleHorizontal"));
 __reExport(SlidersTripleHorizontal_exports, require("@splunk/react-icons/SlidersTripleHorizontal"));
-var SlidersTripleHorizontal_default = "default" in defaultImport26 ? defaultImport26.default : defaultImport26;
+var SlidersTripleHorizontal_default = "default" in defaultImport27 ? defaultImport27.default : defaultImport27;
 
 // esm-externals:@splunk/dashboard-definition
 var dashboard_definition_exports = {};
 __export(dashboard_definition_exports, {
   default: () => dashboard_definition_default
 });
-var defaultImport27 = __toESM(require("@splunk/dashboard-definition"));
+var defaultImport28 = __toESM(require("@splunk/dashboard-definition"));
 __reExport(dashboard_definition_exports, require("@splunk/dashboard-definition"));
-var dashboard_definition_default = "default" in defaultImport27 ? defaultImport27.default : defaultImport27;
+var dashboard_definition_default = "default" in defaultImport28 ? defaultImport28.default : defaultImport28;
 
 // src/buttons/Inputs.tsx
-var focusToggleReasons5 = [
+var focusToggleReasons4 = [
   "escapeKey",
   "tabKey"
 ];
@@ -1196,7 +1289,7 @@ var Inputs = ({
   return /* @__PURE__ */ react_default.createElement(Item_default, null, /* @__PURE__ */ react_default.createElement(
     Dropdown_default,
     {
-      focusToggleReasons: focusToggleReasons5,
+      focusToggleReasons: focusToggleReasons4,
       onRequestClose: handleRequestClose,
       onRequestOpen: handleRequestOpen,
       open: isOpen,
@@ -1212,9 +1305,9 @@ var Markdown_exports = {};
 __export(Markdown_exports, {
   default: () => Markdown_default
 });
-var defaultImport28 = __toESM(require("@splunk/react-icons/Markdown"));
+var defaultImport29 = __toESM(require("@splunk/react-icons/Markdown"));
 __reExport(Markdown_exports, require("@splunk/react-icons/Markdown"));
-var Markdown_default = "default" in defaultImport28 ? defaultImport28.default : defaultImport28;
+var Markdown_default = "default" in defaultImport29 ? defaultImport29.default : defaultImport29;
 
 // src/buttons/Markdown.tsx
 var icon5 = prepareIcon({
@@ -1275,9 +1368,9 @@ var ArrowBowRight_exports = {};
 __export(ArrowBowRight_exports, {
   default: () => ArrowBowRight_default
 });
-var defaultImport29 = __toESM(require("@splunk/react-icons/ArrowBowRight"));
+var defaultImport30 = __toESM(require("@splunk/react-icons/ArrowBowRight"));
 __reExport(ArrowBowRight_exports, require("@splunk/react-icons/ArrowBowRight"));
-var ArrowBowRight_default = "default" in defaultImport29 ? defaultImport29.default : defaultImport29;
+var ArrowBowRight_default = "default" in defaultImport30 ? defaultImport30.default : defaultImport30;
 
 // src/buttons/Redo.tsx
 var icon6 = prepareIcon({
@@ -1328,27 +1421,27 @@ var Circle_exports = {};
 __export(Circle_exports, {
   default: () => Circle_default
 });
-var defaultImport30 = __toESM(require("@splunk/react-icons/Circle"));
+var defaultImport31 = __toESM(require("@splunk/react-icons/Circle"));
 __reExport(Circle_exports, require("@splunk/react-icons/Circle"));
-var Circle_default = "default" in defaultImport30 ? defaultImport30.default : defaultImport30;
+var Circle_default = "default" in defaultImport31 ? defaultImport31.default : defaultImport31;
 
 // esm-externals:@splunk/react-icons/Line
 var Line_exports = {};
 __export(Line_exports, {
   default: () => Line_default
 });
-var defaultImport31 = __toESM(require("@splunk/react-icons/Line"));
+var defaultImport32 = __toESM(require("@splunk/react-icons/Line"));
 __reExport(Line_exports, require("@splunk/react-icons/Line"));
-var Line_default = "default" in defaultImport31 ? defaultImport31.default : defaultImport31;
+var Line_default = "default" in defaultImport32 ? defaultImport32.default : defaultImport32;
 
 // esm-externals:@splunk/react-icons/ShapesVariety
 var ShapesVariety_exports = {};
 __export(ShapesVariety_exports, {
   default: () => ShapesVariety_default
 });
-var defaultImport32 = __toESM(require("@splunk/react-icons/ShapesVariety"));
+var defaultImport33 = __toESM(require("@splunk/react-icons/ShapesVariety"));
 __reExport(ShapesVariety_exports, require("@splunk/react-icons/ShapesVariety"));
-var ShapesVariety_default = "default" in defaultImport32 ? defaultImport32.default : defaultImport32;
+var ShapesVariety_default = "default" in defaultImport33 ? defaultImport33.default : defaultImport33;
 
 // src/PopoverItemButton.tsx
 var StyledContentWrapper = styled_components_default.span`
@@ -1385,7 +1478,7 @@ var ButtonToggle5 = /* @__PURE__ */ react_default.createElement(
     icon: shapesDropdown
   }
 );
-var focusToggleReasons6 = [
+var focusToggleReasons5 = [
   "escapeKey",
   "tabKey"
 ];
@@ -1412,7 +1505,7 @@ var Shapes = ({ dashboardApi, layoutType }) => {
   return /* @__PURE__ */ react_default.createElement(Item_default, null, /* @__PURE__ */ react_default.createElement(
     Dropdown_default,
     {
-      focusToggleReasons: focusToggleReasons6,
+      focusToggleReasons: focusToggleReasons5,
       onRequestClose: handleRequestClose,
       onRequestOpen: handleRequestOpen,
       open: isOpen,
@@ -1476,24 +1569,38 @@ var WindowChevronsSlash_exports = {};
 __export(WindowChevronsSlash_exports, {
   default: () => WindowChevronsSlash_default
 });
-var defaultImport33 = __toESM(require("@splunk/react-icons/WindowChevronsSlash"));
+var defaultImport34 = __toESM(require("@splunk/react-icons/WindowChevronsSlash"));
 __reExport(WindowChevronsSlash_exports, require("@splunk/react-icons/WindowChevronsSlash"));
-var WindowChevronsSlash_default = "default" in defaultImport33 ? defaultImport33.default : defaultImport33;
+var WindowChevronsSlash_default = "default" in defaultImport34 ? defaultImport34.default : defaultImport34;
 
 // src/buttons/Source.tsx
 var icon7 = prepareIcon({
   Icon: WindowChevronsSlash_default,
   screenReaderContent: (0, i18n_exports._)("Source code")
 });
-var Source = ({ disabled = false, onClick }) => /* @__PURE__ */ react_default.createElement(
-  IconButton_default,
-  {
-    testLabel: "source-button",
-    onClick,
-    disabled,
-    icon: icon7
-  }
-);
+var Source = ({ disabled = false, onClick }) => {
+  const sourceButtonRef = (0, dashboard_context_exports.useToolbarRef)("source");
+  const setReturnPoint = (0, dashboard_context_exports.useRestoreFocus)(sourceButtonRef);
+  const onSourceClick = (0, react_exports.useCallback)(
+    (event, data) => {
+      if (onClick) {
+        onClick(event, data);
+        setReturnPoint();
+      }
+    },
+    [onClick, setReturnPoint]
+  );
+  return /* @__PURE__ */ react_default.createElement(
+    IconButton_default,
+    {
+      testLabel: "source-button",
+      onClick: onSourceClick,
+      disabled,
+      icon: icon7,
+      buttonRef: sourceButtonRef
+    }
+  );
+};
 var Source_default = Source;
 
 // esm-externals:@splunk/react-icons/ListToken
@@ -1501,9 +1608,9 @@ var ListToken_exports = {};
 __export(ListToken_exports, {
   default: () => ListToken_default
 });
-var defaultImport34 = __toESM(require("@splunk/react-icons/ListToken"));
+var defaultImport35 = __toESM(require("@splunk/react-icons/ListToken"));
 __reExport(ListToken_exports, require("@splunk/react-icons/ListToken"));
-var ListToken_default = "default" in defaultImport34 ? defaultImport34.default : defaultImport34;
+var ListToken_default = "default" in defaultImport35 ? defaultImport35.default : defaultImport35;
 
 // src/buttons/tokenManager/TokenManager.tsx
 var tokenManagerIcon = prepareIcon({
@@ -1551,9 +1658,9 @@ var ArrowBowLeft_exports = {};
 __export(ArrowBowLeft_exports, {
   default: () => ArrowBowLeft_default
 });
-var defaultImport35 = __toESM(require("@splunk/react-icons/ArrowBowLeft"));
+var defaultImport36 = __toESM(require("@splunk/react-icons/ArrowBowLeft"));
 __reExport(ArrowBowLeft_exports, require("@splunk/react-icons/ArrowBowLeft"));
-var ArrowBowLeft_default = "default" in defaultImport35 ? defaultImport35.default : defaultImport35;
+var ArrowBowLeft_default = "default" in defaultImport36 ? defaultImport36.default : defaultImport36;
 
 // src/buttons/Undo.tsx
 var icon8 = prepareIcon({
@@ -1604,9 +1711,9 @@ var format_exports = {};
 __export(format_exports, {
   default: () => format_default
 });
-var defaultImport36 = __toESM(require("@splunk/ui-utils/format"));
+var defaultImport37 = __toESM(require("@splunk/ui-utils/format"));
 __reExport(format_exports, require("@splunk/ui-utils/format"));
-var format_default = "default" in defaultImport36 ? defaultImport36.default : defaultImport36;
+var format_default = "default" in defaultImport37 ? defaultImport37.default : defaultImport37;
 
 // src/buttons/Zoom/ZoomMenu.tsx
 var zoomLevels = [25, 50, 100, 150, 200];
@@ -1614,7 +1721,7 @@ var buttonStyle = {
   borderTopLeftRadius: 0,
   borderBottomLeftRadius: 0
 };
-var menuStyle = {
+var menuStyle2 = {
   width: "200px"
 };
 var ZoomMenu = ({
@@ -1755,7 +1862,7 @@ var ZoomMenu = ({
     /* @__PURE__ */ react_default.createElement(
       Menu_default,
       {
-        style: menuStyle,
+        style: menuStyle2,
         focusMode: "normal",
         "aria-label": (0, i18n_exports._)("Zoom level")
       },
@@ -1769,9 +1876,9 @@ var Number_exports = {};
 __export(Number_exports, {
   default: () => Number_default
 });
-var defaultImport37 = __toESM(require("@splunk/react-ui/Number"));
+var defaultImport38 = __toESM(require("@splunk/react-ui/Number"));
 __reExport(Number_exports, require("@splunk/react-ui/Number"));
-var Number_default = "default" in defaultImport37 ? defaultImport37.default : defaultImport37;
+var Number_default = "default" in defaultImport38 ? defaultImport38.default : defaultImport38;
 
 // src/buttons/Zoom/ZoomNumber.tsx
 var StyledNumber = styled_components_default(Number_default)`
@@ -1825,7 +1932,7 @@ var Container = styled_components_default.div`
     gap: ${themes_exports.variables.spacingSmall};
 `;
 var StyledTooltip = styled_components_default(Tooltip_default)`
-    width: 110px;
+    width: 90px;
     & span {
         display: flex;
     }