feat(ui): agregar variante "card" a varios editores de cliente y ajustar clase en RdxPageContent

This commit is contained in:
David Arranz 2026-09-14 19:13:54 +02:00
parent 569f150c19
commit 450cc8d7bd
8 changed files with 10 additions and 4 deletions

View File

@ -20,6 +20,7 @@ export const CustomerAdditionalConfigEditor = ({
description={t("form_groups.preferences.description")} description={t("form_groups.preferences.description")}
icon={<Settings2Icon className="size-5" />} icon={<Settings2Icon className="size-5" />}
title={t("form_groups.preferences.title")} title={t("form_groups.preferences.title")}
variant="card"
> >
<RdxFormGrid> <RdxFormGrid>
<SelectField <SelectField

View File

@ -20,6 +20,7 @@ export const CustomerAddressEditor = ({
description={t("form_groups.address.description")} description={t("form_groups.address.description")}
icon={<MapPinIcon className="size-5" />} icon={<MapPinIcon className="size-5" />}
title={t("form_groups.address.title")} title={t("form_groups.address.title")}
variant="card"
> >
<RdxFormGrid className="md:grid-cols-2"> <RdxFormGrid className="md:grid-cols-2">
<TextField <TextField

View File

@ -36,6 +36,7 @@ export const CustomerBasicInfoEditor = ({
description={t("form_groups.basic_info.description")} description={t("form_groups.basic_info.description")}
icon={<FileTextIcon className="size-5" />} icon={<FileTextIcon className="size-5" />}
title={t("form_groups.basic_info.title")} title={t("form_groups.basic_info.title")}
variant="card"
> >
<RdxFormGrid className="md:grid-cols-2"> <RdxFormGrid className="md:grid-cols-2">
<TextField <TextField

View File

@ -27,6 +27,7 @@ export const CustomerContactEditor = ({
description={t("form_groups.contact_info.description")} description={t("form_groups.contact_info.description")}
icon={<PhoneIcon className="size-5" />} icon={<PhoneIcon className="size-5" />}
title={t("form_groups.contact_info.title")} title={t("form_groups.contact_info.title")}
variant="card"
> >
<RdxFormGrid> <RdxFormGrid>
<TextField <TextField

View File

@ -31,6 +31,7 @@ export const CustomerFiscalEditor = ({
description={t("form_groups.fiscal_info.description")} description={t("form_groups.fiscal_info.description")}
icon={<LandmarkIcon className="size-5" />} icon={<LandmarkIcon className="size-5" />}
title={t("form_groups.fiscal_info.title")} title={t("form_groups.fiscal_info.title")}
variant="card"
> >
<RdxFormGrid className="md:grid-cols-2"> <RdxFormGrid className="md:grid-cols-2">
<SelectField <SelectField

View File

@ -73,7 +73,7 @@ export const CustomerUpdatePage = () => {
<FormProvider {...updateCtrl.form}> <FormProvider {...updateCtrl.form}>
<UnsavedChangesProvider isDirty={updateCtrl.form.formState.isDirty}> <UnsavedChangesProvider isDirty={updateCtrl.form.formState.isDirty}>
<RdxPageFrame <RdxPageFrame
contentClassName="bg-red-500" contentClassName="bg-muted/20"
header={ header={
<CustomerUpdateHeader <CustomerUpdateHeader
formId={updateCtrl.formId} formId={updateCtrl.formId}

View File

@ -62,10 +62,11 @@ export const SwitchField = <TFormValues extends FieldValues>({
name={name} name={name}
render={({ field, fieldState }) => { render={({ field, fieldState }) => {
const hasError = Boolean(fieldState.error); const hasError = Boolean(fieldState.error);
return ( return (
<Field <Field
className={cn("gap-2", className)} // Radix UI renderiza un input nativo absoluto para Switch.
// Este containing block evita que genere overflow a nivel de documento.
className={cn("gap-2 relative", className)}
data-invalid={hasError} data-invalid={hasError}
orientation={orientation} orientation={orientation}
> >