@axa-fr/canopee-react 2.0.0-alpha.8 → 2.0.0-alpha.80

package/dist/client.d.ts

@@ -1,13 +1,14 @@
-import "@axa-fr/canopee-css/client/common/rebootLF.css";
+import "@axa-fr/canopee-css/client/common/reboot.css";
 import "@axa-fr/canopee-css/client/common/tokens.css";
 import "@axa-fr/canopee-css/client/Grid/Grid.css";
 import "@fontsource/source-sans-pro";
 export { Accordion, accordionVariants, type AccordionVariants, } from "./prospect-client/Accordion/AccordionLF";
 export { AccordionContextual, accordionContextualVariants, type AccordionContextualVariants, } from "./prospect-client/AccordionContextual/AccordionContextualLF";
 export { AccordionCore } from "./prospect-client/AccordionCore/AccordionCoreLF";
+export { AppName, type AppNameProps } from "./prospect-client/AppName/AppName";
 export { BasePicture } from "./prospect-client/BasePicture/BasePicture";
 export { Button, buttonVariants, type ButtonVariants, } from "./prospect-client/Button/ButtonLF";
-export { Card, type CardProps } from "./prospect-client/Card/CardLF";
+export { Card, cardVariants, type CardProps, type CardVariants, } from "./prospect-client/Card/CardLF";
 export { CardMessage, cardMessageVariants, type CardMessageVariants, } from "./prospect-client/CardMessage/CardMessageLF";
 export { ClickIcon } from "./prospect-client/ClickIcon/ClickIconLF";
 export { ContentItemDuoAction, type ContentItemDuoActionState, } from "./prospect-client/ContentItemDuoAction/ContentItemDuoActionLF";
@@ -15,9 +16,7 @@ export { ContentItemMono } from "./prospect-client/ContentItemMono/ContentItemMo
 export { DataAgent, type DataAgentProps, } from "./prospect-client/DataAgent/DataAgentLF";
 export { Divider } from "./prospect-client/Divider/DividerLF";
 export { Fieldset, type FieldsetProps, } from "./prospect-client/Fieldset/FieldsetLF";
-export { CardCheckbox, 
-/** @deprecated Use `CardCheckbox` instead. */
-CardCheckbox as CheckboxCard, } from "./prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxLF";
+export { CardCheckbox, type CardCheckboxProps, } from "./prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxLF";
 export { CardCheckboxOption } from "./prospect-client/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF";
 export { Checkbox } from "./prospect-client/Form/Checkbox/Checkbox/CheckboxLF";
 export { CheckboxText } from "./prospect-client/Form/Checkbox/CheckboxText/CheckboxTextLF";
@@ -25,30 +24,27 @@ export { Dropdown } from "./prospect-client/Form/Dropdown/DropdownLF";
 export { FileUpload } from "./prospect-client/Form/FileUpload/FileUpload/FileUploadLF";
 export { InputFile } from "./prospect-client/Form/FileUpload/InputFile/InputFileLF";
 export { ItemFile } from "./prospect-client/Form/FileUpload/ItemFile/ItemFileLF";
-export { 
-/** @deprecated Use `InputDate` instead. */
-InputDate as DateInput, InputDate, } from "./prospect-client/Form/InputDate/InputDateLF";
+export { InputDate } from "./prospect-client/Form/InputDate/InputDateLF";
 export { type OptionType } from "./prospect-client/Form/InputPhone/InputPhone.types";
 export { InputPhone } from "./prospect-client/Form/InputPhone/InputPhoneLF";
-export { InputText, 
-/** @deprecated Use `InputText` instead. */
-InputText as TextInput, } from "./prospect-client/Form/InputText/InputTextLF";
+export { InputText } from "./prospect-client/Form/InputText/InputTextLF";
 export { InputTextAtom } from "./prospect-client/Form/InputTextAtom/InputTextAtomLF";
 export { ItemLabel } from "./prospect-client/Form/ItemLabel/ItemLabelLF";
-export { ItemMessage, itemMessageVariants, type ItemMessageVariants, } from "./prospect-client/Form/ItemMessage/ItemMessageLF";
+export { ItemMessage, itemMessageVariants, type ItemMessageVariants, } from "./prospect-client/Form/ItemMessage/ItemMessage";
 export { ItemMultiSelect, type ItemMultiSelectProps, } from "./prospect-client/Form/ItemMultiSelect/ItemMultiSelectLF";
+export { MultiSelectList, type MultiSelectListProps, } from "./prospect-client/Form/MultiSelectList/MultiSelectListLF";
 export { CardRadio } from "./prospect-client/Form/Radio/CardRadio/CardRadioLF";
 export { CardRadioGroup } from "./prospect-client/Form/Radio/CardRadioGroup/CardRadioGroupLF";
 export { Radio } from "./prospect-client/Form/Radio/Radio/RadioLF";
 export { RadioText, type RadioTextProps, } from "./prospect-client/Form/Radio/RadioText/RadioTextLF";
 export { TextArea } from "./prospect-client/Form/TextArea/TextAreaLF";
 export { DebugGrid } from "./prospect-client/Grid/DebugGridLF";
