@axa-fr/canopee-react 1.4.2-alpha.3 → 1.4.2-alpha.37

package/dist/client.d.ts

@@ -74,3 +74,4 @@ export { FormLayout, type FormLayoutProps, } from "./prospect-client/Layout/Form
 export { ValidPage, type ValidPageProps, } from "./prospect-client/pages/ValidPage/ValidPageLF";
 export { ErrorPage, type ErrorPageProps, } from "./prospect-client/pages/ErrorPage/ErrorPageLF";
 export type { GridContainerProps } from "./prospect-client/utilities/types/GridContainerProps";
+export { Loader, type LoaderProps } from "./prospect-client/Loader/LoaderLF";

package/dist/client.js

@@ -73,3 +73,4 @@ export { ExitLayout, } from "./prospect-client/Layout/ExitLayout/ExitLayoutLF";
 export { FormLayout, } from "./prospect-client/Layout/FormLayout/FormLayout";
 export { ValidPage, } from "./prospect-client/pages/ValidPage/ValidPageLF";
 export { ErrorPage, } from "./prospect-client/pages/ErrorPage/ErrorPageLF";
+export { Loader } from "./prospect-client/Loader/LoaderLF";

package/dist/distributeur/Tabs/components/Tab.d.ts

@@ -4,7 +4,10 @@ export type TabProps = {
     title: ReactNode;
     children?: ReactNode;
     className?: string;
+    /**
+     * @deprecated Use className instead
+     */
     classModifier?: string;
 };
-declare const Tab: () => import("react/jsx-runtime").JSX.Element;
+declare const Tab: () => null;
 export { Tab };

package/dist/distributeur/Tabs/components/Tab.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx } from "react/jsx-runtime";
 import "@axa-fr/canopee-css/distributeur/Tabs/Tabs.css";
-const Tab = () => _jsx("span", {});
+const Tab = () => null;
 export { Tab };

package/dist/distributeur/Tabs/components/TabsCore.d.ts

@@ -1,10 +1,9 @@
-import React from "react";
+import { type FormEvent } from "react";
 import { type TabsStatelessProps } from "./TabsStateless";
 type Tabs = {
-    onChange?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    onChange?: (event: FormEvent<HTMLButtonElement>) => void;
     activeIndex?: string;
 };
 export type TabsCoreProps = Tabs & Omit<TabsStatelessProps, "activeIndex">;
-export declare const onChangeEvent: (onChange?: (event: React.MouseEvent<HTMLButtonElement>) => void) => (setState: (newValue: string) => void) => (event: React.MouseEvent<HTMLButtonElement>, index: string) => void;
-declare const TabsCore: React.FunctionComponent<TabsCoreProps>;
+declare const TabsCore: ({ activeIndex: activeIndexProp, onChange, ...otherProps }: TabsCoreProps) => import("react/jsx-runtime").JSX.Element;
 export { TabsCore };

package/dist/distributeur/Tabs/components/TabsCore.js

@@ -1,17 +1,20 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import React, { useState } from "react";
+import { useEffect, useState } from "react";
 import { TabsStateless } from "./TabsStateless";
 const DEFAULT_ACTIVE_INDEX = "0";
