@soyfri/shared-library 2.0.0-beta.9 → 3.0.0

package/components/Stepper/Stepper.d.ts

@@ -1,28 +1,17 @@
-import { default as React, ReactElement } from 'react';
-import { Breakpoint } from '@mui/material';
-import { StepProps } from './Step';
-interface MyStepperProps {
-    children: ReactElement<StepProps>[];
-    orientation?: "horizontal" | "vertical";
-    sx?: object;
+import { FC, ReactNode } from 'react';
+export interface StepperProps {
+    /** Uno o varios `<Step>`. Children que no sean `<Step>` se ignoran. */
+    children: ReactNode;
+    orientation?: 'horizontal' | 'vertical';
     alternateLabel?: boolean;
     /**
      * Índice 0-based del paso activo. Si no se provee, el Stepper intenta
-     * leerlo del `WizardContext` (si está dentro de un `<WizardProvider>`).
+     * leerlo del `StepperContext` (si está dentro de un `<StepperProvider>`).
      * Si tampoco hay provider, el default es 0.
      */
     currentStep?: number;
-    /**
-     * Cuando es true (default), en pantallas más angostas que `mobileBreakpoint`
-     * el stepper horizontal automáticamente:
-     *  - cambia a orientación vertical si hay >3 steps, o
-     *  - oculta los labels (solo dots) si hay ≤3 steps,
-     * para evitar que se desborde del contenedor.
-     * Si pasas `orientation="vertical"` explícito, no se altera.
-     */
-    responsive?: boolean;
-    /** Breakpoint debajo del cual aplica el modo mobile. Default: "sm". */
-    mobileBreakpoint?: Breakpoint;
+    keepMounted?: boolean;
+    sx?: object;
 }
-export declare const Stepper: React.FC<MyStepperProps>;
+export declare const Stepper: FC<StepperProps>;
 export default Stepper;

package/components/Stepper/Stepper.js

@@ -1,92 +1,10 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useTheme, useMediaQuery, Box, Stepper as Stepper$1, Step as Step$1, StepLabel } from "@mui/material";
-import { u as useWizard } from "../../useWizard-CWq--C3o.js";
-const Stepper = ({
-  children,
-  orientation = "horizontal",
-  alternateLabel = false,
-  responsive = true,
-  mobileBreakpoint = "sm",
-  sx,
-  currentStep: currentStepProp
-}) => {
-  const theme = useTheme();
-  const isMobile = useMediaQuery(theme.breakpoints.down(mobileBreakpoint));
-  const mobileAdapt = responsive && isMobile && orientation === "horizontal";
-  const effectiveOrientation = mobileAdapt && children.length > 3 ? "vertical" : orientation;
-  const hideLabelsOnMobile = mobileAdapt && children.length <= 3;
-  const effectiveAlternateLabel = alternateLabel && effectiveOrientation === "horizontal";
-  const wizard = useWizard();
-  const currentStep = currentStepProp !== void 0 ? currentStepProp : wizard.totalSteps > 0 ? wizard.currentStep : 0;
-  return /* @__PURE__ */ jsxs(Box, { sx: __spreadValues({ width: "100%", overflowX: "hidden" }, sx), children: [
-    /* @__PURE__ */ jsx(
-      Stepper$1,
-      {
-        activeStep: currentStep,
-        orientation: effectiveOrientation,
-        alternativeLabel: effectiveAlternateLabel,
-        sx: __spreadValues({}, effectiveOrientation === "horizontal" && {
-          flexWrap: "wrap",
-          rowGap: 1,
-          "& .MuiStepLabel-label": { textAlign: "center" }
-        }),
-        children: children.map((child, idx) => {
-          const { label, completed, disabled, className, sx: stepSx, dotColor, activeDotColor, completedDotColor, iconTextColor } = child.props;
-          return /* @__PURE__ */ jsx(Step$1, { completed, disabled, className, sx: stepSx, children: /* @__PURE__ */ jsx(
-            StepLabel,
-            {
-              sx: __spreadProps(__spreadValues({
-                pointerEvents: "none"
-              }, hideLabelsOnMobile && {
-                "& .MuiStepLabel-labelContainer": { display: "none" }
-              }), {
-                "& .MuiStepIcon-root": {
-                  color: dotColor
-                },
-                "& .MuiStepIcon-active": {
-                  color: activeDotColor
-                },
-                "& .MuiStepIcon-completed": {
-                  color: completedDotColor
-                },
-                "& .MuiStepIcon-text": {
-                  fill: iconTextColor
-                }
-              }),
-              children: label
-            }
-          ) }, idx);
-        })
-      }
-    ),
-    /* @__PURE__ */ jsx(Box, { mt: 2, children: children.map(
-      (child, idx) => idx === currentStep ? /* @__PURE__ */ jsx(Box, { children: child.props.children }, idx) : null
-    ) })
-  ] });
-};
-const Step = (_) => null;
-Step.displayName = "Step";
+import { a, S, c, b, S as S2, u } from "../../Step-BArsou1V.js";
 export {
-  Step,
-  Stepper
+  a as Step,
+  S as Stepper,
+  c as StepperContext,
+  b as StepperProvider,
+  S2 as default,
+  u as useStepper
 };
 //# sourceMappingURL=Stepper.js.map

