@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,aAAiB,CAAA;AAAA,EAC/B,KAAA;AAAA,EACA,WAAc,GAAA,EAAA;AAAA,EACd,UAAU,EAAC;AAAA,EACX,QAAA;AAAA,EACA,cAAA;AAAA,EACA,WAAc,GAAA,KAAA,CAAA;AAAA,EACd,KAAO,EAAA,WAAA;AAAA,EACP,gBAAmB,GAAA,EAAA;AAAA,EACnB,gBAAmB,GAAA,KAAA;AAAA,EACnB,eAAkB,GAAA,KAAA;AAAA,EAClB,GAAG;AACL,CAAsC,EAAA;AACpC,EAAM,MAAA,GAAA,GAAM,OAAuB,IAAI,CAAA;AACvC,EAAA,MAAM,QAAQ,SAAU,EAAA;AAExB,EAAA,IAAI,QAAQ,WAAc,GAAA,CAAA,GAAI,WAAc,GAAA,KAAA,CAAM,QAAQ,QAAW,GAAA,KAAA,CAAA;AAErE,EAAI,IAAA,SAAA;AACJ,EAAA,IAAI,eAAe,EAAC;AACpB,EAAA,IAAI,WAAa,EAAA;AACf,IAAY,SAAA,GAAA,WAAA;AACZ,IAAe,YAAA,GAAA,EAAE,WAAa,EAAA,cAAA,EAAgB,IAAK,EAAA;AAAA,GAC9C,MAAA;AACL,IAAY,SAAA,GAAA,MAAA;AAAA;AAGd,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA,EAAK,GAAG,IAAA,EAAM,GACb,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,gBAAA;AAAA,MACA,WAAA;AAAA,MACA,SAAW,EAAA,IAAA;AAAA,MACX,MAAQ,EAAA,IAAA;AAAA,MACR,QAAA;AAAA,MACA,OAAA;AAAA,MACA,KAAA;AAAA,MAIA,iBAAmB,EAAA,KAAA;AAAA,MACnB,aAAa,MAAM;AACjB,QAAI,IAAA,GAAA,IAAO,IAAI,OAAS,EAAA;AAGtB,UAAA,MAAM,KAAQ,GAAA,GAAA,CAAI,OAAQ,CAAA,aAAA,CAAgC,4BAA4B,CAAA;AACtF,UAAI,IAAA,KAAA,KAAU,KAAM,CAAA,KAAA,IAAS,eAAkB,CAAA,EAAA;AAC7C,YAAA,QAAA,CAAS,EAAE,KAAO,EAAA,KAAA,CAAM,OAAY,KAAO,EAAA,KAAA,CAAM,OAAO,CAAA;AAAA,WACnD,MAAA;AACL,YAAe,cAAA,EAAA;AAAA;AACjB;AACF,OACF;AAAA,MACA,gBAAA;AAAA,MACC,GAAG;AAAA;AAAA,GAER,EAAA,CAAA;AAEJ;;;;"}