@axa-fr/design-system-apollo-react 2.0.3 → 2.0.4-alpha.13

package/dist/Form/Checkbox/CardCheckbox/CardCheckboxCommon.d.ts

@@ -19,14 +19,17 @@ export type CardCheckboxProps = Omit<CardCheckboxOptionProps, "value" | "label"
      */
     isRequired?: boolean;
     options: CheckboxOption[];
+    /**
+     * @deprecated  Use `message` and messageType instead.
+     */
     error?: string;
-};
+} & Partial<ItemMessageProps>;
 type CardCheckboxCommonProps = CardCheckboxProps & {
     CardCheckboxItemComponent: ComponentType<CardCheckboxOptionProps>;
     ItemMessageComponent: ComponentType<ItemMessageProps>;
 };
 export declare const CardCheckboxCommon: {
-    ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type, error, name, id, onChange, CardCheckboxItemComponent, ItemMessageComponent, ...inputProps }: CardCheckboxCommonProps): import("react/jsx-runtime").JSX.Element;
+    ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type, error, name, id, onChange, CardCheckboxItemComponent, ItemMessageComponent, message, messageType, ...inputProps }: CardCheckboxCommonProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export {};

package/dist/Form/Checkbox/CardCheckbox/CardCheckboxCommon.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useId, useRef, } from "react";
-export const CardCheckboxCommon = ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type = "vertical", error, name, id, onChange = () => { }, CardCheckboxItemComponent, ItemMessageComponent, ...inputProps }) => {
+export const CardCheckboxCommon = ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type = "vertical", error, name, id, onChange = () => { }, CardCheckboxItemComponent, ItemMessageComponent, message, messageType, ...inputProps }) => {
     const generatedId = useId();
     const cardCheckboxId = id || generatedId;
-    const errorId = `${cardCheckboxId}-error`;
+    const messageId = `${cardCheckboxId}-error`;
     const cardCheckboxOptionsRef = useRef(null);
     const handleChange = (event) => {
         const cardCheckboxOptionsEl = cardCheckboxOptionsRef.current;
@@ -22,9 +22,10 @@ export const CardCheckboxCommon = ({ className, labelGroup, descriptionGroup, la
         }
         onChange(event);
     };
+    const hasError = (Boolean(message) && messageType === "error") || Boolean(error);
     return (_jsxs("fieldset", { className: ["af-card-checkbox", className].filter(Boolean).join(" "), id: cardCheckboxId, children: [_jsxs("legend", { className: "af-card-checkbox__legend", children: [_jsxs("p", { className: "af-card-checkbox__label", children: [label, labelGroup, required || isRequired ? _jsx("span", { "aria-hidden": true, children: "*" }) : null] }), description || descriptionGroup ? (_jsxs("p", { className: "af-card-checkbox__description", children: [description, descriptionGroup] })) : null] }), _jsx("div", { className: [
                     "af-card-checkbox__options",
                     `af-card-checkbox__options--${type}`,
-                ].join(" "), ref: cardCheckboxOptionsRef, children: options.map((cardCheckboxItemProps) => (_jsx(CardCheckboxItemComponent, { id: `${cardCheckboxId}-${cardCheckboxItemProps.value}`, required: required, onChange: handleChange, ...inputProps, ...cardCheckboxItemProps, type: type, "aria-invalid": error ? true : undefined, "aria-errormessage": error ? errorId : undefined, name: name }, `${name ?? cardCheckboxId}-${cardCheckboxItemProps.label}`))) }), _jsx(ItemMessageComponent, { id: errorId, message: error, messageType: "error" })] }));
+                ].join(" "), ref: cardCheckboxOptionsRef, children: options.map((cardCheckboxItemProps) => (_jsx(CardCheckboxItemComponent, { id: `${cardCheckboxId}-${cardCheckboxItemProps.value}`, required: required, onChange: handleChange, ...inputProps, ...cardCheckboxItemProps, type: type, "aria-invalid": hasError || undefined, "aria-errormessage": hasError ? messageId : undefined, name: name }, `${name ?? cardCheckboxId}-${cardCheckboxItemProps.label}`))) }), _jsx(ItemMessageComponent, { id: messageId, message: message || error, messageType: messageType || "error" })] }));
 };
 CardCheckboxCommon.displayName = "CardCheckboxCommon";

package/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.d.ts

@@ -12,4 +12,5 @@ export type CardCheckboxOptionCommonProps = CardCheckboxOptionProps & {
     CheckboxComponent: ComponentType<CheckboxProps>;
     IconComponent: ComponentType<IconProps>;
 };
-export declare const CardCheckboxOptionCommon: import("react").ForwardRefExoticComponent<Omit<CardCheckboxOptionCommonProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+declare const CardCheckboxOptionCommon: import("react").ForwardRefExoticComponent<Omit<CardCheckboxOptionCommonProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+export { CardCheckboxOptionCommon };

package/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.js

@@ -1,12 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
-export const CardCheckboxOptionCommon = forwardRef(({ label, type = "vertical", description, subtitle, icon, className, CheckboxComponent, IconComponent, ...inputProps }, ref) => {
-    return (_jsxs("label", { className: [
-            "af-card-checkbox-option",
-            type === "horizontal" && "af-card-checkbox-option--horizontal",
-            className,
-        ]
-            .filter(Boolean)
-            .join(" "), children: [icon ? _jsx(IconComponent, { src: icon, role: "presentation" }) : null, _jsxs("div", { className: "af-card-checkbox-option__content", children: [_jsx("p", { className: "af-card-checkbox-option__label", children: label }), Boolean(description) && (_jsx("p", { className: "af-card-checkbox-option__description", children: description })), Boolean(subtitle) && (_jsx("p", { className: "af-card-checkbox-option__subtitle", children: subtitle }))] }), _jsx(CheckboxComponent, { ...inputProps, ref: ref })] }));
-});
+const CardCheckboxOptionCommon = forwardRef(({ label, type = "vertical", description, subtitle, icon, className, CheckboxComponent, IconComponent, ...inputProps }, ref) => (_jsxs("label", { className: [
+        "af-card-checkbox-option",
+        type === "horizontal" && "af-card-checkbox-option--horizontal",
+        className,
+    ]
+        .filter(Boolean)
+        .join(" "), children: [icon ? _jsx(IconComponent, { src: icon, role: "presentation" }) : null, _jsxs("div", { className: "af-card-checkbox-option__content", children: [_jsx("p", { className: "af-card-checkbox-option__label", children: label }), Boolean(description) && (_jsx("p", { className: "af-card-checkbox-option__description", children: description })), Boolean(subtitle) && (_jsx("p", { className: "af-card-checkbox-option__subtitle", children: subtitle }))] }), _jsx(CheckboxComponent, { ...inputProps, ref: ref })] })));
 CardCheckboxOptionCommon.displayName = "CardCheckboxOptionCommon";
+export { CardCheckboxOptionCommon };

package/dist/Form/Checkbox/CheckboxText/CheckboxTextApollo.d.ts

@@ -1,3 +1,4 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CheckboxText/CheckboxTextApollo.scss";
 import { type CheckboxTextProps } from "./CheckboxTextCommon";
-export declare const CheckboxText: import("react").ForwardRefExoticComponent<Omit<CheckboxTextProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+declare const CheckboxText: import("react").ForwardRefExoticComponent<Omit<CheckboxTextProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+export { CheckboxText };

package/dist/Form/Checkbox/CheckboxText/CheckboxTextApollo.js

@@ -4,5 +4,6 @@ import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CheckboxText/Checkbo
 import { ItemMessage } from "../../ItemMessage/ItemMessageApollo";
 import { Checkbox } from "../Checkbox/CheckboxApollo";
 import { CheckboxTextCommon, } from "./CheckboxTextCommon";
-export const CheckboxText = forwardRef((props, ref) => (_jsx(CheckboxTextCommon, { ...props, ref: ref, CheckboxComponent: Checkbox, ItemMessageComponent: ItemMessage })));
+const CheckboxText = forwardRef((props, ref) => (_jsx(CheckboxTextCommon, { ...props, ref: ref, CheckboxComponent: Checkbox, ItemMessageComponent: ItemMessage })));
 CheckboxText.displayName = "CheckboxText";
+export { CheckboxText };

package/dist/Form/Checkbox/CheckboxText/CheckboxTextCommon.d.ts

@@ -3,10 +3,14 @@ import type { ItemMessageProps } from "../../ItemMessage/ItemMessageCommon";
 import type { CheckboxProps } from "../Checkbox/CheckboxCommon";
 export type CheckboxTextProps = {
     label: string | ReactNode;
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
     errorMessage?: string;
-} & Omit<CheckboxProps, "aria-errormessage" | "aria-invalid">;
+} & Omit<CheckboxProps, "aria-errormessage" | "aria-invalid"> & Partial<ItemMessageProps>;
 export type CheckboxTextCommonProps = CheckboxTextProps & {
     CheckboxComponent: ComponentType<Omit<CheckboxProps, "checkBoxIcon">>;
     ItemMessageComponent: ComponentType<ItemMessageProps>;
 };
-export declare const CheckboxTextCommon: import("react").ForwardRefExoticComponent<Omit<CheckboxTextCommonProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+declare const CheckboxTextCommon: import("react").ForwardRefExoticComponent<Omit<CheckboxTextCommonProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+export { CheckboxTextCommon };

package/dist/Form/Checkbox/CheckboxText/CheckboxTextCommon.js