package/components/Stepper/Stepper.js.map

@@ -1 +1 @@
-{"version":3,"file":"Stepper.js","sources":["../../../src/components/Stepper/Stepper.tsx","../../../src/components/Stepper/Step.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport {\n  Stepper as MuiStepper,\n  Step as MuiStep,\n  StepLabel as MuiStepLabel,\n  Box,\n  useMediaQuery,\n  useTheme,\n  Breakpoint,\n} from \"@mui/material\";\nimport { StepProps } from \"./Step\";\nimport { useWizard } from \"../../hooks/Wizard\";\n\ninterface MyStepperProps {\n  children: ReactElement<StepProps>[];\n  orientation?: \"horizontal\" | \"vertical\";\n  sx?: object;\n  alternateLabel?: boolean;\n  /**\n   * Índice 0-based del paso activo. Si no se provee, el Stepper intenta\n   * leerlo del `WizardContext` (si está dentro de un `<WizardProvider>`).\n   * Si tampoco hay provider, el default es 0.\n   */\n  currentStep?: number;\n  /**\n   * Cuando es true (default), en pantallas más angostas que `mobileBreakpoint`\n   * el stepper horizontal automáticamente:\n   *  - cambia a orientación vertical si hay >3 steps, o\n   *  - oculta los labels (solo dots) si hay ≤3 steps,\n   * para evitar que se desborde del contenedor.\n   * Si pasas `orientation=\"vertical\"` explícito, no se altera.\n   */\n  responsive?: boolean;\n  /** Breakpoint debajo del cual aplica el modo mobile. Default: \"sm\". */\n  mobileBreakpoint?: Breakpoint;\n}\n\nexport const Stepper: React.FC<MyStepperProps> = ({\n  children,\n  orientation = \"horizontal\",\n  alternateLabel = false,\n  responsive = true,\n  mobileBreakpoint = \"sm\",\n  sx,\n  currentStep: currentStepProp,\n}) => {\n  const theme = useTheme();\n  const isMobile = useMediaQuery(theme.breakpoints.down(mobileBreakpoint));\n\n  // Solo aplicamos adaptación mobile si el consumer pidió orientación horizontal.\n  const mobileAdapt = responsive && isMobile && orientation === \"horizontal\";\n  // Con muchos steps no caben aunque ocultes labels → mejor vertical.\n  const effectiveOrientation: \"horizontal\" | \"vertical\" =\n    mobileAdapt && children.length > 3 ? \"vertical\" : orientation;\n  // Con pocos steps conservamos horizontal pero ocultamos labels para no desbordar.\n  const hideLabelsOnMobile = mobileAdapt && children.length <= 3;\n  const effectiveAlternateLabel =\n    alternateLabel && effectiveOrientation === \"horizontal\";\n  // Lee el paso desde el WizardContext cuando el consumer no lo pasa como prop.\n  // Si el Stepper NO está dentro de un WizardProvider, `useWizard()` devuelve\n  // el valor default (currentStep=0, totalSteps=0), así que no rompe nada.\n  const wizard = useWizard();\n  const currentStep =\n    currentStepProp !== undefined\n      ? currentStepProp\n      : wizard.totalSteps > 0\n        ? wizard.currentStep\n        : 0;\n\n  return (\n    <Box sx={{ width: \"100%\", overflowX: \"hidden\", ...sx }}>\n      <MuiStepper\n        activeStep={currentStep}\n        orientation={effectiveOrientation}\n        alternativeLabel={effectiveAlternateLabel}\n        sx={{\n          // En horizontal con muchos labels + poco ancho, permitimos que\n          // los labels hagan wrap en lugar de forzar overflow.\n          ...(effectiveOrientation === \"horizontal\" && {\n            flexWrap: \"wrap\",\n            rowGap: 1,\n            \"& .MuiStepLabel-label\": { textAlign: \"center\" },\n          }),\n        }}\n      >\n        {children.map((child, idx) => {\n          const { label, completed, disabled, className, sx: stepSx, dotColor, activeDotColor, completedDotColor, iconTextColor } = child.props;\n          return (\n            <MuiStep key={idx} completed={completed} disabled={disabled} className={className} sx={stepSx}>\n              <MuiStepLabel sx={{\n                pointerEvents: 'none',\n                // Ocultamos la parte de texto en mobile cuando aplicamos\n                // reducción a dots-only. El icono se mantiene visible.\n                ...(hideLabelsOnMobile && {\n                  \"& .MuiStepLabel-labelContainer\": { display: \"none\" },\n                }),\n                \"& .MuiStepIcon-root\": {\n                  color: dotColor,\n                },\n                \"& .MuiStepIcon-active\": {\n                  color: activeDotColor,\n                },\n                \"& .MuiStepIcon-completed\": {\n                  color: completedDotColor,\n                },\n                \"& .MuiStepIcon-text\": {\n                  fill: iconTextColor,\n                },\n              }}\n              >{label}\n              </MuiStepLabel>\n            </MuiStep>\n          );\n        })}\n      </MuiStepper>\n      <Box mt={2}>\n        {children.map((child, idx) =>\n          idx === currentStep ? <Box key={idx}>{child.props.children}</Box> : null\n        )}\n      </Box>\n    </Box>\n  );\n};\n\nexport default Stepper;","import React from \"react\";\nimport { StepProps as MuiStepProps } from \"@mui/material\";\n\ntype PickMuiStepProps = Pick<MuiStepProps, \"completed\" | \"disabled\" | \"sx\" | \"className\">;\n\nexport interface StepProps extends PickMuiStepProps {\n  label: React.ReactNode;\n  children?: React.ReactNode;\n  disabled?: boolean;\n  sx?: object;\n  dotColor?: string;          // dot base\n  activeDotColor?: string;    // dot activa\n  completedDotColor?: string; // dot completada\n  iconTextColor?: string;     // número o check dentro\n}\n\nexport const Step = (_: StepProps): null => null;\n\nStep.displayName = \"Step\";\n\nexport default Step;"],"names":["MuiStepper","MuiStep","MuiStepLabel"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAqCO,MAAM,UAAoC,CAAC;AAAA,EAChD;AAAA,EACA,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,mBAAmB;AAAA,EACnB;AAAA,EACA,aAAa;AACf,MAAM;AACJ,QAAM,QAAQ,SAAA;AACd,QAAM,WAAW,cAAc,MAAM,YAAY,KAAK,gBAAgB,CAAC;AAGvE,QAAM,cAAc,cAAc,YAAY,gBAAgB;AAE9D,QAAM,uBACJ,eAAe,SAAS,SAAS,IAAI,aAAa;AAEpD,QAAM,qBAAqB,eAAe,SAAS,UAAU;AAC7D,QAAM,0BACJ,kBAAkB,yBAAyB;AAI7C,QAAM,SAAS,UAAA;AACf,QAAM,cACJ,oBAAoB,SAChB,kBACA,OAAO,aAAa,IAClB,OAAO,cACP;AAER,SACE,qBAAC,KAAA,EAAI,IAAI,iBAAE,OAAO,QAAQ,WAAW,YAAa,KAChD,UAAA;AAAA,IAAA;AAAA,MAACA;AAAAA,MAAA;AAAA,QACC,YAAY;AAAA,QACZ,aAAa;AAAA,QACb,kBAAkB;AAAA,QAClB,IAAI,mBAGE,yBAAyB,gBAAgB;AAAA,UAC3C,UAAU;AAAA,UACV,QAAQ;AAAA,UACR,yBAAyB,EAAE,WAAW,SAAA;AAAA,QAAS;AAAA,QAIlD,UAAA,SAAS,IAAI,CAAC,OAAO,QAAQ;AAC5B,gBAAM,EAAE,OAAO,WAAW,UAAU,WAAW,IAAI,QAAQ,UAAU,gBAAgB,mBAAmB,cAAA,IAAkB,MAAM;AAChI,qCACGC,QAAA,EAAkB,WAAsB,UAAoB,WAAsB,IAAI,QACrF,UAAA;AAAA,YAACC;AAAAA,YAAA;AAAA,cAAa,IAAI;AAAA,gBAChB,eAAe;AAAA,iBAGX,sBAAsB;AAAA,gBACxB,kCAAkC,EAAE,SAAS,OAAA;AAAA,cAAO,IALtC;AAAA,gBAOhB,uBAAuB;AAAA,kBACrB,OAAO;AAAA,gBAAA;AAAA,gBAET,yBAAyB;AAAA,kBACvB,OAAO;AAAA,gBAAA;AAAA,gBAET,4BAA4B;AAAA,kBAC1B,OAAO;AAAA,gBAAA;AAAA,gBAET,uBAAuB;AAAA,kBACrB,MAAM;AAAA,gBAAA;AAAA,cACR;AAAA,cAEA,UAAA;AAAA,YAAA;AAAA,UAAA,KArBU,GAuBd;AAAA,QAEJ,CAAC;AAAA,MAAA;AAAA,IAAA;AAAA,IAEH,oBAAC,KAAA,EAAI,IAAI,GACN,UAAA,SAAS;AAAA,MAAI,CAAC,OAAO,QACpB,QAAQ,cAAc,oBAAC,KAAA,EAAe,UAAA,MAAM,MAAM,SAAA,GAAlB,GAA2B,IAAS;AAAA,IAAA,EACtE,CACF;AAAA,EAAA,GACF;AAEJ;AC1GO,MAAM,OAAO,CAAC,MAAuB;AAE5C,KAAK,cAAc;"}
+{"version":3,"file":"Stepper.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/{hooks/Wizard/WizardContext.d.ts → components/Stepper/StepperContext.d.ts}

@@ -1,17 +1,11 @@
-import { default as React, FC, ReactNode } from 'react';
+import { FC, ReactNode } from 'react';
 /**
- * API expuesta por `useWizard()`.
- *
- * Nota de retro-compatibilidad: los nombres `submitStep`, `nextStep`,
- * `prevStep`, `goToStep` se mantienen idénticos al `WizardContext` de
- * `@soyfri/fri-web-components` para que consumers migrando no tengan que
- * cambiar sus llamadas. Se agregan campos extra opcionales que antes no
- * existían (`currentStep`, `totalSteps`, `isFirst`, `isLast`, `completed`).
+ * API expuesta por `useStepper()`.
  */
-export interface WizardContextValue {
+export interface StepperContextValue {
     /** Índice del paso actual (0-based). */
     currentStep: number;
-    /** Total de pasos del wizard. */
+    /** Total de pasos del stepper. */
     totalSteps: number;
     /** True si `currentStep === 0`. */
     isFirst: boolean;
@@ -26,16 +20,25 @@ export interface WizardContextValue {
     /** Salta a un paso específico (0-based). No-op si fuera de rango. */
     goToStep: (stepNumber: number) => void;
     /**
-     * Envía el wizard. Marca `completed = true` y dispara el callback
+     * Envía el stepper. Marca `completed = true` y dispara el callback
      * `onSubmit` del provider. En el último paso suele reemplazar a `nextStep`.
      */
     submitStep: () => void;
-    /** Resetea el wizard al paso inicial y limpia `completed`. */
+    /** Resetea al paso inicial y limpia `completed`. */
     reset: () => void;
 }
-export declare const WizardContext: React.Context<WizardContextValue>;
-export interface WizardProviderProps {
-    /** Número total de pasos del wizard. Requerido. */
+export declare const StepperContext: import('react').Context<StepperContextValue>;
+/**
+ * Hook para consumir el `StepperContext` desde cualquier descendiente de
+ * `<StepperProvider>`.
+ *
+ * Si se llama fuera de un provider, devuelve los valores por defecto (no-op)
+ * para que componentes como `<Stepper>` puedan leerlo sin romper cuando no
+ * hay provider envolvente.
+ */
+export declare function useStepper(): StepperContextValue;
+export interface StepperProviderProps {
+    /** Número total de pasos. Requerido. */
     totalSteps: number;
     /** Paso inicial (0-based). Default: 0. */
     initialStep?: number;
@@ -52,16 +55,19 @@ export interface WizardProviderProps {
     children?: ReactNode;
 }
 /**
- * Provider del wizard. Administra el `currentStep` internamente. El consumer
- * no necesita gestionar estado — sólo consumirlo con `useWizard()` desde
+ * Provider del stepper. Administra el `currentStep` internamente. El consumer
+ * no necesita gestionar estado — solo consumirlo con `useStepper()` desde
  * cualquier descendiente.
  *
  * ```tsx
- * <WizardProvider totalSteps={3} onSubmit={handleFinalSubmit}>
- *   <Stepper ... />
- *   <StepContent />
- *   <WizardControls />
- * </WizardProvider>
+ * <StepperProvider totalSteps={3} onSubmit={handleFinalSubmit}>
+ *   <Stepper>
+ *     <Step label="Paso 1"><StepOne /></Step>
+ *     <Step label="Paso 2"><StepTwo /></Step>
+ *     <Step label="Paso 3"><StepThree /></Step>
+ *   </Stepper>
+ *   <StepperControls />
+ * </StepperProvider>
  * ```
  */
-export declare const WizardProvider: FC<WizardProviderProps>;
+export declare const StepperProvider: FC<StepperProviderProps>;

package/components/Stepper/_hooks/useHorizontalScroll.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Hook interno del Stepper para manejar scroll horizontal cuando los steps
+ * no caben en el contenedor. No se exporta desde el barrel — es un detalle
+ * de implementación.
+ *
+ * @param enabled - Si el scroll está activo (típicamente sólo en orientación horizontal).
+ * @param deps    - Cosas que afectan el layout y disparan un recompute (ej. cantidad de steps, paso activo).
+ *
+ * Retorna:
+ * - `scrollRef`: ref a asignar al contenedor con `overflow-x: auto`.
+ * - `canScrollLeft` / `canScrollRight`: flags para habilitar/deshabilitar flechas.
+ * - `scrollBy(delta)`: imperativo con scroll suave.
+ */
+export declare function useHorizontalScroll(enabled: boolean, deps?: unknown[]): {
+    scrollRef: import('react').RefObject<HTMLDivElement | null>;
+    canScrollLeft: boolean;
+    canScrollRight: boolean;
+    scrollBy: (delta: number) => void;
+};

package/components/Stepper/_parts/StepperScrollArrow.d.ts

@@ -0,0 +1,19 @@
+interface StepperScrollArrowProps {
+    direction: 'left' | 'right';
+    /** Cuando `false`, el botón está deshabilitado (por ejemplo, ya estás al inicio). */
+    enabled: boolean;
+    /**
+     * Cuando `false`, el botón queda con `visibility: hidden` (reserva su
+     * espacio pero no se ve). Útil para que el área de scroll no se corra
+     * horizontalmente cuando no hay overflow en ningún lado.
+     */
+    visible: boolean;
+    onClick: () => void;
+}
+/**
+ * Flecha de scroll (`<` / `>`) del Stepper horizontal. Se muestra a los
+ * costados del área scrollable cuando hay overflow. Componente privado —
+ * no se exporta del barrel.
+ */
+export declare const StepperScrollArrow: ({ direction, enabled, visible, onClick, }: StepperScrollArrowProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/components/Stepper/index.d.ts

@@ -1,2 +1,6 @@
-export { default as Stepper } from './Stepper';
-export { default as Step } from './Step';
+export { Stepper, default } from './Stepper';
+export type { StepperProps } from './Stepper';
+export { Step } from './Step';
+export type { StepProps } from './Step';
+export { StepperProvider, StepperContext, useStepper, } from './StepperContext';
+export type { StepperContextValue, StepperProviderProps, } from './StepperContext';

package/components/Stepper.d.ts

@@ -1,2 +1,6 @@
 export * from './Stepper/index'
 export {}
+import _default from './Stepper/index'
+export default _default
+export * from './Stepper/index'
+export {}

package/components/Switch/Switch.cjs

@@ -1,181 +1,6 @@
 "use strict";
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const jsxRuntime = require("react/jsx-runtime");
-const styles = require("@mui/material/styles");
-const material = require("@mui/material");
-const reactHookForm = require("react-hook-form");
-const resolvePreset = require("../../resolvePreset-CT3kU-K2.cjs");
-const toRadius = (borderRadius) => typeof borderRadius === "number" ? `${borderRadius}px` : borderRadius;
-const FOCUS_TRANSITION = "border-color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, box-shadow 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms";
-const buildSwitchSx = ({
-  bordered,
-  borderRadius,
-  hasLabel,
-  error
-}) => {
-  const radius = toRadius(borderRadius);
-  if (!bordered) {
-    return {
-      "& .MuiFormHelperText-root": { marginLeft: 0 }
-    };
-  }
-  return (theme) => ({
-    "& .MuiFormControlLabel-root": __spreadValues(__spreadProps(__spreadValues({
-      marginLeft: 0,
-      marginRight: 0,
-      paddingX: 1.5,
-      paddingY: 1.25,
-      border: `1px solid ${error ? theme.palette.error.main : theme.palette.divider}`,
-      borderRadius: radius,
-      transition: FOCUS_TRANSITION
-    }, error && {
-      boxShadow: `0 0 0 1px ${theme.palette.error.main}`
-    }), {
-      // Focus del usuario sobre el switch interno.
-      "&:focus-within": {
-        borderColor: error ? theme.palette.error.main : theme.palette.primary.main,
-        boxShadow: `0 0 0 1px ${error ? theme.palette.error.main : theme.palette.primary.main}`
-      }
-    }), hasLabel && {
-      width: "100%",
-      justifyContent: "space-between"
-    }),
-    "& .MuiFormHelperText-root": {
-      marginLeft: 0
-    }
-  });
-};
-const Switch = (props) => {
-  const _a = props, {
-    label,
-    size = "medium",
-    labelPlacement = "end",
-    disabled = false,
-    error = false,
-    helperText,
-    bordered = false,
-    borderRadius = 10,
-    defaultChecked,
-    preset,
-    sx
-  } = _a, rest = __objRest(_a, [
-    "label",
-    "size",
-    "labelPlacement",
-    "disabled",
-    "error",
-    "helperText",
-    "bordered",
-    "borderRadius",
-    "defaultChecked",
-    "preset",
-    "sx"
-  ]);
-  const theme = styles.useTheme();
-  const presetSx = resolvePreset.resolvePreset("Switch", preset, theme);
-  const buildSx = (effectiveError) => [
-    buildSwitchSx({
-      bordered,
-      borderRadius,
-      hasLabel: !!label,
-      error: effectiveError
-    }),
-    ...presetSx ? [presetSx] : [],
-    ...Array.isArray(sx) ? sx : [sx]
-  ];
-  const renderSwitch = (checked2, onChange2, onBlur, inputRef) => {
-    const switchEl = /* @__PURE__ */ jsxRuntime.jsx(
-      material.Switch,
-      __spreadProps(__spreadValues({}, rest), {
-        size,
-        checked: !!checked2,
-        onChange: (_e, next) => onChange2(next),
-        onBlur,
-        inputRef,
-        disabled
-      })
-    );
-    return label ? /* @__PURE__ */ jsxRuntime.jsx(
-      material.FormControlLabel,
-      {
-        control: switchEl,
-        label,
-        labelPlacement,
-        disabled
-      }
-    ) : switchEl;
-  };
-  if ("control" in props && props.control) {
-    const { name, control, validation } = props;
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      reactHookForm.Controller,
-      {
-        name,
-        control,
-        rules: validation,
-        defaultValue: defaultChecked,
-        render: ({ field, fieldState: { error: fieldError } }) => {
-          var _a2;
-          const finalError = !!fieldError || error;
-          const finalHelperText = (_a2 = fieldError == null ? void 0 : fieldError.message) != null ? _a2 : helperText;
-          return /* @__PURE__ */ jsxRuntime.jsxs(
-            material.FormControl,
-            {
-              error: finalError,
-              disabled,
-              sx: buildSx(finalError),
-              children: [
-                renderSwitch(
-                  !!field.value,
-                  (next) => field.onChange(next),
-                  field.onBlur,
-                  field.ref
-                ),
-                finalHelperText && /* @__PURE__ */ jsxRuntime.jsx(material.FormHelperText, { children: finalHelperText })
-              ]
-            }
-          );
-        }
-      }
-    );
-  }
-  const { checked, onChange } = props;
-  return /* @__PURE__ */ jsxRuntime.jsxs(material.FormControl, { error, disabled, sx: buildSx(error), children: [
-    renderSwitch(checked, onChange),
-    helperText && /* @__PURE__ */ jsxRuntime.jsx(material.FormHelperText, { children: helperText })
-  ] });
-};
-exports.Switch = Switch;
-exports.default = Switch;
+const Switch = require("../../Switch-CQFOopYy.cjs");
+exports.Switch = Switch.Switch;
+exports.default = Switch.Switch;
 //# sourceMappingURL=Switch.cjs.map

package/components/Switch/Switch.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.cjs","sources":["../../../src/components/Switch/Switch.sx.ts","../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material/styles';\n\nexport interface BuildSwitchSxOptions {\n  bordered: boolean;\n  borderRadius: number | string;\n  hasLabel: boolean;\n  error: boolean;\n}\n\nconst toRadius = (borderRadius: number | string) =>\n  typeof borderRadius === 'number' ? `${borderRadius}px` : borderRadius;\n\n/**\n * Transición compartida (matchea el InputGroup y el RadioGroup).\n */\nconst FOCUS_TRANSITION =\n  'border-color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, ' +\n  'box-shadow 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms';\n\n/**\n * Builder de sx para Switch. Reproduce el estilo del antiguo\n * `FormToggleInput` legacy cuando `bordered=true`: contenedor con borde,\n * label a la izquierda y switch a la derecha (vía justify-content: space-between).\n *\n * Cuando `bordered=true`, el contenedor gana:\n * - `:focus-within` → borde + shadow primario (mismo patrón que `InputGroup`).\n * - `error=true` → borde + shadow de error (palette.error.main).\n *\n * El shadow es de 1px, así que no hay shift de layout — sólo se intensifica\n * visualmente el borde sin empujar nada alrededor.\n *\n * Si `bordered=false`, sólo aplica un reset de margin del helper text.\n */\nexport const buildSwitchSx = ({\n  bordered,\n  borderRadius,\n  hasLabel,\n  error,\n}: BuildSwitchSxOptions): SxProps<Theme> => {\n  const radius = toRadius(borderRadius);\n\n  if (!bordered) {\n    return {\n      '& .MuiFormHelperText-root': { marginLeft: 0 },\n    };\n  }\n\n  return (theme) => ({\n    '& .MuiFormControlLabel-root': {\n      marginLeft: 0,\n      marginRight: 0,\n      paddingX: 1.5,\n      paddingY: 1.25,\n      border: `1px solid ${\n        error ? theme.palette.error.main : theme.palette.divider\n      }`,\n      borderRadius: radius,\n      transition: FOCUS_TRANSITION,\n      ...(error && {\n        boxShadow: `0 0 0 1px ${theme.palette.error.main}`,\n      }),\n      // Focus del usuario sobre el switch interno.\n      '&:focus-within': {\n        borderColor: error\n          ? theme.palette.error.main\n          : theme.palette.primary.main,\n        boxShadow: `0 0 0 1px ${\n          error ? theme.palette.error.main : theme.palette.primary.main\n        }`,\n      },\n      // Si hay label, separar el switch al borde opuesto.\n      ...(hasLabel && {\n        width: '100%',\n        justifyContent: 'space-between',\n      }),\n    },\n    '& .MuiFormHelperText-root': {\n      marginLeft: 0,\n    },\n  });\n};\n","import { useTheme } from '@mui/material/styles';\nimport {\n  FormControl,\n  FormControlLabel,\n  FormHelperText,\n  Switch as MuiSwitch,\n  type SwitchProps as MuiSwitchProps,\n  type SxProps,\n  type Theme,\n} from '@mui/material';\nimport { Controller, type Control, type RegisterOptions } from 'react-hook-form';\n\nimport { buildSwitchSx } from './Switch.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport type SwitchSize = 'small' | 'medium';\nexport type SwitchLabelPlacement = 'start' | 'end' | 'top' | 'bottom';\n\n// ── Props base (todo lo común entre RHF y controlado) ────────────────────\nexport interface BaseSwitchProps\n  extends Omit<MuiSwitchProps, 'value' | 'onChange' | 'checked' | 'defaultChecked' | 'size'> {\n  /** Texto al lado del switch. Si está ausente, no se renderiza FormControlLabel. */\n  label?: string;\n  size?: SwitchSize;\n  /** Posición del label. Default: 'end' (legacy `FormToggleInput` lo ponía a la izquierda con su flex-stack). */\n  labelPlacement?: SwitchLabelPlacement;\n  disabled?: boolean;\n  error?: boolean;\n  helperText?: string;\n  /** Renderiza un contenedor con borde alrededor del switch + label. Default: false. */\n  bordered?: boolean;\n  /** Border radius del contenedor (cuando bordered). Default: 10. */\n  borderRadius?: number | string;\n  defaultChecked?: boolean;\n  /**\n   * Nombre del preset de estilo registrado en `theme.styles.Switch`.\n   * - `\"default\"` (o ausente) = estilo built-in del paquete.\n   * - Cualquier otro string = mergea el preset encima del estilo built-in.\n   */\n  preset?: string;\n  sx?: SxProps<Theme>;\n}\n\n// ── Variantes discriminadas (RHF vs controlado) ──────────────────────────\nexport interface RHFSwitchProps extends BaseSwitchProps {\n  name: string;\n  control: Control<any>;\n  validation?: RegisterOptions;\n  checked?: never;\n  onChange?: never;\n}\n\nexport interface ControlledSwitchProps extends BaseSwitchProps {\n  name?: string;\n  control?: never;\n  validation?: never;\n  checked: boolean;\n  onChange: (checked: boolean) => void;\n}\n\n// ── API pública final ────────────────────────────────────────────────────\nexport type SwitchProps = RHFSwitchProps | ControlledSwitchProps;\n\nexport const Switch: React.FC<SwitchProps> = (props) => {\n  const {\n    label,\n    size = 'medium',\n    labelPlacement = 'end',\n    disabled = false,\n    error = false,\n    helperText,\n    bordered = false,\n    borderRadius = 10,\n    defaultChecked,\n    preset,\n    sx,\n    ...rest\n  } = props as ControlledSwitchProps & {\n    control?: Control<any>;\n    validation?: RegisterOptions;\n  };\n\n  const theme = useTheme();\n  const presetSx = resolvePreset('Switch', preset, theme);\n\n  // Construye el sx con el estado de error efectivo; se llama por rama\n  // (RHF usa el error del Controller, controlado usa el prop `error`).\n  const buildSx = (effectiveError: boolean) => [\n    buildSwitchSx({\n      bordered,\n      borderRadius,\n      hasLabel: !!label,\n      error: effectiveError,\n    }),\n    ...(presetSx ? [presetSx] : []),\n    ...(Array.isArray(sx) ? sx : [sx]),\n  ];\n\n  const renderSwitch = (\n    checked: boolean,\n    onChange: (next: boolean) => void,\n    onBlur?: () => void,\n    inputRef?: React.Ref<HTMLInputElement>,\n  ) => {\n    const switchEl = (\n      <MuiSwitch\n        {...rest}\n        size={size}\n        checked={!!checked}\n        onChange={(_e, next) => onChange(next)}\n        onBlur={onBlur}\n        inputRef={inputRef}\n        disabled={disabled}\n      />\n    );\n\n    return label ? (\n      <FormControlLabel\n        control={switchEl}\n        label={label}\n        labelPlacement={labelPlacement}\n        disabled={disabled}\n      />\n    ) : (\n      switchEl\n    );\n  };\n\n  // ── RHF mode ──────────────────────────────────────────────────────────\n  if ('control' in props && props.control) {\n    const { name, control, validation } = props as RHFSwitchProps;\n    return (\n      <Controller\n        name={name}\n        control={control}\n        rules={validation}\n        defaultValue={defaultChecked}\n        render={({ field, fieldState: { error: fieldError } }) => {\n          const finalError = !!fieldError || error;\n          const finalHelperText = fieldError?.message ?? helperText;\n          return (\n            <FormControl\n              error={finalError}\n              disabled={disabled}\n              sx={buildSx(finalError)}\n            >\n              {renderSwitch(\n                !!field.value,\n                (next) => field.onChange(next),\n                field.onBlur,\n                field.ref,\n              )}\n              {finalHelperText && <FormHelperText>{finalHelperText}</FormHelperText>}\n            </FormControl>\n          );\n        }}\n      />\n    );\n  }\n\n  // ── Controlled mode ───────────────────────────────────────────────────\n  const { checked, onChange } = props as ControlledSwitchProps;\n  return (\n    <FormControl error={error} disabled={disabled} sx={buildSx(error)}>\n      {renderSwitch(checked, onChange)}\n      {helperText && <FormHelperText>{helperText}</FormHelperText>}\n    </FormControl>\n  );\n};\n\nexport default Switch;\n"],"names":["useTheme","resolvePreset","checked","onChange","jsx","MuiSwitch","FormControlLabel","Controller","_a","jsxs","FormControl","FormHelperText"],"mappings":"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"}
+{"version":3,"file":"Switch.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/components/Switch/Switch.d.ts

@@ -1,5 +1,5 @@
 import { SwitchProps as MuiSwitchProps, SxProps, Theme } from '@mui/material';
-import { Control, RegisterOptions } from 'react-hook-form';
+import { RegisterOptions } from 'react-hook-form';
 export type SwitchSize = 'small' | 'medium';
 export type SwitchLabelPlacement = 'start' | 'end' | 'top' | 'bottom';
 export interface BaseSwitchProps extends Omit<MuiSwitchProps, 'value' | 'onChange' | 'checked' | 'defaultChecked' | 'size'> {
@@ -26,8 +26,13 @@ export interface BaseSwitchProps extends Omit<MuiSwitchProps, 'value' | 'onChang
 }
 export interface RHFSwitchProps extends BaseSwitchProps {
     name: string;
-    control: Control<any>;
+    control: any;
     validation?: RegisterOptions;
+    /**
+     * Side-effect que corre después de que RHF actualiza el form state.
+     * Útil para cascadas entre campos. NO reemplaza al handler de RHF.
+     */
+    onValueChange?: (checked: boolean) => void;
     checked?: never;
     onChange?: never;
 }