@splunk/dashboard-toolbar 29.5.0 → 29.5.1

package/buttons/Source.js

@@ -127,14 +127,23 @@ var defaultImport7 = __toESM(require("@splunk/react-ui/Button"));
 __reExport(Button_exports, require("@splunk/react-ui/Button"));
 var Button_default = "default" in defaultImport7 ? defaultImport7.default : defaultImport7;
 
+// esm-externals:@splunk/react-ui/Tooltip
+var Tooltip_exports = {};
+__export(Tooltip_exports, {
+  default: () => Tooltip_default
+});
+var defaultImport8 = __toESM(require("@splunk/react-ui/Tooltip"));
+__reExport(Tooltip_exports, require("@splunk/react-ui/Tooltip"));
+var Tooltip_default = "default" in defaultImport8 ? defaultImport8.default : defaultImport8;
+
 // esm-externals:styled-components
 var styled_components_exports = {};
 __export(styled_components_exports, {
   default: () => styled_components_default
 });
-var defaultImport8 = __toESM(require("styled-components"));
+var defaultImport9 = __toESM(require("styled-components"));
 __reExport(styled_components_exports, require("styled-components"));
-var styled_components_default = defaultImport8.default;
+var styled_components_default = defaultImport9.default;
 
 // src/Item.tsx
 var Item_default = styled_components_default.div``;
@@ -165,6 +174,7 @@ var IconButton = (_a) => {
     disabled = false,
     onClick,
     label,
+    tooltipContent,
     testLabel
   } = _b, rest = __objRest(_b, [
     "icon",
@@ -172,9 +182,10 @@ var IconButton = (_a) => {
     "disabled",
     "onClick",
     "label",
+    "tooltipContent",
     "testLabel"
   ]);
-  return /* @__PURE__ */ react_default.createElement(Item_default, __spreadValues({}, rest), /* @__PURE__ */ react_default.createElement(
+  const button = /* @__PURE__ */ react_default.createElement(
     Button_default,
     {
       elementRef: buttonRef,
@@ -186,14 +197,14 @@ var IconButton = (_a) => {
       "data-test": testLabel,
       "data-clickable": true
     }
-  ));
+  );
+  return /* @__PURE__ */ react_default.createElement(Item_default, __spreadValues({}, rest), tooltipContent ? /* @__PURE__ */ react_default.createElement(Tooltip_default, { contentRelationship: "label", content: tooltipContent }, button) : button);
 };
 var IconButton_default = IconButton;
 
 // src/buttons/Source.tsx
 var icon = prepareIcon({
-  Icon: WindowChevronsSlash_default,
-  screenReaderContent: (0, i18n_exports._)("Source code")
+  Icon: WindowChevronsSlash_default
 });
 var Source = ({ disabled = false, onClick }) => {
   const sourceButtonRef = (0, dashboard_context_exports.useToolbarRef)("source");
@@ -214,7 +225,8 @@ var Source = ({ disabled = false, onClick }) => {
       onClick: onSourceClick,
       disabled,
       icon,
-      buttonRef: sourceButtonRef
+      buttonRef: sourceButtonRef,
+      tooltipContent: (0, i18n_exports._)("Source code")
     }
   );
 };

