@aashu-dubey/react-native-rating-bar/lib/module/components/HalfRatingElement.js

A React Native component for generating and displaying interactive Tap or Swipe enabled Ratings.

"use strict";

import React from 'react';
import { View, I18nManager } from 'react-native';
import NoRatingElement from "./NoRatingElement.js";
import { isAndroid } from "../helper/utils.js";
import { elementStyle } from "../theme/styles.js";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const HalfRatingElement = ({
  size,
  children,
  enableMask,
  rtlMode,
  unratedColor
  // fraction, // for exact fraction
}) => {
  // (I18nManager.isRTL && !isRTL):- if whole app is RTL and user passed 'ltr' then gesture will work opposite
  const isOnlyRatingRTL = rtlMode && !I18nManager.isRTL || I18nManager.isRTL && !rtlMode;
  const androidRTL = isAndroid && isOnlyRatingRTL;

  // when android RTL is device based or forced, it works different, so inverting the condition on that case
  const handleRtlAndroid = I18nManager.isRTL ? androidRTL : !androidRTL;
  let padding = /*#__PURE__*/React.isValidElement(children) && children?.props?.style?.width ? (size - children?.props.style.width) / 2 : 0;
  if (isNaN(padding)) {
    padding = 0;
  }
  return /*#__PURE__*/_jsx(View, {
    style: {
      width: size,
      height: size
    },
    children: enableMask ? /*#__PURE__*/_jsxs(View, {
      children: [/*#__PURE__*/_jsx(NoRatingElement, {
        size,
        enableMask,
        unratedColor,
        children: children
      }), /*#__PURE__*/_jsx(View, {
        style: [elementStyle(size).container, {
          position: 'absolute',
          overflow: 'hidden',
          paddingHorizontal: padding
        },
        // for complete fraction use 'size * (1 - fraction)' instead of 'size / 2'
        !isAndroid || handleRtlAndroid ? {
          right: size / 2
        } : {
          left: size / 2
        }],
        removeClippedSubviews: true,
        children: /*#__PURE__*/_jsx(View, {
          style: [!isAndroid || handleRtlAndroid ? {
            left: size / 2
          } : {
            right: size / 2
          }],
          children: children
        })
      })]
    }) : children
  });
};
export default /*#__PURE__*/React.memo(HalfRatingElement);
//# sourceMappingURL=HalfRatingElement.js.map