-export const onChangeEvent = (onChange) => (setState) => (event, index) => {
-    if (onChange) {
-        onChange(event);
-    }
-    if (index) {
-        setState(index);
-    }
-};
-const TabsCore = ({ activeIndex = DEFAULT_ACTIVE_INDEX, onChange, ...otherProps }) => {
-    const [stateActiveIndex, setActiveIndex] = useState(activeIndex);
-    return (_jsx(TabsStateless, { activeIndex: stateActiveIndex, ...otherProps, onChange: onChangeEvent(onChange)(setActiveIndex) }));
+const TabsCore = ({ activeIndex: activeIndexProp = DEFAULT_ACTIVE_INDEX, onChange, ...otherProps }) => {
+    const [activeIndex, setActiveIndex] = useState(Number(activeIndexProp));
+    // Allow to update activeIndex from props
+    useEffect(() => {
+        setActiveIndex(Number(activeIndexProp));
+    }, [activeIndexProp]);
+    return (_jsx(TabsStateless, { activeIndex: activeIndex, ...otherProps, onChange: (e, index) => {
+            if (onChange) {
+                onChange(e);
+            }
+            if (index >= 0) {
+                setActiveIndex(index);
+            }
+        } }));
 };
 export { TabsCore };

package/dist/distributeur/Tabs/components/TabsStateless.d.ts

@@ -1,13 +1,17 @@
-import { type ReactNode, type MouseEvent } from "react";
-export interface TabsStatelessProps {
-    children: ReactNode;
-    activeIndex: string;
+import { type FormEvent, type ReactElement } from "react";
+import type { TabProps } from "./Tab";
+export type TabsStatelessProps = {
+    children: ReactElement<TabProps> | ReactElement<TabProps>[];
+    activeIndex: number;
     className?: string;
+    /**
+     * @deprecated Use `className` instead
+     */
     classModifier?: string;
-}
-export interface TabsStatelessHandlers {
-    onChange: (event: MouseEvent<HTMLButtonElement>, index: string) => void;
-}
+};
+export type TabsStatelessHandlers = {
+    onChange: (event: FormEvent<HTMLButtonElement>, index: number) => void;
+};
 type Props = TabsStatelessProps & TabsStatelessHandlers;
 declare const TabsStateless: ({ activeIndex, className, classModifier, children, onChange, }: Props) => import("react/jsx-runtime").JSX.Element;
 export { TabsStateless };

package/dist/distributeur/Tabs/components/TabsStateless.js

@@ -1,11 +1,53 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /* eslint-disable react/no-array-index-key */
-import { Children, isValidElement, } from "react";
-import { getComponentClassName } from "../../utilities";
-import { Pane } from "./Pane";
-import { Title } from "./Title";
+import { Children, isValidElement, useId, useRef, } from "react";
+import { getClassName } from "../../utilities/helpers/getClassName";
+function handleKeyDown(event, moveToTab, index, totalNumberOfTabs) {
+    let targetIndex = null;
+    if (event.key === "ArrowLeft") {
+        targetIndex = index - 1;
+    }
+    else if (event.key === "ArrowRight") {
+        targetIndex = index + 1;
+    }
+    else if (event.key === "Home") {
+        targetIndex = 0;
+    }
+    else if (event.key === "End") {
+        targetIndex = totalNumberOfTabs - 1;
+    }
+    if (targetIndex !== null) {
+        moveToTab(event, targetIndex);
+        event.preventDefault();
+        event.stopPropagation();
+    }
+}
 const TabsStateless = ({ activeIndex, className = "af-tabs", classModifier, children, onChange, }) => {
-    const componentClassName = getComponentClassName(className, classModifier);
-    return (_jsxs("div", { className: componentClassName, children: [_jsx("ul", { className: "af-tabs__control", children: Children.map(children, (child, index) => isValidElement(child) && (_jsx(Title, { active: activeIndex === index.toString(), onChange: onChange, id: `${index}`, classModifier: child.props.classModifier, children: child.props.title }, `title-${index}`))) }), _jsx("div", { className: "af-tabs__content", children: Children.map(children, (child, index) => isValidElement(child) && (_jsx(Pane, { active: activeIndex === index.toString(), children: child.props.children }, `pane-${index}`))) })] }));
+    const componentClassName = getClassName({
+        baseClassName: "af-tabs",
+        className,
+        modifiers: classModifier?.split(" "),
+    });
+    const tabRefs = useRef([]);
+    const moveToTab = (event, index) => {
+        if (index < 0 || index >= Children.count(children)) {
+            return;
+        }
+        tabRefs.current[index]?.focus();
+        onChange(event, index);
+    };
+    const id = useId();
+    return (_jsxs("div", { className: componentClassName, role: "tablist", children: [_jsx("ul", { className: "af-tabs__control", children: Children.map(children, (child, index) => isValidElement(child) && (_jsx("li", { className: getClassName({
+                        className,
+                        modifiers: [activeIndex === index && "active"],
+                        baseClassName: "af-tabs__item",
+                    }), children: _jsx("button", { type: "button", id: `${id}-tab-${index}`, ref: (el) => {
+                            tabRefs.current[index] = el;
+                        }, "aria-controls": `${id}-pane-${index}`, onChange: (event) => onChange(event, index), onKeyDown: (event) => {
+                            handleKeyDown(event, moveToTab, index, Children.count(children));
+                        }, className: "af-tabs__link", onClick: (event) => onChange(event, index), tabIndex: activeIndex === index ? 0 : -1, children: child.props.title }) }))) }), _jsx("div", { className: "af-tabs__content", children: Children.map(children, (child, index) => isValidElement(child) && (_jsx("div", { id: `${id}-pane-${index}`, "aria-labelledby": `${id}-tab-${index}`, className: getClassName({
+                        baseClassName: "af-tabs__pane",
+                        modifiers: [activeIndex === index && "active"],
+                    }), role: "tabpanel", tabIndex: 0, children: child.props.children }, `pane-${index}`))) })] }));
 };
 export { TabsStateless };

package/dist/prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxApollo.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { ItemMessage } from "../../ItemMessage/ItemMessageApollo";
 import { CardCheckboxOption } from "../CardCheckboxOption/CardCheckboxOptionApollo";
+import { CheckboxText } from "../CheckboxText/CheckboxTextApollo";
 import { CardCheckboxCommon, } from "./CardCheckboxCommon";
 import "@axa-fr/canopee-css/prospect/Form/Checkbox/CardCheckbox/CardCheckboxApollo.css";
-export const CardCheckbox = (props) => (_jsx(CardCheckboxCommon, { ...props, CardCheckboxItemComponent: CardCheckboxOption, ItemMessageComponent: ItemMessage }));
+export const CardCheckbox = (props) => (_jsx(CardCheckboxCommon, { ...props, CardCheckboxItemComponent: CardCheckboxOption, CheckboxTextComponent: CheckboxText, ItemMessageComponent: ItemMessage }));
 CardCheckbox.displayName = "CardCheckbox";

package/dist/prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxCommon.d.ts

@@ -2,9 +2,11 @@ import { type ComponentType, type ReactNode } from "react";
 import type { GridContainerProps } from "../../../utilities/types/GridContainerProps";
 import type { ItemMessageProps } from "../../ItemMessage/ItemMessageCommon";
 import type { CardCheckboxOptionProps } from "../CardCheckboxOption/CardCheckboxOptionCommon";
+import type { CheckboxTextProps } from "../CheckboxText/CheckboxTextCommon";
 type CheckboxOption = Omit<CardCheckboxOptionProps, "name" | "type">;
 export type CardCheckboxProps = Omit<CardCheckboxOptionProps, "value" | "label" | "type" | "icon" | "description" | "subtitle" | "children"> & {
     type?: "vertical" | "horizontal";
+    mode?: "text";
     /**
      * @deprecated Use `label` instead.
      */
@@ -27,11 +29,12 @@ export type CardCheckboxProps = Omit<CardCheckboxOptionProps, "value" | "label"
     containerProps?: GridContainerProps<"fieldset">;
 } & Partial<ItemMessageProps>;
 type CardCheckboxCommonProps = CardCheckboxProps & {
+    CheckboxTextComponent: ComponentType<CheckboxTextProps>;
     CardCheckboxItemComponent: ComponentType<CardCheckboxOptionProps>;
     ItemMessageComponent: ComponentType<ItemMessageProps>;
 };
 export declare const CardCheckboxCommon: {
-    ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type, error, name, id, onChange, CardCheckboxItemComponent, ItemMessageComponent, message, messageType, containerProps, ...inputProps }: CardCheckboxCommonProps): import("react/jsx-runtime").JSX.Element;
+    ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type, error, name, id, onChange, CardCheckboxItemComponent, CheckboxTextComponent, ItemMessageComponent, message, messageType, containerProps, mode, ...inputProps }: CardCheckboxCommonProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export {};

