@axa-fr/canopee-react 1.0.0-alpha.1089

package/dist/distributeur/Popover/Popover.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { PopoverClick } from "./PopoverClick";
+import { PopoverOver } from "./PopoverOver";
+const Popover = ({ children, placement = "top", className, classModifier, mode = "click", popoverElement: content, }) => {
+    const Component = mode === "click" ? PopoverClick : PopoverOver;
+    return (_jsx(Component, { className: className, classModifier: classModifier, placement: placement, element: content, children: children }));
+};
+export { Popover };

package/dist/distributeur/Popover/Popover.types.d.ts

@@ -0,0 +1,9 @@
+import { Placement } from "@floating-ui/react";
+export type PopoverModes = "hover" | "click";
+export type PopoverProps = {
+    className?: string;
+    classModifier?: string;
+    placement?: Placement;
+    children?: React.ReactNode;
+    element: React.ReactNode;
+};

package/dist/distributeur/Popover/Popover.types.js

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

package/dist/distributeur/Popover/PopoverBase.d.ts

@@ -0,0 +1,15 @@
+import { Placement } from "@floating-ui/react";
+import React from "react";
+import "@axa-fr/canopee-css/distributeur/Popover/Popover.css";
+type Props = {
+    placement?: Placement;
+    className?: string;
+    classModifier?: string;
+    element: React.ReactNode;
+    children: React.ReactNode | React.ReactNode[];
+    isOpen: boolean;
+    onMouseEnter?: (event: React.MouseEvent) => void;
+    onMouseLeave?: (event: React.MouseEvent) => void;
+};
+declare const PopoverBase: ({ children, isOpen, placement, className, classModifier, element, onMouseEnter, onMouseLeave, }: Props) => import("react/jsx-runtime").JSX.Element;
+export { PopoverBase };

package/dist/distributeur/Popover/PopoverBase.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AnimatedPopover } from "./AnimatedPopover";
+import "@axa-fr/canopee-css/distributeur/Popover/Popover.css";
+const defaultClassName = "af-popover__container";
+const PopoverBase = ({ children, isOpen, placement = "right", className = defaultClassName, classModifier, element, onMouseEnter, onMouseLeave, }) => {
+    return (_jsx(AnimatedPopover, { target: children, placement: placement, isOpen: isOpen, className: className, classModifier: classModifier, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, children: element }));
+};
+export { PopoverBase };

package/dist/distributeur/Popover/PopoverClick.d.ts

@@ -0,0 +1,2 @@
+import { PopoverProps } from "./Popover.types";
+export declare const PopoverClick: ({ children, placement, className, classModifier, element, }: PopoverProps) => import("react/jsx-runtime").JSX.Element;

package/dist/distributeur/Popover/PopoverClick.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { PopoverBase } from "./PopoverBase";
+export const PopoverClick = ({ children, placement, className, classModifier, element, }) => {
+    const wrapperRef = React.useRef(null);
+    const [isOpen, setOpen] = React.useState(false);
+    const [isPopoverHover, setPopoverHover] = React.useState(false);
+    const handleClick = (event, isOpenValue) => {
+        if (isPopoverHover || !wrapperRef.current || isOpenValue === isOpen) {
+            event.stopPropagation();
+            return;
+        }
+        setOpen((oldIsOpen) => isOpenValue ?? !oldIsOpen);
+    };
+    const handleKeyDown = (event) => {
+        if (event.key === "Enter") {
+            handleClick(event);
+        }
+    };
+    const handleMouseEnterPopover = () => {
+        setPopoverHover(true);
+    };
+    const handleMouseLeavePopover = () => {
+        setPopoverHover(false);
+    };
+    return (_jsx("div", { role: "button", tabIndex: 0, ref: wrapperRef, className: "af-popover__wrapper af-popover__wrapper--click", onKeyDown: handleKeyDown, onClick: handleClick, onBlur: (event) => handleClick(event, false), children: _jsx(PopoverBase, { onMouseEnter: handleMouseEnterPopover, onMouseLeave: handleMouseLeavePopover, isOpen: isOpen, placement: placement, className: className, classModifier: classModifier, element: element, children: children }) }));
+};

package/dist/distributeur/Popover/PopoverOver.d.ts

@@ -0,0 +1,2 @@
+import { PopoverProps } from "./Popover.types";
+export declare const PopoverOver: ({ children, placement, className, classModifier, element: content, }: PopoverProps) => import("react/jsx-runtime").JSX.Element;

