chore: add default reading direction to atoms wrapper (#17710)

packages/platform/atoms/cal-provider/CalProvider.tsx

@@ -67,7 +67,7 @@ export type CalProviderProps = {
   children?: ReactNode;
   clientId: string;
   accessToken?: string;
-  options: { refreshUrl?: string; apiUrl: string };
+  options: { refreshUrl?: string; apiUrl: string; readingDirection?: "ltr" | "rtl" };
   autoUpdateTimezone?: boolean;
   onTimezoneChange?: () => void;
   version?: API_VERSIONS_ENUM;

packages/platform/atoms/hooks/useAtomsContext.ts

@@ -8,6 +8,7 @@ import type http from "../lib/http";
 export interface IAtomsContextOptions {
   refreshUrl?: string;
   apiUrl: string;
+  readingDirection?: "ltr" | "rtl";
 }
 
 export interface IAtomsContext {

packages/platform/atoms/src/components/atoms-wrapper.tsx

@@ -2,6 +2,7 @@ import type { ReactNode } from "react";
 
 import { classNames } from "@calcom/lib";
 
+import { useAtomsContext } from "../../hooks/useAtomsContext";
 import { CALCOM_ATOMS_WRAPPER_CLASS } from "../constants/styles";
 
 export const AtomsWrapper = ({
@@ -11,8 +12,11 @@ export const AtomsWrapper = ({
   children: ReactNode;
   customClassName?: string;
 }) => {
+  const { options } = useAtomsContext();
   return (
-    <div className={classNames(`${CALCOM_ATOMS_WRAPPER_CLASS} m-0 w-auto p-0`, customClassName)}>
+    <div
+      dir={options?.readingDirection ?? "ltr"}
+      className={classNames(`${CALCOM_ATOMS_WRAPPER_CLASS} m-0 w-auto p-0`, customClassName)}>
       {children}
     </div>
   );