[fix]: RTL Support for Switch Component Not Working.

[forestDev1212]

Feature description

Issue
The RTL (right-to-left) support for the Switch component is not working as expected. When checked, the switch moves to the right, even in RTL mode.

I did like this:

1. Set the dir prop to 'rtl'.
2. Toggle the switch.
3. Notice that the switch moves to the right instead of to the left in RTL mode.

Affected component/components

No response

Additional Context

Additional details here...

Before submitting

• I've made research efforts and searched the documentation
• I've searched for existing issues and PRs

[forestDev1212]

For that I have changed the current shadcn basic component for Switch like that:
`
"use client"

import * as React from "react"
import * as SwitchPrimitives from "@radix-ui/react-switch"

import { cn } from "@/lib/utils"

const Switch = React.forwardRef<
React.ElementRef,
React.ComponentPropsWithoutRef & { dir?: 'ltr' | 'rtl' }>(({ className, dir = 'ltr', ...props },ref) => {
const isRtl = dir === 'rtl'

return (
<SwitchPrimitives.Root
className={cn(
"peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors",
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
"disabled:cursor-not-allowed disabled:opacity-50",
"data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
className
)}
{...props}
ref={ref}
>
<SwitchPrimitives.Thumb
className={cn(
"pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform",
// Use inset-inline for better RTL support
isRtl
? "data-[state=checked]:-translate-x-5 data-[state=unchecked]:translate-x-0"
: "data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
)}
/>
</SwitchPrimitives.Root>
)
})
Switch.displayName = SwitchPrimitives.Root.displayName

export { Switch }

`