@axa-fr/design-system-apollo-react 1.0.5-alpha.411 → 1.0.5-alpha.416

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

@@ -1,5 +1,5 @@
-import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CardCheckbox/CardCheckboxApollo.scss";
 import { type CardCheckboxProps } from "./CardCheckboxCommon";
+import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CardCheckbox/CardCheckboxApollo.scss";
 export declare const CardCheckbox: {
     (props: CardCheckboxProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;

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

@@ -1,8 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CardCheckbox/CardCheckboxApollo.scss";
-import { Icon } from "../../../Icon/IconApollo";
 import { ItemMessage } from "../../ItemMessage/ItemMessageApollo";
-import { Checkbox } from "../Checkbox/CheckboxApollo";
+import { CardCheckboxOption } from "../CardCheckboxOption/CardCheckboxOptionApollo";
 import { CardCheckboxCommon, } from "./CardCheckboxCommon";
-export const CardCheckbox = (props) => (_jsx(CardCheckboxCommon, { ...props, IconComponent: Icon, CheckboxComponent: Checkbox, ItemMessageComponent: ItemMessage }));
+import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CardCheckbox/CardCheckboxApollo.scss";
+export const CardCheckbox = (props) => (_jsx(CardCheckboxCommon, { ...props, CardCheckboxItemComponent: CardCheckboxOption, ItemMessageComponent: ItemMessage }));
 CardCheckbox.displayName = "CardCheckbox";

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

@@ -1,21 +1,32 @@
-import { type ChangeEventHandler, type ComponentProps, type ComponentType } from "react";
-import { ItemMessage } from "../../ItemMessage/ItemMessageLF";
-import { type TCardCheckboxItem } from "./CardCheckboxItem";
-import type { CheckboxComponent, IconComponent } from "./types";
-export type CardCheckboxProps = Partial<TCardCheckboxItem> & {
-    type: "vertical" | "horizontal";
+import { type ComponentType, type ReactNode } from "react";
+import type { ItemMessageProps } from "../../ItemMessage/ItemMessageCommon";
+import type { CardCheckboxOptionProps } from "../CardCheckboxOption/CardCheckboxOptionCommon";
+type CheckboxOption = Omit<CardCheckboxOptionProps, "name" | "type">;
+export type CardCheckboxProps = Omit<CardCheckboxOptionProps, "value" | "label" | "type" | "icon" | "description" | "subtitle" | "children"> & {
+    type?: "vertical" | "horizontal";
+    /**
+     * @deprecated Use `label` instead.
+     */
     labelGroup?: string;
+    /**
+     * @deprecated Use `description` instead.
+     */
     descriptionGroup?: string;
+    label: ReactNode;
+    description?: ReactNode;
+    /**
+     * @deprecated Use `required` instead.
+     */
     isRequired?: boolean;
-    options: TCardCheckboxItem[];
-    onChange?: ChangeEventHandler;
+    options: CheckboxOption[];
     error?: string;
 };
-type CardCheckboxCommonProps = CardCheckboxProps & CheckboxComponent & IconComponent & {
-    ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
+type CardCheckboxCommonProps = CardCheckboxProps & {
+    CardCheckboxItemComponent: ComponentType<CardCheckboxOptionProps>;
+    ItemMessageComponent: ComponentType<ItemMessageProps>;
 };
 export declare const CardCheckboxCommon: {
-    ({ className, labelGroup, descriptionGroup, CheckboxComponent, IconComponent, isRequired, options, onChange, type, error, ItemMessageComponent, ...inputProps }: CardCheckboxCommonProps): import("react/jsx-runtime").JSX.Element;
+    ({ className, labelGroup, descriptionGroup, label, description, isRequired, required, options, type, error, name, id, onChange, CardCheckboxItemComponent, ItemMessageComponent, ...inputProps }: CardCheckboxCommonProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export {};

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

@@ -1,15 +1,30 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useId, } from "react";
-import { BREAKPOINT } from "../../../utilities/constants";
-import { getComponentClassName } from "../../../utilities/getComponentClassName";
-import { useIsSmallScreen } from "../../../utilities/hook/useIsSmallScreen";
-import { CardCheckboxItem } from "./CardCheckboxItem";
-export const CardCheckboxCommon = ({ className, labelGroup, descriptionGroup, CheckboxComponent, IconComponent, isRequired, options, onChange, type = "vertical", error, ItemMessageComponent, ...inputProps }) => {
-    const componentClassName = getComponentClassName("af-card-checkbox__container", className);
-    const checkboxGroupClassName = getComponentClassName("af-card-checkbox-group", className, type);
-    const errorId = useId();
-    const isMobile = useIsSmallScreen(BREAKPOINT.SM);
-    const size = isMobile ? "M" : "L";
-    return (_jsxs("fieldset", { className: componentClassName, children: [labelGroup ? (_jsxs("legend", { className: "af-card-checkbox__legend", children: [_jsxs("p", { children: [labelGroup, isRequired ? _jsx("span", { "aria-hidden": true, children: "\u00A0*" }) : null] }), descriptionGroup ? (_jsx("p", { className: "af-card-checkbox__description", children: descriptionGroup })) : null] })) : null, _jsxs("div", { className: "af-card-checkbox__choices", children: [_jsx("ul", { className: checkboxGroupClassName, children: options.map(({ hasError, ...optionProps }) => (_jsx("li", { children: _jsx(CardCheckboxItem, { ...inputProps, size: size, errorId: errorId, onChange: onChange, CheckboxComponent: CheckboxComponent, IconComponent: IconComponent, hasError: Boolean(error) || hasError, ...optionProps }) }, crypto.randomUUID()))) }), _jsx(ItemMessageComponent, { id: errorId, message: error, messageType: "error" })] })] }));
+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 }) => {
+    const generatedId = useId();
+    const cardCheckboxId = id || generatedId;
+    const errorId = `${cardCheckboxId}-error`;
+    const cardCheckboxOptionsRef = useRef(null);
+    const handleChange = (event) => {
+        const cardCheckboxOptionsEl = cardCheckboxOptionsRef.current;
+        if (cardCheckboxOptionsEl && required) {
+            const nbCheckedElements = cardCheckboxOptionsEl.querySelectorAll("input[type='checkbox']:checked").length;
+            cardCheckboxOptionsEl
+                .querySelectorAll("input[type='checkbox']")
+                .forEach((el) => {
+                if (nbCheckedElements < 1 && !event.target.checked) {
+                    el.setAttribute("required", "true");
+                }
+                else {
+                    el.removeAttribute("required");
+                }
+            });
+        }
+        onChange(event);
+    };
+    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" })] }));
 };
 CardCheckboxCommon.displayName = "CardCheckboxCommon";

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

@@ -1,5 +1,5 @@
-import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CardCheckbox/CardCheckboxLF.scss";
 import { type CardCheckboxProps } from "./CardCheckboxCommon";
+import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CardCheckbox/CardCheckboxLF.scss";
 export declare const CardCheckbox: {
     (props: CardCheckboxProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;

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

@@ -1,8 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CardCheckbox/CardCheckboxLF.scss";
-import { Icon } from "../../../Icon/IconLF";
 import { ItemMessage } from "../../ItemMessage/ItemMessageLF";
-import { Checkbox } from "../Checkbox/CheckboxLF";
+import { CardCheckboxOption } from "../CardCheckboxOption/CardCheckboxOptionLF";
 import { CardCheckboxCommon, } from "./CardCheckboxCommon";
-export const CardCheckbox = (props) => (_jsx(CardCheckboxCommon, { ...props, IconComponent: Icon, CheckboxComponent: Checkbox, ItemMessageComponent: ItemMessage }));
+import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CardCheckbox/CardCheckboxLF.scss";
+export const CardCheckbox = (props) => (_jsx(CardCheckboxCommon, { ...props, CardCheckboxItemComponent: CardCheckboxOption, ItemMessageComponent: ItemMessage }));
 CardCheckbox.displayName = "CardCheckbox";

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

@@ -0,0 +1,3 @@
+import { type CardCheckboxOptionProps } from "./CardCheckboxOptionCommon";
+import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo.scss";
+export declare const CardCheckboxOption: (props: CardCheckboxOptionProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Icon } from "../../../Icon/IconApollo";
+import { Checkbox } from "../Checkbox/CheckboxApollo";
+import { CardCheckboxOptionCommon, } from "./CardCheckboxOptionCommon";
+import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo.scss";
+export const CardCheckboxOption = (props) => (_jsx(CardCheckboxOptionCommon, { ...props, CheckboxComponent: Checkbox, IconComponent: Icon }));

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

@@ -0,0 +1,15 @@
+import { type ComponentType, type ReactNode } from "react";
+import type { IconProps } from "../../../Icon/IconCommon";
+import type { CheckboxProps } from "../Checkbox/CheckboxCommon";
+export type CardCheckboxOptionProps = CheckboxProps & {
+    label: ReactNode;
+    type?: "vertical" | "horizontal";
+    description?: ReactNode;
+    subtitle?: ReactNode;
+    icon?: IconProps["src"];
+};
+export type CardCheckboxOptionCommonProps = CardCheckboxOptionProps & {
+    CheckboxComponent: ComponentType<CheckboxProps>;
+    IconComponent: ComponentType<IconProps>;
+};
+export declare const CardCheckboxOptionCommon: import("react").ForwardRefExoticComponent<Omit<CardCheckboxOptionCommonProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;

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

@@ -0,0 +1,12 @@
+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 })] }));
+});
+CardCheckboxOptionCommon.displayName = "CardCheckboxOptionCommon";

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