@@ -1,9 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useId, forwardRef } from "react";
-export const CheckboxTextCommon = forwardRef(({ label, errorMessage, id, CheckboxComponent, ItemMessageComponent, ...inputProps }, ref) => {
+const CheckboxTextCommon = forwardRef(({ label, errorMessage, id, message, messageType, CheckboxComponent, ItemMessageComponent, ...inputProps }, ref) => {
     const generatedId = useId();
     const inputId = id ?? generatedId;
-    const errorId = `${inputId}-error`;
-    return (_jsxs("div", { className: "af-checkbox-text", children: [_jsxs("label", { htmlFor: inputId, children: [_jsx(CheckboxComponent, { id: inputId, ...inputProps, "aria-errormessage": errorMessage ? errorId : undefined, "aria-invalid": errorMessage ? true : undefined, ref: ref }), _jsx("span", { className: "af-checkbox-text__label-content", children: label })] }), _jsx(ItemMessageComponent, { message: errorMessage, id: errorId })] }));
+    const messageId = `${inputId}-error`;
+    const hasError = (Boolean(message) && messageType === "error") || Boolean(errorMessage);
+    return (_jsxs("div", { className: "af-checkbox-text", children: [_jsxs("label", { htmlFor: inputId, children: [_jsx(CheckboxComponent, { id: inputId, ...inputProps, "aria-errormessage": hasError ? messageId : undefined, "aria-invalid": hasError || undefined, ref: ref }), _jsx("span", { className: "af-checkbox-text__label-content", children: label })] }), _jsx(ItemMessageComponent, { message: message || errorMessage, id: messageId, messageType: messageType })] }));
 });
 CheckboxTextCommon.displayName = "CheckboxTextCommon";
+export { CheckboxTextCommon };

package/dist/Form/Checkbox/CheckboxText/CheckboxTextLF.d.ts

@@ -1,3 +1,4 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CheckboxText/CheckboxTextLF.scss";
-import { CheckboxTextProps } from "./CheckboxTextCommon";
-export declare const CheckboxText: import("react").ForwardRefExoticComponent<Omit<CheckboxTextProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+import { type CheckboxTextProps } from "./CheckboxTextCommon";
+declare const CheckboxText: import("react").ForwardRefExoticComponent<Omit<CheckboxTextProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+export { CheckboxText };

package/dist/Form/Checkbox/CheckboxText/CheckboxTextLF.js

@@ -3,6 +3,7 @@ import { forwardRef } from "react";
 import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CheckboxText/CheckboxTextLF.scss";
 import { ItemMessage } from "../../ItemMessage/ItemMessageLF";
 import { Checkbox } from "../Checkbox/CheckboxLF";
-import { CheckboxTextCommon } from "./CheckboxTextCommon";
-export const CheckboxText = forwardRef((props, ref) => (_jsx(CheckboxTextCommon, { ...props, ref: ref, CheckboxComponent: Checkbox, ItemMessageComponent: ItemMessage })));
+import { CheckboxTextCommon, } from "./CheckboxTextCommon";
+const CheckboxText = forwardRef((props, ref) => (_jsx(CheckboxTextCommon, { ...props, ref: ref, CheckboxComponent: Checkbox, ItemMessageComponent: ItemMessage })));
 CheckboxText.displayName = "CheckboxText";
+export { CheckboxText };

package/dist/Form/Dropdown/DropdownApollo.d.ts

@@ -1,4 +1,3 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/Dropdown/DropdownApollo.scss";
-import type { ComponentProps } from "react";
-import { Dropdown as DropdownCommon } from "./DropdownCommon";
-export declare const Dropdown: (props: Omit<ComponentProps<typeof DropdownCommon>, "ItemLabelComponent" | "ItemMessageComponent">) => import("react/jsx-runtime").JSX.Element;
+import { type DropdownProps } from "./DropdownCommon";
+export declare const Dropdown: (props: DropdownProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Form/Dropdown/DropdownApollo.js

@@ -2,5 +2,5 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import "@axa-fr/design-system-apollo-css/dist/Form/Dropdown/DropdownApollo.scss";
 import { ItemLabel } from "../ItemLabel/ItemLabelApollo";
 import { ItemMessage } from "../ItemMessage/ItemMessageApollo";
-import { Dropdown as DropdownCommon } from "./DropdownCommon";
+import { DropdownCommon } from "./DropdownCommon";
 export const Dropdown = (props) => (_jsx(DropdownCommon, { ...props, ItemLabelComponent: ItemLabel, ItemMessageComponent: ItemMessage }));

package/dist/Form/Dropdown/DropdownCommon.d.ts

@@ -1,18 +1,26 @@
 import { type ComponentProps, type ComponentPropsWithRef, type ComponentType } from "react";
-import { ItemLabel } from "../ItemLabel/ItemLabelCommon";
-import { ItemMessage } from "../ItemMessage/ItemMessageCommon";
-type DropdownProps = ComponentPropsWithRef<"select"> & {
+import { ItemLabelCommon, type ItemLabelProps } from "../ItemLabel/ItemLabelCommon";
+import { ItemMessage, type ItemMessageProps } from "../ItemMessage/ItemMessageCommon";
+export type DropdownProps = ComponentPropsWithRef<"select"> & {
     id?: string;
     classModifier?: string;
-    label?: ComponentProps<typeof ItemLabel>["label"];
+    label?: ItemLabelProps["label"];
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
     error?: string;
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
     success?: string;
     placeholder?: string;
     buttonLabel?: string;
     description?: string;
     helper?: string;
-    ItemLabelComponent: ComponentType<Omit<ComponentProps<typeof ItemLabel>, "ButtonComponent">>;
+} & Partial<ItemLabelProps & ItemMessageProps>;
+type DropdownCommonProps = DropdownProps & {
+    ItemLabelComponent: ComponentType<Omit<ComponentProps<typeof ItemLabelCommon>, "ButtonComponent">>;
     ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
-} & Partial<ComponentPropsWithRef<typeof ItemLabel>>;
-declare const Dropdown: import("react").ForwardRefExoticComponent<Omit<DropdownProps, "ref"> & import("react").RefAttributes<HTMLSelectElement>>;
-export { Dropdown };
+};
+declare const DropdownCommon: import("react").ForwardRefExoticComponent<Omit<DropdownCommonProps, "ref"> & import("react").RefAttributes<HTMLSelectElement>>;
+export { DropdownCommon };

package/dist/Form/Dropdown/DropdownCommon.js

@@ -1,12 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useId, } from "react";
 import classNames from "classnames";
-const Dropdown = forwardRef(({ id, required, label, error, placeholder, children, helper, success, description, buttonLabel, onButtonClick, sideButtonLabel, onSideButtonClick, ItemLabelComponent, ItemMessageComponent, ...otherProps }, inputRef) => {
+const DropdownCommon = forwardRef(({ id, required, label, error, placeholder, children, helper, success, message, messageType, description, buttonLabel, onButtonClick, sideButtonLabel, onSideButtonClick, ItemLabelComponent, ItemMessageComponent, ...otherProps }, inputRef) => {
     const idMessage = useId();
     let inputId = useId();
     inputId = id || inputId;
-    const classname = classNames("af-form__dropdown-input", error && "af-form__dropdown-input--error");
-    return (_jsxs("div", { className: "af-form__dropdown-container", children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, inputId: inputId }), _jsxs("select", { className: classname, ...otherProps, ref: inputRef, id: inputId, children: [Boolean(placeholder) && _jsx("option", { value: "", children: placeholder }), children] }), helper ? (_jsx("span", { className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: idMessage, message: error || success, messageType: error ? "error" : "success" })] }));
+    const hasError = (Boolean(message) && messageType === "error") || Boolean(error);
+    const classname = classNames("af-form__dropdown-input", hasError && "af-form__dropdown-input--error");
+    return (_jsxs("div", { className: "af-form__dropdown-container", children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, inputId: inputId }), _jsxs("select", { className: classname, ...otherProps, ref: inputRef, id: inputId, children: [Boolean(placeholder) && _jsx("option", { value: "", children: placeholder }), children] }), helper ? (_jsx("span", { className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: idMessage, message: message || error || success, messageType: messageType || (error ? "error" : "success") })] }));
 });
-Dropdown.displayName = "Dropdown";
-export { Dropdown };
+DropdownCommon.displayName = "Dropdown";
+export { DropdownCommon };

package/dist/Form/Dropdown/DropdownLF.d.ts

