diff --git a/apps/web/components/Embed.tsx b/apps/web/components/Embed.tsx index 7d431cfc49..1561c2ffa4 100644 --- a/apps/web/components/Embed.tsx +++ b/apps/web/components/Embed.tsx @@ -639,7 +639,7 @@ const ChooseEmbedTypesDialogContent = () => {
{embeds.map((embed, index) => (
))} @@ -164,7 +164,7 @@ export const AvailabilityTab = ({ isTeamEvent }: { isTeamEvent: boolean }) => {
- + {schedule?.timeZone || } - diff --git a/apps/web/components/settings/CalendarSwitch.tsx b/apps/web/components/settings/CalendarSwitch.tsx index 70b90d6d02..f8c7c08eca 100644 --- a/apps/web/components/settings/CalendarSwitch.tsx +++ b/apps/web/components/settings/CalendarSwitch.tsx @@ -62,7 +62,7 @@ export function CalendarSwitch(props: { } ); return ( -
+
- - diff --git a/apps/web/components/ui/AvatarGroup.tsx b/apps/web/components/ui/AvatarGroup.tsx index 06c8a1def5..f42b65d25c 100644 --- a/apps/web/components/ui/AvatarGroup.tsx +++ b/apps/web/components/ui/AvatarGroup.tsx @@ -34,7 +34,7 @@ export const AvatarGroup = function AvatarGroup(props: AvatarGroupProps) { ); return ( -
  • +
  • {item.href ? ( {avatar} diff --git a/apps/web/components/ui/UsernameAvailability/UsernameTextfield.tsx b/apps/web/components/ui/UsernameAvailability/UsernameTextfield.tsx index 55878552c8..b3a25849da 100644 --- a/apps/web/components/ui/UsernameAvailability/UsernameTextfield.tsx +++ b/apps/web/components/ui/UsernameAvailability/UsernameTextfield.tsx @@ -7,7 +7,17 @@ import { useLocale } from "@calcom/lib/hooks/useLocale"; import { TRPCClientErrorLike } from "@calcom/trpc/client"; import { trpc } from "@calcom/trpc/react"; import { AppRouter } from "@calcom/trpc/server/routers/_app"; -import { Button, Dialog, DialogClose, DialogContent, DialogHeader, Icon, Input, Label } from "@calcom/ui"; +import { + Button, + Dialog, + DialogClose, + DialogContent, + DialogHeader, + Icon, + Input, + Label, + TextField, +} from "@calcom/ui"; interface ICustomUsernameProps { currentUsername: string | undefined; @@ -77,10 +87,9 @@ const UsernameTextfield = (props: ICustomUsernameProps) => { const ActionButtons = () => { return usernameIsAvailable && currentUsername !== inputUsernameValue ? ( -
    +
    diff --git a/packages/app-store/caldavcalendar/pages/setup/index.tsx b/packages/app-store/caldavcalendar/pages/setup/index.tsx index 424b7b5733..3e30981397 100644 --- a/packages/app-store/caldavcalendar/pages/setup/index.tsx +++ b/packages/app-store/caldavcalendar/pages/setup/index.tsx @@ -100,7 +100,7 @@ export default function CalDavCalendarSetup() { className="my-4" /> )} -
    +
    diff --git a/packages/app-store/closecom/pages/setup/index.tsx b/packages/app-store/closecom/pages/setup/index.tsx index 92a8d3886e..6bff0241df 100644 --- a/packages/app-store/closecom/pages/setup/index.tsx +++ b/packages/app-store/closecom/pages/setup/index.tsx @@ -98,7 +98,7 @@ export default function CloseComSetup() { )} /> -
    +
    diff --git a/packages/app-store/exchange2013calendar/pages/setup/index.tsx b/packages/app-store/exchange2013calendar/pages/setup/index.tsx index 6ae478b988..15b6c8383c 100644 --- a/packages/app-store/exchange2013calendar/pages/setup/index.tsx +++ b/packages/app-store/exchange2013calendar/pages/setup/index.tsx @@ -77,7 +77,7 @@ export default function Exchange2013CalendarSetup() { {errorMessage && } -
    +
    diff --git a/packages/app-store/exchange2016calendar/pages/setup/index.tsx b/packages/app-store/exchange2016calendar/pages/setup/index.tsx index da536f3196..52d2ea5283 100644 --- a/packages/app-store/exchange2016calendar/pages/setup/index.tsx +++ b/packages/app-store/exchange2016calendar/pages/setup/index.tsx @@ -77,7 +77,7 @@ export default function Exchange2016CalendarSetup() { {errorMessage && } -
    +
    diff --git a/packages/app-store/exchangecalendar/pages/setup/index.tsx b/packages/app-store/exchangecalendar/pages/setup/index.tsx index 6a683d29ec..0f1a9c6691 100644 --- a/packages/app-store/exchangecalendar/pages/setup/index.tsx +++ b/packages/app-store/exchangecalendar/pages/setup/index.tsx @@ -120,7 +120,7 @@ export default function ExchangeSetup() { /> {errorMessage && } -
    +
    diff --git a/packages/app-store/giphy/components/SearchDialog.tsx b/packages/app-store/giphy/components/SearchDialog.tsx index fc363f3900..b087b7687b 100644 --- a/packages/app-store/giphy/components/SearchDialog.tsx +++ b/packages/app-store/giphy/components/SearchDialog.tsx @@ -94,7 +94,7 @@ export const SearchDialog = (props: ISearchDialog) => { setGifImage(""); setSelectedMode(mode); }}> - + {text}
    ); @@ -120,7 +120,9 @@ export const SearchDialog = (props: ISearchDialog) => { {renderTab(SearchIcon, t("search_giphy"), MODE_SEARCH)} {renderTab(LinkIcon, t("add_link_from_giphy"), MODE_URL)}
    -
    +
    { {gifImage && ( -
    +
    {isLoading ? (
    @@ -173,7 +175,7 @@ export const SearchDialog = (props: ISearchDialog) => { )} {errorMessage && } {gifImage && selectedMode === MODE_SEARCH && ( -
    +
    Not the perfect GIF?
    diff --git a/packages/app-store/typeform/pages/how-to-use/[...appPages].tsx b/packages/app-store/typeform/pages/how-to-use/[...appPages].tsx index b38706ebd0..3fdd0cd0ed 100644 --- a/packages/app-store/typeform/pages/how-to-use/[...appPages].tsx +++ b/packages/app-store/typeform/pages/how-to-use/[...appPages].tsx @@ -14,7 +14,7 @@ export default function HowToUse() {
    How to route a Typeform with Cal.com Routing
    -
      +
      1. Make sure that you have{" "} diff --git a/packages/app-store/zapier/pages/setup/index.tsx b/packages/app-store/zapier/pages/setup/index.tsx index ba46da54fe..0f5b2e38b4 100644 --- a/packages/app-store/zapier/pages/setup/index.tsx +++ b/packages/app-store/zapier/pages/setup/index.tsx @@ -51,7 +51,7 @@ export default function ZapierSetup(props: IZapierSetupProps) {
        Zapier Logo
        -
        +
        {t("setting_up_zapier")}
        {!newApiKey ? ( <> @@ -75,7 +75,7 @@ export default function ZapierSetup(props: IZapierSetupProps) { }} type="button" className="mt-4 text-base sm:mt-0 sm:rounded-l-none"> - + {t("copy")} @@ -86,7 +86,7 @@ export default function ZapierSetup(props: IZapierSetupProps) { )} -
          +
            {isCalDev && (
          1. {t("go_to")} diff --git a/packages/features/bookings/components/EventTypeFilter.tsx b/packages/features/bookings/components/EventTypeFilter.tsx index 61d3afbd1d..5a46284e10 100644 --- a/packages/features/bookings/components/EventTypeFilter.tsx +++ b/packages/features/bookings/components/EventTypeFilter.tsx @@ -63,7 +63,7 @@ export const EventTypeFilter = () => { type="checkbox" name="" id="" - className="text-primary-600 focus:ring-primary-500 mr-2 h-4 w-4 rounded border-gray-300 " + className="text-primary-600 focus:ring-primary-500 h-4 w-4 rounded border-gray-300 ltr:mr-2 rtl:ml-2 " />
        diff --git a/packages/features/bookings/components/FiltersContainer.tsx b/packages/features/bookings/components/FiltersContainer.tsx index 1d30b1bf7f..eb8566d2aa 100644 --- a/packages/features/bookings/components/FiltersContainer.tsx +++ b/packages/features/bookings/components/FiltersContainer.tsx @@ -29,7 +29,7 @@ const filters: Filter[] = [ export function FiltersContainer() { return ( -
        +
        {filters.map((filter) => { if (!filter.showByDefault) { // TODO: check if any of the controllingQueryParams are present in the query params and show the filter if so diff --git a/packages/features/bookings/components/PeopleFilter.tsx b/packages/features/bookings/components/PeopleFilter.tsx index 91ec050db2..4077856670 100644 --- a/packages/features/bookings/components/PeopleFilter.tsx +++ b/packages/features/bookings/components/PeopleFilter.tsx @@ -18,7 +18,7 @@ export const PeopleFilter = () => { 0 ? `${userNames.join(", ")}` : t("all_users_filter_label")}>
        -
        +
      2. -
        +
        diff --git a/packages/features/ee/teams/components/TeamAvailabilityModal.tsx b/packages/features/ee/teams/components/TeamAvailabilityModal.tsx index c8c98f304b..5415dbfca4 100644 --- a/packages/features/ee/teams/components/TeamAvailabilityModal.tsx +++ b/packages/features/ee/teams/components/TeamAvailabilityModal.tsx @@ -37,7 +37,7 @@ export default function TeamAvailabilityModal(props: Props) { alt={props.member?.name || ""} className="h-14 w-14 rounded-full" /> -
        +
        {props.member?.name} {props.member?.email}
        diff --git a/packages/features/ee/teams/components/TeamAvailabilityScreen.tsx b/packages/features/ee/teams/components/TeamAvailabilityScreen.tsx index 57b500ca06..c793bc900b 100644 --- a/packages/features/ee/teams/components/TeamAvailabilityScreen.tsx +++ b/packages/features/ee/teams/components/TeamAvailabilityScreen.tsx @@ -47,7 +47,7 @@ export default function TeamAvailabilityScreen(props: Props) { alt={member?.name || ""} className="min-w-10 min-h-10 mt-1 h-10 w-10 rounded-full" /> -
        +
        {member?.name} {member?.email}
        diff --git a/packages/features/ee/teams/components/TeamInviteListItem.tsx b/packages/features/ee/teams/components/TeamInviteListItem.tsx index 36063f91aa..68d515c6ee 100644 --- a/packages/features/ee/teams/components/TeamInviteListItem.tsx +++ b/packages/features/ee/teams/components/TeamInviteListItem.tsx @@ -66,7 +66,7 @@ export default function TeamInviteListItem(props: Props) { alt="Team Logo" className="" /> -
        +
        {team.name} {t("invited_by_team", { teamName: team.name, role: t(team.role.toLocaleLowerCase()) })} diff --git a/packages/features/ee/teams/components/TeamListItem.tsx b/packages/features/ee/teams/components/TeamListItem.tsx index 5f331f1014..5c7fed5dfb 100644 --- a/packages/features/ee/teams/components/TeamListItem.tsx +++ b/packages/features/ee/teams/components/TeamListItem.tsx @@ -71,7 +71,7 @@ export default function TeamListItem(props: Props) { alt="Team Logo" className="min-h-9 min-w-9 h-9 w-9 rounded-full" /> -
        +
        {team.name} {team.slug ? `${process.env.NEXT_PUBLIC_WEBSITE_URL}/team/${team.slug}` : "Unpublished team"} @@ -103,7 +103,11 @@ export default function TeamListItem(props: Props) { -
        diff --git a/packages/features/ee/teams/components/TeamsListing.tsx b/packages/features/ee/teams/components/TeamsListing.tsx index b37a92553f..ca0210f04d 100644 --- a/packages/features/ee/teams/components/TeamsListing.tsx +++ b/packages/features/ee/teams/components/TeamsListing.tsx @@ -64,7 +64,7 @@ export function TeamsListing() {

        {t("calcom_is_better_with_team")}

        {t("add_your_team_members")}

        -
        +
        diff --git a/packages/features/ee/teams/components/v2/TeamAvailabilityScreen.tsx b/packages/features/ee/teams/components/v2/TeamAvailabilityScreen.tsx index 57b500ca06..c793bc900b 100644 --- a/packages/features/ee/teams/components/v2/TeamAvailabilityScreen.tsx +++ b/packages/features/ee/teams/components/v2/TeamAvailabilityScreen.tsx @@ -47,7 +47,7 @@ export default function TeamAvailabilityScreen(props: Props) { alt={member?.name || ""} className="min-w-10 min-h-10 mt-1 h-10 w-10 rounded-full" /> -
        +
        {member?.name} {member?.email}
        diff --git a/packages/features/ee/teams/pages/team-profile-view.tsx b/packages/features/ee/teams/pages/team-profile-view.tsx index 037441afac..f7ab47cc3c 100644 --- a/packages/features/ee/teams/pages/team-profile-view.tsx +++ b/packages/features/ee/teams/pages/team-profile-view.tsx @@ -160,7 +160,7 @@ const ProfileView = () => { render={({ field: { value } }) => ( <> -
        + -
        +
        { diff --git a/packages/features/ee/workflows/components/SkeletonLoaderEventWorkflowsTab.tsx b/packages/features/ee/workflows/components/SkeletonLoaderEventWorkflowsTab.tsx index 2d699cf828..7740444dff 100644 --- a/packages/features/ee/workflows/components/SkeletonLoaderEventWorkflowsTab.tsx +++ b/packages/features/ee/workflows/components/SkeletonLoaderEventWorkflowsTab.tsx @@ -21,7 +21,7 @@ function SkeletonItem() {
        - +
        diff --git a/packages/features/ee/workflows/components/SkeletonLoaderList.tsx b/packages/features/ee/workflows/components/SkeletonLoaderList.tsx index fec415ab68..c84f6bfc09 100644 --- a/packages/features/ee/workflows/components/SkeletonLoaderList.tsx +++ b/packages/features/ee/workflows/components/SkeletonLoaderList.tsx @@ -21,7 +21,7 @@ function SkeletonItem() {
        - +
        diff --git a/packages/features/ee/workflows/components/WorkflowStepContainer.tsx b/packages/features/ee/workflows/components/WorkflowStepContainer.tsx index 8561fef7f6..f60d4d63b8 100644 --- a/packages/features/ee/workflows/components/WorkflowStepContainer.tsx +++ b/packages/features/ee/workflows/components/WorkflowStepContainer.tsx @@ -196,7 +196,7 @@ export default function WorkflowStepContainer(props: WorkflowStepProps) {
        -
        +
        1
        @@ -277,7 +277,7 @@ export default function WorkflowStepContainer(props: WorkflowStepProps) {
        -
        +
        {step.stepNumber + 1}
        @@ -603,7 +603,7 @@ export default function WorkflowStepContainer(props: WorkflowStepProps) {
        @@ -723,7 +723,9 @@ export default function WorkflowStepContainer(props: WorkflowStepProps) {

        {t("example_1")}

        -
        {t("additional_input_label")}
        +
        + {t("additional_input_label")} +
        {t("company_size")}
        {t("variable")}
        @@ -740,7 +742,9 @@ export default function WorkflowStepContainer(props: WorkflowStepProps) {

        {t("example_2")}

        -
        {t("additional_input_label")}
        +
        + {t("additional_input_label")} +
        {t("what_help_needed")}
        {t("variable")}
        diff --git a/packages/features/eventtypes/components/EmptyPage.tsx b/packages/features/eventtypes/components/EmptyPage.tsx index be7e1874a7..ea85986902 100644 --- a/packages/features/eventtypes/components/EmptyPage.tsx +++ b/packages/features/eventtypes/components/EmptyPage.tsx @@ -4,16 +4,16 @@ const SkeletonEventType = () => { return (
        -
        +
        -
        +
        -
        +
        diff --git a/packages/features/eventtypes/components/EventTypeDescription.tsx b/packages/features/eventtypes/components/EventTypeDescription.tsx index e918c691bb..fabe28eb00 100644 --- a/packages/features/eventtypes/components/EventTypeDescription.tsx +++ b/packages/features/eventtypes/components/EventTypeDescription.tsx @@ -39,7 +39,7 @@ export const EventTypeDescription = ({ eventType, className }: EventTypeDescript {eventType.description.length > 300 && "..."}

        )} -
          +
            {eventType.metadata?.multipleDuration ? ( eventType.metadata.multipleDuration.map((dur, idx) => (
          • diff --git a/packages/features/schedules/components/DateOverrideList.tsx b/packages/features/schedules/components/DateOverrideList.tsx index 146a0a9e5c..290bf518b6 100644 --- a/packages/features/schedules/components/DateOverrideList.tsx +++ b/packages/features/schedules/components/DateOverrideList.tsx @@ -59,7 +59,7 @@ const DateOverrideList = ({ )) )}
        -
        +
        ({ {/* Label & switch container */}
        -
        3. @@ -87,9 +87,9 @@ export function HintsOrErrors(props: { return (
      3. {!!dirty ? ( - + ) : ( - + )} {t(`${fieldName}_hint_${key}`)}
        4. diff --git a/packages/ui/components/form/inputs/Input.tsx b/packages/ui/components/form/inputs/Input.tsx index 19761240e9..95e7d63123 100644 --- a/packages/ui/components/form/inputs/Input.tsx +++ b/packages/ui/components/form/inputs/Input.tsx @@ -30,7 +30,7 @@ export const Input = forwardRef(function Input( export function InputLeading(props: JSX.IntrinsicElements["div"]) { return ( - + {props.children} ); @@ -118,7 +118,12 @@ export const InputField = forwardRef(function {addOnLeading || addOnSuffix ? (
        {addOnLeading && ( - + {addOnLeading} )} @@ -129,8 +134,8 @@ export const InputField = forwardRef(function isFullWidth={inputIsFullWidth} className={classNames( className, - addOnLeading && "rounded-l-none", - addOnSuffix && "rounded-r-none", + addOnLeading && "ltr:rounded-l-none rtl:rounded-r-none", + addOnSuffix && "ltr:rounded-r-none rtl:rounded-l-none", type === "search" && "pr-8", "!my-0 !ring-0" )} @@ -147,13 +152,18 @@ export const InputField = forwardRef(function ref={ref} /> {addOnSuffix && ( - + {addOnSuffix} )} {type === "search" && inputValue?.toString().length > 0 && ( { setInputValue(""); props.onChange && props.onChange(e as unknown as React.ChangeEvent); @@ -201,12 +211,12 @@ export const PasswordField = forwardRef(funct placeholder={props.placeholder || "•••••••••••••"} ref={ref} {...props} - className={classNames("mb-0 border-r-0 pr-10", props.className)} + className={classNames("mb-0 ltr:border-r-0 ltr:pr-10 rtl:border-l-0 rtl:pl-10", props.className)} addOnFilled={false} addOnSuffix={ - +

        {t("settings")}

         diff --git a/packages/ui/v2/core/navigation/tabs/VerticalTabItem.tsx b/packages/ui/v2/core/navigation/tabs/VerticalTabItem.tsx index 6fcd0678c1..f517b014e8 100644 --- a/packages/ui/v2/core/navigation/tabs/VerticalTabItem.tsx +++ b/packages/ui/v2/core/navigation/tabs/VerticalTabItem.tsx @@ -50,15 +50,17 @@ const VerticalTabItem = function ({ props.textClassNames || "text-sm font-medium leading-none text-gray-600", "min-h-9 group flex w-64 flex-row items-center rounded-md px-2 py-[10px] hover:bg-gray-100 group-hover:text-gray-700 [&[aria-current='page']]:bg-gray-200 [&[aria-current='page']]:text-gray-900", props.disabled && "pointer-events-none !opacity-30", - (isChild || !props.icon) && "ml-7 mr-5 w-auto", + (isChild || !props.icon) && "ml-7 w-auto ltr:mr-5 rtl:ml-5", !info ? "h-6" : "h-14", props.className )} data-testid={`vertical-tab-${name}`} aria-current={isCurrent ? "page" : undefined}> - {props.icon && } + {props.icon && ( + + )}
        - + {t(name)} diff --git a/packages/ui/v2/core/notifications.tsx b/packages/ui/v2/core/notifications.tsx index ec260b2466..8eae80cf0f 100644 --- a/packages/ui/v2/core/notifications.tsx +++ b/packages/ui/v2/core/notifications.tsx @@ -10,7 +10,7 @@ export function showToast(message: string, variant: "success" | "warning" | "err (t) => (
        @@ -25,7 +25,7 @@ export function showToast(message: string, variant: "success" | "warning" | "err (t) => (
        @@ -40,7 +40,7 @@ export function showToast(message: string, variant: "success" | "warning" | "err (t) => (
        @@ -55,7 +55,7 @@ export function showToast(message: string, variant: "success" | "warning" | "err (t) => (