+export { Header, type HeaderProps } from "./prospect-client/Header/HeaderLF";
 export { Heading, type HeadingLevel, type HeadingProps, } from "./prospect-client/Heading/HeadingLF";
 export { Icon, iconSizeVariants, iconVariants, type IconSizeVariants, type IconVariants, } from "./prospect-client/Icon/IconLF";
-export { ItemTabBar, type ItemTabBarProps, } from "./prospect-client/ItemTabBar/ItemTabBarLF";
 export { ItemMenu, type ItemMenuProps, } from "./prospect-client/ItemMenu/ItemMenuLF";
-export { TabMenu, type TabMenuProps } from "./prospect-client/TabMenu/TabMenu";
-export { ExitLayout, type ExitLayoutProps, type ExitLayoutWithSubComponents, } from "./prospect-client/Layout/ExitLayout/ExitLayoutLF";
+export { ItemTabBar, type ItemTabBarProps, } from "./prospect-client/ItemTabBar/ItemTabBarLF";
+export { ExitLayout, type ExitLayoutProps, type ExitLayoutWithSubComponents, ExitLayoutSkeleton, type ExitLayoutSkeletonProps, } from "./prospect-client/Layout/ExitLayout/ExitLayoutLF";
 export { Footer, type FooterProps, } from "./prospect-client/Layout/Footer/FooterLF";
 export { FormLayout, type FormLayoutProps, } from "./prospect-client/Layout/FormLayout/FormLayout";
 export { LevelSelector, type LevelSelectorProps, } from "./prospect-client/LevelSelector/LevelSelectorLF";
