@grafana/ui/dist/esm/components/Combobox/getMultiComboboxStyles.mjs.map

Grafana Components Library

{"version":3,"file":"getMultiComboboxStyles.mjs","sources":["../../../../src/components/Combobox/getMultiComboboxStyles.ts"],"sourcesContent":["import { css, cx } from '@emotion/css';\n\nimport { type GrafanaTheme2 } from '@grafana/data';\n\nimport { getFocusStyles } from '../../themes/mixins';\nimport { getInputStyles } from '../Input/Input';\n\nexport const getMultiComboboxStyles = (\n  theme: GrafanaTheme2,\n  isOpen: boolean,\n  invalid?: boolean,\n  disabled?: boolean,\n  width?: number | 'auto',\n  minWidth?: number,\n  maxWidth?: number,\n  isClearable?: boolean\n) => {\n  const inputStyles = getInputStyles({ theme, invalid });\n  const focusStyles = getFocusStyles(theme);\n\n  const wrapperWidth = width && width !== 'auto' ? theme.spacing(width) : '100%';\n  const wrapperMinWidth = minWidth ? theme.spacing(minWidth) : '';\n  const wrapperMaxWidth = maxWidth ? theme.spacing(maxWidth) : '';\n\n  return {\n    container: css({\n      width: width === 'auto' ? 'auto' : wrapperWidth,\n      minWidth: wrapperMinWidth,\n      maxWidth: wrapperMaxWidth,\n      display: width === 'auto' ? 'inline-block' : 'block',\n    }), // wraps everything\n    wrapper: cx(\n      inputStyles.input,\n      css({\n        display: 'flex',\n        alignItems: 'center',\n        width: '100%',\n        gap: theme.spacing(0.5),\n        padding: theme.spacing(0.5),\n        paddingRight: isClearable ? theme.spacing(5) : 28, // Account for suffix\n        '&:focus-within': {\n          ...focusStyles,\n        },\n      })\n    ),\n    input: css({\n      border: 'none',\n      outline: 'none',\n      background: 'transparent',\n      flexGrow: 1,\n      height: '100%',\n      maxWidth: '100%',\n      minWidth: 20, // This is a bit arbitrary, but is used to leave some space for clicking. This will override the minWidth property\n      '&::placeholder': {\n        color: theme.colors.text.disabled,\n      },\n      '&:focus': {\n        outline: 'none',\n        cursor: 'text',\n      },\n      cursor: 'pointer',\n    }),\n\n    pillWrapper: css({\n      display: 'inline-flex',\n      alignItems: 'center',\n      flexWrap: isOpen ? 'wrap' : 'nowrap',\n      flexGrow: 1,\n      minWidth: '50px',\n      gap: theme.spacing(0.5),\n    }),\n    restNumber: css({\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      padding: theme.spacing(0, 1),\n      border: disabled ? `1px solid ${theme.colors.border.weak}` : 'none',\n      borderRadius: theme.shape.radius.default,\n      backgroundColor: theme.colors.background.secondary,\n      cursor: 'pointer',\n      '&:hover': {\n        backgroundColor: theme.colors.action.hover,\n      },\n    }),\n    suffix: inputStyles.suffix,\n    disabled: inputStyles.inputDisabled,\n  };\n};\n"],"names":[],"mappings":"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"}