@aashu-dubey/react-native-rating-bar
Version:
A React Native component for generating and displaying interactive Tap or Swipe enabled Ratings.
69 lines (67 loc) • 2.59 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactNative = require("react-native");
var _NoRatingElement = _interopRequireDefault(require("./NoRatingElement.js"));
var _utils = require("../helper/utils.js");
var _styles = require("../theme/styles.js");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
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 && !_reactNative.I18nManager.isRTL || _reactNative.I18nManager.isRTL && !rtlMode;
const androidRTL = _utils.isAndroid && isOnlyRatingRTL;
// when android RTL is device based or forced, it works different, so inverting the condition on that case
const handleRtlAndroid = _reactNative.I18nManager.isRTL ? androidRTL : !androidRTL;
let padding = /*#__PURE__*/_react.default.isValidElement(children) && children?.props?.style?.width ? (size - children?.props.style.width) / 2 : 0;
if (isNaN(padding)) {
padding = 0;
}
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
style: {
width: size,
height: size
},
children: enableMask ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_NoRatingElement.default, {
size,
enableMask,
unratedColor,
children: children
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
style: [(0, _styles.elementStyle)(size).container, {
position: 'absolute',
overflow: 'hidden',
paddingHorizontal: padding
},
// for complete fraction use 'size * (1 - fraction)' instead of 'size / 2'
!_utils.isAndroid || handleRtlAndroid ? {
right: size / 2
} : {
left: size / 2
}],
removeClippedSubviews: true,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
style: [!_utils.isAndroid || handleRtlAndroid ? {
left: size / 2
} : {
right: size / 2
}],
children: children
})
})]
}) : children
});
};
var _default = exports.default = /*#__PURE__*/_react.default.memo(HalfRatingElement);
//# sourceMappingURL=HalfRatingElement.js.map