@splunk/dashboard-toolbar 29.0.0 → 29.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CollapsibleToolbar.js +6 -5
- package/CollapsibleToolbar.js.map +2 -2
- package/IconButton.js +5 -4
- package/IconButton.js.map +2 -2
- package/Item.js.map +1 -1
- package/ItemGroup.js +3 -2
- package/ItemGroup.js.map +2 -2
- package/PopoverItemButton.js +2 -1
- package/PopoverItemButton.js.map +2 -2
- package/README.md +1 -1
- package/Toolbar.js +3 -2
- package/Toolbar.js.map +2 -2
- package/buttons/Charts.js +13 -9
- package/buttons/Charts.js.map +3 -3
- package/buttons/Config.js +7 -6
- package/buttons/Config.js.map +2 -2
- package/buttons/ContentExport.js +7 -6
- package/buttons/ContentExport.js.map +2 -2
- package/buttons/Data.js +7 -6
- package/buttons/Data.js.map +2 -2
- package/buttons/EmptyVisualization.js +8 -7
- package/buttons/EmptyVisualization.js.map +2 -2
- package/buttons/ExportDashboardButton.js +3 -2
- package/buttons/ExportDashboardButton.js.map +2 -2
- package/buttons/Fullscreen.js +7 -6
- package/buttons/Fullscreen.js.map +2 -2
- package/buttons/GridLineSwitch.js +3 -2
- package/buttons/GridLineSwitch.js.map +2 -2
- package/buttons/HelpButton.js +7 -6
- package/buttons/HelpButton.js.map +2 -2
- package/buttons/IconGallery.js +12 -8
- package/buttons/IconGallery.js.map +3 -3
- package/buttons/Image.js +8 -7
- package/buttons/Image.js.map +2 -2
- package/buttons/ImageGallery.js +8 -7
- package/buttons/ImageGallery.js.map +2 -2
- package/buttons/Inputs.js +13 -9
- package/buttons/Inputs.js.map +3 -3
- package/buttons/Markdown.js +7 -6
- package/buttons/Markdown.js.map +2 -2
- package/buttons/ModeSwitch.js +3 -2
- package/buttons/ModeSwitch.js.map +2 -2
- package/buttons/Redo.js +7 -6
- package/buttons/Redo.js.map +2 -2
- package/buttons/Shapes.js +12 -8
- package/buttons/Shapes.js.map +3 -3
- package/buttons/Source.js +7 -6
- package/buttons/Source.js.map +2 -2
- package/buttons/Undo.js +7 -6
- package/buttons/Undo.js.map +2 -2
- package/buttons/index.js +84 -67
- package/buttons/index.js.map +3 -3
- package/groups/ActionsGroup.js +5 -4
- package/groups/ActionsGroup.js.map +2 -2
- package/groups/ControlGroup.js +10 -9
- package/groups/ControlGroup.js.map +3 -3
- package/groups/EditingGroup.js +19 -18
- package/groups/EditingGroup.js.map +3 -3
- package/groups/EditorGroup.js +11 -10
- package/groups/EditorGroup.js.map +3 -3
- package/groups/EditorsControlGroup.js +51 -15
- package/groups/EditorsControlGroup.js.map +3 -3
- package/groups/HistoryGroup.js +12 -11
- package/groups/HistoryGroup.js.map +3 -3
- package/groups/SidebarControlGroup.js +47 -11
- package/groups/SidebarControlGroup.js.map +3 -3
- package/groups/VisualizationGroup.js +49 -36
- package/groups/VisualizationGroup.js.map +3 -3
- package/groups/index.js +118 -70
- package/groups/index.js.map +3 -3
- package/index.js +107 -90
- package/index.js.map +3 -3
- package/module/CollapsibleToolbar.js +11 -11
- package/module/IconButton.js +6 -6
- package/module/Item.js +3 -3
- package/module/ItemGroup.js +7 -7
- package/module/PopoverItemButton.js +4 -4
- package/module/Toolbar.js +6 -6
- package/module/buttons/Charts.js +15 -15
- package/module/buttons/Config.js +9 -9
- package/module/buttons/ContentExport.js +9 -9
- package/module/buttons/Data.js +10 -10
- package/module/buttons/EmptyVisualization.js +9 -9
- package/module/buttons/ExportDashboardButton.js +8 -8
- package/module/buttons/Fullscreen.js +9 -9
- package/module/buttons/GridLineSwitch.js +8 -8
- package/module/buttons/HelpButton.js +11 -11
- package/module/buttons/IconGallery.js +11 -11
- package/module/buttons/Image.js +9 -9
- package/module/buttons/ImageGallery.js +12 -12
- package/module/buttons/Inputs.js +11 -11
- package/module/buttons/Markdown.js +8 -8
- package/module/buttons/ModeSwitch.js +9 -9
- package/module/buttons/Redo.js +8 -8
- package/module/buttons/Shapes.js +13 -13
- package/module/buttons/Source.js +8 -8
- package/module/buttons/Undo.js +8 -8
- package/module/buttons/index.js +40 -40
- package/module/chunks/chunk-2G23SAZZ.js +29 -0
- package/module/chunks/{chunk-KJLRQLFH.js.map → chunk-2G23SAZZ.js.map} +1 -1
- package/module/chunks/{chunk-YPVMTO2L.js → chunk-2GRHFRZD.js} +16 -15
- package/module/chunks/{chunk-YPVMTO2L.js.map → chunk-2GRHFRZD.js.map} +1 -1
- package/module/chunks/{chunk-IAEE4XLH.js → chunk-3DNLXDXA.js} +9 -8
- package/module/chunks/{chunk-IAEE4XLH.js.map → chunk-3DNLXDXA.js.map} +2 -2
- package/module/chunks/{chunk-IQG5GSSX.js → chunk-3NDLE64O.js} +8 -7
- package/module/chunks/{chunk-IQG5GSSX.js.map → chunk-3NDLE64O.js.map} +2 -2
- package/module/chunks/{chunk-YKT3CRI6.js → chunk-3QT355V5.js} +2 -2
- package/module/chunks/{chunk-YKT3CRI6.js.map → chunk-3QT355V5.js.map} +1 -1
- package/module/chunks/{chunk-NCPTJ5RB.js → chunk-3R73WRRN.js} +18 -14
- package/module/chunks/chunk-3R73WRRN.js.map +7 -0
- package/module/chunks/{chunk-BRGYD3MR.js → chunk-4L4BWEM7.js} +2 -2
- package/module/chunks/{chunk-BRGYD3MR.js.map → chunk-4L4BWEM7.js.map} +1 -1
- package/module/chunks/{chunk-RODBPKID.js → chunk-4PUMQWA5.js} +6 -5
- package/module/chunks/{chunk-RODBPKID.js.map → chunk-4PUMQWA5.js.map} +2 -2
- package/module/chunks/{chunk-L4ZPYLUY.js → chunk-5CXOMUN4.js} +7 -6
- package/module/chunks/{chunk-L4ZPYLUY.js.map → chunk-5CXOMUN4.js.map} +1 -1
- package/module/chunks/{chunk-X7ATHE2S.js → chunk-5TGHI5GV.js} +2 -2
- package/module/chunks/{chunk-X7ATHE2S.js.map → chunk-5TGHI5GV.js.map} +1 -1
- package/module/chunks/{chunk-NJF2IOVV.js → chunk-6L4PTRMO.js} +2 -2
- package/module/chunks/{chunk-NJF2IOVV.js.map → chunk-6L4PTRMO.js.map} +1 -1
- package/module/chunks/{chunk-E2DI77AU.js → chunk-6VIKADMF.js} +2 -2
- package/module/chunks/{chunk-UPZBDSS7.js → chunk-7CJM54O3.js} +11 -8
- package/module/chunks/{chunk-UPZBDSS7.js.map → chunk-7CJM54O3.js.map} +1 -1
- package/module/chunks/{chunk-GWAXQYWY.js → chunk-AD6EIRYL.js} +11 -10
- package/module/chunks/{chunk-GWAXQYWY.js.map → chunk-AD6EIRYL.js.map} +2 -2
- package/module/chunks/{chunk-J5CY2G3T.js → chunk-AG73TP3S.js} +12 -9
- package/module/chunks/{chunk-J5CY2G3T.js.map → chunk-AG73TP3S.js.map} +1 -1
- package/module/chunks/{chunk-BLXVTG4B.js → chunk-AIH4ILPH.js} +12 -9
- package/module/chunks/{chunk-BLXVTG4B.js.map → chunk-AIH4ILPH.js.map} +1 -1
- package/module/chunks/{chunk-GRIJP4FT.js → chunk-ANTP4L4N.js} +18 -14
- package/module/chunks/chunk-ANTP4L4N.js.map +7 -0
- package/module/chunks/{chunk-4OLWQA6K.js → chunk-AROBR6WM.js} +11 -10
- package/module/chunks/{chunk-4OLWQA6K.js.map → chunk-AROBR6WM.js.map} +2 -2
- package/module/chunks/{chunk-VQIRZ53C.js → chunk-B5OBVUF5.js} +3 -1
- package/module/chunks/{chunk-NIACHGAA.js → chunk-BDLV2ADM.js} +3 -3
- package/module/chunks/{chunk-CFGNNO2V.js → chunk-BR42RPXM.js} +9 -8
- package/module/chunks/{chunk-CFGNNO2V.js.map → chunk-BR42RPXM.js.map} +2 -2
- package/module/chunks/{chunk-HIICL66H.js → chunk-BXDA2XH4.js} +2 -2
- package/module/chunks/{chunk-HIICL66H.js.map → chunk-BXDA2XH4.js.map} +1 -1
- package/module/chunks/{chunk-NWVLNDCF.js → chunk-CXXSJOFS.js} +2 -2
- package/module/chunks/{chunk-NWVLNDCF.js.map → chunk-CXXSJOFS.js.map} +1 -1
- package/module/chunks/{chunk-OSDOIGWB.js → chunk-DU4JCIM3.js} +2 -2
- package/module/chunks/{chunk-OSDOIGWB.js.map → chunk-DU4JCIM3.js.map} +1 -1
- package/module/chunks/{chunk-FVGABOJM.js → chunk-E5POXMHH.js} +15 -11
- package/module/chunks/chunk-E5POXMHH.js.map +7 -0
- package/module/chunks/chunk-FLMBGMR4.js +32 -0
- package/module/chunks/chunk-FLMBGMR4.js.map +7 -0
- package/module/chunks/{chunk-734QWOYU.js → chunk-GIXERSIF.js} +11 -10
- package/module/chunks/{chunk-734QWOYU.js.map → chunk-GIXERSIF.js.map} +1 -1
- package/module/chunks/{chunk-JXPIKVRZ.js → chunk-GUWB2JIP.js} +11 -10
- package/module/chunks/{chunk-JXPIKVRZ.js.map → chunk-GUWB2JIP.js.map} +1 -1
- package/module/chunks/{chunk-SIFZZCPT.js → chunk-HPEHWRJP.js} +31 -26
- package/module/chunks/chunk-HPEHWRJP.js.map +7 -0
- package/module/chunks/{chunk-52TYQW2Y.js → chunk-HTZYYFJO.js} +2 -2
- package/module/chunks/{chunk-52TYQW2Y.js.map → chunk-HTZYYFJO.js.map} +1 -1
- package/module/chunks/{chunk-JLYV2H24.js → chunk-HXK4QHPR.js} +3 -3
- package/module/chunks/{chunk-BSMCGXVQ.js → chunk-I7XN7DKU.js} +2 -2
- package/module/chunks/{chunk-BSMCGXVQ.js.map → chunk-I7XN7DKU.js.map} +1 -1
- package/module/chunks/{chunk-AWNWXBE4.js → chunk-JHFAWC4B.js} +9 -8
- package/module/chunks/{chunk-AWNWXBE4.js.map → chunk-JHFAWC4B.js.map} +2 -2
- package/module/chunks/{chunk-XUK4ZKWN.js → chunk-KDMM6KX4.js} +9 -8
- package/module/chunks/{chunk-XUK4ZKWN.js.map → chunk-KDMM6KX4.js.map} +1 -1
- package/module/chunks/{chunk-G6N5OMKL.js → chunk-L2MCGOFY.js} +2 -2
- package/module/chunks/{chunk-G6N5OMKL.js.map → chunk-L2MCGOFY.js.map} +1 -1
- package/module/chunks/{chunk-OIQNUT2X.js → chunk-LATZ7CUV.js} +7 -4
- package/module/chunks/{chunk-OIQNUT2X.js.map → chunk-LATZ7CUV.js.map} +1 -1
- package/module/chunks/{chunk-ECEBJH6K.js → chunk-LKIWD6NR.js} +12 -11
- package/module/chunks/{chunk-ECEBJH6K.js.map → chunk-LKIWD6NR.js.map} +2 -2
- package/module/chunks/{chunk-2QMHWIV5.js → chunk-N3HJVTLY.js} +16 -15
- package/module/chunks/{chunk-2QMHWIV5.js.map → chunk-N3HJVTLY.js.map} +2 -2
- package/module/chunks/{chunk-J2TRUM5N.js → chunk-PHOUPWEN.js} +2 -2
- package/module/chunks/{chunk-J2TRUM5N.js.map → chunk-PHOUPWEN.js.map} +1 -1
- package/module/chunks/{chunk-HXY4TSUO.js → chunk-PMXVITCC.js} +2 -2
- package/module/chunks/{chunk-HXY4TSUO.js.map → chunk-PMXVITCC.js.map} +1 -1
- package/module/chunks/{chunk-B2LPQWLD.js → chunk-Q4EASNDZ.js} +10 -9
- package/module/chunks/{chunk-B2LPQWLD.js.map → chunk-Q4EASNDZ.js.map} +2 -2
- package/module/chunks/{chunk-IGGLU44N.js → chunk-QPUZLO5O.js} +2 -2
- package/module/chunks/{chunk-IGGLU44N.js.map → chunk-QPUZLO5O.js.map} +1 -1
- package/module/chunks/{chunk-QU7RW3YZ.js → chunk-SELLU76G.js} +10 -7
- package/module/chunks/{chunk-QU7RW3YZ.js.map → chunk-SELLU76G.js.map} +1 -1
- package/module/chunks/{chunk-JILFF3WY.js → chunk-SMDUMR2P.js} +18 -14
- package/module/chunks/chunk-SMDUMR2P.js.map +7 -0
- package/module/chunks/{chunk-72YLBMXL.js → chunk-SPVRIPCR.js} +23 -19
- package/module/chunks/chunk-SPVRIPCR.js.map +7 -0
- package/module/chunks/{chunk-KEARZQAT.js → chunk-SRI3BMZH.js} +11 -10
- package/module/chunks/{chunk-KEARZQAT.js.map → chunk-SRI3BMZH.js.map} +1 -1
- package/module/chunks/{chunk-ETJ5YPF3.js → chunk-TLNR3NED.js} +9 -8
- package/module/chunks/{chunk-ETJ5YPF3.js.map → chunk-TLNR3NED.js.map} +1 -1
- package/module/chunks/{chunk-OTGQ73VF.js → chunk-UERW7LTA.js} +8 -7
- package/module/chunks/{chunk-OTGQ73VF.js.map → chunk-UERW7LTA.js.map} +2 -2
- package/module/chunks/{chunk-A3BAVEME.js → chunk-WPBXWBTX.js} +8 -7
- package/module/chunks/{chunk-A3BAVEME.js.map → chunk-WPBXWBTX.js.map} +2 -2
- package/module/chunks/{chunk-X2HLBQUA.js → chunk-YBGLF5LF.js} +14 -13
- package/module/chunks/{chunk-X2HLBQUA.js.map → chunk-YBGLF5LF.js.map} +1 -1
- package/module/chunks/{chunk-FSOMEJXM.js → chunk-ZCC73T4R.js} +8 -7
- package/module/chunks/{chunk-FSOMEJXM.js.map → chunk-ZCC73T4R.js.map} +2 -2
- package/module/groups/ActionsGroup.js +7 -7
- package/module/groups/ControlGroup.js +42 -42
- package/module/groups/EditingGroup.js +42 -42
- package/module/groups/EditorGroup.js +42 -42
- package/module/groups/EditorsControlGroup.js +42 -42
- package/module/groups/HistoryGroup.js +42 -42
- package/module/groups/SidebarControlGroup.js +42 -42
- package/module/groups/VisualizationGroup.js +42 -42
- package/module/groups/index.js +49 -49
- package/module/index.js +51 -51
- package/package.json +18 -18
- package/types/buttons/Charts.d.ts.map +1 -1
- package/types/buttons/IconGallery.d.ts.map +1 -1
- package/types/buttons/Inputs.d.ts.map +1 -1
- package/types/buttons/Shapes.d.ts.map +1 -1
- package/types/buttons/tokenManager/TokenManager.d.ts +1 -1
- package/types/buttons/tokenManager/TokenManager.d.ts.map +1 -1
- package/types/groups/EditorsControlGroup.d.ts.map +1 -1
- package/types/groups/SidebarControlGroup.d.ts.map +1 -1
- package/module/chunks/chunk-72YLBMXL.js.map +0 -7
- package/module/chunks/chunk-FVGABOJM.js.map +0 -7
- package/module/chunks/chunk-GRIJP4FT.js.map +0 -7
- package/module/chunks/chunk-JILFF3WY.js.map +0 -7
- package/module/chunks/chunk-KJLRQLFH.js +0 -28
- package/module/chunks/chunk-NCPTJ5RB.js.map +0 -7
- package/module/chunks/chunk-SIFZZCPT.js.map +0 -7
- package/module/chunks/chunk-WFAY6ABE.js +0 -28
- package/module/chunks/chunk-WFAY6ABE.js.map +0 -7
- package/tsconfig.json +0 -9
- /package/module/chunks/{chunk-E2DI77AU.js.map → chunk-6VIKADMF.js.map} +0 -0
- /package/module/chunks/{chunk-VQIRZ53C.js.map → chunk-B5OBVUF5.js.map} +0 -0
- /package/module/chunks/{chunk-NIACHGAA.js.map → chunk-BDLV2ADM.js.map} +0 -0
- /package/module/chunks/{chunk-JLYV2H24.js.map → chunk-HXK4QHPR.js.map} +0 -0
package/groups/ControlGroup.js
CHANGED
|
@@ -22,6 +22,7 @@ var __spreadValues = (a, b) => {
|
|
|
22
22
|
}
|
|
23
23
|
return a;
|
|
24
24
|
};
|
|
25
|
+
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
25
26
|
var __objRest = (source, exclude) => {
|
|
26
27
|
var target = {};
|
|
27
28
|
for (var prop in source)
|
|
@@ -118,7 +119,7 @@ var Group = styled_components_default.div.attrs({
|
|
|
118
119
|
flex-direction: row;
|
|
119
120
|
gap: ${(props) => props.gap};
|
|
120
121
|
`;
|
|
121
|
-
var ItemGroup = (_a) => {
|
|
122
|
+
var ItemGroup = /* @__PURE__ */ __name((_a) => {
|
|
122
123
|
var _b = _a, {
|
|
123
124
|
children,
|
|
124
125
|
borders = true,
|
|
@@ -134,7 +135,7 @@ var ItemGroup = (_a) => {
|
|
|
134
135
|
);
|
|
135
136
|
const separator = borders ? /* @__PURE__ */ react_default.createElement(ItemSeparator_default, null) : null;
|
|
136
137
|
return /* @__PURE__ */ react_default.createElement(react_default.Fragment, null, /* @__PURE__ */ react_default.createElement(Group, { gap: (0, dashboard_utils_exports.toPx)(gap, 2) }, items), separator);
|
|
137
|
-
};
|
|
138
|
+
}, "ItemGroup");
|
|
138
139
|
var ItemGroup_default = ItemGroup;
|
|
139
140
|
|
|
140
141
|
// esm-externals:@splunk/ui-utils/i18n
|
|
@@ -236,7 +237,7 @@ var StyledDropdownIcon = styled_components_default(CaretDown_default)`
|
|
|
236
237
|
`;
|
|
237
238
|
var iconSize = 24;
|
|
238
239
|
var menuIconSize = 20;
|
|
239
|
-
var prepareIcon = (_a) => {
|
|
240
|
+
var prepareIcon = /* @__PURE__ */ __name((_a) => {
|
|
240
241
|
var _b = _a, {
|
|
241
242
|
Icon,
|
|
242
243
|
screenReaderContent,
|
|
@@ -248,8 +249,8 @@ var prepareIcon = (_a) => {
|
|
|
248
249
|
]);
|
|
249
250
|
const size = isMenu ? menuIconSize : iconSize;
|
|
250
251
|
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));
|
|
251
|
-
};
|
|
252
|
-
var IconButton = (_a) => {
|
|
252
|
+
}, "prepareIcon");
|
|
253
|
+
var IconButton = /* @__PURE__ */ __name((_a) => {
|
|
253
254
|
var _b = _a, {
|
|
254
255
|
icon: icon9,
|
|
255
256
|
buttonRef,
|
|
@@ -278,7 +279,7 @@ var IconButton = (_a) => {
|
|
|
278
279
|
"data-clickable": true
|
|
279
280
|
}
|
|
280
281
|
));
|
|
281
|
-
};
|
|
282
|
+
}, "IconButton");
|
|
282
283
|
var IconButton_default = IconButton;
|
|
283
284
|
|
|
284
285
|
// src/components/StyledButton.tsx
|
|
@@ -376,7 +377,7 @@ var icon3 = prepareIcon({
|
|
|
376
377
|
Icon: ChevronsOut_default,
|
|
377
378
|
screenReaderContent: (0, i18n_exports._)("Fullscreen")
|
|
378
379
|
});
|
|
379
|
-
var FullScreen = ({ dashboardApi }) => {
|
|
380
|
+
var FullScreen = /* @__PURE__ */ __name(({ dashboardApi }) => {
|
|
380
381
|
const isFullscreen = !!(0, dashboard_state_exports.useSelector)(dashboard_state_exports.selectFullscreenElement);
|
|
381
382
|
const handleClick = (0, react_exports.useCallback)(() => {
|
|
382
383
|
dashboardApi == null ? void 0 : dashboardApi.enterFullscreen();
|
|
@@ -390,7 +391,7 @@ var FullScreen = ({ dashboardApi }) => {
|
|
|
390
391
|
icon: icon3
|
|
391
392
|
}
|
|
392
393
|
);
|
|
393
|
-
};
|
|
394
|
+
}, "FullScreen");
|
|
394
395
|
var Fullscreen_default = FullScreen;
|
|
395
396
|
|
|
396
397
|
// esm-externals:@splunk/react-ui/Switch
|
|
@@ -696,6 +697,6 @@ var StyledTooltip = styled_components_default(Tooltip_default)`
|
|
|
696
697
|
`;
|
|
697
698
|
|
|
698
699
|
// src/groups/ControlGroup.tsx
|
|
699
|
-
var ControlGroup = (props) => /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadValues({}, props), /* @__PURE__ */ react_default.createElement(Fullscreen_default, null));
|
|
700
|
+
var ControlGroup = /* @__PURE__ */ __name((props) => /* @__PURE__ */ react_default.createElement(ItemGroup_default, __spreadValues({}, props), /* @__PURE__ */ react_default.createElement(Fullscreen_default, null)), "ControlGroup");
|
|
700
701
|
var ControlGroup_default = ControlGroup;
|
|
701
702
|
//# sourceMappingURL=ControlGroup.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../src/groups/ControlGroup.tsx", "react", "styled-components", "
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport ItemGroup from '../ItemGroup';\nimport { Fullscreen } from '../buttons';\n\n/**\n * Control button group\n */\nconst ControlGroup = (props: React.ComponentProps<typeof ItemGroup>) => (\n <ItemGroup {...props}>\n <Fullscreen />\n </ItemGroup>\n);\n\nexport default ControlGroup;\n", "\nimport * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/dashboard-utils\";\nexport * from \"@splunk/dashboard-utils\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/themes\";\nexport * from \"@splunk/themes\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\nimport { variables } from '@splunk/themes';\n\nconst ItemSeparator = styled.div`\n border-left-width: 1px;\n border-left-style: solid;\n border-left-color: ${variables.interactiveColorBorder};\n width: 0px;\n height: ${variables.inputHeight};\n`;\n\nexport default ItemSeparator;\n", "import React from 'react';\nimport styled from 'styled-components';\nimport type { ButtonClickHandler } from '@splunk/react-ui/Button';\nimport { toPx } from '@splunk/dashboard-utils';\nimport type { ToolbarButtonProps } from './types/common';\nimport ItemSeparator from './components/ItemSeparator';\n\nconst Group = styled.div.attrs({\n 'data-test': 'toolbar-item-group',\n})<{ gap: string }>`\n display: flex;\n flex-direction: row;\n gap: ${(props) => props.gap};\n`;\n\nexport type ItemGroupProps = {\n borders?: boolean;\n children?: React.ReactNode;\n align?: 'left' | 'right';\n sourceButtonOnClick?: ButtonClickHandler;\n gap?: number | string;\n [key: string]: unknown;\n} & ToolbarButtonProps;\n\nconst ItemGroup = ({\n children,\n borders = true,\n gap,\n ...rest\n}: ItemGroupProps) => {\n const items = React.Children.map(\n children,\n (child) => child && React.cloneElement(child as JSX.Element, rest)\n );\n const separator = borders ? <ItemSeparator /> : null;\n return (\n <>\n <Group gap={toPx(gap, 2)}>{items}</Group>\n {separator}\n </>\n );\n};\n\nexport default ItemGroup;\n", "\nimport * as defaultImport from \"@splunk/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-ui/Dropdown\";\nexport * from \"@splunk/react-ui/Dropdown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-ui/Menu\";\nexport * from \"@splunk/react-ui/Menu\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/ChartColumn\";\nexport * from \"@splunk/react-icons/ChartColumn\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/dashboard-ui\";\nexport * from \"@splunk/dashboard-ui\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/dashboard-context\";\nexport * from \"@splunk/dashboard-context\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/dashboard-state\";\nexport * from \"@splunk/dashboard-state\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "\nimport * as defaultImport from \"@splunk/react-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-ui/ScreenReaderContent\";\nexport * from \"@splunk/react-ui/ScreenReaderContent\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-ui/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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", "import Button from '@splunk/react-ui/Button';\nimport styled from 'styled-components';\n\nexport const StyledDropdownButton = styled(Button)`\n max-width: '50px';\n`;\n", "import React, { useCallback, useMemo } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport styled from 'styled-components';\nimport Dropdown, {\n type DropdownChildrenRenderer,\n type DropdownPossibleCloseReason,\n} from '@splunk/react-ui/Dropdown';\nimport Menu from '@splunk/react-ui/Menu';\nimport { SplunkThemeProvider, useSplunkTheme } from '@splunk/themes';\n\nimport AddChartDropdown from '@splunk/react-icons/ChartColumn';\n\nimport { VisualizationFilter, type Taxonomy } from '@splunk/dashboard-ui';\nimport { useFeatureFlags } from '@splunk/dashboard-context';\nimport { batch } from '@splunk/dashboard-state';\nimport ToolbarItem from '../Item';\nimport useDropdown from '../hooks/useDropdown';\nimport type { ToolbarButtonProps } from '../types/common';\nimport { prepareIcon } from '../IconButton';\nimport { StyledDropdownButton } from '../components/StyledButton';\n\ninterface ScrollableMenuProps {\n maxHeight?: number | null;\n}\n\nconst ScrollableMenu = styled(Menu).attrs<ScrollableMenuProps>(\n ({ maxHeight }) => ({\n style: {\n maxHeight: maxHeight ?? undefined,\n },\n })\n)<ScrollableMenuProps>`\n overflow-y: auto;\n`;\n\nconst chartsDropdown = prepareIcon({\n Icon: AddChartDropdown,\n isMenu: true,\n screenReaderContent: _('Add chart'),\n});\n\nconst ButtonToggle = (\n <StyledDropdownButton\n data-test=\"charts-button\"\n data-clickable\n appearance=\"subtle\"\n icon={chartsDropdown}\n />\n);\n\nconst focusToggleReasons: DropdownPossibleCloseReason[] = [];\n\ntype Visualizations = Taxonomy[number]['visualizations'];\n\n/**\n * export for unit testing\n * @private\n */\nexport const getVisualizationListFromTaxonomy = ({\n taxonomy,\n handleCreateVisualization,\n}: {\n taxonomy: Taxonomy;\n handleCreateVisualization: (opt: {\n type: string;\n options: Record<string, unknown>;\n }) => () => void;\n}): JSX.Element[] =>\n taxonomy.reduce(\n (list: React.ReactElement[], { visualizations, category }) => {\n const availableVisualizations: Visualizations =\n visualizations.filter((props) => props.includeInToolbar);\n\n if (availableVisualizations.length === 0) {\n return list;\n }\n\n list.push(<Menu.Divider key={`menu-divider-${category}`} />);\n\n return list.concat(\n availableVisualizations.map((vizProps) => {\n const { label, type, initialOptions } = vizProps;\n const Icon = vizProps.icon as React.JSXElementConstructor<\n Record<string, unknown>\n > | null;\n\n if (!type) {\n return null;\n }\n\n const onClick = handleCreateVisualization({\n type,\n options: initialOptions as Record<string, unknown>,\n });\n\n return (\n <Menu.Item\n data-test={`add-${type}-button`}\n data-test-clickable\n onClick={onClick}\n startAdornment={!!Icon && <Icon size=\"18px\" />}\n key={`add-${type}-button`}\n >\n {label}\n </Menu.Item>\n );\n }) as JSX.Element[]\n );\n },\n []\n );\n\n/**\n * Charts button that has a dropdown menu.\n */\nconst Charts = ({ dashboardApi, preset }: ToolbarButtonProps): JSX.Element => {\n const { showNewDataForViz = true } = useFeatureFlags();\n\n const { family } = useSplunkTheme();\n const { handleForceClose, handleRequestClose, handleRequestOpen, isOpen } =\n useDropdown({\n isContentClickClose: false,\n });\n\n const taxonomy: Taxonomy = useMemo(\n () => new VisualizationFilter(preset).taxonomy,\n [preset]\n );\n\n const handleCreateVisualization = useCallback(\n ({\n type,\n options,\n }: {\n type: string;\n options: Record<string, unknown>;\n }) =>\n () => {\n batch(() => {\n dashboardApi?.createVisualization({\n visualizationDefinition: { type, options },\n });\n\n if (showNewDataForViz) {\n dashboardApi?.openPanel({\n activePanel: 'connectData',\n panelProps: {\n bindingType: 'primary',\n from: {\n activePanel: 'config',\n },\n },\n });\n }\n });\n\n handleForceClose();\n },\n [dashboardApi, showNewDataForViz, handleForceClose]\n );\n\n const visualizationList = useMemo(\n () =>\n getVisualizationListFromTaxonomy({\n taxonomy,\n handleCreateVisualization,\n }),\n [taxonomy, handleCreateVisualization]\n );\n\n const renderScrollableMenu = useCallback<DropdownChildrenRenderer>(\n ({ maxHeight }) => (\n <SplunkThemeProvider\n density={family === 'enterprise' ? 'comfortable' : 'compact'}\n >\n <ScrollableMenu\n maxHeight={maxHeight}\n data-test=\"add-chart-menu\"\n >\n {visualizationList}\n </ScrollableMenu>\n </SplunkThemeProvider>\n ),\n [family, visualizationList]\n );\n\n return (\n <ToolbarItem>\n <Dropdown\n focusToggleReasons={focusToggleReasons}\n onRequestClose={handleRequestClose}\n onRequestOpen={handleRequestOpen}\n open={isOpen}\n toggle={ButtonToggle}\n >\n {renderScrollableMenu}\n </Dropdown>\n </ToolbarItem>\n );\n};\n\nexport default Charts;\n", "\nimport * as defaultImport from \"@splunk/react-icons/Cog\";\nexport * from \"@splunk/react-icons/Cog\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport Configuration from '@splunk/react-icons/Cog';\nimport { useToolbarRef } from '@splunk/dashboard-context';\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst configurationIcon = prepareIcon({\n Icon: Configuration,\n screenReaderContent: _('Configuration'),\n});\n\n/**\n * Button that toggle open config panel\n */\nconst Config = ({ dashboardApi }: ToolbarButtonProps) => {\n const configButtonRef = useToolbarRef('config');\n\n const handleClick = useCallback(() => {\n const isOpen = dashboardApi?.getOpenedPanel() === 'config';\n if (isOpen) {\n dashboardApi?.closePanel();\n } else {\n // Open config panel\n dashboardApi?.openPanel({\n activePanel: 'config',\n panelProps: {\n focusOnOpen: true,\n },\n });\n }\n }, [dashboardApi]);\n\n return (\n <IconButton\n buttonRef={configButtonRef}\n testLabel=\"config-button\"\n onClick={handleClick}\n icon={configurationIcon}\n />\n );\n};\n\nexport default Config;\n", "\nimport * as defaultImport from \"@splunk/react-icons/ArrowBroadUnderbarDown\";\nexport * from \"@splunk/react-icons/ArrowBroadUnderbarDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { type ComponentProps } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport ArrowBroadUnderbarDown from '@splunk/react-icons/ArrowBroadUnderbarDown';\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nexport interface ContentExportProps extends ToolbarButtonProps {\n disabled?: boolean;\n onClick?: ComponentProps<typeof IconButton>['onClick'];\n}\n\nconst icon = prepareIcon({\n Icon: ArrowBroadUnderbarDown,\n screenReaderContent: _('Export'),\n});\n\nconst ContentExport = ({ disabled, onClick }: ContentExportProps) => (\n <IconButton\n testLabel=\"content-export-button\"\n onClick={onClick}\n disabled={!!disabled}\n icon={icon}\n />\n);\n\nexport default ContentExport;\n", "\nimport * as defaultImport from \"@splunk/react-icons/CylinderMulti\";\nexport * from \"@splunk/react-icons/CylinderMulti\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\n\nimport DataInput from '@splunk/react-icons/CylinderMulti';\n\nimport { useToolbarRef } from '@splunk/dashboard-context';\nimport { batch } from '@splunk/dashboard-state';\n\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst dataInputIcon = prepareIcon({\n Icon: DataInput,\n screenReaderContent: _('Data source overview'),\n});\n\n/**\n * Button that toggle data overview panel\n */\nconst Data = ({ dashboardApi }: ToolbarButtonProps) => {\n const dataButtonRef = useToolbarRef('dataOverview');\n\n const handleClick = useCallback(() => {\n const isOpen = dashboardApi?.getOpenedPanel() === 'dataOverview';\n if (isOpen) {\n dashboardApi.closePanel();\n } else {\n batch(() => {\n // Deselect all selected visualizations\n dashboardApi?.selectVisualization([]);\n // Open data overview panel\n dashboardApi?.openPanel({\n activePanel: 'dataOverview',\n panelProps: {\n focusOnOpen: true,\n },\n });\n });\n }\n }, [dashboardApi]);\n\n return (\n <IconButton\n buttonRef={dataButtonRef}\n testLabel=\"data-button\"\n onClick={handleClick}\n icon={dataInputIcon}\n />\n );\n};\n\nexport default Data;\n", "\nimport * as defaultImport from \"@splunk/react-icons/Square\";\nexport * from \"@splunk/react-icons/Square\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\n\nimport { _ } from '@splunk/ui-utils/i18n';\nimport BoxUnchecked from '@splunk/react-icons/Square';\n\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst icon = prepareIcon({\n Icon: BoxUnchecked,\n screenReaderContent: _('Add rectangle'),\n});\n\n/**\n * Button that creates a empty viz\n */\nconst EmptyVisualization = ({ dashboardApi }: ToolbarButtonProps) => {\n const handleClick = useCallback(async () => {\n dashboardApi?.createVisualization({\n visualizationDefinition: {\n type: 'splunk.rectangle',\n options: {\n fillColor: 'transparent',\n strokeColor: 'transparent',\n },\n },\n });\n\n dashboardApi?.openPanel({\n activePanel: 'config',\n });\n }, [dashboardApi]);\n\n return (\n <IconButton\n testLabel=\"empty-viz-button\"\n onClick={handleClick}\n icon={icon}\n />\n );\n};\n\nexport default EmptyVisualization;\n", "\nimport * as defaultImport from \"@splunk/react-icons/ChevronsOut\";\nexport * from \"@splunk/react-icons/ChevronsOut\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\n\nimport Fullscreen from '@splunk/react-icons/ChevronsOut';\nimport { selectFullscreenElement, useSelector } from '@splunk/dashboard-state';\n\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst icon = prepareIcon({\n Icon: Fullscreen,\n screenReaderContent: _('Fullscreen'),\n});\n\n/**\n * Button that toggle fullscreen mode\n */\nconst FullScreen = ({ dashboardApi }: ToolbarButtonProps) => {\n const isFullscreen = !!useSelector(selectFullscreenElement);\n\n const handleClick = useCallback(() => {\n dashboardApi?.enterFullscreen();\n }, [dashboardApi]);\n\n return (\n <IconButton\n testLabel=\"fullscreen-button\"\n onClick={handleClick}\n disabled={isFullscreen}\n icon={icon}\n />\n );\n};\n\nexport default FullScreen;\n", "\nimport * as defaultImport from \"@splunk/react-ui/Switch\";\nexport * from \"@splunk/react-ui/Switch\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback, useMemo } from 'react';\nimport styled from 'styled-components';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport Switch from '@splunk/react-ui/Switch';\nimport {\n selectAreGridLinesEnabled,\n useSelector,\n} from '@splunk/dashboard-state';\nimport { variables } from '@splunk/themes';\nimport ItemSeparator from '../components/ItemSeparator';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst SwitchContainer = styled.div`\n display: flex;\n align-items: center;\n flex-direction: row;\n gap: ${variables.spacingSmall};\n`;\n\nexport interface GridLineSwitchProps extends ToolbarButtonProps {\n showSeparator?: boolean;\n}\n\nconst GridLineSwitch = ({\n dashboardApi,\n mode,\n showSeparator,\n layoutType,\n}: GridLineSwitchProps) => {\n const showGrid = useSelector(selectAreGridLinesEnabled) ?? false;\n\n const handleClick = useCallback(() => {\n dashboardApi?.toggleGridLines(!showGrid);\n }, [dashboardApi, showGrid]);\n\n const separator = useMemo(\n () => (showSeparator ? <ItemSeparator key=\"item-separator\" /> : null),\n [showSeparator]\n );\n\n if (!dashboardApi || mode !== 'edit' || layoutType === 'grid') {\n return null;\n }\n\n return (\n <SwitchContainer key=\"grid-line-switch\">\n <Switch\n onClick={handleClick}\n selected={showGrid}\n selectedLabel={_('Gridlines displayed')}\n unselectedLabel={_('Gridlines not displayed')}\n appearance=\"toggle\"\n data-test=\"gridline-toggle\"\n data-clickable\n >\n {_('Gridlines')}\n </Switch>\n {separator}\n </SwitchContainer>\n );\n};\n\nexport default GridLineSwitch;\n", "\nimport * as defaultImport from \"@splunk/react-icons/ChartSingleValueIcon\";\nexport * from \"@splunk/react-icons/ChartSingleValueIcon\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback, useMemo } from 'react';\nimport styled from 'styled-components';\nimport { _ } from '@splunk/ui-utils/i18n';\n\nimport Dropdown from '@splunk/react-ui/Dropdown';\n\nimport AddIconDropdown from '@splunk/react-icons/ChartSingleValueIcon';\nimport { IconGallery as IconGalleryPanel } from '@splunk/dashboard-ui';\n\nimport { StyledDropdownButton } from '../components/StyledButton';\nimport ToolbarItem from '../Item';\nimport useDropdown from '../hooks/useDropdown';\nimport { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst MenusContainer = styled.div`\n display: flex;\n padding: 5px;\n`;\n\nconst iconGalleryDropdown = prepareIcon({\n Icon: AddIconDropdown,\n screenReaderContent: _('Add icon'),\n isMenu: true,\n});\n\nconst focusToggleReasons: never[] = [];\n\n/**\n * Icon Gallery button that has as a dropdown menu.\n */\nconst IconGallery = ({ dashboardApi }: ToolbarButtonProps) => {\n const {\n handleForceClose,\n handleRequestClose,\n handleRequestOpen,\n setHasChildModal,\n isOpen,\n } = useDropdown({\n isContentClickClose: false,\n });\n\n const ButtonToggle = useMemo(\n () => (\n <StyledDropdownButton\n data-test=\"icon-gallery-button\"\n data-clickable\n appearance=\"subtle\"\n icon={iconGalleryDropdown}\n />\n ),\n []\n );\n const handlePanelClick = useCallback(\n async (iconURL: string) => {\n dashboardApi?.createVisualization({\n visualizationDefinition: {\n type: 'splunk.singlevalueicon',\n options: {\n showValue: false,\n icon: iconURL,\n },\n },\n });\n dashboardApi?.openPanel({\n activePanel: 'config',\n });\n handleForceClose();\n },\n [dashboardApi, handleForceClose]\n );\n\n return (\n <ToolbarItem>\n <Dropdown\n focusToggleReasons={focusToggleReasons}\n onRequestClose={handleRequestClose}\n onRequestOpen={handleRequestOpen}\n open={isOpen}\n toggle={ButtonToggle}\n >\n <MenusContainer data-test=\"icon-menu\" data-open={isOpen}>\n <IconGalleryPanel\n onClick={handlePanelClick}\n setHasChildModal={setHasChildModal}\n />\n </MenusContainer>\n </Dropdown>\n </ToolbarItem>\n );\n};\n\nexport default IconGallery;\n", "\nimport * as defaultImport from \"@splunk/react-icons/QuestionCircle\";\nexport * from \"@splunk/react-icons/QuestionCircle\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useMemo } from 'react';\nimport Help from '@splunk/react-icons/QuestionCircle';\nimport Dropdown from '@splunk/react-ui/Dropdown';\nimport Menu from '@splunk/react-ui/Menu';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport ToolbarItem from '../Item';\nimport useDropdown from '../hooks/useDropdown';\nimport type { ToolbarButtonProps } from '../types/common';\nimport { prepareIcon } from '../IconButton';\nimport { StyledDropdownButton } from '../components/StyledButton';\n\nexport interface ToolbarHelpLink {\n label: string;\n description?: string;\n url: string;\n}\n\ninterface HelpProps extends ToolbarButtonProps {\n helpLinks?: ToolbarHelpLink[];\n}\n\nconst focusToggleReasons: never[] = [];\n\nconst HelpIcon = prepareIcon({\n Icon: Help,\n screenReaderContent: _('Help links'),\n isMenu: true,\n});\n\nconst ButtonToggle = (\n <StyledDropdownButton\n appearance=\"subtle\"\n data-clickable\n data-test=\"help-button\"\n icon={HelpIcon}\n />\n);\n\n/**\n * Help button which expands dropdown full of links\n */\nconst HelpButton = ({ helpLinks = [] }: HelpProps) => {\n const { handleRequestClose, handleRequestOpen, isOpen } = useDropdown({\n isContentClickClose: true,\n });\n\n const HelpLinks = useMemo(() => {\n if (helpLinks.length === 0) {\n return [\n <Menu.Item\n data-test=\"no-links-provided\"\n key=\"no-links-provided\"\n disabled\n >\n {_('No Links')}\n </Menu.Item>,\n ];\n }\n\n return helpLinks.map((link: ToolbarHelpLink) => {\n const { label = '', description = '', url } = link;\n const key = label.replace(/\\s/g, '');\n\n return (\n <Menu.Item\n data-test=\"help-link\"\n data-test-clickable\n to={url}\n description={description}\n key={`help-link-${key}`}\n openInNewContext\n >\n {label}\n </Menu.Item>\n );\n });\n }, [helpLinks]);\n\n return (\n <ToolbarItem>\n <Dropdown\n focusToggleReasons={focusToggleReasons}\n onRequestClose={handleRequestClose}\n onRequestOpen={handleRequestOpen}\n open={isOpen}\n toggle={ButtonToggle}\n >\n <Menu>{HelpLinks}</Menu>\n </Dropdown>\n </ToolbarItem>\n );\n};\n\nexport default HelpButton;\n", "\nimport * as defaultImport from \"@splunk/react-icons/Picture\";\nexport * from \"@splunk/react-icons/Picture\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\n\nimport { _ } from '@splunk/ui-utils/i18n';\nimport Picture from '@splunk/react-icons/Picture';\n\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst icon = prepareIcon({\n Icon: Picture,\n screenReaderContent: _('Add image'),\n});\n\n/**\n * Button that create a empty image\n */\nconst Image = ({ dashboardApi }: ToolbarButtonProps) => {\n const handleClick = useCallback(async () => {\n dashboardApi?.createVisualization({\n visualizationDefinition: {\n type: 'splunk.image',\n options: {\n preserveAspectRatio: true,\n },\n },\n });\n\n dashboardApi?.openPanel({\n activePanel: 'config',\n });\n }, [dashboardApi]);\n\n return (\n <IconButton\n testLabel=\"image-button\"\n onClick={handleClick}\n icon={icon}\n />\n );\n};\n\nexport default Image;\n", "import React, { useCallback } from 'react';\nimport styled from 'styled-components';\n\nimport Dropdown from '@splunk/react-ui/Dropdown';\nimport { _ } from '@splunk/ui-utils/i18n';\n\nimport AddImage from '@splunk/react-icons/Picture';\n\nimport { ImageGallery as ImageGalleryPanel } from '@splunk/dashboard-ui';\n\nimport { StyledDropdownButton } from '../components/StyledButton';\nimport ToolbarItem from '../Item';\nimport useDropdown from '../hooks/useDropdown';\nimport { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst MenusContainer = styled.div`\n display: flex;\n padding: 5px;\n`;\n\nconst imageGalleryDropdown = prepareIcon({\n Icon: AddImage,\n screenReaderContent: _('Add image'),\n isMenu: true,\n});\n\nconst ButtonToggle = (\n <StyledDropdownButton\n data-test=\"image-gallery-button\"\n data-clickable\n appearance=\"subtle\"\n icon={imageGalleryDropdown}\n />\n);\n\nconst focusToggleReasons: never[] = [];\n\n/**\n * Image Gallery button that has as a dropdown menu.\n */\nconst ImageGallery = ({ dashboardApi }: ToolbarButtonProps) => {\n const {\n handleForceClose,\n handleRequestClose,\n handleRequestOpen,\n setHasChildModal,\n isOpen,\n } = useDropdown({\n isContentClickClose: false,\n });\n\n const handlePanelClick = useCallback(\n async (imageUrl: string) => {\n dashboardApi?.createVisualization({\n visualizationDefinition: {\n type: 'splunk.image',\n options: {\n preserveAspectRatio: true,\n src: imageUrl,\n },\n },\n });\n dashboardApi?.openPanel({\n activePanel: 'config',\n });\n handleForceClose();\n },\n [dashboardApi, handleForceClose]\n );\n\n return (\n <ToolbarItem>\n <Dropdown\n focusToggleReasons={focusToggleReasons}\n onRequestClose={handleRequestClose}\n onRequestOpen={handleRequestOpen}\n open={isOpen}\n toggle={ButtonToggle}\n >\n <MenusContainer>\n <ImageGalleryPanel\n onClick={handlePanelClick}\n setHasChildModal={setHasChildModal}\n />\n </MenusContainer>\n </Dropdown>\n </ToolbarItem>\n );\n};\n\nexport default ImageGallery;\n", "\nimport * as defaultImport from \"lodash\";\nexport * from \"lodash\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/SlidersTripleHorizontal\";\nexport * from \"@splunk/react-icons/SlidersTripleHorizontal\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/dashboard-definition\";\nexport * from \"@splunk/dashboard-definition\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useMemo } from 'react';\nimport { each } from 'lodash';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport Dropdown from '@splunk/react-ui/Dropdown';\nimport Menu from '@splunk/react-ui/Menu';\nimport Input from '@splunk/react-icons/SlidersTripleHorizontal';\nimport { DashboardDefinition } from '@splunk/dashboard-definition';\nimport type {\n PresetMap,\n InputConfig,\n DashboardApi,\n} from '@splunk/dashboard-types';\n\nimport { StyledDropdownButton } from '../components/StyledButton';\nimport useDropdown from '../hooks/useDropdown';\nimport ToolbarItem from '../Item';\nimport { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst focusToggleReasons: never[] = [];\n\nconst DEFAULT_PRESET_MAP = Object.freeze({} as PresetMap);\nconst addInputIcon = prepareIcon({\n Icon: Input,\n screenReaderContent: _('Add input'),\n isMenu: true,\n});\n\nconst ButtonToggle = (\n <StyledDropdownButton\n appearance=\"subtle\"\n data-clickable\n data-test=\"inputs-button\"\n icon={addInputIcon}\n />\n);\n\ninterface AddInputFactoryArgs {\n type: string;\n defaultConfig: {\n options?: Record<string, unknown>;\n [x: string]: unknown;\n };\n tokenPrefix: string;\n showToken: boolean;\n dashboardApi?: DashboardApi;\n}\n\n// click handler factory\nconst onCreateInputClickFactory =\n ({\n type,\n defaultConfig,\n tokenPrefix,\n showToken,\n dashboardApi,\n }: AddInputFactoryArgs) =>\n () => {\n if (!dashboardApi) {\n return;\n }\n\n const newConfig = {\n ...defaultConfig,\n type,\n options: {\n ...defaultConfig.options,\n },\n };\n // showToken flags whether or not the input has a token assigned on creation\n if (showToken) {\n newConfig.options.token = DashboardDefinition.fromJSON(\n dashboardApi?.getDefinition()\n ).nextTokenId(tokenPrefix);\n }\n dashboardApi.addInput(newConfig);\n dashboardApi.openPanel({ activePanel: 'config' });\n };\n\n/**\n * Add Input button that has a dropdown menu.\n */\nconst Inputs = ({\n dashboardApi,\n preset = DEFAULT_PRESET_MAP,\n}: ToolbarButtonProps) => {\n const { handleRequestClose, handleRequestOpen, isOpen } = useDropdown({\n isContentClickClose: true,\n });\n\n const InputTypeButtons = useMemo(() => {\n const buttons = [];\n\n const inputs = preset?.inputs as Record<\n string,\n {\n config: InputConfig;\n }\n >;\n\n each(inputs, (InputImpl, type) => {\n const {\n baseShape = {},\n label = _(`${type} Input`),\n description = '',\n tokenPrefix = 'token',\n includeInToolbar = true,\n icon: Icon = Input,\n // showToken flags whether or not the input has a token assigned on creation\n showToken = true,\n } = InputImpl.config || {};\n\n if (!includeInToolbar) {\n return;\n }\n\n const handleClick = onCreateInputClickFactory({\n type,\n defaultConfig: baseShape,\n tokenPrefix,\n showToken,\n dashboardApi,\n });\n\n const inputIcon = <Icon width=\"24px\" height=\"24px\" />;\n\n buttons.push(\n <Menu.Item\n data-test={`add-${type}-button`}\n data-test-clickable\n onClick={handleClick}\n startAdornment={inputIcon}\n description={description}\n key={`add-${type}-button`}\n >\n {label}\n </Menu.Item>\n );\n });\n\n if (buttons.length === 0) {\n buttons.push(\n <Menu.Item\n data-test=\"no-inputs-in-preset\"\n key=\"no-inputs-in-preset\"\n disabled\n >\n {_('No Inputs')}\n </Menu.Item>\n );\n }\n\n return buttons;\n }, [preset, dashboardApi]);\n\n return (\n <ToolbarItem>\n <Dropdown\n focusToggleReasons={focusToggleReasons}\n onRequestClose={handleRequestClose}\n onRequestOpen={handleRequestOpen}\n open={isOpen}\n toggle={ButtonToggle}\n >\n <Menu>{InputTypeButtons}</Menu>\n </Dropdown>\n </ToolbarItem>\n );\n};\n\nexport default Inputs;\n", "\nimport * as defaultImport from \"@splunk/react-icons/Markdown\";\nexport * from \"@splunk/react-icons/Markdown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport MarkdownIcon from '@splunk/react-icons/Markdown';\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst icon = prepareIcon({\n Icon: MarkdownIcon,\n screenReaderContent: _('Add markdown text'),\n});\n\n/**\n * Button that creates a empty markdown viz\n */\nconst Markdown = ({ dashboardApi }: ToolbarButtonProps): JSX.Element => {\n const handleClick = useCallback(() => {\n dashboardApi?.createVisualization({\n visualizationDefinition: {\n type: 'splunk.markdown',\n options: {\n markdown: '',\n },\n },\n });\n dashboardApi?.openPanel({\n activePanel: 'config',\n });\n }, [dashboardApi]);\n\n return (\n <IconButton\n testLabel=\"markdown-button\"\n onClick={handleClick}\n icon={icon}\n />\n );\n};\n\nexport default Markdown;\n", "\nimport * as defaultImport from \"@splunk/react-icons/ArrowBowRight\";\nexport * from \"@splunk/react-icons/ArrowBowRight\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback, useState, useEffect } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport RedoIcon from '@splunk/react-icons/ArrowBowRight';\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst icon = prepareIcon({\n Icon: RedoIcon,\n screenReaderContent: _('Redo'),\n});\n\nconst Redo = ({ dashboardApi }: ToolbarButtonProps) => {\n // TODO: replace when history management is done in redux\n // mode changes can cause the button to mount while there is a redo state\n const [canRedo, setCanRedo] = useState(\n () => dashboardApi?.canRedo() ?? false\n );\n\n const onDefinitionChange = useCallback(() => {\n setCanRedo(dashboardApi?.canRedo() ?? 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.redo({ source: 'toolbar' });\n }, [dashboardApi]);\n\n return (\n <IconButton\n testLabel=\"redo-button\"\n onClick={handleClick}\n disabled={!canRedo}\n icon={icon}\n />\n );\n};\n\nexport default Redo;\n", "\nimport * as defaultImport from \"@splunk/react-icons/Circle\";\nexport * from \"@splunk/react-icons/Circle\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/Line\";\nexport * from \"@splunk/react-icons/Line\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/ShapesVariety\";\nexport * from \"@splunk/react-icons/ShapesVariety\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React from 'react';\nimport styled from 'styled-components';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledContentWrapper = styled.span`\n display: flex;\n flex-direction: row;\n justify-content: left;\n align-items: center;\n max-width: 100%;\n`;\n\nconst StyledIcon = styled.span`\n display: inline-block;\n padding-right: 8px;\n`;\n\nconst StyledLabel = styled.span`\n text-overflow: ellipsis;\n overflow: hidden;\n flex: 0 1 auto;\n`;\n\nexport interface PopoverItemButtonProps extends ToolbarButtonProps {\n icon: JSX.Element;\n label?: string;\n}\n\n/**\n * Custom button component for popovers created for specific styling - aligning text to the left\n */\nconst PopoverItemButton = ({ icon, label }: PopoverItemButtonProps) => (\n <StyledContentWrapper>\n {icon && <StyledIcon>{icon}</StyledIcon>}\n {label && <StyledLabel data-test=\"label-title\">{label}</StyledLabel>}\n </StyledContentWrapper>\n);\n\nexport default PopoverItemButton;\n", "import React, { useCallback } from 'react';\nimport Menu from '@splunk/react-ui/Menu';\nimport Circle from '@splunk/react-icons/Circle';\nimport BoxUnchecked from '@splunk/react-icons/Square';\nimport Line from '@splunk/react-icons/Line';\nimport Dropdown from '@splunk/react-ui/Dropdown';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport AddShapeDropdown from '@splunk/react-icons/ShapesVariety';\nimport type {\n StructureItemType,\n VisualizationDefinition,\n} from '@splunk/dashboard-types';\nimport { StyledDropdownButton } from '../components/StyledButton';\nimport useDropdown from '../hooks/useDropdown';\nimport ToolbarItem from '../Item';\nimport PopoverItemButton from '../PopoverItemButton';\nimport type { ToolbarButtonProps } from '../types/common';\nimport { prepareIcon } from '../IconButton';\n\nconst shapesDropdown = prepareIcon({\n Icon: AddShapeDropdown,\n screenReaderContent: _('Add shape'),\n isMenu: true,\n});\n\nconst ButtonToggle = (\n <StyledDropdownButton\n appearance=\"subtle\"\n data-clickable\n data-test=\"shapes-button\"\n icon={shapesDropdown}\n />\n);\n\nconst focusToggleReasons: never[] = [];\n\nconst circleIcon = <Circle />;\nconst uncheckedBoxIcon = <BoxUnchecked />;\nconst lineIcon = <Line />;\n\n/**\n * Shapes button that has a dropdown menu.\n */\nconst Shapes = ({ dashboardApi, layoutType }: ToolbarButtonProps) => {\n const supportLine = layoutType === 'absolute';\n\n const { handleRequestClose, handleRequestOpen, isOpen } = useDropdown({\n isContentClickClose: true,\n });\n\n const handleCreateVizButtonClick = useCallback(\n (\n vizToCreate: VisualizationDefinition<Record<string, unknown>>,\n layoutItemType?: StructureItemType\n ) => {\n return () => {\n dashboardApi?.createVisualization({\n visualizationDefinition: vizToCreate,\n layoutItemType,\n });\n dashboardApi?.openPanel({ activePanel: 'config' });\n };\n },\n [dashboardApi]\n );\n\n return (\n <ToolbarItem>\n <Dropdown\n focusToggleReasons={focusToggleReasons}\n onRequestClose={handleRequestClose}\n onRequestOpen={handleRequestOpen}\n open={isOpen}\n toggle={ButtonToggle}\n >\n <Menu data-test=\"shapes-dropdown-children-container\">\n <Menu.Item\n data-test=\"ellipse-button\"\n onClick={handleCreateVizButtonClick({\n type: 'splunk.ellipse',\n })}\n >\n <PopoverItemButton\n icon={circleIcon}\n label={_('Ellipse')}\n />\n </Menu.Item>\n <Menu.Item\n data-test=\"rectangle-button\"\n onClick={handleCreateVizButtonClick({\n type: 'splunk.rectangle',\n })}\n >\n <PopoverItemButton\n icon={uncheckedBoxIcon}\n label={_('Rectangle')}\n />\n </Menu.Item>\n {supportLine && (\n <Menu.Item\n data-test=\"line-button\"\n onClick={handleCreateVizButtonClick(\n {\n type: 'abslayout.line',\n },\n 'line'\n )}\n >\n <PopoverItemButton\n icon={lineIcon}\n label={_('Line')}\n />\n </Menu.Item>\n )}\n </Menu>\n </Dropdown>\n </ToolbarItem>\n );\n};\n\nexport default Shapes;\n", "\nimport * as defaultImport from \"@splunk/react-icons/WindowChevronsSlash\";\nexport * from \"@splunk/react-icons/WindowChevronsSlash\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { type ComponentProps } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport SourceIcon from '@splunk/react-icons/WindowChevronsSlash';\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 toggle source mode\n */\nconst Source = ({ disabled = false, onClick }: SourceProps) => (\n <IconButton\n testLabel=\"source-button\"\n onClick={onClick}\n disabled={disabled}\n icon={icon}\n />\n);\n\nexport default Source;\n", "\nimport * as defaultImport from \"@splunk/react-icons/ListToken\";\nexport * from \"@splunk/react-icons/ListToken\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-ui/Tooltip\";\nexport * from \"@splunk/react-ui/Tooltip\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport ListToken from '@splunk/react-icons/ListToken';\nimport Tooltip from '@splunk/react-ui/Tooltip';\nimport IconButton, { prepareIcon } from '../../IconButton';\nimport type { ToolbarButtonProps } from '../../types/common';\n\nconst tokenManagerIcon = prepareIcon({\n Icon: ListToken,\n screenReaderContent: _('Token manager'),\n});\n\n/**\n * Button that toggles open token manager panel\n */\nexport const TokenManager = ({ dashboardApi }: ToolbarButtonProps) => {\n const handleClick = useCallback(() => {\n const isOpen = dashboardApi?.getOpenedPanel() === 'tokens';\n if (isOpen) {\n dashboardApi?.closePanel();\n } else {\n // Open tokens panel\n dashboardApi?.openPanel({\n activePanel: 'tokens',\n panelProps: {\n focusOnOpen: true,\n },\n });\n }\n }, [dashboardApi]);\n\n return (\n <Tooltip\n contentRelationship=\"label\"\n content={_('Token manager')}\n data-test-label=\"token-manager-button\"\n >\n <IconButton\n testLabel=\"token-manager-button\"\n onClick={handleClick}\n icon={tokenManagerIcon}\n />\n </Tooltip>\n );\n};\n", "\nimport * as defaultImport from \"@splunk/react-icons/ArrowBowLeft\";\nexport * from \"@splunk/react-icons/ArrowBowLeft\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "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", "\nimport * as defaultImport from \"@splunk/dashboard-telemetry\";\nexport * from \"@splunk/dashboard-telemetry\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/ui-utils/format\";\nexport * from \"@splunk/ui-utils/format\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-ui/Number\";\nexport * from \"@splunk/react-ui/Number\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\nimport styled from 'styled-components';\nimport Number from '@splunk/react-ui/Number';\nimport { variables } from '@splunk/themes';\nimport { useNumberInput, type OnValueChangeType } from '@splunk/dashboard-ui';\n\nconst StyledNumber = styled(Number)`\n padding-right: ${variables.spacingSmall};\n & > input {\n text-align: right;\n }\n`;\n\nconst StyledEndAdornment = styled.span`\n color: ${variables.contentColorActive};\n`;\n\ninterface ZoomNumberProps {\n currentScale: number;\n onScaleChange: (scale: number) => () => void;\n}\n\nexport const ZoomNumber = ({\n currentScale,\n onScaleChange,\n}: ZoomNumberProps) => {\n const onValueChange = useCallback<OnValueChangeType>(\n (e, value = 100) => {\n onScaleChange(value as number)();\n },\n [onScaleChange]\n );\n const { handleChange, handleBlur, handleFocus, handleKeyPress } =\n useNumberInput({\n value: currentScale,\n onValueChange,\n });\n\n return (\n <StyledNumber\n value={currentScale}\n onChange={handleChange}\n onKeyDown={handleKeyPress}\n onBlur={handleBlur}\n onFocus={handleFocus}\n step={5}\n min={1}\n max={10000}\n roundTo={0}\n endAdornment={<StyledEndAdornment>%</StyledEndAdornment>}\n hideStepButtons\n data-test=\"zoom-number\"\n append\n />\n );\n};\n", "import React, { useCallback, useMemo, useState, useEffect } from 'react';\nimport styled from 'styled-components';\nimport { debounce } from 'lodash';\n\nimport { _ } from '@splunk/ui-utils/i18n';\nimport { variables } from '@splunk/themes';\nimport Tooltip from '@splunk/react-ui/Tooltip';\nimport type { ButtonPropsBase } from '@splunk/react-ui/Button';\n\nimport { useDashboardApi } from '@splunk/dashboard-context';\nimport { useTelemetryApi } from '@splunk/dashboard-telemetry';\nimport { selectActiveTab, useSelector } from '@splunk/dashboard-state';\n\nimport type { ToolbarButtonProps } from '../../types/common';\nimport ItemSeparator from '../../components/ItemSeparator';\nimport { ZoomMenu } from './ZoomMenu';\nimport { ZoomNumber } from './ZoomNumber';\n\nconst Container = styled.div`\n margin-inline-end: 0;\n display: flex;\n min-width: 96px;\n gap: ${variables.spacingSmall};\n`;\n\nconst StyledTooltip = styled(Tooltip)`\n width: 110px;\n & span {\n display: flex;\n }\n`;\n\nexport interface ZoomProps extends ToolbarButtonProps {\n appearance?: ButtonPropsBase['appearance'];\n showSeparator?: boolean;\n}\n\nexport const Zoom = ({\n showSeparator = true,\n appearance = 'default',\n mode = 'view',\n}: ZoomProps): JSX.Element => {\n const [currentScale, setCurrentScale] = useState(100);\n const [scaleType, setScaleType] = useState<'auto' | 'fit' | null>(null);\n const telemetry = useTelemetryApi();\n const dashboardApi = useDashboardApi();\n\n const handleZoom = useCallback((level?: number) => {\n if (level) {\n setCurrentScale(Math.round(level * 100));\n }\n }, []);\n\n const emitTelemetry = useMemo(\n () => debounce(telemetry.emit.bind(telemetry), 500),\n [telemetry]\n );\n\n useEffect(() => {\n emitTelemetry({\n pageAction: 'dashboard.zoom',\n source: 'toolbar',\n event: 'dashboard.zoom_level_change',\n metadata: {\n scale: currentScale,\n scaleType,\n mode,\n },\n });\n }, [currentScale, scaleType, emitTelemetry, mode]);\n\n const activeTabId = useSelector(selectActiveTab);\n useEffect(() => {\n const subscription = dashboardApi\n ?.getZoomLevel()\n ?.subscribe({ next: handleZoom });\n\n return () => {\n subscription?.unsubscribe();\n };\n }, [dashboardApi, activeTabId, handleZoom]);\n\n const separator = useMemo(\n () => (showSeparator ? <ItemSeparator key=\"item-separator\" /> : null),\n [showSeparator]\n );\n\n const handleScaleChange = useCallback(\n (scale: number) => () => {\n setCurrentScale(scale);\n setScaleType(null);\n dashboardApi?.setScale({ scale: scale / 100 });\n },\n [dashboardApi]\n );\n\n return (\n <Container>\n <StyledTooltip\n contentRelationship=\"label\"\n content={_('Zoom level')}\n >\n <ZoomNumber\n currentScale={currentScale}\n onScaleChange={handleScaleChange}\n />\n <ZoomMenu\n dashboardApi={dashboardApi}\n appearance={appearance}\n currentScale={currentScale}\n setCurrentScale={setCurrentScale}\n scaleType={scaleType}\n setScaleType={setScaleType}\n />\n </StyledTooltip>\n {separator}\n </Container>\n );\n};\n"],
|
|
5
|
-
"mappings": "
|
|
3
|
+
"sources": ["../src/groups/ControlGroup.tsx", "esm-externals:react", "esm-externals:styled-components", "esm-externals:@splunk/dashboard-utils", "esm-externals:@splunk/themes", "../src/components/ItemSeparator.tsx", "../src/ItemGroup.tsx", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/react-ui/Dropdown", "esm-externals:@splunk/react-ui/Menu", "esm-externals:@splunk/react-icons/ChartColumn", "esm-externals:@splunk/dashboard-ui", "esm-externals:@splunk/dashboard-context", "esm-externals:@splunk/dashboard-state", "../src/Item.tsx", "esm-externals:@splunk/react-icons/CaretDown", "esm-externals:@splunk/react-ui/ScreenReaderContent", "esm-externals:@splunk/react-ui/Button", "../src/IconButton.tsx", "../src/components/StyledButton.tsx", "../src/buttons/Charts.tsx", "esm-externals:@splunk/react-icons/Cog", "../src/buttons/Config.tsx", "esm-externals:@splunk/react-icons/ArrowBroadUnderbarDown", "../src/buttons/ContentExport.tsx", "esm-externals:@splunk/react-icons/CylinderMulti", "../src/buttons/Data.tsx", "esm-externals:@splunk/react-icons/Square", "../src/buttons/EmptyVisualization.tsx", "esm-externals:@splunk/react-icons/ChevronsOut", "../src/buttons/Fullscreen.tsx", "esm-externals:@splunk/react-ui/Switch", "../src/buttons/GridLineSwitch.tsx", "esm-externals:@splunk/react-icons/ChartSingleValueIcon", "../src/buttons/IconGallery.tsx", "esm-externals:@splunk/react-icons/QuestionCircle", "../src/buttons/HelpButton.tsx", "esm-externals:@splunk/react-icons/Picture", "../src/buttons/Image.tsx", "../src/buttons/ImageGallery.tsx", "esm-externals:lodash", "esm-externals:@splunk/react-icons/SlidersTripleHorizontal", "esm-externals:@splunk/dashboard-definition", "../src/buttons/Inputs.tsx", "esm-externals:@splunk/react-icons/Markdown", "../src/buttons/Markdown.tsx", "esm-externals:@splunk/react-icons/ArrowBowRight", "../src/buttons/Redo.tsx", "esm-externals:@splunk/react-icons/Circle", "esm-externals:@splunk/react-icons/Line", "esm-externals:@splunk/react-icons/ShapesVariety", "../src/PopoverItemButton.tsx", "../src/buttons/Shapes.tsx", "esm-externals:@splunk/react-icons/WindowChevronsSlash", "../src/buttons/Source.tsx", "esm-externals:@splunk/react-icons/ListToken", "esm-externals:@splunk/react-ui/Tooltip", "../src/buttons/tokenManager/TokenManager.tsx", "esm-externals:@splunk/react-icons/ArrowBowLeft", "../src/buttons/Undo.tsx", "esm-externals:@splunk/dashboard-telemetry", "esm-externals:@splunk/ui-utils/format", "esm-externals:@splunk/react-ui/Number", "../src/buttons/Zoom/ZoomNumber.tsx", "../src/buttons/Zoom/Zoom.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport ItemGroup from '../ItemGroup';\nimport { Fullscreen } from '../buttons';\n\n/**\n * Control button group\n */\nconst ControlGroup = (props: React.ComponentProps<typeof ItemGroup>) => (\n <ItemGroup {...props}>\n <Fullscreen />\n </ItemGroup>\n);\n\nexport default ControlGroup;\n", "\nimport * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/dashboard-utils\";\nexport * from \"@splunk/dashboard-utils\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/themes\";\nexport * from \"@splunk/themes\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\nimport { variables } from '@splunk/themes';\n\nconst ItemSeparator = styled.div`\n border-left-width: 1px;\n border-left-style: solid;\n border-left-color: ${variables.interactiveColorBorder};\n width: 0px;\n height: ${variables.inputHeight};\n`;\n\nexport default ItemSeparator;\n", "import React from 'react';\nimport styled from 'styled-components';\nimport type { ButtonClickHandler } from '@splunk/react-ui/Button';\nimport { toPx } from '@splunk/dashboard-utils';\nimport type { ToolbarButtonProps } from './types/common';\nimport ItemSeparator from './components/ItemSeparator';\n\nconst Group = styled.div.attrs({\n 'data-test': 'toolbar-item-group',\n})<{ gap: string }>`\n display: flex;\n flex-direction: row;\n gap: ${(props) => props.gap};\n`;\n\nexport type ItemGroupProps = {\n borders?: boolean;\n children?: React.ReactNode;\n align?: 'left' | 'right';\n sourceButtonOnClick?: ButtonClickHandler;\n gap?: number | string;\n [key: string]: unknown;\n} & ToolbarButtonProps;\n\nconst ItemGroup = ({\n children,\n borders = true,\n gap,\n ...rest\n}: ItemGroupProps) => {\n const items = React.Children.map(\n children,\n (child) => child && React.cloneElement(child as JSX.Element, rest)\n );\n const separator = borders ? <ItemSeparator /> : null;\n return (\n <>\n <Group gap={toPx(gap, 2)}>{items}</Group>\n {separator}\n </>\n );\n};\n\nexport default ItemGroup;\n", "\nimport * as defaultImport from \"@splunk/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-ui/Dropdown\";\nexport * from \"@splunk/react-ui/Dropdown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-ui/Menu\";\nexport * from \"@splunk/react-ui/Menu\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/ChartColumn\";\nexport * from \"@splunk/react-icons/ChartColumn\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/dashboard-ui\";\nexport * from \"@splunk/dashboard-ui\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/dashboard-context\";\nexport * from \"@splunk/dashboard-context\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/dashboard-state\";\nexport * from \"@splunk/dashboard-state\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "\nimport * as defaultImport from \"@splunk/react-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-ui/ScreenReaderContent\";\nexport * from \"@splunk/react-ui/ScreenReaderContent\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-ui/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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", "import Button from '@splunk/react-ui/Button';\nimport styled from 'styled-components';\n\nexport const StyledDropdownButton = styled(Button)`\n max-width: '50px';\n`;\n", "import React, { useCallback, useMemo } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport styled from 'styled-components';\nimport Dropdown, {\n type DropdownChildrenRenderer,\n type DropdownPossibleCloseReason,\n} from '@splunk/react-ui/Dropdown';\nimport Menu from '@splunk/react-ui/Menu';\nimport { SplunkThemeProvider, useSplunkTheme } from '@splunk/themes';\n\nimport AddChartDropdown from '@splunk/react-icons/ChartColumn';\n\nimport { VisualizationFilter, type Taxonomy } from '@splunk/dashboard-ui';\nimport { useFeatureFlags } from '@splunk/dashboard-context';\nimport { batch } from '@splunk/dashboard-state';\nimport ToolbarItem from '../Item';\nimport useDropdown from '../hooks/useDropdown';\nimport type { ToolbarButtonProps } from '../types/common';\nimport { prepareIcon } from '../IconButton';\nimport { StyledDropdownButton } from '../components/StyledButton';\n\ninterface ScrollableMenuProps {\n maxHeight?: number | null;\n}\n\nconst ScrollableMenu = styled(Menu).attrs<ScrollableMenuProps>(\n ({ maxHeight }) => ({\n style: {\n maxHeight: maxHeight ?? undefined,\n },\n })\n)<ScrollableMenuProps>`\n overflow-y: auto;\n`;\n\nconst chartsDropdown = prepareIcon({\n Icon: AddChartDropdown,\n isMenu: true,\n screenReaderContent: _('Add chart'),\n});\n\nconst ButtonToggle = (\n <StyledDropdownButton\n data-test=\"charts-button\"\n data-clickable\n appearance=\"subtle\"\n icon={chartsDropdown}\n />\n);\n\nconst focusToggleReasons: DropdownPossibleCloseReason[] = [\n 'escapeKey',\n 'tabKey',\n];\n\ntype Visualizations = Taxonomy[number]['visualizations'];\n\n/**\n * export for unit testing\n * @private\n */\nexport const getVisualizationListFromTaxonomy = ({\n taxonomy,\n handleCreateVisualization,\n}: {\n taxonomy: Taxonomy;\n handleCreateVisualization: (opt: {\n type: string;\n options: Record<string, unknown>;\n }) => () => void;\n}): JSX.Element[] =>\n taxonomy.reduce(\n (list: React.ReactElement[], { visualizations, category }) => {\n const availableVisualizations: Visualizations =\n visualizations.filter((props) => props.includeInToolbar);\n\n if (availableVisualizations.length === 0) {\n return list;\n }\n\n list.push(<Menu.Divider key={`menu-divider-${category}`} />);\n\n return list.concat(\n availableVisualizations.map((vizProps) => {\n const { label, type, initialOptions } = vizProps;\n const Icon = vizProps.icon as React.JSXElementConstructor<\n Record<string, unknown>\n > | null;\n\n if (!type) {\n return null;\n }\n\n const onClick = handleCreateVisualization({\n type,\n options: initialOptions as Record<string, unknown>,\n });\n\n return (\n <Menu.Item\n data-test={`add-${type}-button`}\n data-test-clickable\n onClick={onClick}\n startAdornment={!!Icon && <Icon size=\"18px\" />}\n key={`add-${type}-button`}\n >\n {label}\n </Menu.Item>\n );\n }) as JSX.Element[]\n );\n },\n []\n );\n\n/**\n * Charts button that has a dropdown menu.\n */\nconst Charts = ({ dashboardApi, preset }: ToolbarButtonProps): JSX.Element => {\n const { showNewDataForViz = true } = useFeatureFlags();\n\n const { family } = useSplunkTheme();\n const { handleForceClose, handleRequestClose, handleRequestOpen, isOpen } =\n useDropdown({\n isContentClickClose: false,\n });\n\n const taxonomy: Taxonomy = useMemo(\n () => new VisualizationFilter(preset).taxonomy,\n [preset]\n );\n\n const handleCreateVisualization = useCallback(\n ({\n type,\n options,\n }: {\n type: string;\n options: Record<string, unknown>;\n }) =>\n () => {\n batch(() => {\n dashboardApi?.createVisualization({\n visualizationDefinition: { type, options },\n });\n\n if (showNewDataForViz) {\n dashboardApi?.openPanel({\n activePanel: 'connectData',\n panelProps: {\n bindingType: 'primary',\n from: {\n activePanel: 'config',\n },\n },\n });\n }\n });\n\n handleForceClose();\n },\n [dashboardApi, showNewDataForViz, handleForceClose]\n );\n\n const visualizationList = useMemo(\n () =>\n getVisualizationListFromTaxonomy({\n taxonomy,\n handleCreateVisualization,\n }),\n [taxonomy, handleCreateVisualization]\n );\n\n const renderScrollableMenu = useCallback<DropdownChildrenRenderer>(\n ({ maxHeight }) => (\n <SplunkThemeProvider\n density={family === 'enterprise' ? 'comfortable' : 'compact'}\n >\n <ScrollableMenu\n maxHeight={maxHeight}\n data-test=\"add-chart-menu\"\n >\n {visualizationList}\n </ScrollableMenu>\n </SplunkThemeProvider>\n ),\n [family, visualizationList]\n );\n\n return (\n <ToolbarItem>\n <Dropdown\n focusToggleReasons={focusToggleReasons}\n onRequestClose={handleRequestClose}\n onRequestOpen={handleRequestOpen}\n open={isOpen}\n toggle={ButtonToggle}\n >\n {renderScrollableMenu}\n </Dropdown>\n </ToolbarItem>\n );\n};\n\nexport default Charts;\n", "\nimport * as defaultImport from \"@splunk/react-icons/Cog\";\nexport * from \"@splunk/react-icons/Cog\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport Configuration from '@splunk/react-icons/Cog';\nimport { useToolbarRef } from '@splunk/dashboard-context';\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst configurationIcon = prepareIcon({\n Icon: Configuration,\n screenReaderContent: _('Configuration'),\n});\n\n/**\n * Button that toggle open config panel\n */\nconst Config = ({ dashboardApi }: ToolbarButtonProps) => {\n const configButtonRef = useToolbarRef('config');\n\n const handleClick = useCallback(() => {\n const isOpen = dashboardApi?.getOpenedPanel() === 'config';\n if (isOpen) {\n dashboardApi?.closePanel();\n } else {\n // Open config panel\n dashboardApi?.openPanel({\n activePanel: 'config',\n panelProps: {\n focusOnOpen: true,\n },\n });\n }\n }, [dashboardApi]);\n\n return (\n <IconButton\n buttonRef={configButtonRef}\n testLabel=\"config-button\"\n onClick={handleClick}\n icon={configurationIcon}\n />\n );\n};\n\nexport default Config;\n", "\nimport * as defaultImport from \"@splunk/react-icons/ArrowBroadUnderbarDown\";\nexport * from \"@splunk/react-icons/ArrowBroadUnderbarDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { type ComponentProps } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport ArrowBroadUnderbarDown from '@splunk/react-icons/ArrowBroadUnderbarDown';\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nexport interface ContentExportProps extends ToolbarButtonProps {\n disabled?: boolean;\n onClick?: ComponentProps<typeof IconButton>['onClick'];\n}\n\nconst icon = prepareIcon({\n Icon: ArrowBroadUnderbarDown,\n screenReaderContent: _('Export'),\n});\n\nconst ContentExport = ({ disabled, onClick }: ContentExportProps) => (\n <IconButton\n testLabel=\"content-export-button\"\n onClick={onClick}\n disabled={!!disabled}\n icon={icon}\n />\n);\n\nexport default ContentExport;\n", "\nimport * as defaultImport from \"@splunk/react-icons/CylinderMulti\";\nexport * from \"@splunk/react-icons/CylinderMulti\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\n\nimport DataInput from '@splunk/react-icons/CylinderMulti';\n\nimport { useToolbarRef } from '@splunk/dashboard-context';\nimport { batch } from '@splunk/dashboard-state';\n\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst dataInputIcon = prepareIcon({\n Icon: DataInput,\n screenReaderContent: _('Data source overview'),\n});\n\n/**\n * Button that toggle data overview panel\n */\nconst Data = ({ dashboardApi }: ToolbarButtonProps) => {\n const dataButtonRef = useToolbarRef('dataOverview');\n\n const handleClick = useCallback(() => {\n const isOpen = dashboardApi?.getOpenedPanel() === 'dataOverview';\n if (isOpen) {\n dashboardApi.closePanel();\n } else {\n batch(() => {\n // Deselect all selected visualizations\n dashboardApi?.selectVisualization([]);\n // Open data overview panel\n dashboardApi?.openPanel({\n activePanel: 'dataOverview',\n panelProps: {\n focusOnOpen: true,\n },\n });\n });\n }\n }, [dashboardApi]);\n\n return (\n <IconButton\n buttonRef={dataButtonRef}\n testLabel=\"data-button\"\n onClick={handleClick}\n icon={dataInputIcon}\n />\n );\n};\n\nexport default Data;\n", "\nimport * as defaultImport from \"@splunk/react-icons/Square\";\nexport * from \"@splunk/react-icons/Square\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\n\nimport { _ } from '@splunk/ui-utils/i18n';\nimport BoxUnchecked from '@splunk/react-icons/Square';\n\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst icon = prepareIcon({\n Icon: BoxUnchecked,\n screenReaderContent: _('Add rectangle'),\n});\n\n/**\n * Button that creates a empty viz\n */\nconst EmptyVisualization = ({ dashboardApi }: ToolbarButtonProps) => {\n const handleClick = useCallback(async () => {\n dashboardApi?.createVisualization({\n visualizationDefinition: {\n type: 'splunk.rectangle',\n options: {\n fillColor: 'transparent',\n strokeColor: 'transparent',\n },\n },\n });\n\n dashboardApi?.openPanel({\n activePanel: 'config',\n });\n }, [dashboardApi]);\n\n return (\n <IconButton\n testLabel=\"empty-viz-button\"\n onClick={handleClick}\n icon={icon}\n />\n );\n};\n\nexport default EmptyVisualization;\n", "\nimport * as defaultImport from \"@splunk/react-icons/ChevronsOut\";\nexport * from \"@splunk/react-icons/ChevronsOut\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\n\nimport Fullscreen from '@splunk/react-icons/ChevronsOut';\nimport { selectFullscreenElement, useSelector } from '@splunk/dashboard-state';\n\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst icon = prepareIcon({\n Icon: Fullscreen,\n screenReaderContent: _('Fullscreen'),\n});\n\n/**\n * Button that toggle fullscreen mode\n */\nconst FullScreen = ({ dashboardApi }: ToolbarButtonProps) => {\n const isFullscreen = !!useSelector(selectFullscreenElement);\n\n const handleClick = useCallback(() => {\n dashboardApi?.enterFullscreen();\n }, [dashboardApi]);\n\n return (\n <IconButton\n testLabel=\"fullscreen-button\"\n onClick={handleClick}\n disabled={isFullscreen}\n icon={icon}\n />\n );\n};\n\nexport default FullScreen;\n", "\nimport * as defaultImport from \"@splunk/react-ui/Switch\";\nexport * from \"@splunk/react-ui/Switch\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback, useMemo } from 'react';\nimport styled from 'styled-components';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport Switch from '@splunk/react-ui/Switch';\nimport {\n selectAreGridLinesEnabled,\n useSelector,\n} from '@splunk/dashboard-state';\nimport { variables } from '@splunk/themes';\nimport ItemSeparator from '../components/ItemSeparator';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst SwitchContainer = styled.div`\n display: flex;\n align-items: center;\n flex-direction: row;\n gap: ${variables.spacingSmall};\n`;\n\nexport interface GridLineSwitchProps extends ToolbarButtonProps {\n showSeparator?: boolean;\n}\n\nconst GridLineSwitch = ({\n dashboardApi,\n mode,\n showSeparator,\n layoutType,\n}: GridLineSwitchProps) => {\n const showGrid = useSelector(selectAreGridLinesEnabled) ?? false;\n\n const handleClick = useCallback(() => {\n dashboardApi?.toggleGridLines(!showGrid);\n }, [dashboardApi, showGrid]);\n\n const separator = useMemo(\n () => (showSeparator ? <ItemSeparator key=\"item-separator\" /> : null),\n [showSeparator]\n );\n\n if (!dashboardApi || mode !== 'edit' || layoutType === 'grid') {\n return null;\n }\n\n return (\n <SwitchContainer key=\"grid-line-switch\">\n <Switch\n onClick={handleClick}\n selected={showGrid}\n selectedLabel={_('Gridlines displayed')}\n unselectedLabel={_('Gridlines not displayed')}\n appearance=\"toggle\"\n data-test=\"gridline-toggle\"\n data-clickable\n >\n {_('Gridlines')}\n </Switch>\n {separator}\n </SwitchContainer>\n );\n};\n\nexport default GridLineSwitch;\n", "\nimport * as defaultImport from \"@splunk/react-icons/ChartSingleValueIcon\";\nexport * from \"@splunk/react-icons/ChartSingleValueIcon\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback, useMemo } from 'react';\nimport styled from 'styled-components';\nimport { _ } from '@splunk/ui-utils/i18n';\n\nimport Dropdown, {\n type DropdownPossibleCloseReason,\n} from '@splunk/react-ui/Dropdown';\n\nimport AddIconDropdown from '@splunk/react-icons/ChartSingleValueIcon';\nimport { IconGallery as IconGalleryPanel } from '@splunk/dashboard-ui';\n\nimport { StyledDropdownButton } from '../components/StyledButton';\nimport ToolbarItem from '../Item';\nimport useDropdown from '../hooks/useDropdown';\nimport { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst MenusContainer = styled.div`\n display: flex;\n padding: 5px;\n`;\n\nconst iconGalleryDropdown = prepareIcon({\n Icon: AddIconDropdown,\n screenReaderContent: _('Add icon'),\n isMenu: true,\n});\n\nconst focusToggleReasons: DropdownPossibleCloseReason[] = [\n 'escapeKey',\n 'tabKey',\n];\n\n/**\n * Icon Gallery button that has as a dropdown menu.\n */\nconst IconGallery = ({ dashboardApi }: ToolbarButtonProps) => {\n const {\n handleForceClose,\n handleRequestClose,\n handleRequestOpen,\n setHasChildModal,\n isOpen,\n } = useDropdown({\n isContentClickClose: false,\n });\n\n const ButtonToggle = useMemo(\n () => (\n <StyledDropdownButton\n data-test=\"icon-gallery-button\"\n data-clickable\n appearance=\"subtle\"\n icon={iconGalleryDropdown}\n />\n ),\n []\n );\n const handlePanelClick = useCallback(\n async (iconURL: string) => {\n dashboardApi?.createVisualization({\n visualizationDefinition: {\n type: 'splunk.singlevalueicon',\n options: {\n showValue: false,\n icon: iconURL,\n },\n },\n });\n dashboardApi?.openPanel({\n activePanel: 'config',\n });\n handleForceClose();\n },\n [dashboardApi, handleForceClose]\n );\n\n return (\n <ToolbarItem>\n <Dropdown\n focusToggleReasons={focusToggleReasons}\n onRequestClose={handleRequestClose}\n onRequestOpen={handleRequestOpen}\n open={isOpen}\n toggle={ButtonToggle}\n >\n <MenusContainer data-test=\"icon-menu\" data-open={isOpen}>\n <IconGalleryPanel\n onClick={handlePanelClick}\n setHasChildModal={setHasChildModal}\n />\n </MenusContainer>\n </Dropdown>\n </ToolbarItem>\n );\n};\n\nexport default IconGallery;\n", "\nimport * as defaultImport from \"@splunk/react-icons/QuestionCircle\";\nexport * from \"@splunk/react-icons/QuestionCircle\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useMemo } from 'react';\nimport Help from '@splunk/react-icons/QuestionCircle';\nimport Dropdown from '@splunk/react-ui/Dropdown';\nimport Menu from '@splunk/react-ui/Menu';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport ToolbarItem from '../Item';\nimport useDropdown from '../hooks/useDropdown';\nimport type { ToolbarButtonProps } from '../types/common';\nimport { prepareIcon } from '../IconButton';\nimport { StyledDropdownButton } from '../components/StyledButton';\n\nexport interface ToolbarHelpLink {\n label: string;\n description?: string;\n url: string;\n}\n\ninterface HelpProps extends ToolbarButtonProps {\n helpLinks?: ToolbarHelpLink[];\n}\n\nconst focusToggleReasons: never[] = [];\n\nconst HelpIcon = prepareIcon({\n Icon: Help,\n screenReaderContent: _('Help links'),\n isMenu: true,\n});\n\nconst ButtonToggle = (\n <StyledDropdownButton\n appearance=\"subtle\"\n data-clickable\n data-test=\"help-button\"\n icon={HelpIcon}\n />\n);\n\n/**\n * Help button which expands dropdown full of links\n */\nconst HelpButton = ({ helpLinks = [] }: HelpProps) => {\n const { handleRequestClose, handleRequestOpen, isOpen } = useDropdown({\n isContentClickClose: true,\n });\n\n const HelpLinks = useMemo(() => {\n if (helpLinks.length === 0) {\n return [\n <Menu.Item\n data-test=\"no-links-provided\"\n key=\"no-links-provided\"\n disabled\n >\n {_('No Links')}\n </Menu.Item>,\n ];\n }\n\n return helpLinks.map((link: ToolbarHelpLink) => {\n const { label = '', description = '', url } = link;\n const key = label.replace(/\\s/g, '');\n\n return (\n <Menu.Item\n data-test=\"help-link\"\n data-test-clickable\n to={url}\n description={description}\n key={`help-link-${key}`}\n openInNewContext\n >\n {label}\n </Menu.Item>\n );\n });\n }, [helpLinks]);\n\n return (\n <ToolbarItem>\n <Dropdown\n focusToggleReasons={focusToggleReasons}\n onRequestClose={handleRequestClose}\n onRequestOpen={handleRequestOpen}\n open={isOpen}\n toggle={ButtonToggle}\n >\n <Menu>{HelpLinks}</Menu>\n </Dropdown>\n </ToolbarItem>\n );\n};\n\nexport default HelpButton;\n", "\nimport * as defaultImport from \"@splunk/react-icons/Picture\";\nexport * from \"@splunk/react-icons/Picture\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\n\nimport { _ } from '@splunk/ui-utils/i18n';\nimport Picture from '@splunk/react-icons/Picture';\n\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst icon = prepareIcon({\n Icon: Picture,\n screenReaderContent: _('Add image'),\n});\n\n/**\n * Button that create a empty image\n */\nconst Image = ({ dashboardApi }: ToolbarButtonProps) => {\n const handleClick = useCallback(async () => {\n dashboardApi?.createVisualization({\n visualizationDefinition: {\n type: 'splunk.image',\n options: {\n preserveAspectRatio: true,\n },\n },\n });\n\n dashboardApi?.openPanel({\n activePanel: 'config',\n });\n }, [dashboardApi]);\n\n return (\n <IconButton\n testLabel=\"image-button\"\n onClick={handleClick}\n icon={icon}\n />\n );\n};\n\nexport default Image;\n", "import React, { useCallback } from 'react';\nimport styled from 'styled-components';\n\nimport Dropdown from '@splunk/react-ui/Dropdown';\nimport { _ } from '@splunk/ui-utils/i18n';\n\nimport AddImage from '@splunk/react-icons/Picture';\n\nimport { ImageGallery as ImageGalleryPanel } from '@splunk/dashboard-ui';\n\nimport { StyledDropdownButton } from '../components/StyledButton';\nimport ToolbarItem from '../Item';\nimport useDropdown from '../hooks/useDropdown';\nimport { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst MenusContainer = styled.div`\n display: flex;\n padding: 5px;\n`;\n\nconst imageGalleryDropdown = prepareIcon({\n Icon: AddImage,\n screenReaderContent: _('Add image'),\n isMenu: true,\n});\n\nconst ButtonToggle = (\n <StyledDropdownButton\n data-test=\"image-gallery-button\"\n data-clickable\n appearance=\"subtle\"\n icon={imageGalleryDropdown}\n />\n);\n\nconst focusToggleReasons: never[] = [];\n\n/**\n * Image Gallery button that has as a dropdown menu.\n */\nconst ImageGallery = ({ dashboardApi }: ToolbarButtonProps) => {\n const {\n handleForceClose,\n handleRequestClose,\n handleRequestOpen,\n setHasChildModal,\n isOpen,\n } = useDropdown({\n isContentClickClose: false,\n });\n\n const handlePanelClick = useCallback(\n async (imageUrl: string) => {\n dashboardApi?.createVisualization({\n visualizationDefinition: {\n type: 'splunk.image',\n options: {\n preserveAspectRatio: true,\n src: imageUrl,\n },\n },\n });\n dashboardApi?.openPanel({\n activePanel: 'config',\n });\n handleForceClose();\n },\n [dashboardApi, handleForceClose]\n );\n\n return (\n <ToolbarItem>\n <Dropdown\n focusToggleReasons={focusToggleReasons}\n onRequestClose={handleRequestClose}\n onRequestOpen={handleRequestOpen}\n open={isOpen}\n toggle={ButtonToggle}\n >\n <MenusContainer>\n <ImageGalleryPanel\n onClick={handlePanelClick}\n setHasChildModal={setHasChildModal}\n />\n </MenusContainer>\n </Dropdown>\n </ToolbarItem>\n );\n};\n\nexport default ImageGallery;\n", "\nimport * as defaultImport from \"lodash\";\nexport * from \"lodash\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/SlidersTripleHorizontal\";\nexport * from \"@splunk/react-icons/SlidersTripleHorizontal\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/dashboard-definition\";\nexport * from \"@splunk/dashboard-definition\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useMemo } from 'react';\nimport { each } from 'lodash';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport Dropdown, {\n type DropdownPossibleCloseReason,\n} from '@splunk/react-ui/Dropdown';\nimport Menu from '@splunk/react-ui/Menu';\nimport Input from '@splunk/react-icons/SlidersTripleHorizontal';\nimport { DashboardDefinition } from '@splunk/dashboard-definition';\nimport type {\n PresetMap,\n InputConfig,\n DashboardApi,\n} from '@splunk/dashboard-types';\n\nimport { StyledDropdownButton } from '../components/StyledButton';\nimport useDropdown from '../hooks/useDropdown';\nimport ToolbarItem from '../Item';\nimport { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst focusToggleReasons: DropdownPossibleCloseReason[] = [\n 'escapeKey',\n 'tabKey',\n];\n\nconst DEFAULT_PRESET_MAP = Object.freeze({} as PresetMap);\nconst addInputIcon = prepareIcon({\n Icon: Input,\n screenReaderContent: _('Add input'),\n isMenu: true,\n});\n\nconst ButtonToggle = (\n <StyledDropdownButton\n appearance=\"subtle\"\n data-clickable\n data-test=\"inputs-button\"\n icon={addInputIcon}\n />\n);\n\ninterface AddInputFactoryArgs {\n type: string;\n defaultConfig: {\n options?: Record<string, unknown>;\n [x: string]: unknown;\n };\n tokenPrefix: string;\n showToken: boolean;\n dashboardApi?: DashboardApi;\n}\n\n// click handler factory\nconst onCreateInputClickFactory =\n ({\n type,\n defaultConfig,\n tokenPrefix,\n showToken,\n dashboardApi,\n }: AddInputFactoryArgs) =>\n () => {\n if (!dashboardApi) {\n return;\n }\n\n const newConfig = {\n ...defaultConfig,\n type,\n options: {\n ...defaultConfig.options,\n },\n };\n // showToken flags whether or not the input has a token assigned on creation\n if (showToken) {\n newConfig.options.token = DashboardDefinition.fromJSON(\n dashboardApi?.getDefinition()\n ).nextTokenId(tokenPrefix);\n }\n dashboardApi.addInput(newConfig);\n dashboardApi.openPanel({ activePanel: 'config' });\n };\n\n/**\n * Add Input button that has a dropdown menu.\n */\nconst Inputs = ({\n dashboardApi,\n preset = DEFAULT_PRESET_MAP,\n}: ToolbarButtonProps) => {\n const { handleRequestClose, handleRequestOpen, isOpen } = useDropdown({\n isContentClickClose: true,\n });\n\n const InputTypeButtons = useMemo(() => {\n const buttons = [];\n\n const inputs = preset?.inputs as Record<\n string,\n {\n config: InputConfig;\n }\n >;\n\n each(inputs, (InputImpl, type) => {\n const {\n baseShape = {},\n label = _(`${type} Input`),\n description = '',\n tokenPrefix = 'token',\n includeInToolbar = true,\n icon: Icon = Input,\n // showToken flags whether or not the input has a token assigned on creation\n showToken = true,\n } = InputImpl.config || {};\n\n if (!includeInToolbar) {\n return;\n }\n\n const handleClick = onCreateInputClickFactory({\n type,\n defaultConfig: baseShape,\n tokenPrefix,\n showToken,\n dashboardApi,\n });\n\n const inputIcon = <Icon width=\"24px\" height=\"24px\" />;\n\n buttons.push(\n <Menu.Item\n data-test={`add-${type}-button`}\n data-test-clickable\n onClick={handleClick}\n startAdornment={inputIcon}\n description={description}\n key={`add-${type}-button`}\n >\n {label}\n </Menu.Item>\n );\n });\n\n if (buttons.length === 0) {\n buttons.push(\n <Menu.Item\n data-test=\"no-inputs-in-preset\"\n key=\"no-inputs-in-preset\"\n disabled\n >\n {_('No Inputs')}\n </Menu.Item>\n );\n }\n\n return buttons;\n }, [preset, dashboardApi]);\n\n return (\n <ToolbarItem>\n <Dropdown\n focusToggleReasons={focusToggleReasons}\n onRequestClose={handleRequestClose}\n onRequestOpen={handleRequestOpen}\n open={isOpen}\n toggle={ButtonToggle}\n >\n <Menu>{InputTypeButtons}</Menu>\n </Dropdown>\n </ToolbarItem>\n );\n};\n\nexport default Inputs;\n", "\nimport * as defaultImport from \"@splunk/react-icons/Markdown\";\nexport * from \"@splunk/react-icons/Markdown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport MarkdownIcon from '@splunk/react-icons/Markdown';\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst icon = prepareIcon({\n Icon: MarkdownIcon,\n screenReaderContent: _('Add markdown text'),\n});\n\n/**\n * Button that creates a empty markdown viz\n */\nconst Markdown = ({ dashboardApi }: ToolbarButtonProps): JSX.Element => {\n const handleClick = useCallback(() => {\n dashboardApi?.createVisualization({\n visualizationDefinition: {\n type: 'splunk.markdown',\n options: {\n markdown: '',\n },\n },\n });\n dashboardApi?.openPanel({\n activePanel: 'config',\n });\n }, [dashboardApi]);\n\n return (\n <IconButton\n testLabel=\"markdown-button\"\n onClick={handleClick}\n icon={icon}\n />\n );\n};\n\nexport default Markdown;\n", "\nimport * as defaultImport from \"@splunk/react-icons/ArrowBowRight\";\nexport * from \"@splunk/react-icons/ArrowBowRight\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback, useState, useEffect } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport RedoIcon from '@splunk/react-icons/ArrowBowRight';\nimport IconButton, { prepareIcon } from '../IconButton';\nimport type { ToolbarButtonProps } from '../types/common';\n\nconst icon = prepareIcon({\n Icon: RedoIcon,\n screenReaderContent: _('Redo'),\n});\n\nconst Redo = ({ dashboardApi }: ToolbarButtonProps) => {\n // TODO: replace when history management is done in redux\n // mode changes can cause the button to mount while there is a redo state\n const [canRedo, setCanRedo] = useState(\n () => dashboardApi?.canRedo() ?? false\n );\n\n const onDefinitionChange = useCallback(() => {\n setCanRedo(dashboardApi?.canRedo() ?? 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.redo({ source: 'toolbar' });\n }, [dashboardApi]);\n\n return (\n <IconButton\n testLabel=\"redo-button\"\n onClick={handleClick}\n disabled={!canRedo}\n icon={icon}\n />\n );\n};\n\nexport default Redo;\n", "\nimport * as defaultImport from \"@splunk/react-icons/Circle\";\nexport * from \"@splunk/react-icons/Circle\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/Line\";\nexport * from \"@splunk/react-icons/Line\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/ShapesVariety\";\nexport * from \"@splunk/react-icons/ShapesVariety\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React from 'react';\nimport styled from 'styled-components';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledContentWrapper = styled.span`\n display: flex;\n flex-direction: row;\n justify-content: left;\n align-items: center;\n max-width: 100%;\n`;\n\nconst StyledIcon = styled.span`\n display: inline-block;\n padding-right: 8px;\n`;\n\nconst StyledLabel = styled.span`\n text-overflow: ellipsis;\n overflow: hidden;\n flex: 0 1 auto;\n`;\n\nexport interface PopoverItemButtonProps extends ToolbarButtonProps {\n icon: JSX.Element;\n label?: string;\n}\n\n/**\n * Custom button component for popovers created for specific styling - aligning text to the left\n */\nconst PopoverItemButton = ({ icon, label }: PopoverItemButtonProps) => (\n <StyledContentWrapper>\n {icon && <StyledIcon>{icon}</StyledIcon>}\n {label && <StyledLabel data-test=\"label-title\">{label}</StyledLabel>}\n </StyledContentWrapper>\n);\n\nexport default PopoverItemButton;\n", "import React, { useCallback } from 'react';\nimport Menu from '@splunk/react-ui/Menu';\nimport Circle from '@splunk/react-icons/Circle';\nimport BoxUnchecked from '@splunk/react-icons/Square';\nimport Line from '@splunk/react-icons/Line';\nimport Dropdown, {\n type DropdownPossibleCloseReason,\n} from '@splunk/react-ui/Dropdown';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport AddShapeDropdown from '@splunk/react-icons/ShapesVariety';\nimport type {\n StructureItemType,\n VisualizationDefinition,\n} from '@splunk/dashboard-types';\nimport { StyledDropdownButton } from '../components/StyledButton';\nimport useDropdown from '../hooks/useDropdown';\nimport ToolbarItem from '../Item';\nimport PopoverItemButton from '../PopoverItemButton';\nimport type { ToolbarButtonProps } from '../types/common';\nimport { prepareIcon } from '../IconButton';\n\nconst shapesDropdown = prepareIcon({\n Icon: AddShapeDropdown,\n screenReaderContent: _('Add shape'),\n isMenu: true,\n});\n\nconst ButtonToggle = (\n <StyledDropdownButton\n appearance=\"subtle\"\n data-clickable\n data-test=\"shapes-button\"\n icon={shapesDropdown}\n />\n);\n\nconst focusToggleReasons: DropdownPossibleCloseReason[] = [\n 'escapeKey',\n 'tabKey',\n];\n\nconst circleIcon = <Circle />;\nconst uncheckedBoxIcon = <BoxUnchecked />;\nconst lineIcon = <Line />;\n\n/**\n * Shapes button that has a dropdown menu.\n */\nconst Shapes = ({ dashboardApi, layoutType }: ToolbarButtonProps) => {\n const supportLine = layoutType === 'absolute';\n\n const { handleRequestClose, handleRequestOpen, isOpen } = useDropdown({\n isContentClickClose: true,\n });\n\n const handleCreateVizButtonClick = useCallback(\n (\n vizToCreate: VisualizationDefinition<Record<string, unknown>>,\n layoutItemType?: StructureItemType\n ) => {\n return () => {\n dashboardApi?.createVisualization({\n visualizationDefinition: vizToCreate,\n layoutItemType,\n });\n dashboardApi?.openPanel({ activePanel: 'config' });\n };\n },\n [dashboardApi]\n );\n\n return (\n <ToolbarItem>\n <Dropdown\n focusToggleReasons={focusToggleReasons}\n onRequestClose={handleRequestClose}\n onRequestOpen={handleRequestOpen}\n open={isOpen}\n toggle={ButtonToggle}\n >\n <Menu data-test=\"shapes-dropdown-children-container\">\n <Menu.Item\n data-test=\"ellipse-button\"\n onClick={handleCreateVizButtonClick({\n type: 'splunk.ellipse',\n })}\n >\n <PopoverItemButton\n icon={circleIcon}\n label={_('Ellipse')}\n />\n </Menu.Item>\n <Menu.Item\n data-test=\"rectangle-button\"\n onClick={handleCreateVizButtonClick({\n type: 'splunk.rectangle',\n })}\n >\n <PopoverItemButton\n icon={uncheckedBoxIcon}\n label={_('Rectangle')}\n />\n </Menu.Item>\n {supportLine && (\n <Menu.Item\n data-test=\"line-button\"\n onClick={handleCreateVizButtonClick(\n {\n type: 'abslayout.line',\n },\n 'line'\n )}\n >\n <PopoverItemButton\n icon={lineIcon}\n label={_('Line')}\n />\n </Menu.Item>\n )}\n </Menu>\n </Dropdown>\n </ToolbarItem>\n );\n};\n\nexport default Shapes;\n", "\nimport * as defaultImport from \"@splunk/react-icons/WindowChevronsSlash\";\nexport * from \"@splunk/react-icons/WindowChevronsSlash\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { type ComponentProps } from 'react';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport SourceIcon from '@splunk/react-icons/WindowChevronsSlash';\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 toggle source mode\n */\nconst Source = ({ disabled = false, onClick }: SourceProps) => (\n <IconButton\n testLabel=\"source-button\"\n onClick={onClick}\n disabled={disabled}\n icon={icon}\n />\n);\n\nexport default Source;\n", "\nimport * as defaultImport from \"@splunk/react-icons/ListToken\";\nexport * from \"@splunk/react-icons/ListToken\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-ui/Tooltip\";\nexport * from \"@splunk/react-ui/Tooltip\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\nimport { useFeatureFlags } from '@splunk/dashboard-context';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport ListToken from '@splunk/react-icons/ListToken';\nimport Tooltip from '@splunk/react-ui/Tooltip';\nimport IconButton, { prepareIcon } from '../../IconButton';\nimport type { ToolbarButtonProps } from '../../types/common';\n\nconst tokenManagerIcon = prepareIcon({\n Icon: ListToken,\n screenReaderContent: _('Token manager'),\n});\n\n/**\n * Button that toggles open token manager panel\n */\nexport const TokenManager = ({ dashboardApi }: ToolbarButtonProps) => {\n const { showTokenManager } = useFeatureFlags();\n\n const handleClick = useCallback(() => {\n const isOpen = dashboardApi?.getOpenedPanel() === 'tokenManager';\n if (isOpen) {\n dashboardApi?.closePanel();\n } else {\n // Open tokens panel\n dashboardApi?.openPanel({\n activePanel: 'tokenManager',\n panelProps: {\n focusOnOpen: true,\n },\n });\n }\n }, [dashboardApi]);\n\n if (!showTokenManager) {\n return null;\n }\n\n return (\n <Tooltip\n contentRelationship=\"label\"\n content={_('Token manager')}\n data-test-label=\"token-manager-button\"\n >\n <IconButton\n testLabel=\"token-manager-button\"\n onClick={handleClick}\n icon={tokenManagerIcon}\n />\n </Tooltip>\n );\n};\n", "\nimport * as defaultImport from \"@splunk/react-icons/ArrowBowLeft\";\nexport * from \"@splunk/react-icons/ArrowBowLeft\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "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", "\nimport * as defaultImport from \"@splunk/dashboard-telemetry\";\nexport * from \"@splunk/dashboard-telemetry\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/ui-utils/format\";\nexport * from \"@splunk/ui-utils/format\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-ui/Number\";\nexport * from \"@splunk/react-ui/Number\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React, { useCallback } from 'react';\nimport styled from 'styled-components';\nimport Number from '@splunk/react-ui/Number';\nimport { variables } from '@splunk/themes';\nimport { useNumberInput, type OnValueChangeType } from '@splunk/dashboard-ui';\n\nconst StyledNumber = styled(Number)`\n padding-right: ${variables.spacingSmall};\n & > input {\n text-align: right;\n }\n`;\n\nconst StyledEndAdornment = styled.span`\n color: ${variables.contentColorActive};\n`;\n\ninterface ZoomNumberProps {\n currentScale: number;\n onScaleChange: (scale: number) => () => void;\n}\n\nexport const ZoomNumber = ({\n currentScale,\n onScaleChange,\n}: ZoomNumberProps) => {\n const onValueChange = useCallback<OnValueChangeType>(\n (e, value = 100) => {\n onScaleChange(value as number)();\n },\n [onScaleChange]\n );\n const { handleChange, handleBlur, handleFocus, handleKeyPress } =\n useNumberInput({\n value: currentScale,\n onValueChange,\n });\n\n return (\n <StyledNumber\n value={currentScale}\n onChange={handleChange}\n onKeyDown={handleKeyPress}\n onBlur={handleBlur}\n onFocus={handleFocus}\n step={5}\n min={1}\n max={10000}\n roundTo={0}\n endAdornment={<StyledEndAdornment>%</StyledEndAdornment>}\n hideStepButtons\n data-test=\"zoom-number\"\n append\n />\n );\n};\n", "import React, { useCallback, useMemo, useState, useEffect } from 'react';\nimport styled from 'styled-components';\nimport { debounce } from 'lodash';\n\nimport { _ } from '@splunk/ui-utils/i18n';\nimport { variables } from '@splunk/themes';\nimport Tooltip from '@splunk/react-ui/Tooltip';\nimport type { ButtonPropsBase } from '@splunk/react-ui/Button';\n\nimport { useDashboardApi } from '@splunk/dashboard-context';\nimport { useTelemetryApi } from '@splunk/dashboard-telemetry';\nimport { selectActiveTab, useSelector } from '@splunk/dashboard-state';\n\nimport type { ToolbarButtonProps } from '../../types/common';\nimport ItemSeparator from '../../components/ItemSeparator';\nimport { ZoomMenu } from './ZoomMenu';\nimport { ZoomNumber } from './ZoomNumber';\n\nconst Container = styled.div`\n margin-inline-end: 0;\n display: flex;\n min-width: 96px;\n gap: ${variables.spacingSmall};\n`;\n\nconst StyledTooltip = styled(Tooltip)`\n width: 110px;\n & span {\n display: flex;\n }\n`;\n\nexport interface ZoomProps extends ToolbarButtonProps {\n appearance?: ButtonPropsBase['appearance'];\n showSeparator?: boolean;\n}\n\nexport const Zoom = ({\n showSeparator = true,\n appearance = 'default',\n mode = 'view',\n}: ZoomProps): JSX.Element => {\n const [currentScale, setCurrentScale] = useState(100);\n const [scaleType, setScaleType] = useState<'auto' | 'fit' | null>(null);\n const telemetry = useTelemetryApi();\n const dashboardApi = useDashboardApi();\n\n const handleZoom = useCallback((level?: number) => {\n if (level) {\n setCurrentScale(Math.round(level * 100));\n }\n }, []);\n\n const emitTelemetry = useMemo(\n () => debounce(telemetry.emit.bind(telemetry), 500),\n [telemetry]\n );\n\n useEffect(() => {\n emitTelemetry({\n pageAction: 'dashboard.zoom',\n source: 'toolbar',\n event: 'dashboard.zoom_level_change',\n metadata: {\n scale: currentScale,\n scaleType,\n mode,\n },\n });\n }, [currentScale, scaleType, emitTelemetry, mode]);\n\n const activeTabId = useSelector(selectActiveTab);\n useEffect(() => {\n const subscription = dashboardApi\n ?.getZoomLevel()\n ?.subscribe({ next: handleZoom });\n\n return () => {\n subscription?.unsubscribe();\n };\n }, [dashboardApi, activeTabId, handleZoom]);\n\n const separator = useMemo(\n () => (showSeparator ? <ItemSeparator key=\"item-separator\" /> : null),\n [showSeparator]\n );\n\n const handleScaleChange = useCallback(\n (scale: number) => () => {\n setCurrentScale(scale);\n setScaleType(null);\n dashboardApi?.setScale({ scale: scale / 100 });\n },\n [dashboardApi]\n );\n\n return (\n <Container>\n <StyledTooltip\n contentRelationship=\"label\"\n content={_('Zoom level')}\n >\n <ZoomNumber\n currentScale={currentScale}\n onScaleChange={handleScaleChange}\n />\n <ZoomMenu\n dashboardApi={dashboardApi}\n appearance={appearance}\n currentScale={currentScale}\n setCurrentScale={setCurrentScale}\n scaleType={scaleType}\n setScaleType={setScaleType}\n />\n </StyledTooltip>\n {separator}\n </Container>\n );\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon", "defaultImport", "icon", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon", "MenusContainer", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon", "defaultImport", "icon", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon", "defaultImport", "defaultImport", "defaultImport", "icon", "defaultImport", "defaultImport", "defaultImport"]
|
|
7
7
|
}
|
package/groups/EditingGroup.js
CHANGED
|
@@ -25,6 +25,7 @@ var __spreadValues = (a, b) => {
|
|
|
25
25
|
return a;
|
|
26
26
|
};
|
|
27
27
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
28
|
+
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
28
29
|
var __objRest = (source, exclude) => {
|
|
29
30
|
var target = {};
|
|
30
31
|
for (var prop in source)
|
|
@@ -121,7 +122,7 @@ var Group = styled_components_default.div.attrs({
|
|
|
121
122
|
flex-direction: row;
|
|
122
123
|
gap: ${(props) => props.gap};
|
|
123
124
|
`;
|
|
124
|
-
var ItemGroup = (_a) => {
|
|
125
|
+
var ItemGroup = /* @__PURE__ */ __name((_a) => {
|
|
125
126
|
var _b = _a, {
|
|
126
127
|
children,
|
|
127
128
|
borders = true,
|
|
@@ -137,7 +138,7 @@ var ItemGroup = (_a) => {
|
|
|
137
138
|
);
|
|
138
139
|
const separator = borders ? /* @__PURE__ */ react_default.createElement(ItemSeparator_default, null) : null;
|
|
139
140
|
return /* @__PURE__ */ react_default.createElement(react_default.Fragment, null, /* @__PURE__ */ react_default.createElement(Group, { gap: (0, dashboard_utils_exports.toPx)(gap, 2) }, items), separator);
|
|
140
|
-
};
|
|
141
|
+
}, "ItemGroup");
|
|
141
142
|
var ItemGroup_default = ItemGroup;
|
|
142
143
|
|
|
143
144
|
// esm-externals:@splunk/ui-utils/i18n
|
|
@@ -207,7 +208,7 @@ var dashboard_state_default = "default" in defaultImport11 ? defaultImport11.def
|
|
|
207
208
|
var Item_default = styled_components_default.div``;
|
|
208
209
|
|
|
209
210
|
// src/hooks/useDropdown.ts
|
|
210
|
-
var useDropdown = ({
|
|
211
|
+
var useDropdown = /* @__PURE__ */ __name(({
|
|
211
212
|
isContentClickClose = true
|
|
212
213
|
}) => {
|
|
213
214
|
const [isOpen, setIsOpen] = (0, react_exports.useState)(false);
|
|
@@ -240,7 +241,7 @@ var useDropdown = ({
|
|
|
240
241
|
handleForceClose,
|
|
241
242
|
setHasChildModal
|
|
242
243
|
};
|
|
243
|
-
};
|
|
244
|
+
}, "useDropdown");
|
|
244
245
|
var useDropdown_default = useDropdown;
|
|
245
246
|
|
|
246
247
|
// esm-externals:@splunk/react-icons/CaretDown
|
|
@@ -276,7 +277,7 @@ var StyledDropdownIcon = styled_components_default(CaretDown_default)`
|
|
|
276
277
|
`;
|
|
277
278
|
var iconSize = 24;
|
|
278
279
|
var menuIconSize = 20;
|
|
279
|
-
var prepareIcon = (_a) => {
|
|
280
|
+
var prepareIcon = /* @__PURE__ */ __name((_a) => {
|
|
280
281
|
var _b = _a, {
|
|
281
282
|
Icon,
|
|
282
283
|
screenReaderContent,
|
|
@@ -288,7 +289,7 @@ var prepareIcon = (_a) => {
|
|
|
288
289
|
]);
|
|
289
290
|
const size = isMenu ? menuIconSize : iconSize;
|
|
290
291
|
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));
|
|
291
|
-
};
|
|
292
|
+
}, "prepareIcon");
|
|
292
293
|
|
|
293
294
|
// src/components/StyledButton.tsx
|
|
294
295
|
var StyledDropdownButton = styled_components_default(Button_default)`
|
|
@@ -402,7 +403,7 @@ var SwitchContainer = styled_components_default.div`
|
|
|
402
403
|
flex-direction: row;
|
|
403
404
|
gap: ${themes_exports.variables.spacingSmall};
|
|
404
405
|
`;
|
|
405
|
-
var GridLineSwitch = ({
|
|
406
|
+
var GridLineSwitch = /* @__PURE__ */ __name(({
|
|
406
407
|
dashboardApi,
|
|
407
408
|
mode,
|
|
408
409
|
showSeparator,
|
|
@@ -433,7 +434,7 @@ var GridLineSwitch = ({
|
|
|
433
434
|
},
|
|
434
435
|
(0, i18n_exports._)("Gridlines")
|
|
435
436
|
), separator);
|
|
436
|
-
};
|
|
437
|
+
}, "GridLineSwitch");
|
|
437
438
|
var GridLineSwitch_default = GridLineSwitch;
|
|
438
439
|
|
|
439
440
|
// esm-externals:@splunk/react-icons/ChartSingleValueIcon
|
|
@@ -549,7 +550,7 @@ var icon5 = prepareIcon({
|
|
|
549
550
|
});
|
|
550
551
|
|
|
551
552
|
// src/buttons/ModeSwitch.tsx
|
|
552
|
-
var ModeSwitch = () => {
|
|
553
|
+
var ModeSwitch = /* @__PURE__ */ __name(() => {
|
|
553
554
|
const mode = (0, dashboard_state_exports.useSelector)(dashboard_state_exports.selectMode);
|
|
554
555
|
const dashboardApi = (0, dashboard_context_exports.useDashboardApi)();
|
|
555
556
|
const appearance = mode === "edit" ? "secondary" : "primary";
|
|
@@ -569,7 +570,7 @@ var ModeSwitch = () => {
|
|
|
569
570
|
onClick: handleClick
|
|
570
571
|
}
|
|
571
572
|
));
|
|
572
|
-
};
|
|
573
|
+
}, "ModeSwitch");
|
|
573
574
|
var ModeSwitch_default = ModeSwitch;
|
|
574
575
|
|
|
575
576
|
// esm-externals:@splunk/react-icons/ArrowBowRight
|
|
@@ -720,7 +721,7 @@ var buttonStyle = {
|
|
|
720
721
|
var menuStyle = {
|
|
721
722
|
width: "200px"
|
|
722
723
|
};
|
|
723
|
-
var ZoomMenu = ({
|
|
724
|
+
var ZoomMenu = /* @__PURE__ */ __name(({
|
|
724
725
|
dashboardApi,
|
|
725
726
|
appearance = "default",
|
|
726
727
|
currentScale,
|
|
@@ -865,7 +866,7 @@ var ZoomMenu = ({
|
|
|
865
866
|
dropdownMenuChildren
|
|
866
867
|
)
|
|
867
868
|
);
|
|
868
|
-
};
|
|
869
|
+
}, "ZoomMenu");
|
|
869
870
|
|
|
870
871
|
// esm-externals:@splunk/react-ui/Number
|
|
871
872
|
var Number_exports = {};
|
|
@@ -886,7 +887,7 @@ var StyledNumber = styled_components_default(Number_default)`
|
|
|
886
887
|
var StyledEndAdornment = styled_components_default.span`
|
|
887
888
|
color: ${themes_exports.variables.contentColorActive};
|
|
888
889
|
`;
|
|
889
|
-
var ZoomNumber = ({
|
|
890
|
+
var ZoomNumber = /* @__PURE__ */ __name(({
|
|
890
891
|
currentScale,
|
|
891
892
|
onScaleChange
|
|
892
893
|
}) => {
|
|
@@ -918,7 +919,7 @@ var ZoomNumber = ({
|
|
|
918
919
|
append: true
|
|
919
920
|
}
|
|
920
921
|
);
|
|
921
|
-
};
|
|
922
|
+
}, "ZoomNumber");
|
|
922
923
|
|
|
923
924
|
// src/buttons/Zoom/Zoom.tsx
|
|
924
925
|
var Container = styled_components_default.div`
|
|
@@ -933,7 +934,7 @@ var StyledTooltip = styled_components_default(Tooltip_default)`
|
|
|
933
934
|
display: flex;
|
|
934
935
|
}
|
|
935
936
|
`;
|
|
936
|
-
var Zoom = ({
|
|
937
|
+
var Zoom = /* @__PURE__ */ __name(({
|
|
937
938
|
showSeparator = true,
|
|
938
939
|
appearance = "default",
|
|
939
940
|
mode = "view"
|
|
@@ -1008,10 +1009,10 @@ var Zoom = ({
|
|
|
1008
1009
|
}
|
|
1009
1010
|
)
|
|
1010
1011
|
), separator);
|
|
1011
|
-
};
|
|
1012
|
+
}, "Zoom");
|
|
1012
1013
|
|
|
1013
1014
|
// src/groups/EditingGroup.tsx
|
|
1014
|
-
var EditingGroup = (props) => {
|
|
1015
|
+
var EditingGroup = /* @__PURE__ */ __name((props) => {
|
|
1015
1016
|
const { enableModeSwitch = true, borders = true, layoutType } = props;
|
|
1016
1017
|
const { spacingSmall } = (0, themes_exports.useSplunkTheme)();
|
|
1017
1018
|
const modeSwitch = (0, react_exports.useMemo)(() => {
|
|
@@ -1024,6 +1025,6 @@ var EditingGroup = (props) => {
|
|
|
1024
1025
|
return layoutType === "absolute" ? [/* @__PURE__ */ react_default.createElement(Zoom, { key: "zoom", showSeparator: borders })] : null;
|
|
1025
1026
|
}, [layoutType, borders]);
|
|
1026
1027
|
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);
|
|
1027
|
-
};
|
|
1028
|
+
}, "EditingGroup");
|
|
1028
1029
|
var EditingGroup_default = EditingGroup;
|
|
1029
1030
|
//# sourceMappingURL=EditingGroup.js.map
|