package/buttons/Source.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/buttons/Source.tsx", "esm-externals:react", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/react-icons/WindowChevronsSlash", "esm-externals:@splunk/dashboard-context", "esm-externals:@splunk/react-icons/CaretDown", "esm-externals:@splunk/react-ui/ScreenReaderContent", "esm-externals:@splunk/react-ui/Button", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx"],
-  "sourcesContent": ["import React, { useCallback, type ComponentProps } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport SourceIcon from '@splunk/react-icons/WindowChevronsSlash';\nimport { useRestoreFocus, useToolbarRef } from '@splunk/dashboard-context';\nimport type { ButtonClickHandler } from '@splunk/react-ui/Button';\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nexport interface SourceProps extends ToolbarButtonProps {\n    onClick?: ComponentProps<typeof IconButton>['onClick'];\n    disabled?: boolean;\n}\n\nconst icon = prepareIcon({\n    Icon: SourceIcon,\n    screenReaderContent: _('Source code'),\n});\n\n/**\n * Button that toggles source mode\n */\nconst Source = ({ disabled = false, onClick }: SourceProps) => {\n    const sourceButtonRef = useToolbarRef('source');\n    const setReturnPoint = useRestoreFocus(sourceButtonRef);\n\n    const onSourceClick = useCallback<ButtonClickHandler>(\n        (event, data) => {\n            if (onClick) {\n                onClick(event, data);\n                setReturnPoint();\n            }\n        },\n        [onClick, setReturnPoint]\n    );\n\n    return (\n        <IconButton\n            testLabel=\"source-button\"\n            onClick={onSourceClick}\n            disabled={disabled}\n            icon={icon}\n            buttonRef={sourceButtonRef}\n        />\n    );\n};\n\nexport default Source;\n", "import * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/WindowChevronsSlash\";\nexport * from \"@splunk/react-icons/WindowChevronsSlash\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/dashboard-context\";\nexport * from \"@splunk/dashboard-context\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/ScreenReaderContent\";\nexport * from \"@splunk/react-ui/ScreenReaderContent\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default defaultImport.default;\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n    margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n    Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n    screenReaderContent?: string;\n    isMenu?: boolean;\n    variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n    Icon,\n    screenReaderContent,\n    isMenu = false,\n    ...props\n}: PrepareIconProps) => {\n    const size = isMenu ? menuIconSize : iconSize;\n    return (\n        <>\n            <Icon width={size} height={size} {...props} />\n            {isMenu && (\n                <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n            )}\n            {screenReaderContent && (\n                <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n            )}\n        </>\n    );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n    icon?: JSX.Element;\n    onClick?: ButtonPropsBase['onClick'];\n    label?: string;\n    buttonRef?: React.RefObject<HTMLButtonElement>;\n    testLabel?: string;\n    disabled?: boolean;\n}\n\nconst IconButton = ({\n    icon,\n    buttonRef,\n    disabled = false,\n    onClick,\n    label,\n    testLabel,\n    ...rest\n}: IconButtonProps): JSX.Element => {\n    return (\n        <ToolbarItem {...rest}>\n            <Button\n                elementRef={buttonRef}\n                onClick={onClick}\n                disabled={disabled}\n                appearance=\"subtle\"\n                icon={icon}\n                label={label}\n                data-test={testLabel}\n                data-clickable\n            />\n        </ToolbarItem>\n    );\n};\n\nexport default IconButton;\n"],
-  "mappings": "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",
-  "names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
+  "sources": ["../src/buttons/Source.tsx", "esm-externals:react", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/react-icons/WindowChevronsSlash", "esm-externals:@splunk/dashboard-context", "esm-externals:@splunk/react-icons/CaretDown", "esm-externals:@splunk/react-ui/ScreenReaderContent", "esm-externals:@splunk/react-ui/Button", "esm-externals:@splunk/react-ui/Tooltip", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx"],
+  "sourcesContent": ["import React, { useCallback, type ComponentProps } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport SourceIcon from '@splunk/react-icons/WindowChevronsSlash';\nimport { useRestoreFocus, useToolbarRef } from '@splunk/dashboard-context';\nimport type { ButtonClickHandler } from '@splunk/react-ui/Button';\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nexport interface SourceProps extends ToolbarButtonProps {\n    onClick?: ComponentProps<typeof IconButton>['onClick'];\n    disabled?: boolean;\n}\n\nconst icon = prepareIcon({\n    Icon: SourceIcon,\n});\n\n/**\n * Button that toggles source mode\n */\nconst Source = ({ disabled = false, onClick }: SourceProps) => {\n    const sourceButtonRef = useToolbarRef('source');\n    const setReturnPoint = useRestoreFocus(sourceButtonRef);\n\n    const onSourceClick = useCallback<ButtonClickHandler>(\n        (event, data) => {\n            if (onClick) {\n                onClick(event, data);\n                setReturnPoint();\n            }\n        },\n        [onClick, setReturnPoint]\n    );\n\n    return (\n        <IconButton\n            testLabel=\"source-button\"\n            onClick={onSourceClick}\n            disabled={disabled}\n            icon={icon}\n            buttonRef={sourceButtonRef}\n            tooltipContent={_('Source code')}\n        />\n    );\n};\n\nexport default Source;\n", "import * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/WindowChevronsSlash\";\nexport * from \"@splunk/react-icons/WindowChevronsSlash\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/dashboard-context\";\nexport * from \"@splunk/dashboard-context\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/ScreenReaderContent\";\nexport * from \"@splunk/react-ui/ScreenReaderContent\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Tooltip\";\nexport * from \"@splunk/react-ui/Tooltip\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default defaultImport.default;\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport Tooltip from '@splunk/react-ui/Tooltip';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n    margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n    Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n    screenReaderContent?: string;\n    isMenu?: boolean;\n    variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n    Icon,\n    screenReaderContent,\n    isMenu = false,\n    ...props\n}: PrepareIconProps) => {\n    const size = isMenu ? menuIconSize : iconSize;\n    return (\n        <>\n            <Icon width={size} height={size} {...props} />\n            {isMenu && (\n                <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n            )}\n            {screenReaderContent && (\n                <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n            )}\n        </>\n    );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n    icon?: JSX.Element;\n    onClick?: ButtonPropsBase['onClick'];\n    label?: string;\n    tooltipContent?: string;\n    buttonRef?: React.RefObject<HTMLButtonElement>;\n    testLabel?: string;\n    disabled?: boolean;\n}\n\nconst IconButton = ({\n    icon,\n    buttonRef,\n    disabled = false,\n    onClick,\n    label,\n    tooltipContent,\n    testLabel,\n    ...rest\n}: IconButtonProps): JSX.Element => {\n    const button = (\n        <Button\n            elementRef={buttonRef}\n            onClick={onClick}\n            disabled={disabled}\n            appearance=\"subtle\"\n            icon={icon}\n            label={label}\n            data-test={testLabel}\n            data-clickable\n        />\n    );\n\n    return (\n        <ToolbarItem {...rest}>\n            {tooltipContent ? (\n                <Tooltip contentRelationship=\"label\" content={tooltipContent}>\n                    {button}\n                </Tooltip>\n            ) : (\n                button\n            )}\n        </ToolbarItem>\n    );\n};\n\nexport default IconButton;\n"],
+  "mappings": "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",
+  "names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
 }

