@splunk/dashboard-toolbar 29.0.0 → 29.1.0

package/groups/index.js

@@ -25,6 +25,7 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -140,7 +141,7 @@ __reExport(Button_exports, require("@splunk/react-ui/Button"));
 var Button_default = "default" in defaultImport5 ? defaultImport5.default : defaultImport5;
 
 // src/hooks/useDropdown.ts
-var useDropdown = ({
+var useDropdown = /* @__PURE__ */ __name(({
   isContentClickClose = true
 }) => {
   const [isOpen, setIsOpen] = (0, react_exports.useState)(false);
@@ -173,7 +174,7 @@ var useDropdown = ({
     handleForceClose,
     setHasChildModal
   };
-};
+}, "useDropdown");
 var useDropdown_default = useDropdown;
 
 // src/groups/ActionsGroup.tsx
@@ -190,7 +191,7 @@ var buttonToggle = /* @__PURE__ */ react_default.createElement(
     appearance: "subtle"
   }
 );
-var ActionsGroup = ({ children }) => {
+var ActionsGroup = /* @__PURE__ */ __name(({ children }) => {
   const { handleRequestClose, handleRequestOpen, isOpen } = useDropdown_default({
     isContentClickClose: true
   });
@@ -204,7 +205,7 @@ var ActionsGroup = ({ children }) => {
     },
     /* @__PURE__ */ react_default.createElement(Menu_default, { style: menuStyle }, children)
   );
-};
+}, "ActionsGroup");
 var ActionsGroup_default = ActionsGroup;
 
 // esm-externals:styled-components