package/dist/distributeur/Popover/PopoverOver.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { PopoverBase } from "./PopoverBase";
+export const PopoverOver = ({ children, placement, className, classModifier, element: content, }) => {
+    const [isOpen, setOpen] = React.useState(false);
+    const handleMouseEnter = () => {
+        setOpen(true);
+    };
+    const handleMouseLeave = () => {
+        setOpen(false);
+    };
+    return (_jsx("div", { role: "button", tabIndex: 0, className: "af-popover__wrapper af-popover__wrapper--over", onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onFocus: handleMouseEnter, onBlur: handleMouseLeave, children: _jsx(PopoverBase, { isOpen: isOpen, placement: placement, className: className, classModifier: classModifier, element: content, children: children }) }));
+};

package/dist/distributeur/Popover/index.d.ts

@@ -0,0 +1,3 @@
+export { Popover } from "./Popover";
+export { type Placement } from "@floating-ui/react";
+export { type PopoverModes } from "./Popover.types";

package/dist/distributeur/Popover/index.js

@@ -0,0 +1 @@
+export { Popover } from "./Popover";

package/dist/distributeur/Restitution/ArticleRestitution.d.ts

@@ -0,0 +1,6 @@
+import { ComponentPropsWithoutRef, PropsWithChildren } from "react";
+type ArticleRestitutionProps = ComponentPropsWithoutRef<"article"> & {
+    classModifier?: string;
+};
+export declare const ArticleRestitution: ({ children, className, classModifier, ...otherProps }: PropsWithChildren<ArticleRestitutionProps>) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/distributeur/Restitution/ArticleRestitution.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { getComponentClassName } from "../utilities";
+export const ArticleRestitution = ({ children, className, classModifier, ...otherProps }) => {
+    const componentClassName = getComponentClassName(className, classModifier, "af-restitution");
+    return (_jsx("article", { className: componentClassName, ...otherProps, children: children }));
+};

package/dist/distributeur/Restitution/HeaderRestitution.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+export type HeaderRestitutionProps = {
+    className?: string;
+    title: React.ReactNode;
+    subtitle?: React.ReactNode;
+    rightTitle?: React.ReactNode;
+    classModifier?: string;
+};
+export declare const HeaderRestitution: ({ title, subtitle, rightTitle, className, classModifier, }: HeaderRestitutionProps) => import("react/jsx-runtime").JSX.Element;

package/dist/distributeur/Restitution/HeaderRestitution.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getComponentClassName } from "../utilities";
+export const HeaderRestitution = ({ title, subtitle, rightTitle, className, classModifier, }) => {
+    const componentClassName = getComponentClassName(className, classModifier, "af-restitution__header");
+    return (_jsxs("header", { className: componentClassName, children: [_jsx("div", { className: "af-restitution__header-left", children: _jsxs("h3", { className: "af-restitution__title", children: [_jsx("span", { className: "af-restitution__title-main", children: title }), subtitle ? (_jsx("span", { className: "af-restitution__title-subtitle", children: subtitle })) : null] }) }), rightTitle ? (_jsx("div", { className: "af-restitution__header-right", children: _jsx("span", { className: "af-restitution__title", children: rightTitle }) })) : null] }));
+};

package/dist/distributeur/Restitution/Restitution.d.ts

@@ -0,0 +1,6 @@
+import { ComponentPropsWithoutRef, PropsWithChildren } from "react";
+export type RestitutionProps = ComponentPropsWithoutRef<"dl"> & {
+    label: string;
+    classModifier?: string;
+};
+export declare const Restitution: ({ label, children, className, classModifier, }: PropsWithChildren<RestitutionProps>) => import("react/jsx-runtime").JSX.Element;

package/dist/distributeur/Restitution/Restitution.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getComponentClassName } from "../utilities";
+export const Restitution = ({ label, children = "-", className, classModifier, }) => {
+    const componentClassName = getComponentClassName(className, classModifier, "af-restitution__listdef");
+    return (_jsxs("dl", { className: componentClassName, children: [_jsx("dt", { className: "af-restitution__listdef-item", children: _jsx("span", { className: "af-restitution__text", children: label }) }), _jsx("dd", { className: "af-restitution__listdef-value", children: children })] }));
+};

package/dist/distributeur/Restitution/RestitutionList.d.ts

