react-native-ruler-view/lib/commonjs/components/RulerPickerItem.js

⚡ Lightning-fast and customizable Ruler Picker component for React Native

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.RulerPickerItem = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactNative = require("react-native");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const RulerPickerItem = exports.RulerPickerItem = /*#__PURE__*/_react.default.memo(({
  isLast,
  index,
  gapBetweenSteps,
  shortStepHeight,
  longStepHeight,
  stepWidth,
  shortStepColor,
  longStepColor,
  vertical = false,
  stepStyle
}) => {
  const isLong = index % 10 === 0;
  const stepHeight = isLong ? longStepHeight : shortStepHeight;
  const stepColor = isLong ? longStepColor : shortStepColor;
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
    style: [styles.container, {
      [vertical ? 'height' : 'width']: stepWidth,
      [vertical ? 'marginBottom' : 'marginRight']: isLast ? 0 : gapBetweenSteps,
      [vertical ? 'marginLeft' : 'marginTop']: 20
    }],
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Animated.View, {
      style: [styles.step, {
        [vertical ? 'height' : 'width']: stepWidth,
        [vertical ? 'width' : 'height']: stepHeight,
        backgroundColor: stepColor,
        [vertical ? 'marginLeft' : 'marginTop']: isLong ? -12 : shortStepHeight - 30
      }, stepStyle]
    })
  });
});
const styles = _reactNative.StyleSheet.create({
  container: {
    justifyContent: 'center'
  },
  step: {
    backgroundColor: '#000000'
  },
  label: {
    fontSize: 10,
    textAlign: 'center'
  }
});
//# sourceMappingURL=RulerPickerItem.js.map