package/dist/prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxCommon.js

@@ -1,9 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useId, useRef, } from "react";
-export const CardCheckboxCommon = ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type = "vertical", error, name, id, onChange = () => { }, CardCheckboxItemComponent, ItemMessageComponent, message, messageType = "error", containerProps, ...inputProps }) => {
+export const CardCheckboxCommon = ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type = "vertical", error, name, id, onChange = () => { }, CardCheckboxItemComponent, CheckboxTextComponent, ItemMessageComponent, message, messageType = "error", containerProps, mode, ...inputProps }) => {
     const generatedId = useId();
     const cardCheckboxId = id || generatedId;
     const messageId = `${cardCheckboxId}-error`;
+    const CheckboxItemComponent = mode === "text" ? CheckboxTextComponent : CardCheckboxItemComponent;
     const cardCheckboxOptionsRef = useRef(null);
     const handleChange = (event) => {
         const cardCheckboxOptionsEl = cardCheckboxOptionsRef.current;
@@ -26,6 +27,6 @@ export const CardCheckboxCommon = ({ className, labelGroup, descriptionGroup, la
     return (_jsxs("fieldset", { className: ["af-card-checkbox", className].filter(Boolean).join(" "), id: cardCheckboxId, ...containerProps, children: [_jsxs("legend", { className: "af-card-checkbox__legend", children: [_jsxs("p", { className: "af-card-checkbox__label", children: [label, labelGroup, required || isRequired ? _jsx("span", { "aria-hidden": true, children: "*" }) : null] }), description || descriptionGroup ? (_jsxs("p", { className: "af-card-checkbox__description", children: [description, descriptionGroup] })) : null] }), _jsx("div", { className: [
                     "af-card-checkbox__options",
                     `af-card-checkbox__options--${type}`,
-                ].join(" "), ref: cardCheckboxOptionsRef, children: options.map((cardCheckboxItemProps) => (_jsx(CardCheckboxItemComponent, { id: `${cardCheckboxId}-${cardCheckboxItemProps.value}`, required: required, onChange: handleChange, ...inputProps, ...cardCheckboxItemProps, type: type, "aria-invalid": hasError || undefined, "aria-errormessage": hasError ? messageId : undefined, name: name }, `${name ?? cardCheckboxId}-${cardCheckboxItemProps.label}`))) }), _jsx(ItemMessageComponent, { id: messageId, message: message || error, messageType: messageType })] }));
+                ].join(" "), ref: cardCheckboxOptionsRef, children: options.map((cardCheckboxItemProps) => (_jsx(CheckboxItemComponent, { id: `${cardCheckboxId}-${cardCheckboxItemProps.value}`, required: required, onChange: handleChange, ...inputProps, ...cardCheckboxItemProps, type: type, "aria-invalid": hasError || undefined, "aria-errormessage": hasError ? messageId : undefined, name: name }, `${name ?? cardCheckboxId}-${cardCheckboxItemProps.label}`))) }), _jsx(ItemMessageComponent, { id: messageId, message: message || error, messageType: messageType })] }));
 };
 CardCheckboxCommon.displayName = "CardCheckboxCommon";

