@grafana/ui/dist/esm/components/DateTimePickers/TimeRangePicker/TimeRangeList.mjs.map

Grafana Components Library

{"version":3,"file":"TimeRangeList.mjs","sources":["../../../../../src/components/DateTimePickers/TimeRangePicker/TimeRangeList.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { useRef, ReactNode } from 'react';\n\nimport { GrafanaTheme2, TimeOption } from '@grafana/data';\nimport { t } from '@grafana/i18n';\n\nimport { useStyles2 } from '../../../themes/ThemeContext';\n\nimport { TimePickerTitle } from './TimePickerTitle';\nimport { TimeRangeOption } from './TimeRangeOption';\nimport { useListFocus } from './hooks';\n\ninterface Props {\n  title?: string;\n  options: TimeOption[];\n  value?: TimeOption;\n  onChange: (option: TimeOption) => void;\n  placeholderEmpty?: ReactNode;\n}\n\nexport const TimeRangeList = (props: Props) => {\n  const styles = useStyles2(getStyles);\n  const { title, options, placeholderEmpty } = props;\n\n  if (typeof placeholderEmpty !== 'undefined' && options.length <= 0) {\n    return <>{placeholderEmpty}</>;\n  }\n\n  if (!title) {\n    return <Options {...props} />;\n  }\n\n  return (\n    <section aria-label={title}>\n      <fieldset>\n        <div className={styles.title}>\n          <TimePickerTitle>{title}</TimePickerTitle>\n        </div>\n        <Options {...props} />\n      </fieldset>\n    </section>\n  );\n};\n\nconst Options = ({ options, value, onChange, title }: Props) => {\n  const styles = useStyles2(getOptionsStyles);\n\n  const localRef = useRef<HTMLUListElement>(null);\n  const [handleKeys] = useListFocus({ localRef, options });\n\n  return (\n    <>\n      <ul\n        role=\"presentation\"\n        onKeyDown={handleKeys}\n        ref={localRef}\n        aria-roledescription={t('time-picker.time-range.aria-role', 'Time range selection')}\n        className={styles.list}\n      >\n        {options.map((option, index) => (\n          <TimeRangeOption\n            key={keyForOption(option, index)}\n            value={option}\n            selected={isEqual(option, value)}\n            onSelect={onChange}\n            name={title ?? t('time-picker.time-range.default-title', 'Time ranges')}\n          />\n        ))}\n      </ul>\n    </>\n  );\n};\n\nfunction keyForOption(option: TimeOption, index: number): string {\n  return `${option.from}-${option.to}-${index}`;\n}\n\nfunction isEqual(x: TimeOption, y?: TimeOption): boolean {\n  if (!y || !x) {\n    return false;\n  }\n  return y.from === x.from && y.to === x.to;\n}\n\nconst getStyles = () => ({\n  title: css({\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    padding: '8px 16px 5px 9px',\n  }),\n});\n\nconst getOptionsStyles = (theme: GrafanaTheme2) => ({\n  list: css({\n    padding: theme.spacing(0.5),\n  }),\n});\n"],"names":[],"mappings":";;;;;;;;;AAoBa,MAAA,aAAA,GAAgB,CAAC,KAAiB,KAAA;AAC7C,EAAM,MAAA,MAAA,GAAS,WAAW,SAAS,CAAA;AACnC,EAAA,MAAM,EAAE,KAAA,EAAO,OAAS,EAAA,gBAAA,EAAqB,GAAA,KAAA;AAE7C,EAAA,IAAI,OAAO,gBAAA,KAAqB,WAAe,IAAA,OAAA,CAAQ,UAAU,CAAG,EAAA;AAClE,IAAA,uCAAU,QAAiB,EAAA,gBAAA,EAAA,CAAA;AAAA;AAG7B,EAAA,IAAI,CAAC,KAAO,EAAA;AACV,IAAO,uBAAA,GAAA,CAAC,OAAS,EAAA,EAAA,GAAG,KAAO,EAAA,CAAA;AAAA;AAG7B,EAAA,uBACG,GAAA,CAAA,SAAA,EAAA,EAAQ,YAAY,EAAA,KAAA,EACnB,+BAAC,UACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,SAAI,SAAW,EAAA,MAAA,CAAO,OACrB,QAAC,kBAAA,GAAA,CAAA,eAAA,EAAA,EAAiB,iBAAM,CAC1B,EAAA,CAAA;AAAA,oBACA,GAAA,CAAC,OAAS,EAAA,EAAA,GAAG,KAAO,EAAA;AAAA,GAAA,EACtB,CACF,EAAA,CAAA;AAEJ;AAEA,MAAM,UAAU,CAAC,EAAE,SAAS,KAAO,EAAA,QAAA,EAAU,OAAmB,KAAA;AAC9D,EAAM,MAAA,MAAA,GAAS,WAAW,gBAAgB,CAAA;AAE1C,EAAM,MAAA,QAAA,GAAW,OAAyB,IAAI,CAAA;AAC9C,EAAA,MAAM,CAAC,UAAU,CAAA,GAAI,aAAa,EAAE,QAAA,EAAU,SAAS,CAAA;AAEvD,EAAA,uBAEI,GAAA,CAAA,QAAA,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,IAAK,EAAA,cAAA;AAAA,MACL,SAAW,EAAA,UAAA;AAAA,MACX,GAAK,EAAA,QAAA;AAAA,MACL,sBAAA,EAAsB,CAAE,CAAA,kCAAA,EAAoC,sBAAsB,CAAA;AAAA,MAClF,WAAW,MAAO,CAAA,IAAA;AAAA,MAEjB,QAAQ,EAAA,OAAA,CAAA,GAAA,CAAI,CAAC,MAAA,EAAQ,KACpB,qBAAA,GAAA;AAAA,QAAC,eAAA;AAAA,QAAA;AAAA,UAEC,KAAO,EAAA,MAAA;AAAA,UACP,QAAA,EAAU,OAAQ,CAAA,MAAA,EAAQ,KAAK,CAAA;AAAA,UAC/B,QAAU,EAAA,QAAA;AAAA,UACV,IAAM,EAAA,KAAA,IAAA,IAAA,GAAA,KAAA,GAAS,CAAE,CAAA,sCAAA,EAAwC,aAAa;AAAA,SAAA;AAAA,QAJjE,YAAA,CAAa,QAAQ,KAAK;AAAA,OAMlC;AAAA;AAAA,GAEL,EAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,YAAA,CAAa,QAAoB,KAAuB,EAAA;AAC/D,EAAA,OAAO,GAAG,MAAO,CAAA,IAAI,IAAI,MAAO,CAAA,EAAE,IAAI,KAAK,CAAA,CAAA;AAC7C;AAEA,SAAS,OAAA,CAAQ,GAAe,CAAyB,EAAA;AACvD,EAAI,IAAA,CAAC,CAAK,IAAA,CAAC,CAAG,EAAA;AACZ,IAAO,OAAA,KAAA;AAAA;AAET,EAAA,OAAO,EAAE,IAAS,KAAA,CAAA,CAAE,IAAQ,IAAA,CAAA,CAAE,OAAO,CAAE,CAAA,EAAA;AACzC;AAEA,MAAM,YAAY,OAAO;AAAA,EACvB,OAAO,GAAI,CAAA;AAAA,IACT,OAAS,EAAA,MAAA;AAAA,IACT,UAAY,EAAA,QAAA;AAAA,IACZ,cAAgB,EAAA,eAAA;AAAA,IAChB,OAAS,EAAA;AAAA,GACV;AACH,CAAA,CAAA;AAEA,MAAM,gBAAA,GAAmB,CAAC,KAA0B,MAAA;AAAA,EAClD,MAAM,GAAI,CAAA;AAAA,IACR,OAAA,EAAS,KAAM,CAAA,OAAA,CAAQ,GAAG;AAAA,GAC3B;AACH,CAAA,CAAA;;;;"}