@@ -1,4 +1,3 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/Dropdown/DropdownLF.scss";
-import type { ComponentProps } from "react";
-import { Dropdown as DropdownCommon } from "./DropdownCommon";
-export declare const Dropdown: (props: Omit<ComponentProps<typeof DropdownCommon>, "ItemLabelComponent" | "ItemMessageComponent">) => import("react/jsx-runtime").JSX.Element;
+import { type DropdownProps } from "./DropdownCommon";
+export declare const Dropdown: (props: DropdownProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Form/Dropdown/DropdownLF.js

@@ -2,5 +2,5 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import "@axa-fr/design-system-apollo-css/dist/Form/Dropdown/DropdownLF.scss";
 import { ItemLabel } from "../ItemLabel/ItemLabelLF";
 import { ItemMessage } from "../ItemMessage/ItemMessageLF";
-import { Dropdown as DropdownCommon } from "./DropdownCommon";
+import { DropdownCommon } from "./DropdownCommon";
 export const Dropdown = (props) => (_jsx(DropdownCommon, { ...props, ItemLabelComponent: ItemLabel, ItemMessageComponent: ItemMessage }));

package/dist/Form/InputDate/InputDateApollo.d.ts

@@ -1,27 +1,3 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/InputDate/InputDateApollo.scss";
-import { type ComponentProps } from "react";
-import { ItemMessage } from "../ItemMessage/ItemMessageApollo";
-export declare const InputDate: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "max" | "min" | "value"> & {
-    classModifier?: string;
-    defaultValue?: Date | string;
-    value?: Date | string;
-    min?: Date | string;
-    max?: Date | string;
-    helper?: string;
-    error?: string;
-    success?: string;
-    hidePicker?: boolean;
-    label: ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>["label"];
-    ItemLabelComponent: import("react").ComponentType<Omit<ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>, "ButtonComponent">>;
-    ItemMessageComponent: import("react").ComponentType<ComponentProps<typeof ItemMessage>>;
-} & Partial<{
-    label?: import("react").ReactNode;
-    description?: string;
-    required?: boolean;
-    inputId: string;
-    sideButtonLabel?: string;
-    onSideButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-    buttonLabel?: string;
-    onButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-    ButtonComponent: import("react").ComponentType<import("../../Button/ButtonCommon").ButtonProps>;
-}>, "ref"> & import("react").RefAttributes<HTMLInputElement>, "ItemMessageComponent" | "ItemLabelComponent">, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+import { type InputDateProps } from "./InputDateCommon";
+export declare const InputDate: import("react").ForwardRefExoticComponent<Omit<InputDateProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/Form/InputDate/InputDateApollo.js

@@ -3,6 +3,6 @@ import "@axa-fr/design-system-apollo-css/dist/Form/InputDate/InputDateApollo.scs
 import { forwardRef } from "react";
 import { ItemLabel } from "../ItemLabel/ItemLabelApollo";
 import { ItemMessage } from "../ItemMessage/ItemMessageApollo";
-import { InputDate as InputDateCommon } from "./InputDateCommon";
+import { InputDateCommon } from "./InputDateCommon";
 export const InputDate = forwardRef((props, ref) => (_jsx(InputDateCommon, { ...props, ref: ref, ItemLabelComponent: ItemLabel, ItemMessageComponent: ItemMessage })));
 InputDate.displayName = "InputDate";

package/dist/Form/InputDate/InputDateCommon.d.ts

@@ -1,19 +1,27 @@
 import { ComponentProps, ComponentPropsWithRef, ComponentType } from "react";
-import { ItemLabel } from "../ItemLabel/ItemLabelCommon";
-import { ItemMessage } from "../ItemMessage/ItemMessageCommon";
-type InputDateProps = Omit<ComponentPropsWithRef<"input">, "value" | "min" | "max"> & {
+import { ItemLabelCommon, type ItemLabelProps } from "../ItemLabel/ItemLabelCommon";
+import { ItemMessage, type ItemMessageProps } from "../ItemMessage/ItemMessageCommon";
+export type InputDateProps = Omit<ComponentPropsWithRef<"input">, "value" | "min" | "max"> & {
     classModifier?: string;
     defaultValue?: Date | string;
     value?: Date | string;
     min?: Date | string;
     max?: Date | string;
     helper?: string;
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
     error?: string;
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
     success?: string;
     hidePicker?: boolean;
-    label: ComponentProps<typeof ItemLabel>["label"];
-    ItemLabelComponent: ComponentType<Omit<ComponentProps<typeof ItemLabel>, "ButtonComponent">>;
+    label: ItemLabelProps["label"];
+} & Partial<ItemLabelProps & ItemMessageProps>;
+type InputDateCommonProps = InputDateProps & {
+    ItemLabelComponent: ComponentType<Omit<ComponentProps<typeof ItemLabelCommon>, "ButtonComponent">>;
     ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
-} & Partial<ComponentPropsWithRef<typeof ItemLabel>>;
-declare const InputDate: import("react").ForwardRefExoticComponent<Omit<InputDateProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
-export { InputDate };
+};
+declare const InputDateCommon: import("react").ForwardRefExoticComponent<Omit<InputDateCommonProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+export { InputDateCommon };

package/dist/Form/InputDate/InputDateCommon.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useEffect, useId, } from "react";
 import { getComponentClassName } from "../../utilities/getComponentClassName";
 import { formatInputDateValue } from "./InputDate.helper";
-const InputDate = forwardRef(({ className, classModifier = "", defaultValue, value, helper, error, success, label, description, buttonLabel, onButtonClick, ItemLabelComponent, ItemMessageComponent, required, "aria-errormessage": ariaErrormessage, min, max, hidePicker, ...otherProps }, inputRef) => {
+const InputDateCommon = forwardRef(({ className, classModifier = "", defaultValue, value, helper, error, success, message, messageType, label, description, buttonLabel, onButtonClick, ItemLabelComponent, ItemMessageComponent, required, min, max, hidePicker, ...otherProps }, inputRef) => {
     const componentClassName = getComponentClassName("af-form__input-date", className ?? "", `${classModifier}${hidePicker ? " no-picker" : ""}`);
     let inputId = useId();
     inputId = otherProps.id ?? inputId;
@@ -28,7 +28,8 @@ const InputDate = forwardRef(({ className, classModifier = "", defaultValue, val
             window.removeEventListener("click", handleClick);
         };
     }, [hidePicker]);
-    return (_jsxs("div", { className: "af-form__input-container", children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, required: required, inputId: inputId }), _jsx("input", { ...otherProps, id: inputId, className: componentClassName, type: "date", ref: inputRef, defaultValue: formatInputDateValue(defaultValue), value: formatInputDateValue(value), "aria-errormessage": ariaErrormessage ?? (error ? idMessage : undefined), "aria-invalid": Boolean(error ?? ariaErrormessage), "aria-describedby": ariaDescribedby.length > 0 ? ariaDescribedby.join(" ") : undefined, required: required, min: formatInputDateValue(min), max: formatInputDateValue(max) }), helper ? (_jsx("span", { id: idHelp, className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: idMessage, message: error || success, messageType: error ? "error" : "success" })] }));
+    const hasError = (Boolean(message) && messageType === "error") || Boolean(error);
+    return (_jsxs("div", { className: "af-form__input-container", children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, required: required, inputId: inputId }), _jsx("input", { ...otherProps, id: inputId, className: componentClassName, type: "date", ref: inputRef, defaultValue: formatInputDateValue(defaultValue), value: formatInputDateValue(value), "aria-errormessage": hasError ? idMessage : undefined, "aria-invalid": hasError || undefined, "aria-describedby": ariaDescribedby.length > 0 ? ariaDescribedby.join(" ") : undefined, required: required, min: formatInputDateValue(min), max: formatInputDateValue(max) }), helper ? (_jsx("span", { id: idHelp, className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: idMessage, message: message || error || success, messageType: messageType || (error ? "error" : "success") })] }));
 });
-InputDate.displayName = "InputDate";
-export { InputDate };
+InputDateCommon.displayName = "InputDate";
+export { InputDateCommon };

package/dist/Form/InputDate/InputDateLF.d.ts

@@ -1,27 +1,3 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/InputDate/InputDateLF.scss";
-import { ComponentProps } from "react";
-import { ItemMessage } from "../ItemMessage/ItemMessageLF";
-export declare const InputDate: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "max" | "min" | "value"> & {
-    classModifier?: string;
-    defaultValue?: Date | string;
-    value?: Date | string;
-    min?: Date | string;
-    max?: Date | string;
-    helper?: string;
-    error?: string;
-    success?: string;
-    hidePicker?: boolean;
-    label: ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>["label"];
-    ItemLabelComponent: import("react").ComponentType<Omit<ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>, "ButtonComponent">>;
-    ItemMessageComponent: import("react").ComponentType<ComponentProps<typeof ItemMessage>>;
-} & Partial<{
-    label?: import("react").ReactNode;
-    description?: string;
-    required?: boolean;
-    inputId: string;
-    sideButtonLabel?: string;
-    onSideButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-    buttonLabel?: string;
-    onButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-    ButtonComponent: import("react").ComponentType<import("../../Button/ButtonCommon").ButtonProps>;
-}>, "ref"> & import("react").RefAttributes<HTMLInputElement>, "ItemMessageComponent" | "ItemLabelComponent">, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+import { type InputDateProps } from "./InputDateCommon";
+export declare const InputDate: import("react").ForwardRefExoticComponent<Omit<InputDateProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/Form/InputDate/InputDateLF.js

@@ -3,6 +3,6 @@ import "@axa-fr/design-system-apollo-css/dist/Form/InputDate/InputDateLF.scss";
 import { forwardRef } from "react";
 import { ItemLabel } from "../ItemLabel/ItemLabelLF";
 import { ItemMessage } from "../ItemMessage/ItemMessageLF";
-import { InputDate as InputDateCommon } from "./InputDateCommon";
+import { InputDateCommon } from "./InputDateCommon";
 export const InputDate = forwardRef((props, ref) => (_jsx(InputDateCommon, { ...props, ref: ref, ItemLabelComponent: ItemLabel, ItemMessageComponent: ItemMessage })));
 InputDate.displayName = "InputDate";

package/dist/Form/InputPhone/InputPhoneApollo.d.ts

