@splunk/dashboard-toolbar 29.5.0 → 29.5.1
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 +9 -0
- package/CollapsibleToolbar.js.map +4 -4
- package/IconButton.js +16 -4
- package/IconButton.js.map +4 -4
- package/buttons/Charts.js +26 -4
- package/buttons/Charts.js.map +4 -4
- package/buttons/Config.js +19 -7
- package/buttons/Config.js.map +4 -4
- package/buttons/ContentExport.js +19 -7
- package/buttons/ContentExport.js.map +4 -4
- package/buttons/Data.js +19 -7
- package/buttons/Data.js.map +4 -4
- package/buttons/EmptyVisualization.js +19 -7
- package/buttons/EmptyVisualization.js.map +4 -4
- package/buttons/Fullscreen.js +19 -7
- package/buttons/Fullscreen.js.map +4 -4
- package/buttons/HelpButton.js +25 -3
- package/buttons/HelpButton.js.map +4 -4
- package/buttons/IconGallery.js +29 -7
- package/buttons/IconGallery.js.map +4 -4
- package/buttons/Image.js +19 -7
- package/buttons/Image.js.map +4 -4
- package/buttons/ImageGallery.js +29 -7
- package/buttons/ImageGallery.js.map +4 -4
- package/buttons/Inputs.js +28 -9
- package/buttons/Inputs.js.map +4 -4
- package/buttons/Markdown.js +19 -7
- package/buttons/Markdown.js.map +4 -4
- package/buttons/Redo.js +19 -7
- package/buttons/Redo.js.map +4 -4
- package/buttons/Shapes.js +31 -9
- package/buttons/Shapes.js.map +4 -4
- package/buttons/Source.js +19 -7
- package/buttons/Source.js.map +4 -4
- package/buttons/Undo.js +19 -7
- package/buttons/Undo.js.map +4 -4
- package/buttons/index.js +66 -61
- package/buttons/index.js.map +2 -2
- package/groups/ControlGroup.js +83 -33
- package/groups/ControlGroup.js.map +3 -3
- package/groups/EditingGroup.js +73 -30
- package/groups/EditingGroup.js.map +3 -3
- package/groups/EditorGroup.js +83 -33
- package/groups/EditorGroup.js.map +3 -3
- package/groups/EditorsControlGroup.js +93 -48
- package/groups/EditorsControlGroup.js.map +3 -3
- package/groups/HistoryGroup.js +85 -34
- package/groups/HistoryGroup.js.map +3 -3
- package/groups/SidebarControlGroup.js +91 -47
- package/groups/SidebarControlGroup.js.map +3 -3
- package/groups/VisualizationGroup.js +68 -45
- package/groups/VisualizationGroup.js.map +3 -3
- package/groups/index.js +86 -64
- package/groups/index.js.map +3 -3
- package/index.js +81 -76
- package/index.js.map +4 -4
- package/module/CollapsibleToolbar.js +2 -2
- package/module/IconButton.js +1 -1
- package/module/buttons/Charts.js +3 -3
- package/module/buttons/Config.js +2 -2
- package/module/buttons/ContentExport.js +2 -2
- package/module/buttons/Data.js +2 -2
- package/module/buttons/EmptyVisualization.js +2 -2
- package/module/buttons/Fullscreen.js +2 -2
- package/module/buttons/HelpButton.js +3 -3
- package/module/buttons/IconGallery.js +3 -3
- package/module/buttons/Image.js +2 -2
- package/module/buttons/ImageGallery.js +3 -3
- package/module/buttons/Inputs.js +3 -3
- package/module/buttons/Markdown.js +2 -2
- package/module/buttons/Redo.js +2 -2
- package/module/buttons/Shapes.js +3 -3
- package/module/buttons/Source.js +2 -2
- package/module/buttons/Undo.js +2 -2
- package/module/buttons/index.js +19 -19
- package/module/chunks/{chunk-PFKZCA73.js → chunk-5IFDFRGD.js} +2 -2
- package/module/chunks/{chunk-LEEGJTZT.js → chunk-6RWX6HA7.js} +5 -5
- package/module/chunks/chunk-6RWX6HA7.js.map +7 -0
- package/module/chunks/chunk-BDFUA6X7.js +44 -0
- package/module/chunks/chunk-BDFUA6X7.js.map +7 -0
- package/module/chunks/{chunk-C7TXRFKI.js → chunk-DM27U6AI.js} +5 -5
- package/module/chunks/chunk-DM27U6AI.js.map +7 -0
- package/module/chunks/{chunk-DQPRUHAE.js → chunk-DQZGTQ2Z.js} +5 -5
- package/module/chunks/chunk-DQZGTQ2Z.js.map +7 -0
- package/module/chunks/{chunk-WLLGLYOO.js → chunk-E3IBH4RN.js} +2 -2
- package/module/chunks/{chunk-COV2OGVE.js → chunk-E7EUH33R.js} +5 -5
- package/module/chunks/{chunk-IWFH2PBS.js → chunk-EUFLSUPO.js} +5 -5
- package/module/chunks/chunk-EUFLSUPO.js.map +7 -0
- package/module/chunks/{chunk-YDVHOHRE.js → chunk-FMSKWHRK.js} +8 -8
- package/module/chunks/{chunk-NNGZB36V.js → chunk-HMQY5XLG.js} +5 -5
- package/module/chunks/chunk-HMQY5XLG.js.map +7 -0
- package/module/chunks/{chunk-PFHSMP6M.js → chunk-KDWTCNVM.js} +5 -5
- package/module/chunks/chunk-KDWTCNVM.js.map +7 -0
- package/module/chunks/{chunk-GD75KGSO.js → chunk-KMWIB6DC.js} +3 -3
- package/module/chunks/{chunk-XIT2UXG2.js → chunk-P5YTSVEV.js} +5 -5
- package/module/chunks/chunk-P5YTSVEV.js.map +7 -0
- package/module/chunks/{chunk-CMTNN2GG.js → chunk-PUNHFOXB.js} +2 -2
- package/module/chunks/{chunk-CS7TUOVQ.js → chunk-QH53L2XQ.js} +4 -4
- package/module/chunks/{chunk-S6LWLEQ4.js → chunk-RS2VRN2X.js} +5 -5
- package/module/chunks/chunk-RS2VRN2X.js.map +7 -0
- package/module/chunks/{chunk-FK3PXQBK.js → chunk-RZRB3MPG.js} +20 -36
- package/module/chunks/chunk-RZRB3MPG.js.map +7 -0
- package/module/chunks/{chunk-OC4QIR2D.js → chunk-RZWTF3BK.js} +18 -3
- package/module/chunks/chunk-RZWTF3BK.js.map +7 -0
- package/module/chunks/{chunk-5DYPICGQ.js → chunk-SJNT4MK5.js} +5 -5
- package/module/chunks/chunk-SJNT4MK5.js.map +7 -0
- package/module/chunks/{chunk-EZS4433X.js → chunk-TQIO5WSS.js} +5 -5
- package/module/chunks/{chunk-EZS4433X.js.map → chunk-TQIO5WSS.js.map} +2 -2
- package/module/chunks/{chunk-JW4TMLMZ.js → chunk-U5YCUIDK.js} +5 -5
- package/module/chunks/chunk-U5YCUIDK.js.map +7 -0
- package/module/chunks/{chunk-NGEW5KQQ.js → chunk-UNYHHA4F.js} +5 -5
- package/module/chunks/{chunk-NGEW5KQQ.js.map → chunk-UNYHHA4F.js.map} +2 -2
- package/module/chunks/{chunk-GPLJNXKE.js → chunk-UUMIWWJE.js} +5 -5
- package/module/chunks/chunk-UUMIWWJE.js.map +7 -0
- package/module/chunks/{chunk-F3BPX66Z.js → chunk-VGHYIDZA.js} +2 -2
- package/module/chunks/{chunk-53UCFOI6.js → chunk-YH3LWJKQ.js} +6 -6
- package/module/chunks/chunk-YH3LWJKQ.js.map +7 -0
- package/module/chunks/{chunk-J7M7QRC7.js → chunk-YMIK47DX.js} +5 -5
- package/module/chunks/chunk-YMIK47DX.js.map +7 -0
- package/module/chunks/{chunk-NSCDFVBR.js → chunk-ZEITW5IL.js} +5 -5
- package/module/chunks/chunk-ZEITW5IL.js.map +7 -0
- package/module/groups/ControlGroup.js +20 -20
- package/module/groups/EditingGroup.js +20 -20
- package/module/groups/EditorGroup.js +20 -20
- package/module/groups/EditorsControlGroup.js +20 -20
- package/module/groups/HistoryGroup.js +20 -20
- package/module/groups/SidebarControlGroup.js +20 -20
- package/module/groups/VisualizationGroup.js +20 -20
- package/module/groups/index.js +26 -26
- package/module/index.js +27 -27
- package/package.json +15 -15
- package/types/IconButton.d.ts +2 -1
- package/types/IconButton.d.ts.map +1 -1
- package/types/buttons/Config.d.ts.map +1 -1
- package/types/buttons/ContentExport.d.ts.map +1 -1
- package/types/buttons/Data.d.ts.map +1 -1
- package/types/buttons/EmptyVisualization.d.ts.map +1 -1
- package/types/buttons/Fullscreen.d.ts.map +1 -1
- package/types/buttons/IconGallery.d.ts.map +1 -1
- package/types/buttons/Image.d.ts.map +1 -1
- package/types/buttons/Markdown.d.ts.map +1 -1
- package/types/buttons/Redo.d.ts.map +1 -1
- package/types/buttons/Source.d.ts.map +1 -1
- package/types/buttons/Undo.d.ts.map +1 -1
- package/types/buttons/tokenManager/TokenManager.d.ts.map +1 -1
- package/types/components/StyledButton.d.ts +10 -1
- package/types/components/StyledButton.d.ts.map +1 -1
- package/module/chunks/chunk-53UCFOI6.js.map +0 -7
- package/module/chunks/chunk-5DYPICGQ.js.map +0 -7
- package/module/chunks/chunk-C7TXRFKI.js.map +0 -7
- package/module/chunks/chunk-DQPRUHAE.js.map +0 -7
- package/module/chunks/chunk-EZJSIK72.js +0 -21
- package/module/chunks/chunk-EZJSIK72.js.map +0 -7
- package/module/chunks/chunk-FK3PXQBK.js.map +0 -7
- package/module/chunks/chunk-GPLJNXKE.js.map +0 -7
- package/module/chunks/chunk-IWFH2PBS.js.map +0 -7
- package/module/chunks/chunk-J7M7QRC7.js.map +0 -7
- package/module/chunks/chunk-JW4TMLMZ.js.map +0 -7
- package/module/chunks/chunk-LEEGJTZT.js.map +0 -7
- package/module/chunks/chunk-NNGZB36V.js.map +0 -7
- package/module/chunks/chunk-NSCDFVBR.js.map +0 -7
- package/module/chunks/chunk-OC4QIR2D.js.map +0 -7
- package/module/chunks/chunk-PFHSMP6M.js.map +0 -7
- package/module/chunks/chunk-S6LWLEQ4.js.map +0 -7
- package/module/chunks/chunk-XIT2UXG2.js.map +0 -7
- /package/module/chunks/{chunk-PFKZCA73.js.map → chunk-5IFDFRGD.js.map} +0 -0
- /package/module/chunks/{chunk-WLLGLYOO.js.map → chunk-E3IBH4RN.js.map} +0 -0
- /package/module/chunks/{chunk-COV2OGVE.js.map → chunk-E7EUH33R.js.map} +0 -0
- /package/module/chunks/{chunk-YDVHOHRE.js.map → chunk-FMSKWHRK.js.map} +0 -0
- /package/module/chunks/{chunk-GD75KGSO.js.map → chunk-KMWIB6DC.js.map} +0 -0
- /package/module/chunks/{chunk-CMTNN2GG.js.map → chunk-PUNHFOXB.js.map} +0 -0
- /package/module/chunks/{chunk-CS7TUOVQ.js.map → chunk-QH53L2XQ.js.map} +0 -0
- /package/module/chunks/{chunk-F3BPX66Z.js.map → chunk-VGHYIDZA.js.map} +0 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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
|
-
"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
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AAAA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAA,iBAA+B;AAC/B,yBAAc;AACd,IAAO,eAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,2CAAc;AACd,IAAO,iCAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,8BAAc;AACd,IAAO,oBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,wCAAc;AACd,IAAO,8BAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAsB;;;ACA7B,IAAO,eAAQ,0BAAO;;;
|
|
6
|
-
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
|
|
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:@splunk/react-ui/Tooltip", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx"],
|
|
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});\n\nconst ContentExport = ({ disabled, onClick }: ContentExportProps) => (\n <IconButton\n testLabel=\"content-export-button\"\n onClick={onClick}\n disabled={!!disabled}\n icon={icon}\n tooltipContent={_('Export')}\n />\n);\n\nexport default ContentExport;\n", "import * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/ArrowBroadUnderbarDown\";\nexport * from \"@splunk/react-icons/ArrowBroadUnderbarDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/ScreenReaderContent\";\nexport * from \"@splunk/react-ui/ScreenReaderContent\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Tooltip\";\nexport * from \"@splunk/react-ui/Tooltip\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default defaultImport.default;\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport Tooltip from '@splunk/react-ui/Tooltip';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n screenReaderContent?: string;\n isMenu?: boolean;\n variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n Icon,\n screenReaderContent,\n isMenu = false,\n ...props\n}: PrepareIconProps) => {\n const size = isMenu ? menuIconSize : iconSize;\n return (\n <>\n <Icon width={size} height={size} {...props} />\n {isMenu && (\n <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n )}\n {screenReaderContent && (\n <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n )}\n </>\n );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n icon?: JSX.Element;\n onClick?: ButtonPropsBase['onClick'];\n label?: string;\n tooltipContent?: string;\n buttonRef?: React.RefObject<HTMLButtonElement>;\n testLabel?: string;\n disabled?: boolean;\n}\n\nconst IconButton = ({\n icon,\n buttonRef,\n disabled = false,\n onClick,\n label,\n tooltipContent,\n testLabel,\n ...rest\n}: IconButtonProps): JSX.Element => {\n const button = (\n <Button\n elementRef={buttonRef}\n onClick={onClick}\n disabled={disabled}\n appearance=\"subtle\"\n icon={icon}\n label={label}\n data-test={testLabel}\n data-clickable\n />\n );\n\n return (\n <ToolbarItem {...rest}>\n {tooltipContent ? (\n <Tooltip contentRelationship=\"label\" content={tooltipContent}>\n {button}\n </Tooltip>\n ) : (\n button\n )}\n </ToolbarItem>\n );\n};\n\nexport default IconButton;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AAAA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAA,iBAA+B;AAC/B,yBAAc;AACd,IAAO,eAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,2CAAc;AACd,IAAO,iCAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,8BAAc;AACd,IAAO,oBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,wCAAc;AACd,IAAO,8BAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,4BAAc;AACd,IAAO,kBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAsB;;;ACA7B,IAAO,eAAQ,0BAAO;;;ACQtB,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,EAtCb,IAmC4B,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;AAYA,IAAM,aAAa,CAAC,OASgB;AAThB,eAChB;AAAA,UAAAC;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAxEJ,IAiEoB,IAQb,iBARa,IAQb;AAAA,IAPH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,SACF;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;AAGJ,SACI,4CAAC,iCAAgB,OACZ,iBACG,4CAAC,mBAAQ,qBAAoB,SAAQ,SAAS,kBACzC,MACL,IAEA,MAER;AAER;AAEA,IAAO,qBAAQ;;;AV1Ff,IAAM,OAAO,YAAY;AAAA,EACrB,MAAM;AACV,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,IACA,oBAAgB,gBAAE,QAAQ;AAAA;AAC9B;AAGJ,IAAO,wBAAQ;",
|
|
6
|
+
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
|
|
7
7
|
}
|
package/buttons/Data.js
CHANGED
|
@@ -136,14 +136,23 @@ var defaultImport8 = __toESM(require("@splunk/react-ui/Button"));
|
|
|
136
136
|
__reExport(Button_exports, require("@splunk/react-ui/Button"));
|
|
137
137
|
var Button_default = "default" in defaultImport8 ? defaultImport8.default : defaultImport8;
|
|
138
138
|
|
|
139
|
+
// esm-externals:@splunk/react-ui/Tooltip
|
|
140
|
+
var Tooltip_exports = {};
|
|
141
|
+
__export(Tooltip_exports, {
|
|
142
|
+
default: () => Tooltip_default
|
|
143
|
+
});
|
|
144
|
+
var defaultImport9 = __toESM(require("@splunk/react-ui/Tooltip"));
|
|
145
|
+
__reExport(Tooltip_exports, require("@splunk/react-ui/Tooltip"));
|
|
146
|
+
var Tooltip_default = "default" in defaultImport9 ? defaultImport9.default : defaultImport9;
|
|
147
|
+
|
|
139
148
|
// esm-externals:styled-components
|
|
140
149
|
var styled_components_exports = {};
|
|
141
150
|
__export(styled_components_exports, {
|
|
142
151
|
default: () => styled_components_default
|
|
143
152
|
});
|
|
144
|
-
var
|
|
153
|
+
var defaultImport10 = __toESM(require("styled-components"));
|
|
145
154
|
__reExport(styled_components_exports, require("styled-components"));
|
|
146
|
-
var styled_components_default =
|
|
155
|
+
var styled_components_default = defaultImport10.default;
|
|
147
156
|
|
|
148
157
|
// src/Item.tsx
|
|
149
158
|
var Item_default = styled_components_default.div``;
|
|
@@ -174,6 +183,7 @@ var IconButton = (_a) => {
|
|
|
174
183
|
disabled = false,
|
|
175
184
|
onClick,
|
|
176
185
|
label,
|
|
186
|
+
tooltipContent,
|
|
177
187
|
testLabel
|
|
178
188
|
} = _b, rest = __objRest(_b, [
|
|
179
189
|
"icon",
|
|
@@ -181,9 +191,10 @@ var IconButton = (_a) => {
|
|
|
181
191
|
"disabled",
|
|
182
192
|
"onClick",
|
|
183
193
|
"label",
|
|
194
|
+
"tooltipContent",
|
|
184
195
|
"testLabel"
|
|
185
196
|
]);
|
|
186
|
-
|
|
197
|
+
const button = /* @__PURE__ */ react_default.createElement(
|
|
187
198
|
Button_default,
|
|
188
199
|
{
|
|
189
200
|
elementRef: buttonRef,
|
|
@@ -195,14 +206,14 @@ var IconButton = (_a) => {
|
|
|
195
206
|
"data-test": testLabel,
|
|
196
207
|
"data-clickable": true
|
|
197
208
|
}
|
|
198
|
-
)
|
|
209
|
+
);
|
|
210
|
+
return /* @__PURE__ */ react_default.createElement(Item_default, __spreadValues({}, rest), tooltipContent ? /* @__PURE__ */ react_default.createElement(Tooltip_default, { contentRelationship: "label", content: tooltipContent }, button) : button);
|
|
199
211
|
};
|
|
200
212
|
var IconButton_default = IconButton;
|
|
201
213
|
|
|
202
214
|
// src/buttons/Data.tsx
|
|
203
215
|
var dataInputIcon = prepareIcon({
|
|
204
|
-
Icon: CylinderMulti_default
|
|
205
|
-
screenReaderContent: (0, i18n_exports._)("Data source overview")
|
|
216
|
+
Icon: CylinderMulti_default
|
|
206
217
|
});
|
|
207
218
|
var Data = ({ dashboardApi }) => {
|
|
208
219
|
const dataButtonRef = (0, dashboard_context_exports.useToolbarRef)("dataOverview");
|
|
@@ -228,7 +239,8 @@ var Data = ({ dashboardApi }) => {
|
|
|
228
239
|
buttonRef: dataButtonRef,
|
|
229
240
|
testLabel: "data-button",
|
|
230
241
|
onClick: handleClick,
|
|
231
|
-
icon: dataInputIcon
|
|
242
|
+
icon: dataInputIcon,
|
|
243
|
+
tooltipContent: (0, i18n_exports._)("Data source overview")
|
|
232
244
|
}
|
|
233
245
|
);
|
|
234
246
|
};
|
package/buttons/Data.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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
|
-
"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
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AAAA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAA,iBAA+B;AAC/B,yBAAc;AACd,IAAO,eAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,kCAAc;AACd,IAAO,wBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,oCAAc;AACd,IAAO,0BAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,8BAAc;AACd,IAAO,oBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,wCAAc;AACd,IAAO,8BAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAsB;;;ACA7B,IAAO,eAAQ,0BAAO;;;
|
|
6
|
-
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|
|
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:@splunk/react-ui/Tooltip", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx"],
|
|
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});\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 tooltipContent={_('Data source overview')}\n />\n );\n};\n\nexport default Data;\n", "import * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/CylinderMulti\";\nexport * from \"@splunk/react-icons/CylinderMulti\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/dashboard-context\";\nexport * from \"@splunk/dashboard-context\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/dashboard-state\";\nexport * from \"@splunk/dashboard-state\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/ScreenReaderContent\";\nexport * from \"@splunk/react-ui/ScreenReaderContent\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Tooltip\";\nexport * from \"@splunk/react-ui/Tooltip\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default defaultImport.default;\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport Tooltip from '@splunk/react-ui/Tooltip';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n screenReaderContent?: string;\n isMenu?: boolean;\n variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n Icon,\n screenReaderContent,\n isMenu = false,\n ...props\n}: PrepareIconProps) => {\n const size = isMenu ? menuIconSize : iconSize;\n return (\n <>\n <Icon width={size} height={size} {...props} />\n {isMenu && (\n <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n )}\n {screenReaderContent && (\n <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n )}\n </>\n );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n icon?: JSX.Element;\n onClick?: ButtonPropsBase['onClick'];\n label?: string;\n tooltipContent?: string;\n buttonRef?: React.RefObject<HTMLButtonElement>;\n testLabel?: string;\n disabled?: boolean;\n}\n\nconst IconButton = ({\n icon,\n buttonRef,\n disabled = false,\n onClick,\n label,\n tooltipContent,\n testLabel,\n ...rest\n}: IconButtonProps): JSX.Element => {\n const button = (\n <Button\n elementRef={buttonRef}\n onClick={onClick}\n disabled={disabled}\n appearance=\"subtle\"\n icon={icon}\n label={label}\n data-test={testLabel}\n data-clickable\n />\n );\n\n return (\n <ToolbarItem {...rest}>\n {tooltipContent ? (\n <Tooltip contentRelationship=\"label\" content={tooltipContent}>\n {button}\n </Tooltip>\n ) : (\n button\n )}\n </ToolbarItem>\n );\n};\n\nexport default IconButton;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AAAA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAA,iBAA+B;AAC/B,yBAAc;AACd,IAAO,eAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,kCAAc;AACd,IAAO,wBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,oCAAc;AACd,IAAO,0BAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,8BAAc;AACd,IAAO,oBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,wCAAc;AACd,IAAO,8BAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,4BAAc;AACd,IAAO,kBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,kBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAsB;;;ACA7B,IAAO,eAAQ,0BAAO;;;ACQtB,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,EAtCb,IAmC4B,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;AAYA,IAAM,aAAa,CAAC,OASgB;AAThB,eAChB;AAAA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAxEJ,IAiEoB,IAQb,iBARa,IAQb;AAAA,IAPH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,SACF;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;AAGJ,SACI,4CAAC,iCAAgB,OACZ,iBACG,4CAAC,mBAAQ,qBAAoB,SAAQ,SAAS,kBACzC,MACL,IAEA,MAER;AAER;AAEA,IAAO,qBAAQ;;;AZ1Ff,IAAM,gBAAgB,YAAY;AAAA,EAC9B,MAAM;AACV,CAAC;AAKD,IAAM,OAAO,CAAC,EAAE,aAAa,MAA0B;AACnD,QAAM,oBAAgB,yCAAc,cAAc;AAElD,QAAM,kBAAc,2BAAY,MAAM;AAClC,UAAM,UAAS,6CAAc,sBAAqB;AAClD,QAAI,QAAQ;AACR,mBAAa,WAAW;AAAA,IAC5B,OAAO;AACH,yCAAM,MAAM;AAER,qDAAc,oBAAoB,CAAC;AAEnC,qDAAc,UAAU;AAAA,UACpB,aAAa;AAAA,UACb,YAAY;AAAA,YACR,aAAa;AAAA,UACjB;AAAA,QACJ;AAAA,MACJ,CAAC;AAAA,IACL;AAAA,EACJ,GAAG,CAAC,YAAY,CAAC;AAEjB,SACI;AAAA,IAAC;AAAA;AAAA,MACG,WAAW;AAAA,MACX,WAAU;AAAA,MACV,SAAS;AAAA,MACT,MAAM;AAAA,MACN,oBAAgB,gBAAE,sBAAsB;AAAA;AAAA,EAC5C;AAER;AAEA,IAAO,eAAQ;",
|
|
6
|
+
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|
|
7
7
|
}
|
|
@@ -138,14 +138,23 @@ var defaultImport6 = __toESM(require("@splunk/react-ui/Button"));
|
|
|
138
138
|
__reExport(Button_exports, require("@splunk/react-ui/Button"));
|
|
139
139
|
var Button_default = "default" in defaultImport6 ? defaultImport6.default : defaultImport6;
|
|
140
140
|
|
|
141
|
+
// esm-externals:@splunk/react-ui/Tooltip
|
|
142
|
+
var Tooltip_exports = {};
|
|
143
|
+
__export(Tooltip_exports, {
|
|
144
|
+
default: () => Tooltip_default
|
|
145
|
+
});
|
|
146
|
+
var defaultImport7 = __toESM(require("@splunk/react-ui/Tooltip"));
|
|
147
|
+
__reExport(Tooltip_exports, require("@splunk/react-ui/Tooltip"));
|
|
148
|
+
var Tooltip_default = "default" in defaultImport7 ? defaultImport7.default : defaultImport7;
|
|
149
|
+
|
|
141
150
|
// esm-externals:styled-components
|
|
142
151
|
var styled_components_exports = {};
|
|
143
152
|
__export(styled_components_exports, {
|
|
144
153
|
default: () => styled_components_default
|
|
145
154
|
});
|
|
146
|
-
var
|
|
155
|
+
var defaultImport8 = __toESM(require("styled-components"));
|
|
147
156
|
__reExport(styled_components_exports, require("styled-components"));
|
|
148
|
-
var styled_components_default =
|
|
157
|
+
var styled_components_default = defaultImport8.default;
|
|
149
158
|
|
|
150
159
|
// src/Item.tsx
|
|
151
160
|
var Item_default = styled_components_default.div``;
|
|
@@ -176,6 +185,7 @@ var IconButton = (_a) => {
|
|
|
176
185
|
disabled = false,
|
|
177
186
|
onClick,
|
|
178
187
|
label,
|
|
188
|
+
tooltipContent,
|
|
179
189
|
testLabel
|
|
180
190
|
} = _b, rest = __objRest(_b, [
|
|
181
191
|
"icon",
|
|
@@ -183,9 +193,10 @@ var IconButton = (_a) => {
|
|
|
183
193
|
"disabled",
|
|
184
194
|
"onClick",
|
|
185
195
|
"label",
|
|
196
|
+
"tooltipContent",
|
|
186
197
|
"testLabel"
|
|
187
198
|
]);
|
|
188
|
-
|
|
199
|
+
const button = /* @__PURE__ */ react_default.createElement(
|
|
189
200
|
Button_default,
|
|
190
201
|
{
|
|
191
202
|
elementRef: buttonRef,
|
|
@@ -197,14 +208,14 @@ var IconButton = (_a) => {
|
|
|
197
208
|
"data-test": testLabel,
|
|
198
209
|
"data-clickable": true
|
|
199
210
|
}
|
|
200
|
-
)
|
|
211
|
+
);
|
|
212
|
+
return /* @__PURE__ */ react_default.createElement(Item_default, __spreadValues({}, rest), tooltipContent ? /* @__PURE__ */ react_default.createElement(Tooltip_default, { contentRelationship: "label", content: tooltipContent }, button) : button);
|
|
201
213
|
};
|
|
202
214
|
var IconButton_default = IconButton;
|
|
203
215
|
|
|
204
216
|
// src/buttons/EmptyVisualization.tsx
|
|
205
217
|
var icon = prepareIcon({
|
|
206
|
-
Icon: Square_default
|
|
207
|
-
screenReaderContent: (0, i18n_exports._)("Add rectangle")
|
|
218
|
+
Icon: Square_default
|
|
208
219
|
});
|
|
209
220
|
var EmptyVisualization = ({ dashboardApi }) => {
|
|
210
221
|
const handleClick = (0, react_exports.useCallback)(() => __async(null, null, function* () {
|
|
@@ -226,7 +237,8 @@ var EmptyVisualization = ({ dashboardApi }) => {
|
|
|
226
237
|
{
|
|
227
238
|
testLabel: "empty-viz-button",
|
|
228
239
|
onClick: handleClick,
|
|
229
|
-
icon
|
|
240
|
+
icon,
|
|
241
|
+
tooltipContent: (0, i18n_exports._)("Add rectangle")
|
|
230
242
|
}
|
|
231
243
|
);
|
|
232
244
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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
|
-
"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
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AAAA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAA,iBAA+B;AAC/B,yBAAc;AACd,IAAO,eAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,8BAAc;AACd,IAAO,oBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,wCAAc;AACd,IAAO,8BAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAsB;;;ACA7B,IAAO,eAAQ,0BAAO;;;
|
|
6
|
-
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
|
|
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:@splunk/react-ui/Tooltip", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx"],
|
|
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});\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 tooltipContent={_('Add rectangle')}\n />\n );\n};\n\nexport default EmptyVisualization;\n", "import * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/Square\";\nexport * from \"@splunk/react-icons/Square\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/ScreenReaderContent\";\nexport * from \"@splunk/react-ui/ScreenReaderContent\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Tooltip\";\nexport * from \"@splunk/react-ui/Tooltip\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default defaultImport.default;\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport Tooltip from '@splunk/react-ui/Tooltip';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n screenReaderContent?: string;\n isMenu?: boolean;\n variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n Icon,\n screenReaderContent,\n isMenu = false,\n ...props\n}: PrepareIconProps) => {\n const size = isMenu ? menuIconSize : iconSize;\n return (\n <>\n <Icon width={size} height={size} {...props} />\n {isMenu && (\n <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n )}\n {screenReaderContent && (\n <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n )}\n </>\n );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n icon?: JSX.Element;\n onClick?: ButtonPropsBase['onClick'];\n label?: string;\n tooltipContent?: string;\n buttonRef?: React.RefObject<HTMLButtonElement>;\n testLabel?: string;\n disabled?: boolean;\n}\n\nconst IconButton = ({\n icon,\n buttonRef,\n disabled = false,\n onClick,\n label,\n tooltipContent,\n testLabel,\n ...rest\n}: IconButtonProps): JSX.Element => {\n const button = (\n <Button\n elementRef={buttonRef}\n onClick={onClick}\n disabled={disabled}\n appearance=\"subtle\"\n icon={icon}\n label={label}\n data-test={testLabel}\n data-clickable\n />\n );\n\n return (\n <ToolbarItem {...rest}>\n {tooltipContent ? (\n <Tooltip contentRelationship=\"label\" content={tooltipContent}>\n {button}\n </Tooltip>\n ) : (\n button\n )}\n </ToolbarItem>\n );\n};\n\nexport default IconButton;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
|
|
7
7
|
}
|
package/buttons/Fullscreen.js
CHANGED
|
@@ -147,14 +147,23 @@ var defaultImport7 = __toESM(require("@splunk/react-ui/Button"));
|
|
|
147
147
|
__reExport(Button_exports, require("@splunk/react-ui/Button"));
|
|
148
148
|
var Button_default = "default" in defaultImport7 ? defaultImport7.default : defaultImport7;
|
|
149
149
|
|
|
150
|
+
// esm-externals:@splunk/react-ui/Tooltip
|
|
151
|
+
var Tooltip_exports = {};
|
|
152
|
+
__export(Tooltip_exports, {
|
|
153
|
+
default: () => Tooltip_default
|
|
154
|
+
});
|
|
155
|
+
var defaultImport8 = __toESM(require("@splunk/react-ui/Tooltip"));
|
|
156
|
+
__reExport(Tooltip_exports, require("@splunk/react-ui/Tooltip"));
|
|
157
|
+
var Tooltip_default = "default" in defaultImport8 ? defaultImport8.default : defaultImport8;
|
|
158
|
+
|
|
150
159
|
// esm-externals:styled-components
|
|
151
160
|
var styled_components_exports = {};
|
|
152
161
|
__export(styled_components_exports, {
|
|
153
162
|
default: () => styled_components_default
|
|
154
163
|
});
|
|
155
|
-
var
|
|
164
|
+
var defaultImport9 = __toESM(require("styled-components"));
|
|
156
165
|
__reExport(styled_components_exports, require("styled-components"));
|
|
157
|
-
var styled_components_default =
|
|
166
|
+
var styled_components_default = defaultImport9.default;
|
|
158
167
|
|
|
159
168
|
// src/Item.tsx
|
|
160
169
|
var Item_default = styled_components_default.div``;
|
|
@@ -185,6 +194,7 @@ var IconButton = (_a) => {
|
|
|
185
194
|
disabled = false,
|
|
186
195
|
onClick,
|
|
187
196
|
label,
|
|
197
|
+
tooltipContent,
|
|
188
198
|
testLabel
|
|
189
199
|
} = _b, rest = __objRest(_b, [
|
|
190
200
|
"icon",
|
|
@@ -192,9 +202,10 @@ var IconButton = (_a) => {
|
|
|
192
202
|
"disabled",
|
|
193
203
|
"onClick",
|
|
194
204
|
"label",
|
|
205
|
+
"tooltipContent",
|
|
195
206
|
"testLabel"
|
|
196
207
|
]);
|
|
197
|
-
|
|
208
|
+
const button = /* @__PURE__ */ react_default.createElement(
|
|
198
209
|
Button_default,
|
|
199
210
|
{
|
|
200
211
|
elementRef: buttonRef,
|
|
@@ -206,7 +217,8 @@ var IconButton = (_a) => {
|
|
|
206
217
|
"data-test": testLabel,
|
|
207
218
|
"data-clickable": true
|
|
208
219
|
}
|
|
209
|
-
)
|
|
220
|
+
);
|
|
221
|
+
return /* @__PURE__ */ react_default.createElement(Item_default, __spreadValues({}, rest), tooltipContent ? /* @__PURE__ */ react_default.createElement(Tooltip_default, { contentRelationship: "label", content: tooltipContent }, button) : button);
|
|
210
222
|
};
|
|
211
223
|
var IconButton_default = IconButton;
|
|
212
224
|
|
|
@@ -230,8 +242,7 @@ var useToolbarButtonClick = (event, onClick) => {
|
|
|
230
242
|
|
|
231
243
|
// src/buttons/Fullscreen.tsx
|
|
232
244
|
var icon = prepareIcon({
|
|
233
|
-
Icon: ChevronsOut_default
|
|
234
|
-
screenReaderContent: (0, i18n_exports._)("Fullscreen")
|
|
245
|
+
Icon: ChevronsOut_default
|
|
235
246
|
});
|
|
236
247
|
var FullScreen = ({ dashboardApi }) => {
|
|
237
248
|
const isFullscreen = !!(0, dashboard_state_exports.useSelector)(dashboard_state_exports.selectFullscreenElement);
|
|
@@ -245,7 +256,8 @@ var FullScreen = ({ dashboardApi }) => {
|
|
|
245
256
|
testLabel: "fullscreen-button",
|
|
246
257
|
onClick: handleClick,
|
|
247
258
|
disabled: isFullscreen,
|
|
248
|
-
icon
|
|
259
|
+
icon,
|
|
260
|
+
tooltipContent: (0, i18n_exports._)("Fullscreen")
|
|
249
261
|
}
|
|
250
262
|
);
|
|
251
263
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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", "../src/hooks/useToolbarButtonClick.ts"],
|
|
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';\nimport { useToolbarButtonClick } from '../hooks/useToolbarButtonClick';\n\nconst icon = prepareIcon({\n Icon: Fullscreen,\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA;AAAA;AAAA;AAAA;AAAA,oBAA+B;AAC/B,0BAAc;AACd,IAAO,gBAAS,aAAa,gBAA8B,wBAAU;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAA,iBAA+B;AAC/B,yBAAc;AACd,IAAO,eAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,gCAAc;AACd,IAAO,sBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,oCAAc;AACd,IAAO,0BAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,8BAAc;AACd,IAAO,oBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,wCAAc;AACd,IAAO,8BAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,2BAAc;AACd,IAAO,iBAAS,aAAaA,iBAA8B,yBAAUA;;;ACFrE;AAAA;AAAA;AAAA;AAAA,IAAAC,iBAA+B;AAC/B,sCAAc;AACd,IAAO,4BAAsB;;;ACA7B,IAAO,eAAQ,0BAAO;;;
|
|
6
|
-
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
|
|
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:@splunk/react-ui/Tooltip", "esm-externals:styled-components", "../src/Item.tsx", "../src/IconButton.tsx", "../src/hooks/useToolbarButtonClick.ts"],
|
|
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';\nimport { useToolbarButtonClick } from '../hooks/useToolbarButtonClick';\n\nconst icon = prepareIcon({\n Icon: Fullscreen,\n});\n\n/**\n * Button that toggle fullscreen mode\n */\nconst FullScreen = ({ dashboardApi }: ToolbarButtonProps) => {\n const isFullscreen = !!useSelector(selectFullscreenElement);\n\n const enterFullscreen = useCallback(async () => {\n await dashboardApi?.enterFullscreen();\n }, [dashboardApi]);\n\n const handleClick = useToolbarButtonClick('fullscreen', enterFullscreen);\n\n return (\n <IconButton\n testLabel=\"fullscreen-button\"\n onClick={handleClick}\n disabled={isFullscreen}\n icon={icon}\n tooltipContent={_('Fullscreen')}\n />\n );\n};\n\nexport default FullScreen;\n", "import * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/ChevronsOut\";\nexport * from \"@splunk/react-icons/ChevronsOut\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/dashboard-state\";\nexport * from \"@splunk/dashboard-state\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/ScreenReaderContent\";\nexport * from \"@splunk/react-ui/ScreenReaderContent\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Tooltip\";\nexport * from \"@splunk/react-ui/Tooltip\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default defaultImport.default;\n", "import styled from 'styled-components';\n\nexport default styled.div``;\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport Tooltip from '@splunk/react-ui/Tooltip';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n screenReaderContent?: string;\n isMenu?: boolean;\n variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n Icon,\n screenReaderContent,\n isMenu = false,\n ...props\n}: PrepareIconProps) => {\n const size = isMenu ? menuIconSize : iconSize;\n return (\n <>\n <Icon width={size} height={size} {...props} />\n {isMenu && (\n <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n )}\n {screenReaderContent && (\n <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n )}\n </>\n );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n icon?: JSX.Element;\n onClick?: ButtonPropsBase['onClick'];\n label?: string;\n tooltipContent?: string;\n buttonRef?: React.RefObject<HTMLButtonElement>;\n testLabel?: string;\n disabled?: boolean;\n}\n\nconst IconButton = ({\n icon,\n buttonRef,\n disabled = false,\n onClick,\n label,\n tooltipContent,\n testLabel,\n ...rest\n}: IconButtonProps): JSX.Element => {\n const button = (\n <Button\n elementRef={buttonRef}\n onClick={onClick}\n disabled={disabled}\n appearance=\"subtle\"\n icon={icon}\n label={label}\n data-test={testLabel}\n data-clickable\n />\n );\n\n return (\n <ToolbarItem {...rest}>\n {tooltipContent ? (\n <Tooltip contentRelationship=\"label\" content={tooltipContent}>\n {button}\n </Tooltip>\n ) : (\n button\n )}\n </ToolbarItem>\n );\n};\n\nexport default IconButton;\n", "import { useCallback } from 'react';\nimport { useDispatch, toolbarButtonClicked } from '@splunk/dashboard-state';\n\nexport const useToolbarButtonClick = <T extends unknown[]>(\n event?: string,\n onClick?: (...args: T) => void\n) => {\n const dispatch = useDispatch();\n\n return useCallback(\n (...args: T) => {\n if (dispatch && event) {\n dispatch(\n toolbarButtonClicked({\n event,\n })\n );\n }\n onClick?.(...args);\n },\n [dispatch, event, onClick]\n );\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "icon"]
|
|
7
7
|
}
|
package/buttons/HelpButton.js
CHANGED
|
@@ -4,7 +4,9 @@ in part without a valid written license from Splunk Inc. is PROHIBITED. */
|
|
|
4
4
|
"use strict";
|
|
5
5
|
var __create = Object.create;
|
|
6
6
|
var __defProp = Object.defineProperty;
|
|
7
|
+
var __defProps = Object.defineProperties;
|
|
7
8
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
9
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
8
10
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
9
11
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
10
12
|
var __getProtoOf = Object.getPrototypeOf;
|
|
@@ -22,6 +24,7 @@ var __spreadValues = (a, b) => {
|
|
|
22
24
|
}
|
|
23
25
|
return a;
|
|
24
26
|
};
|
|
27
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
28
|
var __objRest = (source, exclude) => {
|
|
26
29
|
var target = {};
|
|
27
30
|
for (var prop in source)
|
|
@@ -185,6 +188,15 @@ var defaultImport9 = __toESM(require("@splunk/react-ui/Button"));
|
|
|
185
188
|
__reExport(Button_exports, require("@splunk/react-ui/Button"));
|
|
186
189
|
var Button_default = "default" in defaultImport9 ? defaultImport9.default : defaultImport9;
|
|
187
190
|
|
|
191
|
+
// esm-externals:@splunk/react-ui/Tooltip
|
|
192
|
+
var Tooltip_exports = {};
|
|
193
|
+
__export(Tooltip_exports, {
|
|
194
|
+
default: () => Tooltip_default
|
|
195
|
+
});
|
|
196
|
+
var defaultImport10 = __toESM(require("@splunk/react-ui/Tooltip"));
|
|
197
|
+
__reExport(Tooltip_exports, require("@splunk/react-ui/Tooltip"));
|
|
198
|
+
var Tooltip_default = "default" in defaultImport10 ? defaultImport10.default : defaultImport10;
|
|
199
|
+
|
|
188
200
|
// src/IconButton.tsx
|
|
189
201
|
var StyledDropdownIcon = styled_components_default(CaretDown_default)`
|
|
190
202
|
margin-left: -5px;
|
|
@@ -206,14 +218,23 @@ var prepareIcon = (_a) => {
|
|
|
206
218
|
};
|
|
207
219
|
|
|
208
220
|
// src/components/StyledButton.tsx
|
|
209
|
-
var
|
|
221
|
+
var BaseDropdownButton = styled_components_default(Button_default)`
|
|
210
222
|
max-width: '50px';
|
|
211
223
|
`;
|
|
224
|
+
var StyledDropdownButton = react_default.forwardRef((_a, ref) => {
|
|
225
|
+
var _b = _a, { tooltipContent } = _b, props = __objRest(_b, ["tooltipContent"]);
|
|
226
|
+
const button = /* @__PURE__ */ react_default.createElement(
|
|
227
|
+
BaseDropdownButton,
|
|
228
|
+
__spreadProps(__spreadValues({}, props), {
|
|
229
|
+
elementRef: ref
|
|
230
|
+
})
|
|
231
|
+
);
|
|
232
|
+
return tooltipContent ? /* @__PURE__ */ react_default.createElement(Tooltip_default, { contentRelationship: "label", content: tooltipContent }, button) : button;
|
|
233
|
+
});
|
|
212
234
|
|
|
213
235
|
// src/buttons/HelpButton.tsx
|
|
214
236
|
var HelpIcon = prepareIcon({
|
|
215
237
|
Icon: QuestionCircle_default,
|
|
216
|
-
screenReaderContent: (0, i18n_exports._)("Help links"),
|
|
217
238
|
isMenu: true
|
|
218
239
|
});
|
|
219
240
|
var ButtonToggle = /* @__PURE__ */ react_default.createElement(
|
|
@@ -222,7 +243,8 @@ var ButtonToggle = /* @__PURE__ */ react_default.createElement(
|
|
|
222
243
|
appearance: "subtle",
|
|
223
244
|
"data-clickable": true,
|
|
224
245
|
"data-test": "help-button",
|
|
225
|
-
icon: HelpIcon
|
|
246
|
+
icon: HelpIcon,
|
|
247
|
+
tooltipContent: (0, i18n_exports._)("Help links")
|
|
226
248
|
}
|
|
227
249
|
);
|
|
228
250
|
var HelpButton = ({ helpLinks = [] }) => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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
|
-
"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 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.replaceAll(/\\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 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", "import * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/QuestionCircle\";\nexport * from \"@splunk/react-icons/QuestionCircle\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Dropdown\";\nexport * from \"@splunk/react-ui/Dropdown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Menu\";\nexport * from \"@splunk/react-ui/Menu\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default defaultImport.default;\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", "import * as defaultImport from \"@splunk/react-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/ScreenReaderContent\";\nexport * from \"@splunk/react-ui/ScreenReaderContent\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import 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": "
|
|
6
|
-
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|
|
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", "esm-externals:@splunk/react-ui/Tooltip", "../src/IconButton.tsx", "../src/components/StyledButton.tsx"],
|
|
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 HelpIcon = prepareIcon({\n Icon: Help,\n isMenu: true,\n});\n\nconst ButtonToggle = (\n <StyledDropdownButton\n appearance=\"subtle\"\n data-clickable\n data-test=\"help-button\"\n icon={HelpIcon}\n tooltipContent={_('Help links')}\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.replaceAll(/\\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 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", "import * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-icons/QuestionCircle\";\nexport * from \"@splunk/react-icons/QuestionCircle\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Dropdown\";\nexport * from \"@splunk/react-ui/Dropdown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Menu\";\nexport * from \"@splunk/react-ui/Menu\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/ui-utils/i18n\";\nexport * from \"@splunk/ui-utils/i18n\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default defaultImport.default;\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", "import * as defaultImport from \"@splunk/react-icons/CaretDown\";\nexport * from \"@splunk/react-icons/CaretDown\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/ScreenReaderContent\";\nexport * from \"@splunk/react-ui/ScreenReaderContent\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Button\";\nexport * from \"@splunk/react-ui/Button\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import * as defaultImport from \"@splunk/react-ui/Tooltip\";\nexport * from \"@splunk/react-ui/Tooltip\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import React from 'react';\nimport type SVG from '@splunk/react-icons/SVG';\nimport DropdownIcon from '@splunk/react-icons/CaretDown';\nimport ScreenReaderContent from '@splunk/react-ui/ScreenReaderContent';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport Tooltip from '@splunk/react-ui/Tooltip';\nimport styled from 'styled-components';\nimport ToolbarItem from './Item';\nimport type { ToolbarButtonProps } from './types/common';\n\nconst StyledDropdownIcon = styled(DropdownIcon)`\n margin-left: -5px;\n`;\n\nexport const iconSize = 24;\nexport const menuIconSize = 20;\n\ninterface PrepareIconProps extends React.ComponentProps<typeof SVG> {\n Icon: React.ComponentType<React.ComponentProps<typeof SVG>>;\n screenReaderContent?: string;\n isMenu?: boolean;\n variant?: 'filled' | 'outline' | 'none';\n}\n\n/**\n * Button adds a bunch of padding when there's any child elements even if they don't display anything (screenReaderContent)\n * This bundles the primary icon, a menu caret and screenReaderContent as an icon when needed.\n * Additionally accepts any properties of any react-icons element to be applied to primary icon\n * @param {Object} arg\n * @param {React.ElementType} arg.Icon The primary icon\n * @param {boolean} [arg.isMenu=false] Display a menu caret\n * @param {string} [arg.screenReaderContent] A label for the icon\n * @param {string} [arg.variant] Fill the icon, or not\n * @returns {JSX.Element}\n */\nexport const prepareIcon = ({\n Icon,\n screenReaderContent,\n isMenu = false,\n ...props\n}: PrepareIconProps) => {\n const size = isMenu ? menuIconSize : iconSize;\n return (\n <>\n <Icon width={size} height={size} {...props} />\n {isMenu && (\n <StyledDropdownIcon variant=\"filled\" width={9} height={size} />\n )}\n {screenReaderContent && (\n <ScreenReaderContent>{screenReaderContent}</ScreenReaderContent>\n )}\n </>\n );\n};\n\nexport interface IconButtonProps extends ToolbarButtonProps {\n icon?: JSX.Element;\n onClick?: ButtonPropsBase['onClick'];\n label?: string;\n tooltipContent?: string;\n buttonRef?: React.RefObject<HTMLButtonElement>;\n testLabel?: string;\n disabled?: boolean;\n}\n\nconst IconButton = ({\n icon,\n buttonRef,\n disabled = false,\n onClick,\n label,\n tooltipContent,\n testLabel,\n ...rest\n}: IconButtonProps): JSX.Element => {\n const button = (\n <Button\n elementRef={buttonRef}\n onClick={onClick}\n disabled={disabled}\n appearance=\"subtle\"\n icon={icon}\n label={label}\n data-test={testLabel}\n data-clickable\n />\n );\n\n return (\n <ToolbarItem {...rest}>\n {tooltipContent ? (\n <Tooltip contentRelationship=\"label\" content={tooltipContent}>\n {button}\n </Tooltip>\n ) : (\n button\n )}\n </ToolbarItem>\n );\n};\n\nexport default IconButton;\n", "import React from 'react';\nimport Button, { type ButtonPropsBase } from '@splunk/react-ui/Button';\nimport Tooltip from '@splunk/react-ui/Tooltip';\nimport styled from 'styled-components';\n\nconst BaseDropdownButton = styled(Button)`\n max-width: '50px';\n`;\n\nexport interface StyledDropdownButtonProps\n extends Pick<ButtonPropsBase, 'appearance' | 'icon' | 'disabled'> {\n children?: React.ReactNode;\n className?: string;\n 'data-clickable'?: boolean;\n 'data-test'?: string;\n tooltipContent?: string;\n}\n\nexport const StyledDropdownButton = React.forwardRef<\n HTMLButtonElement,\n StyledDropdownButtonProps\n>(({ tooltipContent, ...props }, ref): JSX.Element => {\n const button = (\n <BaseDropdownButton\n {...props}\n elementRef={ref as React.RefObject<HTMLButtonElement>}\n />\n );\n\n return tooltipContent ? (\n <Tooltip contentRelationship=\"label\" content={tooltipContent}>\n {button}\n </Tooltip>\n ) : (\n button\n );\n});\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport"]
|
|
7
7
|
}
|