@grafana/ui/dist/cjs/components/DateTimePickers/TimeZonePicker/TimeZoneOption.cjs.map

Grafana Components Library

{"version":3,"file":"TimeZoneOption.cjs","sources":["../../../../../src/components/DateTimePickers/TimeZonePicker/TimeZoneOption.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport { type PropsWithChildren, type RefCallback, type JSX } from 'react';\nimport * as React from 'react';\n\nimport { type GrafanaTheme2, type 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 (typeof data.value !== 'string') {\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 (typeof data.value !== 'string') {\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: theme.spacing(0.75, 1, 0.5),\n    borderRadius: theme.shape.radius.default,\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":["data","useStyles2","cx","getTimeZoneInfo","jsx","selectors","jsxs","TimeZoneTitle","TimeZoneDescription","TimeZoneOffset","Icon","css"],"mappings":"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"}