@@ -1,3 +1,3 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/InputPhone/InputPhoneApollo.scss";
-import { InputPhoneProps } from "./InputPhoneCommon";
+import { type InputPhoneProps } from "./InputPhoneCommon";
 export declare const InputPhone: (props: InputPhoneProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Form/InputPhone/InputPhoneCommon.d.ts

@@ -1,14 +1,20 @@
 import { type ComponentProps, type ComponentPropsWithRef, type ComponentType } from "react";
 import { SingleValue } from "react-select";
-import { ItemLabel } from "../ItemLabel/ItemLabelCommon";
-import { ItemMessage } from "../ItemMessage/ItemMessageCommon";
+import { ItemLabelCommon, type ItemLabelProps } from "../ItemLabel/ItemLabelCommon";
+import { ItemMessage, type ItemMessageProps } from "../ItemMessage/ItemMessageCommon";
 import { InputTextAtom } from "../InputTextAtom/InputTextAtomCommon";
 import { Icon } from "../../Icon/IconCommon";
 import { type OptionType } from "./InputPhone.types";
 export type InputPhoneProps = ComponentPropsWithRef<"input"> & {
     classModifier?: string;
     helper?: string;
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
     error?: string;
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
     success?: string;
     defaultCountry?: string;
     showSelect?: boolean;
@@ -17,10 +23,10 @@ export type InputPhoneProps = ComponentPropsWithRef<"input"> & {
     onChangeSelect?: (value: SingleValue<OptionType>) => void;
     onChangeInput?: (value: string) => void;
     mask?: (value: string) => string;
-    label: ComponentProps<typeof ItemLabel>["label"];
-} & Partial<ComponentPropsWithRef<typeof ItemLabel>>;
+    label: ItemLabelProps["label"];
+} & Partial<ItemLabelProps & ItemMessageProps>;
 type InputPhoneCommonProps = InputPhoneProps & {
-    ItemLabelComponent: ComponentType<Omit<ComponentProps<typeof ItemLabel>, "ButtonComponent">>;
+    ItemLabelComponent: ComponentType<Omit<ComponentProps<typeof ItemLabelCommon>, "ButtonComponent">>;
     ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
     InputTextComponent: ComponentType<ComponentProps<typeof InputTextAtom>>;
     IconComponent: ComponentType<ComponentProps<typeof Icon>>;

package/dist/Form/InputPhone/InputPhoneCommon.js

@@ -1,15 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useId, } from "react";
-import { getComponentClassName } from "../../utilities/getComponentClassName";
 import { CountryCodeSelect } from "./CountryCodeSelect";
 import { maskFrenchPhoneNumber } from "./maskFrenchPhoneNumber";
-const InputPhoneCommon = forwardRef(({ className, classModifier = "", helper, error, success, defaultCountry, showSelect, disabled, label, description, buttonLabel, onButtonClick, required, sideButtonLabel, onSideButtonClick, countryCodeOptions = [], onChangeSelect, onChangeInput, mask = maskFrenchPhoneNumber, ItemLabelComponent, ItemMessageComponent, InputTextComponent, IconComponent, "aria-errormessage": ariaErrormessage, ...otherProps }, inputRef) => {
-    const componentClassName = getComponentClassName("af-form__input-phone", className, classModifier + (error || ariaErrormessage ? " error" : ""));
+const InputPhoneCommon = forwardRef(({ className, classModifier = "", helper, error, success, message, messageType, defaultCountry, showSelect, disabled, label, description, buttonLabel, onButtonClick, required, sideButtonLabel, onSideButtonClick, countryCodeOptions = [], onChangeSelect, onChangeInput, mask = maskFrenchPhoneNumber, ItemLabelComponent, ItemMessageComponent, InputTextComponent, IconComponent, "aria-errormessage": ariaErrormessage, ...otherProps }, inputRef) => {
     let inputId = useId();
     inputId = otherProps.id || inputId;
     const idMessage = useId();
     const idHelp = useId();
     const ariaDescribedby = [helper && idHelp, success && idMessage].filter(Boolean);
+    const hasError = (Boolean(message) && messageType === "error") || Boolean(error);
     /**
      * Gère le changement de valeur du champ numéro de téléphone.
      * - Récupère une fonction de masquage (mask) depuis les props ou utilise une version par défaut.
@@ -25,7 +24,9 @@ const InputPhoneCommon = forwardRef(({ className, classModifier = "", helper, er
         const maskedValue = mask(rawValue);
         onChangeInput?.(maskedValue);
     };
-    return (_jsxs("div", { className: "af-form__input-phone-container", children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, inputId: inputId }), _jsxs("div", { className: "af-form__input-phone-fields", children: [showSelect ? (_jsx("div", { className: "af-form__country-code-wrapper", children: _jsx(CountryCodeSelect, { options: countryCodeOptions, defaultCountry: defaultCountry, onChangeSelect: onChangeSelect, IconComponent: IconComponent, disabled: disabled }) })) : null, _jsx(InputTextComponent, { ...otherProps, className: componentClassName, ref: inputRef, error: error, type: "tel", required: required, placeholder: otherProps.placeholder, "aria-errormessage": ariaErrormessage, value: otherProps.value, onChange: handleChangeNumber, disabled: disabled, idMessage: error ? idMessage : undefined, idHelp: ariaDescribedby.length > 0 ? ariaDescribedby.join(" ") : undefined, id: inputId })] }), helper ? (_jsx("span", { id: idHelp, className: "af-form__input-phone-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: idMessage, message: error || success, messageType: error ? "error" : "success" })] }));
+    return (_jsxs("div", { className: "af-form__input-phone-container", children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, inputId: inputId }), _jsxs("div", { className: "af-form__input-phone-fields", children: [showSelect ? (_jsx("div", { className: "af-form__country-code-wrapper", children: _jsx(CountryCodeSelect, { options: countryCodeOptions, defaultCountry: defaultCountry, onChangeSelect: onChangeSelect, IconComponent: IconComponent, disabled: disabled }) })) : null, _jsx(InputTextComponent, { ...otherProps, className: ["af-form__input-phone", className]
+                            .filter(Boolean)
+                            .join(" "), classModifier: classModifier, ref: inputRef, error: hasError ? messageType || error : undefined, type: "tel", required: required, placeholder: otherProps.placeholder, "aria-errormessage": ariaErrormessage, value: otherProps.value, onChange: handleChangeNumber, disabled: disabled, idMessage: hasError ? idMessage : undefined, idHelp: ariaDescribedby.length > 0 ? ariaDescribedby.join(" ") : undefined, id: inputId })] }), helper ? (_jsx("span", { id: idHelp, className: "af-form__input-phone-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: idMessage, message: message || error || success, messageType: messageType || (error ? "error" : "success") })] }));
 });
 InputPhoneCommon.displayName = "InputPhone";
 export { InputPhoneCommon };

package/dist/Form/InputPhone/InputPhoneLF.d.ts

@@ -1,3 +1,3 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/InputPhone/InputPhoneLF.scss";
-import { InputPhoneProps } from "./InputPhoneCommon";
+import { type InputPhoneProps } from "./InputPhoneCommon";
 export declare const InputPhone: (props: InputPhoneProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Form/InputText/InputTextApollo.d.ts

@@ -1,25 +1,3 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/InputText/InputTextApollo.scss";
-import { type ComponentProps } from "react";
-import { ItemMessage } from "../ItemMessage/ItemMessageApollo";
-import { InputTextAtom } from "../InputTextAtom/InputTextAtomApollo";
-export declare const InputText: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement> & {
-    unit?: import("react").ReactNode;
-    classModifier?: string;
-    helper?: string;
-    error?: string;
-    success?: string;
-    label: ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>["label"];
-    ItemLabelComponent: import("react").ComponentType<Omit<ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>, "ButtonComponent">>;
-    ItemMessageComponent: import("react").ComponentType<ComponentProps<typeof ItemMessage>>;
-    InputTextAtomComponent: import("react").ComponentType<ComponentProps<typeof InputTextAtom>>;
-} & Partial<{
-    label?: import("react").ReactNode;
-    description?: string;
-    required?: boolean;
-    inputId: string;
-    sideButtonLabel?: string;
-    onSideButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-    buttonLabel?: string;
-    onButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-    ButtonComponent: import("react").ComponentType<import("../../Button/ButtonCommon").ButtonProps>;
-}>, "ref"> & import("react").RefAttributes<HTMLInputElement>, "ItemMessageComponent" | "ItemLabelComponent" | "InputTextAtomComponent">, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+import { type InputTextProps } from "./InputTextCommon";
+export declare const InputText: import("react").ForwardRefExoticComponent<Omit<InputTextProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/Form/InputText/InputTextApollo.js

@@ -3,7 +3,7 @@ import "@axa-fr/design-system-apollo-css/dist/Form/InputText/InputTextApollo.scs
 import { forwardRef } from "react";
 import { ItemLabel } from "../ItemLabel/ItemLabelApollo";
 import { ItemMessage } from "../ItemMessage/ItemMessageApollo";
-import { InputText as InputTextCommon } from "./InputTextCommon";
+import { InputTextCommon } from "./InputTextCommon";
 import { InputTextAtom } from "../InputTextAtom/InputTextAtomApollo";
 export const InputText = forwardRef((props, ref) => (_jsx(InputTextCommon, { ...props, ref: ref, ItemLabelComponent: ItemLabel, ItemMessageComponent: ItemMessage, InputTextAtomComponent: InputTextAtom })));
 InputText.displayName = "InputText";

package/dist/Form/InputText/InputTextCommon.d.ts

@@ -1,17 +1,24 @@
 import { type ComponentProps, type ComponentPropsWithRef, type ComponentType, type ReactNode } from "react";
 import { InputTextAtom } from "../InputTextAtom/InputTextAtomCommon";
-import { ItemLabel } from "../ItemLabel/ItemLabelCommon";
-import { ItemMessage } from "../ItemMessage/ItemMessageCommon";
-type InputTextProps = ComponentPropsWithRef<"input"> & {
+import { ItemLabelCommon, type ItemLabelProps } from "../ItemLabel/ItemLabelCommon";
+import { ItemMessage, type ItemMessageProps } from "../ItemMessage/ItemMessageCommon";
+export type InputTextProps = ComponentPropsWithRef<"input"> & {
     unit?: ReactNode;
     classModifier?: string;
     helper?: string;
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
     error?: string;
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
     success?: string;
-    label: ComponentProps<typeof ItemLabel>["label"];
-    ItemLabelComponent: ComponentType<Omit<ComponentProps<typeof ItemLabel>, "ButtonComponent">>;
+} & Partial<ItemLabelProps & ItemMessageProps>;
+type InputTextCommonProps = InputTextProps & {
+    ItemLabelComponent: ComponentType<Omit<ComponentProps<typeof ItemLabelCommon>, "ButtonComponent">>;
     ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
     InputTextAtomComponent: ComponentType<ComponentProps<typeof InputTextAtom>>;
-} & Partial<ComponentPropsWithRef<typeof ItemLabel>>;
-declare const InputText: import("react").ForwardRefExoticComponent<Omit<InputTextProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
-export { InputText };
+};
+declare const InputTextCommon: import("react").ForwardRefExoticComponent<Omit<InputTextCommonProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+export { InputTextCommon };

package/dist/Form/InputText/InputTextCommon.js

@@ -1,14 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useId, } from "react";
-import { getComponentClassName } from "../../utilities/getComponentClassName";
-const InputText = forwardRef(({ unit, className, classModifier = "", helper, error, success, label, description, buttonLabel, onButtonClick, required, sideButtonLabel, onSideButtonClick, ItemLabelComponent, ItemMessageComponent, InputTextAtomComponent, "aria-errormessage": ariaErrormessage, ...otherProps }, inputRef) => {
-    const componentClassName = getComponentClassName("af-form__input-text", className, classModifier + (error || ariaErrormessage ? " error" : ""));
+const InputTextCommon = forwardRef(({ unit, className, classModifier = "", helper, error, success, message, messageType, label, description, buttonLabel, onButtonClick, required, sideButtonLabel, onSideButtonClick, ItemLabelComponent, ItemMessageComponent, InputTextAtomComponent, ...otherProps }, inputRef) => {
     let inputId = useId();
     inputId = otherProps.id || inputId;
     const idMessage = useId();
     const idHelp = useId();
     const ariaDescribedby = [helper && idHelp, success && idMessage].filter(Boolean);
-    return (_jsxs("div", { className: "af-form__input-container", children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, inputId: inputId }), _jsx(InputTextAtomComponent, { id: inputId, ref: inputRef, unit: unit, className: componentClassName, error: error, required: required, idMessage: error ? idMessage : undefined, idHelp: ariaDescribedby.length > 0 ? ariaDescribedby.join(" ") : undefined, ...otherProps }), helper ? (_jsx("span", { id: idHelp, className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: idMessage, message: error || success, messageType: error ? "error" : "success" })] }));
+    return (_jsxs("div", { className: "af-form__input-container", children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, inputId: inputId }), _jsx(InputTextAtomComponent, { id: inputId, ref: inputRef, unit: unit, className: className, classModifier: classModifier, error: (message && messageType === "error") || Boolean(error)
+                    ? messageType || error
+                    : undefined, required: required, idMessage: message || error ? idMessage : undefined, idHelp: ariaDescribedby.length > 0 ? ariaDescribedby.join(" ") : undefined, ...otherProps }), helper ? (_jsx("span", { id: idHelp, className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: idMessage, message: message || error || success, messageType: messageType || (error ? "error" : "success") })] }));
 });
-InputText.displayName = "InputText";
-export { InputText };
+InputTextCommon.displayName = "InputText";
+export { InputTextCommon };

package/dist/Form/InputText/InputTextLF.d.ts

@@ -1,25 +1,3 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/InputText/InputTextLF.scss";
-import { type ComponentProps } from "react";
-import { ItemMessage } from "../ItemMessage/ItemMessageLF";
-import { InputTextAtom } from "../InputTextAtom/InputTextAtomLF";
-export declare const InputText: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement> & {
-    unit?: import("react").ReactNode;
-    classModifier?: string;
-    helper?: string;
-    error?: string;
-    success?: string;
-    label: ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>["label"];
-    ItemLabelComponent: import("react").ComponentType<Omit<ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>, "ButtonComponent">>;
-    ItemMessageComponent: import("react").ComponentType<ComponentProps<typeof ItemMessage>>;
-    InputTextAtomComponent: import("react").ComponentType<ComponentProps<typeof InputTextAtom>>;
-} & Partial<{
-    label?: import("react").ReactNode;
-    description?: string;
-    required?: boolean;
-    inputId: string;
-    sideButtonLabel?: string;
-    onSideButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-    buttonLabel?: string;
-    onButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-    ButtonComponent: import("react").ComponentType<import("../../Button/ButtonCommon").ButtonProps>;
-}>, "ref"> & import("react").RefAttributes<HTMLInputElement>, "ItemMessageComponent" | "ItemLabelComponent" | "InputTextAtomComponent">, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+import { type InputTextProps } from "./InputTextCommon";
+export declare const InputText: import("react").ForwardRefExoticComponent<Omit<InputTextProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/Form/InputText/InputTextLF.js

@@ -3,7 +3,7 @@ import "@axa-fr/design-system-apollo-css/dist/Form/InputText/InputTextLF.scss";
 import { forwardRef } from "react";
 import { ItemLabel } from "../ItemLabel/ItemLabelLF";
 import { ItemMessage } from "../ItemMessage/ItemMessageLF";
-import { InputText as InputTextCommon } from "./InputTextCommon";
+import { InputTextCommon } from "./InputTextCommon";
 import { InputTextAtom } from "../InputTextAtom/InputTextAtomLF";
 export const InputText = forwardRef((props, ref) => (_jsx(InputTextCommon, { ...props, ref: ref, ItemLabelComponent: ItemLabel, ItemMessageComponent: ItemMessage, InputTextAtomComponent: InputTextAtom })));
 InputText.displayName = "InputText";

package/dist/Form/InputTextAtom/InputTextAtomCommon.js

@@ -1,11 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useId, } from "react";
 import { getComponentClassName } from "../../utilities/getComponentClassName";
-const InputTextAtom = forwardRef(({ unit, className, classModifier = "", error, required, "aria-errormessage": ariaErrormessage, idMessage, idHelp, ...otherProps }, inputRef) => {
+const InputTextAtom = forwardRef(({ unit, className, classModifier = "", error, required, idMessage, idHelp, "aria-errormessage": ariaErrormessage, type = "text", ...otherProps }, inputRef) => {
     const componentClassName = getComponentClassName("af-form__input-text", className, classModifier + (error || ariaErrormessage ? " error" : ""));
     let inputId = useId();
     inputId = otherProps.id || inputId;
-    return (_jsxs("div", { className: "af-form__input-variant", children: [_jsx("input", { id: inputId, className: componentClassName, type: otherProps.type || "text", required: required, ref: inputRef, "aria-errormessage": ariaErrormessage ?? idMessage, "aria-invalid": Boolean(error || ariaErrormessage), "aria-describedby": idHelp, ...otherProps }), unit] }));
+    return (_jsxs("div", { className: "af-form__input-variant", children: [_jsx("input", { id: inputId, className: componentClassName, type: type, required: required, ref: inputRef, "aria-errormessage": ariaErrormessage ?? idMessage, "aria-invalid": Boolean(error || ariaErrormessage), "aria-describedby": idHelp, ...otherProps }), unit] }));
 });
 InputTextAtom.displayName = "InputTextAtom";
 export { InputTextAtom };

package/dist/Form/ItemFile/ItemFileCommon.d.ts

@@ -1,26 +1,34 @@
 import { ReactNode, type ComponentProps, type ComponentPropsWithoutRef, type ComponentType } from "react";
 import type { IconProps } from "../../Icon/IconCommon";
 import { Spinner } from "../../Spinner/SpinnerCommon";
-import { ItemMessage } from "../ItemMessage/ItemMessageCommon";
+import { ItemMessage, type ItemMessageProps } from "../ItemMessage/ItemMessageCommon";
 export declare const itemFileVariants: {
     readonly success: "success";
     readonly error: "error";
     readonly loading: "loading";
 };
 export type ItemFileState = keyof typeof itemFileVariants;
-export type ItemFileCommonProps = {
+export type ItemFileProps = {
     state: ItemFileState;
     ariaLabelVisibility?: string;
     ariaLabelDelete?: string;
     filename?: string;
     title: string;
     subTitle: string;
-    errorMessage?: string;
     deleteIcon: ReactNode;
     visibilityIcon?: ReactNode;
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
+    errorMessage?: string;
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
     success?: string;
+} & Omit<ComponentPropsWithoutRef<"section">, "children"> & Partial<ItemMessageProps>;
+export type ItemFileCommonProps = ItemFileProps & {
     ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
     ItemIconComponent: ComponentType<IconProps>;
     ItemSpinnerComponent: ComponentType<ComponentProps<typeof Spinner>>;
-} & Omit<ComponentPropsWithoutRef<"section">, "children">;
-export declare const ItemFileCommon: ({ className, state, title, subTitle, errorMessage, deleteIcon, visibilityIcon, success, ItemSpinnerComponent, ItemIconComponent, ItemMessageComponent, ...props }: ItemFileCommonProps) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const ItemFileCommon: ({ className, state, title, subTitle, errorMessage, deleteIcon, visibilityIcon, success, message, messageType, ItemSpinnerComponent, ItemIconComponent, ItemMessageComponent, ...props }: ItemFileCommonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Form/ItemFile/ItemFileCommon.js

@@ -6,7 +6,8 @@ export const itemFileVariants = {
     error: "error",
     loading: "loading",
 };
-export const ItemFileCommon = ({ className, state, title, subTitle, errorMessage, deleteIcon, visibilityIcon, success, ItemSpinnerComponent, ItemIconComponent, ItemMessageComponent, ...props }) => {
-    const classname = classNames("af-item-file", errorMessage && "af-item-file--error", className);
-    return (_jsxs("section", { className: classname, ...props, children: [_jsxs("div", { className: "af-item-file__body", children: [_jsx(ItemStateIcon, { state: state, ItemIconComponent: ItemIconComponent, ItemSpinnerComponent: ItemSpinnerComponent }), _jsx("p", { className: "af-item-file__title", children: title }), _jsx("p", { className: "af-item-file__subtitle", children: subTitle }), _jsxs("div", { className: "af-item-file__actions", children: [state === "success" && visibilityIcon, deleteIcon] })] }), _jsx(ItemMessageComponent, { message: errorMessage ?? success, messageType: errorMessage ? "error" : "success" })] }));
+export const ItemFileCommon = ({ className, state, title, subTitle, errorMessage, deleteIcon, visibilityIcon, success, message, messageType, ItemSpinnerComponent, ItemIconComponent, ItemMessageComponent, ...props }) => {
+    const hasError = (Boolean(message) && messageType === "error") || Boolean(errorMessage);
+    const classname = classNames("af-item-file", hasError && "af-item-file--error", className);
+    return (_jsxs("section", { className: classname, ...props, children: [_jsxs("div", { className: "af-item-file__body", children: [_jsx(ItemStateIcon, { state: state, ItemIconComponent: ItemIconComponent, ItemSpinnerComponent: ItemSpinnerComponent }), _jsx("p", { className: "af-item-file__title", children: title }), _jsx("p", { className: "af-item-file__subtitle", children: subTitle }), _jsxs("div", { className: "af-item-file__actions", children: [state === "success" && visibilityIcon, deleteIcon] })] }), _jsx(ItemMessageComponent, { message: message || errorMessage || success, messageType: messageType || (errorMessage ? "error" : "success") })] }));
 };

package/dist/Form/ItemLabel/ItemLabelApollo.d.ts

@@ -1,4 +1,3 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/ItemLabel/ItemLabelApollo.scss";
-import type { ComponentProps } from "react";
-import { ItemLabel as ItemLabelCommon } from "./ItemLabelCommon";
-export declare const ItemLabel: (props: Omit<ComponentProps<typeof ItemLabelCommon>, "ButtonComponent">) => import("react/jsx-runtime").JSX.Element;
+import { type ItemLabelProps } from "./ItemLabelCommon";
+export declare const ItemLabel: (props: ItemLabelProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Form/ItemLabel/ItemLabelApollo.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import "@axa-fr/design-system-apollo-css/dist/Form/ItemLabel/ItemLabelApollo.scss";
 import { Button } from "../../Button/ButtonApollo";
-import { ItemLabel as ItemLabelCommon } from "./ItemLabelCommon";
-export const ItemLabel = (props) => _jsx(ItemLabelCommon, { ...props, ButtonComponent: Button });
+import { ItemLabelCommon } from "./ItemLabelCommon";
+export const ItemLabel = (props) => (_jsx(ItemLabelCommon, { ...props, ButtonComponent: Button }));

package/dist/Form/ItemLabel/ItemLabelCommon.d.ts

@@ -1,6 +1,6 @@
 import { type ComponentType, type MouseEventHandler, type ReactNode } from "react";
 import type { ButtonProps } from "../../Button/ButtonCommon";
-type ItemLabelProps = {
+export type ItemLabelProps = {
     label?: ReactNode;
     description?: string;
     required?: boolean;
@@ -9,7 +9,8 @@ type ItemLabelProps = {
     onSideButtonClick?: MouseEventHandler<HTMLButtonElement>;
     buttonLabel?: string;
     onButtonClick?: MouseEventHandler<HTMLButtonElement>;
+};
+export type ItemLabelCommonProps = ItemLabelProps & {
     ButtonComponent: ComponentType<ButtonProps>;
 };
-export declare const ItemLabel: ({ label, description, required, inputId, sideButtonLabel, onSideButtonClick, buttonLabel, onButtonClick, ButtonComponent, }: ItemLabelProps) => import("react/jsx-runtime").JSX.Element | null;
-export {};
+export declare const ItemLabelCommon: ({ label, description, required, inputId, sideButtonLabel, onSideButtonClick, buttonLabel, onButtonClick, ButtonComponent, }: ItemLabelCommonProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/Form/ItemLabel/ItemLabelCommon.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useId, } from "react";
 import infoIcon from "@material-symbols/svg-400/outlined/info.svg";
 import { Svg } from "../../Svg/Svg";
-export const ItemLabel = ({ label, description, required, inputId, sideButtonLabel, onSideButtonClick, buttonLabel, onButtonClick, ButtonComponent, }) => {
+export const ItemLabelCommon = ({ label, description, required, inputId, sideButtonLabel, onSideButtonClick, buttonLabel, onButtonClick, ButtonComponent, }) => {
     const idDescription = useId();
     if (!label && !description && !buttonLabel && !sideButtonLabel) {
         return null;

package/dist/Form/ItemLabel/ItemLabelLF.d.ts

@@ -1,4 +1,3 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/ItemLabel/ItemLabelLF.scss";
-import type { ComponentProps } from "react";
-import { ItemLabel as ItemLabelCommon } from "./ItemLabelCommon";
-export declare const ItemLabel: (props: Omit<ComponentProps<typeof ItemLabelCommon>, "ButtonComponent">) => import("react/jsx-runtime").JSX.Element;
+import { type ItemLabelProps } from "./ItemLabelCommon";
+export declare const ItemLabel: (props: ItemLabelProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Form/ItemLabel/ItemLabelLF.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import "@axa-fr/design-system-apollo-css/dist/Form/ItemLabel/ItemLabelLF.scss";
 import { Button } from "../../Button/ButtonLF";
-import { ItemLabel as ItemLabelCommon } from "./ItemLabelCommon";
-export const ItemLabel = (props) => _jsx(ItemLabelCommon, { ...props, ButtonComponent: Button });
+import { ItemLabelCommon } from "./ItemLabelCommon";
+export const ItemLabel = (props) => (_jsx(ItemLabelCommon, { ...props, ButtonComponent: Button }));

package/dist/Form/ItemMessage/ItemMessageApollo.d.ts

@@ -1,2 +1,2 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/ItemMessage/ItemMessageApollo.scss";
-export { ItemMessage } from "./ItemMessageCommon";
+export { ItemMessage, itemMessageVariants, type ItemMessageVariants, } from "./ItemMessageCommon";

package/dist/Form/ItemMessage/ItemMessageApollo.js

@@ -1,2 +1,2 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/ItemMessage/ItemMessageApollo.scss";
-export { ItemMessage } from "./ItemMessageCommon";
+export { ItemMessage, itemMessageVariants, } from "./ItemMessageCommon";

package/dist/Form/ItemMessage/ItemMessageCommon.d.ts

@@ -1,7 +1,13 @@
 import type { ReactNode } from "react";
+export declare const itemMessageVariants: {
+    readonly error: "error";
+    readonly success: "success";
+    readonly warning: "warning";
+};
+export type ItemMessageVariants = keyof typeof itemMessageVariants;
 export type ItemMessageProps = {
     message?: ReactNode;
     id?: string;
-    messageType?: "error" | "success" | "warning";
+    messageType?: ItemMessageVariants;
 };
 export declare const ItemMessage: ({ message, id, messageType, }: ItemMessageProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/Form/ItemMessage/ItemMessageCommon.js

@@ -3,6 +3,11 @@ import successIcon from "@material-symbols/svg-400/outlined/check_circle-fill.sv
 import errorIcon from "@material-symbols/svg-400/outlined/error-fill.svg";
 import warningIcon from "@material-symbols/svg-400/outlined/warning-fill.svg";
 import { Svg } from "../../Svg/Svg";
+export const itemMessageVariants = {
+    error: "error",
+    success: "success",
+    warning: "warning",
+};
 export const ItemMessage = ({ message, id, messageType = "error", }) => {
     if (!message) {
         return null;

package/dist/Form/ItemMessage/ItemMessageLF.d.ts

@@ -1,2 +1,2 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/ItemMessage/ItemMessageLF.scss";
-export { ItemMessage } from "./ItemMessageCommon";
+export { ItemMessage, itemMessageVariants, type ItemMessageVariants, } from "./ItemMessageCommon";

package/dist/Form/ItemMessage/ItemMessageLF.js

@@ -1,2 +1,2 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/ItemMessage/ItemMessageLF.scss";
-export { ItemMessage } from "./ItemMessageCommon";
+export { ItemMessage, itemMessageVariants, } from "./ItemMessageCommon";

package/dist/Form/Radio/CardRadio/CardRadioApollo.d.ts

@@ -1,6 +1,7 @@
 import { type CardRadioProps } from "./CardRadioCommon";
 import "@axa-fr/design-system-apollo-css/dist/Form/Radio/CardRadio/CardRadioApollo.scss";
-export declare const CardRadio: {
+declare const CardRadio: {
     (props: CardRadioProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
+export { CardRadio };

package/dist/Form/Radio/CardRadio/CardRadioApollo.js

@@ -3,5 +3,6 @@ import { CardRadioOption } from "../CardRadioOption/CardRadioOptionApollo";
 import { CardRadioCommon } from "./CardRadioCommon";
 import { ItemMessage } from "../../ItemMessage/ItemMessageApollo";
 import "@axa-fr/design-system-apollo-css/dist/Form/Radio/CardRadio/CardRadioApollo.scss";
-export const CardRadio = (props) => (_jsx(CardRadioCommon, { ...props, CardRadioOptionComponent: CardRadioOption, ItemMessageComponent: ItemMessage }));
+const CardRadio = (props) => (_jsx(CardRadioCommon, { ...props, CardRadioOptionComponent: CardRadioOption, ItemMessageComponent: ItemMessage }));
 CardRadio.displayName = "CardRadio";
+export { CardRadio };

package/dist/Form/Radio/CardRadio/CardRadioCommon.d.ts

@@ -1,6 +1,6 @@
 import { type ComponentProps, type ComponentType, type PropsWithChildren, type ReactNode } from "react";
-import { ItemMessage } from "../../ItemMessage/ItemMessageLF";
 import { type CardRadioOptionProps } from "../CardRadioOption/CardRadioOptionCommon";
+import { ItemMessage, type ItemMessageProps } from "../../ItemMessage/ItemMessageCommon";
 type RadioOption = Omit<CardRadioOptionProps, "name" | "type" | "isInvalid">;
 export type CardRadioProps = Omit<CardRadioOptionProps, "value" | "label" | "type" | "isInvalid" | "icon" | "src" | "basePictureProps" | "description" | "subtitle" | "children"> & {
     type?: "vertical" | "horizontal";
@@ -23,14 +23,17 @@ export type CardRadioProps = Omit<CardRadioOptionProps, "value" | "label" | "typ
      */
     value?: number | string;
     options: RadioOption[];
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
     error?: ReactNode;
-} & PropsWithChildren;
+} & PropsWithChildren & Partial<ItemMessageProps>;
 export type CardRadioCommonProps = CardRadioProps & {
     CardRadioOptionComponent: ComponentType<CardRadioOptionProps>;
     ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
 };
-export declare const CardRadioCommon: {
-    ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type, error, name, value, id, CardRadioOptionComponent, ItemMessageComponent, ...inputProps }: CardRadioCommonProps): import("react/jsx-runtime").JSX.Element;
+declare const CardRadioCommon: {
+    ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type, error, message, messageType, name, value, id, CardRadioOptionComponent, ItemMessageComponent, ...inputProps }: CardRadioCommonProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
-export {};
+export { CardRadioCommon };

package/dist/Form/Radio/CardRadio/CardRadioCommon.js

@@ -1,14 +1,16 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useId, } from "react";
-export const CardRadioCommon = ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type = "vertical", error, name, value, id, CardRadioOptionComponent, ItemMessageComponent, ...inputProps }) => {
+const CardRadioCommon = ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type = "vertical", error, message, messageType, name, value, id, CardRadioOptionComponent, ItemMessageComponent, ...inputProps }) => {
     const generatedId = useId();
     const cardRadioId = id ?? generatedId;
-    const errorId = `${cardRadioId}-error`;
-    return (_jsxs("fieldset", { className: ["af-card-radio", className].filter(Boolean).join(" "), role: "radiogroup", "aria-required": required ? true : undefined, "aria-invalid": error ? true : undefined, "aria-errormessage": error ? errorId : undefined, id: cardRadioId, children: [_jsxs("legend", { className: "af-card-radio__legend", children: [_jsxs("p", { className: "af-card-radio__label", children: [label, labelGroup, required || isRequired ? _jsx("span", { "aria-hidden": true, children: "*" }) : null] }), description || descriptionGroup ? (_jsxs("p", { className: "af-card-radio__description", children: [description, descriptionGroup] })) : null] }), _jsx("div", { className: [
+    const messageId = `${cardRadioId}-error`;
+    const hasError = (Boolean(message) && messageType === "error") || Boolean(error);
+    return (_jsxs("fieldset", { className: ["af-card-radio", className].filter(Boolean).join(" "), role: "radiogroup", "aria-required": Boolean(required) || undefined, "aria-invalid": hasError || undefined, "aria-errormessage": hasError ? messageId : undefined, id: cardRadioId, children: [_jsxs("legend", { className: "af-card-radio__legend", children: [_jsxs("p", { className: "af-card-radio__label", children: [label, labelGroup, required || isRequired ? _jsx("span", { "aria-hidden": true, children: "*" }) : null] }), description || descriptionGroup ? (_jsxs("p", { className: "af-card-radio__description", children: [description, descriptionGroup] })) : null] }), _jsx("div", { className: [
                     "af-card-radio__options",
                     `af-card-radio__options--${type}`,
                 ].join(" "), children: options.map((cardRadioItemProps) => (_jsx(CardRadioOptionComponent, { id: `${cardRadioId}-${cardRadioItemProps.value}`, checked: value !== undefined
                         ? value === cardRadioItemProps.value
-                        : undefined, required: required, ...inputProps, ...cardRadioItemProps, type: type, isInvalid: Boolean(error), name: name }, `${name ?? cardRadioId}-${cardRadioItemProps.label}`))) }), _jsx(ItemMessageComponent, { id: errorId, message: error, messageType: "error" })] }));
+                        : undefined, required: required, ...inputProps, ...cardRadioItemProps, type: type, isInvalid: hasError, name: name }, `${name ?? cardRadioId}-${cardRadioItemProps.label}`))) }), _jsx(ItemMessageComponent, { id: messageId, message: message || error, messageType: messageType })] }));
 };
 CardRadioCommon.displayName = "CardRadioCommon";
