@grafana/ui/dist/esm/components/Segment/SegmentSelect.mjs.map

Grafana Components Library

{"version":3,"file":"SegmentSelect.mjs","sources":["../../../../src/components/Segment/SegmentSelect.tsx"],"sourcesContent":["import { HTMLProps, useRef } from 'react';\nimport * as React from 'react';\n\nimport { SelectableValue } from '@grafana/data';\n\nimport { useTheme2 } from '../../themes/ThemeContext';\nimport { AsyncSelect, Select } from '../Select/Select';\n\n/** @internal\n * Should be used only internally by Segment/SegmentAsync which can guarantee that SegmentSelect is hidden\n * when a value is selected. See comment below on closeMenuOnSelect()\n */\nexport interface Props<T> extends Omit<HTMLProps<HTMLDivElement>, 'value' | 'onChange'> {\n  value?: T | SelectableValue<T>;\n  options: Array<SelectableValue<T>>;\n  onChange: (item: SelectableValue<T>) => void;\n  /**\n   * If provided - AsyncSelect will be used allowing to reload options when the value in the input changes\n   */\n  loadOptions?: (inputValue: string) => Promise<Array<SelectableValue<T>>>;\n  onClickOutside: () => void;\n  width: number;\n  noOptionsMessage?: string;\n  allowCustomValue?: boolean;\n  /**\n   * If true, empty value will be passed to onChange callback otherwise using empty value\n   * will work as canceling and using the previous value\n   */\n  allowEmptyValue?: boolean;\n  placeholder?: string;\n}\n\n/** @internal */\nexport function SegmentSelect<T>({\n  value,\n  placeholder = '',\n  options = [],\n  onChange,\n  onClickOutside,\n  loadOptions = undefined,\n  width: widthPixels,\n  noOptionsMessage = '',\n  allowCustomValue = false,\n  allowEmptyValue = false,\n  ...rest\n}: React.PropsWithChildren<Props<T>>) {\n  const ref = useRef<HTMLDivElement>(null);\n  const theme = useTheme2();\n\n  let width = widthPixels > 0 ? widthPixels / theme.spacing.gridSize : undefined;\n\n  let Component;\n  let asyncOptions = {};\n  if (loadOptions) {\n    Component = AsyncSelect;\n    asyncOptions = { loadOptions, defaultOptions: true };\n  } else {\n    Component = Select;\n  }\n\n  return (\n    <div {...rest} ref={ref}>\n      <Component\n        width={width}\n        noOptionsMessage={noOptionsMessage}\n        placeholder={placeholder}\n        autoFocus={true}\n        isOpen={true}\n        onChange={onChange}\n        options={options}\n        value={value}\n        // Disable \"close menu on select\" option to avoid calling onChange() in onCloseMenu() when a value is selected.\n        // Once the value is selected the Select component (with the menu) will be hidden anyway by the parent component:\n        // Segment or SegmentAsync - hence setting this option has no UX effect.\n        closeMenuOnSelect={false}\n        onCloseMenu={() => {\n          if (ref && ref.current) {\n            // https://github.com/JedWatson/react-select/issues/188#issuecomment-279240292\n            // Unfortunately there's no other way of retrieving the value (not yet) created new option\n            const input = ref.current.querySelector<HTMLInputElement>('input[id^=\"react-select-\"]');\n            if (input && (input.value || allowEmptyValue)) {\n              onChange({ value: input.value as T, label: input.value });\n            } else {\n              onClickOutside();\n            }\n          }\n        }}\n        allowCustomValue={allowCustomValue}\n        {...asyncOptions}\n      />\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAiCO,SAAS,aAAA,CAAiB;AAAA,EAC/B,KAAA;AAAA,EACA,WAAA,GAAc,EAAA;AAAA,EACd,UAAU,EAAC;AAAA,EACX,QAAA;AAAA,EACA,cAAA;AAAA,EACA,WAAA,GAAc,KAAA,CAAA;AAAA,EACd,KAAA,EAAO,WAAA;AAAA,EACP,gBAAA,GAAmB,EAAA;AAAA,EACnB,gBAAA,GAAmB,KAAA;AAAA,EACnB,eAAA,GAAkB,KAAA;AAAA,EAClB,GAAG;AACL,CAAA,EAAsC;AACpC,EAAA,MAAM,GAAA,GAAM,OAAuB,IAAI,CAAA;AACvC,EAAA,MAAM,QAAQ,SAAA,EAAU;AAExB,EAAA,IAAI,QAAQ,WAAA,GAAc,CAAA,GAAI,WAAA,GAAc,KAAA,CAAM,QAAQ,QAAA,GAAW,KAAA,CAAA;AAErE,EAAA,IAAI,SAAA;AACJ,EAAA,IAAI,eAAe,EAAC;AACpB,EAAA,IAAI,WAAA,EAAa;AACf,IAAA,SAAA,GAAY,WAAA;AACZ,IAAA,YAAA,GAAe,EAAE,WAAA,EAAa,cAAA,EAAgB,IAAA,EAAK;AAAA,EACrD,CAAA,MAAO;AACL,IAAA,SAAA,GAAY,MAAA;AAAA,EACd;AAEA,EAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAK,GAAG,IAAA,EAAM,GAAA,EACb,QAAA,kBAAA,GAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,gBAAA;AAAA,MACA,WAAA;AAAA,MACA,SAAA,EAAW,IAAA;AAAA,MACX,MAAA,EAAQ,IAAA;AAAA,MACR,QAAA;AAAA,MACA,OAAA;AAAA,MACA,KAAA;AAAA,MAIA,iBAAA,EAAmB,KAAA;AAAA,MACnB,aAAa,MAAM;AACjB,QAAA,IAAI,GAAA,IAAO,IAAI,OAAA,EAAS;AAGtB,UAAA,MAAM,KAAA,GAAQ,GAAA,CAAI,OAAA,CAAQ,aAAA,CAAgC,4BAA4B,CAAA;AACtF,UAAA,IAAI,KAAA,KAAU,KAAA,CAAM,KAAA,IAAS,eAAA,CAAA,EAAkB;AAC7C,YAAA,QAAA,CAAS,EAAE,KAAA,EAAO,KAAA,CAAM,OAAY,KAAA,EAAO,KAAA,CAAM,OAAO,CAAA;AAAA,UAC1D,CAAA,MAAO;AACL,YAAA,cAAA,EAAe;AAAA,UACjB;AAAA,QACF;AAAA,MACF,CAAA;AAAA,MACA,gBAAA;AAAA,MACC,GAAG;AAAA;AAAA,GACN,EACF,CAAA;AAEJ;;;;"}