package/dist/prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxLF.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { ItemMessage } from "../../ItemMessage/ItemMessageLF";
 import { CardCheckboxOption } from "../CardCheckboxOption/CardCheckboxOptionLF";
+import { CheckboxText } from "../CheckboxText/CheckboxTextLF";
 import { CardCheckboxCommon, } from "./CardCheckboxCommon";
 import "@axa-fr/canopee-css/client/Form/Checkbox/CardCheckbox/CardCheckboxLF.css";
-export const CardCheckbox = (props) => (_jsx(CardCheckboxCommon, { ...props, CardCheckboxItemComponent: CardCheckboxOption, ItemMessageComponent: ItemMessage }));
+export const CardCheckbox = (props) => (_jsx(CardCheckboxCommon, { ...props, CardCheckboxItemComponent: CardCheckboxOption, CheckboxTextComponent: CheckboxText, ItemMessageComponent: ItemMessage }));
 CardCheckbox.displayName = "CardCheckbox";

package/dist/prospect-client/List/ContentItemDuo/ContentItemDuoApollo.js

@@ -2,4 +2,5 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import "@axa-fr/canopee-css/prospect/List/ContentItemDuo/ContentItemDuoApollo.css";
 import { Button } from "../../Button/ButtonApollo";
 import { ContentItemDuoCommon, } from "./ContentItemDuoCommon";
