@axa-fr/canopee-react 1.8.0 → 2.0.0-RC.1

package/dist/prospect-client/TabMenu/TabMenu.helpers.d.ts

@@ -0,0 +1 @@
+export declare const getPosition: (max: number, position: number, direction: string) => number;

package/dist/prospect-client/TabMenu/TabMenu.helpers.js

@@ -0,0 +1,12 @@
+export const getPosition = (max, position, direction) => {
+    switch (direction) {
+        case "ArrowRight":
+        case "ArrowDown":
+            return position + 1 < max ? position + 1 : 0;
+        case "ArrowLeft":
+        case "ArrowUp":
+            return position - 1 < 0 ? max - 1 : position - 1;
+        default:
+            return position;
+    }
+};

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

@@ -0,0 +1,39 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useRef, useState, } from "react";
+import { ItemMenu } from "../ItemMenu/ItemMenuCommon";
+import { getClassName } from "../utilities/getClassName";
+import { getPosition } from "./TabMenu.helpers";
+import "@axa-fr/canopee-css/prospect/TabMenu/TabMenuAll.css";
+/**
+ * Renders a keyboard-navigable tab-style menu.
+ *
+ * @component
+ * @param {TabMenuProps} props - TabMenu props.
+ * @param {TabMenuItemProps[]} [props.items] - Items to render.
+ * @param {number} [props.initialPosition=0] - Initially selected item index.
+ * @returns {JSX.Element | null} The rendered TabMenu, or null when no items are provided.
+ */
+export const TabMenu = ({ items, className, initialPosition = 0, ...props }) => {
+    const [position, setPosition] = useState(initialPosition);
+    const itemRefs = useRef([]);
+    const handleKeys = useCallback((key) => {
+        if (key === "ArrowRight" || key === "ArrowLeft") {
+            const newPosition = getPosition(items?.length ?? 0, position, key);
+            itemRefs.current[newPosition]?.focus();
+            setPosition(newPosition);
+        }
+    }, [position, items?.length]);
+    if (!items || items.length === 0) {
+        return null;
+    }
+    return (
+    // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
+    _jsx("nav", { className: getClassName({
+            baseClassName: "af-tab-menu",
+            className,
+        }), ...props, 
+        // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
+        tabIndex: 0, onKeyDown: (e) => handleKeys(e.key), children: _jsx("ul", { className: "af-tab-menu__list", children: items.map((item, index) => (_jsx("li", { children: _jsx(ItemMenu, { ref: (el) => {
+                        itemRefs.current[index] = el;
+                    }, ...item, isActive: index === position ? true : item.isActive, tabIndex: index === position ? 0 : -1, children: item.label }) }, item.href))) }) }));
+};

package/dist/prospect-client/Tag/TagCommon.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
-import { getComponentClassName } from "../utilities/getComponentClassName";
+import { getClassName } from "../utilities/getClassName";
 export const tagVariants = {
     info: "info",
     success: "success",
@@ -9,6 +9,10 @@ export const tagVariants = {
     neutral: "neutral",
 };
 export const Tag = ({ children, className, variant = "info", ...divProps }) => {
-    const componentClassName = useMemo(() => getComponentClassName("af-tag", className, variant), [className, variant]);
+    const componentClassName = useMemo(() => getClassName({
+        baseClassName: "af-tag",
+        className,
+        modifiers: [variant],
+    }), [className, variant]);
     return (_jsx("div", { className: componentClassName, ...divProps, children: _jsx("span", { className: "af-tag__label", children: children }) }));
 };

package/dist/prospect-client/TagList/TagListApollo.d.ts

@@ -0,0 +1,4 @@
+import { type TagListProps as TagListCommonProps } from "./TagListCommon";
+import "@axa-fr/canopee-css/prospect/TagList/TagListAll.css";
+export type TagListProps = Omit<TagListCommonProps, "OverflowTag">;
+export declare const TagList: (props: TagListProps) => import("react/jsx-runtime").JSX.Element;

package/dist/prospect-client/TagList/TagListApollo.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Tag } from "../Tag/TagCommon";
+import { TagListCommon, } from "./TagListCommon";
+import "@axa-fr/canopee-css/prospect/TagList/TagListAll.css";
+export const TagList = (props) => (_jsx(TagListCommon, { ...props, OverflowTag: Tag }));

package/dist/prospect-client/TagList/TagListCommon.d.ts

@@ -0,0 +1,10 @@
+import { type ComponentType, type ReactNode } from "react";
+export type TagListProps = {
+    children: ReactNode;
+    hideThreshold?: number;
+    className?: string;
+    OverflowTag: ComponentType<{
+        children: ReactNode;
+    }>;
+};
+export declare const TagListCommon: ({ children, hideThreshold, className, OverflowTag, }: TagListProps) => import("react/jsx-runtime").JSX.Element;

