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

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;

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

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@axa-fr/canopee-css/prospect/MessageBar/MessageBarAll.css";
+import { AccordionCore } from "../AccordionCore/AccordionCoreApollo";
+import { Button } from "../Button/ButtonApollo";
+import { Icon } from "../Icon/IconApollo";
+import { MessageBarCommon } from "./MessageBarCommon";
+export const MessageBar = (props) => (_jsx(MessageBarCommon, { ...props, AccordionCoreComponent: AccordionCore, ButtonComponent: Button, IconComponent: Icon }));

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

@@ -0,0 +1,26 @@
+import { type ComponentPropsWithoutRef, type ComponentType, type ReactNode } from "react";
+import type { AccordionCoreProps } from "../AccordionCore/AccordionCoreCommon";
+import type { ButtonProps } from "../Button/ButtonCommon";
+import type { IconProps } from "../Icon/IconCommon";
+import type { MessageBarVariant } from "./types";
+export type MessageBarProps = {
+    /** Message title. */
+    title: string;
+    /** Description. Always visible on desktop and collapsible on mobile. */
+    description?: ReactNode;
+    /** Icon displayed before the title. */
+    icon: string;
+    /** Visual variant. */
+    variant?: MessageBarVariant;
+    /** Initial mobile expanded state for the description. */
+    defaultDescriptionOpen?: boolean;
+    /** Action button props. No button is rendered when omitted. */
+    buttonProps?: ButtonProps;
+} & Omit<ComponentPropsWithoutRef<"section">, "children">;
+type MessageBarCommonProps = MessageBarProps & {
+    AccordionCoreComponent: ComponentType<AccordionCoreProps>;
+    ButtonComponent: ComponentType<ButtonProps>;
+    IconComponent: ComponentType<IconProps>;
+};
+export declare const MessageBarCommon: ({ title, description, icon, variant, defaultDescriptionOpen, buttonProps, className, AccordionCoreComponent, ButtonComponent, IconComponent, ...sectionProps }: MessageBarCommonProps) => import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,33 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId, } from "react";
+import { BREAKPOINT } from "../utilities/constants";
+import { getClassName } from "../utilities/getClassName";
+import { useIsSmallScreen } from "../utilities/hook/useIsSmallScreen";
+import { MessageBarAction } from "./MessageBarAction";
+import { MessageBarDescription } from "./MessageBarDescription";
+import { MessageBarSummary } from "./MessageBarSummary";
+const iconVariantByMessageBarVariant = {
+    info: "primary",
+    error: "error",
+};
+export const MessageBarCommon = ({ title, description, icon, variant = "info", defaultDescriptionOpen = false, buttonProps, className, AccordionCoreComponent, ButtonComponent, IconComponent, ...sectionProps }) => {
+    const titleId = useId();
+    const isMobile = useIsSmallScreen(BREAKPOINT.MD);
+    const hasDescription = Boolean(description);
+    const sectionAriaLabelledBy = sectionProps["aria-label"] || sectionProps["aria-labelledby"]
+        ? undefined
+        : titleId;
+    const iconVariant = iconVariantByMessageBarVariant[variant];
+    const componentClassName = getClassName({
+        baseClassName: "af-message-bar",
+        modifiers: [variant],
+        className,
+    });
+    const summary = (_jsx(MessageBarSummary, { title: title, titleId: titleId, icon: icon, iconVariant: iconVariant, IconComponent: IconComponent }));
+    const action = (_jsx(MessageBarAction, { buttonProps: buttonProps, ButtonComponent: ButtonComponent }));
+    const body = _jsx(MessageBarDescription, { description: description });
+    if (hasDescription && isMobile) {
+        return (_jsxs(AccordionCoreComponent, { className: componentClassName, role: "region", "aria-labelledby": sectionAriaLabelledBy, open: defaultDescriptionOpen, summary: summary, summaryProps: { className: "af-message-bar__header" }, arrowClickIconVariant: "ghost", arrowIconVariant: iconVariant, ...sectionProps, children: [body, action] }));
+    }
+    return (_jsxs("section", { className: componentClassName, "aria-labelledby": sectionAriaLabelledBy, ...sectionProps, children: [_jsx("div", { className: "af-message-bar__header", children: summary }), body, action] }));
+};

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

