@axa-fr/design-system-apollo-react 1.0.5-alpha.314 → 1.0.5-alpha.319

package/dist/Grid/DebugGridApollo.d.ts

@@ -1,5 +1,4 @@
-import "@axa-fr/design-system-apollo-css/dist/Grid/DebugGrid.scss";
-export declare const DebugGrid: ({ cols, isCheckedByDefault, }: {
-    cols?: number;
-    isCheckedByDefault?: boolean;
-}) => import("react/jsx-runtime").JSX.Element;
+import { type DebugGridCommonProps } from "./DebugGridCommon";
+type DebugGridProps<P = object> = Omit<DebugGridCommonProps<P>, "CardCheckbox">;
+export declare const DebugGrid: <P = object>({ ...props }: DebugGridProps<P>) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Grid/DebugGridApollo.js

@@ -1,17 +1,6 @@
-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";
-import { useState } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { CardCheckbox } from "../Form/Checkbox/CardCheckbox/CardCheckboxApollo";
 import { DebugGridCommon } from "./DebugGridCommon";
-export const DebugGrid = ({ cols = 12, isCheckedByDefault = false, }) => {
-    const [checked, setChecked] = useState(isCheckedByDefault);
-    const handleChecked = () => setChecked(!checked);
-    return (_jsxs(_Fragment, { children: [_jsx(CardCheckbox, { type: "horizontal", options: [
-                    {
-                        name: "debuggrid",
-                        label: "Grid",
-                        checked,
-                        onClick: handleChecked,
-                    },
-                ] }), _jsx(DebugGridCommon, { cols: cols })] }));
+export const DebugGrid = ({ ...props }) => {
+    return (_jsx(DebugGridCommon, { ...props, CardCheckbox: CardCheckbox }));
 };

package/dist/Grid/DebugGridCommon.d.ts

@@ -1,4 +1,9 @@
 import "@axa-fr/design-system-apollo-css/dist/Grid/DebugGrid.scss";
-export declare const DebugGridCommon: ({ cols }: {
+import type { ComponentProps, ComponentType } from "react";
+import type { CardCheckboxCommon } from "../Form/Checkbox/CardCheckbox/CardCheckboxCommon";
+export type DebugGridCommonProps<P = object> = P & {
     cols?: number;
-}) => import("react/jsx-runtime").JSX.Element;
+    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;

package/dist/Grid/DebugGridCommon.js

@@ -1,5 +1,16 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+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 }) => {
-    return (_jsx("div", { className: "debug-grid", children: _jsx("div", { className: "grid", children: [...Array(cols).keys()].map((col) => (_jsx("div", { className: "cols" }, col))) }) }));
+export const DebugGridCommon = ({ cols = 12, isCheckedByDefault = false, CardCheckbox, ...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))) }) })] }));
 };

package/dist/Grid/DebugGridLF.d.ts

@@ -1,5 +1,4 @@
-import "@axa-fr/design-system-apollo-css/dist/Grid/DebugGrid.scss";
-export declare const DebugGrid: ({ cols, isCheckedByDefault, }: {
-    cols?: number;
-    isCheckedByDefault?: boolean;
-}) => import("react/jsx-runtime").JSX.Element;
+import { type DebugGridCommonProps } from "./DebugGridCommon";
+type DebugGridProps<P = object> = Omit<DebugGridCommonProps<P>, "CardCheckbox">;
+export declare const DebugGrid: <P = object>({ ...props }: DebugGridProps<P>) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Grid/DebugGridLF.js

@@ -1,17 +1,6 @@
-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";
-import { useState } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { CardCheckbox } from "../Form/Checkbox/CardCheckbox/CardCheckboxLF";
 import { DebugGridCommon } from "./DebugGridCommon";
-export const DebugGrid = ({ cols = 12, isCheckedByDefault = false, }) => {
-    const [checked, setChecked] = useState(isCheckedByDefault);
-    const handleChecked = () => setChecked(!checked);
-    return (_jsxs(_Fragment, { children: [_jsx(CardCheckbox, { type: "horizontal", options: [
-                    {
-                        name: "debuggrid",
-                        label: "Grid",
-                        checked,
-                        onClick: handleChecked,
-                    },
-                ] }), _jsx(DebugGridCommon, { cols: cols })] }));
+export const DebugGrid = ({ ...props }) => {
+    return (_jsx(DebugGridCommon, { ...props, CardCheckbox: CardCheckbox }));
 };

package/dist/Stepper/StepperCommon.d.ts

@@ -1,4 +1,4 @@
-import { ComponentType, HTMLAttributes } from "react";
+import { ComponentType, type HTMLAttributes } from "react";
 import { ProgressBarGroupProps } from "../ProgressBarGroup/ProgressBarGroupCommon";
 export type StepperProps = {
     currentStepProgress?: number;
@@ -8,6 +8,7 @@ export type StepperProps = {
     nbSteps?: 3 | 4 | 5 | 6 | 7 | 8;
     helper?: string;
     message?: string;
+    titleLevel?: 1 | 2 | 3;
     ProgressBarGroupComponent: ComponentType<Omit<ProgressBarGroupProps, "ProgressBarComponent">>;
 } & Omit<HTMLAttributes<HTMLDivElement>, "role">;
-export declare const Stepper: ({ currentStepProgress, currentTitle, nbSteps, currentStep, currentSubtitle, className, ProgressBarGroupComponent, helper, message, ...props }: StepperProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Stepper: ({ currentStepProgress, currentTitle, nbSteps, currentStep, currentSubtitle, className, ProgressBarGroupComponent, helper, message, titleLevel, ...props }: StepperProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Stepper/StepperCommon.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useId } from "react";
+import { useId, } from "react";
 import { ItemMessage } from "../Form/ItemMessage/ItemMessageCommon";
-export const Stepper = ({ currentStepProgress, currentTitle, nbSteps, currentStep, currentSubtitle, className, ProgressBarGroupComponent, helper, message, ...props }) => {
+export const Stepper = ({ currentStepProgress, currentTitle, nbSteps, currentStep, currentSubtitle, className, ProgressBarGroupComponent, helper, message, titleLevel = 2, ...props }) => {
     const stepperId = useId();
-    return (_jsxs("div", { className: "af-stepper", ...props, children: [_jsxs("div", { className: "af-stepper__header", children: [_jsx("h2", { className: "af-stepper__title", "aria-describedby": stepperId, children: currentTitle }), Boolean(currentSubtitle) && (_jsx("p", { className: "af-stepper__subtitle", children: currentSubtitle }))] }), _jsx(ProgressBarGroupComponent, { label: currentTitle, className: className, currentStep: currentStep, nbSteps: nbSteps, currentStepProgress: currentStepProgress }), Boolean(helper) && _jsx("span", { className: "af-stepper__helper", children: helper }), _jsx(ItemMessage, { message: message, messageType: "success" })] }));
+    const Title = `h${titleLevel}`;
+    return (_jsxs("div", { className: "af-stepper", ...props, children: [_jsxs("div", { className: "af-stepper__header", children: [_jsx(Title, { className: "af-stepper__title", "aria-describedby": stepperId, children: currentTitle }), Boolean(currentSubtitle) && (_jsx("p", { className: "af-stepper__subtitle", children: currentSubtitle }))] }), _jsx(ProgressBarGroupComponent, { label: currentTitle, className: className, currentStep: currentStep, nbSteps: nbSteps, currentStepProgress: currentStepProgress }), Boolean(helper) && _jsx("span", { className: "af-stepper__helper", children: helper }), _jsx(ItemMessage, { message: message, messageType: "success" })] }));
 };

package/package.json

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