@soyfri/shared-library 1.5.0 → 2.0.0-beta.1

package/dist/resolvePreset-CT3kU-K2.cjs

@@ -0,0 +1,14 @@
+"use strict";
+const DEFAULT_PRESET_NAME = "default";
+function resolvePreset(componentName, presetName, theme) {
+  var _a;
+  if (!presetName || presetName === DEFAULT_PRESET_NAME) return void 0;
+  const componentPresets = (_a = theme.styles) == null ? void 0 : _a[componentName];
+  if (!componentPresets) return void 0;
+  const entry = componentPresets[presetName];
+  if (!entry) return void 0;
+  return typeof entry === "function" ? entry(theme) : entry;
+}
+exports.DEFAULT_PRESET_NAME = DEFAULT_PRESET_NAME;
+exports.resolvePreset = resolvePreset;
+//# sourceMappingURL=resolvePreset-CT3kU-K2.cjs.map

package/dist/resolvePreset-CT3kU-K2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolvePreset-CT3kU-K2.cjs","sources":["../src/components/_shared/resolvePreset.ts"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material/styles';\n\nimport type { LibraryComponentName, PresetStyle } from '../../theme/componentStyles';\n\n/**\n * Nombre del preset built-in del paquete. No se registra en el theme: si un\n * componente recibe `preset=\"default\"` (o no recibe preset), sólo aplica el\n * estilo base de fábrica.\n */\nexport const DEFAULT_PRESET_NAME = 'default';\n\n/**\n * Resuelve el sx de un preset registrado en `theme.styles[componentName]`.\n *\n * - Si `presetName` es `\"default\"` o `undefined`, devuelve `undefined`\n *   (caller sólo aplicará el estilo base del paquete).\n * - Si la entrada en el theme es una función `(theme) => sx`, se ejecuta.\n * - Si la entrada no existe, devuelve `undefined` silenciosamente (no se\n *   rompe el componente — la responsabilidad de registrarlo es del consumer).\n */\nexport function resolvePreset(\n  componentName: LibraryComponentName,\n  presetName: string | undefined,\n  theme: Theme,\n): SxProps<Theme> | undefined {\n  if (!presetName || presetName === DEFAULT_PRESET_NAME) return undefined;\n\n  const componentPresets = theme.styles?.[componentName];\n  if (!componentPresets) return undefined;\n\n  const entry: PresetStyle | undefined = componentPresets[presetName];\n  if (!entry) return undefined;\n\n  return typeof entry === 'function' ? entry(theme) : entry;\n}\n"],"names":[],"mappings":";AASO,MAAM,sBAAsB;AAW5B,SAAS,cACd,eACA,YACA,OAC4B;;AAC5B,MAAI,CAAC,cAAc,eAAe,oBAAqB,QAAO;AAE9D,QAAM,oBAAmB,WAAM,WAAN,mBAAe;AACxC,MAAI,CAAC,iBAAkB,QAAO;AAE9B,QAAM,QAAiC,iBAAiB,UAAU;AAClE,MAAI,CAAC,MAAO,QAAO;AAEnB,SAAO,OAAO,UAAU,aAAa,MAAM,KAAK,IAAI;AACtD;;;"}

package/dist/styles.css