+export { CardRadioCommon };

package/dist/Form/Radio/CardRadio/CardRadioLF.d.ts

@@ -1,6 +1,7 @@
 import { type CardRadioProps } from "./CardRadioCommon";
 import "@axa-fr/design-system-apollo-css/dist/Form/Radio/CardRadio/CardRadioLF.scss";
-export declare const CardRadio: {
+declare const CardRadio: {
     (props: CardRadioProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
+export { CardRadio };

package/dist/Form/Radio/CardRadio/CardRadioLF.js

@@ -3,5 +3,6 @@ import { CardRadioOption } from "../CardRadioOption/CardRadioOptionLF";
 import { CardRadioCommon } from "./CardRadioCommon";
 import { ItemMessage } from "../../ItemMessage/ItemMessageLF";
 import "@axa-fr/design-system-apollo-css/dist/Form/Radio/CardRadio/CardRadioLF.scss";
-export const CardRadio = (props) => (_jsx(CardRadioCommon, { ...props, CardRadioOptionComponent: CardRadioOption, ItemMessageComponent: ItemMessage }));
+const CardRadio = (props) => (_jsx(CardRadioCommon, { ...props, CardRadioOptionComponent: CardRadioOption, ItemMessageComponent: ItemMessage }));
 CardRadio.displayName = "CardRadio";
+export { CardRadio };

package/dist/Form/TextArea/TextAreaApollo.d.ts

@@ -1,21 +1,3 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/TextArea/TextAreaApollo.scss";
-import { type ComponentProps } from "react";
-import { ItemMessage } from "../ItemMessage/ItemMessageApollo";
-export declare const TextArea: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").ClassAttributes<HTMLTextAreaElement> & import("react").TextareaHTMLAttributes<HTMLTextAreaElement> & Pick<{
-    label?: import("react").ReactNode;
-    description?: string;
-    required?: boolean;
-    inputId: string;
-    sideButtonLabel?: string;
-    onSideButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-    buttonLabel?: string;
-    onButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-    ButtonComponent: import("react").ComponentType<import("../../Button/ButtonCommon").ButtonProps>;
-}, "label" | "description" | "sideButtonLabel" | "onSideButtonClick" | "buttonLabel"> & {
-    classModifier?: string;
-    helper?: string;
-    error?: string;
-    ItemLabelComponent: import("react").ComponentType<Omit<ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>, "ButtonComponent">>;
-    ItemMessageComponent: import("react").ComponentType<ComponentProps<typeof ItemMessage>>;
-    onButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-} & Partial<import("../ItemMessage/ItemMessageCommon").ItemMessageProps>, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>, "ItemMessageComponent" | "ItemLabelComponent">, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>>;
+import { type TextAreaProps } from "./TextAreaCommon";
+export declare const TextArea: import("react").ForwardRefExoticComponent<Omit<TextAreaProps, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>>;

package/dist/Form/TextArea/TextAreaApollo.js

@@ -3,6 +3,6 @@ import "@axa-fr/design-system-apollo-css/dist/Form/TextArea/TextAreaApollo.scss"
 import { forwardRef } from "react";
 import { ItemLabel } from "../ItemLabel/ItemLabelApollo";
 import { ItemMessage } from "../ItemMessage/ItemMessageApollo";
-import { TextArea as TextAreaCommon } from "./TextAreaCommon";
+import { TextAreaCommon } from "./TextAreaCommon";
 export const TextArea = forwardRef((props, ref) => (_jsx(TextAreaCommon, { ...props, ref: ref, ItemLabelComponent: ItemLabel, ItemMessageComponent: ItemMessage })));
 TextArea.displayName = "TextArea";

package/dist/Form/TextArea/TextAreaCommon.d.ts

@@ -1,14 +1,17 @@
 import { type ComponentProps, ComponentPropsWithRef, type ComponentType, MouseEventHandler } from "react";
-import { ItemLabel } from "../ItemLabel/ItemLabelCommon";
-import { ItemMessage } from "../ItemMessage/ItemMessageCommon";
-type Props = ComponentPropsWithRef<"textarea"> & Pick<ComponentProps<typeof ItemLabel>, "label" | "description" | "buttonLabel" | "sideButtonLabel" | "onSideButtonClick"> & {
-    /** @deprecated Use `className` instead */
-    classModifier?: string;
+import { ItemLabelCommon, type ItemLabelProps } from "../ItemLabel/ItemLabelCommon";
+import { ItemMessage, type ItemMessageProps } from "../ItemMessage/ItemMessageCommon";
+export type TextAreaProps = ComponentPropsWithRef<"textarea"> & {
     helper?: string;
+    /**
+     * @deprecated Use `message` and messageType instead.
+     */
     error?: string;
-    ItemLabelComponent: ComponentType<Omit<ComponentProps<typeof ItemLabel>, "ButtonComponent">>;
-    ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
     onButtonClick?: MouseEventHandler<HTMLButtonElement>;
-} & Partial<ComponentPropsWithRef<typeof ItemMessage>>;
-export declare const TextArea: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>>;
-export {};
+} & Partial<ItemMessageProps & ItemLabelProps>;
+type TextAreaCommonProps = TextAreaProps & {
+    ItemLabelComponent: ComponentType<Omit<ComponentProps<typeof ItemLabelCommon>, "ButtonComponent">>;
+    ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
+};
+declare const TextAreaCommon: import("react").ForwardRefExoticComponent<Omit<TextAreaCommonProps, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>>;
+export { TextAreaCommon };

package/dist/Form/TextArea/TextAreaCommon.js

@@ -1,12 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useId, } from "react";
-export const TextArea = forwardRef(({ id, className, classModifier = "", label, description, helper, error, buttonLabel, onButtonClick, required, sideButtonLabel, ItemLabelComponent, ItemMessageComponent, onSideButtonClick, placeholder = " ", ...inputProps }, inputRef) => {
+const TextAreaCommon = forwardRef(({ id, className, label, description, helper, error, message, messageType, buttonLabel, onButtonClick, required, sideButtonLabel, ItemLabelComponent, ItemMessageComponent, onSideButtonClick, placeholder = " ", ...inputProps }, inputRef) => {
     const generatedId = useId();
     const inputId = id ?? generatedId;
     const helperId = `${inputId}-helper`;
-    const errorId = `${inputId}-error`;
+    const messageId = `${inputId}-error`;
+    const hasError = (Boolean(message) && messageType === "error") || Boolean(error);
     return (_jsxs("div", { className: ["af-form__input-container", className]
             .filter(Boolean)
-            .join(" "), children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, inputId: inputId }), _jsx("textarea", { id: inputId, className: "af-form__textarea", ref: inputRef, "aria-errormessage": error ? errorId : undefined, "aria-describedby": helper ? helperId : undefined, required: required, "aria-invalid": Boolean(error) || classModifier.includes("error") ? true : undefined, placeholder: placeholder, ...inputProps }), helper ? (_jsx("span", { id: helperId, className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: errorId, message: error })] }));
+            .join(" "), children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, inputId: inputId }), _jsx("textarea", { id: inputId, className: "af-form__textarea", ref: inputRef, "aria-errormessage": hasError ? messageId : undefined, "aria-describedby": helper ? helperId : undefined, required: required, "aria-invalid": hasError || undefined, placeholder: placeholder, ...inputProps }), helper ? (_jsx("span", { id: helperId, className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: messageId, message: message || error, messageType: messageType })] }));
 });