@@ -0,0 +1,6 @@
+import { ComponentPropsWithoutRef } from "react";
+type RestitutionListProps = ComponentPropsWithoutRef<"ul"> & {
+    values: string[];
+};
+export declare const RestitutionList: ({ values, ...props }: RestitutionListProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/distributeur/Restitution/RestitutionList.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const RestitutionList = ({ values, ...props }) => {
+    return (_jsx("ul", { className: "af-restitution__listul", ...props, children: values.map((value) => (_jsx("li", { className: "af-restitution__listul-item", children: value }, value))) }));
+};

package/dist/distributeur/Restitution/SectionRestitution.d.ts

@@ -0,0 +1,6 @@
+import { PropsWithChildren } from "react";
+export type SectionRestitutionProps = {
+    className?: string;
+    classModifier?: string;
+};
+export declare const SectionRestitution: ({ children, className, classModifier, }: PropsWithChildren<SectionRestitutionProps>) => import("react/jsx-runtime").JSX.Element;

package/dist/distributeur/Restitution/SectionRestitution.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { getComponentClassName } from "../utilities";
+export const SectionRestitution = ({ children, className, classModifier, }) => {
+    const componentClassName = getComponentClassName(className, classModifier, "af-restitution__content");
+    return _jsx("section", { className: componentClassName, children: children });
+};

package/dist/distributeur/Restitution/SectionRestitutionColumn.d.ts

@@ -0,0 +1,7 @@
+import { PropsWithChildren } from "react";
+export type SectionRestitutionColumnProps = {
+    className?: string;
+    title?: string;
+    classModifier?: string;
+};
+export declare const SectionRestitutionColumn: ({ children, className, title, classModifier, }: PropsWithChildren<SectionRestitutionColumnProps>) => import("react/jsx-runtime").JSX.Element;

package/dist/distributeur/Restitution/SectionRestitutionColumn.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getComponentClassName } from "../utilities";
+import { SectionRestitutionTitle } from "./SectionRestitutionTitle";
+export const SectionRestitutionColumn = ({ children, className, title, classModifier, }) => {
+    const componentClassName = getComponentClassName(className, classModifier, "col-sm-12 col-md-12 col-lg-6 col-xl-6");
+    return (_jsxs("div", { className: componentClassName, children: [title ? _jsx(SectionRestitutionTitle, { title: title }) : null, children] }));
+};

package/dist/distributeur/Restitution/SectionRestitutionRow.d.ts

@@ -0,0 +1,8 @@
+import { PropsWithChildren } from "react";
+export type SectionRestitutionRowProps = {
+    title?: React.ReactNode;
+    classNameContainer?: string;
+    className?: string;
+    classModifier?: string;
+};
+export declare const SectionRestitutionRow: ({ title, className, classNameContainer, children, classModifier, }: PropsWithChildren<SectionRestitutionRowProps>) => import("react/jsx-runtime").JSX.Element;

package/dist/distributeur/Restitution/SectionRestitutionRow.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getComponentClassName } from "../utilities";
+import { SectionRestitutionTitle } from "./SectionRestitutionTitle";
+const DEFAULT_CLASSNAME = "col col-sm-12 col-md-12 col-lg-12 col-xl-12";
+export const SectionRestitutionRow = ({ title, className = DEFAULT_CLASSNAME, classNameContainer = "row af-restitution__content-left", children, classModifier, }) => {
+    const componentClassName = getComponentClassName(className, classModifier, DEFAULT_CLASSNAME);
+    return (_jsxs("div", { className: componentClassName, children: [title ? _jsx(SectionRestitutionTitle, { title: title }) : null, _jsx("div", { className: classNameContainer, children: children })] }));
+};

package/dist/distributeur/Restitution/SectionRestitutionTitle.d.ts

@@ -0,0 +1,6 @@
+export type SectionRestitutionTitleProps = {
+    title: React.ReactNode;
+    className?: string;
+    classModifier?: string;
+};
+export declare const SectionRestitutionTitle: ({ title, className, classModifier, }: SectionRestitutionTitleProps) => import("react/jsx-runtime").JSX.Element;

package/dist/distributeur/Restitution/SectionRestitutionTitle.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { getComponentClassName } from "../utilities";
+export const SectionRestitutionTitle = ({ title, className, classModifier, }) => {
+    const componentClassName = getComponentClassName(className, classModifier, "af-restitution__content-title");
+    return _jsx("h4", { className: componentClassName, children: title });
+};