package/buttons/Undo.js

@@ -118,14 +118,23 @@ var defaultImport6 = __toESM(require("@splunk/react-ui/Button"));
 __reExport(Button_exports, require("@splunk/react-ui/Button"));
 var Button_default = "default" in defaultImport6 ? defaultImport6.default : defaultImport6;
 
+// esm-externals:@splunk/react-ui/Tooltip
+var Tooltip_exports = {};
+__export(Tooltip_exports, {
+  default: () => Tooltip_default
+});
+var defaultImport7 = __toESM(require("@splunk/react-ui/Tooltip"));
+__reExport(Tooltip_exports, require("@splunk/react-ui/Tooltip"));
+var Tooltip_default = "default" in defaultImport7 ? defaultImport7.default : defaultImport7;
+
 // esm-externals:styled-components
 var styled_components_exports = {};
 __export(styled_components_exports, {
   default: () => styled_components_default
 });
-var defaultImport7 = __toESM(require("styled-components"));
+var defaultImport8 = __toESM(require("styled-components"));
 __reExport(styled_components_exports, require("styled-components"));
-var styled_components_default = defaultImport7.default;
+var styled_components_default = defaultImport8.default;
 
 // src/Item.tsx
 var Item_default = styled_components_default.div``;
@@ -156,6 +165,7 @@ var IconButton = (_a) => {
     disabled = false,
     onClick,
     label,
+    tooltipContent,
     testLabel
   } = _b, rest = __objRest(_b, [
     "icon",
@@ -163,9 +173,10 @@ var IconButton = (_a) => {
     "disabled",
     "onClick",
     "label",
+    "tooltipContent",
     "testLabel"
   ]);
-  return /* @__PURE__ */ react_default.createElement(Item_default, __spreadValues({}, rest), /* @__PURE__ */ react_default.createElement(
+  const button = /* @__PURE__ */ react_default.createElement(
     Button_default,
     {
       elementRef: buttonRef,
@@ -177,14 +188,14 @@ var IconButton = (_a) => {
       "data-test": testLabel,
       "data-clickable": true
     }
-  ));
+  );
+  return /* @__PURE__ */ react_default.createElement(Item_default, __spreadValues({}, rest), tooltipContent ? /* @__PURE__ */ react_default.createElement(Tooltip_default, { contentRelationship: "label", content: tooltipContent }, button) : button);
 };
 var IconButton_default = IconButton;
 
 // src/buttons/Undo.tsx
 var icon = prepareIcon({
-  Icon: ArrowBowLeft_default,
-  screenReaderContent: (0, i18n_exports._)("Undo")
+  Icon: ArrowBowLeft_default
 });
 var Undo = ({ dashboardApi }) => {
   const [canUndo, setCanUndo] = (0, react_exports.useState)(
@@ -219,7 +230,8 @@ var Undo = ({ dashboardApi }) => {
       testLabel: "undo-button",
       onClick: handleClick,
       disabled: !canUndo,
-      icon
+      icon,
+      tooltipContent: (0, i18n_exports._)("Undo")
     }
   );
 };

package/buttons/Undo.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/buttons/Undo.tsx", "esm-externals:react", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/react-icons/ArrowBowLeft", "esm-externals:@splunk/react-icons/CaretDown", "esm-externals:@splunk/react-ui/ScreenReaderContent", "esm-externals:@splunk/react-ui/Button", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx"],
-  "sourcesContent": ["import React, { useCallback, useEffect, useState } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport UndoIcon from '@splunk/react-icons/ArrowBowLeft';\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst icon = prepareIcon({\n    Icon: UndoIcon,\n    screenReaderContent: _('Undo'),\n});\n\nconst Undo = ({ dashboardApi }: ToolbarButtonProps) => {\n    // TODO: replace when history management is done in redux\n    // mode changes can cause the button to mount while there is an undo state\n    const [canUndo, setCanUndo] = useState(\n        () => dashboardApi?.canUndo() ?? false\n    );\n\n    const onDefinitionChange = useCallback(() => {\n        setCanUndo(dashboardApi?.canUndo() ?? false);\n    }, [dashboardApi]);\n\n    useEffect(() => {\n        if (!dashboardApi?.historyManager) {\n            return () => undefined;\n        }\n        // Dirty hack to get the history manager.\n        return dashboardApi.historyManager.subscribe({\n            onAdd: onDefinitionChange,\n            onUndo: onDefinitionChange,\n            onRedo: onDefinitionChange,\n        });\n    }, [dashboardApi, onDefinitionChange]);\n\n    const handleClick = useCallback(() => {\n        if (!dashboardApi) {\n            return;\n        }\n\n        dashboardApi.undo({ source: 'toolbar' });\n    }, [dashboardApi]);\n\n    return (\n        <IconButton\n            testLabel=\"undo-button\"\n            onClick={handleClick}\n            disabled={!canUndo}\n            icon={icon}\n        />\n    );\n};\n\nexport default Undo;\n", "import * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/ArrowBowLeft\";\nexport * from \"@splunk/react-icons/ArrowBowLeft\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/ScreenReaderContent\";\nexport * from \"@splunk/react-ui/ScreenReaderContent\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default defaultImport.default;\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n    margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n    Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n    screenReaderContent?: string;\n    isMenu?: boolean;\n    variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n    Icon,\n    screenReaderContent,\n    isMenu = false,\n    ...props\n}: PrepareIconProps) => {\n    const size = isMenu ? menuIconSize : iconSize;\n    return (\n        <>\n            <Icon width={size} height={size} {...props} />\n            {isMenu && (\n                <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n            )}\n            {screenReaderContent && (\n                <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n            )}\n        </>\n    );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n    icon?: JSX.Element;\n    onClick?: ButtonPropsBase['onClick'];\n    label?: string;\n    buttonRef?: React.RefObject<HTMLButtonElement>;\n    testLabel?: string;\n    disabled?: boolean;\n}\n\nconst IconButton = ({\n    icon,\n    buttonRef,\n    disabled = false,\n    onClick,\n    label,\n    testLabel,\n    ...rest\n}: IconButtonProps): JSX.Element => {\n    return (\n        <ToolbarItem {...rest}>\n            <Button\n                elementRef={buttonRef}\n                onClick={onClick}\n                disabled={disabled}\n                appearance=\"subtle\"\n                icon={icon}\n                label={label}\n                data-test={testLabel}\n                data-clickable\n            />\n        </ToolbarItem>\n    );\n};\n\nexport default IconButton;\n"],
-  "mappings": "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",
-  "names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
+  "sources": ["../src/buttons/Undo.tsx", "esm-externals:react", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/react-icons/ArrowBowLeft", "esm-externals:@splunk/react-icons/CaretDown", "esm-externals:@splunk/react-ui/ScreenReaderContent", "esm-externals:@splunk/react-ui/Button", "esm-externals:@splunk/react-ui/Tooltip", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx"],
+  "sourcesContent": ["import React, { useCallback, useEffect, useState } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport UndoIcon from '@splunk/react-icons/ArrowBowLeft';\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst icon = prepareIcon({\n    Icon: UndoIcon,\n});\n\nconst Undo = ({ dashboardApi }: ToolbarButtonProps) => {\n    // TODO: replace when history management is done in redux\n    // mode changes can cause the button to mount while there is an undo state\n    const [canUndo, setCanUndo] = useState(\n        () => dashboardApi?.canUndo() ?? false\n    );\n\n    const onDefinitionChange = useCallback(() => {\n        setCanUndo(dashboardApi?.canUndo() ?? false);\n    }, [dashboardApi]);\n\n    useEffect(() => {\n        if (!dashboardApi?.historyManager) {\n            return () => undefined;\n        }\n        // Dirty hack to get the history manager.\n        return dashboardApi.historyManager.subscribe({\n            onAdd: onDefinitionChange,\n            onUndo: onDefinitionChange,\n            onRedo: onDefinitionChange,\n        });\n    }, [dashboardApi, onDefinitionChange]);\n\n    const handleClick = useCallback(() => {\n        if (!dashboardApi) {\n            return;\n        }\n\n        dashboardApi.undo({ source: 'toolbar' });\n    }, [dashboardApi]);\n\n    return (\n        <IconButton\n            testLabel=\"undo-button\"\n            onClick={handleClick}\n            disabled={!canUndo}\n            icon={icon}\n            tooltipContent={_('Undo')}\n        />\n    );\n};\n\nexport default Undo;\n", "import * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/ArrowBowLeft\";\nexport * from \"@splunk/react-icons/ArrowBowLeft\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/ScreenReaderContent\";\nexport * from \"@splunk/react-ui/ScreenReaderContent\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Tooltip\";\nexport * from \"@splunk/react-ui/Tooltip\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default defaultImport.default;\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport Tooltip from '@splunk/react-ui/Tooltip';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n    margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n    Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n    screenReaderContent?: string;\n    isMenu?: boolean;\n    variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n    Icon,\n    screenReaderContent,\n    isMenu = false,\n    ...props\n}: PrepareIconProps) => {\n    const size = isMenu ? menuIconSize : iconSize;\n    return (\n        <>\n            <Icon width={size} height={size} {...props} />\n            {isMenu && (\n                <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n            )}\n            {screenReaderContent && (\n                <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n            )}\n        </>\n    );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n    icon?: JSX.Element;\n    onClick?: ButtonPropsBase['onClick'];\n    label?: string;\n    tooltipContent?: string;\n    buttonRef?: React.RefObject<HTMLButtonElement>;\n    testLabel?: string;\n    disabled?: boolean;\n}\n\nconst IconButton = ({\n    icon,\n    buttonRef,\n    disabled = false,\n    onClick,\n    label,\n    tooltipContent,\n    testLabel,\n    ...rest\n}: IconButtonProps): JSX.Element => {\n    const button = (\n        <Button\n            elementRef={buttonRef}\n            onClick={onClick}\n            disabled={disabled}\n            appearance=\"subtle\"\n            icon={icon}\n            label={label}\n            data-test={testLabel}\n            data-clickable\n        />\n    );\n\n    return (\n        <ToolbarItem {...rest}>\n            {tooltipContent ? (\n                <Tooltip contentRelationship=\"label\" content={tooltipContent}>\n                    {button}\n                </Tooltip>\n            ) : (\n                button\n            )}\n        </ToolbarItem>\n    );\n};\n\nexport default IconButton;\n"],
+  "mappings": "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",
+  "names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
 }

