{"version":3,"file":"TypeaheadItem.mjs","sources":["../../../../src/components/Typeahead/TypeaheadItem.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport * as React from 'react';\nimport Highlighter from 'react-highlight-words';\n\nimport { GrafanaTheme2 } from '@grafana/data';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { CompletionItem, CompletionItemKind } from '../../types/completion';\n\nimport { PartialHighlighter } from './PartialHighlighter';\n\ninterface Props {\n  isSelected: boolean;\n  item: CompletionItem;\n  style: React.CSSProperties;\n  prefix?: string;\n\n  onClickItem?: (event: React.MouseEvent) => void;\n  onMouseEnter?: () => void;\n  onMouseLeave?: () => void;\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  typeaheadItem: css({\n    border: 'none',\n    background: 'none',\n    textAlign: 'left',\n    label: 'type-ahead-item',\n    height: 'auto',\n    fontFamily: theme.typography.fontFamilyMonospace,\n    padding: theme.spacing(1, 1, 1, 2),\n    fontSize: theme.typography.bodySmall.fontSize,\n    textOverflow: 'ellipsis',\n    overflow: 'hidden',\n    zIndex: 11,\n    display: 'block',\n    whiteSpace: 'nowrap',\n    cursor: 'pointer',\n    [theme.transitions.handleMotion('no-preference', 'reduce')]: {\n      transition:\n        'color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.15s cubic-bezier(0.645, 0.045, 0.355, 1)',\n    },\n  }),\n\n  typeaheadItemSelected: css({\n    label: 'type-ahead-item-selected',\n    backgroundColor: theme.colors.background.secondary,\n  }),\n\n  typeaheadItemMatch: css({\n    label: 'type-ahead-item-match',\n    color: theme.v1.palette.yellow,\n    borderBottom: `1px solid ${theme.v1.palette.yellow}`,\n    padding: 'inherit',\n    background: 'inherit',\n  }),\n\n  typeaheadItemGroupTitle: css({\n    label: 'type-ahead-item-group-title',\n    color: theme.colors.text.secondary,\n    fontSize: theme.typography.bodySmall.fontSize,\n    lineHeight: theme.typography.body.lineHeight,\n    padding: theme.spacing(1),\n  }),\n});\n\nexport const TypeaheadItem = (props: Props) => {\n  const styles = useStyles2(getStyles);\n\n  const { isSelected, item, prefix, style, onMouseEnter, onMouseLeave, onClickItem } = props;\n  const className = isSelected ? cx([styles.typeaheadItem, styles.typeaheadItemSelected]) : cx([styles.typeaheadItem]);\n  const highlightClassName = cx([styles.typeaheadItemMatch]);\n  const itemGroupTitleClassName = cx([styles.typeaheadItemGroupTitle]);\n  const label = item.label || '';\n\n  if (item.kind === CompletionItemKind.GroupTitle) {\n    return (\n      <li className={itemGroupTitleClassName} style={style}>\n        <span>{label}</span>\n      </li>\n    );\n  }\n\n  return (\n    <li role=\"none\">\n      <button\n        role=\"menuitem\"\n        className={className}\n        style={style}\n        onMouseDown={onClickItem}\n        onMouseEnter={onMouseEnter}\n        onMouseLeave={onMouseLeave}\n        type=\"button\"\n      >\n        {item.highlightParts !== undefined ? (\n          <PartialHighlighter\n            text={label}\n            highlightClassName={highlightClassName}\n            highlightParts={item.highlightParts}\n          ></PartialHighlighter>\n        ) : (\n          <Highlighter\n            textToHighlight={label}\n            searchWords={[prefix ?? '']}\n            autoEscape={true}\n            highlightClassName={highlightClassName}\n          />\n        )}\n      </button>\n    </li>\n  );\n};\n"],"names":[],"mappings":"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"}