package/dist/prospect-client/TagList/TagListCommon.js

@@ -0,0 +1,16 @@
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Children, isValidElement, } from "react";
+import { getClassName } from "../utilities/getClassName";
+export const TagListCommon = ({ children, hideThreshold = 2, className = "", OverflowTag, }) => {
+    const childArray = Children.toArray(children).filter(isValidElement);
+    const total = childArray.length;
+    const isOverflowing = total > hideThreshold;
+    const visibleChildren = isOverflowing
+        ? childArray.slice(0, hideThreshold)
+        : childArray;
+    const hiddenCount = total - hideThreshold;
+    return (_jsxs("div", { className: getClassName({
+            baseClassName: "af-tag-list",
+            className,
+        }), children: [visibleChildren, isOverflowing ? _jsxs(OverflowTag, { children: ["+", hiddenCount] }) : null] }));
+};

package/dist/prospect-client/TagList/TagListLF.d.ts

@@ -0,0 +1,4 @@
+import { type TagListProps as TagListCommonProps } from "./TagListCommon";
+import "@axa-fr/canopee-css/client/TagList/TagListAll.css";
+export type TagListProps = Omit<TagListCommonProps, "OverflowTag">;
+export declare const TagList: (props: TagListProps) => import("react/jsx-runtime").JSX.Element;

package/dist/prospect-client/TagList/TagListLF.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Tag } from "../Tag/TagCommon";
+import { TagListCommon, } from "./TagListCommon";
+import "@axa-fr/canopee-css/client/TagList/TagListAll.css";
+export const TagList = (props) => (_jsx(TagListCommon, { ...props, OverflowTag: Tag }));

package/dist/prospect-client/Toggle/ToggleApollo.d.ts

@@ -1,3 +1,6 @@
 import "@axa-fr/canopee-css/prospect/Toggle/ToggleApollo.css";
 import { type ToggleProps } from "./ToggleCommon";