@@ -1,112 +1,3 @@
-/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */
-@layer properties;
-.invisible {
-  visibility: hidden;
-}
-.visible {
-  visibility: visible;
-}
-.absolute {
-  position: absolute;
-}
-.relative {
-  position: relative;
-}
-.sticky {
-  position: sticky;
-}
-.container {
-  width: 100%;
-}
-.block {
-  display: block;
-}
-.flex {
-  display: flex;
-}
-.grid {
-  display: grid;
-}
-.hidden {
-  display: none;
-}
-.inline-block {
-  display: inline-block;
-}
-.inline-flex {
-  display: inline-flex;
-}
-.table {
-  display: table;
-}
-.h-full {
-  height: 100%;
-}
-.w-full {
-  width: 100%;
-}
-.transform {
-  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
-}
-.items-center {
-  align-items: center;
-}
-.border {
-  border-style: var(--tw-border-style);
-  border-width: 1px;
-}
-.lowercase {
-  text-transform: lowercase;
-}
-.outline {
-  outline-style: var(--tw-outline-style);
-  outline-width: 1px;
-}
-.transition {
-  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
-  transition-timing-function: var(--tw-ease, ease);
-  transition-duration: var(--tw-duration, 0s);
-}
-@property --tw-rotate-x {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-rotate-y {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-rotate-z {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-skew-x {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-skew-y {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-border-style {
-  syntax: "*";
-  inherits: false;
-  initial-value: solid;
-}
-@property --tw-outline-style {
-  syntax: "*";
-  inherits: false;
-  initial-value: solid;
-}
-@layer properties {
-  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-    *, ::before, ::after, ::backdrop {
-      --tw-rotate-x: initial;
-      --tw-rotate-y: initial;
-      --tw-rotate-z: initial;
-      --tw-skew-x: initial;
-      --tw-skew-y: initial;
-      --tw-border-style: solid;
-      --tw-outline-style: solid;
-    }
-  }
-}
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

package/dist/theme/componentStyles.d.ts

@@ -0,0 +1,32 @@
+import { SxProps, Theme } from '@mui/material/styles';
+/**
+ * Lista de componentes del paquete que soportan presets registrables en el
+ * theme. Si en el futuro se agrega otro componente al sistema, se extiende
+ * esta union.
+ */
+export type LibraryComponentName = 'Input' | 'Select' | 'Autocomplete' | 'DatePicker' | 'DateTimePicker' | 'Drawer' | 'AppBar' | 'Card' | 'ScrollTopButton';
+/**
+ * Un estilo de preset. Puede ser un objeto sx directo o una función del theme
+ * para acceder a palette/typography/etc.
+ */
+export type PresetStyle = SxProps<Theme> | ((theme: Theme) => SxProps<Theme>);
+/**
+ * Map de presets disponibles para un componente. Las keys son nombres libres
+ * elegidos por el consumidor (p.ej. `reddit`, `compact-filled`). El paquete
+ * no registra ninguna entrada: `preset="default"` significa "usar el estilo
+ * built-in de fábrica" y no requiere registro.
+ */
+export type ComponentPresets = Record<string, PresetStyle>;
+/**
+ * Shape del namespace `theme.styles` — un map de componentes del paquete a
+ * sus presets registrados.
+ */
+export type LibraryStyles = Partial<Record<LibraryComponentName, ComponentPresets>>;
+declare module '@mui/material/styles' {
+    interface Theme {
+        styles: LibraryStyles;
+    }
+    interface ThemeOptions {
+        styles?: LibraryStyles;
+    }
+}

package/dist/theme/tokens.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Design tokens compartidos por los componentes de formulario
+ * (Input, Select, Autocomplete, DatePicker, DateTimePicker).
+ *
+ * Centralizar estos valores garantiza que:
+ * - el espaciado, la tipografía y las animaciones del label sean idénticos
+ *   en todos los campos;
+ * - un cambio visual global (p.ej. cambiar el transform del shrink) se haga
+ *   en un único archivo.
+ */
+/** Margen superior que deja el aire para el label flotante "outside". */
+export declare const LABEL_MARGIN_TOP = "14px";
+/** Padding vertical interno del input (TextField/Select/Picker sections). */
+export declare const FIELD_INPUT_PADDING_Y = "8.5px";
+/** Transform que aplica el label cuando sube arriba del input (shrink). */
+export declare const LABEL_SHRINK_TRANSFORM = "translate(4px, -22px) scale(0.85)";
+/** Origen del transform para el shrink. */
+export declare const LABEL_TRANSFORM_ORIGIN = "top left";
+/** Transición del label (color + transform + max-width). */
+export declare const LABEL_TRANSITION: string;
+/** Color del label en reposo. */
+export declare const LABEL_COLOR_REST = "text.secondary";
+/** Color del label cuando el campo tiene valor (shrink). */
+export declare const LABEL_COLOR_FILLED = "text.primary";
+/** Color del label cuando el campo está focused. */
+export declare const LABEL_COLOR_FOCUSED = "primary.main";
+/** Peso del label cuando sube (filled/focused). */
+export declare const LABEL_FONT_WEIGHT_FILLED = 500;

package/dist/useWizard-CWdIxZzX.cjs

@@ -0,0 +1,94 @@
+"use strict";
+const React = require("react");
+const jsxRuntime = require("react/jsx-runtime");
+const defaultValue = {
+  currentStep: 0,
+  totalSteps: 0,
+  isFirst: true,
+  isLast: true,
+  completed: false,
+  nextStep: () => {
+  },
+  prevStep: () => {
+  },
+  goToStep: () => {
+  },
+  submitStep: () => {
+  },
+  reset: () => {
+  }
+};
+const WizardContext = React.createContext(defaultValue);
+const WizardProvider = ({
+  totalSteps,
+  initialStep = 0,
+  onSubmit,
+  onStepChange,
+  children
+}) => {
+  const [currentStep, setCurrentStep] = React.useState(initialStep);
+  const [completed, setCompleted] = React.useState(false);
+  const changeStep = React.useCallback(
+    (newStep) => {
+      setCurrentStep((prev) => {
+        if (newStep === prev) return prev;
+        if (newStep < 0 || newStep >= totalSteps) return prev;
+        onStepChange == null ? void 0 : onStepChange(newStep, prev);
+        return newStep;
+      });
+    },
+    [totalSteps, onStepChange]
+  );
+  const nextStep = React.useCallback(() => {
+    changeStep(currentStep + 1);
+  }, [changeStep, currentStep]);
+  const prevStep = React.useCallback(() => {
+    changeStep(currentStep - 1);
+  }, [changeStep, currentStep]);
+  const goToStep = React.useCallback(
+    (stepNumber) => {
+      changeStep(stepNumber);
+    },
+    [changeStep]
+  );
+  const submitStep = React.useCallback(() => {
+    setCompleted(true);
+    onSubmit == null ? void 0 : onSubmit(currentStep);
+  }, [currentStep, onSubmit]);
+  const reset = React.useCallback(() => {
+    setCurrentStep(initialStep);
+    setCompleted(false);
+  }, [initialStep]);
+  const value = React.useMemo(
+    () => ({
+      currentStep,
+      totalSteps,
+      isFirst: currentStep === 0,
+      isLast: currentStep === totalSteps - 1,
+      completed,
+      nextStep,
+      prevStep,
+      goToStep,
+      submitStep,
+      reset
+    }),
+    [
+      currentStep,
+      totalSteps,
+      completed,
+      nextStep,
+      prevStep,
+      goToStep,
+      submitStep,
+      reset
+    ]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(WizardContext.Provider, { value, children });
+};
+function useWizard() {
+  return React.useContext(WizardContext);
+}
+exports.WizardContext = WizardContext;
+exports.WizardProvider = WizardProvider;
+exports.useWizard = useWizard;
+//# sourceMappingURL=useWizard-CWdIxZzX.cjs.map

package/dist/useWizard-CWdIxZzX.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useWizard-CWdIxZzX.cjs","sources":["../src/hooks/Wizard/WizardContext.tsx","../src/hooks/Wizard/useWizard.ts"],"sourcesContent":["import React, {\n  createContext,\n  useCallback,\n  useMemo,\n  useState,\n  type FC,\n  type ReactNode,\n} from 'react';\n\n/**\n * API expuesta por `useWizard()`.\n *\n * Nota de retro-compatibilidad: los nombres `submitStep`, `nextStep`,\n * `prevStep`, `goToStep` se mantienen idénticos al `WizardContext` de\n * `@soyfri/fri-web-components` para que consumers migrando no tengan que\n * cambiar sus llamadas. Se agregan campos extra opcionales que antes no\n * existían (`currentStep`, `totalSteps`, `isFirst`, `isLast`, `completed`).\n */\nexport interface WizardContextValue {\n  /** Índice del paso actual (0-based). */\n  currentStep: number;\n  /** Total de pasos del wizard. */\n  totalSteps: number;\n  /** True si `currentStep === 0`. */\n  isFirst: boolean;\n  /** True si `currentStep === totalSteps - 1`. */\n  isLast: boolean;\n  /** True tras ejecutar `submitStep()` desde el último paso. */\n  completed: boolean;\n  /** Avanza al siguiente paso (no pasa de `totalSteps - 1`). */\n  nextStep: () => void;\n  /** Retrocede al paso anterior (no baja de 0). */\n  prevStep: () => void;\n  /** Salta a un paso específico (0-based). No-op si fuera de rango. */\n  goToStep: (stepNumber: number) => void;\n  /**\n   * Envía el wizard. Marca `completed = true` y dispara el callback\n   * `onSubmit` del provider. En el último paso suele reemplazar a `nextStep`.\n   */\n  submitStep: () => void;\n  /** Resetea el wizard al paso inicial y limpia `completed`. */\n  reset: () => void;\n}\n\nconst defaultValue: WizardContextValue = {\n  currentStep: 0,\n  totalSteps: 0,\n  isFirst: true,\n  isLast: true,\n  completed: false,\n  nextStep: () => {},\n  prevStep: () => {},\n  goToStep: () => {},\n  submitStep: () => {},\n  reset: () => {},\n};\n\nexport const WizardContext = createContext<WizardContextValue>(defaultValue);\n\nexport interface WizardProviderProps {\n  /** Número total de pasos del wizard. Requerido. */\n  totalSteps: number;\n  /** Paso inicial (0-based). Default: 0. */\n  initialStep?: number;\n  /**\n   * Callback disparado cuando se llama `submitStep()`. Recibe el paso actual.\n   * El paquete NO ejecuta ninguna petición; queda a cargo del consumer.\n   */\n  onSubmit?: (currentStep: number) => void;\n  /**\n   * Callback disparado en cada cambio de paso (next/prev/goTo).\n   * Útil para tracking o validaciones externas.\n   */\n  onStepChange?: (newStep: number, prevStep: number) => void;\n  children?: ReactNode;\n}\n\n/**\n * Provider del wizard. Administra el `currentStep` internamente. El consumer\n * no necesita gestionar estado — sólo consumirlo con `useWizard()` desde\n * cualquier descendiente.\n *\n * ```tsx\n * <WizardProvider totalSteps={3} onSubmit={handleFinalSubmit}>\n *   <Stepper ... />\n *   <StepContent />\n *   <WizardControls />\n * </WizardProvider>\n * ```\n */\nexport const WizardProvider: FC<WizardProviderProps> = ({\n  totalSteps,\n  initialStep = 0,\n  onSubmit,\n  onStepChange,\n  children,\n}) => {\n  const [currentStep, setCurrentStep] = useState(initialStep);\n  const [completed, setCompleted] = useState(false);\n\n  const changeStep = useCallback(\n    (newStep: number) => {\n      setCurrentStep((prev) => {\n        if (newStep === prev) return prev;\n        if (newStep < 0 || newStep >= totalSteps) return prev;\n        onStepChange?.(newStep, prev);\n        return newStep;\n      });\n    },\n    [totalSteps, onStepChange],\n  );\n\n  const nextStep = useCallback(() => {\n    changeStep(currentStep + 1);\n  }, [changeStep, currentStep]);\n\n  const prevStep = useCallback(() => {\n    changeStep(currentStep - 1);\n  }, [changeStep, currentStep]);\n\n  const goToStep = useCallback(\n    (stepNumber: number) => {\n      changeStep(stepNumber);\n    },\n    [changeStep],\n  );\n\n  const submitStep = useCallback(() => {\n    setCompleted(true);\n    onSubmit?.(currentStep);\n  }, [currentStep, onSubmit]);\n\n  const reset = useCallback(() => {\n    setCurrentStep(initialStep);\n    setCompleted(false);\n  }, [initialStep]);\n\n  const value = useMemo<WizardContextValue>(\n    () => ({\n      currentStep,\n      totalSteps,\n      isFirst: currentStep === 0,\n      isLast: currentStep === totalSteps - 1,\n      completed,\n      nextStep,\n      prevStep,\n      goToStep,\n      submitStep,\n      reset,\n    }),\n    [\n      currentStep,\n      totalSteps,\n      completed,\n      nextStep,\n      prevStep,\n      goToStep,\n      submitStep,\n      reset,\n    ],\n  );\n\n  return (\n    <WizardContext.Provider value={value}>{children}</WizardContext.Provider>\n  );\n};\n","import { useContext } from 'react';\nimport { WizardContext, type WizardContextValue } from './WizardContext';\n\n/**\n * Hook para consumir el `WizardContext` desde cualquier descendiente de\n * `<WizardProvider>`.\n *\n * Si se llama fuera de un provider, devuelve los valores por defecto (no-op)\n * para mantener compatibilidad con el hook original de fri-web-components.\n */\nexport function useWizard(): WizardContextValue {\n  return useContext(WizardContext);\n}\n"],"names":["createContext","useState","useCallback","useMemo","jsx","useContext"],"mappings":";;;AA4CA,MAAM,eAAmC;AAAA,EACvC,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,UAAU,MAAM;AAAA,EAAC;AAAA,EACjB,UAAU,MAAM;AAAA,EAAC;AAAA,EACjB,UAAU,MAAM;AAAA,EAAC;AAAA,EACjB,YAAY,MAAM;AAAA,EAAC;AAAA,EACnB,OAAO,MAAM;AAAA,EAAC;AAChB;AAEO,MAAM,gBAAgBA,MAAAA,cAAkC,YAAY;AAiCpE,MAAM,iBAA0C,CAAC;AAAA,EACtD;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,CAAC,aAAa,cAAc,IAAIC,MAAAA,SAAS,WAAW;AAC1D,QAAM,CAAC,WAAW,YAAY,IAAIA,MAAAA,SAAS,KAAK;AAEhD,QAAM,aAAaC,MAAAA;AAAAA,IACjB,CAAC,YAAoB;AACnB,qBAAe,CAAC,SAAS;AACvB,YAAI,YAAY,KAAM,QAAO;AAC7B,YAAI,UAAU,KAAK,WAAW,WAAY,QAAO;AACjD,qDAAe,SAAS;AACxB,eAAO;AAAA,MACT,CAAC;AAAA,IACH;AAAA,IACA,CAAC,YAAY,YAAY;AAAA,EAAA;AAG3B,QAAM,WAAWA,MAAAA,YAAY,MAAM;AACjC,eAAW,cAAc,CAAC;AAAA,EAC5B,GAAG,CAAC,YAAY,WAAW,CAAC;AAE5B,QAAM,WAAWA,MAAAA,YAAY,MAAM;AACjC,eAAW,cAAc,CAAC;AAAA,EAC5B,GAAG,CAAC,YAAY,WAAW,CAAC;AAE5B,QAAM,WAAWA,MAAAA;AAAAA,IACf,CAAC,eAAuB;AACtB,iBAAW,UAAU;AAAA,IACvB;AAAA,IACA,CAAC,UAAU;AAAA,EAAA;AAGb,QAAM,aAAaA,MAAAA,YAAY,MAAM;AACnC,iBAAa,IAAI;AACjB,yCAAW;AAAA,EACb,GAAG,CAAC,aAAa,QAAQ,CAAC;AAE1B,QAAM,QAAQA,MAAAA,YAAY,MAAM;AAC9B,mBAAe,WAAW;AAC1B,iBAAa,KAAK;AAAA,EACpB,GAAG,CAAC,WAAW,CAAC;AAEhB,QAAM,QAAQC,MAAAA;AAAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA,SAAS,gBAAgB;AAAA,MACzB,QAAQ,gBAAgB,aAAa;AAAA,MACrC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAGF,SACEC,2BAAAA,IAAC,cAAc,UAAd,EAAuB,OAAe,SAAA,CAAS;AAEpD;AC3JO,SAAS,YAAgC;AAC9C,SAAOC,MAAAA,WAAW,aAAa;AACjC;;;;"}

package/dist/useWizard-CWq--C3o.js

@@ -0,0 +1,95 @@
+import { createContext, useState, useCallback, useMemo, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+const defaultValue = {
+  currentStep: 0,
+  totalSteps: 0,
+  isFirst: true,
+  isLast: true,
+  completed: false,
+  nextStep: () => {
+  },
+  prevStep: () => {
+  },
+  goToStep: () => {
+  },
+  submitStep: () => {
+  },
+  reset: () => {
+  }
+};
+const WizardContext = createContext(defaultValue);
+const WizardProvider = ({
+  totalSteps,
+  initialStep = 0,
+  onSubmit,
+  onStepChange,
+  children
+}) => {
+  const [currentStep, setCurrentStep] = useState(initialStep);
+  const [completed, setCompleted] = useState(false);
+  const changeStep = useCallback(
+    (newStep) => {
+      setCurrentStep((prev) => {
+        if (newStep === prev) return prev;
+        if (newStep < 0 || newStep >= totalSteps) return prev;
+        onStepChange == null ? void 0 : onStepChange(newStep, prev);
+        return newStep;
+      });
+    },
+    [totalSteps, onStepChange]
+  );
+  const nextStep = useCallback(() => {
+    changeStep(currentStep + 1);
+  }, [changeStep, currentStep]);
+  const prevStep = useCallback(() => {
+    changeStep(currentStep - 1);
+  }, [changeStep, currentStep]);
+  const goToStep = useCallback(
+    (stepNumber) => {
+      changeStep(stepNumber);
+    },
+    [changeStep]
+  );
+  const submitStep = useCallback(() => {
+    setCompleted(true);
+    onSubmit == null ? void 0 : onSubmit(currentStep);
+  }, [currentStep, onSubmit]);
+  const reset = useCallback(() => {
+    setCurrentStep(initialStep);
+    setCompleted(false);
+  }, [initialStep]);
+  const value = useMemo(
+    () => ({
+      currentStep,
+      totalSteps,
+      isFirst: currentStep === 0,
+      isLast: currentStep === totalSteps - 1,
+      completed,
+      nextStep,
+      prevStep,
+      goToStep,
+      submitStep,
+      reset
+    }),
+    [
+      currentStep,
+      totalSteps,
+      completed,
+      nextStep,
+      prevStep,
+      goToStep,
+      submitStep,
+      reset
+    ]
+  );
+  return /* @__PURE__ */ jsx(WizardContext.Provider, { value, children });
+};
+function useWizard() {
+  return useContext(WizardContext);
+}
+export {
+  WizardProvider as W,
+  WizardContext as a,
+  useWizard as u
+};
+//# sourceMappingURL=useWizard-CWq--C3o.js.map

package/dist/useWizard-CWq--C3o.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useWizard-CWq--C3o.js","sources":["../src/hooks/Wizard/WizardContext.tsx","../src/hooks/Wizard/useWizard.ts"],"sourcesContent":["import React, {\n  createContext,\n  useCallback,\n  useMemo,\n  useState,\n  type FC,\n  type ReactNode,\n} from 'react';\n\n/**\n * API expuesta por `useWizard()`.\n *\n * Nota de retro-compatibilidad: los nombres `submitStep`, `nextStep`,\n * `prevStep`, `goToStep` se mantienen idénticos al `WizardContext` de\n * `@soyfri/fri-web-components` para que consumers migrando no tengan que\n * cambiar sus llamadas. Se agregan campos extra opcionales que antes no\n * existían (`currentStep`, `totalSteps`, `isFirst`, `isLast`, `completed`).\n */\nexport interface WizardContextValue {\n  /** Índice del paso actual (0-based). */\n  currentStep: number;\n  /** Total de pasos del wizard. */\n  totalSteps: number;\n  /** True si `currentStep === 0`. */\n  isFirst: boolean;\n  /** True si `currentStep === totalSteps - 1`. */\n  isLast: boolean;\n  /** True tras ejecutar `submitStep()` desde el último paso. */\n  completed: boolean;\n  /** Avanza al siguiente paso (no pasa de `totalSteps - 1`). */\n  nextStep: () => void;\n  /** Retrocede al paso anterior (no baja de 0). */\n  prevStep: () => void;\n  /** Salta a un paso específico (0-based). No-op si fuera de rango. */\n  goToStep: (stepNumber: number) => void;\n  /**\n   * Envía el wizard. Marca `completed = true` y dispara el callback\n   * `onSubmit` del provider. En el último paso suele reemplazar a `nextStep`.\n   */\n  submitStep: () => void;\n  /** Resetea el wizard al paso inicial y limpia `completed`. */\n  reset: () => void;\n}\n\nconst defaultValue: WizardContextValue = {\n  currentStep: 0,\n  totalSteps: 0,\n  isFirst: true,\n  isLast: true,\n  completed: false,\n  nextStep: () => {},\n  prevStep: () => {},\n  goToStep: () => {},\n  submitStep: () => {},\n  reset: () => {},\n};\n\nexport const WizardContext = createContext<WizardContextValue>(defaultValue);\n\nexport interface WizardProviderProps {\n  /** Número total de pasos del wizard. Requerido. */\n  totalSteps: number;\n  /** Paso inicial (0-based). Default: 0. */\n  initialStep?: number;\n  /**\n   * Callback disparado cuando se llama `submitStep()`. Recibe el paso actual.\n   * El paquete NO ejecuta ninguna petición; queda a cargo del consumer.\n   */\n  onSubmit?: (currentStep: number) => void;\n  /**\n   * Callback disparado en cada cambio de paso (next/prev/goTo).\n   * Útil para tracking o validaciones externas.\n   */\n  onStepChange?: (newStep: number, prevStep: number) => void;\n  children?: ReactNode;\n}\n\n/**\n * Provider del wizard. Administra el `currentStep` internamente. El consumer\n * no necesita gestionar estado — sólo consumirlo con `useWizard()` desde\n * cualquier descendiente.\n *\n * ```tsx\n * <WizardProvider totalSteps={3} onSubmit={handleFinalSubmit}>\n *   <Stepper ... />\n *   <StepContent />\n *   <WizardControls />\n * </WizardProvider>\n * ```\n */\nexport const WizardProvider: FC<WizardProviderProps> = ({\n  totalSteps,\n  initialStep = 0,\n  onSubmit,\n  onStepChange,\n  children,\n}) => {\n  const [currentStep, setCurrentStep] = useState(initialStep);\n  const [completed, setCompleted] = useState(false);\n\n  const changeStep = useCallback(\n    (newStep: number) => {\n      setCurrentStep((prev) => {\n        if (newStep === prev) return prev;\n        if (newStep < 0 || newStep >= totalSteps) return prev;\n        onStepChange?.(newStep, prev);\n        return newStep;\n      });\n    },\n    [totalSteps, onStepChange],\n  );\n\n  const nextStep = useCallback(() => {\n    changeStep(currentStep + 1);\n  }, [changeStep, currentStep]);\n\n  const prevStep = useCallback(() => {\n    changeStep(currentStep - 1);\n  }, [changeStep, currentStep]);\n\n  const goToStep = useCallback(\n    (stepNumber: number) => {\n      changeStep(stepNumber);\n    },\n    [changeStep],\n  );\n\n  const submitStep = useCallback(() => {\n    setCompleted(true);\n    onSubmit?.(currentStep);\n  }, [currentStep, onSubmit]);\n\n  const reset = useCallback(() => {\n    setCurrentStep(initialStep);\n    setCompleted(false);\n  }, [initialStep]);\n\n  const value = useMemo<WizardContextValue>(\n    () => ({\n      currentStep,\n      totalSteps,\n      isFirst: currentStep === 0,\n      isLast: currentStep === totalSteps - 1,\n      completed,\n      nextStep,\n      prevStep,\n      goToStep,\n      submitStep,\n      reset,\n    }),\n    [\n      currentStep,\n      totalSteps,\n      completed,\n      nextStep,\n      prevStep,\n      goToStep,\n      submitStep,\n      reset,\n    ],\n  );\n\n  return (\n    <WizardContext.Provider value={value}>{children}</WizardContext.Provider>\n  );\n};\n","import { useContext } from 'react';\nimport { WizardContext, type WizardContextValue } from './WizardContext';\n\n/**\n * Hook para consumir el `WizardContext` desde cualquier descendiente de\n * `<WizardProvider>`.\n *\n * Si se llama fuera de un provider, devuelve los valores por defecto (no-op)\n * para mantener compatibilidad con el hook original de fri-web-components.\n */\nexport function useWizard(): WizardContextValue {\n  return useContext(WizardContext);\n}\n"],"names":[],"mappings":";;AA4CA,MAAM,eAAmC;AAAA,EACvC,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,UAAU,MAAM;AAAA,EAAC;AAAA,EACjB,UAAU,MAAM;AAAA,EAAC;AAAA,EACjB,UAAU,MAAM;AAAA,EAAC;AAAA,EACjB,YAAY,MAAM;AAAA,EAAC;AAAA,EACnB,OAAO,MAAM;AAAA,EAAC;AAChB;AAEO,MAAM,gBAAgB,cAAkC,YAAY;AAiCpE,MAAM,iBAA0C,CAAC;AAAA,EACtD;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,WAAW;AAC1D,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAEhD,QAAM,aAAa;AAAA,IACjB,CAAC,YAAoB;AACnB,qBAAe,CAAC,SAAS;AACvB,YAAI,YAAY,KAAM,QAAO;AAC7B,YAAI,UAAU,KAAK,WAAW,WAAY,QAAO;AACjD,qDAAe,SAAS;AACxB,eAAO;AAAA,MACT,CAAC;AAAA,IACH;AAAA,IACA,CAAC,YAAY,YAAY;AAAA,EAAA;AAG3B,QAAM,WAAW,YAAY,MAAM;AACjC,eAAW,cAAc,CAAC;AAAA,EAC5B,GAAG,CAAC,YAAY,WAAW,CAAC;AAE5B,QAAM,WAAW,YAAY,MAAM;AACjC,eAAW,cAAc,CAAC;AAAA,EAC5B,GAAG,CAAC,YAAY,WAAW,CAAC;AAE5B,QAAM,WAAW;AAAA,IACf,CAAC,eAAuB;AACtB,iBAAW,UAAU;AAAA,IACvB;AAAA,IACA,CAAC,UAAU;AAAA,EAAA;AAGb,QAAM,aAAa,YAAY,MAAM;AACnC,iBAAa,IAAI;AACjB,yCAAW;AAAA,EACb,GAAG,CAAC,aAAa,QAAQ,CAAC;AAE1B,QAAM,QAAQ,YAAY,MAAM;AAC9B,mBAAe,WAAW;AAC1B,iBAAa,KAAK;AAAA,EACpB,GAAG,CAAC,WAAW,CAAC;AAEhB,QAAM,QAAQ;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA,SAAS,gBAAgB;AAAA,MACzB,QAAQ,gBAAgB,aAAa;AAAA,MACrC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAGF,SACE,oBAAC,cAAc,UAAd,EAAuB,OAAe,SAAA,CAAS;AAEpD;AC3JO,SAAS,YAAgC;AAC9C,SAAO,WAAW,aAAa;AACjC;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soyfri/shared-library",
-  "version": "1.5.0",
+  "version": "2.0.0-beta.1",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",

package/src/components/ActionMenu/ActionMenu.stories.tsx

@@ -0,0 +1,230 @@
+import React from 'react';
+import type { Meta, StoryObj } from '@storybook/react';
+import { fn } from '@storybook/test';
+import {
+  Box,
+  Button,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableRow,
+  Paper,
+  Chip,
+} from '@mui/material';
+import EditIcon from '@mui/icons-material/Edit';
+import ContentCopyIcon from '@mui/icons-material/ContentCopy';
+import DeleteIcon from '@mui/icons-material/Delete';
+import VisibilityIcon from '@mui/icons-material/Visibility';
+import DownloadIcon from '@mui/icons-material/Download';
+import ShareIcon from '@mui/icons-material/Share';
+import MoreHorizIcon from '@mui/icons-material/MoreHoriz';
+
+import { ActionMenu } from './ActionMenu';
+
+const meta: Meta<typeof ActionMenu> = {
+  title: 'Components/ActionMenu',
+  component: ActionMenu,
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component:
+          'Menú de acciones compacto pensado para celdas de tabla, cabeceras y cualquier lugar donde hagan falta acciones secundarias detrás de un trigger. Reemplaza los patrones `<Dropdown>` de react-bootstrap.',
+      },
+    },
+  },
+};
+
+export default meta;
+type Story = StoryObj<typeof ActionMenu>;
+
+// ── Stories ──────────────────────────────────────────────────────────────
+
+export const Default: Story = {
+  args: {
+    items: [
+      { label: 'Editar', icon: <EditIcon fontSize="small" />, onClick: fn() },
+      { label: 'Duplicar', icon: <ContentCopyIcon fontSize="small" />, onClick: fn() },
+      { label: 'Ver detalle', icon: <VisibilityIcon fontSize="small" />, onClick: fn() },
+    ],
+  },
+  parameters: {
+    docs: {
+      description: {
+        story:
+          'Menú básico con trigger de 3 puntos (icono por defecto). Cada item tiene label + icono + onClick.',
+      },
+    },
+  },
+};
+
+export const WithDangerItem: Story = {
+  args: {
+    items: [
+      { label: 'Editar', icon: <EditIcon fontSize="small" />, onClick: fn() },
+      { label: 'Duplicar', icon: <ContentCopyIcon fontSize="small" />, onClick: fn() },
+      {
+        label: 'Eliminar',
+        icon: <DeleteIcon fontSize="small" />,
+        onClick: fn(),
+        danger: true,
+        dividerBefore: true,
+      },
+    ],
+  },
+  parameters: {
+    docs: {
+      description: {
+        story:
+          'Item final marcado como `danger` (pintado en rojo) con `dividerBefore: true` para separarlo visualmente del resto. Patrón típico para acciones destructivas.',
+      },
+    },
+  },
+};
+
+export const WithDisabledItems: Story = {
+  args: {
+    items: [
+      { label: 'Editar', icon: <EditIcon fontSize="small" />, onClick: fn() },
+      {
+        label: 'Exportar',
+        icon: <DownloadIcon fontSize="small" />,
+        onClick: fn(),
+        disabled: true,
+      },
+      {
+        label: 'Compartir',
+        icon: <ShareIcon fontSize="small" />,
+        onClick: fn(),
+        disabled: true,
+      },
+    ],
+  },
+  parameters: {
+    docs: {
+      description: {
+        story:
+          'Items deshabilitados condicionalmente — útil cuando una acción no aplica al estado actual del row (ej. exportar un recurso que aún no se procesó).',
+      },
+    },
+  },
+};
+
+export const CustomTrigger: Story = {
+  args: {
+    items: [
+      { label: 'Editar', icon: <EditIcon fontSize="small" />, onClick: fn() },
+      { label: 'Duplicar', icon: <ContentCopyIcon fontSize="small" />, onClick: fn() },
+      { label: 'Eliminar', icon: <DeleteIcon fontSize="small" />, onClick: fn(), danger: true },
+    ],
+    trigger: (
+      <Button variant="outlined" startIcon={<MoreHorizIcon />}>
+        Más
+      </Button>
+    ),
+  },
+  parameters: {
+    docs: {
+      description: {
+        story:
+          'El trigger por defecto es un IconButton de 3 puntos, pero podés pasar cualquier nodo (botón, chip, icono custom). El `onClick` del menú se inyecta automáticamente al trigger clonado.',
+      },
+    },
+  },
+};
+
+export const InsideTableCell: Story = {
+  render: () => {
+    const rows = [
+      { id: 1, name: 'Comercio A', status: 'Activo' },
+      { id: 2, name: 'Comercio B', status: 'Pendiente' },
+      { id: 3, name: 'Comercio C', status: 'Suspendido' },
+    ];
+
+    return (
+      <Paper sx={{ maxWidth: 720 }}>
+        <Table size="small">
+          <TableHead>
+            <TableRow>
+              <TableCell>ID</TableCell>
+              <TableCell>Comercio</TableCell>
+              <TableCell>Estado</TableCell>
+              <TableCell align="right">Acciones</TableCell>
+            </TableRow>
+          </TableHead>
+          <TableBody>
+            {rows.map((row) => (
+              <TableRow key={row.id} hover>
+                <TableCell>{row.id}</TableCell>
+                <TableCell>{row.name}</TableCell>
+                <TableCell>
+                  <Chip
+                    label={row.status}
+                    size="small"
+                    color={
+                      row.status === 'Activo'
+                        ? 'success'
+                        : row.status === 'Pendiente'
+                          ? 'warning'
+                          : 'error'
+                    }
+                  />
+                </TableCell>
+                <TableCell align="right">
+                  <ActionMenu
+                    items={[
+                      {
+                        label: 'Ver detalle',
+                        icon: <VisibilityIcon fontSize="small" />,
+                        onClick: fn(() => console.log('Ver', row.id)),
+                      },
+                      {
+                        label: 'Editar',
+                        icon: <EditIcon fontSize="small" />,
+                        onClick: fn(() => console.log('Editar', row.id)),
+                      },
+                      {
+                        label: 'Eliminar',
+                        icon: <DeleteIcon fontSize="small" />,
+                        onClick: fn(() => console.log('Eliminar', row.id)),
+                        danger: true,
+                        dividerBefore: true,
+                      },
+                    ]}
+                  />
+                </TableCell>
+              </TableRow>
+            ))}
+          </TableBody>
+        </Table>
+      </Paper>
+    );
+  },
+  parameters: {
+    docs: {
+      description: {
+        story:
+          'Caso de uso principal: un `ActionMenu` por cada fila de una tabla. Reemplaza exactamente el patrón `DropDownActions` + `react-bootstrap Dropdown` usado hoy en Afiliaciones.',
+      },
+    },
+  },
+};
+
+export const DisabledTrigger: Story = {
+  args: {
+    disabled: true,
+    items: [
+      { label: 'Editar', icon: <EditIcon fontSize="small" />, onClick: fn() },
+      { label: 'Eliminar', icon: <DeleteIcon fontSize="small" />, onClick: fn(), danger: true },
+    ],
+  },
+  parameters: {
+    docs: {
+      description: {
+        story:
+          'Cuando el row o la acción no tiene permisos, se puede deshabilitar el trigger entero pasando `disabled`.',
+      },
+    },
+  },
+};