-TextArea.displayName = "TextArea";
+TextAreaCommon.displayName = "TextArea";
+export { TextAreaCommon };

package/dist/Form/TextArea/TextAreaLF.d.ts

@@ -1,21 +1,3 @@
 import "@axa-fr/design-system-apollo-css/dist/Form/TextArea/TextAreaLF.scss";
-import { type ComponentProps } from "react";
-import { ItemMessage } from "../ItemMessage/ItemMessageLF";
-export declare const TextArea: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").ClassAttributes<HTMLTextAreaElement> & import("react").TextareaHTMLAttributes<HTMLTextAreaElement> & Pick<{
-    label?: import("react").ReactNode;
-    description?: string;
-    required?: boolean;
-    inputId: string;
-    sideButtonLabel?: string;
-    onSideButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-    buttonLabel?: string;
-    onButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-    ButtonComponent: import("react").ComponentType<import("../../Button/ButtonCommon").ButtonProps>;
-}, "label" | "description" | "sideButtonLabel" | "onSideButtonClick" | "buttonLabel"> & {
-    classModifier?: string;
-    helper?: string;
-    error?: string;
-    ItemLabelComponent: import("react").ComponentType<Omit<ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>, "ButtonComponent">>;
-    ItemMessageComponent: import("react").ComponentType<ComponentProps<typeof ItemMessage>>;
-    onButtonClick?: import("react").MouseEventHandler<HTMLButtonElement>;
-} & Partial<import("../ItemMessage/ItemMessageCommon").ItemMessageProps>, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>, "ItemMessageComponent" | "ItemLabelComponent">, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>>;
+import { type TextAreaProps } from "./TextAreaCommon";
+export declare const TextArea: import("react").ForwardRefExoticComponent<Omit<TextAreaProps, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>>;

