function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import React from 'react';
import { StyleSheet, Animated } from 'react-native';
import { ThemeContext } from '../../../theme';
import { SliderContext } from './index';
import styled from 'styled-components/native';
import { space, color, layout, typography } from 'styled-system';
import { Box } from '@native-base/v3';

const NBSliderThumb = ({
  children,
  ...props
}) => {
  const theme = React.useContext(ThemeContext);
  const {
    sliderOffset,
    panResponder
  } = React.useContext(SliderContext);
  const customStyle = StyleSheet.create({
    SliderThumb: {
      position: 'absolute',
      display: 'flex',
      left: sliderOffset,
      justifyContent: 'center',
      alignItems: 'center'
    }
  });
  return /*#__PURE__*/React.createElement(Animated.View, _extends({
    style: customStyle.SliderThumb
  }, panResponder.panHandlers), /*#__PURE__*/React.createElement(Box, _extends({
    position: "relative",
    borderRadius: theme.radii.full,
    backgroundColor: theme.colors.white,
    shadow: 1 // minHeight={theme.sizes[5]}
    // maxHeight={theme.sizes[5]}
    // maxWidth={theme.sizes[5]}
    // minWidth={theme.sizes[5]}
    ,
    height: theme.sizes[5],
    width: theme.sizes[5],
    display: "flex",
    justifyContent: "center",
    alignItems: "center"
  }, props), children));
};

const StyledSlider = styled(NBSliderThumb)(space, color, layout, typography);
StyledSlider.defaultProps = {};

const SliderThumb = ({ ...props
}) => {
  return /*#__PURE__*/React.createElement(StyledSlider, props);
};

export default SliderThumb;
//# sourceMappingURL=SliderThumb.js.map