package/dist/distributeur/Restitution/index.d.ts

@@ -0,0 +1,9 @@
+import "@axa-fr/canopee-css/distributeur/Restitution/Restitution.css";
+export { ArticleRestitution } from "./ArticleRestitution";
+export { HeaderRestitution } from "./HeaderRestitution";
+export { Restitution } from "./Restitution";
+export { RestitutionList } from "./RestitutionList";
+export { SectionRestitution } from "./SectionRestitution";
+export { SectionRestitutionColumn } from "./SectionRestitutionColumn";
+export { SectionRestitutionRow } from "./SectionRestitutionRow";
+export { SectionRestitutionTitle } from "./SectionRestitutionTitle";

package/dist/distributeur/Restitution/index.js

@@ -0,0 +1,9 @@
+import "@axa-fr/canopee-css/distributeur/Restitution/Restitution.css";
+export { ArticleRestitution } from "./ArticleRestitution";
+export { HeaderRestitution } from "./HeaderRestitution";
+export { Restitution } from "./Restitution";
+export { RestitutionList } from "./RestitutionList";
+export { SectionRestitution } from "./SectionRestitution";
+export { SectionRestitutionColumn } from "./SectionRestitutionColumn";
+export { SectionRestitutionRow } from "./SectionRestitutionRow";
+export { SectionRestitutionTitle } from "./SectionRestitutionTitle";

package/dist/distributeur/Steps/Step.d.ts

@@ -0,0 +1,8 @@
+import { ComponentPropsWithoutRef } from "react";
+import { StepLink } from "./StepLink";
+type Props = Omit<ComponentPropsWithoutRef<typeof StepLink>, "href"> & {
+    href?: string;
+    mode?: "link" | "active" | "disabled";
+};
+declare const Step: ({ number, id, title, classModifier, href, onClick, mode, className, }: Props) => import("react/jsx-runtime").JSX.Element;
+export { Step };

package/dist/distributeur/Steps/Step.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { StepCurrent } from "./StepCurrent";
+import { StepDisabled } from "./StepDisabled";
+import { StepLink } from "./StepLink";
+const Step = ({ number, id, title, classModifier, href, onClick, mode = "link", className, }) => {
+    switch (mode) {
+        case "link":
+            return (_jsx(StepLink, { id: id, href: href ?? "#", number: number, classModifier: classModifier, className: className, title: title, onClick: onClick }));
+        case "active":
+            return (_jsx(StepCurrent, { id: id, title: title, classModifier: classModifier, className: className, number: number }));
+        default:
+            return (_jsx(StepDisabled, { id: id, title: title, classModifier: classModifier, className: className, number: number }));
+    }
+};
+export { Step };

package/dist/distributeur/Steps/StepBase.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from "react";
+type Props = {
+    id: string;
+    title: string;
+    children?: ReactNode;
+    className?: string;
+    classModifier?: string;
+};
+declare const StepBase: ({ children, id, title, className, classModifier }: Props) => import("react/jsx-runtime").JSX.Element;
+export { StepBase };

package/dist/distributeur/Steps/StepBase.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import chevronSvg from "@material-symbols/svg-400/outlined/chevron_right.svg";
+import checkSvg from "@material-symbols/svg-400/outlined/check.svg";
+import { getComponentClassName, Svg } from "../../distributeur";
+const StepBase = ({ children, id, title, className, classModifier }) => {
+    const componentClassName = getComponentClassName(className, classModifier, "af-steps-list-step");
+    return (_jsxs("li", { className: componentClassName, title: title, children: [_jsx(Svg, { src: checkSvg }), children, _jsx(Svg, { src: chevronSvg })] }, id));
+};
+export { StepBase };

package/dist/distributeur/Steps/StepCurrent.d.ts

@@ -0,0 +1,5 @@
+import { ComponentPropsWithoutRef } from "react";
+import { StepNoLink } from "./StepNoLink";
+type Props = ComponentPropsWithoutRef<typeof StepNoLink>;
+declare const StepCurrent: ({ className, ...otherProps }: Props) => import("react/jsx-runtime").JSX.Element;
+export { StepCurrent };

package/dist/distributeur/Steps/StepCurrent.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { StepNoLink } from "./StepNoLink";
+const StepCurrent = ({ className = "on af-steps-list-step", ...otherProps }) => _jsx(StepNoLink, { className: className, ...otherProps });
+export { StepCurrent };

