@splunk/dashboard-toolbar 29.2.0 → 29.3.0

package/index.js

@@ -91,6 +91,7 @@ __export(src_exports, {
   ContentExport: () => ContentExport_default,
   ControlGroup: () => ControlGroup_default,
   Data: () => Data_default,
+  Display: () => Display,
   EditingGroup: () => EditingGroup_default,
   EditorGroup: () => EditorGroup_default,
   EditorsControlGroup: () => EditorsControlGroup_default,
@@ -945,14 +946,106 @@ var Data = ({ dashboardApi }) => {
 };
 var Data_default = Data;
 
+// esm-externals:@splunk/react-icons/Checkmark
+var Checkmark_exports = {};
+__export(Checkmark_exports, {
+  default: () => Checkmark_default
+});
+var defaultImport23 = __toESM(require("@splunk/react-icons/Checkmark"));
+__reExport(Checkmark_exports, require("@splunk/react-icons/Checkmark"));
+var Checkmark_default = "default" in defaultImport23 ? defaultImport23.default : defaultImport23;
+
+// 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 buttonToggle2 = (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: buttonToggle2
+    },
+    /* @__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 defaultImport23 = __toESM(require("@splunk/react-icons/Square"));
+var defaultImport24 = __toESM(require("@splunk/react-icons/Square"));
 __reExport(Square_exports, require("@splunk/react-icons/Square"));
-var Square_default = "default" in defaultImport23 ? defaultImport23.default : defaultImport23;
+var Square_default = "default" in defaultImport24 ? defaultImport24.default : defaultImport24;
 
 // src/buttons/EmptyVisualization.tsx
 var icon2 = prepareIcon({
@@ -992,6 +1085,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);
   }, []);
@@ -1001,6 +1095,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,
@@ -1015,7 +1110,7 @@ var ExportDashboardButton = ({
       open,
       onModalClose: handleClose,
       scale,
-      returnFocus: dashboard_utils_exports.noop
+      returnFocus: buttonRef
     }
   ));
 };
@@ -1026,9 +1121,9 @@ var ChevronsOut_exports = {};
 __export(ChevronsOut_exports, {
   default: () => ChevronsOut_default
 });
-var defaultImport24 = __toESM(require("@splunk/react-icons/ChevronsOut"));
+var defaultImport25 = __toESM(require("@splunk/react-icons/ChevronsOut"));
 __reExport(ChevronsOut_exports, require("@splunk/react-icons/ChevronsOut"));
-var ChevronsOut_default = "default" in defaultImport24 ? defaultImport24.default : defaultImport24;
+var ChevronsOut_default = "default" in defaultImport25 ? defaultImport25.default : defaultImport25;
 
 // src/buttons/Fullscreen.tsx
 var icon3 = prepareIcon({
@@ -1057,9 +1152,9 @@ var Switch_exports = {};
 __export(Switch_exports, {
   default: () => Switch_default
 });
-var defaultImport25 = __toESM(require("@splunk/react-ui/Switch"));
+var defaultImport26 = __toESM(require("@splunk/react-ui/Switch"));
 __reExport(Switch_exports, require("@splunk/react-ui/Switch"));
-var Switch_default = "default" in defaultImport25 ? defaultImport25.default : defaultImport25;
+var Switch_default = "default" in defaultImport26 ? defaultImport26.default : defaultImport26;
 
 // src/buttons/GridLineSwitch.tsx
 var SwitchContainer = styled_components_default.div`
@@ -1107,9 +1202,9 @@ var ChartSingleValueIcon_exports = {};
 __export(ChartSingleValueIcon_exports, {
   default: () => ChartSingleValueIcon_default
 });
-var defaultImport26 = __toESM(require("@splunk/react-icons/ChartSingleValueIcon"));
+var defaultImport27 = __toESM(require("@splunk/react-icons/ChartSingleValueIcon"));
 __reExport(ChartSingleValueIcon_exports, require("@splunk/react-icons/ChartSingleValueIcon"));
-var ChartSingleValueIcon_default = "default" in defaultImport26 ? defaultImport26.default : defaultImport26;
+var ChartSingleValueIcon_default = "default" in defaultImport27 ? defaultImport27.default : defaultImport27;
 
 // src/buttons/IconGallery.tsx
 var MenusContainer = styled_components_default.div`
@@ -1190,12 +1285,11 @@ var QuestionCircle_exports = {};
 __export(QuestionCircle_exports, {
   default: () => QuestionCircle_default
 });
-var defaultImport27 = __toESM(require("@splunk/react-icons/QuestionCircle"));
+var defaultImport28 = __toESM(require("@splunk/react-icons/QuestionCircle"));
 __reExport(QuestionCircle_exports, require("@splunk/react-icons/QuestionCircle"));
-var QuestionCircle_default = "default" in defaultImport27 ? defaultImport27.default : defaultImport27;
+var QuestionCircle_default = "default" in defaultImport28 ? defaultImport28.default : defaultImport28;
 
 // src/buttons/HelpButton.tsx
-var focusToggleReasons3 = [];
 var HelpIcon = prepareIcon({
   Icon: QuestionCircle_default,
   screenReaderContent: (0, i18n_exports._)("Help links"),
@@ -1248,7 +1342,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,
@@ -1264,9 +1357,9 @@ var Picture_exports = {};
 __export(Picture_exports, {
   default: () => Picture_default
 });
-var defaultImport28 = __toESM(require("@splunk/react-icons/Picture"));
+var defaultImport29 = __toESM(require("@splunk/react-icons/Picture"));
 __reExport(Picture_exports, require("@splunk/react-icons/Picture"));
-var Picture_default = "default" in defaultImport28 ? defaultImport28.default : defaultImport28;
+var Picture_default = "default" in defaultImport29 ? defaultImport29.default : defaultImport29;
 
 // src/buttons/Image.tsx
 var icon4 = prepareIcon({
@@ -1317,7 +1410,7 @@ var ButtonToggle3 = /* @__PURE__ */ react_default.createElement(
     icon: imageGalleryDropdown
   }
 );
