@axa-fr/canopee-react 1.8.1-alpha.1 → 2.0.0-alpha.22

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";
@@ -36,17 +37,20 @@ InputText as TextInput, } 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 { 
-/** @deprecated Use `CardRadioGroup` instead. */
-CardRadioGroup as CardRadio, CardRadioGroup, } from "./prospect-client/Form/Radio/CardRadioGroup/CardRadioGroupLF";
-export { CardRadioOption } from "./prospect-client/Form/Radio/CardRadioOption/CardRadioOptionLF";
+export { ItemMultiSelect, type ItemMultiSelectProps, } from "./prospect-client/Form/ItemMultiSelect/ItemMultiSelectLF";
+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 { Heading, type HeadingLevel, type HeadingProps, } from "./prospect-client/Heading/HeadingLF";
+export { Header, type HeaderProps } from "./prospect-client/Header/HeaderLF";
 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 { MenuBurger, type MenuBurgerProps, } from "./prospect-client/MenuBurger/MenuBurgerLF";
+export { TabMenu, type TabMenuProps } from "./prospect-client/TabMenu/TabMenu";
 export { ExitLayout, type ExitLayoutProps, type ExitLayoutWithSubComponents, } 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";
@@ -74,6 +78,7 @@ export { TabBar, tabBarDirection, type TabBarDirection, type TabBarProps, } from
 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 { 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";

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";
@@ -36,17 +37,20 @@ InputText as TextInput, } 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 { 
-/** @deprecated Use `CardRadioGroup` instead. */
-CardRadioGroup as CardRadio, CardRadioGroup, } from "./prospect-client/Form/Radio/CardRadioGroup/CardRadioGroupLF";
-export { CardRadioOption } from "./prospect-client/Form/Radio/CardRadioOption/CardRadioOptionLF";
+export { ItemMultiSelect, } from "./prospect-client/Form/ItemMultiSelect/ItemMultiSelectLF";
+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 { Heading, } from "./prospect-client/Heading/HeadingLF";
+export { Header } from "./prospect-client/Header/HeaderLF";
 export { Icon, iconSizeVariants, iconVariants, } from "./prospect-client/Icon/IconLF";
 export { ItemTabBar, } from "./prospect-client/ItemTabBar/ItemTabBarLF";
+export { ItemMenu, } from "./prospect-client/ItemMenu/ItemMenuLF";
+export { MenuBurger, } from "./prospect-client/MenuBurger/MenuBurgerLF";
+export { TabMenu } from "./prospect-client/TabMenu/TabMenu";
 export { ExitLayout, } from "./prospect-client/Layout/ExitLayout/ExitLayoutLF";
 export { Footer, } from "./prospect-client/Layout/Footer/FooterLF";
 export { FormLayout, } from "./prospect-client/Layout/FormLayout/FormLayout";
@@ -74,5 +78,6 @@ export { TabBar, tabBarDirection, } from "./prospect-client/TabBar/TabBarLF";
 export { Table, } from "./prospect-client/Table/TableLF";
 export { TableMobileCard, } from "./prospect-client/TableMobileCard/TableMobileCard";
 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";

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

@@ -1,6 +1,12 @@
 import "@axa-fr/canopee-css/distributeur/Action/Action.css";
-export declare const Action: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+import { type ComponentPropsWithRef } from "react";
+type ActionCoreProps = ComponentPropsWithRef<"a"> & {
     icon: string;
     /** @deprecated Use `className` instead. */
     classModifier?: string;
-} & import("react").RefAttributes<HTMLAnchorElement>>;
+};
+export declare const Action: {
+    ({ icon, className, classModifier, ...otherProps }: ActionCoreProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/distributeur/Action/Action.js

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

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

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

package/dist/distributeur/Button/Button.js

@@ -1,7 +1,7 @@
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import classNames from "classnames";
-import { forwardRef, } from "react";
+import {} from "react";
 import "@axa-fr/canopee-css/distributeur/Button/Button.css";
 const DEFAULT_CLASS_NAME = "af-btn";
-export const Button = forwardRef(({ variant = "primary", small, leftIcon, rightIcon, className, children, ...props }, ref) => (_jsxs("button", { type: "button", className: classNames(DEFAULT_CLASS_NAME, variant !== "primary" && `${DEFAULT_CLASS_NAME}--${variant}`, small && `${DEFAULT_CLASS_NAME}--small`, className), ...props, ref: ref, children: [leftIcon, children, rightIcon] })));
+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] }));
 Button.displayName = "Button";

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