package/buttons/index.js

@@ -354,6 +354,7 @@ var IconButton = (_a) => {
     disabled = false,
     onClick,
     label,
+    tooltipContent,
     testLabel
   } = _b, rest = __objRest(_b, [
     "icon",
@@ -361,9 +362,10 @@ var IconButton = (_a) => {
     "disabled",
     "onClick",
     "label",
+    "tooltipContent",
     "testLabel"
   ]);
-  return /* @__PURE__ */ react_default.createElement(Item_default, __spreadValues({}, rest), /* @__PURE__ */ react_default.createElement(
+  const button = /* @__PURE__ */ react_default.createElement(
     Button_default,
     {
       elementRef: buttonRef,
@@ -375,14 +377,25 @@ var IconButton = (_a) => {
       "data-test": testLabel,
       "data-clickable": true
     }
-  ));
+  );
+  return /* @__PURE__ */ react_default.createElement(Item_default, __spreadValues({}, rest), tooltipContent ? /* @__PURE__ */ react_default.createElement(Tooltip_default, { contentRelationship: "label", content: tooltipContent }, button) : button);
 };
 var IconButton_default = IconButton;
 
 // src/components/StyledButton.tsx
-var StyledDropdownButton = styled_components_default(Button_default)`
+var BaseDropdownButton = styled_components_default(Button_default)`
     max-width: '50px';
 `;
+var StyledDropdownButton = react_default.forwardRef((_a, ref) => {
+  var _b = _a, { tooltipContent } = _b, props = __objRest(_b, ["tooltipContent"]);
+  const button = /* @__PURE__ */ react_default.createElement(
+    BaseDropdownButton,
+    __spreadProps(__spreadValues({}, props), {
+      elementRef: ref
+    })
+  );
+  return tooltipContent ? /* @__PURE__ */ react_default.createElement(Tooltip_default, { contentRelationship: "label", content: tooltipContent }, button) : button;
+});
 
 // src/buttons/Charts.tsx
 var ScrollableMenu = styled_components_default(Menu_default).attrs(
@@ -396,8 +409,7 @@ var ScrollableMenu = styled_components_default(Menu_default).attrs(
 `;
 var chartsDropdown = prepareIcon({
   Icon: ChartColumn_default,
-  isMenu: true,
-  screenReaderContent: (0, i18n_exports._)("Add chart")
+  isMenu: true
 });
 var ButtonToggle = /* @__PURE__ */ react_default.createElement(
   StyledDropdownButton,
@@ -405,7 +417,8 @@ var ButtonToggle = /* @__PURE__ */ react_default.createElement(
     "data-test": "charts-button",
     "data-clickable": true,
     appearance: "subtle",
-    icon: chartsDropdown
+    icon: chartsDropdown,
+    tooltipContent: (0, i18n_exports._)("Add chart")
   }
 );
 var focusToggleReasons = [
@@ -533,8 +546,7 @@ var Cog_default = "default" in defaultImport16 ? defaultImport16.default : defau
 
 // src/buttons/Config.tsx
 var configurationIcon = prepareIcon({
-  Icon: Cog_default,
-  screenReaderContent: (0, i18n_exports._)("Configuration")
+  Icon: Cog_default
 });
 var Config = ({ dashboardApi }) => {
   const configButtonRef = (0, dashboard_context_exports.useToolbarRef)("config");
@@ -557,7 +569,8 @@ var Config = ({ dashboardApi }) => {
       buttonRef: configButtonRef,
       testLabel: "config-button",
       onClick: handleClick,
-      icon: configurationIcon
+      icon: configurationIcon,
+      tooltipContent: (0, i18n_exports._)("Configuration")
     }
   );
 };
@@ -574,8 +587,7 @@ var ArrowBroadUnderbarDown_default = "default" in defaultImport17 ? defaultImpor
 
 // src/buttons/ContentExport.tsx
 var icon = prepareIcon({
-  Icon: ArrowBroadUnderbarDown_default,
-  screenReaderContent: (0, i18n_exports._)("Export")
+  Icon: ArrowBroadUnderbarDown_default
 });
 var ContentExport = ({ disabled, onClick }) => /* @__PURE__ */ react_default.createElement(
   IconButton_default,
@@ -583,7 +595,8 @@ var ContentExport = ({ disabled, onClick }) => /* @__PURE__ */ react_default.cre
     testLabel: "content-export-button",
     onClick,
     disabled: !!disabled,
-    icon
+    icon,
+    tooltipContent: (0, i18n_exports._)("Export")
   }
 );
 var ContentExport_default = ContentExport;