@@ -252,7 +253,7 @@ var Group = styled_components_default.div.attrs({
     flex-direction: row;
     gap: ${(props) => props.gap};
 `;
-var ItemGroup = (_a) => {
+var ItemGroup = /* @__PURE__ */ __name((_a) => {
   var _b = _a, {
     children,
     borders = true,
@@ -268,7 +269,7 @@ var ItemGroup = (_a) => {
   );
   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);
-};
+}, "ItemGroup");
 var ItemGroup_default = ItemGroup;
 
 // esm-externals:@splunk/react-icons/ChartColumn
@@ -334,7 +335,7 @@ var StyledDropdownIcon = styled_components_default(CaretDown_default)`
 `;
 var iconSize = 24;
 var menuIconSize = 20;
-var prepareIcon = (_a) => {
+var prepareIcon = /* @__PURE__ */ __name((_a) => {
   var _b = _a, {
     Icon,
     screenReaderContent,
@@ -346,8 +347,8 @@ var prepareIcon = (_a) => {
   ]);
   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));
-};
-var IconButton = (_a) => {
+}, "prepareIcon");
+var IconButton = /* @__PURE__ */ __name((_a) => {
   var _b = _a, {
     icon: icon9,
     buttonRef,
@@ -376,7 +377,7 @@ var IconButton = (_a) => {
       "data-clickable": true
     }
   ));
-};
+}, "IconButton");
 var IconButton_default = IconButton;
 
 // src/components/StyledButton.tsx
@@ -408,8 +409,11 @@ var ButtonToggle = /* @__PURE__ */ react_default.createElement(
     icon: chartsDropdown
   }
 );
-var focusToggleReasons = [];
-var getVisualizationListFromTaxonomy = ({
+var focusToggleReasons = [
+  "escapeKey",
+  "tabKey"
+];
+var getVisualizationListFromTaxonomy = /* @__PURE__ */ __name(({
   taxonomy,
   handleCreateVisualization
 }) => taxonomy.reduce(
@@ -445,8 +449,8 @@ var getVisualizationListFromTaxonomy = ({
     );
   },
   []
-);
-var Charts = ({ dashboardApi, preset }) => {
+), "getVisualizationListFromTaxonomy");
+var Charts = /* @__PURE__ */ __name(({ dashboardApi, preset }) => {
   const { showNewDataForViz = true } = (0, dashboard_context_exports.useFeatureFlags)();
   const { family } = (0, themes_exports.useSplunkTheme)();
   const { handleForceClose, handleRequestClose, handleRequestOpen, isOpen } = useDropdown_default({
@@ -516,7 +520,7 @@ var Charts = ({ dashboardApi, preset }) => {
     },
     renderScrollableMenu
   ));
-};
+}, "Charts");
 var Charts_default = Charts;
 
 // esm-externals:@splunk/react-icons/Cog
@@ -533,7 +537,7 @@ var configurationIcon = prepareIcon({
   Icon: Cog_default,
   screenReaderContent: (0, i18n_exports._)("Configuration")
 });
-var Config = ({ dashboardApi }) => {
+var Config = /* @__PURE__ */ __name(({ dashboardApi }) => {
   const configButtonRef = (0, dashboard_context_exports.useToolbarRef)("config");
   const handleClick = (0, react_exports.useCallback)(() => {
     const isOpen = (dashboardApi == null ? void 0 : dashboardApi.getOpenedPanel()) === "config";
@@ -557,7 +561,7 @@ var Config = ({ dashboardApi }) => {
       icon: configurationIcon
     }
   );
-};
+}, "Config");
 var Config_default = Config;
 
 // esm-externals:@splunk/react-icons/ArrowBroadUnderbarDown
@@ -589,7 +593,7 @@ var dataInputIcon = prepareIcon({
   Icon: CylinderMulti_default,
   screenReaderContent: (0, i18n_exports._)("Data source overview")
 });
-var Data = ({ dashboardApi }) => {
+var Data = /* @__PURE__ */ __name(({ dashboardApi }) => {
   const dataButtonRef = (0, dashboard_context_exports.useToolbarRef)("dataOverview");
   const handleClick = (0, react_exports.useCallback)(() => {
     const isOpen = (dashboardApi == null ? void 0 : dashboardApi.getOpenedPanel()) === "dataOverview";
@@ -616,7 +620,7 @@ var Data = ({ dashboardApi }) => {
       icon: dataInputIcon
     }
   );
-};
+}, "Data");
 var Data_default = Data;
 
 // esm-externals:@splunk/react-icons/Square
@@ -633,8 +637,8 @@ var icon2 = prepareIcon({
   Icon: Square_default,
   screenReaderContent: (0, i18n_exports._)("Add rectangle")
 });
-var EmptyVisualization = ({ dashboardApi }) => {
-  const handleClick = (0, react_exports.useCallback)(() => __async(void 0, null, function* () {
+var EmptyVisualization = /* @__PURE__ */ __name(({ dashboardApi }) => {
+  const handleClick = (0, react_exports.useCallback)(() => __async(null, null, function* () {
     dashboardApi == null ? void 0 : dashboardApi.createVisualization({
       visualizationDefinition: {
         type: "splunk.rectangle",
@@ -656,7 +660,7 @@ var EmptyVisualization = ({ dashboardApi }) => {
       icon: icon2
     }
   );
-};
+}, "EmptyVisualization");
 var EmptyVisualization_default = EmptyVisualization;
 
 // esm-externals:@splunk/react-icons/ChevronsOut
@@ -673,7 +677,7 @@ var icon3 = prepareIcon({
   Icon: ChevronsOut_default,
   screenReaderContent: (0, i18n_exports._)("Fullscreen")
 });
-var FullScreen = ({ dashboardApi }) => {
+var FullScreen = /* @__PURE__ */ __name(({ dashboardApi }) => {
   const isFullscreen = !!(0, dashboard_state_exports.useSelector)(dashboard_state_exports.selectFullscreenElement);
   const handleClick = (0, react_exports.useCallback)(() => {
     dashboardApi == null ? void 0 : dashboardApi.enterFullscreen();
@@ -687,7 +691,7 @@ var FullScreen = ({ dashboardApi }) => {
       icon: icon3
     }
   );
-};
+}, "FullScreen");
 var Fullscreen_default = FullScreen;
 
 // esm-externals:@splunk/react-ui/Switch
@@ -706,7 +710,7 @@ var SwitchContainer = styled_components_default.div`
     flex-direction: row;
     gap: ${themes_exports.variables.spacingSmall};
 `;
-var GridLineSwitch = ({
+var GridLineSwitch = /* @__PURE__ */ __name(({
   dashboardApi,
   mode,
   showSeparator,
@@ -737,7 +741,7 @@ var GridLineSwitch = ({
     },
     (0, i18n_exports._)("Gridlines")
   ), separator);
-};
+}, "GridLineSwitch");
 var GridLineSwitch_default = GridLineSwitch;
 
 // esm-externals:@splunk/react-icons/ChartSingleValueIcon
@@ -759,8 +763,11 @@ var iconGalleryDropdown = prepareIcon({
   screenReaderContent: (0, i18n_exports._)("Add icon"),
   isMenu: true
 });
-var focusToggleReasons2 = [];
-var IconGallery = ({ dashboardApi }) => {
+var focusToggleReasons2 = [
+  "escapeKey",
+  "tabKey"
+];
+var IconGallery = /* @__PURE__ */ __name(({ dashboardApi }) => {
   const {
     handleForceClose,
     handleRequestClose,
@@ -783,7 +790,7 @@ var IconGallery = ({ dashboardApi }) => {
     []
   );
   const handlePanelClick = (0, react_exports.useCallback)(
-    (iconURL) => __async(void 0, null, function* () {
+    (iconURL) => __async(null, null, function* () {
       dashboardApi == null ? void 0 : dashboardApi.createVisualization({
         visualizationDefinition: {
           type: "splunk.singlevalueicon",
@@ -817,7 +824,7 @@ var IconGallery = ({ dashboardApi }) => {
       }
     ))
   ));
-};
+}, "IconGallery");
 var IconGallery_default = IconGallery;
 
 // esm-externals:@splunk/react-icons/QuestionCircle
@@ -850,8 +857,8 @@ var icon4 = prepareIcon({
   Icon: Picture_default,
   screenReaderContent: (0, i18n_exports._)("Add image")
 });
-var Image = ({ dashboardApi }) => {
-  const handleClick = (0, react_exports.useCallback)(() => __async(void 0, null, function* () {
+var Image = /* @__PURE__ */ __name(({ dashboardApi }) => {
+  const handleClick = (0, react_exports.useCallback)(() => __async(null, null, function* () {
     dashboardApi == null ? void 0 : dashboardApi.createVisualization({
       visualizationDefinition: {
         type: "splunk.image",
@@ -872,7 +879,7 @@ var Image = ({ dashboardApi }) => {
       icon: icon4
     }
   );
-};
+}, "Image");
 var Image_default = Image;
 
 // src/buttons/ImageGallery.tsx
@@ -914,7 +921,10 @@ __reExport(dashboard_definition_exports, require("@splunk/dashboard-definition")
 var dashboard_definition_default = "default" in defaultImport26 ? defaultImport26.default : defaultImport26;
 
 // src/buttons/Inputs.tsx
-var focusToggleReasons3 = [];
+var focusToggleReasons3 = [
+  "escapeKey",
+  "tabKey"
+];
 var DEFAULT_PRESET_MAP = Object.freeze({});
 var addInputIcon = prepareIcon({
   Icon: SlidersTripleHorizontal_default,
@@ -930,7 +940,7 @@ var ButtonToggle2 = /* @__PURE__ */ react_default.createElement(
     icon: addInputIcon
   }
 );
-var onCreateInputClickFactory = ({
+var onCreateInputClickFactory = /* @__PURE__ */ __name(({
   type,
   defaultConfig,
   tokenPrefix,
@@ -951,8 +961,8 @@ var onCreateInputClickFactory = ({
   }
   dashboardApi.addInput(newConfig);
   dashboardApi.openPanel({ activePanel: "config" });
-};
-var Inputs = ({
+}, "onCreateInputClickFactory");
+var Inputs = /* @__PURE__ */ __name(({
   dashboardApi,
   preset = DEFAULT_PRESET_MAP
 }) => {
@@ -1025,7 +1035,7 @@ var Inputs = ({
     },
     /* @__PURE__ */ react_default.createElement(Menu_default, null, InputTypeButtons)
   ));
-};
+}, "Inputs");
 var Inputs_default = Inputs;
 
 // esm-externals:@splunk/react-icons/Markdown
@@ -1042,7 +1052,7 @@ var icon5 = prepareIcon({
   Icon: Markdown_default,
   screenReaderContent: (0, i18n_exports._)("Add markdown text")
 });
-var Markdown = ({ dashboardApi }) => {
+var Markdown = /* @__PURE__ */ __name(({ dashboardApi }) => {
   const handleClick = (0, react_exports.useCallback)(() => {
     dashboardApi == null ? void 0 : dashboardApi.createVisualization({
       visualizationDefinition: {
@@ -1064,11 +1074,11 @@ var Markdown = ({ dashboardApi }) => {
       icon: icon5
     }
   );
-};
+}, "Markdown");
 var Markdown_default2 = Markdown;
 
 // src/buttons/ModeSwitch.tsx
-var ModeSwitch = () => {
+var ModeSwitch = /* @__PURE__ */ __name(() => {
   const mode = (0, dashboard_state_exports.useSelector)(dashboard_state_exports.selectMode);
   const dashboardApi = (0, dashboard_context_exports.useDashboardApi)();
   const appearance = mode === "edit" ? "secondary" : "primary";
@@ -1088,7 +1098,7 @@ var ModeSwitch = () => {
       onClick: handleClick
     }
   ));
-};
+}, "ModeSwitch");
 var ModeSwitch_default = ModeSwitch;
 
 // esm-externals:@splunk/react-icons/ArrowBowRight
@@ -1105,7 +1115,7 @@ var icon6 = prepareIcon({
   Icon: ArrowBowRight_default,
   screenReaderContent: (0, i18n_exports._)("Redo")
 });
-var Redo = ({ dashboardApi }) => {
+var Redo = /* @__PURE__ */ __name(({ dashboardApi }) => {
   const [canRedo, setCanRedo] = (0, react_exports.useState)(
     () => {
       var _a;
@@ -1141,7 +1151,7 @@ var Redo = ({ dashboardApi }) => {
       icon: icon6
     }
   );
-};
+}, "Redo");
 var Redo_default = Redo;
 
 // esm-externals:@splunk/react-icons/Circle
@@ -1188,7 +1198,7 @@ var StyledLabel = styled_components_default.span`
     overflow: hidden;
     flex: 0 1 auto;
 `;
-var PopoverItemButton = ({ icon: icon9, label }) => /* @__PURE__ */ react_default.createElement(StyledContentWrapper, null, icon9 && /* @__PURE__ */ react_default.createElement(StyledIcon, null, icon9), label && /* @__PURE__ */ react_default.createElement(StyledLabel, { "data-test": "label-title" }, label));
+var PopoverItemButton = /* @__PURE__ */ __name(({ icon: icon9, label }) => /* @__PURE__ */ react_default.createElement(StyledContentWrapper, null, icon9 && /* @__PURE__ */ react_default.createElement(StyledIcon, null, icon9), label && /* @__PURE__ */ react_default.createElement(StyledLabel, { "data-test": "label-title" }, label)), "PopoverItemButton");
 var PopoverItemButton_default = PopoverItemButton;
 
 // src/buttons/Shapes.tsx
@@ -1206,11 +1216,14 @@ var ButtonToggle3 = /* @__PURE__ */ react_default.createElement(
     icon: shapesDropdown
   }
 );
-var focusToggleReasons4 = [];
+var focusToggleReasons4 = [
+  "escapeKey",
+  "tabKey"
+];
 var circleIcon = /* @__PURE__ */ react_default.createElement(Circle_default, null);
 var uncheckedBoxIcon = /* @__PURE__ */ react_default.createElement(Square_default, null);
 var lineIcon = /* @__PURE__ */ react_default.createElement(Line_default, null);
-var Shapes = ({ dashboardApi, layoutType }) => {
+var Shapes = /* @__PURE__ */ __name(({ dashboardApi, layoutType }) => {
   const supportLine = layoutType === "absolute";
   const { handleRequestClose, handleRequestOpen, isOpen } = useDropdown_default({
     isContentClickClose: true
@@ -1286,7 +1299,7 @@ var Shapes = ({ dashboardApi, layoutType }) => {
       )
     ))
   ));
-};
+}, "Shapes");
 var Shapes_default = Shapes;
 
 // esm-externals:@splunk/react-icons/WindowChevronsSlash
@@ -1303,7 +1316,7 @@ var icon7 = prepareIcon({
   Icon: WindowChevronsSlash_default,
   screenReaderContent: (0, i18n_exports._)("Source code")
 });
-var Source = ({ disabled = false, onClick }) => /* @__PURE__ */ react_default.createElement(
+var Source = /* @__PURE__ */ __name(({ disabled = false, onClick }) => /* @__PURE__ */ react_default.createElement(
   IconButton_default,
   {
     testLabel: "source-button",
@@ -1311,7 +1324,7 @@ var Source = ({ disabled = false, onClick }) => /* @__PURE__ */ react_default.cr
     disabled,
     icon: icon7
   }
-);
+), "Source");
 var Source_default = Source;
 
 // esm-externals:@splunk/react-icons/ListToken
@@ -1337,6 +1350,41 @@ var tokenManagerIcon = prepareIcon({
   Icon: ListToken_default,
   screenReaderContent: (0, i18n_exports._)("Token manager")
 });
+var TokenManager = /* @__PURE__ */ __name(({ dashboardApi }) => {
+  const { showTokenManager } = (0, dashboard_context_exports.useFeatureFlags)();
+  const handleClick = (0, react_exports.useCallback)(() => {
+    const isOpen = (dashboardApi == null ? void 0 : dashboardApi.getOpenedPanel()) === "tokenManager";
+    if (isOpen) {
+      dashboardApi == null ? void 0 : dashboardApi.closePanel();
+    } else {
+      dashboardApi == null ? void 0 : dashboardApi.openPanel({
+        activePanel: "tokenManager",
+        panelProps: {
+          focusOnOpen: true
+        }
+      });
+    }
+  }, [dashboardApi]);
+  if (!showTokenManager) {
+    return null;
+  }
+  return /* @__PURE__ */ react_default.createElement(
+    Tooltip_default,
+    {
+      contentRelationship: "label",
+      content: (0, i18n_exports._)("Token manager"),
+      "data-test-label": "token-manager-button"
+    },
+    /* @__PURE__ */ react_default.createElement(
+      IconButton_default,
+      {
+        testLabel: "token-manager-button",
+        onClick: handleClick,
+        icon: tokenManagerIcon
+      }
+    )
+  );
+}, "TokenManager");
 
 // esm-externals:@splunk/react-icons/ArrowBowLeft
 var ArrowBowLeft_exports = {};
@@ -1352,7 +1400,7 @@ var icon8 = prepareIcon({
   Icon: ArrowBowLeft_default,
   screenReaderContent: (0, i18n_exports._)("Undo")
 });
-var Undo = ({ dashboardApi }) => {
+var Undo = /* @__PURE__ */ __name(({ dashboardApi }) => {
   const [canUndo, setCanUndo] = (0, react_exports.useState)(
     () => {
       var _a;
@@ -1388,7 +1436,7 @@ var Undo = ({ dashboardApi }) => {
       icon: icon8
     }
   );
-};
+}, "Undo");
 var Undo_default = Undo;
 
 // esm-externals:@splunk/dashboard-telemetry
@@ -1418,7 +1466,7 @@ var buttonStyle = {
 var menuStyle2 = {
   width: "200px"
 };
-var ZoomMenu = ({
+var ZoomMenu = /* @__PURE__ */ __name(({
   dashboardApi,
   appearance = "default",
   currentScale,
@@ -1563,7 +1611,7 @@ var ZoomMenu = ({
       dropdownMenuChildren
     )
   );
-};
+}, "ZoomMenu");
 
 // esm-externals:@splunk/react-ui/Number
 var Number_exports = {};
@@ -1584,7 +1632,7 @@ var StyledNumber = styled_components_default(Number_default)`
 var StyledEndAdornment = styled_components_default.span`
     color: ${themes_exports.variables.contentColorActive};
 `;
-var ZoomNumber = ({
+var ZoomNumber = /* @__PURE__ */ __name(({
   currentScale,
   onScaleChange
 }) => {
@@ -1616,7 +1664,7 @@ var ZoomNumber = ({
       append: true
     }
   );
-};
+}, "ZoomNumber");
 
 // src/buttons/Zoom/Zoom.tsx
 var Container = styled_components_default.div`
@@ -1631,7 +1679,7 @@ var StyledTooltip = styled_components_default(Tooltip_default)`
         display: flex;
     }
 `;
-var Zoom = ({
+var Zoom = /* @__PURE__ */ __name(({
   showSeparator = true,
   appearance = "default",
   mode = "view"
@@ -1706,14 +1754,14 @@ var Zoom = ({
       }
     )
   ), separator);
-};
+}, "Zoom");
 
 // src/groups/ControlGroup.tsx
-var ControlGroup = (props) => /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadValues({}, props), /* @__PURE__ */ react_default.createElement(Fullscreen_default, null));
+var ControlGroup = /* @__PURE__ */ __name((props) => /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadValues({}, props), /* @__PURE__ */ react_default.createElement(Fullscreen_default, null)), "ControlGroup");
 var ControlGroup_default = ControlGroup;
 
 // src/groups/EditingGroup.tsx
-var EditingGroup = (props) => {
+var EditingGroup = /* @__PURE__ */ __name((props) => {
   const { enableModeSwitch = true, borders = true, layoutType } = props;
   const { spacingSmall } = (0, themes_exports.useSplunkTheme)();
   const modeSwitch = (0, react_exports.useMemo)(() => {
@@ -1726,33 +1774,33 @@ var EditingGroup = (props) => {
     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);
-};
+}, "EditingGroup");
 var EditingGroup_default = EditingGroup;
 
 // src/groups/EditorGroup.tsx
-var EditorGroup = (props) => {
+var EditorGroup = /* @__PURE__ */ __name((props) => {
   var _a;
   return /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadValues({ borders: false }, props), /* @__PURE__ */ react_default.createElement(Source_default, { onClick: (_a = props.sourceButtonOnClick) != null ? _a : dashboard_utils_exports.noop }));
-};
+}, "EditorGroup");
 var EditorGroup_default = EditorGroup;
 
 // src/groups/EditorsControlGroup.tsx
-var EditorsControlGroup = (props) => {
+var EditorsControlGroup = /* @__PURE__ */ __name((props) => {
   var _a;
-  return /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadValues({ borders: false }, props), /* @__PURE__ */ react_default.createElement(Config_default, null), /* @__PURE__ */ react_default.createElement(Data_default, null), /* @__PURE__ */ react_default.createElement(Source_default, { onClick: (_a = props.sourceButtonOnClick) != null ? _a : dashboard_utils_exports.noop }));
-};
+  return /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadValues({ borders: false }, props), /* @__PURE__ */ react_default.createElement(Config_default, null), /* @__PURE__ */ react_default.createElement(Data_default, null), /* @__PURE__ */ react_default.createElement(TokenManager, null), /* @__PURE__ */ react_default.createElement(Source_default, { onClick: (_a = props.sourceButtonOnClick) != null ? _a : dashboard_utils_exports.noop }));
+}, "EditorsControlGroup");
 var EditorsControlGroup_default = EditorsControlGroup;
 
 // src/groups/HistoryGroup.tsx
-var HistoryGroup = (props) => /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadValues({}, props), /* @__PURE__ */ react_default.createElement(Undo_default, null), /* @__PURE__ */ react_default.createElement(Redo_default, null));
+var HistoryGroup = /* @__PURE__ */ __name((props) => /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadValues({}, props), /* @__PURE__ */ react_default.createElement(Undo_default, null), /* @__PURE__ */ react_default.createElement(Redo_default, null)), "HistoryGroup");
 var HistoryGroup_default = HistoryGroup;
 
 // src/groups/SidebarControlGroup.tsx
-var SidebarControlGroup = (props) => /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadValues({}, props), /* @__PURE__ */ react_default.createElement(Config_default, null), /* @__PURE__ */ react_default.createElement(Data_default, null));
+var SidebarControlGroup = /* @__PURE__ */ __name((props) => /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadValues({}, props), /* @__PURE__ */ react_default.createElement(Config_default, null), /* @__PURE__ */ react_default.createElement(Data_default, null), /* @__PURE__ */ react_default.createElement(TokenManager, null)), "SidebarControlGroup");
 var SidebarControlGroup_default = SidebarControlGroup;
 
 // src/groups/VisualizationGroup.tsx
-var VisualizationGroup = (props) => {
+var VisualizationGroup = /* @__PURE__ */ __name((props) => {
   const buttons = (0, react_exports.useMemo)(() => {
     if (props.layoutType === "grid") {
       return [
@@ -1773,6 +1821,6 @@ var VisualizationGroup = (props) => {
     ];
   }, [props.layoutType]);
   return /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadValues({}, props), buttons);
-};
+}, "VisualizationGroup");
 var VisualizationGroup_default = VisualizationGroup;
 //# sourceMappingURL=index.js.map