@m4l/components 9.3.12-JT270825.beta.1 → 9.3.12-JT290825.beta.1

package/components/Stepper/Stepper.js

@@ -0,0 +1,77 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useRef, useMemo, Children, isValidElement, cloneElement } from "react";
+import { useFlagsPresent, CommonFlags } from "@m4l/core";
+import { S as StepperRootStyled, C as ContentSectionStyled } from "./slots/StepperSlot.js";
+import { a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
+import { S as STEPPER_PREFIX_NAME } from "./constants.js";
+import { S as StepArea } from "./subcomponents/StepArea/index.js";
+import { C as ContentArea } from "./subcomponents/ContentArea/index.js";
+import { S as StepperProvider } from "./store/StepperContext/index.js";
+import { S as StepperFooter } from "./subcomponents/StepperFooter/index.js";
+import { S as StepperContent } from "./subcomponents/StepperContent/index.js";
+import { u as useStickyStepperFooter } from "./hooks/useStickyStepperFooter/index.js";
+import { u as useComponentSize } from "../../hooks/useComponentSize/useComponentSize.js";
+function Stepper(props) {
+  const { orientation, size, children } = props;
+  const { currentSize } = useComponentSize(size);
+  const containerRef = useRef(null);
+  const contentSectionRef = useRef(null);
+  const stepperFooterSticky = useStickyStepperFooter(
+    containerRef,
+    contentSectionRef
+  );
+  const ownerState = {
+    size: currentSize,
+    orientation,
+    stepperFooterSticky
+  };
+  const classRoot = getComponentSlotRoot(STEPPER_PREFIX_NAME);
+  const { stepperFooter, stepperContent } = useMemo(() => {
+    let footer = null;
+    let content = null;
+    let footerCount = 0;
+    let contentCount = 0;
+    if (children) {
+      Children.forEach(children, (child) => {
+        if (isValidElement(child)) {
+          if (child.type === StepperFooter) {
+            footerCount++;
+            if (footerCount > 1) {
+              throw new Error(
+                "Stepper: Solo se permite un componente StepperFooter. Se encontraron múltiples StepperFooter."
+              );
+            }
+            footer = child;
+          } else if (child.type === StepperContent) {
+            contentCount++;
+            if (contentCount > 1) {
+              throw new Error(
+                "Stepper: Solo se permite un componente StepperContent. Se encontraron múltiples StepperContent."
+              );
+            }
+            content = child;
+          } else {
+            throw new Error(
+              "Stepper: Solo se permiten componentes StepperContent y StepperFooter como hijos."
+            );
+          }
+        }
+      });
+    }
+    return { stepperFooter: footer, stepperContent: content };
+  }, [children]);
+  const hasPresentFlags = useFlagsPresent([CommonFlags.FLAG_DICTIONARY_LOADED]);
+  if (!hasPresentFlags) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(StepperProvider, { ...props, children: /* @__PURE__ */ jsxs(StepperRootStyled, { className: classRoot, children: [
+    /* @__PURE__ */ jsxs(ContentSectionStyled, { ownerState, children: [
+      /* @__PURE__ */ jsx(StepArea, {}),
+      /* @__PURE__ */ jsx(ContentArea, { children: stepperContent })
+    ] }),
+    stepperFooter && cloneElement(stepperFooter, { ownerState })
+  ] }) });
+}
+export {
+  Stepper as S
+};

package/components/Stepper/Stepper.styles.js

@@ -0,0 +1,289 @@
+import { g as getSizeStyles } from "../../utils/getSizeStyles/getSizeStyles.js";
+const stepperStyles = {
+  /**
+   *
+   * Estilos para el contenedor principal del Stepper.
+   */
+  stepperRoot: ({ theme, ownerState }) => ({
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: ownerState?.stepperFooterSticky ? "flex-start" : "space-between",
+    background: theme.vars.palette.background.default,
+    width: "100%",
+    height: "100%",
+    borderRadius: theme.vars.size.borderRadius.r1
+  }),
+  /**
+   * Estilos para la sección que contiene los pasos del Stepper.
+   */
+  contentSection: ({ theme, ownerState }) => ({
+    display: "flex",
+    flexDirection: ownerState?.orientation === "vertical" || theme.generalSettings.isMobile ? "column" : "row",
+    gap: theme.vars.size.baseSpacings.sp8
+  }),
+  /**
+   * Estilos para la sección que contiene los botones de acción del Stepper.
+   */
+  stepArea: ({ theme, ownerState }) => ({
+    ...ownerState?.orientation === "vertical" || theme.generalSettings.isMobile ? {
+      display: "flex",
+      alignItems: "start",
+      width: "100%",
+      minWidth: "350px",
+      overflowX: "auto"
+    } : {
+      maxWidth: "116px"
+    }
+  }),
+  /**
+   * Estilos para el área de contenido del Stepper.
+   */
+  contentArea: ({ theme, ownerState }) => ({
+    flex: 1,
+    display: "flex",
+    flexDirection: "column",
+    gap: theme.vars.size.baseSpacings.sp6,
+    ...ownerState?.orientation === "vertical" || theme.generalSettings.isMobile ? {
+      borderTop: "1px solid",
+      paddingTop: theme.vars.size.baseSpacings.sp8
+    } : {
+      borderLeft: "1px solid",
+      paddingLeft: theme.vars.size.baseSpacings.sp8
+    },
+    borderColor: theme.vars.palette?.border.disabled
+  }),
+  /**
+   * Estilos para cada paso del Stepper.
+   */
+  step: ({ theme, ownerState }) => {
+    const currentStep = ownerState?.currentStep ?? 0;
+    const step = ownerState?.step ?? 0;
+    const totalSteps = ownerState?.totalSteps ?? 0;
+    const isCompleted = currentStep > step;
+    const isLastStep = step === totalSteps - 1;
+    return {
+      cursor: "pointer",
+      display: "flex",
+      flexDirection: ownerState?.orientation === "vertical" || theme.generalSettings.isMobile ? "column" : "row",
+      alignItems: ownerState?.orientation === "vertical" || theme.generalSettings.isMobile ? "center" : "start",
+      justifyContent: ownerState?.visibleTitle ? "space-between" : "center",
+      gap: ownerState?.orientation === "vertical" || theme.generalSettings.isMobile ? theme.vars.size.baseSpacings.sp1 : theme.vars.size.baseSpacings.sp4,
+      width: "100%",
+      ...(ownerState?.orientation === "vertical" || theme.generalSettings.isMobile) && {
+        minWidth: theme.vars.size.baseSpacings.sp10
+      },
+      height: ownerState?.orientation === "vertical" || theme.generalSettings.isMobile ? "auto" : theme.vars.size.baseSpacings.sp13,
+      position: "relative",
+      ...!isLastStep && (ownerState?.orientation === "vertical" || theme.generalSettings.isMobile) && {
+        "&::after": {
+          content: '""',
+          position: "absolute",
+          top: ownerState?.orientation === "horizontal" && theme.generalSettings.isMobile ? "16px" : "10px",
+          // Ajustado para coincidir con el centro del indicador cuando alignItems es start
+          height: "1px",
+          borderTop: `1px ${isCompleted ? "solid" : "dashed"} ${isCompleted ? theme.vars.palette.primary.enabled : theme.vars.palette.border.default}`,
+          left: "50%",
+          width: "100%"
+        }
+      }
+    };
+  },
+  /**
+   * Estilos para el nombre del paso dentro del Stepper.
+   */
+  stepName: ({ theme, ownerState }) => ({
+    ...ownerState?.orientation === "horizontal" && {
+      height: theme.generalSettings.isMobile ? theme.vars.size.mobile.medium.action : theme.vars.size.desktop.large.action
+    },
+    ...(ownerState?.orientation === "vertical" || theme.generalSettings.isMobile) && {
+      maxWidth: "120px",
+      width: "100%",
+      lineHeight: "1.2",
+      marginTop: theme.vars.size.baseSpacings.sp1
+    },
+    alignContent: "center",
+    cursor: "pointer",
+    overflow: "hidden",
+    ...theme.generalSettings.isMobile ? {
+      display: "none"
+    } : {
+      display: ownerState?.visibleTitle ? "-webkit-box" : "none"
+    },
+    WebkitBoxOrient: "vertical",
+    WebkitLineClamp: 2,
+    textOverflow: "ellipsis",
+    flex: 1,
+    minWidth: 0,
+    whiteSpace: "normal",
+    order: ownerState?.orientation === "vertical" || theme.generalSettings.isMobile ? 1 : 0,
+    "&.M4LTypography-root": {
+      color: (ownerState?.currentStep ?? 0) > (ownerState?.step ?? 0) ? theme.vars.palette.primary.semanticText : (ownerState?.currentStep ?? 0) === (ownerState?.step ?? 0) ? theme.vars.palette.text.primary : theme.vars.palette.text.secondary,
+      textAlign: ownerState?.orientation === "vertical" || theme.generalSettings.isMobile ? "center" : "right"
+    }
+  }),
+  /**
+   * Estilos para el indicador numérico de cada paso del Stepper.
+   */
+  indicator: ({ theme, ownerState }) => {
+    const currentStep = ownerState?.currentStep ?? 0;
+    const step = ownerState?.step ?? 0;
+    const totalSteps = ownerState?.totalSteps ?? 0;
+    const isCompleted = currentStep > step;
+    const isCurrent = currentStep === step;
+    const isLastStep = step === totalSteps - 1;
+    const isValidStep = ownerState?.stepValidationStatus?.[step] ?? true;
+    return {
+      ...ownerState?.orientation === "horizontal" && {
+        marginTop: theme.generalSettings.isMobile ? "6px" : theme.vars.size.baseSpacings.sp1
+      },
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      order: ownerState?.orientation === "vertical" || theme.generalSettings.isMobile ? 0 : 1,
+      ...getSizeStyles(theme, ownerState?.size || "medium", "case", (size) => {
+        return {
+          width: size,
+          height: size
+        };
+      }),
+      background: isCompleted ? ownerState?.indicatorType === "dot" || theme.generalSettings.isMobile ? theme.vars.palette.background.default : theme.vars.palette.primary.toneOpacity : !isValidStep ? theme.vars.palette.error.enabled : ownerState?.indicatorType === "dot" || theme.generalSettings.isMobile ? theme.vars.palette.background.default : isCurrent ? theme.vars.palette.primary.enabled : theme.vars.palette.default.enabled,
+      borderRadius: theme.vars.size.borderRadius.r2,
+      ...ownerState?.indicatorType === "number" && !theme.generalSettings.isMobile && {
+        boxShadow: isCurrent ? "0 2px 8px 0 rgb(0, 100, 255, 0.16)" : "none"
+      },
+      position: "relative",
+      zIndex: 1,
+      textAlign: "center",
+      "& > div": {
+        position: "absolute",
+        top: "50%",
+        left: "50%",
+        transform: "translate(-50%, -50%)"
+      },
+      ...!isLastStep && ownerState?.orientation === "horizontal" && !theme.generalSettings.isMobile && {
+        "&::after": {
+          content: '""',
+          position: "absolute",
+          top: "100%",
+          left: "50%",
+          transform: "translateX(-50%)",
+          width: "1px",
+          height: theme.vars.size.baseSpacings.sp12,
+          borderLeft: `1px ${isCompleted ? "solid" : "dashed"} ${isCompleted ? theme.vars.palette.primary.enabled : theme.vars.palette.border.default}`
+        }
+      }
+    };
+  },
+  /**
+   * Estilos para el número de texto dentro del indicador numérico del Stepper.
+   */
+  textNumber: ({ theme, ownerState }) => {
+    const currentStep = ownerState?.currentStep ?? 0;
+    const step = ownerState?.step ?? 0;
+    const isCompleted = currentStep > step;
+    const isCurrent = currentStep === step;
+    return {
+      "&.M4LTypography-root": {
+        color: isCompleted || isCurrent ? theme.vars.palette.primary.contrastText : theme.vars.palette.text.primary
+      }
+    };
+  },
+  /**
+   * Estilos para el área de contenido del Stepper.
+   */
+  contentAreaHeader: ({ theme }) => ({
+    display: "flex",
+    alignItems: "center",
+    gap: theme.size.baseSpacings.sp3
+  }),
+  /**
+   * Estilos para el contenedor del icono del titulo del Stepper.
+   */
+  wrapperIcon: ({ theme, ownerState }) => ({
+    ...getSizeStyles(theme, ownerState?.size || "medium", "box", (size) => {
+      return {
+        width: size,
+        height: size
+      };
+    }),
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    background: theme.vars.palette.primary.enabledOpacity,
+    borderRadius: theme.vars.size.borderRadius["r1-5"]
+  }),
+  /**
+   * Estilos para el título del Stepper.
+   */
+  wrapperTitle: ({ theme }) => ({
+    color: theme.vars.palette.text.primary,
+    display: "flex",
+    flexDirection: "column",
+    gap: theme.vars.size.baseSpacings["sp0-5"]
+  }),
+  /**
+   * Estilos para el icono del Stepper.
+   */
+  icon: ({ theme, ownerState }) => ({
+    ...getSizeStyles(theme, ownerState?.size || "medium", "case", (size) => {
+      return {
+        width: size,
+        height: size
+      };
+    })
+  }),
+  /**
+   * Estilos para el título del Stepper.
+   */
+  title: () => ({}),
+  /**
+   * Estilos para la descripción del Stepper.
+   */
+  description: ({ theme }) => ({
+    "&.M4LTypography-root": {
+      color: theme.vars.palette.text.secondary
+    }
+  }),
+  /**
+   * Estilos para la sección de botones de acción del Stepper.
+   */
+  stepperFooterSection: ({ theme, ownerState }) => ({
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    paddingTop: theme.vars.size.baseSpacings.sp4,
+    ...ownerState?.stepperFooterSticky && {
+      position: "sticky",
+      bottom: 0,
+      backgroundColor: theme.vars.palette.background.default,
+      marginTop: "auto",
+      zIndex: 10
+    }
+  }),
+  /**
+   * Estilos para las acciones del lado izquierdo del StepperFooter.
+   */
+  stepperFooterLeftActions: ({ theme }) => ({
+    display: "flex",
+    alignItems: "center",
+    gap: theme.vars.size.baseSpacings.sp3
+  }),
+  /**
+   * Estilos para las acciones del lado derecho del StepperFooter.
+   */
+  stepperFooterRightActions: ({ theme }) => ({
+    display: "flex",
+    alignItems: "center",
+    gap: theme.vars.size.baseSpacings.sp3
+  }),
+  /**
+   * Estilos para el contenedor de los botones del Stepper.
+   */
+  wrapperButtons: ({ theme }) => ({
+    display: "flex",
+    gap: theme.size.baseSpacings.sp3
+  })
+};
+export {
+  stepperStyles as s
+};

package/components/Stepper/constants.js

@@ -0,0 +1,6 @@
+const STEPPER_PREFIX_NAME = "M4LStepper";
+const STEPPER_STORE_ID = "M4LStepperStore";
+export {
+  STEPPER_PREFIX_NAME as S,
+  STEPPER_STORE_ID as a
+};

package/components/Stepper/dictionary.js

@@ -0,0 +1,14 @@
+const STEPPER_DICTIONARY_ID = "stepper";
+function getStepperComponentsDictionary() {
+  return [STEPPER_DICTIONARY_ID];
+}
+const DICTIONARY = {
+  LABEL_PREV_BUTTON: `${STEPPER_DICTIONARY_ID}.label_prev_button`,
+  LABEL_NEXT_BUTTON: `${STEPPER_DICTIONARY_ID}.label_next_button`,
+  LABEL_CANCEL_BUTTON: `${STEPPER_DICTIONARY_ID}.label_cancel_button`,
+  LABEL_SUBMIT_BUTTON: `${STEPPER_DICTIONARY_ID}.label_submit_button`
+};
+export {
+  DICTIONARY as D,
+  getStepperComponentsDictionary as g
+};

package/components/Stepper/helpers/evaluateVisibilityStepCondition/index.js

@@ -0,0 +1,17 @@
+const evaluateVisibilityStepCondition = (step, formData, visibilityData) => {
+  if (!step.visibilityCondition) {
+    return true;
+  }
+  try {
+    return step.visibilityCondition(formData || {}, visibilityData);
+  } catch (error) {
+    console.error(
+      `Error evualuando la condición del step "${step.key}":`,
+      error
+    );
+    return false;
+  }
+};
+export {
+  evaluateVisibilityStepCondition as e
+};

package/components/Stepper/helpers/findNextVisibleValidStep/index.js

@@ -0,0 +1,13 @@
+import { e as evaluateVisibilityStepCondition } from "../evaluateVisibilityStepCondition/index.js";
+const findNextVisibleValidStep = (currentStepIndex, steps, formData, visibilityData) => {
+  for (let i = currentStepIndex + 1; i < steps.length; i++) {
+    const step = steps[i];
+    if (evaluateVisibilityStepCondition(step, formData || {}, visibilityData)) {
+      return i;
+    }
+  }
+  return steps.length;
+};
+export {
+  findNextVisibleValidStep as f
+};

package/components/Stepper/helpers/findPrevVisibleValidStep/index.js

@@ -0,0 +1,13 @@
+import { e as evaluateVisibilityStepCondition } from "../evaluateVisibilityStepCondition/index.js";
+const findPrevVisibleValidStep = (currentStepIndex, steps, formData, visibilityData) => {
+  for (let i = currentStepIndex - 1; i >= 0; i--) {
+    const step = steps[i];
+    if (evaluateVisibilityStepCondition(step, formData || {}, visibilityData)) {
+      return i;
+    }
+  }
+  return -1;
+};
+export {
+  findPrevVisibleValidStep as f
+};

package/components/Stepper/helpers/index.js

@@ -0,0 +1 @@
+

package/components/Stepper/helpers/isLastVisibleValidStep/index.js

@@ -0,0 +1,16 @@
+import { e as evaluateVisibilityStepCondition } from "../evaluateVisibilityStepCondition/index.js";
+const isLastVisibleValidStep = (currentStepIndex, steps, formData, visibilityData) => {
+  if (!steps || currentStepIndex >= steps.length || currentStepIndex < 0) {
+    return false;
+  }
+  for (let i = currentStepIndex + 1; i < steps.length; i++) {
+    const step = steps[i];
+    if (evaluateVisibilityStepCondition(step, formData || {}, visibilityData)) {
+      return false;
+    }
+  }
+  return true;
+};
+export {
+  isLastVisibleValidStep as i
+};

package/components/Stepper/hooks/useIsLastVisibleValidStep/index.js

@@ -0,0 +1,16 @@
+import { useFormContext } from "react-hook-form";
+import { u as useStepper } from "../useStepper/index.js";
+import { i as isLastVisibleValidStep } from "../../helpers/isLastVisibleValidStep/index.js";
+const useIsLastVisibleValidStep = () => {
+  const { getValues } = useFormContext();
+  const { currentStep, steps, visibilityData } = useStepper((state) => ({
+    currentStep: state.currentStep,
+    steps: state.steps,
+    visibilityData: state.visibilityData
+  }));
+  const formData = getValues();
+  return isLastVisibleValidStep(currentStep, steps || [], formData, visibilityData);
+};
+export {
+  useIsLastVisibleValidStep as u
+};

package/components/Stepper/hooks/useStepper/index.js

@@ -0,0 +1,20 @@
+import { useContext } from "react";
+import { useStore } from "zustand";
+import { shallow } from "zustand/shallow";
+import { a as StepperContext } from "../../store/StepperContext/index.js";
+function useStepper(selector, equalityFn) {
+  const context = useContext(StepperContext);
+  if (!context) {
+    throw new Error(
+      "useStepperStore context must be use inside StepperContext"
+    );
+  }
+  const { store } = context;
+  const storeData = useStore(store, selector, equalityFn ?? shallow);
+  return {
+    ...storeData
+  };
+}
+export {
+  useStepper as u
+};

package/components/Stepper/hooks/useStepperActions/index.js

@@ -0,0 +1 @@
+

package/components/Stepper/hooks/useStepperActions/useStepperActions.js

@@ -0,0 +1,63 @@
+import { u as useStepper } from "../useStepper/index.js";
+import { useFormContext } from "react-hook-form";
+function useStepperActions() {
+  const { trigger, clearErrors, getValues, reset } = useFormContext();
+  const {
+    nextStep,
+    prevStep,
+    currentStep,
+    steps,
+    setStepValidationStatus,
+    resetStepper
+  } = useStepper((state) => ({
+    nextStep: state.actions.nextStep,
+    prevStep: state.actions.prevStep,
+    currentStep: state.currentStep,
+    steps: state.steps,
+    setStepValidationStatus: state.actions.setStepValidationStatus,
+    resetStepper: state.actions.resetStepper
+  }));
+  const prevStepAction = () => {
+    const formData = getValues();
+    prevStep(formData);
+  };
+  const nextStepAction = async () => {
+    const formData = getValues();
+    const futureSteps = steps.slice(currentStep + 1);
+    const futureFields = [];
+    futureSteps.forEach((step) => {
+      if (step.validationFields) {
+        futureFields.push(...step.validationFields);
+      }
+    });
+    const validateFn = async () => {
+      const currentStepData = steps[currentStep];
+      const fieldsToValidate = currentStepData?.validationFields || [];
+      if (fieldsToValidate.length === 0) {
+        return true;
+      }
+      return await trigger(fieldsToValidate);
+    };
+    const success = await nextStep(validateFn, formData);
+    if (success && futureFields.length > 0) {
+      clearErrors(futureFields);
+      setTimeout(() => {
+        clearErrors(futureFields);
+        futureSteps.forEach((_, index) => {
+          const stepIndex = currentStep + 1 + index;
+          setStepValidationStatus(stepIndex, true);
+        });
+      }, 100);
+    }
+    return success;
+  };
+  const cancelAction = () => {
+    reset();
+    clearErrors();
+    resetStepper();
+  };
+  return { prevStepAction, nextStepAction, cancelAction };
+}
+export {
+  useStepperActions as u
+};

package/components/Stepper/hooks/useStickyStepperFooter/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Hook para determinar cuando el footer del Stepper debe usar posición sticky.
+ * @param containerRef - Referencia al contenedor del Stepper
+ * @param contentRef - Referencia al área de contenido del Stepper
+ * @returns boolean - true si el footer debe ser sticky, false en caso contrario
+ */
+export declare function useStickyStepperFooter(containerRef: React.RefObject<HTMLDivElement>, contentRef: React.RefObject<HTMLElement>): boolean;

package/components/Stepper/hooks/useStickyStepperFooter/index.js

@@ -0,0 +1,20 @@
+import { useMemo } from "react";
+import { u as useSizeContainer } from "../../../../hooks/useSizeContainer/index.js";
+function useStickyStepperFooter(containerRef, contentRef) {
+  const containerSize = useSizeContainer(containerRef.current);
+  const shouldBeSticky = useMemo(() => {
+    if (!containerRef.current || !contentRef.current) {
+      return false;
+    }
+    const containerHeight = containerRef.current.clientHeight;
+    const contentHeight = contentRef.current.clientHeight;
+    const totalContentHeight = contentHeight + 80;
+    const exceedsContainer = totalContentHeight > containerHeight;
+    const hasMinimumSpace = containerHeight > 120;
+    return exceedsContainer && hasMinimumSpace;
+  }, [containerSize, containerRef, contentRef]);
+  return shouldBeSticky;
+}
+export {
+  useStickyStepperFooter as u
+};

package/components/Stepper/icons.js

@@ -0,0 +1,12 @@
+const pathIcons = {
+  patronum: "frontend/components/step/assets/icons/patronum_fill.svg",
+  arrowLeft: "frontend/components/step/assets/icons/arrow_left.svg",
+  arrowRight: "frontend/components/step/assets/icons/arrow_right.svg",
+  circleCheck: "frontend/components/step/assets/icons/circle_check.svg",
+  circleError: "frontend/components/step/assets/icons/circle_error.svg",
+  dotOutline: "frontend/components/step/assets/icons/dot_outline.svg",
+  dotSelected: "frontend/components/step/assets/icons/dot_selected.svg"
+};
+export {
+  pathIcons as p
+};

package/components/Stepper/index.d.ts

@@ -2,8 +2,13 @@ export { useStepper } from './hooks/useStepper/index';
 export { Stepper } from './Stepper';
 export { StepperContent } from './subcomponents/StepperContent';
 export { Step } from './subcomponents/StepperContent/subcomponents/Step';
-export { StepperFooter, } from './subcomponents/StepperFooter';
-export { StepperFooterLeftActions, } from './subcomponents/StepperFooter/subcomponents/StepperFooterLeftActions';
-export { StepperFooterRightActions, } from './subcomponents/StepperFooter/subcomponents/StepperFooterRightActions';
-export { StepperNextButton, StepperPrevButton, StepperCancelButton, StepperSubmitButton, } from './subcomponents/StepperButtons';
+export { StepperFooter } from './subcomponents/StepperFooter';
+export { StepperFooterLeftActions } from './subcomponents/StepperFooter/subcomponents/StepperFooterLeftActions';
+export { StepperFooterRightActions } from './subcomponents/StepperFooter/subcomponents/StepperFooterRightActions';
+export { StepperNextButton } from './subcomponents/StepperButtons/StepperNextButton';
+export { StepperPrevButton } from './subcomponents/StepperButtons/StepperPrevButton';
+export { StepperCancelButton } from './subcomponents/StepperButtons/StepperCancelButton';
+export { StepperSubmitButton } from './subcomponents/StepperButtons/StepperSubmitButton';
 export { evaluateVisibilityStepCondition } from './helpers/evaluateVisibilityStepCondition';
+export { type Step as TypeStep } from './types';
+export { getStepperComponentsDictionary } from './dictionary';

package/components/Stepper/index.js

@@ -0,0 +1 @@
+

package/components/Stepper/slots/StepperEnum.js

@@ -0,0 +1,36 @@
+var StepperSlots = /* @__PURE__ */ ((StepperSlots2) => {
+  StepperSlots2["stepperRoot"] = "stepperRoot";
+  return StepperSlots2;
+})(StepperSlots || {});
+var ContentSlots = /* @__PURE__ */ ((ContentSlots2) => {
+  ContentSlots2["contentSection"] = "contentSection";
+  ContentSlots2["stepArea"] = "stepArea";
+  ContentSlots2["step"] = "step";
+  ContentSlots2["stepName"] = "stepName";
+  ContentSlots2["indicator"] = "indicator";
+  ContentSlots2["textNumber"] = "textNumber";
+  return ContentSlots2;
+})(ContentSlots || {});
+var ContentAreaSlots = /* @__PURE__ */ ((ContentAreaSlots2) => {
+  ContentAreaSlots2["contentArea"] = "contentArea";
+  ContentAreaSlots2["contentAreaHeader"] = "contentAreaHeader";
+  ContentAreaSlots2["wrapperIcon"] = "wrapperIcon";
+  ContentAreaSlots2["wrapperTitle"] = "wrapperTitle";
+  ContentAreaSlots2["icon"] = "icon";
+  ContentAreaSlots2["title"] = "title";
+  ContentAreaSlots2["description"] = "description";
+  return ContentAreaSlots2;
+})(ContentAreaSlots || {});
+var StepperFooterSlots = /* @__PURE__ */ ((StepperFooterSlots2) => {
+  StepperFooterSlots2["stepperFooterSection"] = "stepperFooterSection";
+  StepperFooterSlots2["stepperFooterLeftActions"] = "stepperFooterLeftActions";
+  StepperFooterSlots2["stepperFooterRightActions"] = "stepperFooterRightActions";
+  StepperFooterSlots2["wrapperButtons"] = "wrapperButtons";
+  return StepperFooterSlots2;
+})(StepperFooterSlots || {});
+export {
+  ContentSlots as C,
+  StepperSlots as S,
+  StepperFooterSlots as a,
+  ContentAreaSlots as b
+};