@@ -599,8 +612,7 @@ var CylinderMulti_default = "default" in defaultImport18 ? defaultImport18.defau
 
 // src/buttons/Data.tsx
 var dataInputIcon = prepareIcon({
-  Icon: CylinderMulti_default,
-  screenReaderContent: (0, i18n_exports._)("Data source overview")
+  Icon: CylinderMulti_default
 });
 var Data = ({ dashboardApi }) => {
   const dataButtonRef = (0, dashboard_context_exports.useToolbarRef)("dataOverview");
@@ -626,7 +638,8 @@ var Data = ({ dashboardApi }) => {
       buttonRef: dataButtonRef,
       testLabel: "data-button",
       onClick: handleClick,
-      icon: dataInputIcon
+      icon: dataInputIcon,
+      tooltipContent: (0, i18n_exports._)("Data source overview")
     }
   );
 };
@@ -774,8 +787,7 @@ var Square_default = "default" in defaultImport20 ? defaultImport20.default : de
 
 // src/buttons/EmptyVisualization.tsx
 var icon2 = prepareIcon({
-  Icon: Square_default,
-  screenReaderContent: (0, i18n_exports._)("Add rectangle")
+  Icon: Square_default
 });
 var EmptyVisualization = ({ dashboardApi }) => {
   const handleClick = (0, react_exports.useCallback)(() => __async(null, null, function* () {
@@ -797,7 +809,8 @@ var EmptyVisualization = ({ dashboardApi }) => {
     {
       testLabel: "empty-viz-button",
       onClick: handleClick,
-      icon: icon2
+      icon: icon2,
+      tooltipContent: (0, i18n_exports._)("Add rectangle")
     }
   );
 };
@@ -874,8 +887,7 @@ var useToolbarButtonClick = (event, onClick) => {
 
 // src/buttons/Fullscreen.tsx
 var icon3 = prepareIcon({
-  Icon: ChevronsOut_default,
-  screenReaderContent: (0, i18n_exports._)("Fullscreen")
+  Icon: ChevronsOut_default
 });
 var FullScreen = ({ dashboardApi }) => {
   const isFullscreen = !!(0, dashboard_state_exports.useSelector)(dashboard_state_exports.selectFullscreenElement);
@@ -889,7 +901,8 @@ var FullScreen = ({ dashboardApi }) => {
       testLabel: "fullscreen-button",
       onClick: handleClick,
       disabled: isFullscreen,
-      icon: icon3
+      icon: icon3,
+      tooltipContent: (0, i18n_exports._)("Fullscreen")
     }
   );
 };
@@ -971,7 +984,6 @@ var MenusContainer = styled_components_default.div`
 `;
 var iconGalleryDropdown = prepareIcon({
   Icon: ChartSingleValueIcon_default,
-  screenReaderContent: (0, i18n_exports._)("Add icon"),
   isMenu: true
 });
 var focusToggleReasons2 = [
@@ -995,7 +1007,8 @@ var IconGallery = ({ dashboardApi }) => {
         "data-test": "icon-gallery-button",
         "data-clickable": true,
         appearance: "subtle",
-        icon: iconGalleryDropdown
+        icon: iconGalleryDropdown,
+        tooltipContent: (0, i18n_exports._)("Add icon")
       }
     ),
     []
@@ -1050,7 +1063,6 @@ var QuestionCircle_default = "default" in defaultImport24 ? defaultImport24.defa
 // src/buttons/HelpButton.tsx
 var HelpIcon = prepareIcon({
   Icon: QuestionCircle_default,
-  screenReaderContent: (0, i18n_exports._)("Help links"),
   isMenu: true
 });
 var ButtonToggle2 = /* @__PURE__ */ react_default.createElement(
@@ -1059,7 +1071,8 @@ var ButtonToggle2 = /* @__PURE__ */ react_default.createElement(
     appearance: "subtle",
     "data-clickable": true,
     "data-test": "help-button",
-    icon: HelpIcon
+    icon: HelpIcon,
+    tooltipContent: (0, i18n_exports._)("Help links")
   }
 );
 var HelpButton = ({ helpLinks = [] }) => {
@@ -1121,8 +1134,7 @@ var Picture_default = "default" in defaultImport25 ? defaultImport25.default : d
 
 // src/buttons/Image.tsx
 var icon4 = prepareIcon({
-  Icon: Picture_default,
-  screenReaderContent: (0, i18n_exports._)("Add image")
+  Icon: Picture_default
 });
 var Image = ({ dashboardApi }) => {
   const handleClick = (0, react_exports.useCallback)(() => __async(null, null, function* () {
@@ -1143,7 +1155,8 @@ var Image = ({ dashboardApi }) => {
     {
       testLabel: "image-button",
       onClick: handleClick,
-      icon: icon4
+      icon: icon4,
+      tooltipContent: (0, i18n_exports._)("Add image")
     }
   );
 };
@@ -1156,7 +1169,6 @@ var MenusContainer2 = styled_components_default.div`
 `;
 var imageGalleryDropdown = prepareIcon({
   Icon: Picture_default,
-  screenReaderContent: (0, i18n_exports._)("Add image"),
   isMenu: true
 });
 var ButtonToggle3 = /* @__PURE__ */ react_default.createElement(
@@ -1165,7 +1177,8 @@ var ButtonToggle3 = /* @__PURE__ */ react_default.createElement(
     "data-test": "image-gallery-button",
     "data-clickable": true,
     appearance: "subtle",
-    icon: imageGalleryDropdown
+    icon: imageGalleryDropdown,
+    tooltipContent: (0, i18n_exports._)("Add image")
   }
 );
 var focusToggleReasons3 = [];
@@ -1252,7 +1265,6 @@ var focusToggleReasons4 = [
 var DEFAULT_PRESET_MAP = Object.freeze({});
 var addInputIcon = prepareIcon({
   Icon: SlidersTripleHorizontal_default,
-  screenReaderContent: (0, i18n_exports._)("Add input"),
   isMenu: true
 });
 var ButtonToggle4 = /* @__PURE__ */ react_default.createElement(
@@ -1261,7 +1273,8 @@ var ButtonToggle4 = /* @__PURE__ */ react_default.createElement(
     appearance: "subtle",
     "data-clickable": true,
     "data-test": "inputs-button",
-    icon: addInputIcon
+    icon: addInputIcon,
+    tooltipContent: (0, i18n_exports._)("Add input")
   }
 );
 var onCreateInputClickFactory = ({
@@ -1373,8 +1386,7 @@ var Markdown_default = "default" in defaultImport29 ? defaultImport29.default :
 
 // src/buttons/Markdown.tsx
 var icon5 = prepareIcon({
-  Icon: Markdown_default,
-  screenReaderContent: (0, i18n_exports._)("Add markdown text")
+  Icon: Markdown_default
 });
 var Markdown = ({ dashboardApi }) => {
   const handleClick = (0, react_exports.useCallback)(() => {
@@ -1395,7 +1407,8 @@ var Markdown = ({ dashboardApi }) => {
     {
       testLabel: "markdown-button",
       onClick: handleClick,
-      icon: icon5
+      icon: icon5,
+      tooltipContent: (0, i18n_exports._)("Add markdown text")
     }
   );
 };
@@ -1436,8 +1449,7 @@ var ArrowBowRight_default = "default" in defaultImport30 ? defaultImport30.defau
 
 // src/buttons/Redo.tsx
 var icon6 = prepareIcon({
-  Icon: ArrowBowRight_default,
-  screenReaderContent: (0, i18n_exports._)("Redo")
+  Icon: ArrowBowRight_default
 });
 var Redo = ({ dashboardApi }) => {
   const [canRedo, setCanRedo] = (0, react_exports.useState)(
@@ -1472,7 +1484,8 @@ var Redo = ({ dashboardApi }) => {
       testLabel: "redo-button",
       onClick: handleClick,
       disabled: !canRedo,
-      icon: icon6
+      icon: icon6,
+      tooltipContent: (0, i18n_exports._)("Redo")
     }
   );
 };
@@ -1528,7 +1541,6 @@ var PopoverItemButton_default = PopoverItemButton;
 // src/buttons/Shapes.tsx
 var shapesDropdown = prepareIcon({
   Icon: ShapesVariety_default,
-  screenReaderContent: (0, i18n_exports._)("Add shape"),
   isMenu: true
 });
 var ButtonToggle5 = /* @__PURE__ */ react_default.createElement(
@@ -1537,7 +1549,8 @@ var ButtonToggle5 = /* @__PURE__ */ react_default.createElement(
     appearance: "subtle",
     "data-clickable": true,
     "data-test": "shapes-button",
-    icon: shapesDropdown
+    icon: shapesDropdown,
+    tooltipContent: (0, i18n_exports._)("Add shape")
   }
 );
 var focusToggleReasons5 = [
@@ -1637,8 +1650,7 @@ var WindowChevronsSlash_default = "default" in defaultImport34 ? defaultImport34
 
 // src/buttons/Source.tsx
 var icon7 = prepareIcon({
-  Icon: WindowChevronsSlash_default,
-  screenReaderContent: (0, i18n_exports._)("Source code")
+  Icon: WindowChevronsSlash_default
 });
 var Source = ({ disabled = false, onClick }) => {
   const sourceButtonRef = (0, dashboard_context_exports.useToolbarRef)("source");
@@ -1659,7 +1671,8 @@ var Source = ({ disabled = false, onClick }) => {
       onClick: onSourceClick,
       disabled,
       icon: icon7,
-      buttonRef: sourceButtonRef
+      buttonRef: sourceButtonRef,
+      tooltipContent: (0, i18n_exports._)("Source code")
     }
   );
 };
@@ -1676,8 +1689,7 @@ var ListToken_default = "default" in defaultImport35 ? defaultImport35.default :
 
 // src/buttons/tokenManager/TokenManager.tsx
 var tokenManagerIcon = prepareIcon({
-  Icon: ListToken_default,
-  screenReaderContent: (0, i18n_exports._)("Token manager")
+  Icon: ListToken_default
 });
 var TokenManager = ({ dashboardApi }) => {
   const { showTokenManager } = (0, dashboard_context_exports.useFeatureFlags)();
@@ -1698,20 +1710,13 @@ var TokenManager = ({ dashboardApi }) => {
     return null;
   }
   return /* @__PURE__ */ react_default.createElement(
-    Tooltip_default,
+    IconButton_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
-      }
-    )
+      testLabel: "token-manager-button",
+      onClick: handleClick,
+      icon: tokenManagerIcon,
+      tooltipContent: (0, i18n_exports._)("Token manager")
+    }
   );
 };
 
@@ -1726,8 +1731,7 @@ var ArrowBowLeft_default = "default" in defaultImport36 ? defaultImport36.defaul
 
 // src/buttons/Undo.tsx
 var icon8 = prepareIcon({
-  Icon: ArrowBowLeft_default,
-  screenReaderContent: (0, i18n_exports._)("Undo")
+  Icon: ArrowBowLeft_default
 });
 var Undo = ({ dashboardApi }) => {
   const [canUndo, setCanUndo] = (0, react_exports.useState)(
@@ -1762,7 +1766,8 @@ var Undo = ({ dashboardApi }) => {
       testLabel: "undo-button",
       onClick: handleClick,
       disabled: !canUndo,
-      icon: icon8
+      icon: icon8,
+      tooltipContent: (0, i18n_exports._)("Undo")
     }
   );
 };