@axa-fr/design-system-apollo-react 1.0.5-alpha.278 → 1.0.5-alpha.279

package/dist/Form/Radio/Radio/RadioApollo.d.ts

@@ -0,0 +1,6 @@
+import "@axa-fr/design-system-apollo-css/dist/Form/Radio/Radio/RadioApollo.scss";
+import { RadioProps } from "./RadioCommon";
+export declare const Radio: {
+    (props: RadioProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/Form/Radio/Radio/RadioApollo.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@axa-fr/design-system-apollo-css/dist/Form/Radio/Radio/RadioApollo.scss";
+import { RadioCommon } from "./RadioCommon";
+export const Radio = (props) => _jsx(RadioCommon, { ...props });
+Radio.displayName = "Radio";

package/dist/Form/Radio/Radio/RadioCommon.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+export type RadioProps = {
+    errorId?: string;
+    hasError?: boolean;
+} & Omit<React.InputHTMLAttributes<HTMLInputElement>, "disabled">;
+export declare const RadioCommon: {
+    ({ errorId, hasError, ...inputProps }: RadioProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/Form/Radio/Radio/RadioCommon.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const RadioCommon = ({ errorId, hasError, ...inputProps }) => (_jsxs("span", { className: "af-radio", "aria-invalid": hasError, "aria-errormessage": errorId, children: [_jsx("input", { ...inputProps, type: "radio" }), _jsx("span", { className: "af-radio__icons" })] }));
+RadioCommon.displayName = "RadioCommon";

package/dist/Form/Radio/Radio/RadioLF.d.ts

@@ -0,0 +1,6 @@
+import "@axa-fr/design-system-apollo-css/dist/Form/Radio/Radio/RadioLF.scss";
+import { RadioProps } from "./RadioCommon";
+export declare const Radio: {
+    (props: RadioProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/Form/Radio/Radio/RadioLF.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@axa-fr/design-system-apollo-css/dist/Form/Radio/Radio/RadioLF.scss";
+import { RadioCommon } from "./RadioCommon";
+export const Radio = (props) => _jsx(RadioCommon, { ...props });
+Radio.displayName = "Radio";

package/dist/Form/Radio/RadioCard/RadioCardApollo.d.ts

@@ -0,0 +1,6 @@
+import "@axa-fr/design-system-apollo-css/dist/Form/Radio/RadioCard/RadioCardApollo.scss";
+import { RadioCardProps } from "./RadioCardCommon";
+export declare const RadioCard: {
+    (props: RadioCardProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/Form/Radio/RadioCard/RadioCardApollo.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@axa-fr/design-system-apollo-css/dist/Form/Radio/RadioCard/RadioCardApollo.scss";
+import { Icon } from "../../../Icon/IconApollo";
+import { RadioCardCommon } from "./RadioCardCommon";
+import { Radio } from "../Radio/RadioApollo";
+import { ItemMessage } from "../../ItemMessage/ItemMessageApollo";
+export const RadioCard = (props) => (_jsx(RadioCardCommon, { ...props, IconComponent: Icon, RadioComponent: Radio, ItemMessageComponent: ItemMessage }));
+RadioCard.displayName = "RadioCard";

package/dist/Form/Radio/RadioCard/RadioCardCommon.d.ts

@@ -0,0 +1,34 @@
+import React, { type ComponentProps, ComponentPropsWithRef, type ComponentType, type ReactNode } from "react";
+import { Icon } from "../../../Icon/IconCommon";
+import { ItemMessage } from "../../ItemMessage/ItemMessageLF";
+import { RadioProps } from "../Radio/RadioCommon";
+type RadioComponent = {
+    RadioComponent: ComponentType<RadioProps>;
+};
+type IconComponent = {
+    IconComponent: ComponentType<ComponentProps<typeof Icon>>;
+};
+export type RadioCardProps = ComponentPropsWithRef<"input"> & {
+    type: "vertical" | "horizontal";
+    labelGroup?: string;
+    descriptionGroup?: string;
+    isRequired?: boolean;
+    value?: number;
+    options: ({
+        label: ReactNode;
+        subtitle?: ReactNode;
+        description?: ReactNode;
+        hasError?: boolean;
+        icon?: string;
+    } & Omit<React.InputHTMLAttributes<HTMLInputElement>, "disabled">)[];
+    onChange?: React.ChangeEventHandler;
+    error?: string;
+};
+export type RadioCardCommonProps = RadioCardProps & RadioComponent & IconComponent & {
+    ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
+};
+declare const RadioCardCommon: {
+    ({ className, labelGroup, descriptionGroup, RadioComponent, IconComponent, isRequired, options, type, error, name, onChange, ItemMessageComponent, }: RadioCardCommonProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { RadioCardCommon };

package/dist/Form/Radio/RadioCard/RadioCardCommon.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId, } from "react";
+import { getComponentClassName } from "../../../utilities/getComponentClassName";
+import { useIsSmallScreen } from "../../../utilities/hook/useIsSmallScreen";
+import { BREAKPOINT } from "../../../utilities/constants";
+const RadioCardCommon = ({ className, labelGroup, descriptionGroup, RadioComponent, IconComponent, isRequired, options, type = "vertical", error, name, onChange, ItemMessageComponent, }) => {
+    const componentClassName = getComponentClassName("af-radio-card__container", className);
+    const RadioGroupClassName = getComponentClassName("af-radio-card-group", className, type);
+    const errorId = useId();
+    const isMobile = useIsSmallScreen(BREAKPOINT.SM);
+    const size = isMobile ? "M" : "L";
+    return (_jsxs("fieldset", { className: componentClassName, children: [_jsx("div", { className: "af-radio-card__label-container", children: _jsxs("legend", { children: [labelGroup && (_jsxs("span", { className: "af-radio-card__label", children: [labelGroup, isRequired && _jsx("span", { "aria-hidden": true, children: "\u00A0*" })] })), descriptionGroup && (_jsx("p", { className: "af-radio-card__description", children: descriptionGroup }))] }) }), _jsx("div", { className: RadioGroupClassName, children: options.map(({ label, description, subtitle, icon, hasError, ...inputProps }, index) => (_jsxs("label", { "aria-invalid": Boolean(error) || hasError, htmlFor: `id-${name ?? inputProps.name}-${index}`, className: "af-radio-card-label", children: [_jsx(RadioComponent, { id: `id-${name ?? inputProps.name}-${index}`, errorId: errorId, hasError: Boolean(error) || hasError, ...inputProps, name: name ?? inputProps.name, onChange: onChange }), _jsxs("div", { className: "af-radio-card-content", children: [icon && _jsx(IconComponent, { src: icon, size: size }), _jsxs("div", { className: "af-radio-card-content-description", children: [_jsx("span", { children: label }), description && _jsx("span", { children: description }), subtitle && _jsx("span", { children: subtitle })] })] })] }, `${name ?? inputProps.name}`))) }), _jsx(ItemMessageComponent, { id: errorId, message: error, messageType: "error" })] }));
+};
+RadioCardCommon.displayName = "RadioCardCommon";
+export { RadioCardCommon };

package/dist/Form/Radio/RadioCard/RadioCardLF.d.ts

@@ -0,0 +1,6 @@
+import "@axa-fr/design-system-apollo-css/dist/Form/Radio/RadioCard/RadioCardLF.scss";
+import { RadioCardProps } from "./RadioCardCommon";
+export declare const RadioCard: {
+    (props: RadioCardProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/Form/Radio/RadioCard/RadioCardLF.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@axa-fr/design-system-apollo-css/dist/Form/Radio/RadioCard/RadioCardLF.scss";
+import { Icon } from "../../../Icon/IconLF";
+import { RadioCardCommon } from "./RadioCardCommon";
+import { Radio } from "../Radio/RadioLF";
+import { ItemMessage } from "../../ItemMessage/ItemMessageLF";
+export const RadioCard = (props) => (_jsx(RadioCardCommon, { ...props, IconComponent: Icon, RadioComponent: Radio, ItemMessageComponent: ItemMessage }));
+RadioCard.displayName = "RadioCard";

package/dist/index.d.ts

@@ -16,6 +16,8 @@ export { ItemLabel } from "./Form/ItemLabel/ItemLabelApollo";
 export { ItemMessage } from "./Form/ItemMessage/ItemMessageApollo";
 export { Select } from "./Form/Select/SelectApollo";
 export { TextArea } from "./Form/TextArea/TextAreaApollo";
+export { Radio } from "./Form/Radio/Radio/RadioApollo";
+export { RadioCard } from "./Form/Radio/RadioCard/RadioCardApollo";
 export { TextInput } from "./Form/TextInput/TextInputApollo";
 export { DebugGrid } from "./Grid/DebugGridApollo";
 export { Heading, type HeadingLevel } from "./Heading/HeadingApollo";

package/dist/index.js

@@ -16,6 +16,8 @@ export { ItemLabel } from "./Form/ItemLabel/ItemLabelApollo";
 export { ItemMessage } from "./Form/ItemMessage/ItemMessageApollo";
 export { Select } from "./Form/Select/SelectApollo";
 export { TextArea } from "./Form/TextArea/TextAreaApollo";
+export { Radio } from "./Form/Radio/Radio/RadioApollo";
+export { RadioCard } from "./Form/Radio/RadioCard/RadioCardApollo";
 export { TextInput } from "./Form/TextInput/TextInputApollo";
 export { DebugGrid } from "./Grid/DebugGridApollo";
 export { Heading } from "./Heading/HeadingApollo";

package/dist/indexLF.d.ts

@@ -15,6 +15,8 @@ export { ItemLabel } from "./Form/ItemLabel/ItemLabelLF";
 export { ItemMessage } from "./Form/ItemMessage/ItemMessageLF";
 export { Select } from "./Form/Select/SelectLF";
 export { TextArea } from "./Form/TextArea/TextAreaLF";
+export { Radio } from "./Form/Radio/Radio/RadioLF";
+export { RadioCard } from "./Form/Radio/RadioCard/RadioCardLF";
 export { TextInput } from "./Form/TextInput/TextInputLF";
 export { DebugGrid } from "./Grid/DebugGridLF";
 export { Heading, type HeadingLevel } from "./Heading/HeadingLF";

package/dist/indexLF.js

@@ -15,6 +15,8 @@ export { ItemLabel } from "./Form/ItemLabel/ItemLabelLF";
 export { ItemMessage } from "./Form/ItemMessage/ItemMessageLF";
 export { Select } from "./Form/Select/SelectLF";
 export { TextArea } from "./Form/TextArea/TextAreaLF";
+export { Radio } from "./Form/Radio/Radio/RadioLF";
+export { RadioCard } from "./Form/Radio/RadioCard/RadioCardLF";
 export { TextInput } from "./Form/TextInput/TextInputLF";
 export { DebugGrid } from "./Grid/DebugGridLF";
 export { Heading } from "./Heading/HeadingLF";

package/package.json

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