@@ -0,0 +1,6 @@
+import type { ReactNode } from "react";
+type MessageBarDescriptionProps = {
+    description?: ReactNode;
+};
+export declare const MessageBarDescription: ({ description, }: MessageBarDescriptionProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

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

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const MessageBarDescription = ({ description, }) => {
+    if (!description) {
+        return null;
+    }
+    const Component = typeof description === "string" ? "p" : "div";
+    return _jsx(Component, { className: "af-message-bar__body", children: description });
+};

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

@@ -0,0 +1,5 @@
+import "@axa-fr/canopee-css/client/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;

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

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@axa-fr/canopee-css/client/MessageBar/MessageBarAll.css";
+import { AccordionCore } from "../AccordionCore/AccordionCoreLF";
+import { Button } from "../Button/ButtonLF";
+import { Icon } from "../Icon/IconLF";
+import { MessageBarCommon } from "./MessageBarCommon";
+export const MessageBar = (props) => (_jsx(MessageBarCommon, { ...props, AccordionCoreComponent: AccordionCore, ButtonComponent: Button, IconComponent: Icon }));

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

@@ -0,0 +1,11 @@
+import type { ComponentType } from "react";
+import type { IconProps } from "../Icon/IconCommon";
+type MessageBarSummaryProps = {
+    title: string;
+    titleId: string;
+    icon: string;
+    iconVariant: IconProps["variant"];
+    IconComponent: ComponentType<IconProps>;
+};
+export declare const MessageBarSummary: ({ title, titleId, icon, iconVariant, IconComponent, }: MessageBarSummaryProps) => import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,2 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+export const MessageBarSummary = ({ title, titleId, icon, iconVariant, IconComponent, }) => (_jsxs(_Fragment, { children: [_jsx(IconComponent, { src: icon, className: "af-message-bar__icon", role: "presentation", variant: iconVariant }), _jsx("p", { id: titleId, className: "af-message-bar__title", children: title })] }));

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

@@ -0,0 +1 @@
+export type MessageBarVariant = "info" | "error";

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

@@ -0,0 +1 @@
+export {};

package/dist/prospect-client/Modal/ModalApollo.d.ts

@@ -6,6 +6,6 @@ export { ModalCoreFooter } from "./components/ModalCoreFooterApollo";
 export { ModalCoreHeader } from "./components/ModalCoreHeaderApollo";
 export type { ModalCoreFooterProps, ModalCoreHeaderProps, ModalProps, } from "./types";
 export declare const Modal: {
-    ({ headingProps, icon, iconProps, ...props }: ModalProps): import("react/jsx-runtime").JSX.Element;
+    ({ headingProps, ...props }: ModalProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/dist/prospect-client/Modal/ModalApollo.js

@@ -7,10 +7,8 @@ export { ModalCore } from "./components/ModalCore";
 export { ModalCoreBody, } from "./components/ModalCoreBody";
 export { ModalCoreFooter } from "./components/ModalCoreFooterApollo";
 export { ModalCoreHeader } from "./components/ModalCoreHeaderApollo";
-export const Modal = ({ headingProps = {}, icon, iconProps, ...props }) => (_jsx(ModalCommon, { ...props, headingComponent: Heading, headingProps: {
+export const Modal = ({ headingProps = {}, ...props }) => (_jsx(ModalCommon, { ...props, headingComponent: Heading, headingProps: {
         ...headingProps,
         children: props.title,
-        icon: headingProps.icon ?? icon,
-        iconProps: headingProps.iconProps ?? iconProps,
     }, buttonComponent: Button }));
 Modal.displayName = "Modal";

package/dist/prospect-client/Modal/ModalCommon.d.ts

@@ -8,6 +8,6 @@ export type ModalCommonProps = ModalCoreProps & Omit<ModalCoreHeaderCommonProps,
     modalCoreHeaderProps?: ModalCoreHeaderContainerProps;
 };
 export declare const ModalCommon: {
-    ({ children, headingComponent, headingProps, closeButtonAriaLabel, onClose, iconProps, primaryButtonProps, secondaryButtonProps, tertiaryButtonProps, buttonComponent, modalCoreBodyProps, modalCoreFooterProps, modalCoreHeaderProps, ...props }: ModalCommonProps): import("react/jsx-runtime").JSX.Element;
+    ({ children, headingComponent, headingProps, closeButtonAriaLabel, onClose, primaryButtonProps, secondaryButtonProps, tertiaryButtonProps, buttonComponent, modalCoreBodyProps, modalCoreFooterProps, modalCoreHeaderProps, ...props }: ModalCommonProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/dist/prospect-client/Modal/ModalCommon.js

@@ -3,5 +3,5 @@ import { ModalCore } from "./components/ModalCore";
 import { ModalCoreBody, } from "./components/ModalCoreBody";
 import { ModalCoreFooterCommon, } from "./components/ModalCoreFooterCommon";
 import { ModalCoreHeaderCommon } from "./components/ModalCoreHeaderCommon";
-export const ModalCommon = ({ children, headingComponent, headingProps, closeButtonAriaLabel, onClose, iconProps, primaryButtonProps, secondaryButtonProps, tertiaryButtonProps, buttonComponent, modalCoreBodyProps, modalCoreFooterProps, modalCoreHeaderProps, ...props }) => (_jsxs(ModalCore, { onClose: onClose, ...props, children: [_jsx(ModalCoreHeaderCommon, { headingComponent: headingComponent, headingProps: headingProps, iconProps: iconProps, onClose: onClose, closeButtonAriaLabel: closeButtonAriaLabel, ...modalCoreHeaderProps }), _jsx(ModalCoreBody, { ...modalCoreBodyProps, children: children }), _jsx(ModalCoreFooterCommon, { buttonComponent: buttonComponent, primaryButtonProps: primaryButtonProps, secondaryButtonProps: secondaryButtonProps, tertiaryButtonProps: tertiaryButtonProps, ...modalCoreFooterProps })] }));
+export const ModalCommon = ({ children, headingComponent, headingProps, closeButtonAriaLabel, onClose, primaryButtonProps, secondaryButtonProps, tertiaryButtonProps, buttonComponent, modalCoreBodyProps, modalCoreFooterProps, modalCoreHeaderProps, ...props }) => (_jsxs(ModalCore, { onClose: onClose, ...props, children: [_jsx(ModalCoreHeaderCommon, { headingComponent: headingComponent, headingProps: headingProps, onClose: onClose, closeButtonAriaLabel: closeButtonAriaLabel, ...modalCoreHeaderProps }), _jsx(ModalCoreBody, { ...modalCoreBodyProps, children: children }), _jsx(ModalCoreFooterCommon, { buttonComponent: buttonComponent, primaryButtonProps: primaryButtonProps, secondaryButtonProps: secondaryButtonProps, tertiaryButtonProps: tertiaryButtonProps, ...modalCoreFooterProps })] }));
 ModalCommon.displayName = "ModalCommon";

package/dist/prospect-client/Modal/ModalLF.d.ts

@@ -6,6 +6,6 @@ export { ModalCoreFooter } from "./components/ModalCoreFooterLF";
 export { ModalCoreHeader } from "./components/ModalCoreHeaderLF";
 export type { ModalCoreFooterProps, ModalCoreHeaderProps, ModalProps, } from "./types";
 export declare const Modal: {
-    ({ headingProps, icon, iconProps, ...props }: ModalProps): import("react/jsx-runtime").JSX.Element;
+    ({ headingProps, ...props }: ModalProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/dist/prospect-client/Modal/ModalLF.js

@@ -7,10 +7,8 @@ export { ModalCore } from "./components/ModalCore";
 export { ModalCoreBody, } from "./components/ModalCoreBody";
 export { ModalCoreFooter } from "./components/ModalCoreFooterLF";
 export { ModalCoreHeader } from "./components/ModalCoreHeaderLF";
-export const Modal = ({ headingProps = {}, icon, iconProps, ...props }) => (_jsx(ModalCommon, { ...props, headingComponent: Heading, headingProps: {
+export const Modal = ({ headingProps = {}, ...props }) => (_jsx(ModalCommon, { ...props, headingComponent: Heading, headingProps: {
         ...headingProps,
         children: props.title,
-        icon: headingProps.icon ?? icon,
-        iconProps: headingProps.iconProps ?? iconProps,
     }, buttonComponent: Button }));
 Modal.displayName = "Modal";

package/dist/prospect-client/Modal/components/ModalCoreHeaderCommon.d.ts

@@ -1,16 +1,9 @@
 import type { ComponentPropsWithoutRef, ComponentType } from "react";
 import type { HeadingProps } from "../../Heading/types";
-import type { IconProps } from "../../Icon/IconCommon";
 export type ModalCoreHeaderContainerProps = ComponentPropsWithoutRef<"header">;
 export type ModalCoreHeaderCommonProps = ModalCoreHeaderContainerProps & {
     headingComponent: ComponentType<HeadingProps>;
     headingProps: HeadingProps;
-    /**
-     * @deprecated Pass `icon` and `iconProps` (without `src`) inside
-     * `headingProps` instead. The legacy `iconProps` is forwarded to the
-     * Heading molecule for backward compatibility and will be removed in 2.0.0.
-     */
-    iconProps?: IconProps;
     onClose?: VoidFunction;
     closeButtonAriaLabel?: string;
 };

package/dist/prospect-client/Modal/components/ModalCoreHeaderCommon.js

@@ -2,16 +2,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import close from "@material-symbols/svg-400/rounded/close.svg";
 import { ClickIcon } from "../../ClickIcon/ClickIconCommon";
 export const ModalCoreHeaderCommon = (props) => {
-    const { className, headingComponent: HeadingComponent, headingProps, iconProps, onClose, closeButtonAriaLabel = "Fermer la boite de dialogue", ...rest } = props;
-    // Backward-compat: legacy `iconProps` (with `src`) is routed through the
-    // Heading molecule, which already renders the icon and title together.
-    const { src: legacyIconSrc, ...legacyIconRest } = iconProps ?? {};
-    const mergedHeadingProps = legacyIconSrc
-        ? {
-            ...headingProps,
-            icon: headingProps.icon ?? legacyIconSrc,
-            iconProps: { ...legacyIconRest, ...(headingProps.iconProps ?? {}) },
-        }
-        : headingProps;
-    return (_jsxs("header", { className: ["af-modal__header", className].filter(Boolean).join(" "), ...rest, children: [_jsx(ClickIcon, { className: "af-modal__header-close-btn", src: close, onClick: onClose, "aria-label": closeButtonAriaLabel }), _jsx("div", { className: "af-modal__header-title", children: _jsx(HeadingComponent, { level: 2, ...mergedHeadingProps }) })] }));
+    const { className, headingComponent: HeadingComponent, headingProps, onClose, closeButtonAriaLabel = "Fermer la boite de dialogue", ...rest } = props;
+    return (_jsxs("header", { className: ["af-modal__header", className].filter(Boolean).join(" "), ...rest, children: [_jsx(ClickIcon, { className: "af-modal__header-close-btn", src: close, onClick: onClose, "aria-label": closeButtonAriaLabel }), _jsx("div", { className: "af-modal__header-title", children: _jsx(HeadingComponent, { level: 2, ...headingProps }) })] }));
 };

package/dist/prospect-client/Modal/types.d.ts

@@ -1,5 +1,4 @@
 import type { HeadingProps } from "../Heading/types";
-import type { IconProps } from "../Icon/IconCommon";
 import type { ModalCoreFooterCommonProps } from "./components/ModalCoreFooterCommon";
 import type { ModalCoreHeaderCommonProps } from "./components/ModalCoreHeaderCommon";
 import type { ModalCommonProps } from "./ModalCommon";
@@ -7,18 +6,4 @@ export type ModalCoreHeaderProps = Omit<ModalCoreHeaderCommonProps, "headingComp
 export type ModalCoreFooterProps = Omit<ModalCoreFooterCommonProps, "buttonComponent">;
 export type ModalProps = Omit<ModalCommonProps, "headingComponent" | "headingProps" | "iconProps" | "buttonComponent"> & {
     headingProps?: Omit<HeadingProps, "children">;
-    /**
-     * @deprecated Pass `icon` inside `headingProps` instead
-     * (e.g. `headingProps={{ icon }}`). The top-level `icon` prop is
-     * forwarded to the Heading molecule for backward compatibility and will
-     * be removed in 2.0.0.
-     */
-    icon?: string;
-    /**
-     * @deprecated Pass `iconProps` inside `headingProps` instead
-     * (e.g. `headingProps={{ iconProps }}`). The top-level `iconProps`
-     * is forwarded to the Heading molecule for backward compatibility and
-     * will be removed in 2.0.0.
-     */
-    iconProps?: Omit<IconProps, "src">;
 };

package/dist/prospect-client/ProgressBarGroup/ProgressBarGroupCommon.d.ts

@@ -3,10 +3,6 @@ import { ProgressBar } from "../ProgressBar/ProgressBarCommon";
 export type ProgressBarGroupProps = {
     currentStepProgress?: number;
     currentStep: number;
-    /**
-     * @deprecated Use `stepsCount` instead.
-     */
-    nbSteps?: 2 | 3 | 4 | 5 | 6 | 7 | 8;
     stepsCount?: 2 | 3 | 4 | 5 | 6 | 7 | 8;
     max?: number;
     className?: string;
@@ -14,5 +10,5 @@ export type ProgressBarGroupProps = {
 type ProgressBarGroupCommonProps = ProgressBarGroupProps & {
     ProgressBarComponent: ComponentType<ComponentProps<typeof ProgressBar>>;
 };
-export declare const ProgressBarGroupCommon: ({ currentStepProgress, max, nbSteps, stepsCount, currentStep, className, ProgressBarComponent, ...props }: ProgressBarGroupCommonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ProgressBarGroupCommon: ({ currentStepProgress, max, stepsCount, currentStep, className, ProgressBarComponent, ...props }: ProgressBarGroupCommonProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/prospect-client/ProgressBarGroup/ProgressBarGroupCommon.js

@@ -3,7 +3,7 @@ import classNames from "classnames";
 import { useId } from "react";
 import { ProgressBar } from "../ProgressBar/ProgressBarCommon";
 import { useSequentialProgress } from "./useSequentialProgress";
-export const ProgressBarGroupCommon = ({ currentStepProgress = 0, max = 100, nbSteps = 4, stepsCount = nbSteps, currentStep, className, ProgressBarComponent, ...props }) => {
+export const ProgressBarGroupCommon = ({ currentStepProgress = 0, max = 100, stepsCount = 4, currentStep, className, ProgressBarComponent, ...props }) => {
     const stepperId = useId();
     const progressValues = useSequentialProgress(currentStepProgress / max, currentStep, stepsCount);
     return (_jsx("ol", { className: classNames("af-progress-bar-group", className), ...props, children: progressValues.map((value, index) => (_jsx("li", { className: "af-progress-bar-group__item", children: _jsx(ProgressBarComponent, { value: value, "aria-hidden": true }) }, `af-progress-bar-group__item--${stepperId}-${index}`))) }));

package/dist/prospect-client/Skeleton/Skeleton.d.ts

@@ -0,0 +1,61 @@
+import type { ComponentPropsWithoutRef } from "react";
+import "@axa-fr/canopee-css/client/Skeleton/SkeletonAll.css";
+export declare const skeletonVariants: {
+    readonly action: "action";
+    readonly circle: "circle";
+    readonly rectangle: "rectangle";
+};
+export type SkeletonVariant = keyof typeof skeletonVariants;
+export declare const skeletonSizeVariants: {
+    readonly XS: "extra-small";
+    readonly S: "small";
+    readonly M: "medium";
+    readonly L: "large";
+    readonly XL: "extra-large";
+    readonly XXL: "extra-extra-large";
+};
+export type SkeletonSizeVariant = keyof typeof skeletonSizeVariants;
+export type SkeletonCircleSizeVariant = keyof Pick<typeof skeletonSizeVariants, "S" | "M" | "L">;
+export type SkeletonActionSizeVariant = keyof Pick<typeof skeletonSizeVariants, "M">;
+type SkeletonSharedProps = {
+    colSize?: number;
+    rowSize?: number;
+} & ComponentPropsWithoutRef<"div">;
+type SkeletonCircleProps = {
+    size?: SkeletonCircleSizeVariant;
+    variant: "circle";
+};
+type SkeletonActionProps = {
+    size?: SkeletonActionSizeVariant;
+    variant: "action";
+};
+type SkeletonRectangleProps = {
+    size?: SkeletonSizeVariant;
+    variant?: "rectangle";
+};
+/**
+ * Props for the `Skeleton` component.
+ *
+ * The allowed `size` values depend on the selected `variant`:
+ * - `circle`: `S | M | L`
+ * - `action`: `M`
+ * - `rectangle`: `XS | S | M | L | XL | XXL`
+ */
+export type SkeletonProps = SkeletonSharedProps & (SkeletonCircleProps | SkeletonActionProps | SkeletonRectangleProps);
+/**
+ * Renders one skeleton placeholder block.
+ *
+ * This is the base building block used by `SkeletonGrid`, `SkeletonList`,
+ * and `ExitLayoutSkeleton`.
+ *
+ * @component
+ * @param {SkeletonProps} props - Skeleton props.
+ * @param {number} [props.colSize=1] - Number of grid columns occupied by the skeleton.
+ * @param {number} [props.rowSize=1] - Number of grid rows occupied by the skeleton.
+ * @param {SkeletonVariant} [props.variant="rectangle"] - Visual variant of the placeholder.
+ * @param {SkeletonSizeVariant | SkeletonCircleSizeVariant | SkeletonActionSizeVariant} [props.size="M"] - Size applied to the skeleton. The accepted values depend on `variant`.
+ * @param {string} [props.className] - Additional CSS class applied to the skeleton.
+ * @returns {JSX.Element} The rendered Skeleton component.
+ */
+export declare const Skeleton: ({ className, colSize, rowSize, size, variant, style, ...props }: SkeletonProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/prospect-client/Skeleton/Skeleton.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@axa-fr/canopee-css/client/Skeleton/SkeletonAll.css";
+import { getClassName } from "../utilities/getClassName";
+const CLASS_NAME = "af-skeleton";
+export const skeletonVariants = {
+    action: "action",
+    circle: "circle",
+    rectangle: "rectangle",
+};
+export const skeletonSizeVariants = {
+    XS: "extra-small",
+    S: "small",
+    M: "medium",
+    L: "large",
+    XL: "extra-large",
+    XXL: "extra-extra-large",
+};
+/**
+ * Renders one skeleton placeholder block.
+ *
+ * This is the base building block used by `SkeletonGrid`, `SkeletonList`,
+ * and `ExitLayoutSkeleton`.
+ *
+ * @component
+ * @param {SkeletonProps} props - Skeleton props.
+ * @param {number} [props.colSize=1] - Number of grid columns occupied by the skeleton.
+ * @param {number} [props.rowSize=1] - Number of grid rows occupied by the skeleton.
+ * @param {SkeletonVariant} [props.variant="rectangle"] - Visual variant of the placeholder.
+ * @param {SkeletonSizeVariant | SkeletonCircleSizeVariant | SkeletonActionSizeVariant} [props.size="M"] - Size applied to the skeleton. The accepted values depend on `variant`.
+ * @param {string} [props.className] - Additional CSS class applied to the skeleton.
+ * @returns {JSX.Element} The rendered Skeleton component.
+ */
+export const Skeleton = ({ className, colSize = 1, rowSize = 1, size = "M", variant = "rectangle", style, ...props }) => (_jsx("div", { ...props, className: getClassName({
+        baseClassName: CLASS_NAME,
+        modifiers: [variant, skeletonSizeVariants[size]],
+        className,
+    }), style: {
+        "--col-size": colSize,
+        "--row-size": rowSize,
+        ...style,
+    } }));

package/dist/prospect-client/SkeletonGrid/SkeletonGrid.d.ts

@@ -0,0 +1,51 @@
+import type { ReactNode } from "react";
+import { type SkeletonProps } from "../Skeleton/Skeleton";
+import "@axa-fr/canopee-css/prospect/SkeletonGrid/SkeletonGridAll.css";
+/**
+ * One skeleton cell rendered inside a `SkeletonGrid` row.
+ */
+export type SkeletonGridItem = SkeletonProps;
+type isLoadingAndChildrenProps = {
+    children: ReactNode;
+    isLoading: boolean;
+} | {
+    children?: undefined;
+    isLoading?: boolean;
+};
+/**
+ * Props for the `SkeletonGrid` component.
+ *
+ * `grid` is a two-level array where:
+ * - first level represents rows
+ * - second level represents skeleton cells rendered in each row
+ */
+export type SkeletonGridProps = {
+    className?: string;
+    grid: SkeletonGridItem[][];
+    "aria-busy"?: boolean;
+    "aria-label"?: string;
+    maxCols?: number;
+    colGap?: number;
+    rowGap?: number;
+} & isLoadingAndChildrenProps;
+/**
+ * Renders a responsive grid of skeleton placeholders.
+ *
+ * When `isLoading` is `false`, the component returns its `children` instead of
+ * the skeleton grid.
+ *
+ * @component
+ * @param {SkeletonGridProps} props - SkeletonGrid props.
+ * @param {SkeletonGridItem[][]} props.grid - Grid definition where each row contains one or more skeleton cells.
+ * @param {number} [props.maxCols=12] - Number of columns used to build the grid template.
+ * @param {number} [props.colGap=16] - Horizontal gap between grid columns, in pixels.
+ * @param {number} [props.rowGap=8] - Vertical gap between grid rows, in pixels.
+ * @param {boolean} [props.isLoading=true] - When `true`, displays the skeleton placeholders.
+ * @param {ReactNode} [props.children] - Content rendered when `isLoading` is `false`.
+ * @param {string} [props.className] - Additional CSS class applied to the root element.
+ * @param {string} [props.aria-label="Chargement"] - Accessible label for the loading region.
+ * @param {boolean} [props.aria-busy=true] - Announces the loading region as busy to assistive technologies.
+ * @returns {JSX.Element | ReactNode} The rendered skeleton grid or the fallback children.
+ */
+export declare const SkeletonGrid: ({ className, grid, "aria-busy": ariaBusy, "aria-label": ariaLabel, maxCols, colGap, rowGap, isLoading, children, }: SkeletonGridProps) => string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+export {};