From 450cc8d7bd53b5b38b8bd3c65d270017b02b3ffd Mon Sep 17 00:00:00 2001
From: David <darranz@rodax-software.com>
Date: Mon, 14 Sep 2026 19:13:54 +0200
Subject: [PATCH] feat(ui): agregar variante "card" a varios editores de
 cliente y ajustar clase en RdxPageContent

---
 .../update/ui/editor/customer-additional-config-fields.tsx   | 1 +
 .../src/web/update/ui/editor/customer-address-editor.tsx     | 1 +
 .../src/web/update/ui/editor/customer-basic-info-editor.tsx  | 1 +
 .../src/web/update/ui/editor/customer-contact-fields.tsx     | 1 +
 .../src/web/update/ui/editor/customer-fiscal-editor.tsx      | 1 +
 .../src/web/update/ui/pages/customer-update-page.tsx         | 2 +-
 packages/rdx-ui/src/components/form/switch-field.tsx         | 5 +++--
 packages/rdx-ui/src/components/layout/rdx-page-content.tsx   | 2 +-
 8 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/modules/customers/src/web/update/ui/editor/customer-additional-config-fields.tsx b/modules/customers/src/web/update/ui/editor/customer-additional-config-fields.tsx
index 09785b7b..d2b4a5b8 100644
--- a/modules/customers/src/web/update/ui/editor/customer-additional-config-fields.tsx
+++ b/modules/customers/src/web/update/ui/editor/customer-additional-config-fields.tsx
@@ -20,6 +20,7 @@ export const CustomerAdditionalConfigEditor = ({
       description={t("form_groups.preferences.description")}
       icon={<Settings2Icon className="size-5" />}
       title={t("form_groups.preferences.title")}
+      variant="card"
     >
       <RdxFormGrid>
         <SelectField
diff --git a/modules/customers/src/web/update/ui/editor/customer-address-editor.tsx b/modules/customers/src/web/update/ui/editor/customer-address-editor.tsx
index 0abed863..7c45231d 100644
--- a/modules/customers/src/web/update/ui/editor/customer-address-editor.tsx
+++ b/modules/customers/src/web/update/ui/editor/customer-address-editor.tsx
@@ -20,6 +20,7 @@ export const CustomerAddressEditor = ({
       description={t("form_groups.address.description")}
       icon={<MapPinIcon className="size-5" />}
       title={t("form_groups.address.title")}
+      variant="card"
     >
       <RdxFormGrid className="md:grid-cols-2">
         <TextField
diff --git a/modules/customers/src/web/update/ui/editor/customer-basic-info-editor.tsx b/modules/customers/src/web/update/ui/editor/customer-basic-info-editor.tsx
index 2b3048a5..840475cc 100644
--- a/modules/customers/src/web/update/ui/editor/customer-basic-info-editor.tsx
+++ b/modules/customers/src/web/update/ui/editor/customer-basic-info-editor.tsx
@@ -36,6 +36,7 @@ export const CustomerBasicInfoEditor = ({
       description={t("form_groups.basic_info.description")}
       icon={<FileTextIcon className="size-5" />}
       title={t("form_groups.basic_info.title")}
+      variant="card"
     >
       <RdxFormGrid className="md:grid-cols-2">
         <TextField
diff --git a/modules/customers/src/web/update/ui/editor/customer-contact-fields.tsx b/modules/customers/src/web/update/ui/editor/customer-contact-fields.tsx
index a0867188..17488707 100644
--- a/modules/customers/src/web/update/ui/editor/customer-contact-fields.tsx
+++ b/modules/customers/src/web/update/ui/editor/customer-contact-fields.tsx
@@ -27,6 +27,7 @@ export const CustomerContactEditor = ({
       description={t("form_groups.contact_info.description")}
       icon={<PhoneIcon className="size-5" />}
       title={t("form_groups.contact_info.title")}
+      variant="card"
     >
       <RdxFormGrid>
         <TextField
diff --git a/modules/customers/src/web/update/ui/editor/customer-fiscal-editor.tsx b/modules/customers/src/web/update/ui/editor/customer-fiscal-editor.tsx
index 78e0e0ed..04ba402a 100644
--- a/modules/customers/src/web/update/ui/editor/customer-fiscal-editor.tsx
+++ b/modules/customers/src/web/update/ui/editor/customer-fiscal-editor.tsx
@@ -31,6 +31,7 @@ export const CustomerFiscalEditor = ({
       description={t("form_groups.fiscal_info.description")}
       icon={<LandmarkIcon className="size-5" />}
       title={t("form_groups.fiscal_info.title")}
+      variant="card"
     >
       <RdxFormGrid className="md:grid-cols-2">
         <SelectField
diff --git a/modules/customers/src/web/update/ui/pages/customer-update-page.tsx b/modules/customers/src/web/update/ui/pages/customer-update-page.tsx
index 619f25a4..40fd6850 100644
--- a/modules/customers/src/web/update/ui/pages/customer-update-page.tsx
+++ b/modules/customers/src/web/update/ui/pages/customer-update-page.tsx
@@ -73,7 +73,7 @@ export const CustomerUpdatePage = () => {
     <FormProvider {...updateCtrl.form}>
       <UnsavedChangesProvider isDirty={updateCtrl.form.formState.isDirty}>
         <RdxPageFrame
-          contentClassName="bg-red-500"
+          contentClassName="bg-muted/20"
           header={
             <CustomerUpdateHeader
               formId={updateCtrl.formId}
diff --git a/packages/rdx-ui/src/components/form/switch-field.tsx b/packages/rdx-ui/src/components/form/switch-field.tsx
index 5d519c8e..02a20964 100644
--- a/packages/rdx-ui/src/components/form/switch-field.tsx
+++ b/packages/rdx-ui/src/components/form/switch-field.tsx
@@ -62,10 +62,11 @@ export const SwitchField = <TFormValues extends FieldValues>({
       name={name}
       render={({ field, fieldState }) => {
         const hasError = Boolean(fieldState.error);
-
         return (
           <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}
             orientation={orientation}
           >
diff --git a/packages/rdx-ui/src/components/layout/rdx-page-content.tsx b/packages/rdx-ui/src/components/layout/rdx-page-content.tsx
index c5ae0686..35e516f0 100644
--- a/packages/rdx-ui/src/components/layout/rdx-page-content.tsx
+++ b/packages/rdx-ui/src/components/layout/rdx-page-content.tsx
@@ -32,7 +32,7 @@ export const RdxPageContent = ({
   if (!aside) {
     return (
       <div
-        className={cn("flex min-w-0 flex-col", SPACING_CLASSNAME[spacing], className)}
+        className={cn("flex min-w-0 flex-col ", SPACING_CLASSNAME[spacing], className)}
         {...props}
       >
         {children}