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

Grafana Components Library

{"version":3,"file":"Slider.mjs","sources":["../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import { cx } from '@emotion/css';\nimport { Global } from '@emotion/react';\nimport SliderComponent from 'rc-slider';\nimport { useState, useCallback, ChangeEvent, FocusEvent } from 'react';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { Input } from '../Input/Input';\n\nimport { getStyles } from './styles';\nimport { SliderProps } from './types';\n\n/**\n * @public\n */\nexport const Slider = ({\n  min,\n  max,\n  onChange,\n  onAfterChange,\n  orientation = 'horizontal',\n  reverse,\n  step,\n  value,\n  ariaLabelForHandle,\n  marks,\n  included,\n}: SliderProps) => {\n  const isHorizontal = orientation === 'horizontal';\n  const styles = useStyles2(getStyles, isHorizontal, Boolean(marks));\n  const SliderWithTooltip = SliderComponent;\n  const [sliderValue, setSliderValue] = useState<number>(value ?? min);\n\n  const onSliderChange = useCallback(\n    (v: number | number[]) => {\n      const value = typeof v === 'number' ? v : v[0];\n\n      setSliderValue(value);\n      onChange?.(value);\n    },\n    [setSliderValue, onChange]\n  );\n\n  const onSliderInputChange = useCallback(\n    (e: ChangeEvent<HTMLInputElement>) => {\n      let v = +e.target.value;\n\n      if (Number.isNaN(v)) {\n        v = 0;\n      }\n\n      setSliderValue(v);\n\n      if (onChange) {\n        onChange(v);\n      }\n\n      if (onAfterChange) {\n        onAfterChange(v);\n      }\n    },\n    [onChange, onAfterChange]\n  );\n\n  // Check for min/max on input blur so user is able to enter\n  // custom values that might seem above/below min/max on first keystroke\n  const onSliderInputBlur = useCallback(\n    (e: FocusEvent<HTMLInputElement>) => {\n      const v = +e.target.value;\n\n      if (v > max) {\n        setSliderValue(max);\n      } else if (v < min) {\n        setSliderValue(min);\n      }\n    },\n    [max, min]\n  );\n\n  const handleChangeComplete = useCallback(\n    (v: number | number[]) => {\n      const value = typeof v === 'number' ? v : v[0];\n      onAfterChange?.(value);\n    },\n    [onAfterChange]\n  );\n\n  const sliderInputClassNames = !isHorizontal ? [styles.sliderInputVertical] : [];\n  const sliderInputFieldClassNames = !isHorizontal ? [styles.sliderInputFieldVertical] : [];\n\n  return (\n    <div className={cx(styles.container, styles.slider)}>\n      {/** Slider tooltip's parent component is body and therefore we need Global component to do css overrides for it. */}\n      <Global styles={styles.tooltip} />\n      <div className={cx(styles.sliderInput, ...sliderInputClassNames)}>\n        <SliderWithTooltip\n          min={min}\n          max={max}\n          step={step}\n          defaultValue={value}\n          value={sliderValue}\n          onChange={onSliderChange}\n          onChangeComplete={handleChangeComplete}\n          vertical={!isHorizontal}\n          reverse={reverse}\n          ariaLabelForHandle={ariaLabelForHandle}\n          marks={marks}\n          included={included}\n        />\n\n        <Input\n          type=\"text\"\n          width={7.5}\n          className={cx(styles.sliderInputField, ...sliderInputFieldClassNames)}\n          value={sliderValue}\n          onChange={onSliderInputChange}\n          onBlur={onSliderInputBlur}\n          min={min}\n          max={max}\n        />\n      </div>\n    </div>\n  );\n};\n\nSlider.displayName = 'Slider';\n"],"names":["value"],"mappings":"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"}