@splunk/dashboard-toolbar 29.0.0 → 29.2.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 +2 -7
- package/CollapsibleToolbar.js.map +3 -3
- package/IconButton.js.map +1 -1
- package/Item.js.map +1 -1
- package/ItemGroup.js.map +1 -1
- package/PopoverItemButton.js.map +1 -1
- package/README.md +1 -1
- package/Toolbar.js.map +1 -1
- package/buttons/Charts.js +4 -1
- package/buttons/Charts.js.map +3 -3
- package/buttons/Config.js.map +1 -1
- package/buttons/ContentExport.js.map +1 -1
- package/buttons/Data.js.map +1 -1
- package/buttons/EmptyVisualization.js +1 -1
- package/buttons/EmptyVisualization.js.map +1 -1
- package/buttons/ExportDashboardButton.js.map +1 -1
- package/buttons/Fullscreen.js.map +1 -1
- package/buttons/GridLineSwitch.js.map +1 -1
- package/buttons/HelpButton.js.map +1 -1
- package/buttons/IconGallery.js +5 -2
- package/buttons/IconGallery.js.map +3 -3
- package/buttons/Image.js +1 -1
- package/buttons/Image.js.map +1 -1
- package/buttons/ImageGallery.js +1 -1
- package/buttons/ImageGallery.js.map +1 -1
- package/buttons/Inputs.js +4 -1
- package/buttons/Inputs.js.map +3 -3
- package/buttons/Markdown.js.map +1 -1
- package/buttons/ModeSwitch.js.map +1 -1
- package/buttons/Redo.js.map +1 -1
- package/buttons/Shapes.js +4 -1
- package/buttons/Shapes.js.map +3 -3
- package/buttons/Source.js.map +1 -1
- package/buttons/Undo.js.map +1 -1
- package/buttons/index.js +188 -139
- package/buttons/index.js.map +4 -4
- package/groups/ActionsGroup.js.map +1 -1
- package/groups/ControlGroup.js +88 -97
- package/groups/ControlGroup.js.map +4 -4
- package/groups/EditingGroup.js +97 -109
- package/groups/EditingGroup.js.map +4 -4
- package/groups/EditorGroup.js +88 -97
- package/groups/EditorGroup.js.map +4 -4
- package/groups/EditorsControlGroup.js +135 -109
- package/groups/EditorsControlGroup.js.map +4 -4
- package/groups/HistoryGroup.js +88 -97
- package/groups/HistoryGroup.js.map +4 -4
- package/groups/SidebarControlGroup.js +124 -98
- package/groups/SidebarControlGroup.js.map +4 -4
- package/groups/VisualizationGroup.js +107 -104
- package/groups/VisualizationGroup.js.map +4 -4
- package/groups/index.js +138 -103
- package/groups/index.js.map +4 -4
- package/index.js +150 -106
- package/index.js.map +4 -4
- package/module/CollapsibleToolbar.js +10 -10
- package/module/IconButton.js +5 -5
- package/module/Item.js +2 -2
- package/module/ItemGroup.js +6 -6
- package/module/PopoverItemButton.js +3 -3
- package/module/Toolbar.js +5 -5
- package/module/buttons/Charts.js +14 -14
- package/module/buttons/Config.js +8 -8
- package/module/buttons/ContentExport.js +8 -8
- package/module/buttons/Data.js +9 -9
- package/module/buttons/EmptyVisualization.js +8 -8
- package/module/buttons/ExportDashboardButton.js +7 -7
- package/module/buttons/Fullscreen.js +8 -8
- package/module/buttons/GridLineSwitch.js +7 -7
- package/module/buttons/HelpButton.js +10 -10
- package/module/buttons/IconGallery.js +10 -10
- package/module/buttons/Image.js +8 -8
- package/module/buttons/ImageGallery.js +11 -11
- package/module/buttons/Inputs.js +10 -10
- package/module/buttons/Markdown.js +7 -7
- package/module/buttons/ModeSwitch.js +8 -8
- package/module/buttons/Redo.js +7 -7
- package/module/buttons/Shapes.js +12 -12
- package/module/buttons/Source.js +7 -7
- package/module/buttons/Undo.js +7 -7
- package/module/buttons/index.js +41 -39
- package/module/chunks/{chunk-FVGABOJM.js → chunk-2KANDQBI.js} +11 -8
- package/module/chunks/chunk-2KANDQBI.js.map +7 -0
- package/module/chunks/{chunk-52TYQW2Y.js → chunk-2KBENXG3.js} +1 -1
- package/module/chunks/{chunk-52TYQW2Y.js.map → chunk-2KBENXG3.js.map} +1 -1
- package/module/chunks/{chunk-FSOMEJXM.js → chunk-2OAGCVHC.js} +4 -4
- package/module/chunks/{chunk-FSOMEJXM.js.map → chunk-2OAGCVHC.js.map} +1 -1
- package/module/chunks/{chunk-NWVLNDCF.js → chunk-2QBSLWJJ.js} +1 -1
- package/module/chunks/{chunk-NWVLNDCF.js.map → chunk-2QBSLWJJ.js.map} +1 -1
- package/module/chunks/{chunk-GWAXQYWY.js → chunk-47MSCQAS.js} +5 -5
- package/module/chunks/{chunk-GWAXQYWY.js.map → chunk-47MSCQAS.js.map} +1 -1
- package/module/chunks/{chunk-ECEBJH6K.js → chunk-4CPQH3IK.js} +8 -8
- package/module/chunks/{chunk-ECEBJH6K.js.map → chunk-4CPQH3IK.js.map} +1 -1
- package/module/chunks/{chunk-KJLRQLFH.js → chunk-4NRVBOUP.js} +5 -5
- package/module/chunks/{chunk-OTGQ73VF.js → chunk-4Y6PRJOC.js} +4 -4
- package/module/chunks/{chunk-OTGQ73VF.js.map → chunk-4Y6PRJOC.js.map} +1 -1
- package/module/chunks/{chunk-JILFF3WY.js → chunk-56627Y63.js} +14 -11
- package/module/chunks/chunk-56627Y63.js.map +7 -0
- package/module/chunks/{chunk-YKT3CRI6.js → chunk-5D7CUYUH.js} +1 -1
- package/module/chunks/{chunk-YKT3CRI6.js.map → chunk-5D7CUYUH.js.map} +1 -1
- package/module/chunks/{chunk-J5CY2G3T.js → chunk-6MLJBCIJ.js} +7 -7
- package/module/chunks/{chunk-734QWOYU.js → chunk-6SUOFSGJ.js} +6 -6
- package/module/chunks/{chunk-IQG5GSSX.js → chunk-ACSHFRXI.js} +4 -4
- package/module/chunks/{chunk-IQG5GSSX.js.map → chunk-ACSHFRXI.js.map} +1 -1
- package/module/chunks/{chunk-B2LPQWLD.js → chunk-BSXRAEA2.js} +6 -6
- package/module/chunks/{chunk-B2LPQWLD.js.map → chunk-BSXRAEA2.js.map} +1 -1
- package/module/chunks/{chunk-QU7RW3YZ.js → chunk-C3NA7YCT.js} +5 -5
- package/module/chunks/{chunk-OIQNUT2X.js → chunk-D27CPPHI.js} +3 -3
- package/module/chunks/{chunk-JLYV2H24.js → chunk-FREEN2T3.js} +3 -3
- package/module/chunks/{chunk-BSMCGXVQ.js → chunk-GAXH7J77.js} +1 -1
- package/module/chunks/{chunk-BSMCGXVQ.js.map → chunk-GAXH7J77.js.map} +1 -1
- package/module/chunks/{chunk-X7ATHE2S.js → chunk-GFSNM45K.js} +1 -1
- package/module/chunks/{chunk-X7ATHE2S.js.map → chunk-GFSNM45K.js.map} +1 -1
- package/module/chunks/{chunk-JXPIKVRZ.js → chunk-H7C24E7Q.js} +7 -7
- package/module/chunks/{chunk-G6N5OMKL.js → chunk-HOKI2CUB.js} +1 -1
- package/module/chunks/{chunk-G6N5OMKL.js.map → chunk-HOKI2CUB.js.map} +1 -1
- package/module/chunks/{chunk-IGGLU44N.js → chunk-IIPBKMJD.js} +1 -1
- package/module/chunks/{chunk-IGGLU44N.js.map → chunk-IIPBKMJD.js.map} +1 -1
- package/module/chunks/{chunk-AWNWXBE4.js → chunk-IITJ2NKO.js} +5 -5
- package/module/chunks/{chunk-AWNWXBE4.js.map → chunk-IITJ2NKO.js.map} +1 -1
- package/module/chunks/{chunk-SIFZZCPT.js → chunk-ILJYO5B3.js} +94 -55
- package/module/chunks/chunk-ILJYO5B3.js.map +7 -0
- package/module/chunks/{chunk-XUK4ZKWN.js → chunk-JGTSF7O4.js} +5 -5
- package/module/chunks/{chunk-NCPTJ5RB.js → chunk-JOFJS4UX.js} +12 -9
- package/module/chunks/chunk-JOFJS4UX.js.map +7 -0
- package/module/chunks/{chunk-OSDOIGWB.js → chunk-KUPEYUWA.js} +1 -1
- package/module/chunks/{chunk-OSDOIGWB.js.map → chunk-KUPEYUWA.js.map} +1 -1
- package/module/chunks/{chunk-X2HLBQUA.js → chunk-LGNNSZ2O.js} +10 -10
- package/module/chunks/{chunk-WFAY6ABE.js → chunk-LLLZNICJ.js} +9 -6
- package/module/chunks/chunk-LLLZNICJ.js.map +7 -0
- package/module/chunks/{chunk-NIACHGAA.js → chunk-MRXRYL4Y.js} +3 -3
- package/module/chunks/{chunk-YPVMTO2L.js → chunk-MTPPRK4H.js} +11 -11
- package/module/chunks/{chunk-GRIJP4FT.js → chunk-MWYPBMHI.js} +14 -11
- package/module/chunks/chunk-MWYPBMHI.js.map +7 -0
- package/module/chunks/{chunk-A3BAVEME.js → chunk-NKC5QFQ5.js} +4 -4
- package/module/chunks/{chunk-A3BAVEME.js.map → chunk-NKC5QFQ5.js.map} +1 -1
- package/module/chunks/{chunk-BRGYD3MR.js → chunk-O74T4JNL.js} +1 -1
- package/module/chunks/{chunk-BRGYD3MR.js.map → chunk-O74T4JNL.js.map} +1 -1
- package/module/chunks/{chunk-BLXVTG4B.js → chunk-OQXE7KAJ.js} +7 -7
- package/module/chunks/{chunk-HXY4TSUO.js → chunk-OSX3RDKV.js} +1 -1
- package/module/chunks/{chunk-HXY4TSUO.js.map → chunk-OSX3RDKV.js.map} +1 -1
- package/module/chunks/{chunk-L4ZPYLUY.js → chunk-PVT2JFAW.js} +4 -4
- package/module/chunks/{chunk-IAEE4XLH.js → chunk-Q67T3UVN.js} +5 -5
- package/module/chunks/{chunk-IAEE4XLH.js.map → chunk-Q67T3UVN.js.map} +1 -1
- package/module/chunks/{chunk-ETJ5YPF3.js → chunk-QPL25LDX.js} +5 -5
- package/module/chunks/{chunk-2QMHWIV5.js → chunk-RIR6YMJC.js} +11 -16
- package/module/chunks/chunk-RIR6YMJC.js.map +7 -0
- package/module/chunks/{chunk-HIICL66H.js → chunk-RQY6BB7F.js} +1 -1
- package/module/chunks/{chunk-HIICL66H.js.map → chunk-RQY6BB7F.js.map} +1 -1
- package/module/chunks/{chunk-NJF2IOVV.js → chunk-RZJ2PCV4.js} +1 -1
- package/module/chunks/{chunk-NJF2IOVV.js.map → chunk-RZJ2PCV4.js.map} +1 -1
- package/module/chunks/{chunk-UPZBDSS7.js → chunk-UOT4CE2C.js} +6 -6
- package/module/chunks/{chunk-RODBPKID.js → chunk-VCWH2JHM.js} +2 -2
- package/module/chunks/{chunk-RODBPKID.js.map → chunk-VCWH2JHM.js.map} +1 -1
- package/module/chunks/{chunk-J2TRUM5N.js → chunk-VE4HUG27.js} +1 -1
- package/module/chunks/{chunk-J2TRUM5N.js.map → chunk-VE4HUG27.js.map} +1 -1
- package/module/chunks/{chunk-KEARZQAT.js → chunk-WADWICSE.js} +6 -6
- package/module/chunks/{chunk-4OLWQA6K.js → chunk-X4VCE6GS.js} +7 -7
- package/module/chunks/{chunk-4OLWQA6K.js.map → chunk-X4VCE6GS.js.map} +1 -1
- package/module/chunks/{chunk-E2DI77AU.js → chunk-XIZP3DYZ.js} +2 -2
- package/module/chunks/{chunk-CFGNNO2V.js → chunk-YMZGQ7CB.js} +5 -5
- package/module/chunks/{chunk-CFGNNO2V.js.map → chunk-YMZGQ7CB.js.map} +1 -1
- package/module/chunks/{chunk-72YLBMXL.js → chunk-ZSBWP6MR.js} +17 -14
- package/module/chunks/chunk-ZSBWP6MR.js.map +7 -0
- package/module/groups/ActionsGroup.js +6 -6
- package/module/groups/ControlGroup.js +41 -41
- package/module/groups/EditingGroup.js +41 -41
- package/module/groups/EditorGroup.js +41 -41
- package/module/groups/EditorsControlGroup.js +41 -41
- package/module/groups/HistoryGroup.js +41 -41
- package/module/groups/SidebarControlGroup.js +41 -41
- package/module/groups/VisualizationGroup.js +41 -41
- package/module/groups/index.js +48 -48
- package/module/index.js +52 -50
- package/package.json +23 -25
- package/types/CollapsibleToolbar.d.ts.map +1 -1
- package/types/buttons/AIAssistant/AIAssistant.d.ts +3 -0
- package/types/buttons/AIAssistant/AIAssistant.d.ts.map +1 -0
- package/types/buttons/AIAssistant/index.d.ts +2 -0
- package/types/buttons/AIAssistant/index.d.ts.map +1 -0
- 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/Zoom/Zoom.d.ts.map +1 -1
- package/types/buttons/index.d.ts +1 -0
- package/types/buttons/index.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-2QMHWIV5.js.map +0 -7
- 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-NCPTJ5RB.js.map +0 -7
- package/module/chunks/chunk-SIFZZCPT.js.map +0 -7
- package/module/chunks/chunk-WFAY6ABE.js.map +0 -7
- package/tsconfig.json +0 -9
- /package/module/chunks/{chunk-KJLRQLFH.js.map → chunk-4NRVBOUP.js.map} +0 -0
- /package/module/chunks/{chunk-J5CY2G3T.js.map → chunk-6MLJBCIJ.js.map} +0 -0
- /package/module/chunks/{chunk-734QWOYU.js.map → chunk-6SUOFSGJ.js.map} +0 -0
- /package/module/chunks/{chunk-QU7RW3YZ.js.map → chunk-C3NA7YCT.js.map} +0 -0
- /package/module/chunks/{chunk-OIQNUT2X.js.map → chunk-D27CPPHI.js.map} +0 -0
- /package/module/chunks/{chunk-JLYV2H24.js.map → chunk-FREEN2T3.js.map} +0 -0
- /package/module/chunks/{chunk-JXPIKVRZ.js.map → chunk-H7C24E7Q.js.map} +0 -0
- /package/module/chunks/{chunk-XUK4ZKWN.js.map → chunk-JGTSF7O4.js.map} +0 -0
- /package/module/chunks/{chunk-X2HLBQUA.js.map → chunk-LGNNSZ2O.js.map} +0 -0
- /package/module/chunks/{chunk-NIACHGAA.js.map → chunk-MRXRYL4Y.js.map} +0 -0
- /package/module/chunks/{chunk-YPVMTO2L.js.map → chunk-MTPPRK4H.js.map} +0 -0
- /package/module/chunks/{chunk-BLXVTG4B.js.map → chunk-OQXE7KAJ.js.map} +0 -0
- /package/module/chunks/{chunk-L4ZPYLUY.js.map → chunk-PVT2JFAW.js.map} +0 -0
- /package/module/chunks/{chunk-ETJ5YPF3.js.map → chunk-QPL25LDX.js.map} +0 -0
- /package/module/chunks/{chunk-UPZBDSS7.js.map → chunk-UOT4CE2C.js.map} +0 -0
- /package/module/chunks/{chunk-KEARZQAT.js.map → chunk-WADWICSE.js.map} +0 -0
- /package/module/chunks/{chunk-E2DI77AU.js.map → chunk-XIZP3DYZ.js.map} +0 -0
package/CollapsibleToolbar.js
CHANGED
|
@@ -187,16 +187,10 @@ var transition = styled_components_exports.css`
|
|
|
187
187
|
var ExpandButton = styled_components_default(Button_default)`
|
|
188
188
|
// To get specific enough to override the default Button styling
|
|
189
189
|
&& {
|
|
190
|
-
// We shrink the button a bit when the toolbar is expanded since it
|
|
191
|
-
// switches to a circle button and needs a bit more space to breath
|
|
192
190
|
height: ${({ expanded }) => expanded ? `${TOOLBAR_HEIGHT - 4}px` : `${TOOLBAR_HEIGHT}px`};
|
|
193
191
|
width: ${({ expanded }) => expanded ? `${TOOLBAR_HEIGHT - 4}px` : `${TOOLBAR_HEIGHT}px`};
|
|
194
192
|
margin: ${({ expanded }) => expanded ? "0 4px 0 4px" : "0"};
|
|
195
|
-
|
|
196
|
-
border: none;
|
|
197
|
-
box-shadow: none;
|
|
198
|
-
background-color: ${themes_exports.variables.backgroundColorNavigation};
|
|
199
|
-
border-radius: ${(props) => props.expanded ? "40px" : "0 0 0 20px"};
|
|
193
|
+
border-radius: ${(props) => props.expanded ? "" : "0 0 0 20px"};
|
|
200
194
|
transition-property: border-radius, height, width, margin-right;
|
|
201
195
|
${transition}
|
|
202
196
|
}
|
|
@@ -248,6 +242,7 @@ var CollapsibleToolbar = ({
|
|
|
248
242
|
return /* @__PURE__ */ react_default.createElement(ToolbarWrapper, { "data-test": "dashboard-toolbar" }, /* @__PURE__ */ react_default.createElement(StyledTransitionOpen, { animation: "slideFromRight", open: expanded }, /* @__PURE__ */ react_default.createElement(ToolbarItemsWrapper, { "data-test": "toolbar-items" }, injectedToolbarItems)), /* @__PURE__ */ react_default.createElement(
|
|
249
243
|
ExpandButton,
|
|
250
244
|
{
|
|
245
|
+
appearance: "subtle",
|
|
251
246
|
"data-test": "expand-button",
|
|
252
247
|
expanded,
|
|
253
248
|
onClick: handleExpandToggle,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["src/CollapsibleToolbar.tsx", "react", "
|
|
4
|
-
"sourcesContent": ["import React, {\n useState,\n useCallback,\n cloneElement,\n useMemo,\n useEffect,\n} from 'react';\nimport { useApiRegistry } from '@splunk/dashboard-context';\nimport styled, { css } from 'styled-components';\nimport Button from '@splunk/react-ui/Button';\nimport TransitionOpen from '@splunk/react-ui/TransitionOpen';\nimport { variables } from '@splunk/themes';\nimport ChevronRight from '@splunk/react-icons/ChevronRight';\nimport ChevronLeft from '@splunk/react-icons/ChevronLeft';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport { selectLayoutType, useSelector } from '@splunk/dashboard-state';\nimport type { PresetMap } from '@splunk/dashboard-types';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport type { CommonToolbarBaseProps } from './types/common';\nimport { iconSize } from './IconButton';\n\nconst TOOLBAR_HEIGHT = 48;\n\nconst ToolbarWrapper = styled.div`\n display: flex;\n align-items: center;\n position: absolute;\n right: 0;\n z-index: 6;\n height: ${TOOLBAR_HEIGHT}px;\n background-color: ${variables.backgroundColorNavigation};\n color: ${variables.contentColorDefault};\n box-shadow: ${variables.overlayShadow};\n border-radius: 0 0 0 20px;\n`;\n\nconst StyledTransitionOpen = styled(TransitionOpen)`\n border-right: ${({ open }) => (open ? 'solid' : 'none')};\n border-width: 0 1px 0 0;\n border-color: ${variables.interactiveColorBorder};\n`;\n\nconst ToolbarItemsWrapper = styled.div`\n display: flex;\n padding: 2px 4px 2px 8px;\n gap: ${variables.spacingSmall};\n margin-inline-end: ${variables.spacingSmall};\n`;\n\n// Keep the button and toolbar container animating at the same speed\nconst transition = css`\n transition-duration: 0.2s;\n transition-timing-function: ease-in-out;\n`;\nconst ExpandButton = styled(Button)<{\n expanded: boolean;\n}>`\n // To get specific enough to override the default Button styling\n && {\n // We shrink the button a bit when the toolbar is expanded since it\n // switches to a circle button and needs a bit more space to breath\n height: ${({ expanded }) =>\n expanded ? `${TOOLBAR_HEIGHT - 4}px` : `${TOOLBAR_HEIGHT}px`};\n width: ${({ expanded }) =>\n expanded ? `${TOOLBAR_HEIGHT - 4}px` : `${TOOLBAR_HEIGHT}px`};\n margin: ${({ expanded }) => (expanded ? '0 4px 0 4px' : '0')};\n padding: 0;\n border: none;\n box-shadow: none;\n background-color: ${variables.backgroundColorNavigation};\n border-radius: ${(props) => (props.expanded ? '40px' : '0 0 0 20px')};\n transition-property: border-radius, height, width, margin-right;\n ${transition}\n }\n`;\n\nconst expandedIcon = (\n <>\n <ChevronRight width={iconSize} height={iconSize} />\n <ScreenReaderContent>{_('Expanded')}</ScreenReaderContent>\n </>\n);\n\nconst collapsedIcon = (\n <>\n <ChevronLeft width={iconSize} height={iconSize} />\n <ScreenReaderContent>{_('Collapsed')}</ScreenReaderContent>\n </>\n);\n\nexport type CollapsibleToolbarProps = CommonToolbarBaseProps & {\n initialExpanded?: boolean;\n toolbarItems?: React.ReactElement[];\n};\n\nconst DEFAULT_PRESET_MAP = Object.freeze({} as PresetMap);\n\nconst CollapsibleToolbar = ({\n preset = DEFAULT_PRESET_MAP,\n dashboardApi,\n initialExpanded = true,\n mode = 'view',\n toolbarItems = [],\n}: CollapsibleToolbarProps): React.ReactElement | null => {\n const apiRegistry = useApiRegistry();\n const [expanded, setExpanded] = useState(initialExpanded);\n const handleExpandToggle = useCallback(\n () => setExpanded((prevExpanded) => !prevExpanded),\n []\n );\n\n const layoutType = useSelector(selectLayoutType);\n\n const injectedToolbarItems = useMemo(\n () =>\n toolbarItems.map((item) =>\n cloneElement(item, {\n mode,\n preset,\n layoutType,\n dashboardApi,\n borders: false,\n })\n ),\n [toolbarItems, mode, preset, dashboardApi, layoutType]\n );\n\n const ExpandButtonIcon = useMemo(\n () => (expanded ? expandedIcon : collapsedIcon),\n [expanded]\n );\n\n useEffect(() => {\n const toolbarApiRef = {\n toggle: () => handleExpandToggle(),\n expand: () => setExpanded(true),\n collapse: () => setExpanded(false),\n };\n\n apiRegistry.registerToolbarApi(toolbarApiRef);\n\n return () => {\n apiRegistry.removeToolbarApi();\n };\n }, [apiRegistry, handleExpandToggle]);\n\n return (\n <ToolbarWrapper data-test=\"dashboard-toolbar\">\n <StyledTransitionOpen animation=\"slideFromRight\" open={expanded}>\n <ToolbarItemsWrapper data-test=\"toolbar-items\">\n {injectedToolbarItems}\n </ToolbarItemsWrapper>\n </StyledTransitionOpen>\n <ExpandButton\n data-test=\"expand-button\"\n expanded={expanded}\n onClick={handleExpandToggle}\n icon={ExpandButtonIcon}\n data-clickable\n />\n </ToolbarWrapper>\n );\n};\n\nCollapsibleToolbar.displayName = 'CollapsibleToolbar';\n\nexport default CollapsibleToolbar;\n", "\nimport * as defaultImport from \"react\";\nexport * from \"react\";\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 \"styled-components\";\nexport * from \"styled-components\";\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", "\nimport * as defaultImport from \"@splunk/react-ui/TransitionOpen\";\nexport * from \"@splunk/react-ui/TransitionOpen\";\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", "\nimport * as defaultImport from \"@splunk/react-icons/ChevronRight\";\nexport * from \"@splunk/react-icons/ChevronRight\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/ChevronLeft\";\nexport * from \"@splunk/react-icons/ChevronLeft\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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/dashboard-state\";\nexport * from \"@splunk/dashboard-state\";\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-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n screenReaderContent?: string;\n isMenu?: boolean;\n variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n Icon,\n screenReaderContent,\n isMenu = false,\n ...props\n}: PrepareIconProps) => {\n const size = isMenu ? menuIconSize : iconSize;\n return (\n <>\n <Icon width={size} height={size} {...props} />\n {isMenu && (\n <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n )}\n {screenReaderContent && (\n <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n )}\n </>\n );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n icon?: JSX.Element;\n onClick?: ButtonPropsBase['onClick'];\n label?: string;\n buttonRef?: React.RefObject<HTMLButtonElement>;\n testLabel?: string;\n disabled?: boolean;\n}\n\nconst IconButton = ({\n icon,\n buttonRef,\n disabled = false,\n onClick,\n label,\n testLabel,\n ...rest\n}: IconButtonProps): JSX.Element => {\n return (\n <ToolbarItem {...rest}>\n <Button\n elementRef={buttonRef}\n onClick={onClick}\n disabled={disabled}\n appearance=\"subtle\"\n icon={icon}\n label={label}\n data-test={testLabel}\n data-clickable\n />\n </ToolbarItem>\n );\n};\n\nexport default IconButton;\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AACA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAA,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,mCAAc;AACd,IAAO,yBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,iCAAc;AACd,IAAO,uBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,gCAAc;AACd,IAAO,sBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,yBAAc;AACd,IAAO,eAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,kBAA+B;AAC/B,oCAAc;AACd,IAAO,0BAAS,aAAaA,kBAA8B,0BAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,kBAA+B;AAC/B,wCAAc;AACd,IAAO,8BAAS,aAAaA,kBAA8B,0BAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,kBAA+B;AAC/B,8BAAc;AACd,IAAO,oBAAS,aAAaA,kBAA8B,0BAAUA;;;ACDrE,IAAO,eAAQ,0BAAO;;;ACOtB,IAAM,qBAAqB,0BAAO,iBAAY;AAAA;AAAA;AAIvC,IAAM,WAAW;;;AdQxB,IAAM,iBAAiB;AAEvB,IAAM,iBAAiB,0BAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAMhB,cAAc;AAAA,wBACJ,yBAAU,yBAAyB;AAAA,aAC9C,yBAAU,mBAAmB;AAAA,kBACxB,yBAAU,aAAa;AAAA;AAAA;AAIzC,IAAM,uBAAuB,0BAAO,sBAAc;AAAA,oBAC9B,CAAC,EAAE,KAAK,MAAO,OAAO,UAAU,MAAO;AAAA;AAAA,oBAEvC,yBAAU,sBAAsB;AAAA;AAGpD,IAAM,sBAAsB,0BAAO;AAAA;AAAA;AAAA,WAGxB,yBAAU,YAAY;AAAA,yBACR,yBAAU,YAAY;AAAA;AAI/C,IAAM,aAAa;AAAA;AAAA;AAAA;AAInB,IAAM,eAAe,0BAAO,cAAM;AAAA;AAAA;AAAA
|
|
3
|
+
"sources": ["src/CollapsibleToolbar.tsx", "esm-externals:react", "esm-externals:@splunk/dashboard-context", "esm-externals:styled-components", "esm-externals:@splunk/react-ui/Button", "esm-externals:@splunk/react-ui/TransitionOpen", "esm-externals:@splunk/themes", "esm-externals:@splunk/react-icons/ChevronRight", "esm-externals:@splunk/react-icons/ChevronLeft", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/dashboard-state", "esm-externals:@splunk/react-ui/ScreenReaderContent", "esm-externals:@splunk/react-icons/CaretDown", "src/Item.tsx", "src/IconButton.tsx"],
|
|
4
|
+
"sourcesContent": ["import React, {\n useState,\n useCallback,\n cloneElement,\n useMemo,\n useEffect,\n} from 'react';\nimport { useApiRegistry } from '@splunk/dashboard-context';\nimport styled, { css } from 'styled-components';\nimport Button from '@splunk/react-ui/Button';\nimport TransitionOpen from '@splunk/react-ui/TransitionOpen';\nimport { variables } from '@splunk/themes';\nimport ChevronRight from '@splunk/react-icons/ChevronRight';\nimport ChevronLeft from '@splunk/react-icons/ChevronLeft';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport { selectLayoutType, useSelector } from '@splunk/dashboard-state';\nimport type { PresetMap } from '@splunk/dashboard-types';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport type { CommonToolbarBaseProps } from './types/common';\nimport { iconSize } from './IconButton';\n\nconst TOOLBAR_HEIGHT = 48;\n\nconst ToolbarWrapper = styled.div`\n display: flex;\n align-items: center;\n position: absolute;\n right: 0;\n z-index: 6;\n height: ${TOOLBAR_HEIGHT}px;\n background-color: ${variables.backgroundColorNavigation};\n color: ${variables.contentColorDefault};\n box-shadow: ${variables.overlayShadow};\n border-radius: 0 0 0 20px;\n`;\n\nconst StyledTransitionOpen = styled(TransitionOpen)`\n border-right: ${({ open }) => (open ? 'solid' : 'none')};\n border-width: 0 1px 0 0;\n border-color: ${variables.interactiveColorBorder};\n`;\n\nconst ToolbarItemsWrapper = styled.div`\n display: flex;\n padding: 2px 4px 2px 8px;\n gap: ${variables.spacingSmall};\n margin-inline-end: ${variables.spacingSmall};\n`;\n\n// Keep the button and toolbar container animating at the same speed\nconst transition = css`\n transition-duration: 0.2s;\n transition-timing-function: ease-in-out;\n`;\nconst ExpandButton = styled(Button)<{\n expanded: boolean;\n}>`\n // To get specific enough to override the default Button styling\n && {\n height: ${({ expanded }) =>\n expanded ? `${TOOLBAR_HEIGHT - 4}px` : `${TOOLBAR_HEIGHT}px`};\n width: ${({ expanded }) =>\n expanded ? `${TOOLBAR_HEIGHT - 4}px` : `${TOOLBAR_HEIGHT}px`};\n margin: ${({ expanded }) => (expanded ? '0 4px 0 4px' : '0')};\n border-radius: ${(props) => (props.expanded ? '' : '0 0 0 20px')};\n transition-property: border-radius, height, width, margin-right;\n ${transition}\n }\n`;\n\nconst expandedIcon = (\n <>\n <ChevronRight width={iconSize} height={iconSize} />\n <ScreenReaderContent>{_('Expanded')}</ScreenReaderContent>\n </>\n);\n\nconst collapsedIcon = (\n <>\n <ChevronLeft width={iconSize} height={iconSize} />\n <ScreenReaderContent>{_('Collapsed')}</ScreenReaderContent>\n </>\n);\n\nexport type CollapsibleToolbarProps = CommonToolbarBaseProps & {\n initialExpanded?: boolean;\n toolbarItems?: React.ReactElement[];\n};\n\nconst DEFAULT_PRESET_MAP = Object.freeze({} as PresetMap);\n\nconst CollapsibleToolbar = ({\n preset = DEFAULT_PRESET_MAP,\n dashboardApi,\n initialExpanded = true,\n mode = 'view',\n toolbarItems = [],\n}: CollapsibleToolbarProps): React.ReactElement | null => {\n const apiRegistry = useApiRegistry();\n const [expanded, setExpanded] = useState(initialExpanded);\n const handleExpandToggle = useCallback(\n () => setExpanded((prevExpanded) => !prevExpanded),\n []\n );\n\n const layoutType = useSelector(selectLayoutType);\n\n const injectedToolbarItems = useMemo(\n () =>\n toolbarItems.map((item) =>\n cloneElement(item, {\n mode,\n preset,\n layoutType,\n dashboardApi,\n borders: false,\n })\n ),\n [toolbarItems, mode, preset, dashboardApi, layoutType]\n );\n\n const ExpandButtonIcon = useMemo(\n () => (expanded ? expandedIcon : collapsedIcon),\n [expanded]\n );\n\n useEffect(() => {\n const toolbarApiRef = {\n toggle: () => handleExpandToggle(),\n expand: () => setExpanded(true),\n collapse: () => setExpanded(false),\n };\n\n apiRegistry.registerToolbarApi(toolbarApiRef);\n\n return () => {\n apiRegistry.removeToolbarApi();\n };\n }, [apiRegistry, handleExpandToggle]);\n\n return (\n <ToolbarWrapper data-test=\"dashboard-toolbar\">\n <StyledTransitionOpen animation=\"slideFromRight\" open={expanded}>\n <ToolbarItemsWrapper data-test=\"toolbar-items\">\n {injectedToolbarItems}\n </ToolbarItemsWrapper>\n </StyledTransitionOpen>\n <ExpandButton\n appearance=\"subtle\"\n data-test=\"expand-button\"\n expanded={expanded}\n onClick={handleExpandToggle}\n icon={ExpandButtonIcon}\n data-clickable\n />\n </ToolbarWrapper>\n );\n};\n\nCollapsibleToolbar.displayName = 'CollapsibleToolbar';\n\nexport default CollapsibleToolbar;\n", "\nimport * as defaultImport from \"react\";\nexport * from \"react\";\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 \"styled-components\";\nexport * from \"styled-components\";\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", "\nimport * as defaultImport from \"@splunk/react-ui/TransitionOpen\";\nexport * from \"@splunk/react-ui/TransitionOpen\";\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", "\nimport * as defaultImport from \"@splunk/react-icons/ChevronRight\";\nexport * from \"@splunk/react-icons/ChevronRight\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/ChevronLeft\";\nexport * from \"@splunk/react-icons/ChevronLeft\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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/dashboard-state\";\nexport * from \"@splunk/dashboard-state\";\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-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n screenReaderContent?: string;\n isMenu?: boolean;\n variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n Icon,\n screenReaderContent,\n isMenu = false,\n ...props\n}: PrepareIconProps) => {\n const size = isMenu ? menuIconSize : iconSize;\n return (\n <>\n <Icon width={size} height={size} {...props} />\n {isMenu && (\n <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n )}\n {screenReaderContent && (\n <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n )}\n </>\n );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n icon?: JSX.Element;\n onClick?: ButtonPropsBase['onClick'];\n label?: string;\n buttonRef?: React.RefObject<HTMLButtonElement>;\n testLabel?: string;\n disabled?: boolean;\n}\n\nconst IconButton = ({\n icon,\n buttonRef,\n disabled = false,\n onClick,\n label,\n testLabel,\n ...rest\n}: IconButtonProps): JSX.Element => {\n return (\n <ToolbarItem {...rest}>\n <Button\n elementRef={buttonRef}\n onClick={onClick}\n disabled={disabled}\n appearance=\"subtle\"\n icon={icon}\n label={label}\n data-test={testLabel}\n data-clickable\n />\n </ToolbarItem>\n );\n};\n\nexport default IconButton;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|
|
7
7
|
}
|
package/IconButton.js.map
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["src/IconButton.tsx", "react", "
|
|
3
|
+
"sources": ["src/IconButton.tsx", "esm-externals:react", "esm-externals:@splunk/react-icons/CaretDown", "esm-externals:@splunk/react-ui/ScreenReaderContent", "esm-externals:@splunk/react-ui/Button", "esm-externals:styled-components", "src/Item.tsx"],
|
|
4
4
|
"sourcesContent": ["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", "\nimport * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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", "\nimport * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AACA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAA,iBAA+B;AAC/B,8BAAc;AACd,IAAO,oBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,wCAAc;AACd,IAAO,8BAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAS,aAAaA,iBAA8B,yBAAUA;;;ACDrE,IAAO,eAAQ,0BAAO;;;ANOtB,IAAM,qBAAqB,0BAAO,iBAAY;AAAA;AAAA;AAIvC,IAAM,WAAW;AACjB,IAAM,eAAe;AAoBrB,IAAM,cAAc,CAAC,OAKJ;AALI,eACxB;AAAA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EArCb,IAkC4B,IAIrB,kBAJqB,IAIrB;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,OAAO,SAAS,eAAe;AACrC,SACI,0EACI,4CAAC,uBAAK,OAAO,MAAM,QAAQ,QAAU,MAAO,GAC3C,UACG,4CAAC,sBAAmB,SAAQ,UAAS,OAAO,GAAG,QAAQ,MAAM,GAEhE,uBACG,4CAAC,mCAAqB,mBAAoB,CAElD;AAER;AAWA,IAAM,aAAa,CAAC,OAQgB;AARhB,eAChB;AAAA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,EArEJ,IA+DoB,IAOb,iBAPa,IAOb;AAAA,IANH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,SACI,4CAAC,iCAAgB,OACb;AAAA,IAAC;AAAA;AAAA,MACG,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA,YAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA,aAAW;AAAA,MACX,kBAAc;AAAA;AAAA,EAClB,CACJ;AAER;AAEA,IAAO,qBAAQ;",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|
package/Item.js.map
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["src/Item.tsx", "styled-components"],
|
|
3
|
+
"sources": ["src/Item.tsx", "esm-externals:styled-components"],
|
|
4
4
|
"sourcesContent": ["import styled from 'styled-components';\n\nexport default styled.div``;\n", "\nimport * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AACA,oBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAS,aAAa,gBAA8B,wBAAU;;;ADDrE,IAAO,eAAQ,0BAAO;",
|
|
6
6
|
"names": []
|
package/ItemGroup.js.map
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["src/ItemGroup.tsx", "react", "styled-components", "
|
|
3
|
+
"sources": ["src/ItemGroup.tsx", "esm-externals:react", "esm-externals:styled-components", "esm-externals:@splunk/dashboard-utils", "esm-externals:@splunk/themes", "src/components/ItemSeparator.tsx"],
|
|
4
4
|
"sourcesContent": ["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 \"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"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AACA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAA,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,oCAAc;AACd,IAAO,0BAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACArE,IAAM,gBAAgB,0BAAO;AAAA;AAAA;AAAA,yBAGJ,yBAAU,sBAAsB;AAAA;AAAA,cAE3C,yBAAU,WAAW;AAAA;AAGnC,IAAO,wBAAQ;;;ALJf,IAAM,QAAQ,0BAAO,IAAI,MAAM;AAAA,EAC3B,aAAa;AACjB,CAAC;AAAA;AAAA;AAAA,WAGU,CAAC,UAAU,MAAM,GAAG;AAAA;AAY/B,IAAM,YAAY,CAAC,OAKG;AALH,eACf;AAAA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,EA3BJ,IAwBmB,IAIZ,iBAJY,IAIZ;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,QAAQ,cAAM,SAAS;AAAA,IACzB;AAAA,IACA,CAAC,UAAU,SAAS,cAAM,aAAa,OAAsB,IAAI;AAAA,EACrE;AACA,QAAM,YAAY,UAAU,4CAAC,2BAAc,IAAK;AAChD,SACI,0EACI,4CAAC,SAAM,SAAK,8BAAK,KAAK,CAAC,KAAI,KAAM,GAChC,SACL;AAER;AAEA,IAAO,oBAAQ;",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport"]
|
package/PopoverItemButton.js.map
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["src/PopoverItemButton.tsx", "react", "styled-components"],
|
|
3
|
+
"sources": ["src/PopoverItemButton.tsx", "esm-externals:react", "esm-externals:styled-components"],
|
|
4
4
|
"sourcesContent": ["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", "\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"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AACA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAA,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAS,aAAaA,iBAA8B,yBAAUA;;;AFCrE,IAAM,uBAAuB,0BAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQpC,IAAM,aAAa,0BAAO;AAAA;AAAA;AAAA;AAK1B,IAAM,cAAc,0BAAO;AAAA;AAAA;AAAA;AAAA;AAc3B,IAAM,oBAAoB,CAAC,EAAE,MAAM,MAAM,MACrC,4CAAC,4BACI,QAAQ,4CAAC,kBAAY,IAAK,GAC1B,SAAS,4CAAC,eAAY,aAAU,iBAAe,KAAM,CAC1D;AAGJ,IAAO,4BAAQ;",
|
|
6
6
|
"names": ["defaultImport"]
|
package/README.md
CHANGED
|
@@ -6,4 +6,4 @@ The dashboard toolbar is an array of menus that users can add to the Dashboard c
|
|
|
6
6
|
|
|
7
7
|
## Documentation
|
|
8
8
|
|
|
9
|
-
Please reference the [Splunk Dashboard Framework documentation](https://splunkui.
|
|
9
|
+
Please reference the [Splunk Dashboard Framework documentation](https://splunkui.splunk.com/Packages/dashboard-docs/?path=/Toolbar) for more details on how to use this component in concert with the rest of the dashboard framework library.
|
package/Toolbar.js.map
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["src/Toolbar.tsx", "react", "styled-components", "
|
|
3
|
+
"sources": ["src/Toolbar.tsx", "esm-externals:react", "esm-externals:styled-components", "esm-externals:@splunk/themes", "esm-externals:@splunk/themes/mixins", "esm-externals:@splunk/dashboard-state"],
|
|
4
4
|
"sourcesContent": ["import React, { useCallback, useEffect, useMemo, useRef } from 'react';\nimport styled from 'styled-components';\nimport { variables } from '@splunk/themes';\nimport { reset } from '@splunk/themes/mixins';\nimport { selectLayoutType, useSelector } from '@splunk/dashboard-state';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst ToolbarWrapper = styled.div`\n ${reset('flex')};\n justify-content: space-between;\n color: ${variables.contentColorDefault};\n padding: 5px 5px 5px 8px;\n border-bottom-width: 1px;\n border-bottom-style: solid;\n border-bottom-color: ${variables.borderColor};\n flex-wrap: wrap;\n flex-shrink: 0;\n background-color: ${variables.backgroundColorNavigation};\n`;\n\nconst LeftAlignItems = styled.div`\n flex-grow: 1;\n display: flex;\n flex-direction: row;\n gap: ${variables.spacingSmall};\n`;\n\nconst RightAlignItems = styled.div`\n flex-basis: auto;\n display: flex;\n flex-direction: row;\n gap: ${variables.spacingSmall};\n margin-inline-end: ${variables.spacingSmall};\n`;\n\nexport type ToolbarProps = ToolbarButtonProps & {\n toolbarItems: React.ReactElement[];\n};\n\n/**\n * Dashboard Toolbar\n */\nconst Toolbar = ({\n activePanel,\n dashboardApi,\n mode,\n preset,\n toolbarItems,\n}: ToolbarProps) => {\n const layoutType = useSelector(selectLayoutType);\n const toolbarRef = useRef<HTMLDivElement | null>(null);\n\n /**\n * merge dashboard props with current item props\n * so that item have access to dashboard api and other stuff\n */\n const injectDashboardProps = useCallback(\n (items: React.ReactElement[]): React.ReactElement[] => {\n const buttonProps: ToolbarButtonProps = {\n activePanel,\n dashboardApi,\n layoutType,\n mode,\n preset,\n };\n\n return items.map((item) => React.cloneElement(item, buttonProps));\n },\n [activePanel, dashboardApi, layoutType, mode, preset]\n );\n\n const leftAlignItems = useMemo(() => {\n const items = toolbarItems.filter(\n (item) => item.props?.align !== 'right'\n );\n return injectDashboardProps(items);\n }, [toolbarItems, injectDashboardProps]);\n\n const rightAlignItems = useMemo(() => {\n const items = toolbarItems.filter(\n (item) => item.props?.align === 'right'\n );\n return injectDashboardProps(items);\n }, [toolbarItems, injectDashboardProps]);\n\n const observerRef = useRef<MutationObserver | null>(null);\n const isFirstRender = useRef(true);\n\n useEffect(() => {\n if (isFirstRender.current) {\n isFirstRender.current = false;\n return undefined;\n }\n\n observerRef.current = new MutationObserver(() => {\n const firstFocusableButton = toolbarRef.current?.querySelector(\n 'button:not([disabled]):not([aria-disabled=\"true\"]):not([tabindex=\"-1\"])'\n ) as HTMLButtonElement;\n\n firstFocusableButton?.focus();\n observerRef.current?.disconnect();\n });\n\n if (toolbarRef.current) {\n observerRef.current.observe(toolbarRef.current, {\n childList: true,\n subtree: true,\n });\n }\n\n return () => {\n observerRef.current?.disconnect();\n };\n }, [mode]);\n\n if (!toolbarItems.length) {\n return null;\n }\n\n return (\n <ToolbarWrapper data-test=\"dashboard-toolbar\" ref={toolbarRef}>\n <LeftAlignItems key=\"left-align-items\" data-test=\"left-align-items\">\n {leftAlignItems}\n </LeftAlignItems>\n <RightAlignItems\n key=\"right-align-items\"\n data-test=\"right-align-items\"\n >\n {rightAlignItems}\n </RightAlignItems>\n </ToolbarWrapper>\n );\n};\n\nToolbar.displayName = 'Toolbar';\nexport default Toolbar;\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/themes\";\nexport * from \"@splunk/themes\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/themes/mixins\";\nexport * from \"@splunk/themes/mixins\";\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"],
|
|
5
5
|
"mappings": "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",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|
package/buttons/Charts.js
CHANGED
|
@@ -271,7 +271,10 @@ var ButtonToggle = /* @__PURE__ */ react_default.createElement(
|
|
|
271
271
|
icon: chartsDropdown
|
|
272
272
|
}
|
|
273
273
|
);
|
|
274
|
-
var focusToggleReasons = [
|
|
274
|
+
var focusToggleReasons = [
|
|
275
|
+
"escapeKey",
|
|
276
|
+
"tabKey"
|
|
277
|
+
];
|
|
275
278
|
var getVisualizationListFromTaxonomy = ({
|
|
276
279
|
taxonomy,
|
|
277
280
|
handleCreateVisualization
|
package/buttons/Charts.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../src/buttons/Charts.tsx", "react", "
|
|
4
|
-
"sourcesContent": ["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 \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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 \"styled-components\";\nexport * from \"styled-components\";\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/themes\";\nexport * from \"@splunk/themes\";\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", "import type { DropdownRequestCloseHandler } from '@splunk/react-ui/Dropdown';\nimport { useCallback, useRef, useState } from 'react';\n\ninterface UseDropdownArgs {\n isContentClickClose?: boolean;\n}\n\ninterface UseDropdownReturn {\n isOpen: boolean;\n handleRequestClose: DropdownRequestCloseHandler;\n handleRequestOpen: () => void;\n handleForceClose: () => void;\n setHasChildModal: (value: boolean) => void;\n}\n\n/**\n * Custom React Hook for the controlled SUI Dropdown component.\n *\n * @param {Object} config\n * @param {Boolean} config.isContentClickClose Control if dropdown children onClick's will close the dropdown automatically\n * @returns {Object} value\n * @returns {Boolean} value.isOpen The only state of this hook\n * @returns {Function} value.handleRequestOpen Event handler to open the dropdown\n * @returns {Function} value.handleRequestClose Event handler that SUI Dropdown calls when requested to close\n * @returns {Function} value.handleForceClose Event handler to forcefully close the dropdown\n */\nconst useDropdown = ({\n isContentClickClose = true,\n}: UseDropdownArgs): UseDropdownReturn => {\n const [isOpen, setIsOpen] = useState(false);\n const hasChildModal = useRef(false);\n\n const handleRequestClose = useCallback<DropdownRequestCloseHandler>(\n ({ reason }) => {\n if (reason === 'contentClick' && !isContentClickClose) {\n // This return results in the dropdown not closing.\n return;\n }\n\n // If there is a child modal then don't close the root on ESC press\n if (reason === 'escapeKey' && hasChildModal.current) {\n return;\n }\n\n setIsOpen(false);\n },\n [isContentClickClose]\n );\n\n const handleRequestOpen = useCallback(() => {\n setIsOpen(true);\n }, []);\n\n const handleForceClose = useCallback(() => {\n setIsOpen(false);\n }, []);\n\n const setHasChildModal = useCallback((value: boolean) => {\n hasChildModal.current = value;\n }, []);\n\n return {\n isOpen,\n handleRequestOpen,\n handleRequestClose,\n handleForceClose,\n setHasChildModal,\n };\n};\n\nexport default useDropdown;\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"],
|
|
5
|
-
"mappings": "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
|
|
3
|
+
"sources": ["../src/buttons/Charts.tsx", "esm-externals:react", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:styled-components", "esm-externals:@splunk/react-ui/Dropdown", "esm-externals:@splunk/react-ui/Menu", "esm-externals:@splunk/themes", "esm-externals:@splunk/react-icons/ChartColumn", "esm-externals:@splunk/dashboard-ui", "esm-externals:@splunk/dashboard-context", "esm-externals:@splunk/dashboard-state", "../src/Item.tsx", "../src/hooks/useDropdown.ts", "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"],
|
|
4
|
+
"sourcesContent": ["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 \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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 \"styled-components\";\nexport * from \"styled-components\";\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/themes\";\nexport * from \"@splunk/themes\";\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", "import type { DropdownRequestCloseHandler } from '@splunk/react-ui/Dropdown';\nimport { useCallback, useRef, useState } from 'react';\n\ninterface UseDropdownArgs {\n isContentClickClose?: boolean;\n}\n\ninterface UseDropdownReturn {\n isOpen: boolean;\n handleRequestClose: DropdownRequestCloseHandler;\n handleRequestOpen: () => void;\n handleForceClose: () => void;\n setHasChildModal: (value: boolean) => void;\n}\n\n/**\n * Custom React Hook for the controlled SUI Dropdown component.\n *\n * @param {Object} config\n * @param {Boolean} config.isContentClickClose Control if dropdown children onClick's will close the dropdown automatically\n * @returns {Object} value\n * @returns {Boolean} value.isOpen The only state of this hook\n * @returns {Function} value.handleRequestOpen Event handler to open the dropdown\n * @returns {Function} value.handleRequestClose Event handler that SUI Dropdown calls when requested to close\n * @returns {Function} value.handleForceClose Event handler to forcefully close the dropdown\n */\nconst useDropdown = ({\n isContentClickClose = true,\n}: UseDropdownArgs): UseDropdownReturn => {\n const [isOpen, setIsOpen] = useState(false);\n const hasChildModal = useRef(false);\n\n const handleRequestClose = useCallback<DropdownRequestCloseHandler>(\n ({ reason }) => {\n if (reason === 'contentClick' && !isContentClickClose) {\n // This return results in the dropdown not closing.\n return;\n }\n\n // If there is a child modal then don't close the root on ESC press\n if (reason === 'escapeKey' && hasChildModal.current) {\n return;\n }\n\n setIsOpen(false);\n },\n [isContentClickClose]\n );\n\n const handleRequestOpen = useCallback(() => {\n setIsOpen(true);\n }, []);\n\n const handleForceClose = useCallback(() => {\n setIsOpen(false);\n }, []);\n\n const setHasChildModal = useCallback((value: boolean) => {\n hasChildModal.current = value;\n }, []);\n\n return {\n isOpen,\n handleRequestOpen,\n handleRequestClose,\n handleForceClose,\n setHasChildModal,\n };\n};\n\nexport default useDropdown;\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"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|
|
7
7
|
}
|
package/buttons/Config.js.map
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../src/buttons/Config.tsx", "react", "
|
|
3
|
+
"sources": ["../src/buttons/Config.tsx", "esm-externals:react", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/react-icons/Cog", "esm-externals:@splunk/dashboard-context", "esm-externals:@splunk/react-icons/CaretDown", "esm-externals:@splunk/react-ui/ScreenReaderContent", "esm-externals:@splunk/react-ui/Button", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx"],
|
|
4
4
|
"sourcesContent": ["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 \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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-icons/Cog\";\nexport * from \"@splunk/react-icons/Cog\";\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/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", "\nimport * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n screenReaderContent?: string;\n isMenu?: boolean;\n variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n Icon,\n screenReaderContent,\n isMenu = false,\n ...props\n}: PrepareIconProps) => {\n const size = isMenu ? menuIconSize : iconSize;\n return (\n <>\n <Icon width={size} height={size} {...props} />\n {isMenu && (\n <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n )}\n {screenReaderContent && (\n <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n )}\n </>\n );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n icon?: JSX.Element;\n onClick?: ButtonPropsBase['onClick'];\n label?: string;\n buttonRef?: React.RefObject<HTMLButtonElement>;\n testLabel?: string;\n disabled?: boolean;\n}\n\nconst IconButton = ({\n icon,\n buttonRef,\n disabled = false,\n onClick,\n label,\n testLabel,\n ...rest\n}: IconButtonProps): JSX.Element => {\n return (\n <ToolbarItem {...rest}>\n <Button\n elementRef={buttonRef}\n onClick={onClick}\n disabled={disabled}\n appearance=\"subtle\"\n icon={icon}\n label={label}\n data-test={testLabel}\n data-clickable\n />\n </ToolbarItem>\n );\n};\n\nexport default IconButton;\n"],
|
|
5
5
|
"mappings": "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",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../src/buttons/ContentExport.tsx", "react", "
|
|
3
|
+
"sources": ["../src/buttons/ContentExport.tsx", "esm-externals:react", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/react-icons/ArrowBroadUnderbarDown", "esm-externals:@splunk/react-icons/CaretDown", "esm-externals:@splunk/react-ui/ScreenReaderContent", "esm-externals:@splunk/react-ui/Button", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx"],
|
|
4
4
|
"sourcesContent": ["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 \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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-icons/ArrowBroadUnderbarDown\";\nexport * from \"@splunk/react-icons/ArrowBroadUnderbarDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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", "\nimport * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n screenReaderContent?: string;\n isMenu?: boolean;\n variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n Icon,\n screenReaderContent,\n isMenu = false,\n ...props\n}: PrepareIconProps) => {\n const size = isMenu ? menuIconSize : iconSize;\n return (\n <>\n <Icon width={size} height={size} {...props} />\n {isMenu && (\n <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n )}\n {screenReaderContent && (\n <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n )}\n </>\n );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n icon?: JSX.Element;\n onClick?: ButtonPropsBase['onClick'];\n label?: string;\n buttonRef?: React.RefObject<HTMLButtonElement>;\n testLabel?: string;\n disabled?: boolean;\n}\n\nconst IconButton = ({\n icon,\n buttonRef,\n disabled = false,\n onClick,\n label,\n testLabel,\n ...rest\n}: IconButtonProps): JSX.Element => {\n return (\n <ToolbarItem {...rest}>\n <Button\n elementRef={buttonRef}\n onClick={onClick}\n disabled={disabled}\n appearance=\"subtle\"\n icon={icon}\n label={label}\n data-test={testLabel}\n data-clickable\n />\n </ToolbarItem>\n );\n};\n\nexport default IconButton;\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AACA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAA,iBAA+B;AAC/B,yBAAc;AACd,IAAO,eAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,2CAAc;AACd,IAAO,iCAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,8BAAc;AACd,IAAO,oBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,wCAAc;AACd,IAAO,8BAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAS,aAAaA,iBAA8B,yBAAUA;;;ACDrE,IAAO,eAAQ,0BAAO;;;ACOtB,IAAM,qBAAqB,0BAAO,iBAAY;AAAA;AAAA;AAIvC,IAAM,WAAW;AACjB,IAAM,eAAe;AAoBrB,IAAM,cAAc,CAAC,OAKJ;AALI,eACxB;AAAA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EArCb,IAkC4B,IAIrB,kBAJqB,IAIrB;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,OAAO,SAAS,eAAe;AACrC,SACI,0EACI,4CAAC,uBAAK,OAAO,MAAM,QAAQ,QAAU,MAAO,GAC3C,UACG,4CAAC,sBAAmB,SAAQ,UAAS,OAAO,GAAG,QAAQ,MAAM,GAEhE,uBACG,4CAAC,mCAAqB,mBAAoB,CAElD;AAER;AAWA,IAAM,aAAa,CAAC,OAQgB;AARhB,eAChB;AAAA,UAAAC;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,EArEJ,IA+DoB,IAOb,iBAPa,IAOb;AAAA,IANH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,SACI,4CAAC,iCAAgB,OACb;AAAA,IAAC;AAAA;AAAA,MACG,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA,YAAW;AAAA,MACX,MAAMA;AAAA,MACN;AAAA,MACA,aAAW;AAAA,MACX,kBAAc;AAAA;AAAA,EAClB,CACJ;AAER;AAEA,IAAO,qBAAQ;;;AT7Ef,IAAM,OAAO,YAAY;AAAA,EACrB,MAAM;AAAA,EACN,yBAAqB,gBAAE,QAAQ;AACnC,CAAC;AAED,IAAM,gBAAgB,CAAC,EAAE,UAAU,QAAQ,MACvC;AAAA,EAAC;AAAA;AAAA,IACG,WAAU;AAAA,IACV;AAAA,IACA,UAAU,CAAC,CAAC;AAAA,IACZ;AAAA;AACJ;AAGJ,IAAO,wBAAQ;",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
|
package/buttons/Data.js.map
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../src/buttons/Data.tsx", "react", "
|
|
3
|
+
"sources": ["../src/buttons/Data.tsx", "esm-externals:react", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/react-icons/CylinderMulti", "esm-externals:@splunk/dashboard-context", "esm-externals:@splunk/dashboard-state", "esm-externals:@splunk/react-icons/CaretDown", "esm-externals:@splunk/react-ui/ScreenReaderContent", "esm-externals:@splunk/react-ui/Button", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx"],
|
|
4
4
|
"sourcesContent": ["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 \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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-icons/CylinderMulti\";\nexport * from \"@splunk/react-icons/CylinderMulti\";\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", "\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", "\nimport * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n screenReaderContent?: string;\n isMenu?: boolean;\n variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n Icon,\n screenReaderContent,\n isMenu = false,\n ...props\n}: PrepareIconProps) => {\n const size = isMenu ? menuIconSize : iconSize;\n return (\n <>\n <Icon width={size} height={size} {...props} />\n {isMenu && (\n <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n )}\n {screenReaderContent && (\n <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n )}\n </>\n );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n icon?: JSX.Element;\n onClick?: ButtonPropsBase['onClick'];\n label?: string;\n buttonRef?: React.RefObject<HTMLButtonElement>;\n testLabel?: string;\n disabled?: boolean;\n}\n\nconst IconButton = ({\n icon,\n buttonRef,\n disabled = false,\n onClick,\n label,\n testLabel,\n ...rest\n}: IconButtonProps): JSX.Element => {\n return (\n <ToolbarItem {...rest}>\n <Button\n elementRef={buttonRef}\n onClick={onClick}\n disabled={disabled}\n appearance=\"subtle\"\n icon={icon}\n label={label}\n data-test={testLabel}\n data-clickable\n />\n </ToolbarItem>\n );\n};\n\nexport default IconButton;\n"],
|
|
5
5
|
"mappings": "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",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|
|
@@ -207,7 +207,7 @@ var icon = prepareIcon({
|
|
|
207
207
|
screenReaderContent: (0, i18n_exports._)("Add rectangle")
|
|
208
208
|
});
|
|
209
209
|
var EmptyVisualization = ({ dashboardApi }) => {
|
|
210
|
-
const handleClick = (0, react_exports.useCallback)(() => __async(
|
|
210
|
+
const handleClick = (0, react_exports.useCallback)(() => __async(null, null, function* () {
|
|
211
211
|
dashboardApi == null ? void 0 : dashboardApi.createVisualization({
|
|
212
212
|
visualizationDefinition: {
|
|
213
213
|
type: "splunk.rectangle",
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../src/buttons/EmptyVisualization.tsx", "react", "
|
|
3
|
+
"sources": ["../src/buttons/EmptyVisualization.tsx", "esm-externals:react", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/react-icons/Square", "esm-externals:@splunk/react-icons/CaretDown", "esm-externals:@splunk/react-ui/ScreenReaderContent", "esm-externals:@splunk/react-ui/Button", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx"],
|
|
4
4
|
"sourcesContent": ["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 \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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-icons/Square\";\nexport * from \"@splunk/react-icons/Square\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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", "\nimport * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n screenReaderContent?: string;\n isMenu?: boolean;\n variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n Icon,\n screenReaderContent,\n isMenu = false,\n ...props\n}: PrepareIconProps) => {\n const size = isMenu ? menuIconSize : iconSize;\n return (\n <>\n <Icon width={size} height={size} {...props} />\n {isMenu && (\n <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n )}\n {screenReaderContent && (\n <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n )}\n </>\n );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n icon?: JSX.Element;\n onClick?: ButtonPropsBase['onClick'];\n label?: string;\n buttonRef?: React.RefObject<HTMLButtonElement>;\n testLabel?: string;\n disabled?: boolean;\n}\n\nconst IconButton = ({\n icon,\n buttonRef,\n disabled = false,\n onClick,\n label,\n testLabel,\n ...rest\n}: IconButtonProps): JSX.Element => {\n return (\n <ToolbarItem {...rest}>\n <Button\n elementRef={buttonRef}\n onClick={onClick}\n disabled={disabled}\n appearance=\"subtle\"\n icon={icon}\n label={label}\n data-test={testLabel}\n data-clickable\n />\n </ToolbarItem>\n );\n};\n\nexport default IconButton;\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AACA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAA,iBAA+B;AAC/B,yBAAc;AACd,IAAO,eAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,8BAAc;AACd,IAAO,oBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,wCAAc;AACd,IAAO,8BAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAS,aAAaA,iBAA8B,yBAAUA;;;ACDrE,IAAO,eAAQ,0BAAO;;;ACOtB,IAAM,qBAAqB,0BAAO,iBAAY;AAAA;AAAA;AAIvC,IAAM,WAAW;AACjB,IAAM,eAAe;AAoBrB,IAAM,cAAc,CAAC,OAKJ;AALI,eACxB;AAAA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EArCb,IAkC4B,IAIrB,kBAJqB,IAIrB;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,OAAO,SAAS,eAAe;AACrC,SACI,0EACI,4CAAC,uBAAK,OAAO,MAAM,QAAQ,QAAU,MAAO,GAC3C,UACG,4CAAC,sBAAmB,SAAQ,UAAS,OAAO,GAAG,QAAQ,MAAM,GAEhE,uBACG,4CAAC,mCAAqB,mBAAoB,CAElD;AAER;AAWA,IAAM,aAAa,CAAC,OAQgB;AARhB,eAChB;AAAA,UAAAC;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,EArEJ,IA+DoB,IAOb,iBAPa,IAOb;AAAA,IANH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,SACI,4CAAC,iCAAgB,OACb;AAAA,IAAC;AAAA;AAAA,MACG,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA,YAAW;AAAA,MACX,MAAMA;AAAA,MACN;AAAA,MACA,aAAW;AAAA,MACX,kBAAc;AAAA;AAAA,EAClB,CACJ;AAER;AAEA,IAAO,qBAAQ;;;AThFf,IAAM,OAAO,YAAY;AAAA,EACrB,MAAM;AAAA,EACN,yBAAqB,gBAAE,eAAe;AAC1C,CAAC;AAKD,IAAM,qBAAqB,CAAC,EAAE,aAAa,MAA0B;AACjE,QAAM,kBAAc,2BAAY,MAAY;AACxC,iDAAc,oBAAoB;AAAA,MAC9B,yBAAyB;AAAA,QACrB,MAAM;AAAA,QACN,SAAS;AAAA,UACL,WAAW;AAAA,UACX,aAAa;AAAA,QACjB;AAAA,MACJ;AAAA,IACJ;AAEA,iDAAc,UAAU;AAAA,MACpB,aAAa;AAAA,IACjB;AAAA,EACJ,IAAG,CAAC,YAAY,CAAC;AAEjB,SACI;AAAA,IAAC;AAAA;AAAA,MACG,WAAU;AAAA,MACV,SAAS;AAAA,MACT;AAAA;AAAA,EACJ;AAER;AAEA,IAAO,6BAAQ;",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../src/buttons/ExportDashboardButton.tsx", "react", "
|
|
3
|
+
"sources": ["../src/buttons/ExportDashboardButton.tsx", "esm-externals:react", "esm-externals:@splunk/react-icons/ArrowBroadUnderbarDown", "esm-externals:@splunk/dashboard-ui", "esm-externals:@splunk/dashboard-utils", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/react-ui/Button"],
|
|
4
4
|
"sourcesContent": ["import React, { useCallback, useState } from 'react';\nimport type { ButtonPropsBase } from '@splunk/react-ui/Button';\nimport Download from '@splunk/react-icons/ArrowBroadUnderbarDown';\nimport { ExportDashboardModal } from '@splunk/dashboard-ui';\nimport { noop } from '@splunk/dashboard-utils';\nimport { _ } from '@splunk/ui-utils/i18n';\nimport Button from '@splunk/react-ui/Button';\nimport type { ToolbarButtonProps } from '../types/common';\n\n// this icon should be sized consistent with the adjacent text, it does not need screenreader content\nconst downloadIcon = <Download />;\n\nexport interface ExportDashboardButtonProps extends ToolbarButtonProps {\n appearance?: ButtonPropsBase['appearance'];\n scale?: number;\n}\n\nconst ExportDashboardButton = ({\n appearance = 'secondary',\n scale = 1,\n}: ExportDashboardButtonProps) => {\n const [open, setOpen] = useState(false);\n\n const handleOpen = useCallback(() => {\n setOpen(true);\n }, []);\n\n const handleClose = useCallback(() => {\n setOpen(false);\n }, []);\n\n return (\n <>\n <Button\n icon={downloadIcon}\n key=\"export-dashboard-button\"\n data-clickable\n data-test=\"export-dashboard-button\"\n label={_('Download')}\n appearance={appearance || 'secondary'}\n onClick={handleOpen}\n />\n <ExportDashboardModal\n open={open}\n onModalClose={handleClose}\n scale={scale}\n returnFocus={noop}\n />\n </>\n );\n};\n\nexport default ExportDashboardButton;\n", "\nimport * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/ArrowBroadUnderbarDown\";\nexport * from \"@splunk/react-icons/ArrowBroadUnderbarDown\";\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-utils\";\nexport * from \"@splunk/dashboard-utils\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AACA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAA,iBAA+B;AAC/B,2CAAc;AACd,IAAO,iCAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,iCAAc;AACd,IAAO,uBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,oCAAc;AACd,IAAO,0BAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,yBAAc;AACd,IAAO,eAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ANOrE,IAAM,eAAe,4CAAC,oCAAS;AAO/B,IAAM,wBAAwB,CAAC;AAAA,EAC3B,aAAa;AAAA,EACb,QAAQ;AACZ,MAAkC;AAC9B,QAAM,CAAC,MAAM,OAAO,QAAI,wBAAS,KAAK;AAEtC,QAAM,iBAAa,2BAAY,MAAM;AACjC,YAAQ,IAAI;AAAA,EAChB,GAAG,CAAC,CAAC;AAEL,QAAM,kBAAc,2BAAY,MAAM;AAClC,YAAQ,KAAK;AAAA,EACjB,GAAG,CAAC,CAAC;AAEL,SACI,0EACI;AAAA,IAAC;AAAA;AAAA,MACG,MAAM;AAAA,MACN,KAAI;AAAA,MACJ,kBAAc;AAAA,MACd,aAAU;AAAA,MACV,WAAO,gBAAE,UAAU;AAAA,MACnB,YAAY,cAAc;AAAA,MAC1B,SAAS;AAAA;AAAA,EACb,GACA;AAAA,IAAC;AAAA;AAAA,MACG;AAAA,MACA,cAAc;AAAA,MACd;AAAA,MACA,aAAa;AAAA;AAAA,EACjB,CACJ;AAER;AAEA,IAAO,gCAAQ;",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../src/buttons/Fullscreen.tsx", "react", "
|
|
3
|
+
"sources": ["../src/buttons/Fullscreen.tsx", "esm-externals:react", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/react-icons/ChevronsOut", "esm-externals:@splunk/dashboard-state", "esm-externals:@splunk/react-icons/CaretDown", "esm-externals:@splunk/react-ui/ScreenReaderContent", "esm-externals:@splunk/react-ui/Button", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx"],
|
|
4
4
|
"sourcesContent": ["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 \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\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-icons/ChevronsOut\";\nexport * from \"@splunk/react-icons/ChevronsOut\";\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", "\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", "\nimport * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n screenReaderContent?: string;\n isMenu?: boolean;\n variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n Icon,\n screenReaderContent,\n isMenu = false,\n ...props\n}: PrepareIconProps) => {\n const size = isMenu ? menuIconSize : iconSize;\n return (\n <>\n <Icon width={size} height={size} {...props} />\n {isMenu && (\n <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n )}\n {screenReaderContent && (\n <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n )}\n </>\n );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n icon?: JSX.Element;\n onClick?: ButtonPropsBase['onClick'];\n label?: string;\n buttonRef?: React.RefObject<HTMLButtonElement>;\n testLabel?: string;\n disabled?: boolean;\n}\n\nconst IconButton = ({\n icon,\n buttonRef,\n disabled = false,\n onClick,\n label,\n testLabel,\n ...rest\n}: IconButtonProps): JSX.Element => {\n return (\n <ToolbarItem {...rest}>\n <Button\n elementRef={buttonRef}\n onClick={onClick}\n disabled={disabled}\n appearance=\"subtle\"\n icon={icon}\n label={label}\n data-test={testLabel}\n data-clickable\n />\n </ToolbarItem>\n );\n};\n\nexport default IconButton;\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AACA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAA,iBAA+B;AAC/B,yBAAc;AACd,IAAO,eAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,gCAAc;AACd,IAAO,sBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,oCAAc;AACd,IAAO,0BAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,8BAAc;AACd,IAAO,oBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,wCAAc;AACd,IAAO,8BAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAS,aAAaA,iBAA8B,yBAAUA;;;ACDrE,IAAO,eAAQ,0BAAO;;;ACOtB,IAAM,qBAAqB,0BAAO,iBAAY;AAAA;AAAA;AAIvC,IAAM,WAAW;AACjB,IAAM,eAAe;AAoBrB,IAAM,cAAc,CAAC,OAKJ;AALI,eACxB;AAAA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EArCb,IAkC4B,IAIrB,kBAJqB,IAIrB;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,OAAO,SAAS,eAAe;AACrC,SACI,0EACI,4CAAC,uBAAK,OAAO,MAAM,QAAQ,QAAU,MAAO,GAC3C,UACG,4CAAC,sBAAmB,SAAQ,UAAS,OAAO,GAAG,QAAQ,MAAM,GAEhE,uBACG,4CAAC,mCAAqB,mBAAoB,CAElD;AAER;AAWA,IAAM,aAAa,CAAC,OAQgB;AARhB,eAChB;AAAA,UAAAC;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,EArEJ,IA+DoB,IAOb,iBAPa,IAOb;AAAA,IANH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,SACI,4CAAC,iCAAgB,OACb;AAAA,IAAC;AAAA;AAAA,MACG,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA,YAAW;AAAA,MACX,MAAMA;AAAA,MACN;AAAA,MACA,aAAW;AAAA,MACX,kBAAc;AAAA;AAAA,EAClB,CACJ;AAER;AAEA,IAAO,qBAAQ;;;AV/Ef,IAAM,OAAO,YAAY;AAAA,EACrB,MAAM;AAAA,EACN,yBAAqB,gBAAE,YAAY;AACvC,CAAC;AAKD,IAAM,aAAa,CAAC,EAAE,aAAa,MAA0B;AACzD,QAAM,eAAe,CAAC,KAAC,qCAAY,+CAAuB;AAE1D,QAAM,kBAAc,2BAAY,MAAM;AAClC,iDAAc;AAAA,EAClB,GAAG,CAAC,YAAY,CAAC;AAEjB,SACI;AAAA,IAAC;AAAA;AAAA,MACG,WAAU;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV;AAAA;AAAA,EACJ;AAER;AAEA,IAAO,qBAAQ;",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../src/buttons/GridLineSwitch.tsx", "react", "styled-components", "
|
|
3
|
+
"sources": ["../src/buttons/GridLineSwitch.tsx", "esm-externals:react", "esm-externals:styled-components", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:@splunk/react-ui/Switch", "esm-externals:@splunk/dashboard-state", "esm-externals:@splunk/themes", "../src/components/ItemSeparator.tsx"],
|
|
4
4
|
"sourcesContent": ["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 \"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/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/Switch\";\nexport * from \"@splunk/react-ui/Switch\";\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", "\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"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AACA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAA,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,yBAAc;AACd,IAAO,eAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,oCAAc;AACd,IAAO,0BAAS,aAAaA,iBAA8B,yBAAUA;;;ACHrE;AAAA;AAAA;AAAA;AACA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACArE,IAAM,gBAAgB,0BAAO;AAAA;AAAA;AAAA,yBAGJ,yBAAU,sBAAsB;AAAA;AAAA,cAE3C,yBAAU,WAAW;AAAA;AAGnC,IAAO,wBAAQ;;;APCf,IAAM,kBAAkB,0BAAO;AAAA;AAAA;AAAA;AAAA,WAIpB,yBAAU,YAAY;AAAA;AAOjC,IAAM,iBAAiB,CAAC;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ,MAA2B;AA5B3B;AA6BI,QAAM,YAAW,8CAAY,iDAAyB,MAArC,YAA0C;AAE3D,QAAM,kBAAc,2BAAY,MAAM;AAClC,iDAAc,gBAAgB,CAAC;AAAA,EACnC,GAAG,CAAC,cAAc,QAAQ,CAAC;AAE3B,QAAM,gBAAY;AAAA,IACd,MAAO,gBAAgB,4CAAC,yBAAc,KAAI,kBAAiB,IAAK;AAAA,IAChE,CAAC,aAAa;AAAA,EAClB;AAEA,MAAI,CAAC,gBAAgB,SAAS,UAAU,eAAe,QAAQ;AAC3D,WAAO;AAAA,EACX;AAEA,SACI,4CAAC,mBAAgB,KAAI,sBACjB;AAAA,IAAC;AAAA;AAAA,MACG,SAAS;AAAA,MACT,UAAU;AAAA,MACV,mBAAe,gBAAE,qBAAqB;AAAA,MACtC,qBAAiB,gBAAE,yBAAyB;AAAA,MAC5C,YAAW;AAAA,MACX,aAAU;AAAA,MACV,kBAAc;AAAA;AAAA,QAEb,gBAAE,WAAW;AAAA,EAClB,GACC,SACL;AAER;AAEA,IAAO,yBAAQ;",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../src/buttons/HelpButton.tsx", "react", "
|
|
3
|
+
"sources": ["../src/buttons/HelpButton.tsx", "esm-externals:react", "esm-externals:@splunk/react-icons/QuestionCircle", "esm-externals:@splunk/react-ui/Dropdown", "esm-externals:@splunk/react-ui/Menu", "esm-externals:@splunk/ui-utils/i18n", "esm-externals:styled-components", "../src/Item.tsx", "../src/hooks/useDropdown.ts", "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"],
|
|
4
4
|
"sourcesContent": ["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 \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/QuestionCircle\";\nexport * from \"@splunk/react-icons/QuestionCircle\";\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/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\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", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import type { DropdownRequestCloseHandler } from '@splunk/react-ui/Dropdown';\nimport { useCallback, useRef, useState } from 'react';\n\ninterface UseDropdownArgs {\n isContentClickClose?: boolean;\n}\n\ninterface UseDropdownReturn {\n isOpen: boolean;\n handleRequestClose: DropdownRequestCloseHandler;\n handleRequestOpen: () => void;\n handleForceClose: () => void;\n setHasChildModal: (value: boolean) => void;\n}\n\n/**\n * Custom React Hook for the controlled SUI Dropdown component.\n *\n * @param {Object} config\n * @param {Boolean} config.isContentClickClose Control if dropdown children onClick's will close the dropdown automatically\n * @returns {Object} value\n * @returns {Boolean} value.isOpen The only state of this hook\n * @returns {Function} value.handleRequestOpen Event handler to open the dropdown\n * @returns {Function} value.handleRequestClose Event handler that SUI Dropdown calls when requested to close\n * @returns {Function} value.handleForceClose Event handler to forcefully close the dropdown\n */\nconst useDropdown = ({\n isContentClickClose = true,\n}: UseDropdownArgs): UseDropdownReturn => {\n const [isOpen, setIsOpen] = useState(false);\n const hasChildModal = useRef(false);\n\n const handleRequestClose = useCallback<DropdownRequestCloseHandler>(\n ({ reason }) => {\n if (reason === 'contentClick' && !isContentClickClose) {\n // This return results in the dropdown not closing.\n return;\n }\n\n // If there is a child modal then don't close the root on ESC press\n if (reason === 'escapeKey' && hasChildModal.current) {\n return;\n }\n\n setIsOpen(false);\n },\n [isContentClickClose]\n );\n\n const handleRequestOpen = useCallback(() => {\n setIsOpen(true);\n }, []);\n\n const handleForceClose = useCallback(() => {\n setIsOpen(false);\n }, []);\n\n const setHasChildModal = useCallback((value: boolean) => {\n hasChildModal.current = value;\n }, []);\n\n return {\n isOpen,\n handleRequestOpen,\n handleRequestClose,\n handleForceClose,\n setHasChildModal,\n };\n};\n\nexport default useDropdown;\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"],
|
|
5
5
|
"mappings": "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",
|
|
6
6
|
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|