@axa-fr/design-system-slash-react 0.2.0-beta.281 → 0.2.0-beta.283

package/dist/IconBg/IconBg.client.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
-import { getComponentClassName } from "../agent";
+import { getComponentClassName } from "../Form/core";
 export const IconBg = ({ children, className, classModifier, isDisabled = false, }) => {
     const componentClassName = useMemo(() => {
         let newClassModifier = classModifier;

package/dist/List/ContentItemDuo/ContentItemDuo.d.ts

@@ -0,0 +1,13 @@
+type ContentItemDuoProps = {
+    label: string;
+    value: string;
+    isVertical?: boolean;
+    className?: string;
+    classModifier?: string;
+    isShowingDoneIcon?: boolean;
+    isShowingCloseIcon?: boolean;
+    buttonText?: string;
+    onButtonClick?: () => void;
+};
+export declare const ContentItemDuo: ({ label, value, isVertical, className, classModifier, isShowingDoneIcon, isShowingCloseIcon, buttonText, onButtonClick, }: ContentItemDuoProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/List/ContentItemDuo/ContentItemDuo.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import checkIcon from "@material-symbols/svg-400/outlined/check.svg";
+import closeIcon from "@material-symbols/svg-400/outlined/close.svg";
+import { useMemo } from "react";
+import { Variants } from "../../Button/Button.client";
+import { getComponentClassName } from "../../Form/core";
+import { Button, Svg } from "../../client";
+export const ContentItemDuo = ({ label, value, isVertical = false, className, classModifier, isShowingDoneIcon = false, isShowingCloseIcon = false, buttonText, onButtonClick, }) => {
+    const componentClassName = useMemo(() => {
+        const classModifiers = [classModifier];
+        if (isVertical) {
+            classModifiers.push("vertical");
+        }
+        return getComponentClassName(className, classModifiers.filter(Boolean).join(" "), "af-content-item-duo");
+    }, [classModifier, className, isVertical]);
+    const iconContainerModifier = useMemo(() => ` af-content-item-duo__icon--${isShowingDoneIcon ? "done" : "close"}`, [isShowingDoneIcon]);
+    return (_jsxs("div", { className: componentClassName, children: [(isShowingDoneIcon || isShowingCloseIcon) && (_jsxs("div", { className: `af-content-item-duo__icon${iconContainerModifier}`, children: [isShowingDoneIcon && _jsx(Svg, { src: checkIcon }), isShowingCloseIcon && _jsx(Svg, { src: closeIcon })] })), _jsx("p", { className: "af-content-item-duo__label", children: label }), _jsx("p", { className: "af-content-item-duo__value", children: value }), buttonText && (_jsx("div", { className: "af-content-item-duo__button", children: _jsx(Button, { variant: Variants.ghost, onClick: onButtonClick, children: buttonText }) }))] }));
+};

package/dist/List/ContentItemDuo/ContentItemDuo.stories.d.ts

@@ -0,0 +1,28 @@
+import { Meta, StoryObj } from "@storybook/react";
+import type { ComponentProps } from "react";
+import { ContentItemDuo } from ".";
+import { List } from "../List";
+declare const meta: Meta<typeof ContentItemDuo>;
+export default meta;
+export declare const Default: StoryObj<Omit<ComponentProps<typeof ContentItemDuo>, "classModifier"> & {
+    classModifier: string[];
+}>;
+export declare const Vertical: StoryObj<Omit<ComponentProps<typeof ContentItemDuo>, "classModifier"> & {
+    classModifier: string[];
+}>;
+export declare const DefaultContentItemDuoList: StoryObj<{
+    items: Array<Omit<ComponentProps<typeof ContentItemDuo>, "classModifier"> & {
+        id: string;
+        classModifier: string[];
+    }>;
+} & Omit<ComponentProps<typeof List>, "classModifier"> & {
+    classModifier: string[];
+}>;
+export declare const VerticalContentItemDuoList: StoryObj<{
+    items: Array<Omit<ComponentProps<typeof ContentItemDuo>, "classModifier"> & {
+        id: string;
+        classModifier: string[];
+    }>;
+} & Omit<ComponentProps<typeof List>, "classModifier"> & {
+    classModifier: string[];
+}>;

package/dist/List/ContentItemDuo/ContentItemDuo.stories.js

@@ -0,0 +1,86 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ContentItemDuo } from ".";
+import { List } from "../List";
+const meta = {
+    title: "Client/Components/List/ContentItemDuo",
+    component: ContentItemDuo,
+};
+export default meta;
+const defaultArgs = {
+    isVertical: false,
+    label: "Libellé",
+    value: "Réponse",
+    isShowingDoneIcon: true,
+    isShowingCloseIcon: false,
+    buttonText: "En savoir plus",
+    classModifier: [],
+};
+const verticalArgs = {
+    isVertical: true,
+    label: "Le choc de véhicules terrestres à moteur, (voiture, trottinette à moteur…) ou la chute d’appareils aériens (avions, hélicoptères…) avec un propriétaire du véhicule adverse identifié ?",
+    value: "Les incendies, explosions, implosions, fumée et foudre",
+    isShowingDoneIcon: true,
+    isShowingCloseIcon: false,
+    buttonText: "En savoir plus",
+    classModifier: [],
+};
+export const Default = {
+    name: "Default",
+    render: ({ classModifier, ...args }) => (_jsx(ContentItemDuo, { classModifier: classModifier.join(" "), ...args })),
+    args: defaultArgs,
+    argTypes: {
+        classModifier: {
+            options: ["large"],
+            control: { type: "multi-select" },
+            defaultValue: [],
+        },
+    },
+};
+export const Vertical = {
+    name: "Vertical",
+    render: ({ classModifier, ...args }) => (_jsx(ContentItemDuo, { classModifier: classModifier.join(" "), ...args })),
+    args: verticalArgs,
+    argTypes: {
+        classModifier: {
+            options: ["large"],
+            control: { type: "multi-select" },
+            defaultValue: [],
+        },
+    },
+};
+export const DefaultContentItemDuoList = {
+    name: "Default ContentItemDuo List",
+    render: ({ classModifier, items }) => (_jsx(List, { classModifier: classModifier.join(" "), children: items.map(({ classModifier: itemClassModifier, ...itemArgs }) => (_jsx(ContentItemDuo, { classModifier: itemClassModifier.join(" "), ...itemArgs }, itemArgs.id))) })),
+    args: {
+        items: Array.from({ length: 3 }, (_, i) => ({
+            id: i.toString(),
+            ...defaultArgs,
+        })),
+        classModifier: ["extra-padding"],
+    },
+    argTypes: {
+        classModifier: {
+            options: ["extra-padding", "large"],
+            control: { type: "multi-select" },
+            defaultValue: ["extra-padding"],
+        },
+    },
+};
+export const VerticalContentItemDuoList = {
+    name: "Vertical ContentItemDuo List",
+    render: ({ classModifier, items }) => (_jsx(List, { classModifier: classModifier.join(" "), children: items.map(({ classModifier: itemClassModifier, ...itemArgs }) => (_jsx(ContentItemDuo, { classModifier: itemClassModifier.join(" "), ...itemArgs }, itemArgs.id))) })),
+    args: {
+        items: Array.from({ length: 3 }, (_, i) => ({
+            id: i.toString(),
+            ...verticalArgs,
+        })),
+        classModifier: ["extra-padding"],
+    },
+    argTypes: {
+        classModifier: {
+            options: ["extra-padding", "large"],
+            control: { type: "multi-select" },
+            defaultValue: ["extra-padding"],
+        },
+    },
+};

package/dist/List/ContentItemDuo/__tests__/ContentItemDuo.test.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen, waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { ContentItemDuo } from "../ContentItemDuo";
+describe("ContentItemDuo", () => {
+    const label = "Sample Label";
+    const value = "Sample Value";
+    it("should render label and value correctly", () => {
+        render(_jsx(ContentItemDuo, { label: label, value: value }));
+        expect(screen.getByText(label)).toBeInTheDocument();
+        expect(screen.getByText(value)).toBeInTheDocument();
+    });
+    it("should render button with correct text and call onClick handler", async () => {
+        const buttonText = "button";
+        const onButtonClick = vi.fn();
+        render(_jsx(ContentItemDuo, { label: label, value: value, buttonText: buttonText, onButtonClick: onButtonClick }));
+        const buttonElement = screen.getByText(buttonText);
+        expect(buttonElement).toBeInTheDocument();
+        userEvent.click(buttonElement);
+        await waitFor(() => {
+            expect(onButtonClick).toHaveBeenCalled();
+        });
+    });
+    it("should render vertical layout when isVertical prop is true", () => {
+        render(_jsx(ContentItemDuo, { label: label, value: value, isVertical: true }));
+        expect(screen.getByText(label).parentElement).toHaveClass("af-content-item-duo--vertical");
+    });
+    it("should render done icon when isShowingDoneIcon prop is true", () => {
+        const { container } = render(_jsx(ContentItemDuo, { label: label, value: value, isShowingDoneIcon: true }));
+        const svgElement = container.querySelector("svg");
+        expect(svgElement).toBeInTheDocument();
+        expect(svgElement?.parentElement).toHaveClass("af-content-item-duo__icon--done");
+    });
+    it("should render close icon when isShowingCloseIcon prop is true", () => {
+        const { container } = render(_jsx(ContentItemDuo, { label: label, value: value, isShowingCloseIcon: true }));
+        const svgElement = container.querySelector("svg");
+        expect(svgElement).toBeInTheDocument();
+        expect(svgElement?.parentElement).toHaveClass("af-content-item-duo__icon--close");
+    });
+});

package/dist/List/ContentItemDuo/index.d.ts

@@ -0,0 +1,2 @@
+import "@axa-fr/design-system-slash-css/dist/List/ContentItemDuo/ContentItemDuo.scss";
+export { ContentItemDuo } from "./ContentItemDuo";

package/dist/List/ContentItemDuo/index.js

@@ -0,0 +1,2 @@
+import "@axa-fr/design-system-slash-css/dist/List/ContentItemDuo/ContentItemDuo.scss";
+export { ContentItemDuo } from "./ContentItemDuo";

package/dist/List/ContentTabList/ContentTabList.client.js

@@ -6,5 +6,5 @@ import { ContentTabItem } from "./ContentTabItem";
 const BREAKPOINT_SMALL = 668;
 export const ContentTabList = ({ items, classModifier, }) => {
     const isMobile = useIsSmallScreen(BREAKPOINT_SMALL);
-    return (_jsx(List, { classModifier: `list large content-tab-list ${classModifier}`, tabIndex: -1, children: items.map(({ id, ...item }) => (_jsx(ContentTabItem, { ...item, isMobile: isMobile }, id ?? item.title))) }));
+    return (_jsx(List, { classModifier: `list large extra-padding content-tab-list ${classModifier}`, tabIndex: -1, children: items.map(({ id, ...item }) => (_jsx(ContentTabItem, { ...item, isMobile: isMobile }, id ?? item.title))) }));
 };

package/dist/Title/{Title.agent.d.ts → Agent/Title.d.ts}

@@ -1,4 +1,4 @@
-import "@axa-fr/design-system-slash-css/dist/Title/Title.agent.scss";
+import "@axa-fr/design-system-slash-css/dist/Title/Agent/Title.scss";
 import { ComponentPropsWithRef, PropsWithChildren } from "react";
 type Headings = "h2" | "h3" | "h4";
 type TitleProps = ComponentPropsWithRef<"h2"> & {

package/dist/Title/{Title.agent.js → Agent/Title.js}

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import "@axa-fr/design-system-slash-css/dist/Title/Title.agent.scss";
+import "@axa-fr/design-system-slash-css/dist/Title/Agent/Title.scss";
 import { forwardRef } from "react";
-import { getComponentClassName } from "../Form/core";
+import { getComponentClassName } from "../../Form/core";
 export const Title = forwardRef(({ className, classModifier, children, heading: Heading = "h2", ...otherProps }, ref) => {
     const componentClassName = getComponentClassName(className, classModifier, "af-title");
     return (_jsx(Heading, { ref: ref, className: componentClassName, ...otherProps, children: children }));

package/dist/Title/{Title.agent.stories.d.ts → Agent/Title.stories.d.ts}

@@ -1,5 +1,5 @@
 import { Meta, StoryObj } from "@storybook/react";
-import { Title } from "./Title.agent";
+import { Title } from "./Title";
 declare const meta: Meta<typeof Title>;
 export default meta;
 type StoryProps = Omit<React.ComponentProps<typeof Title>, "classModifier" | "children"> & {

package/dist/Title/{Title.agent.stories.js → Agent/Title.stories.js}

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Title } from "./Title.agent";
-import { ButtonAgent as Button } from "../Button/Button.agent";
+import { ButtonAgent as Button } from "../../Button/Button.agent";
+import { Title } from "./Title";
 const meta = {
     title: "Agent/Components/Title",
     component: Title,

package/dist/Title/Agent/__tests__/Title.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Title/{__tests__ → Agent/__tests__}/Title.test.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { render, screen } from "@testing-library/react";
 import { axe } from "jest-axe";
-import { Title } from "../Title.agent";
+import { Title } from "../Title";
 describe("Title", () => {
     it("should render children", () => {
         render(_jsx(Title, { children: "A title" }));

package/dist/Title/Client/Title.d.ts

@@ -0,0 +1,13 @@
+import { type ReactNode } from "react";
+import { TitleSize } from "./constants";
+type TitleProps = {
+    children: ReactNode;
+    firstSubtitle: string;
+    className?: string;
+    classModifier?: string;
+    icon?: ReactNode;
+    secondSubtitle?: string;
+    size?: TitleSize;
+};
+export declare const Title: ({ children: title, className, classModifier, firstSubtitle, icon, secondSubtitle, size, }: TitleProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Title/Client/Title.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useMemo, } from "react";
+import { IconBg } from "../../client";
+import { getComponentClassName } from "../../Form/core";
+import { TitleSize } from "./constants";
+import { TitleWithSubtitles } from "./TitleWithSubtitles";
+export const Title = ({ children: title, className, classModifier, firstSubtitle, icon, secondSubtitle, size = TitleSize.XL, }) => {
+    const componentClassName = useMemo(() => getComponentClassName(className, classModifier ? `${classModifier} ${size}` : size, "af-title"), [classModifier, className, size]);
+    const TitleWithSubtitlesPart = useCallback(({ ...args }) => (_jsx(TitleWithSubtitles, { title: title, firstSubtitle: firstSubtitle, ...args })), [title, firstSubtitle]);
+    return (_jsx("div", { className: componentClassName, children: icon && size === TitleSize.XL ? (_jsxs(_Fragment, { children: [_jsx(IconBg, { className: "af-title__icon af-icon-bg", children: icon }), _jsx("div", { className: "af-title__text-container", children: _jsx(TitleWithSubtitlesPart, { secondSubtitle: secondSubtitle }) })] })) : (_jsx(TitleWithSubtitlesPart, {})) }));
+};

package/dist/Title/Client/Title.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { Title } from ".";
+declare const meta: Meta<typeof Title>;
+export default meta;
+export declare const TitleWithIcon: StoryObj<typeof Title>;
+export declare const TitleWithoutIcon: StoryObj<typeof Title>;

package/dist/Title/Client/Title.stories.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import article from "@material-symbols/svg-400/outlined/article-fill.svg";
+import { Title } from ".";
+import { Svg } from "../../Svg";
+import { TitleSize } from "./constants";
+const meta = {
+    title: "Client/Components/Title",
+    component: Title,
+};
+export default meta;
+export const TitleWithIcon = {
+    name: "Title With Icon",
+    render: (args) => _jsx(Title, { ...args }),
+    args: {
+        children: "Titre de la page",
+        firstSubtitle: "Sous-titre 1",
+        secondSubtitle: "Sous-titre 2",
+        icon: _jsx(Svg, { src: article }),
+        size: TitleSize.XL,
+    },
+    argTypes: {
+        size: {
+            options: Object.values(TitleSize),
+            control: { type: "select" },
+            defaultValue: TitleSize.XL,
+        },
+    },
+};
+export const TitleWithoutIcon = {
+    name: "Title Without Icon",
+    render: (args) => _jsx(Title, { ...args }),
+    args: {
+        children: "Titre de la page",
+        firstSubtitle: "Sous-titre 1",
+        secondSubtitle: "Sous-titre 2",
+        size: TitleSize.XL,
+    },
+    argTypes: {
+        size: {
+            options: Object.values(TitleSize),
+            control: { type: "select" },
+            defaultValue: TitleSize.XL,
+        },
+    },
+};

package/dist/Title/Client/TitleWithSubtitles.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode } from "react";
+type TitleTextProps = {
+    title: ReactNode;
+    firstSubtitle?: string;
+    secondSubtitle?: string;
+};
+export declare const TitleWithSubtitles: ({ title, firstSubtitle, secondSubtitle, }: TitleTextProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Title/Client/TitleWithSubtitles.js

@@ -0,0 +1,2 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+export const TitleWithSubtitles = ({ title, firstSubtitle, secondSubtitle, }) => (_jsxs(_Fragment, { children: [_jsx("h1", { className: "af-title__title", children: title }), firstSubtitle && (_jsx("span", { className: "af-title__subtitle", children: firstSubtitle })), secondSubtitle && (_jsx("span", { className: "af-title__subtitle", children: secondSubtitle }))] }));

package/dist/Title/Client/__tests__/Title.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Title/Client/__tests__/Title.test.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from "@testing-library/react";
+import { Title } from "..";
+import { TitleSize } from "../constants";
+describe("Title", () => {
+    it("should render correctly", () => {
+        render(_jsx(Title, { firstSubtitle: "firstSubtitle", secondSubtitle: "secondSubtitle", icon: "icon", children: "Title" }));
+        expect(screen.getByRole("heading", { name: "Title", level: 1 })).toBeInTheDocument();
+        expect(screen.getByText("firstSubtitle")).toBeInTheDocument();
+        expect(screen.getByText("secondSubtitle")).toBeInTheDocument();
+        expect(screen.getByText("icon")).toBeInTheDocument();
+    });
+    it("should have custom class", () => {
+        render(_jsx(Title, { firstSubtitle: "firstSubtitle", className: "custom-class", children: "Title" }));
+        expect(screen.getByText("Title").parentElement).toHaveClass("custom-class");
+    });
+    it("should have custom class with modifier", () => {
+        render(_jsx(Title, { firstSubtitle: "firstSubtitle", className: "custom-class", classModifier: "modifier", children: "Title" }));
+        expect(screen.getByText("Title").parentElement).toHaveClass("custom-class custom-class--modifier");
+    });
+    it('should not display icon and second subtitle when size is "L"', () => {
+        render(_jsx(Title, { firstSubtitle: "firstSubtitle", secondSubtitle: "secondSubtitle", icon: "icon", size: TitleSize.L, children: "Title" }));
+        expect(screen.getByRole("heading", { name: "Title", level: 1 })).toBeInTheDocument();
+        expect(screen.getByText("firstSubtitle")).toBeInTheDocument();
+        expect(screen.queryByText("secondSubtitle")).not.toBeInTheDocument();
+        expect(screen.queryByText("icon")).not.toBeInTheDocument();
+    });
+});

package/dist/Title/Client/__tests__/TitleWithSubtitles.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Title/Client/__tests__/TitleWithSubtitles.test.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from "@testing-library/react";
+import { TitleWithSubtitles } from "../TitleWithSubtitles";
+describe("TitleWithSubtitles", () => {
+    it("should render title and the two subtitles", () => {
+        const title = "Sample Title";
+        const firstSubtitle = "First Subtitle";
+        const secondSubtitle = "Second Subtitle";
+        render(_jsx(TitleWithSubtitles, { title: title, firstSubtitle: firstSubtitle, secondSubtitle: secondSubtitle }));
+        screen.getByRole("heading", { name: title, level: 1 });
+        expect(screen.getByText(firstSubtitle)).toBeInTheDocument();
+        expect(screen.getByText(secondSubtitle)).toBeInTheDocument();
+    });
+});

package/dist/Title/Client/constants.d.ts

@@ -0,0 +1,4 @@
+export declare enum TitleSize {
+    XL = "xl",
+    L = "l"
+}

package/dist/Title/Client/constants.js

@@ -0,0 +1,5 @@
+export var TitleSize;
+(function (TitleSize) {
+    TitleSize["XL"] = "xl";
+    TitleSize["L"] = "l";
+})(TitleSize || (TitleSize = {}));

package/dist/Title/Client/index.d.ts

@@ -0,0 +1,3 @@
+import "@axa-fr/design-system-slash-css/dist/Title/Client/Title.scss";
+export { TitleSize } from "./constants";
+export { Title } from "./Title";

package/dist/Title/Client/index.js

@@ -0,0 +1,3 @@
+import "@axa-fr/design-system-slash-css/dist/Title/Client/Title.scss";
+export { TitleSize } from "./constants";
+export { Title } from "./Title";

package/dist/agent.d.ts

@@ -6,6 +6,7 @@ export { Badge } from "./Badge/Badge";
 export { ButtonAgent as Button } from "./Button/Button.agent";
 export { Checkbox, CheckboxInput, CheckboxItem, CheckboxModes, } from "./Form/Checkbox/Agent";
 export { Choice, ChoiceInput } from "./Form/Choice";
+export { Field, FieldError, FieldForm, FieldInput, FormClassManager, HelpMessage, InputList, MessageTypes, getComponentClassName, } from "./Form/core";
 export { Date, DateInput } from "./Form/Date";
 export { MultiSelect, MultiSelectInput } from "./Form/MultiSelect";
 export { Number, NumberInput } from "./Form/Number";
@@ -14,12 +15,11 @@ export { Select, SelectBase, SelectInput } from "./Form/Select/Agent";
 export { Slider, SliderInput } from "./Form/Slider";
 export { Text, TextInput } from "./Form/Text/Agent";
 export { Textarea, TextareaInput } from "./Form/Textarea";
-export { Field, FieldError, FieldForm, FieldInput, FormClassManager, HelpMessage, InputList, MessageTypes, getComponentClassName, } from "./Form/core";
 export { Footer } from "./Layout/Footer/Agent";
 export { HeaderAgent as Header, Infos, Name, NavBar, NavBarBase, NavBarItem, NavBarItemBase, NavBarItemLink, TitleHeader, ToggleButton, User, } from "./Layout/Header/Agent";
 export { BooleanModal, Modal, ModalBody, ModalFooter, ModalHeader, ModalHeaderBase, } from "./ModalAgent";
 export { Step, StepBase, Steps } from "./Steps";
 export { Svg } from "./Svg";
 export { Tabs } from "./Tabs/Agent/Tabs.agent";
-export { Title } from "./Title/Title.agent";
+export { Title } from "./Title/Agent/Title";
 export * from "./Table";

package/dist/agent.js

@@ -6,6 +6,7 @@ export { Badge } from "./Badge/Badge";
 export { ButtonAgent as Button } from "./Button/Button.agent";
 export { Checkbox, CheckboxInput, CheckboxItem, CheckboxModes, } from "./Form/Checkbox/Agent";
 export { Choice, ChoiceInput } from "./Form/Choice";
+export { Field, FieldError, FieldForm, FieldInput, FormClassManager, HelpMessage, InputList, MessageTypes, getComponentClassName, } from "./Form/core";
 export { Date, DateInput } from "./Form/Date";
 export { MultiSelect, MultiSelectInput } from "./Form/MultiSelect";
 export { Number, NumberInput } from "./Form/Number";
@@ -14,12 +15,11 @@ export { Select, SelectBase, SelectInput } from "./Form/Select/Agent";
 export { Slider, SliderInput } from "./Form/Slider";
 export { Text, TextInput } from "./Form/Text/Agent";
 export { Textarea, TextareaInput } from "./Form/Textarea";
-export { Field, FieldError, FieldForm, FieldInput, FormClassManager, HelpMessage, InputList, MessageTypes, getComponentClassName, } from "./Form/core";
 export { Footer } from "./Layout/Footer/Agent";
 export { HeaderAgent as Header, Infos, Name, NavBar, NavBarBase, NavBarItem, NavBarItemBase, NavBarItemLink, TitleHeader, ToggleButton, User, } from "./Layout/Header/Agent";
 export { BooleanModal, Modal, ModalBody, ModalFooter, ModalHeader, ModalHeaderBase, } from "./ModalAgent";
 export { Step, StepBase, Steps } from "./Steps";
 export { Svg } from "./Svg";
 export { Tabs } from "./Tabs/Agent/Tabs.agent";
-export { Title } from "./Title/Title.agent";
+export { Title } from "./Title/Agent/Title";
 export * from "./Table";

package/dist/client.d.ts

@@ -15,6 +15,7 @@ export { HeaderClient as Header } from "./Layout/Header/Client";
 export { Link } from "./Link/Link.client";
 export { List } from "./List";
 export { ClickList } from "./List/ClickList";
+export { ContentItemDuo } from "./List/ContentItemDuo";
 export { ContentTabList } from "./List/ContentTabList";
 export { Loader } from "./Loader/Client";
 export { Modal } from "./ModalClient/Modal.client";
@@ -24,3 +25,4 @@ export { Stepper } from "./Stepper/Stepper.client";
 export { Svg } from "./Svg";
 export { TabsClient as Tabs, Direction as TabsDirection, } from "./Tabs/Client/Tabs.client";
 export { Tag } from "./Tag";
+export { Title, TitleSize } from "./Title/Client";

package/dist/client.js

@@ -14,6 +14,7 @@ export { HeaderClient as Header } from "./Layout/Header/Client";
 export { Link } from "./Link/Link.client";
 export { List } from "./List";
 export { ClickList } from "./List/ClickList";
+export { ContentItemDuo } from "./List/ContentItemDuo";
 export { ContentTabList } from "./List/ContentTabList";
 export { Loader } from "./Loader/Client";
 export { Modal } from "./ModalClient/Modal.client";
@@ -22,3 +23,4 @@ export { Stepper } from "./Stepper/Stepper.client";
 export { Svg } from "./Svg";
 export { TabsClient as Tabs, Direction as TabsDirection, } from "./Tabs/Client/Tabs.client";
 export { Tag } from "./Tag";
+export { Title, TitleSize } from "./Title/Client";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@axa-fr/design-system-slash-react",
-  "version": "0.2.0-beta.281",
+  "version": "0.2.0-beta.283",
   "description": "",
   "exports": {
     "./agent": {
@@ -45,7 +45,7 @@
   },
   "homepage": "https://github.com/AxaFrance/design-system#readme",
   "peerDependencies": {
-    "@axa-fr/design-system-slash-css": "0.2.0-beta.281",
+    "@axa-fr/design-system-slash-css": "0.2.0-beta.283",
     "@material-symbols/svg-400": ">= 0.19.0",
     "react": ">= 18"
   },