@grafana/ui/dist/esm/components/DateTimePickers/TimeZonePicker/TimeZoneOption.mjs.map

Grafana Components Library

{"version":3,"file":"TimeZoneOption.mjs","sources":["../../../../../src/components/DateTimePickers/TimeZonePicker/TimeZoneOption.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport { isString } from 'lodash';\nimport { PropsWithChildren, RefCallback } from 'react';\nimport * as React from 'react';\n\nimport { GrafanaTheme2, SelectableValue, getTimeZoneInfo } from '@grafana/data';\nimport { selectors } from '@grafana/e2e-selectors';\n\nimport { useStyles2 } from '../../../themes/ThemeContext';\nimport { Icon } from '../../Icon/Icon';\n\nimport { TimeZoneDescription } from './TimeZoneDescription';\nimport { TimeZoneOffset } from './TimeZoneOffset';\nimport { TimeZoneTitle } from './TimeZoneTitle';\n\ninterface Props {\n  isFocused: boolean;\n  isSelected: boolean;\n  innerProps: JSX.IntrinsicElements['div'];\n  innerRef: RefCallback<HTMLDivElement>;\n  data: SelectableZone;\n}\n\nconst offsetClassName = 'tz-utc-offset';\n\nexport interface SelectableZone extends SelectableValue<string> {\n  searchIndex: string;\n}\n\nexport const WideTimeZoneOption = (props: PropsWithChildren<Props>) => {\n  const { children, innerProps, innerRef, data, isSelected, isFocused } = props;\n  const styles = useStyles2(getStyles);\n  const timestamp = Date.now();\n  const containerStyles = cx(styles.container, isFocused && styles.containerFocused);\n\n  if (!isString(data.value)) {\n    return null;\n  }\n\n  const timeZoneInfo = getTimeZoneInfo(data.value, timestamp);\n\n  return (\n    <div className={containerStyles} {...innerProps} ref={innerRef} data-testid={selectors.components.Select.option}>\n      <div className={cx(styles.leftColumn, styles.row)}>\n        <div className={cx(styles.leftColumn, styles.wideRow)}>\n          <TimeZoneTitle title={children} />\n          <div className={styles.spacer} />\n          <TimeZoneDescription info={timeZoneInfo} />\n        </div>\n        <div className={styles.rightColumn}>\n          <TimeZoneOffset\n            /* Use the timeZoneInfo to pass the correct timeZone name,\n               as 'Default' has value '' which defaults to browser timezone */\n            timeZone={timeZoneInfo?.ianaName || data.value}\n            timestamp={timestamp}\n            className={offsetClassName}\n          />\n          {isSelected && (\n            <span>\n              <Icon name=\"check\" />\n            </span>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport const CompactTimeZoneOption = (props: React.PropsWithChildren<Props>) => {\n  const { children, innerProps, innerRef, data, isSelected, isFocused } = props;\n  const styles = useStyles2(getStyles);\n  const timestamp = Date.now();\n  const containerStyles = cx(styles.container, isFocused && styles.containerFocused);\n\n  if (!isString(data.value)) {\n    return null;\n  }\n\n  const timeZoneInfo = getTimeZoneInfo(data.value, timestamp);\n\n  return (\n    <div className={containerStyles} {...innerProps} ref={innerRef} data-testid={selectors.components.Select.option}>\n      <div className={styles.body}>\n        <div className={styles.row}>\n          <div className={styles.leftColumn}>\n            <TimeZoneTitle title={children} />\n          </div>\n          <div className={styles.rightColumn}>\n            {isSelected && (\n              <span>\n                <Icon name=\"check\" />\n              </span>\n            )}\n          </div>\n        </div>\n        <div className={styles.row}>\n          <div className={styles.leftColumn}>\n            <TimeZoneDescription info={timeZoneInfo} />\n          </div>\n          <div className={styles.rightColumn}>\n            <TimeZoneOffset\n              timestamp={timestamp}\n              /* Use the timeZoneInfo to pass the correct timeZone name,\n                 as 'Default' has value '' which defaults to browser timezone */\n              timeZone={timeZoneInfo?.ianaName || data.value}\n              className={offsetClassName}\n            />\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  container: css({\n    display: 'flex',\n    alignItems: 'center',\n    flexDirection: 'row',\n    flexShrink: 0,\n    whiteSpace: 'nowrap',\n    cursor: 'pointer',\n    padding: '6px 8px 4px',\n\n    '&:hover': {\n      background: theme.colors.action.hover,\n    },\n  }),\n  containerFocused: css({\n    background: theme.colors.action.hover,\n  }),\n  body: css({\n    display: 'flex',\n    fontWeight: theme.typography.fontWeightMedium,\n    flexDirection: 'column',\n    flexGrow: 1,\n  }),\n  row: css({\n    display: 'flex',\n    flexDirection: 'row',\n  }),\n  leftColumn: css({\n    flexGrow: 1,\n    textOverflow: 'ellipsis',\n  }),\n  rightColumn: css({\n    justifyContent: 'flex-end',\n    alignItems: 'center',\n  }),\n  wideRow: css({\n    display: 'flex',\n    flexDirection: 'row',\n    alignItems: 'baseline',\n  }),\n  spacer: css({\n    marginLeft: '6px',\n  }),\n});\n"],"names":[],"mappings":"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"}