@grafana/ui/dist/esm/components/UnitPicker/UnitPicker.mjs.map

Grafana Components Library

{"version":3,"file":"UnitPicker.mjs","sources":["../../../../src/components/UnitPicker/UnitPicker.tsx"],"sourcesContent":["import { PureComponent } from 'react';\n\nimport { getValueFormats, SelectableValue } from '@grafana/data';\nimport { t } from '@grafana/i18n';\n\nimport { Cascader, CascaderOption } from '../Cascader/Cascader';\n\nexport interface UnitPickerProps {\n  onChange: (item?: string) => void;\n  value?: string;\n  width?: number;\n  id?: string;\n}\n\nfunction formatCreateLabel(input: string) {\n  return `Custom unit: ${input}`;\n}\n\n/**\n * https://developers.grafana.com/ui/latest/index.html?path=/docs/pickers-unitpicker--docs\n */\nexport class UnitPicker extends PureComponent<UnitPickerProps> {\n  onChange = (value: SelectableValue<string>) => {\n    this.props.onChange(value.value);\n  };\n\n  render() {\n    const { value, width, id } = this.props;\n\n    // Set the current selection\n    let current: SelectableValue<string> | undefined = undefined;\n\n    // All units\n    const unitGroups = getValueFormats();\n\n    // Need to transform the data structure to work well with Select\n    const groupOptions: CascaderOption[] = unitGroups.map((group) => {\n      const options = group.submenu.map((unit) => {\n        const sel = {\n          label: unit.text,\n          value: unit.value,\n        };\n        if (unit.value === value) {\n          current = sel;\n        }\n        return sel;\n      });\n\n      return {\n        label: group.text,\n        value: group.text,\n        items: options,\n      };\n    });\n\n    // Show the custom unit\n    if (value && !current) {\n      current = { value, label: value };\n    }\n\n    return (\n      <Cascader\n        id={id}\n        width={width}\n        initialValue={current && current.label}\n        allowCustomValue\n        changeOnSelect={false}\n        formatCreateLabel={formatCreateLabel}\n        options={groupOptions}\n        placeholder={t('grafana-ui.unit-picker.placeholder', 'Choose')}\n        isClearable\n        onSelect={this.props.onChange}\n      />\n    );\n  }\n}\n"],"names":[],"mappings":";;;;;;;AAcA,SAAS,kBAAkB,KAAA,EAAe;AACxC,EAAA,OAAO,gBAAgB,KAAK,CAAA,CAAA;AAC9B;AAKO,MAAM,mBAAmB,aAAA,CAA+B;AAAA,EAAxD,WAAA,GAAA;AAAA,IAAA,KAAA,CAAA,GAAA,SAAA,CAAA;AACL,IAAA,IAAA,CAAA,QAAA,GAAW,CAAC,KAAA,KAAmC;AAC7C,MAAA,IAAA,CAAK,KAAA,CAAM,QAAA,CAAS,KAAA,CAAM,KAAK,CAAA;AAAA,IACjC,CAAA;AAAA,EAAA;AAAA,EAEA,MAAA,GAAS;AACP,IAAA,MAAM,EAAE,KAAA,EAAO,KAAA,EAAO,EAAA,KAAO,IAAA,CAAK,KAAA;AAGlC,IAAA,IAAI,OAAA,GAA+C,KAAA,CAAA;AAGnD,IAAA,MAAM,aAAa,eAAA,EAAgB;AAGnC,IAAA,MAAM,YAAA,GAAiC,UAAA,CAAW,GAAA,CAAI,CAAC,KAAA,KAAU;AAC/D,MAAA,MAAM,OAAA,GAAU,KAAA,CAAM,OAAA,CAAQ,GAAA,CAAI,CAAC,IAAA,KAAS;AAC1C,QAAA,MAAM,GAAA,GAAM;AAAA,UACV,OAAO,IAAA,CAAK,IAAA;AAAA,UACZ,OAAO,IAAA,CAAK;AAAA,SACd;AACA,QAAA,IAAI,IAAA,CAAK,UAAU,KAAA,EAAO;AACxB,UAAA,OAAA,GAAU,GAAA;AAAA,QACZ;AACA,QAAA,OAAO,GAAA;AAAA,MACT,CAAC,CAAA;AAED,MAAA,OAAO;AAAA,QACL,OAAO,KAAA,CAAM,IAAA;AAAA,QACb,OAAO,KAAA,CAAM,IAAA;AAAA,QACb,KAAA,EAAO;AAAA,OACT;AAAA,IACF,CAAC,CAAA;AAGD,IAAA,IAAI,KAAA,IAAS,CAAC,OAAA,EAAS;AACrB,MAAA,OAAA,GAAU,EAAE,KAAA,EAAO,KAAA,EAAO,KAAA,EAAM;AAAA,IAClC;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,KAAA;AAAA,QACA,YAAA,EAAc,WAAW,OAAA,CAAQ,KAAA;AAAA,QACjC,gBAAA,EAAgB,IAAA;AAAA,QAChB,cAAA,EAAgB,KAAA;AAAA,QAChB,iBAAA;AAAA,QACA,OAAA,EAAS,YAAA;AAAA,QACT,WAAA,EAAa,CAAA,CAAE,oCAAA,EAAsC,QAAQ,CAAA;AAAA,QAC7D,WAAA,EAAW,IAAA;AAAA,QACX,QAAA,EAAU,KAAK,KAAA,CAAM;AAAA;AAAA,KACvB;AAAA,EAEJ;AACF;;;;"}