@axa-fr/canopee-react 2.0.0-alpha.82 → 2.0.0-alpha.84

package/dist/prospect-client/Divider/DividerCommon.d.ts

@@ -1,6 +1,5 @@
 type DividerProps = {
     className?: string;
-    classModifier?: string;
 };
-export declare const Divider: ({ className, classModifier }: DividerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Divider: ({ className }: DividerProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/prospect-client/Divider/DividerCommon.js

@@ -1,11 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { getClassName } from "../utilities/getClassName";
-export const Divider = ({ className, classModifier }) => {
-    const componentClassName = useMemo(() => getClassName({
-        baseClassName: "af-divider",
-        className,
-        modifiers: classModifier?.split(" ").filter(Boolean) ?? [],
-    }), [className, classModifier]);
+export const Divider = ({ className }) => {
+    const componentClassName = useMemo(() => getClassName({ baseClassName: "af-divider", className }), [className]);
     return _jsx("hr", { className: componentClassName });
 };

package/dist/prospect-client/Form/Dropdown/DropdownCommon.d.ts

@@ -4,7 +4,6 @@ import { ItemLabelCommon, type ItemLabelProps } from "../ItemLabel/ItemLabelComm
 import { type ItemMessageProps } from "../ItemMessage/ItemMessage";
 export type DropdownProps = ComponentPropsWithRef<"select"> & {
     id?: string;
-    classModifier?: string;
     label?: ItemLabelProps["children"];
     placeholder?: string;
     description?: string;

package/dist/prospect-client/Form/InputDate/InputDateCommon.d.ts

@@ -4,7 +4,6 @@ import { ItemLabelCommon, type ItemLabelProps } from "../ItemLabel/ItemLabelComm
 import { type ItemMessageProps } from "../ItemMessage/ItemMessage";
 import { type InputDateAtomProps } from "./InputDateAtom";
 export type InputDateProps = Omit<ComponentPropsWithRef<"input">, "value" | "min" | "max"> & {
-    classModifier?: string;
     defaultValue?: Date | string;
     value?: Date | string;
     min?: InputDateAtomProps["min"];
@@ -19,7 +18,7 @@ type InputDateCommonProps = InputDateProps & {
     ItemMessageComponent: ComponentType<ItemMessageProps>;
 };
 declare const InputDateCommon: {
-    ({ className, classModifier, helper, message, messageType, label, description, moreButtonLabel, onMoreButtonClick, ItemLabelComponent, ItemMessageComponent, required, hidePicker, max, min, containerProps, ...otherProps }: InputDateCommonProps): import("react/jsx-runtime").JSX.Element;
+    ({ className, helper, message, messageType, label, description, moreButtonLabel, onMoreButtonClick, ItemLabelComponent, ItemMessageComponent, required, hidePicker, max, min, containerProps, ...otherProps }: InputDateCommonProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export { InputDateCommon };

package/dist/prospect-client/Form/InputDate/InputDateCommon.js

@@ -5,7 +5,7 @@ import { ItemLabelCommon, } from "../ItemLabel/ItemLabelCommon";
 import {} from "../ItemMessage/ItemMessage";
 import { InputDateAtom } from "./InputDateAtom";
 import { InputDateTextAtom } from "./InputDateTextAtom";
-const InputDateCommon = ({ className, classModifier = "", helper, message, messageType = "error", label, description, moreButtonLabel, onMoreButtonClick, ItemLabelComponent, ItemMessageComponent, required, hidePicker, max, min, containerProps, ...otherProps }) => {
+const InputDateCommon = ({ className, helper, message, messageType = "error", label, description, moreButtonLabel, onMoreButtonClick, ItemLabelComponent, ItemMessageComponent, required, hidePicker, max, min, containerProps, ...otherProps }) => {
     let inputId = useId();
     inputId = otherProps.id ?? inputId;
     const idMessage = useId();
@@ -23,7 +23,7 @@ const InputDateCommon = ({ className, classModifier = "", helper, message, messa
     const hasWarning = Boolean(message) && messageType === "warning" && !hasError;
     const componentClassName = getClassName({
         baseClassName: "af-form__input-date",
-        modifiers: [...classModifier.split(" "), hasWarning && "warning"],
+        modifiers: [hasWarning && "warning"],
         className,
     });
     return (_jsxs("div", { className: "af-form__input-container", ...containerProps, children: [_jsx(ItemLabelComponent, { description: description, moreButtonLabel: moreButtonLabel, onMoreButtonClick: onMoreButtonClick, required: required, htmlFor: inputId, children: label }), hidePicker ? (_jsx(InputDateTextAtom, { ...otherProps, id: inputId, className: componentClassName, "aria-errormessage": ariaErrormessage, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, required: required })) : (_jsx(InputDateAtom, { ...otherProps, id: inputId, className: componentClassName, "aria-errormessage": ariaErrormessage, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, required: required, max: max, min: min })), helper ? (_jsx("span", { id: idHelp, className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: idMessage, message: message, messageType: messageType })] }));

package/dist/prospect-client/Form/InputPhone/InputPhoneCommon.d.ts

@@ -7,7 +7,6 @@ import { ItemLabelCommon, type ItemLabelProps } from "../ItemLabel/ItemLabelComm
 import { type ItemMessageProps } from "../ItemMessage/ItemMessage";
 import { type OptionType } from "./InputPhone.types";
 export type InputPhoneProps = ComponentPropsWithRef<"input"> & {
-    classModifier?: string;
     helper?: string;
     defaultCountry?: string;
     showSelect?: boolean;
@@ -26,7 +25,7 @@ type InputPhoneCommonProps = InputPhoneProps & {
     IconComponent: ComponentType<ComponentProps<typeof Icon>>;
 };
 declare const InputPhoneCommon: {
-    ({ className, classModifier, helper, message, messageType, defaultCountry, showSelect, disabled, label, description, moreButtonLabel, onMoreButtonClick, required, sideButtonLabel, onSideButtonClick, countryCodeOptions, onChangeSelect, onChangeInput, mask, ItemLabelComponent, ItemMessageComponent, InputTextComponent, IconComponent, "aria-errormessage": ariaErrormessage, containerProps, ...otherProps }: InputPhoneCommonProps): import("react/jsx-runtime").JSX.Element;
+    ({ className, helper, message, messageType, defaultCountry, showSelect, disabled, label, description, moreButtonLabel, onMoreButtonClick, required, sideButtonLabel, onSideButtonClick, countryCodeOptions, onChangeSelect, onChangeInput, mask, ItemLabelComponent, ItemMessageComponent, InputTextComponent, IconComponent, "aria-errormessage": ariaErrormessage, containerProps, ...otherProps }: InputPhoneCommonProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export { InputPhoneCommon };

package/dist/prospect-client/Form/InputPhone/InputPhoneCommon.js

@@ -7,7 +7,7 @@ import {} from "../ItemMessage/ItemMessage";
 import { CountryCodeSelect } from "./CountryCodeSelect";
 import {} from "./InputPhone.types";
 import { maskFrenchPhoneNumber } from "./maskFrenchPhoneNumber";
-const InputPhoneCommon = ({ className, classModifier = "", helper, message, messageType = "error", defaultCountry, showSelect, disabled, label, description, moreButtonLabel, onMoreButtonClick, required, sideButtonLabel, onSideButtonClick, countryCodeOptions = [], onChangeSelect, onChangeInput, mask = maskFrenchPhoneNumber, ItemLabelComponent, ItemMessageComponent, InputTextComponent, IconComponent, "aria-errormessage": ariaErrormessage, containerProps, ...otherProps }) => {
+const InputPhoneCommon = ({ className, helper, message, messageType = "error", defaultCountry, showSelect, disabled, label, description, moreButtonLabel, onMoreButtonClick, required, sideButtonLabel, onSideButtonClick, countryCodeOptions = [], onChangeSelect, onChangeInput, mask = maskFrenchPhoneNumber, ItemLabelComponent, ItemMessageComponent, InputTextComponent, IconComponent, "aria-errormessage": ariaErrormessage, containerProps, ...otherProps }) => {
     let inputId = useId();
     inputId = otherProps.id || inputId;
     const idMessage = useId();
@@ -35,7 +35,7 @@ const InputPhoneCommon = ({ className, classModifier = "", helper, message, mess
     };
     return (_jsxs("div", { className: "af-form__input-phone-container", ...containerProps, children: [_jsx(ItemLabelComponent, { description: description, moreButtonLabel: moreButtonLabel, onMoreButtonClick: onMoreButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, htmlFor: inputId, children: label }), _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, error: hasError ? messageType : undefined, warning: hasWarning ? "warning" : 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, messageType: messageType })] }));
+                            .join(" "), error: hasError ? messageType : undefined, warning: hasWarning ? "warning" : 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, messageType: messageType })] }));
 };
 InputPhoneCommon.displayName = "InputPhone";
 export { InputPhoneCommon };

package/dist/prospect-client/Form/InputText/InputTextCommon.d.ts

@@ -5,7 +5,6 @@ import { type ItemMessageProps } from "../ItemMessage/ItemMessage";
 import type { GridContainerProps } from "../../utilities/types/GridContainerProps";
 export type InputTextProps = ComponentProps<"input"> & {
     unit?: ReactNode;
-    classModifier?: string;
     label?: ItemLabelProps["children"];
     helper?: string;
     containerProps?: GridContainerProps;
@@ -16,7 +15,7 @@ type InputTextCommonProps = InputTextProps & {
     InputTextAtomComponent: ComponentType<ComponentProps<typeof InputTextAtom>>;
 };
 declare const InputTextCommon: {
-    ({ unit, className, classModifier, helper, message, messageType, label, description, moreButtonLabel, onMoreButtonClick, required, sideButtonLabel, onSideButtonClick, ItemLabelComponent, ItemMessageComponent, InputTextAtomComponent, containerProps, ...otherProps }: InputTextCommonProps): import("react/jsx-runtime").JSX.Element;
+    ({ unit, className, helper, message, messageType, label, description, moreButtonLabel, onMoreButtonClick, required, sideButtonLabel, onSideButtonClick, ItemLabelComponent, ItemMessageComponent, InputTextAtomComponent, containerProps, ...otherProps }: InputTextCommonProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export { InputTextCommon };

package/dist/prospect-client/Form/InputText/InputTextCommon.js

@@ -3,7 +3,7 @@ import { useId, } from "react";
 import { InputTextAtom } from "../InputTextAtom/InputTextAtomCommon";
 import { ItemLabelCommon, } from "../ItemLabel/ItemLabelCommon";
 import {} from "../ItemMessage/ItemMessage";
-const InputTextCommon = ({ unit, className, classModifier = "", helper, message, messageType = "error", label, description, moreButtonLabel, onMoreButtonClick, required, sideButtonLabel, onSideButtonClick, ItemLabelComponent, ItemMessageComponent, InputTextAtomComponent, containerProps, ...otherProps }) => {
+const InputTextCommon = ({ unit, className, helper, message, messageType = "error", label, description, moreButtonLabel, onMoreButtonClick, required, sideButtonLabel, onSideButtonClick, ItemLabelComponent, ItemMessageComponent, InputTextAtomComponent, containerProps, ...otherProps }) => {
     let inputId = useId();
     inputId = otherProps.id || inputId;
     const idMessage = useId();
@@ -12,7 +12,7 @@ const InputTextCommon = ({ unit, className, classModifier = "", helper, message,
         helper && idHelp,
         message && messageType === "success" && idMessage,
     ].filter(Boolean);
-    return (_jsxs("div", { className: "af-form__input-container", ...containerProps, children: [_jsx(ItemLabelComponent, { description: description, moreButtonLabel: moreButtonLabel, onMoreButtonClick: onMoreButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, htmlFor: inputId, children: label }), _jsx(InputTextAtomComponent, { id: inputId, unit: unit, className: className, classModifier: classModifier, error: message && messageType === "error" ? messageType : undefined, warning: message && messageType === "warning" ? messageType : undefined, required: required, idMessage: message ? 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, messageType: messageType })] }));
+    return (_jsxs("div", { className: "af-form__input-container", ...containerProps, children: [_jsx(ItemLabelComponent, { description: description, moreButtonLabel: moreButtonLabel, onMoreButtonClick: onMoreButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, htmlFor: inputId, children: label }), _jsx(InputTextAtomComponent, { id: inputId, unit: unit, className: className, error: message && messageType === "error" ? messageType : undefined, warning: message && messageType === "warning" ? messageType : undefined, required: required, idMessage: message ? 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, messageType: messageType })] }));
 };
 InputTextCommon.displayName = "InputText";
 export { InputTextCommon };

package/dist/prospect-client/Form/InputTextAtom/InputTextAtomCommon.d.ts

@@ -1,14 +1,13 @@
 import { type ComponentPropsWithRef, type ReactNode } from "react";
 type InputTextAtomProps = ComponentPropsWithRef<"input"> & {
     unit?: ReactNode;
-    classModifier?: string;
     error?: string;
     warning?: string;
     idMessage?: string;
     idHelp?: string;
 };
 declare const InputTextAtom: {
-    ({ unit, className, classModifier, error, warning, required, idMessage, idHelp, "aria-errormessage": ariaErrormessage, "aria-describedby": ariaDescribedby, type, ...otherProps }: InputTextAtomProps): import("react/jsx-runtime").JSX.Element;
+    ({ unit, className, error, warning, required, idMessage, idHelp, "aria-errormessage": ariaErrormessage, "aria-describedby": ariaDescribedby, type, ...otherProps }: InputTextAtomProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export { InputTextAtom };

package/dist/prospect-client/Form/InputTextAtom/InputTextAtomCommon.js

@@ -1,11 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useId } from "react";
 import { getClassName } from "../../utilities/getClassName";
-const InputTextAtom = ({ unit, className, classModifier = "", error, warning, required, idMessage, idHelp, "aria-errormessage": ariaErrormessage, "aria-describedby": ariaDescribedby, type = "text", ...otherProps }) => {
+const InputTextAtom = ({ unit, className, error, warning, required, idMessage, idHelp, "aria-errormessage": ariaErrormessage, "aria-describedby": ariaDescribedby, type = "text", ...otherProps }) => {
     const componentClassName = getClassName({
         baseClassName: "af-form__input-text",
         modifiers: [
-            classModifier,
             error || ariaErrormessage ? "error" : "",
             !error && !ariaErrormessage && warning ? "warning" : "",
         ],

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@axa-fr/canopee-react",
-  "version": "2.0.0-alpha.82",
+  "version": "2.0.0-alpha.84",
   "description": "Package React - Design System Canopée",
   "exports": {
     "./distributeur": {
@@ -53,7 +53,7 @@
   },
   "homepage": "https://github.com/AxaFrance/design-system#readme",
   "peerDependencies": {
-    "@axa-fr/canopee-css": "2.0.0-alpha.82",
+    "@axa-fr/canopee-css": "2.0.0-alpha.84",
     "@material-symbols/svg-400": ">= 0.19.0",
     "@material-symbols/svg-700": ">= 0.19.0",
     "react": ">= 19"