-export declare const Toggle: import("react").ForwardRefExoticComponent<ToggleProps & import("react").RefAttributes<HTMLInputElement>>;
+export declare const Toggle: {
+    ({ ...props }: ToggleProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/prospect-client/Toggle/ToggleApollo.js

@@ -1,7 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import "@axa-fr/canopee-css/prospect/Toggle/ToggleApollo.css";
-import { forwardRef } from "react";
 import { Icon } from "../Icon/IconApollo";
 import { ToggleCommon } from "./ToggleCommon";
-export const Toggle = forwardRef((props, ref) => _jsx(ToggleCommon, { IconComponent: Icon, ...props, ref: ref }));
+export const Toggle = ({ ...props }) => (_jsx(ToggleCommon, { IconComponent: Icon, ...props }));
 Toggle.displayName = "Toggle";

package/dist/prospect-client/Toggle/ToggleCommon.d.ts

@@ -4,6 +4,7 @@ export type ToggleProps = Omit<InputHTMLAttributes<HTMLInputElement>, "style" |
 export type ToggleCommonProps = ToggleProps & {
     IconComponent: ComponentType<IconProps>;
 };
-export declare const ToggleCommon: import("react").ForwardRefExoticComponent<ToggleProps & {
-    IconComponent: ComponentType<IconProps>;
-} & import("react").RefAttributes<HTMLInputElement>>;
+export declare const ToggleCommon: {
+    ({ className, IconComponent, ...inputProps }: ToggleCommonProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/prospect-client/Toggle/ToggleCommon.js

@@ -1,11 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import check from "@material-symbols/svg-400/rounded/check.svg";
 import close from "@material-symbols/svg-400/rounded/close.svg";
-import { forwardRef, useId, } from "react";
-import { getComponentClassName } from "../utilities/getComponentClassName";
-export const ToggleCommon = forwardRef(({ className, IconComponent, ...inputProps }, ref) => {
+import { useId } from "react";
+import { getClassName } from "../utilities/getClassName";
+export const ToggleCommon = ({ className, IconComponent, ...inputProps }) => {
     let inputId = useId();
     inputId = inputProps.id ?? inputId;
-    return (_jsxs("label", { className: getComponentClassName("af-toggle", className), htmlFor: inputId, children: [_jsx("div", { className: "af-toggle__root", children: _jsxs("span", { className: "af-toggle__handle", children: [_jsx(IconComponent, { src: check, "aria-hidden": "true", className: "af-toggle__icon af-toggle__icon--check", size: "XS" }), _jsx(IconComponent, { src: close, "aria-hidden": "true", className: "af-toggle__icon af-toggle__icon--close", size: "XS" })] }) }), _jsx("input", { ...inputProps, ref: ref, type: "checkbox", id: inputId })] }));
-});
+    return (_jsxs("label", { className: getClassName({ baseClassName: "af-toggle", className }), htmlFor: inputId, children: [_jsx("div", { className: "af-toggle__root", children: _jsxs("span", { className: "af-toggle__handle", children: [_jsx(IconComponent, { src: check, "aria-hidden": "true", className: "af-toggle__icon af-toggle__icon--check", size: "XS" }), _jsx(IconComponent, { src: close, "aria-hidden": "true", className: "af-toggle__icon af-toggle__icon--close", size: "XS" })] }) }), _jsx("input", { ...inputProps, type: "checkbox", id: inputId })] }));
+};
 ToggleCommon.displayName = "ToggleCommon";

package/dist/prospect-client/Toggle/ToggleLF.d.ts

@@ -1,3 +1,6 @@
 import "@axa-fr/canopee-css/client/Toggle/ToggleLF.css";
 import { type ToggleProps } from "./ToggleCommon";
-export declare const Toggle: import("react").ForwardRefExoticComponent<ToggleProps & import("react").RefAttributes<HTMLInputElement>>;
+export declare const Toggle: {
+    ({ ...props }: ToggleProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/prospect-client/Toggle/ToggleLF.js

@@ -1,7 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import "@axa-fr/canopee-css/client/Toggle/ToggleLF.css";
-import { forwardRef } from "react";
 import { Icon } from "../Icon/IconLF";
 import { ToggleCommon } from "./ToggleCommon";
-export const Toggle = forwardRef((props, ref) => _jsx(ToggleCommon, { IconComponent: Icon, ...props, ref: ref }));
+export const Toggle = ({ ...props }) => (_jsx(ToggleCommon, { IconComponent: Icon, ...props }));
 Toggle.displayName = "Toggle";

package/dist/prospect.d.ts

@@ -5,9 +5,10 @@ import "@fontsource/source-sans-pro";
 export { Accordion, accordionVariants, type AccordionVariants, } from "./prospect-client/Accordion/AccordionApollo";
 export { AccordionContextual, accordionContextualVariants, type AccordionContextualVariants, } from "./prospect-client/AccordionContextual/AccordionContextualApollo";
 export { AccordionCore } from "./prospect-client/AccordionCore/AccordionCoreApollo";
+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/ButtonApollo";
-export { Card, type CardProps } from "./prospect-client/Card/CardApollo";
+export { Card, cardVariants, type CardProps, type CardVariants, } from "./prospect-client/Card/CardApollo";
 export { CardMessage, cardMessageVariants, type CardMessageVariants, } from "./prospect-client/CardMessage/CardMessageApollo";
 export { ClickIcon } from "./prospect-client/ClickIcon/ClickIconApollo";
 export { ContentItemDuoAction, type ContentItemDuoActionState, } from "./prospect-client/ContentItemDuoAction/ContentItemDuoActionApollo";
@@ -15,9 +16,7 @@ export { ContentItemMono } from "./prospect-client/ContentItemMono/ContentItemMo
 export { DataAgent, type DataAgentProps, } from "./prospect-client/DataAgent/DataAgentApollo";
 export { Divider } from "./prospect-client/Divider/DividerApollo";
 export { Fieldset, type FieldsetProps, } from "./prospect-client/Fieldset/FieldsetApollo";
-export { CardCheckbox, 
-/** @deprecated Use `CardCheckbox` instead. */
-CardCheckbox as CheckboxCard, } from "./prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxApollo";
+export { CardCheckbox, type CardCheckboxProps, } from "./prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxApollo";
 export { CardCheckboxOption } from "./prospect-client/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo";
 export { Checkbox } from "./prospect-client/Form/Checkbox/Checkbox/CheckboxApollo";
 export { CheckboxText } from "./prospect-client/Form/Checkbox/CheckboxText/CheckboxTextApollo";
@@ -31,19 +30,23 @@ export { InputPhone } from "./prospect-client/Form/InputPhone/InputPhoneApollo";
 export { InputText } from "./prospect-client/Form/InputText/InputTextApollo";
 export { InputTextAtom } from "./prospect-client/Form/InputTextAtom/InputTextAtomApollo";
 export { ItemLabel } from "./prospect-client/Form/ItemLabel/ItemLabelApollo";
-export { ItemMessage, itemMessageVariants, type ItemMessageVariants, } from "./prospect-client/Form/ItemMessage/ItemMessageApollo";
-export { 
-/** @deprecated Use `CardRadioGroup` instead. */
-CardRadioGroup as CardRadio, CardRadioGroup, } from "./prospect-client/Form/Radio/CardRadioGroup/CardRadioGroupApollo";
-export { CardRadioOption } from "./prospect-client/Form/Radio/CardRadioOption/CardRadioOptionApollo";
+export { ItemMessage, itemMessageVariants, type ItemMessageVariants, } from "./prospect-client/Form/ItemMessage/ItemMessage";
+export { ItemMultiSelect, type ItemMultiSelectProps, } from "./prospect-client/Form/ItemMultiSelect/ItemMultiSelectApollo";
+export { MultiSelectList, type MultiSelectListProps, } from "./prospect-client/Form/MultiSelectList/MultiSelectListApollo";
+export { CardRadio } from "./prospect-client/Form/Radio/CardRadio/CardRadioApollo";
+export { CardRadioGroup } from "./prospect-client/Form/Radio/CardRadioGroup/CardRadioGroupApollo";
 export { Radio } from "./prospect-client/Form/Radio/Radio/RadioApollo";
 export { RadioText, type RadioTextProps, } from "./prospect-client/Form/Radio/RadioText/RadioTextApollo";
 export { TextArea } from "./prospect-client/Form/TextArea/TextAreaApollo";
 export { DebugGrid } from "./prospect-client/Grid/DebugGridApollo";
 export { Heading, type HeadingLevel, type HeadingProps, } from "./prospect-client/Heading/HeadingApollo";
+export { Header, type HeaderProps, } from "./prospect-client/Header/HeaderApollo";
 export { Icon, iconSizeVariants, iconVariants, type IconSizeVariants, type IconVariants, } from "./prospect-client/Icon/IconApollo";
 export { ItemTabBar, type ItemTabBarProps, } from "./prospect-client/ItemTabBar/ItemTabBarApollo";
-export { ExitLayout, type ExitLayoutProps, type ExitLayoutWithSubComponents, } from "./prospect-client/Layout/ExitLayout/ExitLayoutApollo";
+export { ItemMenu, type ItemMenuProps, } from "./prospect-client/ItemMenu/ItemMenuApollo";
+export { MenuBurger, type MenuBurgerProps, } from "./prospect-client/MenuBurger/MenuBurgerApollo";
+export { TabMenu, type TabMenuProps } from "./prospect-client/TabMenu/TabMenu";
+export { ExitLayout, type ExitLayoutProps, type ExitLayoutWithSubComponents, ExitLayoutSkeleton, type ExitLayoutSkeletonProps, } from "./prospect-client/Layout/ExitLayout/ExitLayoutApollo";
 export { Footer, type FooterProps, } from "./prospect-client/Layout/Footer/FooterApollo";
 export { FormLayout, type FormLayoutProps, } from "./prospect-client/Layout/FormLayout/FormLayout";
 export { LevelSelector, type LevelSelectorProps, } from "./prospect-client/LevelSelector/LevelSelectorApollo";
@@ -61,7 +64,8 @@ export { ItemPagination, type ItemPaginationProps, } from "./prospect-client/Pag
 export { Pagination } from "./prospect-client/Pagination/PaginationApollo";
 export { ProgressBar } from "./prospect-client/ProgressBar/ProgressBarApollo";
 export { ProgressBarGroup } from "./prospect-client/ProgressBarGroup/ProgressBarGroupApollo";
-export { Skeleton, type SkeletonProps, } from "./prospect-client/Skeleton/SkeletonApollo";
+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/SkeletonListApollo";
 export { Spinner, spinnerVariants, type SpinnerVariants, } from "./prospect-client/Spinner/SpinnerApollo";
 export { Stepper } from "./prospect-client/Stepper/StepperApollo";
@@ -70,6 +74,8 @@ export { TabBar, tabBarDirection, type TabBarDirection, type TabBarProps, } from
 export { Table, type BodyColorVariants, type HeadColorVariants, type RowSizeVariants, type TableProps, } from "./prospect-client/Table/TableApollo";
 export { TableMobileCard } from "./prospect-client/TableMobileCard/TableMobileCard";
 export { Tag, tagVariants, type TagVariants, } from "./prospect-client/Tag/TagApollo";
+export { TagList, type TagListProps, } from "./prospect-client/TagList/TagListApollo";
 export { TimelineVertical } from "./prospect-client/TimelineVertical/TimelineVerticalApollo";
 export { Toggle } from "./prospect-client/Toggle/ToggleApollo";
 export type { GridContainerProps } from "./prospect-client/utilities/types/GridContainerProps";
+export { MessageBar, type MessageBarProps, type MessageBarVariant, } from "./prospect-client/MessageBar/MessageBarApollo";

package/dist/prospect.js

@@ -5,9 +5,10 @@ import "@fontsource/source-sans-pro";
 export { Accordion, accordionVariants, } from "./prospect-client/Accordion/AccordionApollo";
 export { AccordionContextual, accordionContextualVariants, } from "./prospect-client/AccordionContextual/AccordionContextualApollo";
 export { AccordionCore } from "./prospect-client/AccordionCore/AccordionCoreApollo";
+export { AppName } from "./prospect-client/AppName/AppName";
 export { BasePicture } from "./prospect-client/BasePicture/BasePicture";
 export { Button, buttonVariants, } from "./prospect-client/Button/ButtonApollo";
-export { Card } from "./prospect-client/Card/CardApollo";
+export { Card, cardVariants, } from "./prospect-client/Card/CardApollo";
 export { CardMessage, cardMessageVariants, } from "./prospect-client/CardMessage/CardMessageApollo";
 export { ClickIcon } from "./prospect-client/ClickIcon/ClickIconApollo";
 export { ContentItemDuoAction, } from "./prospect-client/ContentItemDuoAction/ContentItemDuoActionApollo";
@@ -15,9 +16,7 @@ export { ContentItemMono } from "./prospect-client/ContentItemMono/ContentItemMo
 export { DataAgent, } from "./prospect-client/DataAgent/DataAgentApollo";
 export { Divider } from "./prospect-client/Divider/DividerApollo";
 export { Fieldset, } from "./prospect-client/Fieldset/FieldsetApollo";
-export { CardCheckbox, 
-/** @deprecated Use `CardCheckbox` instead. */
-CardCheckbox as CheckboxCard, } from "./prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxApollo";
+export { CardCheckbox, } from "./prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxApollo";
 export { CardCheckboxOption } from "./prospect-client/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo";
 export { Checkbox } from "./prospect-client/Form/Checkbox/Checkbox/CheckboxApollo";
 export { CheckboxText } from "./prospect-client/Form/Checkbox/CheckboxText/CheckboxTextApollo";
@@ -31,19 +30,23 @@ export { InputPhone } from "./prospect-client/Form/InputPhone/InputPhoneApollo";
 export { InputText } from "./prospect-client/Form/InputText/InputTextApollo";
 export { InputTextAtom } from "./prospect-client/Form/InputTextAtom/InputTextAtomApollo";
 export { ItemLabel } from "./prospect-client/Form/ItemLabel/ItemLabelApollo";
-export { ItemMessage, itemMessageVariants, } from "./prospect-client/Form/ItemMessage/ItemMessageApollo";
-export { 
-/** @deprecated Use `CardRadioGroup` instead. */
-CardRadioGroup as CardRadio, CardRadioGroup, } from "./prospect-client/Form/Radio/CardRadioGroup/CardRadioGroupApollo";
-export { CardRadioOption } from "./prospect-client/Form/Radio/CardRadioOption/CardRadioOptionApollo";
+export { ItemMessage, itemMessageVariants, } from "./prospect-client/Form/ItemMessage/ItemMessage";
+export { ItemMultiSelect, } from "./prospect-client/Form/ItemMultiSelect/ItemMultiSelectApollo";
+export { MultiSelectList, } from "./prospect-client/Form/MultiSelectList/MultiSelectListApollo";
+export { CardRadio } from "./prospect-client/Form/Radio/CardRadio/CardRadioApollo";
+export { CardRadioGroup } from "./prospect-client/Form/Radio/CardRadioGroup/CardRadioGroupApollo";
 export { Radio } from "./prospect-client/Form/Radio/Radio/RadioApollo";
 export { RadioText, } from "./prospect-client/Form/Radio/RadioText/RadioTextApollo";
 export { TextArea } from "./prospect-client/Form/TextArea/TextAreaApollo";
 export { DebugGrid } from "./prospect-client/Grid/DebugGridApollo";
 export { Heading, } from "./prospect-client/Heading/HeadingApollo";
+export { Header, } from "./prospect-client/Header/HeaderApollo";
 export { Icon, iconSizeVariants, iconVariants, } from "./prospect-client/Icon/IconApollo";
 export { ItemTabBar, } from "./prospect-client/ItemTabBar/ItemTabBarApollo";
-export { ExitLayout, } from "./prospect-client/Layout/ExitLayout/ExitLayoutApollo";
+export { ItemMenu, } from "./prospect-client/ItemMenu/ItemMenuApollo";
+export { MenuBurger, } from "./prospect-client/MenuBurger/MenuBurgerApollo";
+export { TabMenu } from "./prospect-client/TabMenu/TabMenu";
+export { ExitLayout, ExitLayoutSkeleton, } from "./prospect-client/Layout/ExitLayout/ExitLayoutApollo";
 export { Footer, } from "./prospect-client/Layout/Footer/FooterApollo";
 export { FormLayout, } from "./prospect-client/Layout/FormLayout/FormLayout";
 export { LevelSelector, } from "./prospect-client/LevelSelector/LevelSelectorApollo";
@@ -61,7 +64,8 @@ export { ItemPagination, } from "./prospect-client/Pagination/ItemPagination/Ite
 export { Pagination } from "./prospect-client/Pagination/PaginationApollo";
 export { ProgressBar } from "./prospect-client/ProgressBar/ProgressBarApollo";
 export { ProgressBarGroup } from "./prospect-client/ProgressBarGroup/ProgressBarGroupApollo";
-export { Skeleton, } from "./prospect-client/Skeleton/SkeletonApollo";
+export { Skeleton, skeletonSizeVariants, skeletonVariants, } from "./prospect-client/Skeleton/Skeleton";
+export { SkeletonGrid, } from "./prospect-client/SkeletonGrid/SkeletonGrid";
 export { SkeletonList, } from "./prospect-client/SkeletonList/SkeletonListApollo";
 export { Spinner, spinnerVariants, } from "./prospect-client/Spinner/SpinnerApollo";
 export { Stepper } from "./prospect-client/Stepper/StepperApollo";
@@ -70,5 +74,7 @@ export { TabBar, tabBarDirection, } from "./prospect-client/TabBar/TabBarApollo"
 export { Table, } from "./prospect-client/Table/TableApollo";
 export { TableMobileCard } from "./prospect-client/TableMobileCard/TableMobileCard";
 export { Tag, tagVariants, } from "./prospect-client/Tag/TagApollo";
+export { TagList, } from "./prospect-client/TagList/TagListApollo";
 export { TimelineVertical } from "./prospect-client/TimelineVertical/TimelineVerticalApollo";
 export { Toggle } from "./prospect-client/Toggle/ToggleApollo";
+export { MessageBar, } from "./prospect-client/MessageBar/MessageBarApollo";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@axa-fr/canopee-react",
-  "version": "1.8.0",
+  "version": "2.0.0-RC.1",
   "description": "Package React - Design System Canopée",
   "exports": {
     "./distributeur": {
@@ -53,10 +53,10 @@
   },
   "homepage": "https://github.com/AxaFrance/design-system#readme",
   "peerDependencies": {
-    "@axa-fr/canopee-css": "1.8.0",
+    "@axa-fr/canopee-css": "2.0.0-RC.1",
     "@material-symbols/svg-400": ">= 0.19.0",
     "@material-symbols/svg-700": ">= 0.19.0",
-    "react": ">= 18"
+    "react": ">= 19"
   },
   "dependencies": {
     "@floating-ui/react": "^0.27.8",

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

@@ -1,12 +0,0 @@
-import { type ComponentPropsWithRef } from "react";
-import "@axa-fr/canopee-css/distributeur/Form/Pass/Pass.css";
-type Props = Omit<ComponentPropsWithRef<"input">, "type" | "role"> & {
-    type?: "text" | "password";
-    classModifier?: string;
-    onToggleType: () => void;
-};
-/**
- * @deprecated The Pass component is deprecated and will be removed in a future release
- */
-declare const Pass: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
-export { Pass };

package/dist/distributeur/Form/Pass/Pass.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { getComponentClassName } from "../../utilities";
-import "@axa-fr/canopee-css/distributeur/Form/Pass/Pass.css";
-/**
- * @deprecated The Pass component is deprecated and will be removed in a future release
- */
-const Pass = forwardRef(({ onToggleType, type = "password", className, classModifier, ...inputProps }, inputRef) => {
-    const componentClassName = getComponentClassName(className, classModifier, "af-form__pass");
-    return (_jsxs("div", { className: componentClassName, children: [_jsx("div", { className: "af-form__pass-strength" }), _jsx("input", { ...inputProps, role: type === "password" ? "password" : "textbox", className: "af-form__input-text", type: type, ref: inputRef, required: classModifier?.includes("required") }), _jsx("button", { className: "af-form__pass-btn", type: "button", "aria-label": "show password", onClick: onToggleType, children: _jsx("i", { className: `glyphicon glyphicon-eye${type === "text" ? "-close" : "-open"}` }) })] }));
-});
-Pass.displayName = "Pass";
-export { Pass };

package/dist/distributeur/Form/Pass/PassInput.d.ts

@@ -1,13 +0,0 @@
-import { type ComponentProps, type ReactNode } from "react";
-import { type ConsumerFieldProps } from "../core";
-import { Pass } from "./Pass";
-type PassProps = ComponentProps<typeof Pass>;
-type Props = Omit<ConsumerFieldProps & PassProps & {
-    helpMessage?: ReactNode;
-    score?: string;
-}, "onToggleType" | "type">;
-/**
- * @deprecated The PassInput component is deprecated and will be removed in a future release
- */
-declare const PassInput: ({ children, score, classModifier, disabled, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
-export { PassInput };

package/dist/distributeur/Form/Pass/PassInput.js

@@ -1,34 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { Field } from "../core";
-import { Pass } from "./Pass";
-const strengthList = {
-    0: "bad",
-    1: "okay",
-    2: "good",
-    3: "verygood",
-    4: "excellent",
-};
-const calculateStrength = (score) => {
-    if (score === null || score === undefined) {
-        return null;
-    }
-    const scoreToNumber = Number(score);
-    let strength = Number.isNaN(scoreToNumber) ? 0 : scoreToNumber;
-    if (strength > 4) {
-        strength = 4;
-    }
-    if (strength < 0) {
-        strength = 0;
-    }
-    return strengthList[strength];
-};
-/**
- * @deprecated The PassInput component is deprecated and will be removed in a future release
- */
-const PassInput = ({ children, score, classModifier, disabled, ...props }) => {
-    const strength = calculateStrength(score);
-    const [type, setType] = useState("password");
-    return (_jsx(Field, { ...props, classModifier: classModifier, renderInput: ({ id, classModifier: modifier, ariaInvalid, errorId, ...inputProps }) => (_jsxs(_Fragment, { children: [_jsx(Pass, { ...inputProps, type: type, id: id, disabled: disabled, classModifier: `${modifier} ${strength}`, "aria-describedby": errorId, "aria-invalid": ariaInvalid, onToggleType: () => setType(type === "password" ? "text" : "password") }), children] })) }));
-};
-export { PassInput };

package/dist/distributeur/Form/Pass/index.d.ts

@@ -1,2 +0,0 @@
-export { PassInput } from "./PassInput";
-export { Pass } from "./Pass";

package/dist/distributeur/Form/Pass/index.js

@@ -1,2 +0,0 @@
-export { PassInput } from "./PassInput";
-export { Pass } from "./Pass";

package/dist/distributeur/Form/Select/SelectDefaultWithOptions.d.ts

@@ -1,23 +0,0 @@
-import { type ComponentPropsWithRef, type OptionHTMLAttributes } from "react";
-import { SelectBase } from "./SelectBase";
-type Props = ComponentPropsWithRef<typeof SelectBase> & {
-    options: OptionHTMLAttributes<HTMLOptionElement>[];
-    forceDisplayPlaceholder?: boolean;
-    placeholder?: string;
-};
-/**
- * @deprecated Use `SelectDefault` instead
- * Instead of
- * ```jsx
- * <SelectDefaultWithOptions options={[{ value: "1", label: "Option 1" }]} />
- * ```
- * you can now do something like :
- * ```jsx
- * <SelectDefault>
- *   <option value="1">Option 1</option>
- * </SelectDefault>
- * ```
- * It allows you to use the `optgroup` tag for example.
- */
-export declare const SelectDefaultWithOptions: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLSelectElement>>;
-export {};

package/dist/distributeur/Form/Select/SelectDefaultWithOptions.js

@@ -1,39 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, useId, useMemo, useState, } from "react";
-import { SelectBase } from "./SelectBase";
-/**
- * @deprecated Use `SelectDefault` instead
- * Instead of
- * ```jsx
- * <SelectDefaultWithOptions options={[{ value: "1", label: "Option 1" }]} />
- * ```
- * you can now do something like :
- * ```jsx
- * <SelectDefault>
- *   <option value="1">Option 1</option>
- * </SelectDefault>
- * ```
- * It allows you to use the `optgroup` tag for example.
- */
-export const SelectDefaultWithOptions = forwardRef(({ onChange, forceDisplayPlaceholder = false, value, defaultValue, required, placeholder = "- Select -", options, id, ...otherProps }, inputRef) => {
-    const [hasHandleChangeOnce, setHasHandleChangeOnce] = useState(false);
-    const generatedId = useId();
-    const inputId = id ?? generatedId;
-    const newOptions = useMemo(() => (hasHandleChangeOnce || defaultValue || value) && required
-        ? options
-        : [{ value: "", label: placeholder }, ...options], [
-        hasHandleChangeOnce,
-        options,
-        defaultValue,
-        value,
-        required,
-        placeholder,
-    ]);
-    return (_jsx(SelectBase, { ...otherProps, id: inputId, value: value, defaultValue: defaultValue, options: newOptions, onChange: (e) => {
-            if (onChange) {
-                onChange(e);
-            }
-            setHasHandleChangeOnce(!forceDisplayPlaceholder);
-        }, ref: inputRef }));
-});
-SelectDefaultWithOptions.displayName = "SelectDefaultWithOptions";

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

@@ -1,28 +0,0 @@
-import RcSlider from "rc-slider";
-import { type ComponentProps, type ReactNode } from "react";
-type RcSliderProps = ComponentProps<typeof RcSlider>;
-type Props = Omit<RcSliderProps, "marks" | "onChange" | "onChangeComplete"> & {
-    /** @deprecated Use `className` instead. */
-    classModifier?: string;
-    options: {
-        value: number;
-        label?: string | ReactNode;
-    }[];
-    id: string;
-    name: string;
-    onChange?: (selectedValue: {
-        id: string;
-        name: string;
-        value: number;
-    }) => void;
-    onChangeComplete?: (selectedValue: {
-        id: string;
-        name: string;
-        value: number;
-    }) => void;
-};
-/**
- * @deprecated Slider is deprecated and will be removed in a future major release.
- */
-declare const Slider: ({ options, value, defaultValue, className, classModifier, ...otherProps }: Props) => import("react/jsx-runtime").JSX.Element;
-export { Slider };

package/dist/distributeur/Form/Slider/Slider.js

@@ -1,40 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import RcSlider from "rc-slider";
-import { useCallback, useMemo, } from "react";
-import { getClassName } from "../../utilities/helpers/getClassName";
-/**
- * @deprecated Slider is deprecated and will be removed in a future major release.
- */
-const Slider = ({ options, value, defaultValue, className, classModifier, ...otherProps }) => {
-    const defaultValueIndex = useMemo(() => {
-        const newDefaultValueIndex = options.findIndex((opt) => opt.value === (defaultValue || value));
-        return newDefaultValueIndex !== -1 ? newDefaultValueIndex : undefined;
-    }, [defaultValue, options, value]);
-    const valueIndex = useMemo(() => {
-        const newValueIndex = options.findIndex((opt) => opt.value === value);
-        return newValueIndex !== -1 ? newValueIndex : undefined;
-    }, [value, options]);
-    const marks = useMemo(() => [...options]
-        .sort((optA, optB) => optA.value - optB.value)
-        .reduce((prevMarks, { value: optValue, label: optLabel }, index) => {
-        const newMarks = { ...prevMarks };
-        newMarks[index] = optLabel || optValue;
-        return newMarks;
-    }, {}), [options]);
-    const componentClassName = useMemo(() => getClassName({
-        baseClassName: "af-slider",
-        modifiers: classModifier?.split(" "),
-        className,
-    }), [className, classModifier]);
-    const formatOnChange = useCallback((newValueIndex, onChange) => {
-        if (onChange && !Array.isArray(newValueIndex)) {
-            onChange({
-                id: otherProps.id,
-                name: otherProps.name,
-                value: options[newValueIndex].value,
-            });
-        }
-    }, [options, otherProps.id, otherProps.name]);
-    return (_jsx(RcSlider, { ...otherProps, min: 0, max: options.length - 1, onChange: (newValueIndex) => formatOnChange(newValueIndex, otherProps.onChange), onChangeComplete: (newValueIndex) => formatOnChange(newValueIndex, otherProps.onChangeComplete), marks: marks, step: null, className: componentClassName, defaultValue: defaultValueIndex, value: valueIndex, disabled: otherProps.disabled || classModifier?.includes("disabled"), "aria-required": classModifier?.includes("required") }));
-};
-export { Slider };

package/dist/distributeur/Form/Slider/SliderInput.d.ts

@@ -1,9 +0,0 @@
-import { type ComponentProps } from "react";
-import { type ConsumerFieldProps } from "../core";
-import { Slider } from "./Slider";
-type Props = ConsumerFieldProps & ComponentProps<typeof Slider>;
-/**
- * @deprecated This component is deprecated and will be removed in a future major release.
- */
-declare const SliderInput: ({ children, name, options, label, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
-export { SliderInput };

package/dist/distributeur/Form/Slider/SliderInput.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import {} from "react";
-import { Field } from "../core";
-import { Slider } from "./Slider";
-/**
- * @deprecated This component is deprecated and will be removed in a future major release.
- */
-const SliderInput = ({ children, name, options, label, ...props }) => {
-    return (_jsx(Field, { label: label, ...props, renderInput: ({ id, classModifier, ...sliderProps }) => (_jsxs(_Fragment, { children: [_jsx(Slider, { id: id, classModifier: classModifier, name: name, options: options, ...sliderProps }), children] })) }));
-};
-export { SliderInput };