-export const ContentItemDuo = (props) => (_jsx(ContentItemDuoCommon, { ...props, ButtonComponent: Button }));
+import { ItemMessage } from "../../Form/ItemMessage/ItemMessageApollo";
+export const ContentItemDuo = (props) => (_jsx(ContentItemDuoCommon, { ...props, ButtonComponent: Button, ItemMessageComponent: ItemMessage }));

package/dist/prospect-client/List/ContentItemDuo/ContentItemDuoCommon.d.ts

@@ -1,5 +1,6 @@
 import { type ComponentProps, type ComponentType, type ReactNode } from "react";
 import type { ButtonProps } from "../../Button/ButtonCommon";
+import { ItemMessage, type ItemMessageProps } from "../../Form/ItemMessage/ItemMessageCommon";
 type ContentItemDuoPositions = {
     position?: "horizontal";
     size?: "small" | "large";
@@ -16,9 +17,10 @@ export type ContentItemDuoProps = {
     isVertical?: boolean;
     /** @deprecated Use `size` or `className` instead */
     classModifier?: string;
-} & ContentItemDuoPositions & ComponentProps<"div">;
+} & Pick<ItemMessageProps, "message" | "messageType"> & ContentItemDuoPositions & ComponentProps<"div">;
 type ContentItemDuoCommonProps = ContentItemDuoProps & {
     ButtonComponent: ComponentType<ButtonProps>;
+    ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
 };