package/dist/distributeur/Steps/StepDisabled.d.ts

@@ -0,0 +1,5 @@
+import { ComponentPropsWithoutRef } from "react";
+import { StepNoLink } from "./StepNoLink";
+type Props = ComponentPropsWithoutRef<typeof StepNoLink>;
+declare const StepDisabled: ({ className, ...otherProps }: Props) => import("react/jsx-runtime").JSX.Element;
+export { StepDisabled };

package/dist/distributeur/Steps/StepDisabled.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { StepNoLink } from "./StepNoLink";
+const StepDisabled = ({ className = "disabled af-steps-list-step", ...otherProps }) => _jsx(StepNoLink, { className: className, ...otherProps });
+export { StepDisabled };

package/dist/distributeur/Steps/StepLink.d.ts

@@ -0,0 +1,10 @@
+import { ComponentPropsWithoutRef, ReactNode } from "react";
+import { StepBase } from "./StepBase";
+import type { CustomClickEvent } from "./types";
+type Props = ComponentPropsWithoutRef<typeof StepBase> & {
+    href: string;
+    number?: ReactNode;
+    onClick?: (e: CustomClickEvent) => void;
+};
+declare const StepLink: ({ id, href, number, title, className, onClick, ...otherProps }: Props) => import("react/jsx-runtime").JSX.Element;
+export { StepLink };

package/dist/distributeur/Steps/StepLink.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { StepBase } from "./StepBase";
+const StepLink = ({ id, href, number, title, className = "past af-steps-list-step", onClick, ...otherProps }) => (_jsx(StepBase, { id: id, className: `${className} ${number ? "number" : ""}`, title: title, ...otherProps, children: _jsxs("a", { className: "af-steps-list-step__label", href: href, onClick: (e) => {
+            e.preventDefault();
+            onClick?.({ href, id, title, number });
+        }, children: [Boolean(number) && (_jsx("div", { className: "af-steps-list-step__number", children: number })), _jsx("div", { className: "af-steps-list-step__title", children: title })] }) }));
+export { StepLink };

package/dist/distributeur/Steps/StepNoLink.d.ts

@@ -0,0 +1,7 @@
+import { ComponentPropsWithoutRef, ReactNode } from "react";
+import { StepBase } from "./StepBase";
+type Props = ComponentPropsWithoutRef<typeof StepBase> & {
+    number?: ReactNode;
+};
+declare const StepNoLink: ({ number, title, className, ...otherProps }: Props) => import("react/jsx-runtime").JSX.Element;
+export { StepNoLink };

package/dist/distributeur/Steps/StepNoLink.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { StepBase } from "./StepBase";
+const StepNoLink = ({ number, title, className = "af-steps-list-step", ...otherProps }) => (_jsx(StepBase, { className: `${className} ${number ? "number" : ""}`, title: title, ...otherProps, children: _jsxs("div", { className: "af-steps-list-step__label", children: [Boolean(number) && (_jsx("div", { className: "af-steps-list-step__number", children: number })), _jsx("div", { className: "af-steps-list-step__title", children: title })] }) }));
+export { StepNoLink };

package/dist/distributeur/Steps/Steps.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from "react";
+type Props = {
+    children: ReactNode;
+    className?: string;
+    classModifier?: string;
+};
+declare const Steps: ({ children, className, classModifier, }: Props) => import("react/jsx-runtime").JSX.Element;
+export { Steps };

package/dist/distributeur/Steps/Steps.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { getComponentClassName } from "../utilities";
+const defaultClassName = "af-steps-new";
+const Steps = ({ children, className = defaultClassName, classModifier, }) => {
+    const componentClassName = getComponentClassName(className, classModifier, defaultClassName);
+    return (_jsx("div", { className: componentClassName, children: _jsx("ol", { className: "af-steps-list", children: children }) }));
+};
+export { Steps };

package/dist/distributeur/Steps/VerticalStep.d.ts