@@ -57,16 +53,18 @@ export { ClickItem, clickItemStates, clickItemVariants, type ClickItemStates, ty
 export { ContentItemDuo } from "./prospect-client/List/ContentItemDuo/ContentItemDuoLF";
 export { List, type ListProps } from "./prospect-client/List/List/ListLF";
 export { Loader, type LoaderProps } from "./prospect-client/Loader/LoaderLF";
+export { MenuBurger, type MenuBurgerProps, } from "./prospect-client/MenuBurger/MenuBurgerLF";
 export { Message, messageVariants, type MessageVariants, } from "./prospect-client/Message/MessageLF";
-export { MultiMessage, type MultiMessageItem, type MultiMessageProps, } from "./prospect-client/MultiMessage/MultiMessageLF";
 export { Modal, ModalCore, ModalCoreBody, ModalCoreFooter, ModalCoreHeader, } from "./prospect-client/Modal/ModalLF";
+export { MultiMessage, type MultiMessageItem, type MultiMessageProps, } from "./prospect-client/MultiMessage/MultiMessageLF";
 export { ErrorPage, type ErrorPageProps, } from "./prospect-client/pages/ErrorPage/ErrorPageLF";
 export { ValidPage, type ValidPageProps, } from "./prospect-client/pages/ValidPage/ValidPageLF";
 export { ItemPagination, type ItemPaginationProps, } from "./prospect-client/Pagination/ItemPagination/ItemPaginationLF";
 export { Pagination } from "./prospect-client/Pagination/PaginationLF";
 export { ProgressBar } from "./prospect-client/ProgressBar/ProgressBarLF";
 export { ProgressBarGroup } from "./prospect-client/ProgressBarGroup/ProgressBarGroupLF";
-export { Skeleton, type SkeletonProps, } from "./prospect-client/Skeleton/SkeletonLF";
+export { Skeleton, skeletonSizeVariants, skeletonVariants, type SkeletonActionSizeVariant, type SkeletonCircleSizeVariant, type SkeletonProps, type SkeletonSizeVariant, type SkeletonVariant, } from "./prospect-client/Skeleton/Skeleton";
+export { SkeletonGrid, type SkeletonGridProps, } from "./prospect-client/SkeletonGrid/SkeletonGrid";
 export { SkeletonList, type SkeletonListProps, } from "./prospect-client/SkeletonList/SkeletonListLF";
 export { Spinner, spinnerVariants, type SpinnerVariants, } from "./prospect-client/Spinner/SpinnerLF";
 export { Stepper } from "./prospect-client/Stepper/StepperLF";
@@ -74,8 +72,10 @@ export { Svg } from "./prospect-client/Svg/Svg";
 export { TabBar, tabBarDirection, type TabBarDirection, type TabBarProps, } from "./prospect-client/TabBar/TabBarLF";
 export { Table, type BodyColorVariants, type HeadColorVariants, type RowSizeVariants, type TableProps, } from "./prospect-client/Table/TableLF";
 export { TableMobileCard, type TableMobileCardProps, } from "./prospect-client/TableMobileCard/TableMobileCard";
+export { TabMenu, type TabMenuProps } from "./prospect-client/TabMenu/TabMenu";
 export { Tag, tagVariants, type TagVariants, } from "./prospect-client/Tag/TagLF";
 export { TagList, type TagListProps, } from "./prospect-client/TagList/TagListLF";
 export { TimelineVertical } from "./prospect-client/TimelineVertical/TimelineVerticalLF";
 export { Toggle } from "./prospect-client/Toggle/ToggleLF";
 export type { GridContainerProps } from "./prospect-client/utilities/types/GridContainerProps";
+export { MessageBar, type MessageBarProps, type MessageBarVariant, } from "./prospect-client/MessageBar/MessageBarLF";

package/dist/client.js

@@ -1,13 +1,14 @@
-import "@axa-fr/canopee-css/client/common/rebootLF.css";
+import "@axa-fr/canopee-css/client/common/reboot.css";
 import "@axa-fr/canopee-css/client/common/tokens.css";
 import "@axa-fr/canopee-css/client/Grid/Grid.css";
 import "@fontsource/source-sans-pro";
 export { Accordion, accordionVariants, } from "./prospect-client/Accordion/AccordionLF";
 export { AccordionContextual, accordionContextualVariants, } from "./prospect-client/AccordionContextual/AccordionContextualLF";
 export { AccordionCore } from "./prospect-client/AccordionCore/AccordionCoreLF";
+export { AppName } from "./prospect-client/AppName/AppName";
 export { BasePicture } from "./prospect-client/BasePicture/BasePicture";
 export { Button, buttonVariants, } from "./prospect-client/Button/ButtonLF";
-export { Card } from "./prospect-client/Card/CardLF";
+export { Card, cardVariants, } from "./prospect-client/Card/CardLF";
 export { CardMessage, cardMessageVariants, } from "./prospect-client/CardMessage/CardMessageLF";
 export { ClickIcon } from "./prospect-client/ClickIcon/ClickIconLF";
 export { ContentItemDuoAction, } from "./prospect-client/ContentItemDuoAction/ContentItemDuoActionLF";
@@ -15,9 +16,7 @@ export { ContentItemMono } from "./prospect-client/ContentItemMono/ContentItemMo
 export { DataAgent, } from "./prospect-client/DataAgent/DataAgentLF";
 export { Divider } from "./prospect-client/Divider/DividerLF";
 export { Fieldset, } from "./prospect-client/Fieldset/FieldsetLF";
-export { CardCheckbox, 
-/** @deprecated Use `CardCheckbox` instead. */
-CardCheckbox as CheckboxCard, } from "./prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxLF";
+export { CardCheckbox, } from "./prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxLF";
 export { CardCheckboxOption } from "./prospect-client/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF";
 export { Checkbox } from "./prospect-client/Form/Checkbox/Checkbox/CheckboxLF";
 export { CheckboxText } from "./prospect-client/Form/Checkbox/CheckboxText/CheckboxTextLF";
@@ -25,30 +24,27 @@ export { Dropdown } from "./prospect-client/Form/Dropdown/DropdownLF";
 export { FileUpload } from "./prospect-client/Form/FileUpload/FileUpload/FileUploadLF";
 export { InputFile } from "./prospect-client/Form/FileUpload/InputFile/InputFileLF";
 export { ItemFile } from "./prospect-client/Form/FileUpload/ItemFile/ItemFileLF";
-export { 
-/** @deprecated Use `InputDate` instead. */
-InputDate as DateInput, InputDate, } from "./prospect-client/Form/InputDate/InputDateLF";
+export { InputDate } from "./prospect-client/Form/InputDate/InputDateLF";
 export {} from "./prospect-client/Form/InputPhone/InputPhone.types";
 export { InputPhone } from "./prospect-client/Form/InputPhone/InputPhoneLF";
-export { InputText, 
-/** @deprecated Use `InputText` instead. */
-InputText as TextInput, } from "./prospect-client/Form/InputText/InputTextLF";
+export { InputText } from "./prospect-client/Form/InputText/InputTextLF";
 export { InputTextAtom } from "./prospect-client/Form/InputTextAtom/InputTextAtomLF";
 export { ItemLabel } from "./prospect-client/Form/ItemLabel/ItemLabelLF";
-export { ItemMessage, itemMessageVariants, } from "./prospect-client/Form/ItemMessage/ItemMessageLF";
+export { ItemMessage, itemMessageVariants, } from "./prospect-client/Form/ItemMessage/ItemMessage";
 export { ItemMultiSelect, } from "./prospect-client/Form/ItemMultiSelect/ItemMultiSelectLF";
+export { MultiSelectList, } from "./prospect-client/Form/MultiSelectList/MultiSelectListLF";
 export { CardRadio } from "./prospect-client/Form/Radio/CardRadio/CardRadioLF";
 export { CardRadioGroup } from "./prospect-client/Form/Radio/CardRadioGroup/CardRadioGroupLF";
 export { Radio } from "./prospect-client/Form/Radio/Radio/RadioLF";
 export { RadioText, } from "./prospect-client/Form/Radio/RadioText/RadioTextLF";
 export { TextArea } from "./prospect-client/Form/TextArea/TextAreaLF";
 export { DebugGrid } from "./prospect-client/Grid/DebugGridLF";
+export { Header } from "./prospect-client/Header/HeaderLF";
 export { Heading, } from "./prospect-client/Heading/HeadingLF";
 export { Icon, iconSizeVariants, iconVariants, } from "./prospect-client/Icon/IconLF";
-export { ItemTabBar, } from "./prospect-client/ItemTabBar/ItemTabBarLF";
 export { ItemMenu, } from "./prospect-client/ItemMenu/ItemMenuLF";
-export { TabMenu } from "./prospect-client/TabMenu/TabMenu";
-export { ExitLayout, } from "./prospect-client/Layout/ExitLayout/ExitLayoutLF";
+export { ItemTabBar, } from "./prospect-client/ItemTabBar/ItemTabBarLF";
+export { ExitLayout, ExitLayoutSkeleton, } from "./prospect-client/Layout/ExitLayout/ExitLayoutLF";
 export { Footer, } from "./prospect-client/Layout/Footer/FooterLF";
 export { FormLayout, } from "./prospect-client/Layout/FormLayout/FormLayout";
 export { LevelSelector, } from "./prospect-client/LevelSelector/LevelSelectorLF";
@@ -57,16 +53,18 @@ export { ClickItem, clickItemStates, clickItemVariants, } from "./prospect-clien
 export { ContentItemDuo } from "./prospect-client/List/ContentItemDuo/ContentItemDuoLF";
 export { List } from "./prospect-client/List/List/ListLF";
 export { Loader } from "./prospect-client/Loader/LoaderLF";
+export { MenuBurger, } from "./prospect-client/MenuBurger/MenuBurgerLF";
 export { Message, messageVariants, } from "./prospect-client/Message/MessageLF";
-export { MultiMessage, } from "./prospect-client/MultiMessage/MultiMessageLF";
 export { Modal, ModalCore, ModalCoreBody, ModalCoreFooter, ModalCoreHeader, } from "./prospect-client/Modal/ModalLF";
+export { MultiMessage, } from "./prospect-client/MultiMessage/MultiMessageLF";
 export { ErrorPage, } from "./prospect-client/pages/ErrorPage/ErrorPageLF";
 export { ValidPage, } from "./prospect-client/pages/ValidPage/ValidPageLF";
 export { ItemPagination, } from "./prospect-client/Pagination/ItemPagination/ItemPaginationLF";
 export { Pagination } from "./prospect-client/Pagination/PaginationLF";
 export { ProgressBar } from "./prospect-client/ProgressBar/ProgressBarLF";
 export { ProgressBarGroup } from "./prospect-client/ProgressBarGroup/ProgressBarGroupLF";
-export { Skeleton, } from "./prospect-client/Skeleton/SkeletonLF";
+export { Skeleton, skeletonSizeVariants, skeletonVariants, } from "./prospect-client/Skeleton/Skeleton";
+export { SkeletonGrid, } from "./prospect-client/SkeletonGrid/SkeletonGrid";
 export { SkeletonList, } from "./prospect-client/SkeletonList/SkeletonListLF";
 export { Spinner, spinnerVariants, } from "./prospect-client/Spinner/SpinnerLF";
 export { Stepper } from "./prospect-client/Stepper/StepperLF";
@@ -74,7 +72,9 @@ export { Svg } from "./prospect-client/Svg/Svg";
 export { TabBar, tabBarDirection, } from "./prospect-client/TabBar/TabBarLF";
 export { Table, } from "./prospect-client/Table/TableLF";
 export { TableMobileCard, } from "./prospect-client/TableMobileCard/TableMobileCard";
+export { TabMenu } from "./prospect-client/TabMenu/TabMenu";
 export { Tag, tagVariants, } from "./prospect-client/Tag/TagLF";
 export { TagList, } from "./prospect-client/TagList/TagListLF";
 export { TimelineVertical } from "./prospect-client/TimelineVertical/TimelineVerticalLF";
 export { Toggle } from "./prospect-client/Toggle/ToggleLF";
+export { MessageBar, } from "./prospect-client/MessageBar/MessageBarLF";

package/dist/distributeur/Accordion/Accordion.d.ts

@@ -5,10 +5,8 @@ import type { AccordionVariant, TDefaultProps } from "./types";
 export type EnhancedProps = Partial<TDefaultProps> & {
     onlyOne?: boolean;
     className?: string;
-    /** @deprecated Use `variant` instead. */
-    classModifier?: string;
     variant?: AccordionVariant;
     children: React.ReactElement<CollapseProps>[] | React.ReactElement<CollapseProps>;
 };
-declare const Accordion: ({ className, classModifier, variant, children, onlyOne, }: EnhancedProps) => import("react/jsx-runtime").JSX.Element;
+declare const Accordion: ({ className, variant, children, onlyOne, }: EnhancedProps) => import("react/jsx-runtime").JSX.Element;
 export { Accordion };

package/dist/distributeur/Accordion/Accordion.js

@@ -5,13 +5,10 @@ import React, { useId } from "react";
 import { getClassName } from "../utilities/helpers/getClassName";
 import { CollapseCard } from "./CollapseCard";
 const defaultClassName = "af-accordion";
-const Accordion = ({ className, classModifier, variant = "default", children, onlyOne = false, }) => {
+const Accordion = ({ className, variant = "default", children, onlyOne = false, }) => {
     const componentClassName = getClassName({
         baseClassName: defaultClassName,
-        modifiers: [
-            variant !== "default" && variant,
-            ...(classModifier?.split(" ") ?? []),
-        ],
+        modifiers: [variant !== "default" && variant],
         className,
     });
     const id = useId();

package/dist/distributeur/Accordion/CollapseCard.d.ts

@@ -8,9 +8,7 @@ export type CollapseProps = {
     name?: string;
     onToggle?: DetailsHTMLAttributes<HTMLDetailsElement>["onToggle"];
     className?: string;
-    /** @deprecated Use `className` instead. */
-    classModifier?: string;
     actions?: AccordionActions;
     variant?: AccordionVariant;
 };
-export declare const CollapseCard: ({ children, name, title, id, open, onToggle, className, classModifier, actions, variant, }: CollapseProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CollapseCard: ({ children, name, title, id, open, onToggle, className, actions, variant, }: CollapseProps) => import("react/jsx-runtime").JSX.Element;

package/dist/distributeur/Accordion/CollapseCard.js

@@ -2,13 +2,11 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getClassName } from "../utilities/helpers/getClassName";
 import { Body } from "./Body";
 import { Header } from "./Header";
-export const CollapseCard = ({ children, name, title, id, open, onToggle, className, classModifier = "", actions, variant, }) => {
+export const CollapseCard = ({ children, name, title, id, open, onToggle, className, actions, variant, }) => {
     const headerId = id;
-    let newClassModifier = open ? "open" : "";
-    newClassModifier += ` ${classModifier}`;
     const componentClassName = getClassName({
         baseClassName: "af-accordion__details",
-        modifiers: newClassModifier.trim().split(" "),
+        modifiers: open ? ["open"] : [],
         className,
     });
     return (_jsxs("details", { open: open, name: name, className: componentClassName, onToggle: onToggle, children: [_jsx(Header, { id: headerId, actions: actions, variant: variant, children: title }), _jsx(Body, { children: children })] }));

package/dist/distributeur/Accordion/Header.d.ts

@@ -8,11 +8,9 @@ export type HeaderToggleElement = {
 export type HeaderProps = {
     children: React.ReactNode;
     className?: string;
-    /** @deprecated Use `className` instead. */
-    classModifier?: string;
     id?: string;
     actions?: AccordionActions;
     variant?: AccordionVariant;
 };
-declare const Header: ({ children, className, classModifier, id, actions, variant, }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
+declare const Header: ({ children, className, id, actions, variant }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
 export { Header };

package/dist/distributeur/Accordion/Header.js

@@ -6,10 +6,9 @@ import { Svg } from "../Svg/Svg";
 import { Title } from "../Title/Title";
 import { getClassName } from "../utilities/helpers/getClassName";
 const defaultClassName = "af-accordion__item-header";
-const Header = ({ children, className, classModifier, id, actions, variant, }) => {
+const Header = ({ children, className, id, actions, variant }) => {
     const componentClassName = getClassName({
         baseClassName: defaultClassName,
-        modifiers: classModifier?.split(" "),
         className,
     });
     return (_jsx("summary", { className: componentClassName, id: id, children: variant === "light" ? (_jsxs(Title, { heading: "h3", children: [_jsx(Svg, { src: arrow, className: "af-accordion__item-header-icon" }), children, actions

package/dist/distributeur/Action/Action.d.ts

@@ -2,11 +2,9 @@ import "@axa-fr/canopee-css/distributeur/Action/Action.css";
 import { type ComponentPropsWithRef } from "react";
 type ActionCoreProps = ComponentPropsWithRef<"a"> & {
     icon: string;
-    /** @deprecated Use `className` instead. */
-    classModifier?: string;
 };
 export declare const Action: {
-    ({ icon, className, classModifier, ...otherProps }: ActionCoreProps): import("react/jsx-runtime").JSX.Element;
+    ({ icon, className, ...otherProps }: ActionCoreProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export {};

package/dist/distributeur/Action/Action.js

@@ -3,12 +3,11 @@ import "@axa-fr/canopee-css/distributeur/Action/Action.css";
 import classNames from "classnames";
 import {} from "react";
 import { getClassName } from "../utilities/helpers/getClassName";
-export const Action = ({ icon, className, classModifier, ...otherProps }) => {
+export const Action = ({ icon, className, ...otherProps }) => {
     const componentClassName = classNames("btn", getClassName({
         baseClassName: "af-btn--circle",
-        modifiers: classModifier?.split(" "),
         className,
     }));
-    return (_jsx("a", { ...otherProps, className: componentClassName, children: _jsx("i", { role: "img", className: `glyphicon glyphicon-${icon}` }) }));
+    return (_jsx("a", { ...otherProps, className: componentClassName, children: _jsx("i", { role: "presentation", className: `glyphicon glyphicon-${icon}` }) }));
 };
 Action.displayName = "Action";

package/dist/distributeur/Button/Button.d.ts

@@ -1,11 +1,10 @@
-import { type ComponentPropsWithRef, type PropsWithChildren, type ReactNode } from "react";
+import { type ComponentPropsWithRef, type PropsWithChildren } from "react";
 import "@axa-fr/canopee-css/distributeur/Button/Button.css";
+import { type ClickableComponentProps } from "../ClickableGhost";
 export type ButtonVariant = "primary" | "secondary" | "validated" | "danger" | "ghost" | "ghost-reverse";
-type ButtonProps = PropsWithChildren<{
+type ButtonProps = ClickableComponentProps & PropsWithChildren<{
     variant?: ButtonVariant;
     small?: boolean;
-    leftIcon?: ReactNode;
-    rightIcon?: ReactNode;
 } & ComponentPropsWithRef<"button">>;
 export declare const Button: {
     ({ variant, small, leftIcon, rightIcon, className, children, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/distributeur/Button/Button.js

@@ -2,6 +2,12 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
 import classNames from "classnames";
 import {} from "react";
 import "@axa-fr/canopee-css/distributeur/Button/Button.css";
+import { ClickableGhost, } from "../ClickableGhost";
 const DEFAULT_CLASS_NAME = "af-btn";
-export const Button = ({ variant = "primary", small, leftIcon, rightIcon, className, children, ...props }) => (_jsxs("button", { type: "button", className: classNames(DEFAULT_CLASS_NAME, variant !== "primary" && `${DEFAULT_CLASS_NAME}--${variant}`, small && `${DEFAULT_CLASS_NAME}--small`, className), ...props, children: [leftIcon, children, rightIcon] }));
+export const Button = ({ variant = "primary", small, leftIcon, rightIcon, className, children, ...props }) => {
+    if (variant === "ghost" || variant === "ghost-reverse") {
+        return (_jsxs(ClickableGhost, { component: "button", type: "button", variant: variant === "ghost-reverse" ? "reverse" : "ghost", ...props, children: [leftIcon, children, rightIcon] }));
+    }
+    return (_jsxs("button", { type: "button", className: classNames(DEFAULT_CLASS_NAME, variant !== "primary" && `${DEFAULT_CLASS_NAME}--${variant}`, small && `${DEFAULT_CLASS_NAME}--small`, className), ...props, children: [leftIcon, children, rightIcon] }));
+};
 Button.displayName = "Button";

package/dist/distributeur/ButtonMultiActions/ButtonMultiActions.d.ts

@@ -0,0 +1,10 @@
+import "@axa-fr/canopee-css/distributeur/MultiActionsButton/MultiActionsButton.css";
+import { type ComponentPropsWithoutRef, type ReactNode } from "react";
+export type ButtonMultiActionsProps = {
+    label?: string;
+    menuLabel?: string;
+    align?: "auto" | "left" | "right";
+} & Omit<ComponentPropsWithoutRef<"button">, "children"> & {
+    children: ReactNode;
+};
+export declare const ButtonMultiActions: ({ label, menuLabel, align, className, id, onClick, onKeyDown, onMouseDown, children, ...buttonProps }: ButtonMultiActionsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/distributeur/ButtonMultiActions/ButtonMultiActions.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import "@axa-fr/canopee-css/distributeur/MultiActionsButton/MultiActionsButton.css";
+import chevronDown from "@material-symbols/svg-400/outlined/keyboard_arrow_down.svg";
+import { useId, useRef, } from "react";
+import { Button } from "../Button/Button";
+import { Svg } from "../Svg";
+import { getClassName } from "../utilities/helpers/getClassName";
+export const ButtonMultiActions = ({ label = "Actions", menuLabel = "Actions supplémentaires", align = "auto", className, id, onClick, onKeyDown, onMouseDown, children, ...buttonProps }) => {
+    const generatedId = useId();
+    const menuId = `${id ?? `af-button-multi-actions-${generatedId}`}-menu`;
+    const containerRef = useRef(null);
+    const menuRef = useRef(null);
+    const triggerRef = useRef(null);
+    const handleMenuToggle = (event) => {
+        const isOpen = event.newState === "open";
+        triggerRef.current?.setAttribute("aria-expanded", String(isOpen));
+        if (!isOpen) {
+            triggerRef.current?.focus();
+        }
+    };
+    // Open the menu and focus its first item when navigating with ArrowDown
+    const handleTriggerKeyDown = (event) => {
+        onKeyDown?.(event);
+        if (event.defaultPrevented || menuRef.current?.matches(":popover-open"))
+            return;
+        if (event.key === "ArrowDown") {
+            event.preventDefault();
+            menuRef.current?.showPopover();
+        }
+    };
+    // Close the menu once an action inside it has been activated
+    const handleMenuClick = (event) => {
+        if (event.target !== event.currentTarget) {
+            menuRef.current?.hidePopover();
+        }
+    };
+    // Close the menu when the user presses Escape, returning focus to the trigger
+    const handleMenuKeyDown = (event) => {
+        if (event.key === "Escape" || event.key === "Esc") {
+            event.preventDefault();
+            menuRef.current?.hidePopover();
+        }
+    };
+    return (_jsxs("div", { className: "af-button-multi-actions", ref: containerRef, children: [_jsx(Button, { ref: triggerRef, variant: "ghost", className: getClassName({
+                    baseClassName: "af-button-multi-actions__trigger",
+                    modifiers: [align],
+                    className,
+                }), "aria-haspopup": "menu", "aria-controls": menuId, "aria-expanded": "false", onClick: onClick, onKeyDown: handleTriggerKeyDown, onMouseDown: onMouseDown, ...buttonProps, popoverTarget: menuId, rightIcon: _jsx(Svg, { src: chevronDown, alt: "", "aria-hidden": "true", className: getClassName({
+                        baseClassName: "af-button-multi-actions__icon",
+                    }) }), children: label }), _jsx("div", { popover: "auto", id: menuId, role: "menu", "aria-label": menuLabel, tabIndex: -1, className: "af-button-multi-actions__menu", ref: menuRef, onToggle: handleMenuToggle, onKeyDown: handleMenuKeyDown, onClick: handleMenuClick, children: children })] }));
+};

package/dist/distributeur/ButtonMultiActions/index.d.ts

@@ -0,0 +1,2 @@
+export { ButtonMultiActions } from "./ButtonMultiActions";
+export type { ButtonMultiActionsProps } from "./ButtonMultiActions";

package/dist/distributeur/ButtonMultiActions/index.js

@@ -0,0 +1 @@
+export { ButtonMultiActions } from "./ButtonMultiActions";

package/dist/distributeur/Card/BaseCard.d.ts

@@ -0,0 +1,14 @@
+import type { ButtonHTMLAttributes, LabelHTMLAttributes } from "react";
+import "@axa-fr/canopee-css/distributeur/Card/BaseCard.css";
+type BaseCardOwnProps = {
+    orientation?: "horizontal" | "vertical";
+};
+type BaseCardButtonProps = BaseCardOwnProps & ButtonHTMLAttributes<HTMLButtonElement> & {
+    component?: "button";
+};
+type BaseCardLabelProps = BaseCardOwnProps & LabelHTMLAttributes<HTMLLabelElement> & {
+    component: "label";
+};
+export type BaseCardProps = BaseCardButtonProps | BaseCardLabelProps;
+export declare const BaseCard: (props: BaseCardProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/distributeur/Card/BaseCard.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { getClassName } from "../utilities/helpers/getClassName";
+import "@axa-fr/canopee-css/distributeur/Card/BaseCard.css";
+const isLabelCard = (props) => props.component === "label";
+function stripCardInternalProps(props) {
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    const { component, className, children, orientation, ...rest } = props;
+    return rest;
+}
+export const BaseCard = (props) => {
+    const { className, children, orientation } = props;
+    const finalClassName = getClassName({
+        baseClassName: "af-basecard",
+        modifiers: [orientation],
+        className,
+    });
+    if (isLabelCard(props)) {
+        const labelProps = stripCardInternalProps(props);
+        return (_jsx("label", { className: finalClassName, ...labelProps, children: children }));
+    }
+    const { type, ...buttonProps } = stripCardInternalProps(props);
+    return (_jsx("button", { type: type === "submit" ? "submit" : "button", className: finalClassName, ...buttonProps, children: children }));
+};

package/dist/distributeur/CardButton/CardButton.d.ts

@@ -0,0 +1,18 @@
+import type { ReactNode } from "react";
+import { type BaseCardProps } from "../Card/BaseCard";
+import "@axa-fr/canopee-css/distributeur/CardButton/CardButton.css";
+type CardButtonOwnProps = {
+    className?: string;
+    children?: ReactNode;
+    icon?: ReactNode;
+    orientation?: "horizontal" | "vertical";
+};
+type CardButtonAsButtonProps = CardButtonOwnProps & Omit<Extract<BaseCardProps, {
+    component?: "button";
+}>, "className" | "children">;
+type CardButtonAsLabelProps = CardButtonOwnProps & Omit<Extract<BaseCardProps, {
+    component: "label";
+}>, "className" | "children">;
+export type CardButtonProps = CardButtonAsButtonProps | CardButtonAsLabelProps;
+export declare const CardButton: ({ className, children, icon, orientation, ...props }: CardButtonProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/distributeur/CardButton/CardButton.js

@@ -0,0 +1,12 @@
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { BaseCard } from "../Card/BaseCard";
+import "@axa-fr/canopee-css/distributeur/CardButton/CardButton.css";
+import { getClassName } from "../utilities/helpers/getClassName";
+export const CardButton = ({ className, children = "Card Button", icon = null, orientation = "horizontal", ...props }) => {
+    const finalClassName = getClassName({
+        baseClassName: "af-card-button",
+        className,
+        modifiers: [orientation],
+    });
+    return (_jsxs(BaseCard, { className: finalClassName, ...props, children: [icon, children] }));
+};

package/dist/distributeur/ClickableGhost.d.ts

@@ -0,0 +1,36 @@
+import { type AnchorHTMLAttributes, type ButtonHTMLAttributes, type ReactElement, type ReactNode } from "react";
+import { Svg } from "./Svg";
+import "@axa-fr/canopee-css/distributeur/Link/Link.css";
+export type ClickableComponentProps = {
+    /**
+     * The content to be displayed inside the clickable component.
+     */
+    children: ReactNode;
+    /**
+     * The icon to be displayed on the left side of the clickable component.
+     */
+    leftIcon?: ReactElement<typeof Svg>;
+    /**
+     * The icon to be displayed on the right side of the clickable component.
+     */
+    rightIcon?: ReactElement<typeof Svg>;
+};
+type Props = ClickableComponentProps & {
+    className?: string;
+    variant?: "ghost" | "reverse";
+} & (({
+    component: "a";
+} & AnchorHTMLAttributes<HTMLAnchorElement>) | ({
+    component: "button";
+} & ButtonHTMLAttributes<HTMLButtonElement>));
+/**
+ * Internal component to render the "ghost" style of interactive elements.
+ * This component supports both anchor and button elements, and allows for optional left and right icons.
+ *
+ * This is used to share the look of the link and the ghost button.
+ *
+ * @param props The props for the ClickableGhost component.
+ * @returns
+ */
+export declare const ClickableGhost: ({ children, className, leftIcon, rightIcon, variant, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/distributeur/ClickableGhost.js

@@ -0,0 +1,26 @@
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import {} from "react";
+import { getClassName } from "../prospect-client/utilities/getClassName";
+import { Svg } from "./Svg";
+import "@axa-fr/canopee-css/distributeur/Link/Link.css";
+import { linkClassName } from "./Link/linkClassName";
+/**
+ * Internal component to render the "ghost" style of interactive elements.
+ * This component supports both anchor and button elements, and allows for optional left and right icons.
+ *
+ * This is used to share the look of the link and the ghost button.
+ *
+ * @param props The props for the ClickableGhost component.
+ * @returns
+ */
+export const ClickableGhost = ({ children, className, leftIcon, rightIcon, variant = "ghost", ...props }) => {
+    const componentClassName = getClassName({
+        baseClassName: linkClassName,
+        modifiers: [variant === "reverse" ? "reverse" : ""],
+        className,
+    });
+    if (props.component === "a") {
+        return (_jsxs("a", { className: componentClassName, ...props, children: [leftIcon, children, rightIcon] }));
+    }
+    return (_jsxs("button", { className: componentClassName, type: "button", ...props, children: [leftIcon, children, rightIcon] }));
+};

package/dist/distributeur/Form/Checkbox/Checkbox.d.ts

@@ -23,7 +23,7 @@ type Props = Omit<ComponentPropsWithRef<typeof CheckboxItem>, "value" | "label"
     mode?: keyof typeof CheckboxModes;
 } & OnChange;
 export declare const Checkbox: {
-    ({ id, name, options, disabled, children, values, mode, onChange, ...otherProps }: Props): import("react/jsx-runtime").JSX.Element;
+    ({ id, name, options, disabled, children, values, mode, onChange, className, ...otherProps }: Props): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export {};

package/dist/distributeur/Form/Checkbox/Checkbox.js

@@ -3,6 +3,7 @@ import { createElement as _createElement } from "react";
 import React, {} from "react";
 import { CheckboxItem } from "./CheckboxItem";
 import { CheckboxModes } from "./CheckboxModes";
+import { getClassName } from "../../utilities";
 const defaultClassName = (mode) => {
     switch (mode) {
         case CheckboxModes.default:
@@ -13,17 +14,21 @@ const defaultClassName = (mode) => {
             return `af-form__checkbox-${mode}`;
     }
 };
-const CheckboxInner = ({ id, name, options, disabled, children, values = [], mode = CheckboxModes.default, onChange = () => { }, ...otherProps }) => {
-    const className = defaultClassName(mode);
+const CheckboxInner = ({ id, name, options, disabled, children, values = [], mode = CheckboxModes.default, onChange = () => { }, className, ...otherProps }) => {
+    const itemClassName = defaultClassName(mode);
+    const componentClassName = getClassName({
+        baseClassName: "af-form__checkbox-container",
+        className,
+    });
     const handleOnChange = ({ target: { value, checked }, }) => {
         const newValues = checked
             ? [...values, value]
             : values.filter((v) => v !== value);
         onChange({ values: newValues, target: { value, checked }, id, name });
     };
-    return (_jsx("div", { className: "af-form__checkbox-container", children: options.map((option) => {
+    return (_jsx("div", { className: componentClassName, children: options.map((option) => {
             const isChecked = values ? values.indexOf(option.value) >= 0 : false;
-            return (_createElement(CheckboxItem, { ...otherProps, onChange: handleOnChange, key: option.value, className: className, isChecked: isChecked, name: name, disabled: option.disabled || disabled, ...option }, children));
+            return (_createElement(CheckboxItem, { ...otherProps, onChange: handleOnChange, key: option.value, className: itemClassName, isChecked: isChecked, name: name, disabled: option.disabled || disabled, ...option }, children));
         }) }));
 };
 CheckboxInner.displayName = "Checkbox";

package/dist/distributeur/Form/Checkbox/CheckboxInput.js

@@ -5,8 +5,8 @@ import { Checkbox } from "./Checkbox";
 import { CheckboxModes } from "./CheckboxModes";
 const CheckboxInput = ({ label, mode = "default", options, children, ...otherProps }) => {
     const newOptions = useOptionsWithId(options);
-    return (_jsx(Field, { label: label, labelPosition: mode === CheckboxModes.classic ? "top" : "center", roleContainer: "group", ...otherProps, renderInput: ({ classModifier, id, ariaInvalid, errorId, ...props }) => {
-            return (_jsxs(_Fragment, { children: [_jsx(Checkbox, { id: id, mode: mode, options: newOptions, classModifier: ariaInvalid ? `${classModifier} error` : classModifier, "aria-describedby": errorId, "aria-invalid": ariaInvalid, ...props }), children] }));
+    return (_jsx(Field, { label: label, labelPosition: mode === CheckboxModes.classic ? "top" : "center", roleContainer: "group", ...otherProps, renderInput: ({ inputClassName, id, ariaInvalid, errorId, ...props }) => {
+            return (_jsxs(_Fragment, { children: [_jsx(Checkbox, { id: id, mode: mode, options: newOptions, className: inputClassName, "aria-describedby": errorId, "aria-invalid": ariaInvalid, ...props }), children] }));
         } }));
 };
 CheckboxInput.displayName = "CheckboxInput";