Not supported rtl

[amirnasr94]

How can I rtl the range component?

import { Text, View } from "react-native";
import React, { useCallback, useState } from "react";
import RnRangeSlider from "rn-range-slider";
import RangeThumb from "@assets/icons/rangeThumb.svg";

export default function RangeSlider({
  min,
  max,
  step,
  handleRange,
}: {
  min: number;
  max: number;
  step: number;
  handleRange: (low: number, high: number) => void;
}) {
  const [rangeValue, setRangeValue] = useState([min, max]);

  const handelValueChange = useCallback((low: number, high: number) => {
    setRangeValue([low, high]);
  }, []);

  const renderThumb = useCallback(
    () => <RangeThumb width={32} height={32} />,
    []
  );
  const renderRail = useCallback(
    () => <View className="flex-1 h-4 rounded-lg bg-neutral-300" />,
    []
  );
  const renderRailSelected = useCallback(
    () => <View className="h-4 bg-primary-200" />,
    []
  );

  return (
    <View>
      <RnRangeSlider
        onValueChanged={handelValueChange}
        min={min}
        max={max}
        step={step}
        floatingLabel
        renderThumb={renderThumb}
        renderRail={renderRail}
        renderRailSelected={renderRailSelected}
        onSliderTouchEnd={handleRange}
      />
      <View className="flex-row gap-1 items-center justify-between">
        <Text className="text-Body-Md font-iranyekanLight text-neutral-700 ">
          از
        </Text>
        <Text className="text-Body-Md font-iranyekanBold text-neutral-700 ">
          {rangeValue[0]}
        </Text>
        <Text className="text-Body-Md font-iranyekanLight text-neutral-700 ">
          تا
        </Text>
        <Text className="text-Body-Md font-iranyekanBold text-neutral-700 ">
          {rangeValue[1]}
        </Text>
      </View>
    </View>
  );
}