@@ -0,0 +1,29 @@
+import { ReactNode } from "react";
+import type { VerticalStepMode } from "./types";
+import "@axa-fr/canopee-css/distributeur/Steps/VerticalStep.css";
+type Props = {
+    /** The title of the step. */
+    title: string;
+    /** The id of the step, used for accessibility. It should be unique within the document. */
+    id: string;
+    /** The mode of the step, can be "edited", "validated", or "locked". */
+    stepMode: VerticalStepMode;
+    /** The function to call when the edit button is clicked. */
+    onEdit: React.MouseEventHandler<HTMLButtonElement>;
+    /** The content of the form to display when the step is in "edited" mode. */
+    form: ReactNode;
+    /** The content to display when the step is in "validated" mode. */
+    restitution: ReactNode;
+    /** The label of the edit button. */
+    editButtonLabel?: string;
+    /** The aria-label of the edit button. */
+    editButtonAriaLabel?: string;
+    /** Whether to show the restitution content when the step is validated. */
+    showRestitution?: boolean;
+    /** Additional content to display on the right side of the title. */
+    contentRight?: string;
+    /** The aria-label for the additional content on the right side of the title. */
+    contentRightAriaLabel?: string;
+};
+export declare const VerticalStep: ({ title, id, stepMode, editButtonLabel, editButtonAriaLabel, contentRightAriaLabel, onEdit, form, restitution, showRestitution, contentRight, }: Props) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/distributeur/Steps/VerticalStep.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import check from "@material-symbols/svg-400/sharp/check.svg";
+import edit from "@material-symbols/svg-400/sharp/edit-fill.svg";
+import lock from "@material-symbols/svg-400/sharp/lock-fill.svg";
+import classNames from "classnames";
+import { Svg } from "../Svg";
+import { Title } from "../Title/Title";
+import "@axa-fr/canopee-css/distributeur/Steps/VerticalStep.css";
+import { Button } from "../Button/Button";
+const defaultClassName = "af-vertical-step";
+export const VerticalStep = ({ title, id, stepMode, editButtonLabel = "Modifier", editButtonAriaLabel = `Modifier l'étape ${title}`, contentRightAriaLabel = `Contenu supplémentaire étape verticale ${title}`, onEdit, form, restitution, showRestitution = true, contentRight, }) => {
+    const isStepInEdition = stepMode === "edited";
+    const isStepValidated = stepMode === "validated";
+    const isStepLocked = stepMode === "locked";
+    return (_jsxs("section", { className: classNames(defaultClassName, {
+            [`${defaultClassName}--edition`]: isStepInEdition,
+        }), "aria-label": `Étape verticale ${title}`, children: [_jsxs("div", { className: classNames("af-vertical-step-icon", {
+                    [`${defaultClassName}-icon--validated`]: isStepValidated,
+                    [`${defaultClassName}-icon--locked`]: isStepLocked,
+                    [`${defaultClassName}-icon--edited`]: isStepInEdition,
+                }), children: [isStepValidated ? _jsx(Svg, { role: "presentation", src: check }) : null, isStepLocked ? _jsx(Svg, { role: "presentation", src: lock }) : null, isStepInEdition ? _jsx(Svg, { role: "presentation", src: edit }) : null] }), _jsx(Title, { id: id, contentLeft: isStepValidated ? (_jsx(Button, { "aria-label": editButtonAriaLabel, onClick: onEdit, variant: "ghost", leftIcon: _jsx(Svg, { role: "presentation", src: edit }), children: editButtonLabel })) : undefined, contentRight: _jsx("section", { "aria-label": contentRightAriaLabel, children: contentRight }), children: title }), isStepInEdition ? _jsx("section", { children: form }) : null, isStepValidated && showRestitution ? (_jsx("section", { children: restitution })) : null, isStepInEdition ? (_jsx("div", { className: classNames(`${defaultClassName}-icon ${defaultClassName}-icon--lastIcon`), children: _jsx(Svg, { role: "presentation", src: check }) })) : null] }));
+};

package/dist/distributeur/Steps/index.d.ts

@@ -0,0 +1,5 @@
+import "@axa-fr/canopee-css/distributeur/Steps/Steps.css";
+export { Step } from "./Step";
+export { StepBase } from "./StepBase";
+export { Steps } from "./Steps";
+export { VerticalStep } from "./VerticalStep";

package/dist/distributeur/Steps/index.js

@@ -0,0 +1,5 @@
+import "@axa-fr/canopee-css/distributeur/Steps/Steps.css";
+export { Step } from "./Step";
+export { StepBase } from "./StepBase";
+export { Steps } from "./Steps";
+export { VerticalStep } from "./VerticalStep";