-var focusToggleReasons4 = [];
+var focusToggleReasons3 = [];
 var ImageGallery = ({ dashboardApi }) => {
   const {
     handleForceClose,
@@ -1349,7 +1442,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,
@@ -1371,30 +1464,30 @@ var lodash_exports = {};
 __export(lodash_exports, {
   default: () => lodash_default
 });
-var defaultImport29 = __toESM(require("lodash"));
+var defaultImport30 = __toESM(require("lodash"));
 __reExport(lodash_exports, require("lodash"));
-var lodash_default = "default" in defaultImport29 ? defaultImport29.default : defaultImport29;
+var lodash_default = "default" in defaultImport30 ? defaultImport30.default : defaultImport30;
 
 // esm-externals:@splunk/react-icons/SlidersTripleHorizontal
 var SlidersTripleHorizontal_exports = {};
 __export(SlidersTripleHorizontal_exports, {
   default: () => SlidersTripleHorizontal_default
 });
-var defaultImport30 = __toESM(require("@splunk/react-icons/SlidersTripleHorizontal"));
+var defaultImport31 = __toESM(require("@splunk/react-icons/SlidersTripleHorizontal"));
 __reExport(SlidersTripleHorizontal_exports, require("@splunk/react-icons/SlidersTripleHorizontal"));
-var SlidersTripleHorizontal_default = "default" in defaultImport30 ? defaultImport30.default : defaultImport30;
+var SlidersTripleHorizontal_default = "default" in defaultImport31 ? defaultImport31.default : defaultImport31;
 
 // esm-externals:@splunk/dashboard-definition
 var dashboard_definition_exports = {};
 __export(dashboard_definition_exports, {
   default: () => dashboard_definition_default
 });
-var defaultImport31 = __toESM(require("@splunk/dashboard-definition"));
+var defaultImport32 = __toESM(require("@splunk/dashboard-definition"));
 __reExport(dashboard_definition_exports, require("@splunk/dashboard-definition"));
-var dashboard_definition_default = "default" in defaultImport31 ? defaultImport31.default : defaultImport31;
+var dashboard_definition_default = "default" in defaultImport32 ? defaultImport32.default : defaultImport32;
 
 // src/buttons/Inputs.tsx
-var focusToggleReasons5 = [
+var focusToggleReasons4 = [
   "escapeKey",
   "tabKey"
 ];
@@ -1500,7 +1593,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,
@@ -1516,9 +1609,9 @@ var Markdown_exports = {};
 __export(Markdown_exports, {
   default: () => Markdown_default
 });
-var defaultImport32 = __toESM(require("@splunk/react-icons/Markdown"));
+var defaultImport33 = __toESM(require("@splunk/react-icons/Markdown"));
 __reExport(Markdown_exports, require("@splunk/react-icons/Markdown"));
-var Markdown_default = "default" in defaultImport32 ? defaultImport32.default : defaultImport32;
+var Markdown_default = "default" in defaultImport33 ? defaultImport33.default : defaultImport33;
 
 // src/buttons/Markdown.tsx
 var icon5 = prepareIcon({
@@ -1579,9 +1672,9 @@ var ArrowBowRight_exports = {};
 __export(ArrowBowRight_exports, {
   default: () => ArrowBowRight_default
 });
-var defaultImport33 = __toESM(require("@splunk/react-icons/ArrowBowRight"));
+var defaultImport34 = __toESM(require("@splunk/react-icons/ArrowBowRight"));
 __reExport(ArrowBowRight_exports, require("@splunk/react-icons/ArrowBowRight"));
-var ArrowBowRight_default = "default" in defaultImport33 ? defaultImport33.default : defaultImport33;
+var ArrowBowRight_default = "default" in defaultImport34 ? defaultImport34.default : defaultImport34;
 
 // src/buttons/Redo.tsx
 var icon6 = prepareIcon({
@@ -1632,27 +1725,27 @@ var Circle_exports = {};
 __export(Circle_exports, {
   default: () => Circle_default
 });
-var defaultImport34 = __toESM(require("@splunk/react-icons/Circle"));
+var defaultImport35 = __toESM(require("@splunk/react-icons/Circle"));
 __reExport(Circle_exports, require("@splunk/react-icons/Circle"));
-var Circle_default = "default" in defaultImport34 ? defaultImport34.default : defaultImport34;
+var Circle_default = "default" in defaultImport35 ? defaultImport35.default : defaultImport35;
 
 // esm-externals:@splunk/react-icons/Line
 var Line_exports = {};
 __export(Line_exports, {
   default: () => Line_default
 });
-var defaultImport35 = __toESM(require("@splunk/react-icons/Line"));
+var defaultImport36 = __toESM(require("@splunk/react-icons/Line"));
 __reExport(Line_exports, require("@splunk/react-icons/Line"));
-var Line_default = "default" in defaultImport35 ? defaultImport35.default : defaultImport35;
+var Line_default = "default" in defaultImport36 ? defaultImport36.default : defaultImport36;
 
 // esm-externals:@splunk/react-icons/ShapesVariety
 var ShapesVariety_exports = {};
 __export(ShapesVariety_exports, {
   default: () => ShapesVariety_default
 });
-var defaultImport36 = __toESM(require("@splunk/react-icons/ShapesVariety"));
+var defaultImport37 = __toESM(require("@splunk/react-icons/ShapesVariety"));
 __reExport(ShapesVariety_exports, require("@splunk/react-icons/ShapesVariety"));
-var ShapesVariety_default = "default" in defaultImport36 ? defaultImport36.default : defaultImport36;
+var ShapesVariety_default = "default" in defaultImport37 ? defaultImport37.default : defaultImport37;
 
 // src/buttons/Shapes.tsx
 var shapesDropdown = prepareIcon({
@@ -1669,7 +1762,7 @@ var ButtonToggle5 = /* @__PURE__ */ react_default.createElement(
     icon: shapesDropdown
   }
 );
-var focusToggleReasons6 = [
+var focusToggleReasons5 = [
   "escapeKey",
   "tabKey"
 ];
@@ -1696,7 +1789,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,
@@ -1760,24 +1853,38 @@ var WindowChevronsSlash_exports = {};
 __export(WindowChevronsSlash_exports, {
   default: () => WindowChevronsSlash_default
 });
-var defaultImport37 = __toESM(require("@splunk/react-icons/WindowChevronsSlash"));
+var defaultImport38 = __toESM(require("@splunk/react-icons/WindowChevronsSlash"));
 __reExport(WindowChevronsSlash_exports, require("@splunk/react-icons/WindowChevronsSlash"));
-var WindowChevronsSlash_default = "default" in defaultImport37 ? defaultImport37.default : defaultImport37;
+var WindowChevronsSlash_default = "default" in defaultImport38 ? defaultImport38.default : defaultImport38;
 
 // 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
@@ -1785,9 +1892,9 @@ var ListToken_exports = {};
 __export(ListToken_exports, {
   default: () => ListToken_default
 });
-var defaultImport38 = __toESM(require("@splunk/react-icons/ListToken"));
+var defaultImport39 = __toESM(require("@splunk/react-icons/ListToken"));
 __reExport(ListToken_exports, require("@splunk/react-icons/ListToken"));
-var ListToken_default = "default" in defaultImport38 ? defaultImport38.default : defaultImport38;
+var ListToken_default = "default" in defaultImport39 ? defaultImport39.default : defaultImport39;
 
 // src/buttons/tokenManager/TokenManager.tsx
 var tokenManagerIcon = prepareIcon({
@@ -1835,9 +1942,9 @@ var ArrowBowLeft_exports = {};
 __export(ArrowBowLeft_exports, {
   default: () => ArrowBowLeft_default
 });
-var defaultImport39 = __toESM(require("@splunk/react-icons/ArrowBowLeft"));
+var defaultImport40 = __toESM(require("@splunk/react-icons/ArrowBowLeft"));
 __reExport(ArrowBowLeft_exports, require("@splunk/react-icons/ArrowBowLeft"));
-var ArrowBowLeft_default = "default" in defaultImport39 ? defaultImport39.default : defaultImport39;
+var ArrowBowLeft_default = "default" in defaultImport40 ? defaultImport40.default : defaultImport40;
 
 // src/buttons/Undo.tsx
 var icon8 = prepareIcon({
@@ -1888,9 +1995,9 @@ var format_exports = {};
 __export(format_exports, {
   default: () => format_default
 });
-var defaultImport40 = __toESM(require("@splunk/ui-utils/format"));
+var defaultImport41 = __toESM(require("@splunk/ui-utils/format"));
 __reExport(format_exports, require("@splunk/ui-utils/format"));
-var format_default = "default" in defaultImport40 ? defaultImport40.default : defaultImport40;
+var format_default = "default" in defaultImport41 ? defaultImport41.default : defaultImport41;
 
 // src/buttons/Zoom/ZoomMenu.tsx
 var zoomLevels = [25, 50, 100, 150, 200];
@@ -1898,7 +2005,7 @@ var buttonStyle = {
   borderTopLeftRadius: 0,
   borderBottomLeftRadius: 0
 };
-var menuStyle = {
+var menuStyle2 = {
   width: "200px"
 };
 var ZoomMenu = ({
@@ -2039,7 +2146,7 @@ var ZoomMenu = ({
     /* @__PURE__ */ react_default.createElement(
       Menu_default,
       {
-        style: menuStyle,
+        style: menuStyle2,
         focusMode: "normal",
         "aria-label": (0, i18n_exports._)("Zoom level")
       },
@@ -2053,9 +2160,9 @@ var Number_exports = {};
 __export(Number_exports, {
   default: () => Number_default
 });
-var defaultImport41 = __toESM(require("@splunk/react-ui/Number"));
+var defaultImport42 = __toESM(require("@splunk/react-ui/Number"));
 __reExport(Number_exports, require("@splunk/react-ui/Number"));
-var Number_default = "default" in defaultImport41 ? defaultImport41.default : defaultImport41;
+var Number_default = "default" in defaultImport42 ? defaultImport42.default : defaultImport42;
 
 // src/buttons/Zoom/ZoomNumber.tsx
 var StyledNumber = styled_components_default(Number_default)`
@@ -2109,7 +2216,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;
     }
@@ -2189,7 +2296,7 @@ var Zoom = ({
 };
 
 // src/groups/ActionsGroup.tsx
-var menuStyle2 = {
+var menuStyle3 = {
   width: "180px"
 };
 var buttonToggle = /* @__PURE__ */ react_default.createElement(
@@ -2214,7 +2321,7 @@ var ActionsGroup = ({ children }) => {
       open: isOpen,
       toggle: buttonToggle
     },
-    /* @__PURE__ */ react_default.createElement(Menu_default, { style: menuStyle2 }, children)
+    /* @__PURE__ */ react_default.createElement(Menu_default, { style: menuStyle3 }, children)
   );
 };
 var ActionsGroup_default = ActionsGroup;