@splunk/dashboard-toolbar 29.0.0

package/groups/EditingGroup.js

@@ -0,0 +1,1029 @@
+/* Copyright © 2020 Splunk Inc.
+SPLUNK CONFIDENTIAL – Use or disclosure of this material in whole or
+in part without a valid written license from Splunk Inc. is PROHIBITED. */
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/groups/EditingGroup.tsx
+var EditingGroup_exports = {};
+__export(EditingGroup_exports, {
+  default: () => EditingGroup_default
+});
+module.exports = __toCommonJS(EditingGroup_exports);
+
+// esm-externals:react
+var react_exports = {};
+__export(react_exports, {
+  default: () => react_default
+});
+var defaultImport = __toESM(require("react"));
+__reExport(react_exports, require("react"));
+var react_default = "default" in defaultImport ? defaultImport.default : defaultImport;
+
+// esm-externals:@splunk/themes
+var themes_exports = {};
+__export(themes_exports, {
+  default: () => themes_default
+});
+var defaultImport2 = __toESM(require("@splunk/themes"));
+__reExport(themes_exports, require("@splunk/themes"));
+var themes_default = "default" in defaultImport2 ? defaultImport2.default : defaultImport2;
+
+// esm-externals:styled-components
+var styled_components_exports = {};
+__export(styled_components_exports, {
+  default: () => styled_components_default
+});
+var defaultImport3 = __toESM(require("styled-components"));
+__reExport(styled_components_exports, require("styled-components"));
+var styled_components_default = "default" in defaultImport3 ? defaultImport3.default : defaultImport3;
+
+// esm-externals:@splunk/dashboard-utils
+var dashboard_utils_exports = {};
+__export(dashboard_utils_exports, {
+  default: () => dashboard_utils_default
+});
+var defaultImport4 = __toESM(require("@splunk/dashboard-utils"));
+__reExport(dashboard_utils_exports, require("@splunk/dashboard-utils"));
+var dashboard_utils_default = "default" in defaultImport4 ? defaultImport4.default : defaultImport4;
+
+// src/components/ItemSeparator.tsx
+var ItemSeparator = styled_components_default.div`
+    border-left-width: 1px;
+    border-left-style: solid;
+    border-left-color: ${themes_exports.variables.interactiveColorBorder};
+    width: 0px;
+    height: ${themes_exports.variables.inputHeight};
+`;
+var ItemSeparator_default = ItemSeparator;
+
+// src/ItemGroup.tsx
+var Group = styled_components_default.div.attrs({
+  "data-test": "toolbar-item-group"
+})`
+    display: flex;
+    flex-direction: row;
+    gap: ${(props) => props.gap};
+`;
+var ItemGroup = (_a) => {
+  var _b = _a, {
+    children,
+    borders = true,
+    gap
+  } = _b, rest = __objRest(_b, [
+    "children",
+    "borders",
+    "gap"
+  ]);
+  const items = react_default.Children.map(
+    children,
+    (child) => child && react_default.cloneElement(child, rest)
+  );
+  const separator = borders ? /* @__PURE__ */ react_default.createElement(ItemSeparator_default, null) : null;
+  return /* @__PURE__ */ react_default.createElement(react_default.Fragment, null, /* @__PURE__ */ react_default.createElement(Group, { gap: (0, dashboard_utils_exports.toPx)(gap, 2) }, items), separator);
+};
+var ItemGroup_default = ItemGroup;
+
+// esm-externals:@splunk/ui-utils/i18n
+var i18n_exports = {};
+__export(i18n_exports, {
+  default: () => i18n_default
+});
+var defaultImport5 = __toESM(require("@splunk/ui-utils/i18n"));
+__reExport(i18n_exports, require("@splunk/ui-utils/i18n"));
+var i18n_default = "default" in defaultImport5 ? defaultImport5.default : defaultImport5;
+
+// esm-externals:@splunk/react-ui/Dropdown
+var Dropdown_exports = {};
+__export(Dropdown_exports, {
+  default: () => Dropdown_default
+});
+var defaultImport6 = __toESM(require("@splunk/react-ui/Dropdown"));
+__reExport(Dropdown_exports, require("@splunk/react-ui/Dropdown"));
+var Dropdown_default = "default" in defaultImport6 ? defaultImport6.default : defaultImport6;
+
+// esm-externals:@splunk/react-ui/Menu
+var Menu_exports = {};
+__export(Menu_exports, {
+  default: () => Menu_default
+});
+var defaultImport7 = __toESM(require("@splunk/react-ui/Menu"));
+__reExport(Menu_exports, require("@splunk/react-ui/Menu"));
+var Menu_default = "default" in defaultImport7 ? defaultImport7.default : defaultImport7;
+
+// esm-externals:@splunk/react-icons/ChartColumn
+var ChartColumn_exports = {};
+__export(ChartColumn_exports, {
+  default: () => ChartColumn_default
+});
+var defaultImport8 = __toESM(require("@splunk/react-icons/ChartColumn"));
+__reExport(ChartColumn_exports, require("@splunk/react-icons/ChartColumn"));
+var ChartColumn_default = "default" in defaultImport8 ? defaultImport8.default : defaultImport8;
+
+// esm-externals:@splunk/dashboard-ui
+var dashboard_ui_exports = {};
+__export(dashboard_ui_exports, {
+  default: () => dashboard_ui_default
+});
+var defaultImport9 = __toESM(require("@splunk/dashboard-ui"));
+__reExport(dashboard_ui_exports, require("@splunk/dashboard-ui"));
+var dashboard_ui_default = "default" in defaultImport9 ? defaultImport9.default : defaultImport9;
+
+// esm-externals:@splunk/dashboard-context
+var dashboard_context_exports = {};
+__export(dashboard_context_exports, {
+  default: () => dashboard_context_default
+});
+var defaultImport10 = __toESM(require("@splunk/dashboard-context"));
+__reExport(dashboard_context_exports, require("@splunk/dashboard-context"));
+var dashboard_context_default = "default" in defaultImport10 ? defaultImport10.default : defaultImport10;
+
+// esm-externals:@splunk/dashboard-state
+var dashboard_state_exports = {};
+__export(dashboard_state_exports, {
+  default: () => dashboard_state_default
+});
+var defaultImport11 = __toESM(require("@splunk/dashboard-state"));
+__reExport(dashboard_state_exports, require("@splunk/dashboard-state"));
+var dashboard_state_default = "default" in defaultImport11 ? defaultImport11.default : defaultImport11;
+
+// src/Item.tsx
+var Item_default = styled_components_default.div``;
+
+// src/hooks/useDropdown.ts
+var useDropdown = ({
+  isContentClickClose = true
+}) => {
+  const [isOpen, setIsOpen] = (0, react_exports.useState)(false);
+  const hasChildModal = (0, react_exports.useRef)(false);
+  const handleRequestClose = (0, react_exports.useCallback)(
+    ({ reason }) => {
+      if (reason === "contentClick" && !isContentClickClose) {
+        return;
+      }
+      if (reason === "escapeKey" && hasChildModal.current) {
+        return;
+      }
+      setIsOpen(false);
+    },
+    [isContentClickClose]
+  );
+  const handleRequestOpen = (0, react_exports.useCallback)(() => {
+    setIsOpen(true);
+  }, []);
+  const handleForceClose = (0, react_exports.useCallback)(() => {
+    setIsOpen(false);
+  }, []);
+  const setHasChildModal = (0, react_exports.useCallback)((value) => {
+    hasChildModal.current = value;
+  }, []);
+  return {
+    isOpen,
+    handleRequestOpen,
+    handleRequestClose,
+    handleForceClose,
+    setHasChildModal
+  };
+};
+var useDropdown_default = useDropdown;
+
+// esm-externals:@splunk/react-icons/CaretDown
+var CaretDown_exports = {};
+__export(CaretDown_exports, {
+  default: () => CaretDown_default
+});
+var defaultImport12 = __toESM(require("@splunk/react-icons/CaretDown"));
+__reExport(CaretDown_exports, require("@splunk/react-icons/CaretDown"));
+var CaretDown_default = "default" in defaultImport12 ? defaultImport12.default : defaultImport12;
+
+// esm-externals:@splunk/react-ui/ScreenReaderContent
+var ScreenReaderContent_exports = {};
+__export(ScreenReaderContent_exports, {
+  default: () => ScreenReaderContent_default
+});
+var defaultImport13 = __toESM(require("@splunk/react-ui/ScreenReaderContent"));
+__reExport(ScreenReaderContent_exports, require("@splunk/react-ui/ScreenReaderContent"));
+var ScreenReaderContent_default = "default" in defaultImport13 ? defaultImport13.default : defaultImport13;
+
+// esm-externals:@splunk/react-ui/Button
+var Button_exports = {};
+__export(Button_exports, {
+  default: () => Button_default
+});
+var defaultImport14 = __toESM(require("@splunk/react-ui/Button"));
+__reExport(Button_exports, require("@splunk/react-ui/Button"));
+var Button_default = "default" in defaultImport14 ? defaultImport14.default : defaultImport14;
+
+// src/IconButton.tsx
+var StyledDropdownIcon = styled_components_default(CaretDown_default)`
+    margin-left: -5px;
+`;
+var iconSize = 24;
+var menuIconSize = 20;
+var prepareIcon = (_a) => {
+  var _b = _a, {
+    Icon,
+    screenReaderContent,
+    isMenu = false
+  } = _b, props = __objRest(_b, [
+    "Icon",
+    "screenReaderContent",
+    "isMenu"
+  ]);
+  const size = isMenu ? menuIconSize : iconSize;
+  return /* @__PURE__ */ react_default.createElement(react_default.Fragment, null, /* @__PURE__ */ react_default.createElement(Icon, __spreadValues({ width: size, height: size }, props)), isMenu && /* @__PURE__ */ react_default.createElement(StyledDropdownIcon, { variant: "filled", width: 9, height: size }), screenReaderContent && /* @__PURE__ */ react_default.createElement(ScreenReaderContent_default, null, screenReaderContent));
+};
+
+// src/components/StyledButton.tsx
+var StyledDropdownButton = styled_components_default(Button_default)`
+    max-width: '50px';
+`;
+
+// src/buttons/Charts.tsx
+var ScrollableMenu = styled_components_default(Menu_default).attrs(
+  ({ maxHeight }) => ({
+    style: {
+      maxHeight: maxHeight != null ? maxHeight : void 0
+    }
+  })
+)`
+    overflow-y: auto;
+`;
+var chartsDropdown = prepareIcon({
+  Icon: ChartColumn_default,
+  isMenu: true,
+  screenReaderContent: (0, i18n_exports._)("Add chart")
+});
+
+// esm-externals:@splunk/react-icons/Cog
+var Cog_exports = {};
+__export(Cog_exports, {
+  default: () => Cog_default
+});
+var defaultImport15 = __toESM(require("@splunk/react-icons/Cog"));
+__reExport(Cog_exports, require("@splunk/react-icons/Cog"));
+var Cog_default = "default" in defaultImport15 ? defaultImport15.default : defaultImport15;
+
+// src/buttons/Config.tsx
+var configurationIcon = prepareIcon({
+  Icon: Cog_default,
+  screenReaderContent: (0, i18n_exports._)("Configuration")
+});
+
+// esm-externals:@splunk/react-icons/ArrowBroadUnderbarDown
+var ArrowBroadUnderbarDown_exports = {};
+__export(ArrowBroadUnderbarDown_exports, {
+  default: () => ArrowBroadUnderbarDown_default
+});
+var defaultImport16 = __toESM(require("@splunk/react-icons/ArrowBroadUnderbarDown"));
+__reExport(ArrowBroadUnderbarDown_exports, require("@splunk/react-icons/ArrowBroadUnderbarDown"));
+var ArrowBroadUnderbarDown_default = "default" in defaultImport16 ? defaultImport16.default : defaultImport16;
+
+// src/buttons/ContentExport.tsx
+var icon = prepareIcon({
+  Icon: ArrowBroadUnderbarDown_default,
+  screenReaderContent: (0, i18n_exports._)("Export")
+});
+
+// esm-externals:@splunk/react-icons/CylinderMulti
+var CylinderMulti_exports = {};
+__export(CylinderMulti_exports, {
+  default: () => CylinderMulti_default
+});
+var defaultImport17 = __toESM(require("@splunk/react-icons/CylinderMulti"));
+__reExport(CylinderMulti_exports, require("@splunk/react-icons/CylinderMulti"));
+var CylinderMulti_default = "default" in defaultImport17 ? defaultImport17.default : defaultImport17;
+
+// src/buttons/Data.tsx
+var dataInputIcon = prepareIcon({
+  Icon: CylinderMulti_default,
+  screenReaderContent: (0, i18n_exports._)("Data source overview")
+});
+
+// esm-externals:@splunk/react-icons/Square
+var Square_exports = {};
+__export(Square_exports, {
+  default: () => Square_default
+});
+var defaultImport18 = __toESM(require("@splunk/react-icons/Square"));
+__reExport(Square_exports, require("@splunk/react-icons/Square"));
+var Square_default = "default" in defaultImport18 ? defaultImport18.default : defaultImport18;
+
+// src/buttons/EmptyVisualization.tsx
+var icon2 = prepareIcon({
+  Icon: Square_default,
+  screenReaderContent: (0, i18n_exports._)("Add rectangle")
+});
+
+// esm-externals:@splunk/react-icons/ChevronsOut
+var ChevronsOut_exports = {};
+__export(ChevronsOut_exports, {
+  default: () => ChevronsOut_default
+});
+var defaultImport19 = __toESM(require("@splunk/react-icons/ChevronsOut"));
+__reExport(ChevronsOut_exports, require("@splunk/react-icons/ChevronsOut"));
+var ChevronsOut_default = "default" in defaultImport19 ? defaultImport19.default : defaultImport19;
+
+// src/buttons/Fullscreen.tsx
+var icon3 = prepareIcon({
+  Icon: ChevronsOut_default,
+  screenReaderContent: (0, i18n_exports._)("Fullscreen")
+});
+
+// esm-externals:@splunk/react-ui/Switch
+var Switch_exports = {};
+__export(Switch_exports, {
+  default: () => Switch_default
+});
+var defaultImport20 = __toESM(require("@splunk/react-ui/Switch"));
+__reExport(Switch_exports, require("@splunk/react-ui/Switch"));
+var Switch_default = "default" in defaultImport20 ? defaultImport20.default : defaultImport20;
+
+// src/buttons/GridLineSwitch.tsx
+var SwitchContainer = styled_components_default.div`
+    display: flex;
+    align-items: center;
+    flex-direction: row;
+    gap: ${themes_exports.variables.spacingSmall};
+`;
+var GridLineSwitch = ({
+  dashboardApi,
+  mode,
+  showSeparator,
+  layoutType
+}) => {
+  var _a;
+  const showGrid = (_a = (0, dashboard_state_exports.useSelector)(dashboard_state_exports.selectAreGridLinesEnabled)) != null ? _a : false;
+  const handleClick = (0, react_exports.useCallback)(() => {
+    dashboardApi == null ? void 0 : dashboardApi.toggleGridLines(!showGrid);
+  }, [dashboardApi, showGrid]);
+  const separator = (0, react_exports.useMemo)(
+    () => showSeparator ? /* @__PURE__ */ react_default.createElement(ItemSeparator_default, { key: "item-separator" }) : null,
+    [showSeparator]
+  );
+  if (!dashboardApi || mode !== "edit" || layoutType === "grid") {
+    return null;
+  }
+  return /* @__PURE__ */ react_default.createElement(SwitchContainer, { key: "grid-line-switch" }, /* @__PURE__ */ react_default.createElement(
+    Switch_default,
+    {
+      onClick: handleClick,
+      selected: showGrid,
+      selectedLabel: (0, i18n_exports._)("Gridlines displayed"),
+      unselectedLabel: (0, i18n_exports._)("Gridlines not displayed"),
+      appearance: "toggle",
+      "data-test": "gridline-toggle",
+      "data-clickable": true
+    },
+    (0, i18n_exports._)("Gridlines")
+  ), separator);
+};
+var GridLineSwitch_default = GridLineSwitch;
+
+// esm-externals:@splunk/react-icons/ChartSingleValueIcon
+var ChartSingleValueIcon_exports = {};
+__export(ChartSingleValueIcon_exports, {
+  default: () => ChartSingleValueIcon_default
+});
+var defaultImport21 = __toESM(require("@splunk/react-icons/ChartSingleValueIcon"));
+__reExport(ChartSingleValueIcon_exports, require("@splunk/react-icons/ChartSingleValueIcon"));
+var ChartSingleValueIcon_default = "default" in defaultImport21 ? defaultImport21.default : defaultImport21;
+
+// src/buttons/IconGallery.tsx
+var MenusContainer = styled_components_default.div`
+    display: flex;
+    padding: 5px;
+`;
+var iconGalleryDropdown = prepareIcon({
+  Icon: ChartSingleValueIcon_default,
+  screenReaderContent: (0, i18n_exports._)("Add icon"),
+  isMenu: true
+});
+
+// esm-externals:@splunk/react-icons/QuestionCircle
+var QuestionCircle_exports = {};
+__export(QuestionCircle_exports, {
+  default: () => QuestionCircle_default
+});
+var defaultImport22 = __toESM(require("@splunk/react-icons/QuestionCircle"));
+__reExport(QuestionCircle_exports, require("@splunk/react-icons/QuestionCircle"));
+var QuestionCircle_default = "default" in defaultImport22 ? defaultImport22.default : defaultImport22;
+
+// src/buttons/HelpButton.tsx
+var HelpIcon = prepareIcon({
+  Icon: QuestionCircle_default,
+  screenReaderContent: (0, i18n_exports._)("Help links"),
+  isMenu: true
+});
+
+// esm-externals:@splunk/react-icons/Picture
+var Picture_exports = {};
+__export(Picture_exports, {
+  default: () => Picture_default
+});
+var defaultImport23 = __toESM(require("@splunk/react-icons/Picture"));
+__reExport(Picture_exports, require("@splunk/react-icons/Picture"));
+var Picture_default = "default" in defaultImport23 ? defaultImport23.default : defaultImport23;
+
+// src/buttons/Image.tsx
+var icon4 = prepareIcon({
+  Icon: Picture_default,
+  screenReaderContent: (0, i18n_exports._)("Add image")
+});
+
+// src/buttons/ImageGallery.tsx
+var MenusContainer2 = styled_components_default.div`
+    display: flex;
+    padding: 5px;
+`;
+var imageGalleryDropdown = prepareIcon({
+  Icon: Picture_default,
+  screenReaderContent: (0, i18n_exports._)("Add image"),
+  isMenu: true
+});
+
+// esm-externals:lodash
+var lodash_exports = {};
+__export(lodash_exports, {
+  default: () => lodash_default
+});
+var defaultImport24 = __toESM(require("lodash"));
+__reExport(lodash_exports, require("lodash"));
+var lodash_default = "default" in defaultImport24 ? defaultImport24.default : defaultImport24;
+
+// esm-externals:@splunk/react-icons/SlidersTripleHorizontal
+var SlidersTripleHorizontal_exports = {};
+__export(SlidersTripleHorizontal_exports, {
+  default: () => SlidersTripleHorizontal_default
+});
+var defaultImport25 = __toESM(require("@splunk/react-icons/SlidersTripleHorizontal"));
+__reExport(SlidersTripleHorizontal_exports, require("@splunk/react-icons/SlidersTripleHorizontal"));
+var SlidersTripleHorizontal_default = "default" in defaultImport25 ? defaultImport25.default : defaultImport25;
+
+// esm-externals:@splunk/dashboard-definition
+var dashboard_definition_exports = {};
+__export(dashboard_definition_exports, {
+  default: () => dashboard_definition_default
+});
+var defaultImport26 = __toESM(require("@splunk/dashboard-definition"));
+__reExport(dashboard_definition_exports, require("@splunk/dashboard-definition"));
+var dashboard_definition_default = "default" in defaultImport26 ? defaultImport26.default : defaultImport26;
+
+// src/buttons/Inputs.tsx
+var DEFAULT_PRESET_MAP = Object.freeze({});
+var addInputIcon = prepareIcon({
+  Icon: SlidersTripleHorizontal_default,
+  screenReaderContent: (0, i18n_exports._)("Add input"),
+  isMenu: true
+});
+
+// esm-externals:@splunk/react-icons/Markdown
+var Markdown_exports = {};
+__export(Markdown_exports, {
+  default: () => Markdown_default
+});
+var defaultImport27 = __toESM(require("@splunk/react-icons/Markdown"));
+__reExport(Markdown_exports, require("@splunk/react-icons/Markdown"));
+var Markdown_default = "default" in defaultImport27 ? defaultImport27.default : defaultImport27;
+
+// src/buttons/Markdown.tsx
+var icon5 = prepareIcon({
+  Icon: Markdown_default,
+  screenReaderContent: (0, i18n_exports._)("Add markdown text")
+});
+
+// src/buttons/ModeSwitch.tsx
+var ModeSwitch = () => {
+  const mode = (0, dashboard_state_exports.useSelector)(dashboard_state_exports.selectMode);
+  const dashboardApi = (0, dashboard_context_exports.useDashboardApi)();
+  const appearance = mode === "edit" ? "secondary" : "primary";
+  const label = mode === "edit" ? (0, i18n_exports._)("View") : (0, i18n_exports._)("Edit");
+  const handleClick = (0, react_exports.useCallback)(() => {
+    dashboardApi == null ? void 0 : dashboardApi.switchMode(mode === "edit" ? "view" : "edit");
+  }, [mode, dashboardApi]);
+  return /* @__PURE__ */ react_default.createElement(Item_default, null, /* @__PURE__ */ react_default.createElement(
+    Button_default,
+    {
+      key: "mode-button",
+      "data-clickable": true,
+      "data-test": "mode-button",
+      inline: false,
+      label,
+      appearance,
+      onClick: handleClick
+    }
+  ));
+};
+var ModeSwitch_default = ModeSwitch;
+
+// esm-externals:@splunk/react-icons/ArrowBowRight
+var ArrowBowRight_exports = {};
+__export(ArrowBowRight_exports, {
+  default: () => ArrowBowRight_default
+});
+var defaultImport28 = __toESM(require("@splunk/react-icons/ArrowBowRight"));
+__reExport(ArrowBowRight_exports, require("@splunk/react-icons/ArrowBowRight"));
+var ArrowBowRight_default = "default" in defaultImport28 ? defaultImport28.default : defaultImport28;
+
+// src/buttons/Redo.tsx
+var icon6 = prepareIcon({
+  Icon: ArrowBowRight_default,
+  screenReaderContent: (0, i18n_exports._)("Redo")
+});
+
+// esm-externals:@splunk/react-icons/Circle
+var Circle_exports = {};
+__export(Circle_exports, {
+  default: () => Circle_default
+});
+var defaultImport29 = __toESM(require("@splunk/react-icons/Circle"));
+__reExport(Circle_exports, require("@splunk/react-icons/Circle"));
+var Circle_default = "default" in defaultImport29 ? defaultImport29.default : defaultImport29;
+
+// esm-externals:@splunk/react-icons/Line
+var Line_exports = {};
+__export(Line_exports, {
+  default: () => Line_default
+});
+var defaultImport30 = __toESM(require("@splunk/react-icons/Line"));
+__reExport(Line_exports, require("@splunk/react-icons/Line"));
+var Line_default = "default" in defaultImport30 ? defaultImport30.default : defaultImport30;
+
+// esm-externals:@splunk/react-icons/ShapesVariety
+var ShapesVariety_exports = {};
+__export(ShapesVariety_exports, {
+  default: () => ShapesVariety_default
+});
+var defaultImport31 = __toESM(require("@splunk/react-icons/ShapesVariety"));
+__reExport(ShapesVariety_exports, require("@splunk/react-icons/ShapesVariety"));
+var ShapesVariety_default = "default" in defaultImport31 ? defaultImport31.default : defaultImport31;
+
+// src/PopoverItemButton.tsx
+var StyledContentWrapper = styled_components_default.span`
+    display: flex;
+    flex-direction: row;
+    justify-content: left;
+    align-items: center;
+    max-width: 100%;
+`;
+var StyledIcon = styled_components_default.span`
+    display: inline-block;
+    padding-right: 8px;
+`;
+var StyledLabel = styled_components_default.span`
+    text-overflow: ellipsis;
+    overflow: hidden;
+    flex: 0 1 auto;
+`;
+
+// src/buttons/Shapes.tsx
+var shapesDropdown = prepareIcon({
+  Icon: ShapesVariety_default,
+  screenReaderContent: (0, i18n_exports._)("Add shape"),
+  isMenu: true
+});
+
+// esm-externals:@splunk/react-icons/WindowChevronsSlash
+var WindowChevronsSlash_exports = {};
+__export(WindowChevronsSlash_exports, {
+  default: () => WindowChevronsSlash_default
+});
+var defaultImport32 = __toESM(require("@splunk/react-icons/WindowChevronsSlash"));
+__reExport(WindowChevronsSlash_exports, require("@splunk/react-icons/WindowChevronsSlash"));
+var WindowChevronsSlash_default = "default" in defaultImport32 ? defaultImport32.default : defaultImport32;
+
+// src/buttons/Source.tsx
+var icon7 = prepareIcon({
+  Icon: WindowChevronsSlash_default,
+  screenReaderContent: (0, i18n_exports._)("Source code")
+});
+
+// esm-externals:@splunk/react-icons/ListToken
+var ListToken_exports = {};
+__export(ListToken_exports, {
+  default: () => ListToken_default
+});
+var defaultImport33 = __toESM(require("@splunk/react-icons/ListToken"));
+__reExport(ListToken_exports, require("@splunk/react-icons/ListToken"));
+var ListToken_default = "default" in defaultImport33 ? defaultImport33.default : defaultImport33;
+
+// esm-externals:@splunk/react-ui/Tooltip
+var Tooltip_exports = {};
+__export(Tooltip_exports, {
+  default: () => Tooltip_default
+});
+var defaultImport34 = __toESM(require("@splunk/react-ui/Tooltip"));
+__reExport(Tooltip_exports, require("@splunk/react-ui/Tooltip"));
+var Tooltip_default = "default" in defaultImport34 ? defaultImport34.default : defaultImport34;
+
+// src/buttons/tokenManager/TokenManager.tsx
+var tokenManagerIcon = prepareIcon({
+  Icon: ListToken_default,
+  screenReaderContent: (0, i18n_exports._)("Token manager")
+});
+
+// esm-externals:@splunk/react-icons/ArrowBowLeft
+var ArrowBowLeft_exports = {};
+__export(ArrowBowLeft_exports, {
+  default: () => ArrowBowLeft_default
+});
+var defaultImport35 = __toESM(require("@splunk/react-icons/ArrowBowLeft"));
+__reExport(ArrowBowLeft_exports, require("@splunk/react-icons/ArrowBowLeft"));
+var ArrowBowLeft_default = "default" in defaultImport35 ? defaultImport35.default : defaultImport35;
+
+// src/buttons/Undo.tsx
+var icon8 = prepareIcon({
+  Icon: ArrowBowLeft_default,
+  screenReaderContent: (0, i18n_exports._)("Undo")
+});
+
+// esm-externals:@splunk/dashboard-telemetry
+var dashboard_telemetry_exports = {};
+__export(dashboard_telemetry_exports, {
+  default: () => dashboard_telemetry_default
+});
+var defaultImport36 = __toESM(require("@splunk/dashboard-telemetry"));
+__reExport(dashboard_telemetry_exports, require("@splunk/dashboard-telemetry"));
+var dashboard_telemetry_default = "default" in defaultImport36 ? defaultImport36.default : defaultImport36;
+
+// esm-externals:@splunk/ui-utils/format
+var format_exports = {};
+__export(format_exports, {
+  default: () => format_default
+});
+var defaultImport37 = __toESM(require("@splunk/ui-utils/format"));
+__reExport(format_exports, require("@splunk/ui-utils/format"));
+var format_default = "default" in defaultImport37 ? defaultImport37.default : defaultImport37;
+
+// src/buttons/Zoom/ZoomMenu.tsx
+var zoomLevels = [25, 50, 100, 150, 200];
+var buttonStyle = {
+  borderTopLeftRadius: 0,
+  borderBottomLeftRadius: 0
+};
+var menuStyle = {
+  width: "200px"
+};
+var ZoomMenu = ({
+  dashboardApi,
+  appearance = "default",
+  currentScale,
+  setCurrentScale,
+  scaleType,
+  setScaleType
+}) => {
+  const handleZoomOutClick = (0, react_exports.useCallback)(() => {
+    setScaleType(null);
+    dashboardApi == null ? void 0 : dashboardApi.zoomOut();
+  }, [setScaleType, dashboardApi]);
+  const handleZoomInClick = (0, react_exports.useCallback)(() => {
+    setScaleType(null);
+    dashboardApi == null ? void 0 : dashboardApi.zoomIn();
+  }, [setScaleType, dashboardApi]);
+  const handleScaleChange = (0, react_exports.useCallback)(
+    (scale) => () => {
+      setCurrentScale(scale);
+      setScaleType(null);
+      dashboardApi == null ? void 0 : dashboardApi.setScale({ scale: scale / 100 });
+    },
+    [setScaleType, setCurrentScale, dashboardApi]
+  );
+  const handleFitToWidthClick = (0, react_exports.useCallback)(() => {
+    setScaleType("fit");
+    dashboardApi == null ? void 0 : dashboardApi.fitToWidth();
+  }, [setScaleType, dashboardApi]);
+  const handleAutoClick = (0, react_exports.useCallback)(() => {
+    setScaleType("auto");
+    dashboardApi == null ? void 0 : dashboardApi.fitToWidth({ maxScale: 1 });
+  }, [setScaleType, dashboardApi]);
+  const { handleRequestClose, handleRequestOpen, isOpen } = useDropdown_default({
+    isContentClickClose: true
+  });
+  const buttonToggle = /* @__PURE__ */ react_default.createElement(
+    Button_default,
+    {
+      "data-clickable": true,
+      "data-test": "zoom-dropdown-button",
+      style: buttonStyle,
+      appearance,
+      isMenu: true,
+      "aria-label": (0, format_exports.sprintf)((0, i18n_exports._)("Zoom level, %(currentScale)s%%"), {
+        currentScale
+      })
+    }
+  );
+  const isMacOS = (0, react_exports.useMemo)(() => (0, dashboard_utils_exports.isMac)(), []);
+  const dropdownMenuChildren = (0, react_exports.useMemo)(() => {
+    const zoomButtons = zoomLevels.map((percent) => {
+      return /* @__PURE__ */ react_default.createElement(
+        Menu_default.Item,
+        {
+          "data-test": `${percent}-percent`,
+          onClick: handleScaleChange(percent),
+          key: percent,
+          selectable: true,
+          selected: currentScale === percent && !scaleType
+        },
+        `${percent}%`
+      );
+    });
+    return [
+      /* @__PURE__ */ react_default.createElement(
+        Menu_default.Item,
+        {
+          "data-test": "auto",
+          onClick: handleAutoClick,
+          key: "auto",
+          selectable: true,
+          selected: scaleType === "auto"
+        },
+        (0, i18n_exports._)("Auto")
+      ),
+      /* @__PURE__ */ react_default.createElement(
+        Menu_default.Item,
+        {
+          "data-test": "fit-to-width",
+          onClick: handleFitToWidthClick,
+          key: "fit-to-width",
+          description: isMacOS ? (0, i18n_exports._)("Ctrl Cmd 0") : (0, i18n_exports._)("Ctrl Alt 0"),
+          descriptionPosition: "right",
+          selectable: true,
+          selected: scaleType === "fit"
+        },
+        (0, i18n_exports._)("Fit")
+      ),
+      /* @__PURE__ */ react_default.createElement(Menu_default.Divider, { key: "menu-divider-1" }),
+      ...zoomButtons,
+      /* @__PURE__ */ react_default.createElement(Menu_default.Divider, { key: "menu-divider-2" }),
+      /* @__PURE__ */ react_default.createElement(
+        Menu_default.Item,
+        {
+          "data-test": "zoom-in",
+          onClick: handleZoomInClick,
+          key: "zoom-in",
+          description: isMacOS ? (0, i18n_exports._)("Ctrl Cmd =") : (0, i18n_exports._)("Ctrl Alt ="),
+          descriptionPosition: "right",
+          selectable: true
+        },
+        (0, i18n_exports._)("Zoom in")
+      ),
+      /* @__PURE__ */ react_default.createElement(
+        Menu_default.Item,
+        {
+          "data-test": "zoom-out",
+          onClick: handleZoomOutClick,
+          key: "zoom-out",
+          description: isMacOS ? (0, i18n_exports._)("Ctrl Cmd -") : (0, i18n_exports._)("Ctrl Alt -"),
+          descriptionPosition: "right",
+          selectable: true
+        },
+        (0, i18n_exports._)("Zoom out")
+      )
+    ];
+  }, [
+    currentScale,
+    handleAutoClick,
+    scaleType,
+    handleFitToWidthClick,
+    isMacOS,
+    handleZoomInClick,
+    handleZoomOutClick,
+    handleScaleChange
+  ]);
+  return /* @__PURE__ */ react_default.createElement(
+    Dropdown_default,
+    {
+      onRequestClose: handleRequestClose,
+      onRequestOpen: handleRequestOpen,
+      open: isOpen,
+      toggle: buttonToggle,
+      retainFocus: true
+    },
+    /* @__PURE__ */ react_default.createElement(
+      Menu_default,
+      {
+        style: menuStyle,
+        focusMode: "normal",
+        "aria-label": (0, i18n_exports._)("Zoom level")
+      },
+      dropdownMenuChildren
+    )
+  );
+};
+
+// esm-externals:@splunk/react-ui/Number
+var Number_exports = {};
+__export(Number_exports, {
+  default: () => Number_default
+});
+var defaultImport38 = __toESM(require("@splunk/react-ui/Number"));
+__reExport(Number_exports, require("@splunk/react-ui/Number"));
+var Number_default = "default" in defaultImport38 ? defaultImport38.default : defaultImport38;
+
+// src/buttons/Zoom/ZoomNumber.tsx
+var StyledNumber = styled_components_default(Number_default)`
+    padding-right: ${themes_exports.variables.spacingSmall};
+    & > input {
+        text-align: right;
+    }
+`;
+var StyledEndAdornment = styled_components_default.span`
+    color: ${themes_exports.variables.contentColorActive};
+`;
+var ZoomNumber = ({
+  currentScale,
+  onScaleChange
+}) => {
+  const onValueChange = (0, react_exports.useCallback)(
+    (e, value = 100) => {
+      onScaleChange(value)();
+    },
+    [onScaleChange]
+  );
+  const { handleChange, handleBlur, handleFocus, handleKeyPress } = (0, dashboard_ui_exports.useNumberInput)({
+    value: currentScale,
+    onValueChange
+  });
+  return /* @__PURE__ */ react_default.createElement(
+    StyledNumber,
+    {
+      value: currentScale,
+      onChange: handleChange,
+      onKeyDown: handleKeyPress,
+      onBlur: handleBlur,
+      onFocus: handleFocus,
+      step: 5,
+      min: 1,
+      max: 1e4,
+      roundTo: 0,
+      endAdornment: /* @__PURE__ */ react_default.createElement(StyledEndAdornment, null, "%"),
+      hideStepButtons: true,
+      "data-test": "zoom-number",
+      append: true
+    }
+  );
+};
+
+// src/buttons/Zoom/Zoom.tsx
+var Container = styled_components_default.div`
+    margin-inline-end: 0;
+    display: flex;
+    min-width: 96px;
+    gap: ${themes_exports.variables.spacingSmall};
+`;
+var StyledTooltip = styled_components_default(Tooltip_default)`
+    width: 110px;
+    & span {
+        display: flex;
+    }
+`;
+var Zoom = ({
+  showSeparator = true,
+  appearance = "default",
+  mode = "view"
+}) => {
+  const [currentScale, setCurrentScale] = (0, react_exports.useState)(100);
+  const [scaleType, setScaleType] = (0, react_exports.useState)(null);
+  const telemetry = (0, dashboard_telemetry_exports.useTelemetryApi)();
+  const dashboardApi = (0, dashboard_context_exports.useDashboardApi)();
+  const handleZoom = (0, react_exports.useCallback)((level) => {
+    if (level) {
+      setCurrentScale(Math.round(level * 100));
+    }
+  }, []);
+  const emitTelemetry = (0, react_exports.useMemo)(
+    () => (0, lodash_exports.debounce)(telemetry.emit.bind(telemetry), 500),
+    [telemetry]
+  );
+  (0, react_exports.useEffect)(() => {
+    emitTelemetry({
+      pageAction: "dashboard.zoom",
+      source: "toolbar",
+      event: "dashboard.zoom_level_change",
+      metadata: {
+        scale: currentScale,
+        scaleType,
+        mode
+      }
+    });
+  }, [currentScale, scaleType, emitTelemetry, mode]);
+  const activeTabId = (0, dashboard_state_exports.useSelector)(dashboard_state_exports.selectActiveTab);
+  (0, react_exports.useEffect)(() => {
+    var _a;
+    const subscription = (_a = dashboardApi == null ? void 0 : dashboardApi.getZoomLevel()) == null ? void 0 : _a.subscribe({ next: handleZoom });
+    return () => {
+      subscription == null ? void 0 : subscription.unsubscribe();
+    };
+  }, [dashboardApi, activeTabId, handleZoom]);
+  const separator = (0, react_exports.useMemo)(
+    () => showSeparator ? /* @__PURE__ */ react_default.createElement(ItemSeparator_default, { key: "item-separator" }) : null,
+    [showSeparator]
+  );
+  const handleScaleChange = (0, react_exports.useCallback)(
+    (scale) => () => {
+      setCurrentScale(scale);
+      setScaleType(null);
+      dashboardApi == null ? void 0 : dashboardApi.setScale({ scale: scale / 100 });
+    },
+    [dashboardApi]
+  );
+  return /* @__PURE__ */ react_default.createElement(Container, null, /* @__PURE__ */ react_default.createElement(
+    StyledTooltip,
+    {
+      contentRelationship: "label",
+      content: (0, i18n_exports._)("Zoom level")
+    },
+    /* @__PURE__ */ react_default.createElement(
+      ZoomNumber,
+      {
+        currentScale,
+        onScaleChange: handleScaleChange
+      }
+    ),
+    /* @__PURE__ */ react_default.createElement(
+      ZoomMenu,
+      {
+        dashboardApi,
+        appearance,
+        currentScale,
+        setCurrentScale,
+        scaleType,
+        setScaleType
+      }
+    )
+  ), separator);
+};
+
+// src/groups/EditingGroup.tsx
+var EditingGroup = (props) => {
+  const { enableModeSwitch = true, borders = true, layoutType } = props;
+  const { spacingSmall } = (0, themes_exports.useSplunkTheme)();
+  const modeSwitch = (0, react_exports.useMemo)(() => {
+    if (!enableModeSwitch) {
+      return null;
+    }
+    return /* @__PURE__ */ react_default.createElement(ModeSwitch_default, null);
+  }, [enableModeSwitch]);
+  const zoomControl = (0, react_exports.useMemo)(() => {
+    return layoutType === "absolute" ? [/* @__PURE__ */ react_default.createElement(Zoom, { key: "zoom", showSeparator: borders })] : null;
+  }, [layoutType, borders]);
+  return /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadProps(__spreadValues({}, props), { borders: false, gap: spacingSmall }), /* @__PURE__ */ react_default.createElement(GridLineSwitch_default, { showSeparator: enableModeSwitch && borders }), zoomControl, modeSwitch);
+};
+var EditingGroup_default = EditingGroup;
+//# sourceMappingURL=EditingGroup.js.map