-export declare const ContentItemDuoCommon: ({ label, value, position, size, className, classModifier, isVertical, buttonText, onButtonClick, ButtonComponent, ...containerProps }: ContentItemDuoCommonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ContentItemDuoCommon: ({ label, value, position, size, className, classModifier, isVertical, buttonText, onButtonClick, ButtonComponent, message, messageType, ItemMessageComponent, ...containerProps }: ContentItemDuoCommonProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/prospect-client/List/ContentItemDuo/ContentItemDuoCommon.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import {} from "react";
 import { getClassName } from "../../utilities/getClassName";
-export const ContentItemDuoCommon = ({ label, value, position = "horizontal", size = "large", className, classModifier, isVertical, buttonText, onButtonClick, ButtonComponent, ...containerProps }) => {
+import { ItemMessage, } from "../../Form/ItemMessage/ItemMessageCommon";
+export const ContentItemDuoCommon = ({ label, value, position = "horizontal", size = "large", className, classModifier, isVertical, buttonText, onButtonClick, ButtonComponent, message, messageType, ItemMessageComponent, ...containerProps }) => {
     const componentClassName = getClassName({
         baseClassName: "af-content-item-duo",
         className,
@@ -11,5 +12,5 @@ export const ContentItemDuoCommon = ({ label, value, position = "horizontal", si
             classModifier,
         ],
     });
-    return (_jsxs("div", { className: componentClassName, ...containerProps, children: [_jsx("dt", { className: "af-content-item-duo__label", children: label }), _jsx("dd", { className: "af-content-item-duo__value", children: value }), Boolean(buttonText && onButtonClick) && (_jsx(ButtonComponent, { className: "af-content-item-duo__button", variant: "ghost", onClick: onButtonClick, children: buttonText }))] }));
+    return (_jsxs("div", { className: componentClassName, ...containerProps, children: [_jsx("dt", { className: "af-content-item-duo__label", children: label }), _jsxs("dd", { className: "af-content-item-duo__value", children: [value, message ? (_jsx(ItemMessageComponent, { message: message, messageType: messageType })) : null] }), buttonText && onButtonClick ? (_jsx(ButtonComponent, { className: "af-content-item-duo__button", variant: "ghost", onClick: onButtonClick, children: buttonText })) : null] }));
 };

package/dist/prospect-client/List/ContentItemDuo/ContentItemDuoLF.js

@@ -2,4 +2,5 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import "@axa-fr/canopee-css/client/List/ContentItemDuo/ContentItemDuoLF.css";
 import { Button } from "../../Button/ButtonLF";
 import { ContentItemDuoCommon, } from "./ContentItemDuoCommon";
-export const ContentItemDuo = (props) => (_jsx(ContentItemDuoCommon, { ...props, ButtonComponent: Button }));
+import { ItemMessage } from "../../Form/ItemMessage/ItemMessageLF";
+export const ContentItemDuo = (props) => (_jsx(ContentItemDuoCommon, { ...props, ButtonComponent: Button, ItemMessageComponent: ItemMessage }));

package/dist/prospect-client/Loader/LoaderApollo.d.ts

@@ -0,0 +1,7 @@
+import { type LoaderProps } from "./LoaderCommon";
+import "@axa-fr/canopee-css/prospect/Loader/LoaderApollo.css";
+export { type LoaderProps } from "./LoaderCommon";
+export declare const Loader: {
+    (props: LoaderProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/prospect-client/Loader/LoaderApollo.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { LoaderCommon } from "./LoaderCommon";
+import { Spinner } from "../Spinner/SpinnerApollo";
+import "@axa-fr/canopee-css/prospect/Loader/LoaderApollo.css";
+export {} from "./LoaderCommon";
+export const Loader = (props) => (_jsx(LoaderCommon, { ...props, SpinnerComponent: Spinner }));
+Loader.displayName = "Loader";

package/dist/prospect-client/Loader/LoaderCommon.d.ts

@@ -0,0 +1,13 @@
+import { type ComponentType, type ElementType } from "react";
+import { type SpinnerProps } from "../Spinner/SpinnerCommon";
+import type { PolymorphicComponent } from "../utilities/types/PolymorphicComponent";
+export type LoaderProps = {
+    isDialog?: boolean;
+    title: string;
+    subtitle?: string;
+    spinnerProps?: SpinnerProps;
+};
+export type LoaderCommonProps<T extends ElementType> = PolymorphicComponent<T, LoaderProps> & {
+    SpinnerComponent: ComponentType<SpinnerProps>;
+};
+export declare const LoaderCommon: import("react").ForwardRefExoticComponent<Omit<LoaderCommonProps<ElementType>, "ref"> & import("react").RefAttributes<HTMLElement>>;

package/dist/prospect-client/Loader/LoaderCommon.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useId } from "react";
+import { getClassName } from "../utilities/getClassName";
+import {} from "../Spinner/SpinnerCommon";
+export const LoaderCommon = forwardRef(({ title, subtitle, SpinnerComponent, spinnerProps, className, isDialog, ...rest }, ref) => {
+    const baseClassName = "af-loader";
+    const titleId = useId();
+    const Component = (isDialog && "dialog") || "article";
+    return (_jsxs(Component, { ref: ref, className: getClassName({
+            baseClassName,
+            className,
+        }), "aria-labelledby": titleId, ...rest, children: [_jsx(SpinnerComponent, { ...spinnerProps }), _jsxs("div", { className: `${baseClassName}__content`, children: [_jsx("span", { id: titleId, className: `${baseClassName}__title`, children: title }), subtitle ? (_jsx("span", { className: `${baseClassName}__subtitle`, children: subtitle })) : null] })] }));
+});
+LoaderCommon.displayName = "LoaderCommon";

package/dist/prospect-client/Loader/LoaderLF.d.ts

@@ -0,0 +1,7 @@
+import { type LoaderProps } from "./LoaderCommon";
+import "@axa-fr/canopee-css/client/Loader/LoaderLF.css";
+export { type LoaderProps } from "./LoaderCommon";
+export declare const Loader: {
+    (props: LoaderProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/prospect-client/Loader/LoaderLF.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { LoaderCommon } from "./LoaderCommon";
+import { Spinner } from "../Spinner/SpinnerLF";
+import "@axa-fr/canopee-css/client/Loader/LoaderLF.css";
+export {} from "./LoaderCommon";
+export const Loader = (props) => (_jsx(LoaderCommon, { ...props, SpinnerComponent: Spinner }));
+Loader.displayName = "Loader";

package/dist/prospect-client/Stepper/StepperCommon.d.ts

@@ -6,7 +6,7 @@ export type StepperProps = {
     currentStep: number;
     currentSubtitle?: string;
     currentTitle?: string;
-    nbSteps?: 3 | 4 | 5 | 6 | 7 | 8;
+    nbSteps?: 2 | 3 | 4 | 5 | 6 | 7 | 8;
     helper?: string;
     message?: string;
     messageType?: ItemMessageProps["messageType"];

package/dist/prospect.d.ts

@@ -70,3 +70,4 @@ export { FormLayout, type FormLayoutProps, } from "./prospect-client/Layout/Form
 export { ValidPage, type ValidPageProps, } from "./prospect-client/pages/ValidPage/ValidPageApollo";
 export { ErrorPage, type ErrorPageProps, } from "./prospect-client/pages/ErrorPage/ErrorPageApollo";
 export type { GridContainerProps } from "./prospect-client/utilities/types/GridContainerProps";
+export { Loader, type LoaderProps, } from "./prospect-client/Loader/LoaderApollo";

package/dist/prospect.js

@@ -69,3 +69,4 @@ export { ExitLayout, } from "./prospect-client/Layout/ExitLayout/ExitLayoutApoll
 export { FormLayout, } from "./prospect-client/Layout/FormLayout/FormLayout";
 export { ValidPage, } from "./prospect-client/pages/ValidPage/ValidPageApollo";
 export { ErrorPage, } from "./prospect-client/pages/ErrorPage/ErrorPageApollo";
+export { Loader, } from "./prospect-client/Loader/LoaderApollo";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@axa-fr/canopee-react",
-  "version": "1.4.2-alpha.3",
+  "version": "1.4.2-alpha.37",
   "description": "Package React - Design System Canopée",
   "exports": {
     "./distributeur": {
@@ -49,7 +49,7 @@
   },
   "homepage": "https://github.com/AxaFrance/design-system#readme",
   "peerDependencies": {
-    "@axa-fr/canopee-css": "1.4.2-alpha.3",
+    "@axa-fr/canopee-css": "1.4.2-alpha.37",
     "@material-symbols/svg-400": ">= 0.19.0",
     "@material-symbols/svg-700": ">= 0.19.0",
     "react": ">= 18"

package/dist/distributeur/Tabs/components/Title.d.ts

@@ -1,15 +0,0 @@
-import React from "react";
-export type TitleComponentProps = {
-    enable?: boolean | null;
-    active: boolean;
-    className?: string;
-    classModifier?: string;
-    id: string;
-    children?: React.ReactNode;
-    onChange: (event: React.MouseEvent<HTMLButtonElement>, index: string) => void;
-};
-declare const Title: {
-    ({ active, onChange, children, classModifier, className, enable, id, }: TitleComponentProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export { Title };

package/dist/distributeur/Tabs/components/Title.js

@@ -1,14 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import classNames from "classnames";
-import React from "react";
-import { getComponentClassName } from "../../utilities";
-const Title = ({ active, onChange, children, classModifier, className, enable, id, }) => {
-    const newClassModifier = classNames(classModifier, {
-        disabled: enable === false,
-        active,
-    });
-    const componentClassName = getComponentClassName(className, newClassModifier, "af-tabs__item");
-    return (_jsx("li", { className: componentClassName, children: _jsx("button", { type: "button", id: id, className: "af-tabs__link", onClick: (event) => onChange(event, id), children: children }) }));
-};
-Title.displayName = "Title";
-export { Title };