@@ -0,0 +1,3 @@
+import { type CardCheckboxOptionProps } from "./CardCheckboxOptionCommon";
+import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF.scss";
+export declare const CardCheckboxOption: (props: CardCheckboxOptionProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Icon } from "../../../Icon/IconLF";
+import { Checkbox } from "../Checkbox/CheckboxLF";
+import { CardCheckboxOptionCommon, } from "./CardCheckboxOptionCommon";
+import "@axa-fr/design-system-apollo-css/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF.scss";
+export const CardCheckboxOption = (props) => (_jsx(CardCheckboxOptionCommon, { ...props, CheckboxComponent: Checkbox, IconComponent: Icon }));

package/dist/Grid/DebugGridApollo.d.ts

@@ -1,4 +1,2 @@
-import { type DebugGridCommonProps } from "./DebugGridCommon";
-type DebugGridProps<P = object> = Omit<DebugGridCommonProps<P>, "CardCheckbox">;
+import { type DebugGridProps } from "./DebugGridCommon";
 export declare const DebugGrid: <P = object>({ ...props }: DebugGridProps<P>) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/Grid/DebugGridApollo.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { CardCheckbox } from "../Form/Checkbox/CardCheckbox/CardCheckboxApollo";
+import { CardCheckboxOption } from "../Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo";
 import { DebugGridCommon } from "./DebugGridCommon";
 export const DebugGrid = ({ ...props }) => {
-    return (_jsx(DebugGridCommon, { ...props, CardCheckbox: CardCheckbox }));
+    return _jsx(DebugGridCommon, { ...props, CardCheckboxOption: CardCheckboxOption });
 };

