@axa-fr/canopee-react 2.0.0-alpha.7 → 2.0.0-alpha.71

package/dist/prospect-client/Form/TextArea/TextAreaCommon.d.ts

@@ -5,18 +5,14 @@ import { ItemMessage, type ItemMessageProps } from "../ItemMessage/ItemMessageCo
 export type TextAreaProps = ComponentPropsWithRef<"textarea"> & {
     label?: ItemLabelProps["children"];
     helper?: string;
-    /**
-     * @deprecated Use `message` and messageType instead.
-     */
-    error?: string;
     containerProps?: GridContainerProps;
-} & Pick<ItemLabelProps, "description" | "moreButtonLabel" | "buttonLabel" | "onMoreButtonClick" | "onButtonClick" | "sideButtonLabel" | "onSideButtonClick"> & Pick<ItemMessageProps, "message" | "messageType">;
+} & Pick<ItemLabelProps, "description" | "moreButtonLabel" | "onMoreButtonClick" | "sideButtonLabel" | "onSideButtonClick"> & Pick<ItemMessageProps, "message" | "messageType">;
 type TextAreaCommonProps = TextAreaProps & {
     ItemLabelComponent: ComponentType<Omit<ComponentProps<typeof ItemLabelCommon>, "ButtonComponent">>;
     ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
 };
 declare const TextAreaCommon: {
-    ({ id, className, label, description, helper, error, message, messageType, buttonLabel, moreButtonLabel, onButtonClick, onMoreButtonClick, required, sideButtonLabel, ItemLabelComponent, ItemMessageComponent, onSideButtonClick, placeholder, containerProps, ...inputProps }: TextAreaCommonProps): import("react/jsx-runtime").JSX.Element;
+    ({ id, className, label, description, helper, message, messageType, moreButtonLabel, onMoreButtonClick, required, sideButtonLabel, ItemLabelComponent, ItemMessageComponent, onSideButtonClick, placeholder, containerProps, ...inputProps }: TextAreaCommonProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export { TextAreaCommon };

package/dist/prospect-client/Form/TextArea/TextAreaCommon.js

@@ -3,12 +3,12 @@ import { useId, } from "react";
 import { getClassName } from "../../utilities/getClassName";
 import { ItemLabelCommon, } from "../ItemLabel/ItemLabelCommon";
 import { ItemMessage, } from "../ItemMessage/ItemMessageCommon";
-const TextAreaCommon = ({ id, className, label, description, helper, error, message, messageType, buttonLabel, moreButtonLabel, onButtonClick, onMoreButtonClick, required, sideButtonLabel, ItemLabelComponent, ItemMessageComponent, onSideButtonClick, placeholder = " ", containerProps, ...inputProps }) => {
+const TextAreaCommon = ({ id, className, label, description, helper, message, messageType = "error", moreButtonLabel, onMoreButtonClick, required, sideButtonLabel, ItemLabelComponent, ItemMessageComponent, onSideButtonClick, placeholder = " ", containerProps, ...inputProps }) => {
     const generatedId = useId();
     const inputId = id ?? generatedId;
     const helperId = `${inputId}-helper`;
     const messageId = `${inputId}-error`;
-    const hasError = (Boolean(message) && messageType === "error") || Boolean(error);
+    const hasError = Boolean(message) && messageType === "error";
     const hasWarning = Boolean(message) && messageType === "warning" && !hasError;
     const textareaClassName = getClassName({
         baseClassName: "af-form__textarea",
@@ -16,7 +16,7 @@ const TextAreaCommon = ({ id, className, label, description, helper, error, mess
     });
     return (_jsxs("div", { className: ["af-form__input-container", className]
             .filter(Boolean)
-            .join(" "), ...containerProps, children: [_jsx(ItemLabelComponent, { description: description, moreButtonLabel: moreButtonLabel ?? buttonLabel, onMoreButtonClick: onMoreButtonClick ?? onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, htmlFor: inputId, children: label }), _jsx("textarea", { id: inputId, className: textareaClassName, "aria-errormessage": hasError ? messageId : undefined, "aria-describedby": helper ? helperId : undefined, required: required, "aria-invalid": hasError || undefined, placeholder: placeholder, ...inputProps }), helper ? (_jsx("span", { id: helperId, className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: messageId, message: message || error, messageType: messageType })] }));
+            .join(" "), ...containerProps, children: [_jsx(ItemLabelComponent, { description: description, moreButtonLabel: moreButtonLabel, onMoreButtonClick: onMoreButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, htmlFor: inputId, children: label }), _jsx("textarea", { id: inputId, className: textareaClassName, "aria-errormessage": hasError ? messageId : undefined, "aria-describedby": helper ? helperId : undefined, required: required, "aria-invalid": hasError || undefined, placeholder: placeholder, ...inputProps }), helper ? (_jsx("span", { id: helperId, className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: messageId, message: message, messageType: messageType })] }));
 };
 TextAreaCommon.displayName = "TextArea";
 export { TextAreaCommon };

package/dist/prospect-client/Header/HeaderApollo.d.ts

@@ -0,0 +1,4 @@
+import "@axa-fr/canopee-css/prospect/Header/HeaderApollo.css";
+import { type HeaderProps } from "./HeaderCommon";
+export declare const Header: (props: HeaderProps) => import("react/jsx-runtime").JSX.Element;
+export type { HeaderProps };

package/dist/prospect-client/Header/HeaderApollo.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@axa-fr/canopee-css/prospect/Header/HeaderApollo.css";
+import { AppName } from "../AppName/AppName";
+import { Heading } from "../Heading/HeadingApollo";
+import { MenuBurger } from "../MenuBurger/MenuBurgerApollo";
+import { ClickIcon } from "../ClickIcon/ClickIconApollo";
+import { HeaderCommon } from "./HeaderCommon";
+export const Header = (props) => (_jsx(HeaderCommon, { AppNameComponent: AppName, HeadingComponent: Heading, MenuBurgerComponent: MenuBurger, ClickIconComponent: ClickIcon, ...props }));

package/dist/prospect-client/Header/HeaderCommon.d.ts

@@ -0,0 +1,22 @@
+import { type ComponentPropsWithoutRef, type ComponentType, type ReactNode } from "react";
+import { type ClickIconProps } from "../ClickIcon/ClickIconCommon";
+import { type AppNameProps } from "../AppName/AppName";
+import { type HeadingProps } from "../Heading/types";
+import { type MenuBurgerProps } from "../MenuBurger/MenuBurgerCommon";
+import { type TabMenuProps } from "../TabMenu/TabMenu";
+export type HeaderProps = Omit<ComponentPropsWithoutRef<"header">, "title"> & {
+    appNameProps: AppNameProps;
+    menuBurgerProps?: MenuBurgerProps;
+    tabMenuProps?: TabMenuProps;
+    clickIconProps?: ClickIconProps;
+    title?: string;
+    actionChildren?: ReactNode;
+};
+type HeaderCommonProps = HeaderProps & {
+    AppNameComponent: ComponentType<AppNameProps>;
+    HeadingComponent: ComponentType<HeadingProps>;
+    MenuBurgerComponent: ComponentType<MenuBurgerProps>;
+    ClickIconComponent: ComponentType<ClickIconProps>;
+};
+export declare const HeaderCommon: ({ appNameProps, menuBurgerProps, tabMenuProps, clickIconProps, title, className, AppNameComponent, HeadingComponent, MenuBurgerComponent, ClickIconComponent, actionChildren, ...props }: HeaderCommonProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/prospect-client/Header/HeaderCommon.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import {} from "react";
+import menu from "@material-symbols/svg-400/outlined/menu.svg";
+import { BREAKPOINT } from "../utilities/constants";
+import {} from "../ClickIcon/ClickIconCommon";
+import { TabMenu } from "../TabMenu/TabMenu";
+import {} from "../AppName/AppName";
+import {} from "../Heading/types";
+import {} from "../MenuBurger/MenuBurgerCommon";
+import {} from "../TabMenu/TabMenu";
+import { getClassName } from "../utilities/getClassName";
+import { useIsSmallScreen } from "../utilities/hook/useIsSmallScreen";
+const withElementClass = (props, baseClassName) => ({
+    ...props,
+    className: getClassName({
+        baseClassName,
+        className: props.className,
+    }),
+});
+export const HeaderCommon = ({ appNameProps, menuBurgerProps, tabMenuProps, clickIconProps, title, className, AppNameComponent, HeadingComponent, MenuBurgerComponent, ClickIconComponent, actionChildren, ...props }) => {
+    const isSmallScreen = useIsSmallScreen(BREAKPOINT.MD);
+    const parsedAppNameProps = withElementClass(appNameProps, "af-header__app-name");
+    const parsedMenuBurgerProps = menuBurgerProps
+        ? withElementClass(menuBurgerProps, "af-header__menu-burger")
+        : undefined;
+    const parsedTabMenuProps = tabMenuProps
+        ? withElementClass(tabMenuProps, "af-header__tab-menu")
+        : undefined;
+    return (_jsxs("header", { className: getClassName({
+            baseClassName: "af-header",
+            className,
+        }), ...props, children: [_jsx(AppNameComponent, { ...parsedAppNameProps }), Boolean(parsedMenuBurgerProps) ||
+                Boolean(parsedTabMenuProps) ||
+                Boolean(actionChildren) ? (_jsx(ClickIconComponent, { ...clickIconProps, src: menu, size: "S", variant: "ghost", className: "af-header__menu-icon", "aria-haspopup": isSmallScreen ? "menu" : undefined, "aria-label": clickIconProps?.["aria-label"] ?? "Ouvrir le menu", popoverTarget: isSmallScreen ? "af-header-menu" : undefined, popoverTargetAction: isSmallScreen ? "toggle" : undefined })) : null, _jsxs("div", { id: "af-header-menu", popover: isSmallScreen ? "auto" : undefined, className: "af-header__menu", children: [parsedTabMenuProps ? _jsx(TabMenu, { ...parsedTabMenuProps }) : null, (title && !isSmallScreen) ||
+                        actionChildren ||
+                        parsedMenuBurgerProps ? (_jsxs("div", { className: "af-header__actions", children: [title ? (_jsx(HeadingComponent, { level: 1, className: "af-header__title", children: title })) : null, actionChildren ? (_jsx("div", { className: "af-header__actions-children", children: actionChildren })) : null, parsedMenuBurgerProps ? (_jsx(MenuBurgerComponent, { ...parsedMenuBurgerProps })) : null] })) : null] })] }));
+};

package/dist/prospect-client/Header/HeaderLF.d.ts

@@ -0,0 +1,4 @@
+import "@axa-fr/canopee-css/client/Header/HeaderLF.css";
+import { type HeaderProps } from "./HeaderCommon";
+export declare const Header: (props: HeaderProps) => import("react/jsx-runtime").JSX.Element;
+export type { HeaderProps };

package/dist/prospect-client/Header/HeaderLF.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@axa-fr/canopee-css/client/Header/HeaderLF.css";
+import { AppName } from "../AppName/AppName";
+import { Heading } from "../Heading/HeadingLF";
+import { MenuBurger } from "../MenuBurger/MenuBurgerLF";
+import { ClickIcon } from "../ClickIcon/ClickIconLF";
+import { HeaderCommon } from "./HeaderCommon";
+export const Header = (props) => (_jsx(HeaderCommon, { AppNameComponent: AppName, HeadingComponent: Heading, MenuBurgerComponent: MenuBurger, ClickIconComponent: ClickIcon, ...props }));

package/dist/prospect-client/Icon/IconCommon.d.ts

@@ -21,4 +21,4 @@ export type IconProps = ComponentProps<typeof Svg> & {
     size?: IconSizeVariants;
     hasBackground?: boolean;
 };
-export declare const Icon: ({ variant, size, hasBackground, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Icon: ({ variant, size, hasBackground, className, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/prospect-client/Icon/IconCommon.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { Svg } from "../Svg/Svg";
-import { getComponentClassName } from "../utilities/getComponentClassName";
+import { getClassName } from "../utilities/getClassName";
 export const iconVariants = {
     primary: "primary",
     secondary: "secondary",
@@ -16,16 +16,15 @@ export const iconSizeVariants = {
     S: "small",
     XS: "extra-small",
 };
-export const Icon = ({ variant = "primary", size = "S", hasBackground = false, ...props }) => {
-    const componentClassName = useMemo(() => {
-        const newClassModifier = [
+export const Icon = ({ variant = "primary", size = "S", hasBackground = false, className, ...props }) => {
+    const componentClassName = useMemo(() => getClassName({
+        baseClassName: "af-icon",
+        className,
+        modifiers: [
             variant,
             iconSizeVariants[size],
             hasBackground && "has-background",
-        ]
-            .filter(Boolean)
-            .join(" ");
-        return getComponentClassName("af-icon", "", newClassModifier);
-    }, [variant, hasBackground, size]);
+        ].filter(Boolean),
+    }), [className, variant, size, hasBackground]);
     return (_jsx("div", { className: componentClassName, children: _jsx(Svg, { ...props }) }));
 };

package/dist/prospect-client/ItemTabBar/ItemTabBarCommon.js

@@ -1,8 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import {} from "react";
-import { getComponentClassName } from "../utilities/getComponentClassName";
+import { getClassName } from "../utilities/getClassName";
 export const ItemTabBar = ({ isActive = false, title, className, ...props }) => {
-    const classNames = getComponentClassName("af-item-tab-bar", className);
+    const classNames = getClassName({
+        baseClassName: "af-item-tab-bar",
+        className,
+    });
     return (_jsx("button", { type: "button", role: "tab", "aria-selected": isActive, className: classNames, ...props, children: title }));
 };
 ItemTabBar.displayName = "ItemTabBar";

package/dist/prospect-client/Layout/ExitLayout/ExitLayoutApollo.d.ts

@@ -1,5 +1,17 @@
 import { type ExitLayoutProps } from "./ExitLayoutCommon";
 export { type ExitLayoutWithSubComponents, type ExitLayoutProps, } from "./ExitLayoutCommon";
+export { ExitLayoutSkeleton, type ExitLayoutSkeletonProps, } from "./ExitLayoutSkeleton";
+/**
+ * Apollo-themed `ExitLayout` component with `Agent`, `Action`, and `Content`
+ * static slots.
+ *
+ * @component
+ * @param {ExitLayoutProps} props - ExitLayout props.
+ * @param {HeadingProps} [props.headingProps] - Props forwarded to the heading displayed in the content column.
+ * @param {Pick<IconProps, "variant" | "src" | "hasBackground">} [props.iconProps] - Props forwarded to the icon displayed in the content column.
+ * @param {React.ReactNode} [props.children] - Slots composed with `ExitLayout.Content`, `ExitLayout.Agent`, and `ExitLayout.Action`.
+ * @returns {JSX.Element} The rendered Apollo-themed ExitLayout.
+ */
 export declare const ExitLayout: {
     (props: ExitLayoutProps): import("react/jsx-runtime").JSX.Element;
     Agent: ({ children }: import("react").PropsWithChildren) => (string | number | bigint | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | {

package/dist/prospect-client/Layout/ExitLayout/ExitLayoutApollo.js

@@ -3,6 +3,18 @@ import { Heading } from "../../Heading/HeadingApollo";
 import { Icon } from "../../Icon/IconApollo";
 import { Agent, Action, Content, ExitLayoutCommon, } from "./ExitLayoutCommon";
 export {} from "./ExitLayoutCommon";
+export { ExitLayoutSkeleton, } from "./ExitLayoutSkeleton";
+/**
+ * Apollo-themed `ExitLayout` component with `Agent`, `Action`, and `Content`
+ * static slots.
+ *
+ * @component
+ * @param {ExitLayoutProps} props - ExitLayout props.
+ * @param {HeadingProps} [props.headingProps] - Props forwarded to the heading displayed in the content column.
+ * @param {Pick<IconProps, "variant" | "src" | "hasBackground">} [props.iconProps] - Props forwarded to the icon displayed in the content column.
+ * @param {React.ReactNode} [props.children] - Slots composed with `ExitLayout.Content`, `ExitLayout.Agent`, and `ExitLayout.Action`.
+ * @returns {JSX.Element} The rendered Apollo-themed ExitLayout.
+ */
 export const ExitLayout = (props) => (_jsx(ExitLayoutCommon, { ...props, HeadingComponent: Heading, IconComponent: Icon }));
 ExitLayout.Agent = Agent;
 ExitLayout.Action = Action;

package/dist/prospect-client/Layout/ExitLayout/ExitLayoutLF.d.ts

@@ -1,5 +1,17 @@
 import { type ExitLayoutProps } from "./ExitLayoutCommon";
 export { type ExitLayoutWithSubComponents, type ExitLayoutProps, } from "./ExitLayoutCommon";
+export { ExitLayoutSkeleton, type ExitLayoutSkeletonProps, } from "./ExitLayoutSkeleton";
+/**
+ * Look and Feel-themed `ExitLayout` component with `Agent`, `Action`, and
+ * `Content` static slots.
+ *
+ * @component
+ * @param {ExitLayoutProps} props - ExitLayout props.
+ * @param {HeadingProps} [props.headingProps] - Props forwarded to the heading displayed in the content column.
+ * @param {Pick<IconProps, "variant" | "src" | "hasBackground">} [props.iconProps] - Props forwarded to the icon displayed in the content column.
+ * @param {React.ReactNode} [props.children] - Slots composed with `ExitLayout.Content`, `ExitLayout.Agent`, and `ExitLayout.Action`.
+ * @returns {JSX.Element} The rendered Look and Feel ExitLayout.
+ */
 export declare const ExitLayout: {
     (props: ExitLayoutProps): import("react/jsx-runtime").JSX.Element;
     Agent: ({ children }: import("react").PropsWithChildren) => (string | number | bigint | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | {

package/dist/prospect-client/Layout/ExitLayout/ExitLayoutLF.js

@@ -3,6 +3,18 @@ import { Heading } from "../../Heading/HeadingLF";
 import { Icon } from "../../Icon/IconLF";
 import { Agent, Action, Content, ExitLayoutCommon, } from "./ExitLayoutCommon";
 export {} from "./ExitLayoutCommon";
+export { ExitLayoutSkeleton, } from "./ExitLayoutSkeleton";
+/**
+ * Look and Feel-themed `ExitLayout` component with `Agent`, `Action`, and
+ * `Content` static slots.
+ *
+ * @component
+ * @param {ExitLayoutProps} props - ExitLayout props.
+ * @param {HeadingProps} [props.headingProps] - Props forwarded to the heading displayed in the content column.
+ * @param {Pick<IconProps, "variant" | "src" | "hasBackground">} [props.iconProps] - Props forwarded to the icon displayed in the content column.
+ * @param {React.ReactNode} [props.children] - Slots composed with `ExitLayout.Content`, `ExitLayout.Agent`, and `ExitLayout.Action`.
+ * @returns {JSX.Element} The rendered Look and Feel ExitLayout.
+ */
 export const ExitLayout = (props) => (_jsx(ExitLayoutCommon, { ...props, HeadingComponent: Heading, IconComponent: Icon }));
 ExitLayout.Agent = Agent;
 ExitLayout.Action = Action;

package/dist/prospect-client/Layout/ExitLayout/ExitLayoutSkeleton.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Props controlling which placeholder areas are displayed in `ExitLayoutSkeleton`.
+ */
+export type ExitLayoutSkeletonProps = {
+    hasAgent?: boolean;
+    hasIcon?: boolean;
+    hasAction?: boolean;
+    hasContent?: boolean;
+    hasHeading?: boolean;
+};
+/**
+ * Renders skeleton placeholders matching the visual structure of `ExitLayout`.
+ *
+ * @component
+ * @param {ExitLayoutSkeletonProps} props - ExitLayoutSkeleton props.
+ * @param {boolean} [props.hasAgent] - Displays the agent placeholder block.
+ * @param {boolean} [props.hasIcon] - Displays the icon placeholder.
+ * @param {boolean} [props.hasAction] - Displays the action area placeholder.
+ * @param {boolean} [props.hasContent] - Displays the main content placeholder.
+ * @param {boolean} [props.hasHeading] - Displays the heading placeholder.
+ * @returns {JSX.Element} The rendered ExitLayoutSkeleton component.
+ */
+export declare const ExitLayoutSkeleton: ({ hasAgent, hasIcon, hasAction, hasContent, hasHeading, }: ExitLayoutSkeletonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/prospect-client/Layout/ExitLayout/ExitLayoutSkeleton.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Skeleton } from "../../Skeleton/Skeleton";
+/**
+ * Renders skeleton placeholders matching the visual structure of `ExitLayout`.
+ *
+ * @component
+ * @param {ExitLayoutSkeletonProps} props - ExitLayoutSkeleton props.
+ * @param {boolean} [props.hasAgent] - Displays the agent placeholder block.
+ * @param {boolean} [props.hasIcon] - Displays the icon placeholder.
+ * @param {boolean} [props.hasAction] - Displays the action area placeholder.
+ * @param {boolean} [props.hasContent] - Displays the main content placeholder.
+ * @param {boolean} [props.hasHeading] - Displays the heading placeholder.
+ * @returns {JSX.Element} The rendered ExitLayoutSkeleton component.
+ */
+export const ExitLayoutSkeleton = ({ hasAgent, hasIcon, hasAction, hasContent, hasHeading, }) => {
+    return (_jsxs("section", { className: "af-exit-page subgrid", children: [_jsxs("article", { className: "af-exit-page__content subgrid", children: [hasIcon ? _jsx(Skeleton, { variant: "circle", size: "L" }) : null, hasHeading ? _jsx(Skeleton, { colSize: 12 }) : null, hasContent ? _jsx(Skeleton, { size: "XL", colSize: 12 }) : null] }), hasAgent ? (_jsx(Skeleton, { className: "af-exit-page__agent", size: "XXL", colSize: 12 })) : null, hasAction ? (_jsx("div", { className: "af-exit-page__actions subgrid", children: _jsx(Skeleton, { variant: "action", colSize: 12 }) })) : null] }));
+};

package/dist/prospect-client/Link/LinkCommon.d.ts

@@ -9,9 +9,5 @@ export type LinkProps = {
     leftIcon?: ReactNode;
     rightIcon?: ReactNode;
     className?: string;
-    /**
-     * @deprecated Use variant instead
-     */
-    classModifier?: string;
 } & ComponentPropsWithoutRef<"a">;
-export declare const Link: ({ href, variant, openInNewTab, leftIcon, rightIcon, children, className, classModifier, ...props }: PropsWithChildren<LinkProps>) => import("react/jsx-runtime").JSX.Element;
+export declare const Link: ({ href, variant, openInNewTab, leftIcon, rightIcon, children, className, ...props }: PropsWithChildren<LinkProps>) => import("react/jsx-runtime").JSX.Element;

package/dist/prospect-client/Link/LinkCommon.js

@@ -5,14 +5,14 @@ import { getClassName } from "../utilities/getClassName";
 export const linkVariants = {
     inverse: "inverse",
 };
-export const Link = ({ href, variant, openInNewTab = false, leftIcon, rightIcon, children, className, classModifier = "", ...props }) => {
+export const Link = ({ href, variant, openInNewTab = false, leftIcon, rightIcon, children, className, ...props }) => {
     const newTabProps = openInNewTab && {
         target: "_blank",
         rel: "noopener noreferrer",
     };
     return (_jsxs("a", { className: getClassName({
             baseClassName: "af-link",
-            modifiers: [classModifier, variant, openInNewTab && "openInNewTab"],
+            modifiers: [variant, openInNewTab && "openInNewTab"],
             className,
         }), href: href, ...newTabProps, ...props, children: [leftIcon, children, openInNewTab || Boolean(rightIcon)
                 ? (rightIcon ?? _jsx(Svg, { src: openInNew }))

package/dist/prospect-client/List/ClickItem/ClickItemCommon.d.ts

@@ -1,4 +1,5 @@
 import type { ClickItemPropsCommon } from "./types";
+export type { ClickItemProps } from "./types";
 export declare const clickItemVariants: {
     readonly small: "small";
     readonly medium: "medium";

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

@@ -13,14 +13,10 @@ export type ContentItemDuoProps = {
     value: ReactNode;
     buttonText?: string;
     onButtonClick?: () => void;
-    /** @deprecated Use `position` instead */
-    isVertical?: boolean;
-    /** @deprecated Use `size` or `className` instead */
-    classModifier?: string;
 } & 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, message, messageType, ItemMessageComponent, ...containerProps }: ContentItemDuoCommonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ContentItemDuoCommon: ({ label, value, position, size, className, buttonText, onButtonClick, ButtonComponent, message, messageType, ItemMessageComponent, ...containerProps }: ContentItemDuoCommonProps) => import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,16 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import {} from "react";
-import { getClassName } from "../../utilities/getClassName";
 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 }) => {
+import { getClassName } from "../../utilities/getClassName";
+export const ContentItemDuoCommon = ({ label, value, position = "horizontal", size = "large", className, buttonText, onButtonClick, ButtonComponent, message, messageType, ItemMessageComponent, ...containerProps }) => {
     const componentClassName = getClassName({
         baseClassName: "af-content-item-duo",
         className,
-        modifiers: [
-            isVertical ? "vertical" : position,
-            size === "small" && size,
-            classModifier,
-        ],
+        modifiers: [position, size === "small" && size],
     });
     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/List/ListCommon.d.ts

@@ -1,8 +1,33 @@
 import { type ComponentProps, type ComponentType } from "react";
-import { CardCommon as Card, type CardCommonProps } from "../../Card/CardCommon";
-export type ListProps = CardCommonProps<"ul" | "ol">;
+import { CardCommon as Card, type CardCommonProps, type CardVariants } from "../../Card/CardCommon";
+/**
+ * Props for the List component.
+ * Extends `CardCommonProps` (without `variant` override) to allow the list
+ * to be rendered as a `ul` or `ol` with optional card styling.
+ */
+export type ListProps = Omit<CardCommonProps<"ul" | "ol">, "variant"> & {
+    /**
+     * Visual variant inherited from Card.
+     * - `"default"` — bordered list with padding.
+     * - `"unstyled"` — removes border and padding.
+     * @default "default"
+     */
+    variant?: CardVariants;
+};
 type ListPropsCommon = ListProps & {
     CardComponent: ComponentType<ComponentProps<typeof Card>>;
 };
+/**
+ * Renders an accessible list (`ul` or `ol`) wrapped in a Card.
+ * Each direct child is automatically wrapped in a `<li>` element.
+ *
+ * @component
+ * @param {ListPropsCommon} props - List props.
+ * @param {ReactNode} props.children - Items to render inside the list. Each child is wrapped in a `<li>`.
+ * @param {"ul" | "ol"} [props.as="ul"] - HTML list element to render.
+ * @param {CardVariants} [props.variant="default"] - Visual variant of the surrounding Card.
+ * @param {ComponentType} props.CardComponent - Injected Card component (theme-specific).
+ * @returns {JSX.Element} The rendered List component.
+ */
 export declare const ListCommon: ({ children, CardComponent, as, ...listProps }: ListPropsCommon) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/prospect-client/List/List/ListCommon.js

@@ -2,4 +2,16 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Children } from "react";
 import { CardCommon as Card, } from "../../Card/CardCommon";
 import { generateId } from "../../utilities/generateId";
+/**
+ * Renders an accessible list (`ul` or `ol`) wrapped in a Card.
+ * Each direct child is automatically wrapped in a `<li>` element.
+ *
+ * @component
+ * @param {ListPropsCommon} props - List props.
+ * @param {ReactNode} props.children - Items to render inside the list. Each child is wrapped in a `<li>`.
+ * @param {"ul" | "ol"} [props.as="ul"] - HTML list element to render.
+ * @param {CardVariants} [props.variant="default"] - Visual variant of the surrounding Card.
+ * @param {ComponentType} props.CardComponent - Injected Card component (theme-specific).
+ * @returns {JSX.Element} The rendered List component.
+ */
 export const ListCommon = ({ children, CardComponent, as = "ul", ...listProps }) => (_jsx(CardComponent, { as: as, ...listProps, children: Children.toArray(children).map((child) => (_jsx("li", { children: child }, generateId(child)))) }));

package/dist/prospect-client/MenuBurger/MenuBurgerApollo.d.ts

@@ -0,0 +1,4 @@
+import "@axa-fr/canopee-css/prospect/MenuBurger/MenuBurgerAll.css";
+import { type MenuBurgerProps } from "./MenuBurgerCommon";
+export declare const MenuBurger: (props: MenuBurgerProps) => import("react/jsx-runtime").JSX.Element;
+export type { MenuBurgerProps };

package/dist/prospect-client/MenuBurger/MenuBurgerApollo.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@axa-fr/canopee-css/prospect/MenuBurger/MenuBurgerAll.css";
+import { Button } from "../Button/ButtonApollo";
+import { Icon } from "../Icon/IconApollo";
+import { ClickItem } from "../List/ClickItem/ClickItemApollo";
+import { List } from "../List/List/ListApollo";
+import { MenuBurgerCommon } from "./MenuBurgerCommon";
+export const MenuBurger = (props) => (_jsx(MenuBurgerCommon, { ButtonComponent: Button, ClickItemComponent: ClickItem, IconComponent: Icon, ListComponent: List, ...props }));

package/dist/prospect-client/MenuBurger/MenuBurgerCommon.d.ts

@@ -0,0 +1,60 @@
+import { type ComponentPropsWithoutRef, type ComponentType, type ReactNode, type PropsWithChildren } from "react";
+import type { ButtonProps } from "../Button/ButtonCommon";
+import type { IconProps } from "../Icon/IconCommon";
+import type { ClickItemProps } from "../List/ClickItem/ClickItemCommon";
+import type { ListProps } from "../List/List/ListCommon";
+export declare const menuBurgerVariants: {
+    readonly primary: "primary";
+    readonly secondary: "secondary";
+};
+export type MenuBurgerVariants = keyof typeof menuBurgerVariants;
+export type MenuBurgerClickItemProps = Omit<ClickItemProps, "variant"> & {
+    variant?: ClickItemProps["variant"];
+};
+/**
+ * Props for the MenuBurger component.
+ */
+export type MenuBurgerProps = {
+    /**
+     * Label displayed inside the trigger button.
+     */
+    buttonLabel: string;
+    /**
+     * Extra content rendered below the ClickItem list.
+     */
+    children?: ReactNode;
+    /**
+     * Icon displayed on the left side of the trigger button.
+     * @default person
+     */
+    icon?: IconProps["src"];
+    /**
+     * Visual variant of the trigger button.
+     * @default primary
+     */
+    variant?: MenuBurgerVariants;
+    /**
+     * ClickItem list rendered inside the popover panel.
+     */
+    clickItems?: MenuBurgerClickItemProps[];
+} & Omit<ComponentPropsWithoutRef<"div">, "children">;
+type MenuBurgerCommonProps = PropsWithChildren<MenuBurgerProps> & {
+    ButtonComponent: ComponentType<ButtonProps>;
+    ClickItemComponent: ComponentType<ClickItemProps>;
+    IconComponent: ComponentType<IconProps>;
+    ListComponent: ComponentType<ListProps>;
+};
+/**
+ * Renders a burger-style menu button opening a popover panel with navigation and actions.
+ *
+ * @component
+ * @param {PropsWithChildren<MenuBurgerProps>} props - MenuBurger props.
+ * @param {string} props.buttonLabel - Label shown in the trigger button.
+ * @param {IconProps["src"]} [props.icon=person] - Icon shown on the left of the trigger button.
+ * @param {MenuBurgerVariants} [props.variant=primary] - Visual variant of the trigger button.
+ * @param {ClickItemProps[]} [props.clickItems] - Click items displayed under the links.
+ * @param {React.ReactNode} [props.children] - Extra content rendered below the ClickItem list.
+ * @returns {JSX.Element} The rendered MenuBurger component.
+ */
+export declare const MenuBurgerCommon: ({ buttonLabel, icon, variant, clickItems, children, className, ButtonComponent, ClickItemComponent, IconComponent, ListComponent, ...props }: MenuBurgerCommonProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/prospect-client/MenuBurger/MenuBurgerCommon.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import keyboardArrowDown from "@material-symbols/svg-400/outlined/keyboard_arrow_down.svg";
+import person from "@material-symbols/svg-400/outlined/person.svg";
+import { useId, } from "react";
+import { getClassName } from "../utilities/getClassName";
+import { useIsSmallScreen } from "../utilities/hook/useIsSmallScreen";
+import { BREAKPOINT } from "../utilities/constants";
+export const menuBurgerVariants = {
+    primary: "primary",
+    secondary: "secondary",
+};
+/**
+ * Renders a burger-style menu button opening a popover panel with navigation and actions.
+ *
+ * @component
+ * @param {PropsWithChildren<MenuBurgerProps>} props - MenuBurger props.
+ * @param {string} props.buttonLabel - Label shown in the trigger button.
+ * @param {IconProps["src"]} [props.icon=person] - Icon shown on the left of the trigger button.
+ * @param {MenuBurgerVariants} [props.variant=primary] - Visual variant of the trigger button.
+ * @param {ClickItemProps[]} [props.clickItems] - Click items displayed under the links.
+ * @param {React.ReactNode} [props.children] - Extra content rendered below the ClickItem list.
+ * @returns {JSX.Element} The rendered MenuBurger component.
+ */
+export const MenuBurgerCommon = ({ buttonLabel, icon = person, variant = "primary", clickItems, children, className, ButtonComponent, ClickItemComponent, IconComponent, ListComponent, ...props }) => {
+    const isSmallScreen = useIsSmallScreen(BREAKPOINT.MD);
+    const isDesktop = !isSmallScreen;
+    const popoverId = useId();
+    const triggerId = `${popoverId}-trigger`;
+    const iconVariant = variant === "primary" ? "secondary" : "primary";
+    return (_jsxs("div", { className: getClassName({
+            baseClassName: "af-menu-burger",
+            className,
+        }), ...props, children: [isDesktop ? (_jsx(ButtonComponent, { id: triggerId, className: "af-menu-burger__button", variant: variant, iconLeft: _jsx(IconComponent, { src: icon, alt: "", role: "presentation", size: "S", variant: iconVariant }), iconRight: _jsx(IconComponent, { className: "af-menu-burger__button-icon--suffix", src: keyboardArrowDown, alt: "", role: "presentation", size: "S", variant: iconVariant }), popoverTarget: popoverId, popoverTargetAction: "toggle", "aria-haspopup": "true", children: buttonLabel })) : null, _jsxs("section", { id: isDesktop ? popoverId : undefined, popover: isDesktop ? "auto" : undefined, className: "af-menu-burger__panel", "aria-labelledby": isDesktop ? triggerId : undefined, children: [clickItems && clickItems.length > 0 ? (_jsx("div", { className: "af-menu-burger__section af-menu-burger__section--actions", children: _jsx(ListComponent, { className: "af-menu-burger__click-items", variant: "unstyled", children: clickItems.map((clickItem) => (_jsx(ClickItemComponent, { variant: clickItem.variant ?? "small", ...clickItem }, clickItem.title))) }) })) : null, children ? (_jsx("div", { className: "af-menu-burger__section af-menu-burger__content", children: children })) : null] })] }));
+};

package/dist/prospect-client/MenuBurger/MenuBurgerLF.d.ts

@@ -0,0 +1,4 @@
+import "@axa-fr/canopee-css/client/MenuBurger/MenuBurgerAll.css";
+import { type MenuBurgerProps } from "./MenuBurgerCommon";
+export declare const MenuBurger: (props: MenuBurgerProps) => import("react/jsx-runtime").JSX.Element;
+export type { MenuBurgerProps };

package/dist/prospect-client/MenuBurger/MenuBurgerLF.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@axa-fr/canopee-css/client/MenuBurger/MenuBurgerAll.css";
+import { Button } from "../Button/ButtonLF";
+import { Icon } from "../Icon/IconLF";
+import { ClickItem } from "../List/ClickItem/ClickItemLF";
+import { List } from "../List/List/ListLF";
+import { MenuBurgerCommon } from "./MenuBurgerCommon";
+export const MenuBurger = (props) => (_jsx(MenuBurgerCommon, { ButtonComponent: Button, ClickItemComponent: ClickItem, IconComponent: Icon, ListComponent: List, ...props }));

package/dist/prospect-client/MessageBar/MessageBarAction.d.ts

@@ -0,0 +1,8 @@
+import type { ComponentType } from "react";
+import type { ButtonProps } from "../Button/ButtonCommon";
+type MessageBarActionProps = {
+    buttonProps?: ButtonProps;
+    ButtonComponent: ComponentType<ButtonProps>;
+};
+export declare const MessageBarAction: ({ buttonProps, ButtonComponent, }: MessageBarActionProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/prospect-client/MessageBar/MessageBarAction.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { getClassName } from "../utilities/getClassName";
+export const MessageBarAction = ({ buttonProps, ButtonComponent, }) => {
+    if (!buttonProps) {
+        return null;
+    }
+    return (_jsx(ButtonComponent, { ...buttonProps, className: getClassName({
+            baseClassName: "af-message-bar__action",
+            className: buttonProps.className,
+        }) }));
+};

package/dist/prospect-client/MessageBar/MessageBarApollo.d.ts

@@ -0,0 +1,5 @@
+import "@axa-fr/canopee-css/prospect/MessageBar/MessageBarAll.css";
+import { type MessageBarProps } from "./MessageBarCommon";
+export type { MessageBarProps } from "./MessageBarCommon";
+export type { MessageBarVariant } from "./types";
+export declare const MessageBar: (props: MessageBarProps) => import("react/jsx-runtime").JSX.Element;