@grafana/ui/dist/esm/components/VizTooltip/VizTooltipFooter.mjs.map

Grafana Components Library

{"version":3,"file":"VizTooltipFooter.mjs","sources":["../../../../src/components/VizTooltip/VizTooltipFooter.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { useMemo } from 'react';\n\nimport { ActionModel, Field, GrafanaTheme2, LinkModel, ThemeSpacingTokens } from '@grafana/data';\nimport { Trans } from '@grafana/i18n';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { ActionButton } from '../Actions/ActionButton';\nimport { Button } from '../Button/Button';\nimport { DataLinkButton } from '../DataLinks/DataLinkButton';\nimport { Icon } from '../Icon/Icon';\nimport { Stack } from '../Layout/Stack/Stack';\nimport { ResponsiveProp } from '../Layout/utils/responsiveness';\n\ninterface VizTooltipFooterProps {\n  dataLinks: Array<LinkModel<Field>>;\n  actions?: Array<ActionModel<Field>>;\n  annotate?: () => void;\n}\n\nexport const ADD_ANNOTATION_ID = 'add-annotation-button';\n\ntype RenderOneClickTrans = (title: string) => React.ReactNode;\ntype RenderItem<T extends LinkModel | ActionModel> = (\n  item: T,\n  idx: number,\n  styles: ReturnType<typeof getStyles>\n) => React.ReactNode;\n\nfunction makeRenderLinksOrActions<T extends LinkModel | ActionModel>(\n  renderOneClickTrans: RenderOneClickTrans,\n  renderItem: RenderItem<T>,\n  itemGap?: ResponsiveProp<ThemeSpacingTokens>\n) {\n  const renderLinksOrActions = (items: T[], styles: ReturnType<typeof getStyles>) => {\n    if (items.length === 0) {\n      return;\n    }\n\n    const oneClickItem = items.find((item) => item.oneClick === true);\n\n    if (oneClickItem != null) {\n      return (\n        <div className={styles.dataLinks}>\n          <Stack direction=\"column\" justifyContent=\"flex-start\" gap={0.5}>\n            <span className={styles.oneClickWrapper}>\n              <Icon name=\"info-circle\" size=\"lg\" className={styles.infoIcon} />\n              {renderOneClickTrans(oneClickItem.title)}\n            </span>\n          </Stack>\n        </div>\n      );\n    }\n\n    return (\n      <div className={styles.dataLinks}>\n        <Stack direction=\"column\" justifyContent=\"flex-start\" gap={itemGap}>\n          {items.map((item, i) => renderItem(item, i, styles))}\n        </Stack>\n      </div>\n    );\n  };\n\n  return renderLinksOrActions;\n}\n\nconst renderDataLinks = makeRenderLinksOrActions<LinkModel>(\n  (title) => (\n    <Trans i18nKey=\"grafana-ui.viz-tooltip.footer-click-to-navigate\">Click to open {{ linkTitle: title }}</Trans>\n  ),\n  (item, i, styles) => (\n    <DataLinkButton link={item} key={i} buttonProps={{ className: styles.dataLinkButton, fill: 'text' }} />\n  ),\n  0.5\n);\n\nconst renderActions = makeRenderLinksOrActions<ActionModel>(\n  (title) => <Trans i18nKey=\"grafana-ui.viz-tooltip.footer-click-to-action\">Click to {{ actionTitle: title }}</Trans>,\n  (item, i) => <ActionButton key={i} action={item} variant=\"secondary\" />\n);\n\nexport const VizTooltipFooter = ({ dataLinks, actions = [], annotate }: VizTooltipFooterProps) => {\n  const styles = useStyles2(getStyles);\n  const hasOneClickLink = useMemo(() => dataLinks.some((link) => link.oneClick === true), [dataLinks]);\n  const hasOneClickAction = useMemo(() => actions.some((action) => action.oneClick === true), [actions]);\n\n  return (\n    <div className={styles.wrapper}>\n      {!hasOneClickAction && renderDataLinks(dataLinks, styles)}\n      {!hasOneClickLink && renderActions(actions, styles)}\n      {!hasOneClickLink && !hasOneClickAction && annotate != null && (\n        <div className={styles.addAnnotations}>\n          <Button icon=\"comment-alt\" variant=\"secondary\" size=\"sm\" id={ADD_ANNOTATION_ID} onClick={annotate}>\n            <Trans i18nKey=\"grafana-ui.viz-tooltip.footer-add-annotation\">Add annotation</Trans>\n          </Button>\n        </div>\n      )}\n    </div>\n  );\n};\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  wrapper: css({\n    display: 'flex',\n    flexDirection: 'column',\n    flex: 1,\n    padding: theme.spacing(0),\n  }),\n  dataLinks: css({\n    borderTop: `1px solid ${theme.colors.border.medium}`,\n    padding: theme.spacing(1),\n  }),\n  addAnnotations: css({\n    borderTop: `1px solid ${theme.colors.border.medium}`,\n    padding: theme.spacing(1),\n  }),\n  dataLinkButton: css({\n    cursor: 'pointer',\n    '&:hover': {\n      textDecoration: 'underline',\n      background: 'none',\n    },\n    padding: 0,\n    height: 'auto',\n    '& span': {\n      whiteSpace: 'normal',\n      textAlign: 'left',\n    },\n  }),\n  oneClickWrapper: css({\n    display: 'flex',\n    alignItems: 'center',\n  }),\n  infoIcon: css({\n    color: theme.colors.primary.main,\n    paddingRight: theme.spacing(0.5),\n  }),\n});\n"],"names":[],"mappings":"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"}