package/dist/Grid/DebugGridCommon.d.ts

@@ -1,9 +1,11 @@
 import "@axa-fr/design-system-apollo-css/dist/Grid/DebugGrid.scss";
-import type { ComponentProps, ComponentType } from "react";
-import type { CardCheckboxCommon } from "../Form/Checkbox/CardCheckbox/CardCheckboxCommon";
-export type DebugGridCommonProps<P = object> = P & {
+import type { ComponentType } from "react";
+import type { CardCheckboxOptionProps } from "../Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon";
+export type DebugGridProps<P = object> = P & {
     cols?: number;
     isCheckedByDefault?: boolean;
-    CardCheckbox: ComponentType<Partial<ComponentProps<typeof CardCheckboxCommon>>>;
 };
-export declare const DebugGridCommon: <P = object>({ cols, isCheckedByDefault, CardCheckbox, ...props }: DebugGridCommonProps<P>) => import("react/jsx-runtime").JSX.Element | null;
+export type DebugGridCommonProps<P = object> = DebugGridProps<P> & {
+    CardCheckboxOption: ComponentType<CardCheckboxOptionProps>;
+};
+export declare const DebugGridCommon: <P = object>({ cols, isCheckedByDefault, CardCheckboxOption, ...props }: DebugGridCommonProps<P>) => import("react/jsx-runtime").JSX.Element | null;

package/dist/Grid/DebugGridCommon.js

@@ -1,16 +1,10 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import "@axa-fr/design-system-apollo-css/dist/Grid/DebugGrid.scss";
-export const DebugGridCommon = ({ cols = 12, isCheckedByDefault = false, CardCheckbox, ...props }) => {
+export const DebugGridCommon = ({ cols = 12, isCheckedByDefault = false, CardCheckboxOption, ...props }) => {
     // The forceVisible prop is a hidden prop to force the component's visibility when building the storybook
     const forceVisible = props?.forceVisible || false;
     if (process.env.NODE_ENV === "production" && !forceVisible) {
         return null;
     }
-    return (_jsxs(_Fragment, { children: [_jsx(CardCheckbox, { type: "horizontal", options: [
-                    {
-                        name: "debuggrid",
-                        label: "Grid",
-                        defaultChecked: isCheckedByDefault,
-                    },
-                ] }), _jsx("div", { className: "debug-grid", role: "presentation", children: _jsx("div", { className: "grid", children: [...Array(cols).keys()].map((col) => (_jsx("div", { className: "cols" }, col))) }) })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(CardCheckboxOption, { type: "horizontal", name: "debuggrid", label: "Grid", defaultChecked: isCheckedByDefault }), _jsx("div", { className: "debug-grid", role: "presentation", children: _jsx("div", { className: "grid", children: [...Array(cols).keys()].map((col) => (_jsx("div", { className: "cols" }, col))) }) })] }));
 };

package/dist/Grid/DebugGridLF.d.ts

@@ -1,4 +1,2 @@
-import { type DebugGridCommonProps } from "./DebugGridCommon";
-type DebugGridProps<P = object> = Omit<DebugGridCommonProps<P>, "CardCheckbox">;
+import { type DebugGridProps } from "./DebugGridCommon";
 export declare const DebugGrid: <P = object>({ ...props }: DebugGridProps<P>) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/Grid/DebugGridLF.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { CardCheckbox } from "../Form/Checkbox/CardCheckbox/CardCheckboxLF";
+import { CardCheckboxOption } from "../Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF";
 import { DebugGridCommon } from "./DebugGridCommon";
 export const DebugGrid = ({ ...props }) => {
-    return (_jsx(DebugGridCommon, { ...props, CardCheckbox: CardCheckbox }));
+    return _jsx(DebugGridCommon, { ...props, CardCheckboxOption: CardCheckboxOption });
 };

package/dist/index.d.ts

@@ -17,6 +17,7 @@ export { CardCheckbox,
 /** @deprecated Use `CardCheckbox` instead. */
 CardCheckbox as CheckboxCard, } from "./Form/Checkbox/CardCheckbox/CardCheckboxApollo";
 export { CheckboxText } from "./Form/Checkbox/CheckboxText/CheckboxTextApollo";
+export { CardCheckboxOption } from "./Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo";
 export { InputDate } from "./Form/InputDate/InputDateApollo";
 export { ItemLabel } from "./Form/ItemLabel/ItemLabelApollo";
 export { ItemMessage } from "./Form/ItemMessage/ItemMessageApollo";

package/dist/index.js

@@ -17,6 +17,7 @@ export { CardCheckbox,
 /** @deprecated Use `CardCheckbox` instead. */
 CardCheckbox as CheckboxCard, } from "./Form/Checkbox/CardCheckbox/CardCheckboxApollo";
 export { CheckboxText } from "./Form/Checkbox/CheckboxText/CheckboxTextApollo";
+export { CardCheckboxOption } from "./Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo";
 export { InputDate } from "./Form/InputDate/InputDateApollo";
 export { ItemLabel } from "./Form/ItemLabel/ItemLabelApollo";
 export { ItemMessage } from "./Form/ItemMessage/ItemMessageApollo";

package/dist/indexLF.d.ts

@@ -17,6 +17,7 @@ export { CardCheckbox,
 /** @deprecated Use `CardCheckbox` instead. */
 CardCheckbox as CheckboxCard, } from "./Form/Checkbox/CardCheckbox/CardCheckboxLF";
 export { CheckboxText } from "./Form/Checkbox/CheckboxText/CheckboxTextLF";
+export { CardCheckboxOption } from "./Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF";
 export { InputDate, 
 /** @deprecated Use `InputDate` instead. */
 InputDate as DateInput, } from "./Form/InputDate/InputDateLF";

package/dist/indexLF.js

@@ -17,6 +17,7 @@ export { CardCheckbox,
 /** @deprecated Use `CardCheckbox` instead. */
 CardCheckbox as CheckboxCard, } from "./Form/Checkbox/CardCheckbox/CardCheckboxLF";
 export { CheckboxText } from "./Form/Checkbox/CheckboxText/CheckboxTextLF";
+export { CardCheckboxOption } from "./Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF";
 export { InputDate, 
 /** @deprecated Use `InputDate` instead. */
 InputDate as DateInput, } from "./Form/InputDate/InputDateLF";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@axa-fr/design-system-apollo-react",
-  "version": "1.0.5-alpha.411",
+  "version": "1.0.5-alpha.416",
   "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": "1.0.5-alpha.411",
-    "@axa-fr/design-system-look-and-feel-css": "1.0.5-alpha.411",
+    "@axa-fr/design-system-apollo-css": "1.0.5-alpha.416",
+    "@axa-fr/design-system-look-and-feel-css": "1.0.5-alpha.416",
     "@material-symbols/svg-400": ">= 0.19.0",
     "react": ">= 18"
   },

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

@@ -1,15 +0,0 @@
-import { type ReactNode } from "react";
-import type { CheckboxComponent, IconComponent } from "./types";
-export type TCardCheckboxItem = {
-    label: ReactNode;
-    subtitle?: ReactNode;
-    description?: ReactNode;
-    hasError?: boolean;
-    icon?: string;
-} & Omit<React.InputHTMLAttributes<HTMLInputElement>, "disabled" | "size">;
-type CardCheckboxItemProps = {
-    size: "M" | "L";
-    errorId: string;
-} & TCardCheckboxItem & CheckboxComponent & IconComponent;
-export declare const CardCheckboxItem: ({ CheckboxComponent, IconComponent, id, label, description, subtitle, icon, errorId, hasError, size, ...inputProps }: CardCheckboxItemProps) => import("react/jsx-runtime").JSX.Element;
-export {};

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

@@ -1,7 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useId } from "react";
-export const CardCheckboxItem = ({ CheckboxComponent, IconComponent, id, label, description, subtitle, icon, errorId, hasError, size, ...inputProps }) => {
-    let inputId = useId();
-    inputId = id ?? inputId;
-    return (_jsxs("label", { htmlFor: inputId, className: "af-card-checkbox-label", "aria-invalid": hasError, children: [_jsx(CheckboxComponent, { id: inputId, errorId: errorId, hasError: hasError, ...inputProps }), _jsxs("div", { className: "af-card-checkbox-content", children: [icon ? _jsx(IconComponent, { src: icon, size: size }) : null, _jsxs("div", { className: "af-card-checkbox-content-description", children: [_jsx("span", { children: label }), description ? _jsx("span", { children: description }) : null, subtitle ? _jsx("span", { children: subtitle }) : null] })] })] }));
-};