package/dist/Form/TextArea/TextAreaLF.js

@@ -3,6 +3,6 @@ import "@axa-fr/design-system-apollo-css/dist/Form/TextArea/TextAreaLF.scss";
 import { forwardRef } from "react";
 import { ItemLabel } from "../ItemLabel/ItemLabelLF";
 import { ItemMessage } from "../ItemMessage/ItemMessageLF";
-import { TextArea as TextAreaCommon } from "./TextAreaCommon";
+import { TextAreaCommon } from "./TextAreaCommon";
 export const TextArea = forwardRef((props, ref) => (_jsx(TextAreaCommon, { ...props, ref: ref, ItemLabelComponent: ItemLabel, ItemMessageComponent: ItemMessage })));
 TextArea.displayName = "TextArea";

package/dist/index.d.ts

@@ -25,7 +25,7 @@ export { InputText } from "./Form/InputText/InputTextApollo";
 export { InputTextAtom } from "./Form/InputTextAtom/InputTextAtomApollo";
 export { ItemFile, itemFileVariants } from "./Form/ItemFile/ItemFileApollo";
 export { ItemLabel } from "./Form/ItemLabel/ItemLabelApollo";
-export { ItemMessage } from "./Form/ItemMessage/ItemMessageApollo";
+export { ItemMessage, itemMessageVariants, type ItemMessageVariants, } from "./Form/ItemMessage/ItemMessageApollo";
 export { CardRadio } from "./Form/Radio/CardRadio/CardRadioApollo";
 export { CardRadioOption } from "./Form/Radio/CardRadioOption/CardRadioOptionApollo";
 export { Radio } from "./Form/Radio/Radio/RadioApollo";

