summaryrefslogtreecommitdiff
path: root/components/SliderWithInfo.tsx
diff options
context:
space:
mode:
authorThomas F. K. Jorna <hello@tefkah.com>2021-09-25 16:11:31 +0200
committerThomas F. K. Jorna <hello@tefkah.com>2021-09-25 16:11:31 +0200
commitee8539a9351374a719c9026f85d85e7b4ea6e8f5 (patch)
treef9220fd304bd3669523df39ddaa0992919ccc4a6 /components/SliderWithInfo.tsx
parent075d3831ffae63f128bcaabf9fc5e70ade41ad33 (diff)
chore: move tweaks to separate subfolder
Diffstat (limited to 'components/SliderWithInfo.tsx')
-rw-r--r--components/SliderWithInfo.tsx48
1 files changed, 0 insertions, 48 deletions
diff --git a/components/SliderWithInfo.tsx b/components/SliderWithInfo.tsx
deleted file mode 100644
index d4f0372..0000000
--- a/components/SliderWithInfo.tsx
+++ /dev/null
@@ -1,48 +0,0 @@
-import {
- Text,
- Box,
- Slider,
- SliderFilledTrack,
- SliderThumb,
- SliderTrack,
- Tooltip,
-} from '@chakra-ui/react'
-import React, { useContext } from 'react'
-import { ThemeContext } from '../util/themecontext'
-import { InfoTooltip } from './InfoTooltip'
-
-export interface SliderWithInfoProps {
- min?: number
- max?: number
- step?: number
- value: number
- onChange: (arg0: number) => void
- label: string
- infoText?: string
-}
-export const SliderWithInfo = ({
- min = 0,
- max = 10,
- step = 0.1,
- value = 1,
- ...rest
-}: SliderWithInfoProps) => {
- const { onChange, label, infoText } = rest
- const { highlightColor } = useContext(ThemeContext)
- return (
- <Box key={label}>
- <Box display="flex" alignItems="flex-end">
- <Text>{label}</Text>
- {infoText && <InfoTooltip infoText={infoText} />}
- </Box>
- <Slider value={value} onChange={onChange} min={min} max={max} step={step}>
- <SliderTrack>
- <SliderFilledTrack />
- </SliderTrack>
- <Tooltip bg={highlightColor} label={value.toFixed(1)}>
- <SliderThumb bg="white" />
- </Tooltip>
- </Slider>
- </Box>
- )
-}