@@ -1,4 +1,4 @@
-import React, { type ComponentProps, type ReactNode } from "react";
+import { type ComponentPropsWithRef, type ReactNode } from "react";
 import type { Option } from "../core";
 import { CheckboxItem } from "./CheckboxItem";
 import { CheckboxModes } from "./CheckboxModes";
@@ -13,7 +13,7 @@ type OnChange = {
         id?: string;
     }) => void;
 };
-type Props = Omit<ComponentProps<typeof CheckboxItem>, "value" | "label" | "checked" | "onChange"> & {
+type Props = Omit<ComponentPropsWithRef<typeof CheckboxItem>, "value" | "label" | "checked" | "onChange"> & {
     options: Option[];
     values?: string[];
     children?: ReactNode;
@@ -22,5 +22,8 @@ type Props = Omit<ComponentProps<typeof CheckboxItem>, "value" | "label" | "chec
      */
     mode?: keyof typeof CheckboxModes;
 } & OnChange;
-export declare const Checkbox: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export declare const Checkbox: {
+    ({ id, name, options, disabled, children, values, mode, onChange, ...otherProps }: Props): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export {};

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

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createElement as _createElement } from "react";
-import React, { forwardRef } from "react";
+import React, {} from "react";
 import { CheckboxItem } from "./CheckboxItem";
 import { CheckboxModes } from "./CheckboxModes";
 const defaultClassName = (mode) => {
@@ -13,7 +13,7 @@ const defaultClassName = (mode) => {
             return `af-form__checkbox-${mode}`;
     }
 };
-const CheckboxInner = forwardRef(({ id, name, options, disabled, children, values = [], mode = CheckboxModes.default, onChange = () => { }, ...otherProps }, inputRef) => {
+const CheckboxInner = ({ id, name, options, disabled, children, values = [], mode = CheckboxModes.default, onChange = () => { }, ...otherProps }) => {
     const className = defaultClassName(mode);
     const handleOnChange = ({ target: { value, checked }, }) => {
         const newValues = checked
@@ -23,8 +23,8 @@ const CheckboxInner = forwardRef(({ id, name, options, disabled, children, value
     };
     return (_jsx("div", { className: "af-form__checkbox-container", 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, ref: inputRef, ...option }, children));
+            return (_createElement(CheckboxItem, { ...otherProps, onChange: handleOnChange, key: option.value, className: className, isChecked: isChecked, name: name, disabled: option.disabled || disabled, ...option }, children));
         }) }));
-});
+};
 CheckboxInner.displayName = "Checkbox";
 export const Checkbox = CheckboxInner;

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

@@ -1,6 +1,9 @@
-import { type ComponentProps } from "react";
+import { type ComponentPropsWithRef } from "react";
 import { type ConsumerFieldProps } from "../core";
 import { Checkbox } from "./Checkbox";
-type Props = Omit<ComponentProps<typeof Checkbox> & ConsumerFieldProps, "placeholder">;
-declare const CheckboxInput: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+type Props = Omit<ComponentPropsWithRef<typeof Checkbox> & ConsumerFieldProps, "placeholder">;
+declare const CheckboxInput: {
+    ({ label, mode, options, children, ...otherProps }: Props): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { CheckboxInput };

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

@@ -1,13 +1,13 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
+import {} from "react";
 import { Field, useOptionsWithId } from "../core";
 import { Checkbox } from "./Checkbox";
 import { CheckboxModes } from "./CheckboxModes";
-const CheckboxInput = forwardRef(({ label, mode = "default", options, children, ...otherProps }, inputRef) => {
+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, ref: inputRef, "aria-describedby": errorId, "aria-invalid": ariaInvalid, ...props }), children] }));
+            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] }));
         } }));
