@grafana/ui/dist/esm/components/Forms/Legacy/Select/SelectOptionGroup.mjs.map

Grafana Components Library

{"version":3,"file":"SelectOptionGroup.mjs","sources":["../../../../../../src/components/Forms/Legacy/Select/SelectOptionGroup.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { PureComponent } from 'react';\nimport { GroupProps } from 'react-select';\n\nimport { GrafanaTheme2 } from '@grafana/data';\n\nimport { withTheme2 } from '../../../../themes/ThemeContext';\nimport { stylesFactory } from '../../../../themes/stylesFactory';\nimport { Themeable2 } from '../../../../types/theme';\nimport { Icon } from '../../../Icon/Icon';\n\ninterface ExtendedGroupProps extends Omit<GroupProps<any, any>, 'theme'>, Themeable2 {\n  data: {\n    label: string;\n    expanded: boolean;\n    options: any[];\n  };\n}\n\ninterface State {\n  expanded: boolean;\n}\n\nconst getSelectOptionGroupStyles = stylesFactory((theme: GrafanaTheme2) => {\n  return {\n    header: css({\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'flex-start',\n      justifyItems: 'center',\n      cursor: 'pointer',\n      padding: '7px 10px',\n      width: '100%',\n      borderBottom: `1px solid ${theme.colors.background.secondary}`,\n\n      '&:hover': {\n        color: theme.colors.text.maxContrast,\n      },\n    }),\n    label: css({\n      flexGrow: 1,\n    }),\n    icon: css({\n      paddingRight: '2px',\n    }),\n  };\n});\n\nclass UnthemedSelectOptionGroup extends PureComponent<ExtendedGroupProps, State> {\n  state = {\n    expanded: false,\n  };\n\n  componentDidMount() {\n    if (this.props.data.expanded) {\n      this.setState({ expanded: true });\n    } else if (this.props.selectProps && this.props.selectProps.value) {\n      const { value } = this.props.selectProps.value;\n\n      if (value && this.props.options.some((option) => option.value === value)) {\n        this.setState({ expanded: true });\n      }\n    }\n  }\n\n  componentDidUpdate(nextProps: ExtendedGroupProps) {\n    if (nextProps.selectProps.inputValue !== '') {\n      this.setState({ expanded: true });\n    }\n  }\n\n  onToggleChildren = () => {\n    this.setState((prevState) => ({\n      expanded: !prevState.expanded,\n    }));\n  };\n\n  render() {\n    const { children, label, theme } = this.props;\n    const { expanded } = this.state;\n    const styles = getSelectOptionGroupStyles(theme);\n\n    return (\n      <div>\n        {/*React Select doesn't support focusable option group headers, this will be skipped when using\n      the keyboard */}\n        <div className={styles.header} onClick={this.onToggleChildren} role=\"presentation\">\n          <span className={styles.label}>{label}</span>\n          <Icon className={styles.icon} name={expanded ? 'angle-up' : 'angle-down'} />\n        </div>\n        {expanded && children}\n      </div>\n    );\n  }\n}\n\nexport const SelectOptionGroup = withTheme2(UnthemedSelectOptionGroup);\n"],"names":[],"mappings":"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"}