package/dist/index.js

@@ -24,7 +24,7 @@ export { InputText } from "./Form/InputText/InputTextApollo";
 export { InputTextAtom } from "./Form/InputTextAtom/InputTextAtomApollo";
 export { ItemFile, itemFileVariants } from "./Form/ItemFile/ItemFileApollo";
 export { ItemLabel } from "./Form/ItemLabel/ItemLabelApollo";
-export { ItemMessage } from "./Form/ItemMessage/ItemMessageApollo";
+export { ItemMessage, itemMessageVariants, } from "./Form/ItemMessage/ItemMessageApollo";
 export { CardRadio } from "./Form/Radio/CardRadio/CardRadioApollo";
 export { CardRadioOption } from "./Form/Radio/CardRadioOption/CardRadioOptionApollo";
 export { Radio } from "./Form/Radio/Radio/RadioApollo";

package/dist/indexLF.d.ts

@@ -29,7 +29,7 @@ InputText as TextInput, } from "./Form/InputText/InputTextLF";
 export { InputTextAtom } from "./Form/InputTextAtom/InputTextAtomLF";
 export { ItemFile, itemFileVariants } from "./Form/ItemFile/ItemFileLF";
 export { ItemLabel } from "./Form/ItemLabel/ItemLabelLF";
-export { ItemMessage } from "./Form/ItemMessage/ItemMessageLF";
+export { ItemMessage, itemMessageVariants, type ItemMessageVariants, } from "./Form/ItemMessage/ItemMessageLF";
 export { CardRadio } from "./Form/Radio/CardRadio/CardRadioLF";
 export { CardRadioOption } from "./Form/Radio/CardRadioOption/CardRadioOptionLF";
 export { Radio } from "./Form/Radio/Radio/RadioLF";

package/dist/indexLF.js

@@ -28,7 +28,7 @@ InputText as TextInput, } from "./Form/InputText/InputTextLF";
 export { InputTextAtom } from "./Form/InputTextAtom/InputTextAtomLF";
 export { ItemFile, itemFileVariants } from "./Form/ItemFile/ItemFileLF";
 export { ItemLabel } from "./Form/ItemLabel/ItemLabelLF";
-export { ItemMessage } from "./Form/ItemMessage/ItemMessageLF";
+export { ItemMessage, itemMessageVariants, } from "./Form/ItemMessage/ItemMessageLF";
 export { CardRadio } from "./Form/Radio/CardRadio/CardRadioLF";
 export { CardRadioOption } from "./Form/Radio/CardRadioOption/CardRadioOptionLF";
 export { Radio } from "./Form/Radio/Radio/RadioLF";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@axa-fr/design-system-apollo-react",
-  "version": "2.0.3",
+  "version": "2.0.4-alpha.13",
   "description": "",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -46,8 +46,8 @@
   },
   "homepage": "https://github.com/AxaFrance/design-system#readme",
   "peerDependencies": {
-    "@axa-fr/design-system-apollo-css": "2.0.3",
-    "@axa-fr/design-system-look-and-feel-css": "2.0.3",
+    "@axa-fr/design-system-apollo-css": "2.0.4-alpha.13",
+    "@axa-fr/design-system-look-and-feel-css": "2.0.4-alpha.13",
     "@material-symbols/svg-400": ">= 0.19.0",
     "react": ">= 18"
   },