-});
+};
 CheckboxInput.displayName = "CheckboxInput";
 export { CheckboxInput };

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

@@ -1,6 +1,6 @@
-import { type ReactNode } from "react";
+import { type ComponentPropsWithRef, type ReactNode } from "react";
 import "@axa-fr/canopee-css/distributeur/Form/Checkbox/Checkbox.css";
-declare const CheckboxItem: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "type"> & {
+type Props = Omit<ComponentPropsWithRef<"input">, "type"> & {
     /** @deprecated Use `className` instead. */
     classModifier?: string;
     optionClassName?: string;
@@ -8,5 +8,9 @@ declare const CheckboxItem: import("react").ForwardRefExoticComponent<Omit<Omit<
     label?: ReactNode;
     isChecked?: boolean;
     variant?: "error" | "warning";
-} & import("react").RefAttributes<HTMLInputElement>>;
+};
+declare const CheckboxItem: {
+    ({ disabled, value, id, children, label, isChecked, className, classModifier, variant, ...otherProps }: Props): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { CheckboxItem };

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

@@ -1,15 +1,15 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import check from "@material-symbols/svg-700/sharp/check.svg";
-import { forwardRef, useId, } from "react";
+import { useId } from "react";
 import { getOptionClassName } from "../core";
 import "@axa-fr/canopee-css/distributeur/Form/Checkbox/Checkbox.css";
 import { Svg } from "../../Svg";
-const CheckboxItem = forwardRef(({ disabled = false, value = "", id, children, label, isChecked, className, classModifier, variant, ...otherProps }, inputRef) => {
+const CheckboxItem = ({ disabled = false, value = "", id, children, label, isChecked, className, classModifier, variant, ...otherProps }) => {
     const newLabel = children || label;
     const generatedId = useId();
     const newId = id ?? generatedId; // id is required on this component
     const optionClassName = getOptionClassName(className ?? "", classModifier ?? "", "af-form__checkbox", disabled, variant);
-    return (_jsxs("div", { className: optionClassName, children: [_jsx("input", { ...otherProps, className: "af-form__input-checkbox", value: value, id: newId, disabled: disabled, checked: isChecked, type: "checkbox", ref: inputRef }), _jsxs("label", { className: "af-form__label", htmlFor: newId, children: [_jsx("span", { className: "af-form__indicator", children: _jsx(Svg, { role: "presentation", className: "ok-icon", src: check }) }), _jsx("span", { className: "af-form__description", children: newLabel })] })] }));
-});
+    return (_jsxs("div", { className: optionClassName, children: [_jsx("input", { ...otherProps, className: "af-form__input-checkbox", value: value, id: newId, disabled: disabled, checked: isChecked, type: "checkbox" }), _jsxs("label", { className: "af-form__label", htmlFor: newId, children: [_jsx("span", { className: "af-form__indicator", children: _jsx(Svg, { role: "presentation", className: "ok-icon", src: check }) }), _jsx("span", { className: "af-form__description", children: newLabel })] })] }));
+};
 CheckboxItem.displayName = "CheckboxItem";
 export { CheckboxItem };

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

@@ -1,7 +1,7 @@
-import { type ComponentProps } from "react";
+import { type ComponentPropsWithRef } from "react";
 import { Radio } from "../Radio";
 import { type Option } from "../core";
-type Props = Omit<ComponentProps<typeof Radio>, "options" | "value"> & {
+type Props = Omit<ComponentPropsWithRef<typeof Radio>, "options" | "value"> & {
     id: string;
     name?: string;
     options?: Array<Omit<Option, "value"> & {
@@ -11,5 +11,8 @@ type Props = Omit<ComponentProps<typeof Radio>, "options" | "value"> & {
     /** @deprecated Use `className` instead. */
     classModifier?: string;
 };
-declare const Choice: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+declare const Choice: {
+    ({ children, value, options, name, ...otherProps }: Props): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { Choice };

package/dist/distributeur/Form/Choice/Choice.js

@@ -1,18 +1,18 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, useId } from "react";
+import { useId } from "react";
 import { Radio } from "../Radio";
 import { useOptionsWithId } from "../core";
 const defaultOptions = [
     { label: "Oui", value: true },
     { label: "Non", value: false },
 ];
-const Choice = forwardRef(({ children, value, options = defaultOptions, name, ...otherProps }, inputRef) => {
+const Choice = ({ children, value, options = defaultOptions, name, ...otherProps }) => {
     const choiceOptions = useOptionsWithId(options.map((o) => ({
         ...o,
         value: `${o.value}`,
     })));
     const generatedId = useId();
-    return (_jsx(Radio, { ...otherProps, mode: "default", ref: inputRef, name: name ?? `choice_${generatedId}`, value: value?.toString(), options: choiceOptions, children: children }));
-});
+    return (_jsx(Radio, { ...otherProps, mode: "default", name: name ?? `choice_${generatedId}`, value: value?.toString(), options: choiceOptions, children: children }));
+};
 Choice.displayName = "Choice";
 export { Choice };

package/dist/distributeur/Form/Choice/ChoiceInput.d.ts

@@ -1,6 +1,9 @@
-import { type ComponentProps } from "react";
+import { type ComponentPropsWithRef } from "react";
 import { type ConsumerFieldProps } from "../core";
 import { Choice } from "./Choice";
-type Props = ComponentProps<typeof Choice> & ConsumerFieldProps;
-declare const ChoiceInput: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+type Props = ComponentPropsWithRef<typeof Choice> & ConsumerFieldProps;
+declare const ChoiceInput: {
+    ({ label, options, children, ...otherProps }: Props): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { ChoiceInput };

package/dist/distributeur/Form/Choice/ChoiceInput.js

@@ -1,13 +1,11 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
+import {} from "react";
 import { Field } from "../core";
 import { Choice } from "./Choice";
 const defaultOptions = [
     { label: "Oui", value: true },
     { label: "Non", value: false },
 ];
-const ChoiceInput = forwardRef(({ label, options = defaultOptions, children, ...otherProps }, inputRef) => {
-    return (_jsx(Field, { label: label, roleContainer: "radiogroup", ...otherProps, renderInput: ({ classModifier, id, errorId, ariaInvalid, ...props }) => (_jsxs(_Fragment, { children: [_jsx(Choice, { id: id, ref: inputRef, classModifier: classModifier, "aria-describedby": errorId, "aria-invalid": ariaInvalid, options: options, ...props }), children] })) }));
-});
+const ChoiceInput = ({ label, options = defaultOptions, children, ...otherProps }) => (_jsx(Field, { label: label, roleContainer: "radiogroup", ...otherProps, renderInput: ({ classModifier, id, errorId, ariaInvalid, ...props }) => (_jsxs(_Fragment, { children: [_jsx(Choice, { id: id, classModifier: classModifier, "aria-describedby": errorId, "aria-invalid": ariaInvalid, options: options, ...props }), children] })) }));
 ChoiceInput.displayName = "ChoiceInput";
 export { ChoiceInput };

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

@@ -6,5 +6,8 @@ type Props = Omit<ComponentPropsWithRef<"input">, "value"> & {
     defaultValue?: Date | string;
     value?: Date | string;
 };
-declare const Date: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+declare const Date: {
+    ({ className, classModifier, defaultValue, value, ...otherProps }: Props): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { Date };

package/dist/distributeur/Form/Date/Date.js

@@ -1,15 +1,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import "@axa-fr/canopee-css/distributeur/Form/Date/Date.css";
-import { forwardRef } from "react";
+import {} from "react";
 import { formatDateInputValue } from "../../utilities/helpers/date";
 import { getClassName } from "../../utilities/helpers/getClassName";
-const Date = forwardRef(({ className, classModifier, defaultValue, value, ...otherProps }, ref) => {
+const Date = ({ className, classModifier, defaultValue, value, ...otherProps }) => {
     const componentClassName = getClassName({
         baseClassName: "af-form__input-date",
         modifiers: classModifier?.split(" "),
         className,
     });
-    return (_jsx("input", { className: componentClassName, type: "date", defaultValue: formatDateInputValue(defaultValue), value: formatDateInputValue(value), ref: ref, disabled: classModifier?.includes("disabled"), required: classModifier?.includes("required"), ...otherProps }));
-});
+    return (_jsx("input", { className: componentClassName, type: "date", defaultValue: formatDateInputValue(defaultValue), value: formatDateInputValue(value), disabled: classModifier?.includes("disabled"), required: classModifier?.includes("required"), ...otherProps }));
+};
 Date.displayName = "Date";
 export { Date };

package/dist/distributeur/Form/Date/DateInput.d.ts

@@ -4,5 +4,8 @@ import { Date } from "./Date";
 type Props = ConsumerFieldProps & ComponentProps<typeof Date> & {
     helpMessage?: ReactNode;
 };
-declare const DateInput: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+declare const DateInput: {
+    ({ children, ...otherProps }: Props): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { DateInput };

package/dist/distributeur/Form/Date/DateInput.js

@@ -1,9 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
+import {} from "react";
 import { Field } from "../core";
 import { Date } from "./Date";
-const DateInput = forwardRef(({ children, ...otherProps }, inputRef) => {
-    return (_jsx(Field, { classNameSuffix: "date", ...otherProps, renderInput: ({ id, classModifier, ariaInvalid, errorId, ...props }) => (_jsxs(_Fragment, { children: [_jsx(Date, { id: id, classModifier: classModifier, ref: inputRef, "aria-describedby": errorId, "aria-invalid": ariaInvalid, ...props }), children] })) }));
-});
+const DateInput = ({ children, ...otherProps }) => (_jsx(Field, { classNameSuffix: "date", ...otherProps, renderInput: ({ id, classModifier, ariaInvalid, errorId, ...props }) => (_jsxs(_Fragment, { children: [_jsx(Date, { id: id, classModifier: classModifier, "aria-describedby": errorId, "aria-invalid": ariaInvalid, ...props }), children] })) }));
 DateInput.displayName = "DateInput";
 export { DateInput };

package/dist/distributeur/Form/Experimental/Input.d.ts

@@ -1,3 +1,7 @@
 import "@axa-fr/canopee-css/distributeur/Form/Experimental/Input.css";
-declare const Input: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+import { type ComponentPropsWithRef } from "react";
+declare const Input: {
+    ({ className, ...otherProps }: ComponentPropsWithRef<"input">): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { Input };

package/dist/distributeur/Form/Experimental/Input.js

@@ -1,13 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import "@axa-fr/canopee-css/distributeur/Form/Experimental/Input.css";
-import { forwardRef } from "react";
+import {} from "react";
 import { getClassName } from "../../utilities/helpers/getClassName";
-const Input = forwardRef(({ className, ...otherProps }, inputRef) => {
+const Input = ({ className, ...otherProps }) => {
     const componentClassName = getClassName({
         baseClassName: "af-input__input",
         className,
     });
-    return (_jsx("input", { className: componentClassName, ref: inputRef, ...otherProps }));
-});
+    return _jsx("input", { className: componentClassName, ...otherProps });
+};
 Input.displayName = "Input";
 export { Input };

package/dist/distributeur/Form/Experimental/TextInput.d.ts

@@ -7,5 +7,8 @@ export type TextInputProps = Omit<ComponentProps<typeof Input>, "children"> & In
  * It can be customized to render the label on top, or on the left of the input.
  * It also supports adding a unit on the right of the input.
  */
-declare const TextInput: import("react").ForwardRefExoticComponent<Omit<TextInputProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+declare const TextInput: {
+    ({ contentRight, id, labelPosition, inputClassName: inputClassNameProp, labelClassName: labelClassNameProp, helpMessage, containerClassName, required, label, errorMessage, ...props }: TextInputProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { TextInput };

package/dist/distributeur/Form/Experimental/TextInput.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
+import {} from "react";
 import { Input } from "./Input";
 import { InputContainer } from "./InputContainer";
 import { InputUnit } from "./InputUnit";
@@ -11,7 +11,7 @@ import { useInput } from "./useInput.hook";
  * It can be customized to render the label on top, or on the left of the input.
  * It also supports adding a unit on the right of the input.
  */
-const TextInput = forwardRef(({ contentRight, id, labelPosition, inputClassName: inputClassNameProp, labelClassName: labelClassNameProp, helpMessage, containerClassName, required, label, errorMessage, ...props }, inputRef) => {
+const TextInput = ({ contentRight, id, labelPosition, inputClassName: inputClassNameProp, labelClassName: labelClassNameProp, helpMessage, containerClassName, required, label, errorMessage, ...props }) => {
     const { describedBy, errorId, helperId, inputClassName, inputId, isContainerVertical, isInvalid, labelClassName, } = useInput({
         id,
         labelPosition,
@@ -20,7 +20,7 @@ const TextInput = forwardRef(({ contentRight, id, labelPosition, inputClassName:
         errorMessage,
         helpMessage,
     });
-    return (_jsxs(InputContainer, { vertical: isContainerVertical, className: containerClassName, children: [_jsx(Label, { htmlFor: inputId, required: required, className: labelClassName, children: label }), _jsx(Input, { ...props, className: inputClassName, id: inputId, ref: inputRef, "aria-describedby": describedBy, "aria-invalid": isInvalid }), contentRight ? _jsx(InputUnit, { children: contentRight }) : null, helpMessage ? (_jsx(ItemMessage, { id: helperId, children: helpMessage })) : null, errorMessage ? (_jsx(ItemMessage, { variant: "error", id: errorId, children: errorMessage })) : null] }));
-});
+    return (_jsxs(InputContainer, { vertical: isContainerVertical, className: containerClassName, children: [_jsx(Label, { htmlFor: inputId, required: required, className: labelClassName, children: label }), _jsx(Input, { ...props, className: inputClassName, id: inputId, "aria-describedby": describedBy, "aria-invalid": isInvalid }), contentRight ? _jsx(InputUnit, { children: contentRight }) : null, helpMessage ? (_jsx(ItemMessage, { id: helperId, children: helpMessage })) : null, errorMessage ? (_jsx(ItemMessage, { variant: "error", id: errorId, children: errorMessage })) : null] }));
+};
 TextInput.displayName = "TextInput";
 export { TextInput };

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

@@ -4,5 +4,8 @@ type Props = Omit<ComponentPropsWithRef<"input">, "type"> & {
     /** @deprecated Use `className` and the native `required` prop instead. */
     classModifier?: string;
 };
-declare const Number: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+declare const Number: {
+    ({ id, className, classModifier, required, ...otherProps }: Props): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { Number };

package/dist/distributeur/Form/Number/Number.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import "@axa-fr/canopee-css/distributeur/Form/Text/Text.css";
-import { forwardRef, useId } from "react";
+import { useId } from "react";
 import { getClassName } from "../../utilities/helpers/getClassName";
-const Number = forwardRef(({ id, className, classModifier, required, ...otherProps }, inputRef) => {
+const Number = ({ id, className, classModifier, required, ...otherProps }) => {
     const inputUseId = useId();
     const inputId = id ?? inputUseId;
     const componentClassName = getClassName({
@@ -10,7 +10,7 @@ const Number = forwardRef(({ id, className, classModifier, required, ...otherPro
         modifiers: classModifier?.split(" "),
         className,
     });
-    return (_jsx("input", { className: componentClassName, id: inputId, type: "number", ref: inputRef, required: required || classModifier?.includes("required"), ...otherProps }));
-});
+    return (_jsx("input", { className: componentClassName, id: inputId, type: "number", required: required || classModifier?.includes("required"), ...otherProps }));
+};
 Number.displayName = "Number";
 export { Number };

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

@@ -8,5 +8,8 @@ type Props = Omit<ComponentPropsWithRef<"input">, "type" | "role"> & {
 /**
  * @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>>;
+declare const Pass: {
+    ({ onToggleType, type, className, classModifier, ...inputProps }: Props): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { Pass };

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

@@ -1,13 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
+import {} 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 Pass = ({ onToggleType, type = "password", className, classModifier, ...inputProps }) => {
     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"}` }) })] }));
-});
+    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, 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 };