Mood-al

<script>
	// @ts-nocheck

	import Tabs from '$lib/Tabs.svelte';
	import Tab from '$lib/Tab.svelte';

	let isRTL = false;
	const onClick = () => {
		isRTL = !isRTL;
	};

Mood-al

 const onInputBlur = (e) => {
    setFocussed(false);
    if (e.target.value === "" && locale === "ar") {
      setDir("rtl");
      return;
    }
    locale === "ar" ? setDir("rtl") : setDir("ltr");
  };

Mood-al

const onInputFocus = (e) => {
    setFocussed(true);
    if (e.target.value === "" && locale === "ar") {
      setDir("rtl");
      return;
    }
    isRTL(e.target.value) ? setDir("rtl") : setDir("ltr");
  };

Mood-al

//code from this repo https://github.com/kavirajk/isRTL/blob/master/isRTL.js

let reRTL, rtlChars;

rtlChars = [
  /* arabic ranges*/
  "\u0600-\u06FF",
  "\u0750-\u077F",
  "\uFB50-\uFDFF",
  "\uFE70-\uFEFF",

Mood-al

useEffect(() => {
    if (value === "" && locale === "ar") {
      setDir("rtl");
      return;
    }
    /* The above code is setting the direction of the text to right to left if the user is focussed on
    the text box. */
    if (focussed) {
      isRTL(value) ? setDir("rtl") : setDir("ltr");
    }

Mood-al

import { useEffect, useState } from "react";
import { isRTL } from "../utils/isRTL";

const useInputDirectionDetector = (value, locale) => {
  const [dir, setDir] = useState();

  const [focussed, setFocussed] = useState(false);

  /* If the user is typing and the language is Arabic, then set the direction to
 right-to-left. */

Mood-al

import { useEffect, useState } from "react";
import { isRTL } from "../utils/isRTL";

const useInputValueLangaugeDetector = (value, locale) => {
  const [dir, setDir] = useState();

  const [focussed, setFocussed] = useState(false);

  /* If the user is typing and the language is Arabic, then set the direction to
 right-to-left. */

Mood-al

import { useEffect, useState } from "react";
import { isRTL } from "../utils/isRTL";

const useInputValueLangaugeDetector = (value, locale) => {
  const [dir, setDir] = useState();

  const [focussed, setFocussed] = useState(false);

  /* If the user is typing and the language is Arabic, then set the direction to
 right-to-left. */

Mood-al

import { useEffect, useState } from "react";
import { isRTL } from "../utils/isRTL";

const useInputValueLangaugeDetector = (value, locale) => {
  const [dir, setDir] = useState();

  const [focussed, setFocussed] = useState(false);

  /* If the user is typing and the language is Arabic, then set the direction to
 right-to-left. */

Mood-al

export const donateRoutes = {
  medical_support: {
    constant: "sections_medical_support",
    sections: [
      {
        main_section_name: "medical_support",
        section_name: "medical-cases",
        title_constant_name: "medical_cases_title",
        description_constant_name: "medical_cases_description",
        route_url: "medical-cases",