@axa-fr/canopee-react 1.4.2-alpha.10 → 1.4.2-alpha.11

package/dist/prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxApollo.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { ItemMessage } from "../../ItemMessage/ItemMessageApollo";
 import { CardCheckboxOption } from "../CardCheckboxOption/CardCheckboxOptionApollo";
+import { CheckboxText } from "../CheckboxText/CheckboxTextApollo";
 import { CardCheckboxCommon, } from "./CardCheckboxCommon";
 import "@axa-fr/canopee-css/prospect/Form/Checkbox/CardCheckbox/CardCheckboxApollo.css";
-export const CardCheckbox = (props) => (_jsx(CardCheckboxCommon, { ...props, CardCheckboxItemComponent: CardCheckboxOption, ItemMessageComponent: ItemMessage }));
+export const CardCheckbox = (props) => (_jsx(CardCheckboxCommon, { ...props, CardCheckboxItemComponent: CardCheckboxOption, CheckboxTextComponent: CheckboxText, ItemMessageComponent: ItemMessage }));
 CardCheckbox.displayName = "CardCheckbox";

package/dist/prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxCommon.d.ts

@@ -2,9 +2,11 @@ import { type ComponentType, type ReactNode } from "react";
 import type { GridContainerProps } from "../../../utilities/types/GridContainerProps";
 import type { ItemMessageProps } from "../../ItemMessage/ItemMessageCommon";
 import type { CardCheckboxOptionProps } from "../CardCheckboxOption/CardCheckboxOptionCommon";
+import type { CheckboxTextProps } from "../CheckboxText/CheckboxTextCommon";
 type CheckboxOption = Omit<CardCheckboxOptionProps, "name" | "type">;
 export type CardCheckboxProps = Omit<CardCheckboxOptionProps, "value" | "label" | "type" | "icon" | "description" | "subtitle" | "children"> & {
     type?: "vertical" | "horizontal";
+    mode?: "text";
     /**
      * @deprecated Use `label` instead.
      */
@@ -27,11 +29,12 @@ export type CardCheckboxProps = Omit<CardCheckboxOptionProps, "value" | "label"
     containerProps?: GridContainerProps<"fieldset">;
 } & Partial<ItemMessageProps>;
 type CardCheckboxCommonProps = CardCheckboxProps & {
+    CheckboxTextComponent: ComponentType<CheckboxTextProps>;
     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, message, messageType, containerProps, ...inputProps }: CardCheckboxCommonProps): import("react/jsx-runtime").JSX.Element;
+    ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type, error, name, id, onChange, CardCheckboxItemComponent, CheckboxTextComponent, ItemMessageComponent, message, messageType, containerProps, mode, ...inputProps }: CardCheckboxCommonProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export {};

package/dist/prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxCommon.js

@@ -1,9 +1,10 @@
 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, message, messageType = "error", containerProps, ...inputProps }) => {
+export const CardCheckboxCommon = ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type = "vertical", error, name, id, onChange = () => { }, CardCheckboxItemComponent, CheckboxTextComponent, ItemMessageComponent, message, messageType = "error", containerProps, mode, ...inputProps }) => {
     const generatedId = useId();
     const cardCheckboxId = id || generatedId;
     const messageId = `${cardCheckboxId}-error`;
+    const CheckboxItemComponent = mode === "text" ? CheckboxTextComponent : CardCheckboxItemComponent;
     const cardCheckboxOptionsRef = useRef(null);
     const handleChange = (event) => {
         const cardCheckboxOptionsEl = cardCheckboxOptionsRef.current;
@@ -26,6 +27,6 @@ export const CardCheckboxCommon = ({ className, labelGroup, descriptionGroup, la
     return (_jsxs("fieldset", { className: ["af-card-checkbox", className].filter(Boolean).join(" "), id: cardCheckboxId, ...containerProps, 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": hasError || undefined, "aria-errormessage": hasError ? messageId : undefined, name: name }, `${name ?? cardCheckboxId}-${cardCheckboxItemProps.label}`))) }), _jsx(ItemMessageComponent, { id: messageId, message: message || error, messageType: messageType })] }));
+                ].join(" "), ref: cardCheckboxOptionsRef, children: options.map((cardCheckboxItemProps) => (_jsx(CheckboxItemComponent, { 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 })] }));
 };
 CardCheckboxCommon.displayName = "CardCheckboxCommon";

package/dist/prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxLF.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { ItemMessage } from "../../ItemMessage/ItemMessageLF";
 import { CardCheckboxOption } from "../CardCheckboxOption/CardCheckboxOptionLF";
+import { CheckboxText } from "../CheckboxText/CheckboxTextLF";
 import { CardCheckboxCommon, } from "./CardCheckboxCommon";
 import "@axa-fr/canopee-css/client/Form/Checkbox/CardCheckbox/CardCheckboxLF.css";
-export const CardCheckbox = (props) => (_jsx(CardCheckboxCommon, { ...props, CardCheckboxItemComponent: CardCheckboxOption, ItemMessageComponent: ItemMessage }));
+export const CardCheckbox = (props) => (_jsx(CardCheckboxCommon, { ...props, CardCheckboxItemComponent: CardCheckboxOption, CheckboxTextComponent: CheckboxText, ItemMessageComponent: ItemMessage }));
 CardCheckbox.displayName = "CardCheckbox";

package/package.json

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