package/dist/distributeur/Steps/types.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from "react";
+export type CustomClickEvent = {
+    href: string;
+    number?: ReactNode;
+    id: string;
+    title: string;
+};
+export type VerticalStepMode = "edited" | "locked" | "validated";

package/dist/distributeur/Steps/types.js

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

package/dist/distributeur/Summary/index.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from "react";
+import { type MessageProps } from "../Messages/Message";
+type SummaryProps = Omit<MessageProps, "title"> & {
+    title?: string;
+    messages?: ReactNode[];
+    isVisible?: boolean;
+};
+export declare const Summary: ({ messages, isVisible, title, classModifier, ...args }: SummaryProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/distributeur/Summary/index.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Message } from "../Messages/Message";
+import { generateId } from "../utilities/helpers/generateId";
+export const Summary = ({ messages = [], isVisible = true, title = "Invalid form", classModifier = "error", ...args }) => {
+    const messagesNotBlank = messages.filter((message) => Boolean(message));
+    if (!messages || !isVisible || messagesNotBlank.length === 0) {
+        return null;
+    }
+    const variant = classModifier === "danger" ? "warning" : classModifier;
+    return (_jsx(Message, { title: title, variant: variant, ...args, children: _jsx("ul", { className: "af-summary__message-list", children: messages.map((message) => (_jsx("li", { className: "af-summary__message-item", children: message }, `message_${generateId({ message })}`))) }) }));
+};

package/dist/distributeur/Svg/Svg.d.ts

@@ -0,0 +1,7 @@
+import { type SVGAttributes } from "react";
+type SvgProps = SVGAttributes<SVGSVGElement> & {
+    src: string;
+    alt?: string;
+};
+export declare const Svg: ({ src, alt, width, height, ...props }: SvgProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/distributeur/Svg/Svg.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useLayoutEffect, useRef, useState, } from "react";
+import { svgInjector } from "./svgInjector";
+const cloneAttributes = (from, to) => {
+    const attributes = from.getAttributeNames();
+    attributes.forEach((attribute) => {
+        to.setAttribute(attribute, from.getAttribute(attribute));
+    });
+};
+export const Svg = ({ src, alt, width = 24, height = 24, ...props }) => {
+    const rootRef = useRef(null);
+    const [hasError, setHasError] = useState(false);
+    useLayoutEffect(() => {
+        if (hasError) {
+            setHasError(false);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [src]);
+    useLayoutEffect(() => {
+        if (hasError) {
+            return;
+        }
+        const root = rootRef.current;
+        if (root) {
+            const parent = document.createElement("div");
+            const svg = document.createElement("svg");
+            parent.appendChild(svg);
+            cloneAttributes(root, svg);
+            // Default SVG size was 24px with @material-design-icons/svg. With @material-symbols/svg-400 this is now 48px (with no native way to change it)
+            // In order not to break existing CSS, we manually set the default value back to 24px
+            svg.setAttribute("width", width.toString());
+            svg.setAttribute("height", height.toString());
+            svgInjector(svg, {
+                afterEach: (error, svgInject) => {
+                    if (error) {
+                        setHasError(true);
+                    }
+                    if (svgInject) {
+                        root.innerHTML = svgInject.innerHTML;
+                        cloneAttributes(svgInject, root);
+                    }
+                },
+            });
+        }
+    }, [src, width, height, hasError]);
+    if (hasError) {
+        return alt ? (_jsx("span", { ...props, children: alt })) : null;
+    }
+    return _jsx("svg", { ref: rootRef, "data-src": src, role: "presentation", ...props });
+};

package/dist/distributeur/Svg/index.d.ts

@@ -0,0 +1 @@
+export { Svg } from "./Svg";

package/dist/distributeur/Svg/index.js

@@ -0,0 +1 @@
+export { Svg } from "./Svg";

package/dist/distributeur/Svg/svgInjector.d.ts

@@ -0,0 +1,12 @@
+import { type AfterAll, type BeforeEach, type Errback, type EvalScripts } from "@tanem/svg-injector";
+type Options = {
+    afterAll?: AfterAll;
+    afterEach?: Errback;
+    beforeEach?: BeforeEach;
+    cacheRequests?: boolean;
+    evalScripts?: EvalScripts;
+    httpRequestWithCredentials?: boolean;
+    renumerateIRIElements?: boolean;
+};
+export declare const svgInjector: (element: HTMLElement | SVGSVGElement | null, { beforeEach, ...options }?: Options) => void;
+export {};