@edifice.io/react 2.5.23-fix-query-params.20260623180310 → 2.5.24-develop.20260623184311

package/dist/modules/homepage/components/Header/Header.js

@@ -0,0 +1,80 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+import { useTranslation } from "react-i18next";
+import { useId } from "react";
+import { Navbar } from "../../../../components/Layout/components/Navbar.js";
+import { NavItem } from "../../../../components/Layout/components/NavItem.js";
+import { NavLink } from "../../../../components/Layout/components/NavLink.js";
+import useHeader from "../../../../components/Layout/hooks/useHeader.js";
+import SvgIconCommunitiesBeta from "../../../icons/components/nav/IconCommunitiesBeta.js";
+import SvgIconDisconnect from "../../../icons/components/nav/IconDisconnect.js";
+import SvgIconHomeBeta from "../../../icons/components/nav/IconHomeBeta.js";
+import SvgIconMessagesBeta from "../../../icons/components/nav/IconMessagesBeta.js";
+import SvgIconMyAppsBeta from "../../../icons/components/nav/IconMyAppsBeta.js";
+import SvgIconNotificationBeta from "../../../icons/components/nav/IconNotificationBeta.js";
+import useConversation from "../../../../hooks/useConversation/useConversation.js";
+import useUser from "../../../../hooks/useUser/useUser.js";
+import useHasWorkflow from "../../../../hooks/useHasWorkflow/useHasWorkflow.js";
+import { useEdificeTheme } from "../../../../providers/EdificeThemeProvider/EdificeThemeProvider.hook.js";
+import useHover from "../../../../hooks/useHover/useHover.js";
+import LogoBeta from "../../../../components/LogoBeta/LogoBeta.js";
+import Badge from "../../../../components/Badge/Badge.js";
+import VisuallyHidden from "../../../../components/VisuallyHidden/VisuallyHidden.js";
+import ButtonBeta from "../../../../components/ButtonBeta/ButtonBeta.js";
+import Avatar from "../../../../components/Avatar/Avatar.js";
+import { Popover, PopoverBody } from "../../../../components/Popover/Popover.js";
+const Header = ({
+  src = "",
+  onNotificationsClick
+}) => {
+  const {
+    t
+  } = useTranslation(), {
+    messages
+  } = useConversation(), {
+    user,
+    avatar
+  } = useUser(), hasCarbonioPreauthWorkflow = useHasWorkflow("org.entcore.auth.controllers.CarbonioPreauthController|preauth") || !1, classes = clsx("header-beta d-print-none no-2d no-1d"), {
+    userAvatar,
+    userName,
+    communityWorkflow,
+    conversationWorflow
+  } = useHeader({
+    user,
+    avatar
+  }), {
+    theme
+  } = useEdificeTheme(), hasMessages = messages > 0, [userRef, isUserHovered] = useHover(), popoverUserId = useId(), handleNotificationsClick = () => {
+    onNotificationsClick == null || onNotificationsClick();
+  };
+  return /* @__PURE__ */ jsx("header", { className: classes, children: /* @__PURE__ */ jsxs(Navbar, { className: "px-24", children: [
+    /* @__PURE__ */ jsx(LogoBeta, { src: `${src}/img/illustrations/logo.png` }),
+    /* @__PURE__ */ jsxs("ul", { className: "navbar-nav", children: [
+      /* @__PURE__ */ jsx(NavItem, { children: /* @__PURE__ */ jsx(NavLink, { link: "/timeline/timeline", translate: t("navbar.home"), "data-testid": "header-home-button", children: /* @__PURE__ */ jsx(SvgIconHomeBeta, {}) }) }),
+      communityWorkflow && /* @__PURE__ */ jsx(NavItem, { children: /* @__PURE__ */ jsx(NavLink, { link: "/communities", translate: t("navbar.community"), "data-testid": "header-community-button", children: /* @__PURE__ */ jsx(SvgIconCommunitiesBeta, { className: "icon community" }) }) }),
+      conversationWorflow && /* @__PURE__ */ jsx(NavItem, { children: /* @__PURE__ */ jsxs(NavLink, { className: "position-relative", link: "/conversation/conversation", translate: t("conversation"), "data-testid": "header-messagerie-button", children: [
+        /* @__PURE__ */ jsx(SvgIconMessagesBeta, {}),
+        hasMessages && /* @__PURE__ */ jsx(Badge, { variant: {
+          type: "notification",
+          level: "danger"
+        }, className: "position-absolute", children: messages })
+      ] }) }),
+      hasCarbonioPreauthWorkflow && /* @__PURE__ */ jsx(NavItem, { children: /* @__PURE__ */ jsxs("a", { className: "nav-link position-relative", href: "/auth/carbonio/preauth", target: "_blank", "data-testid": "header-messagerie-button", children: [
+        /* @__PURE__ */ jsx(SvgIconMessagesBeta, {}),
+        /* @__PURE__ */ jsx(VisuallyHidden, { children: t("conversation") })
+      ] }) }),
+      /* @__PURE__ */ jsx(NavItem, { children: /* @__PURE__ */ jsx(NavLink, { link: "/welcome", translate: t("navbar.applications"), "data-testid": "header-my-apps-button", children: /* @__PURE__ */ jsx(SvgIconMyAppsBeta, {}) }) }),
+      /* @__PURE__ */ jsx(NavItem, { children: /* @__PURE__ */ jsx(ButtonBeta, { leftIcon: /* @__PURE__ */ jsx(SvgIconNotificationBeta, {}), variant: "ghost", onClick: handleNotificationsClick }) }),
+      /* @__PURE__ */ jsxs(NavItem, { className: "position-relative", ref: userRef, id: popoverUserId, "aria-haspopup": "true", "aria-expanded": isUserHovered, "data-testid": "header-user-menu-button", children: [
+        /* @__PURE__ */ jsx(NavLink, { link: "/userbook/mon-compte", translate: t("navbar.myaccount"), "data-testid": "header-user-profile-button", children: /* @__PURE__ */ jsx(Avatar, { alt: userName, size: "sm", src: userAvatar, variant: "circle", className: "bg-white", width: "32", height: "32" }) }),
+        /* @__PURE__ */ jsx(Popover, { className: "top-100 widget", id: popoverUserId, isVisible: isUserHovered, children: /* @__PURE__ */ jsx(PopoverBody, { children: /* @__PURE__ */ jsxs("a", { href: "/auth/logout?callback=" + ((theme == null ? void 0 : theme.logoutCallback) ?? ""), className: "nav-link d-flex align-items-center gap-8", "data-testid": "header-logout-button", children: [
+          /* @__PURE__ */ jsx(SvgIconDisconnect, { className: "icon logout" }),
+          /* @__PURE__ */ jsx("span", { id: "logout-label", className: "nav-text", children: t("navbar.disconnect") })
+        ] }) }) })
+      ] })
+    ] })
+  ] }) });
+};
+export {
+  Header as default
+};

package/dist/modules/homepage/components/Header/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Header';
+export { default as Header } from './Header';

package/dist/modules/homepage/components/HomeCard/HomeCard.d.ts

@@ -0,0 +1,37 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+import { HomeCardHeaderProps } from './HomeCardHeader';
+export type HomeCardVariant = 'user' | 'primary' | 'secondary';
+export interface HomeCardProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Visual variant of the card.
+     * - `user` (default): padding 16, gap 16
+     * - `primary`: padding 8/16/16/16, gap 8
+     * - `secondary`: padding 8/16/16/16, gap 4, grey background, smaller title, no shadowbox
+     */
+    variant?: HomeCardVariant;
+    /**
+     * Children of the card. When omitted, a default `HomeCardHeader` will be
+     * rendered using the `headerProps` prop (handy for the common case where the
+     * card only needs a header + content slot).
+     */
+    children?: ReactNode;
+    /**
+     * Convenience prop: when provided and `children` is empty, a default
+     * `HomeCard.Header` is rendered with these props.
+     */
+    headerProps?: HomeCardHeaderProps;
+}
+declare const HomeCard: {
+    ({ variant, children, headerProps, className, ...rest }: HomeCardProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+} & {
+    Header: {
+        ({ title, actionLabel, onActionClick, actionLeftIcon, actionRightIcon, className, ...rest }: HomeCardHeaderProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Content: {
+        ({ children, className, ...rest }: import('./HomeCardContent').HomeCardContentProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+};
+export default HomeCard;

package/dist/modules/homepage/components/HomeCard/HomeCard.js

@@ -0,0 +1,17 @@
+import { jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import HomeCardContent from "./HomeCardContent.js";
+import HomeCardHeader from "./HomeCardHeader.js";
+const Root = ({
+  variant = "user",
+  children,
+  headerProps,
+  className,
+  ...rest
+}) => /* @__PURE__ */ jsx("div", { "data-testid": "home-card", "data-variant": variant, className: clsx("home-card", `home-card--${variant}`, className), ...rest, children: headerProps && !children ? /* @__PURE__ */ jsx(HomeCardHeader, { ...headerProps }) : children }), HomeCard = Object.assign(Root, {
+  Header: HomeCardHeader,
+  Content: HomeCardContent
+});
+export {
+  HomeCard as default
+};

package/dist/modules/homepage/components/HomeCard/HomeCardContent.d.ts

@@ -0,0 +1,7 @@
+import { ComponentPropsWithoutRef } from 'react';
+export type HomeCardContentProps = ComponentPropsWithoutRef<'div'>;
+declare const HomeCardContent: {
+    ({ children, className, ...rest }: HomeCardContentProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default HomeCardContent;

package/dist/modules/homepage/components/HomeCard/HomeCardContent.js

@@ -0,0 +1,10 @@
+import { jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+const HomeCardContent = ({
+  children,
+  className,
+  ...rest
+}) => /* @__PURE__ */ jsx("div", { className: clsx("home-card-content", className), ...rest, children });
+export {
+  HomeCardContent as default
+};

package/dist/modules/homepage/components/HomeCard/HomeCardHeader.d.ts

@@ -0,0 +1,18 @@
+import { ComponentPropsWithoutRef, MouseEventHandler, ReactNode } from 'react';
+export interface HomeCardHeaderProps extends Omit<ComponentPropsWithoutRef<'div'>, 'title'> {
+    /** Title displayed on the left side of the header. */
+    title: ReactNode;
+    /** Label of the action button displayed on the right side of the header. */
+    actionLabel?: ReactNode;
+    /** Callback invoked when the action button is clicked. */
+    onActionClick?: MouseEventHandler<HTMLButtonElement>;
+    /** Optional left icon of the action button. */
+    actionLeftIcon?: ReactNode;
+    /** Optional right icon of the action button. */
+    actionRightIcon?: ReactNode;
+}
+declare const HomeCardHeader: {
+    ({ title, actionLabel, onActionClick, actionLeftIcon, actionRightIcon, className, ...rest }: HomeCardHeaderProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default HomeCardHeader;

package/dist/modules/homepage/components/HomeCard/HomeCardHeader.js

@@ -0,0 +1,22 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import Flex from "../../../../components/Flex/Flex.js";
+import ButtonBeta from "../../../../components/ButtonBeta/ButtonBeta.js";
+const HomeCardHeader = ({
+  title,
+  actionLabel,
+  onActionClick,
+  actionLeftIcon,
+  actionRightIcon,
+  className,
+  ...rest
+}) => {
+  const hasAction = !!actionLabel && !!onActionClick;
+  return /* @__PURE__ */ jsxs(Flex, { align: "center", justify: "between", gap: "8", className: clsx("home-card-header", className), ...rest, children: [
+    /* @__PURE__ */ jsx("h3", { className: "home-card-header-title", children: title }),
+    hasAction && /* @__PURE__ */ jsx(ButtonBeta, { color: "default", variant: "ghost", onClick: onActionClick, leftIcon: actionLeftIcon, rightIcon: actionRightIcon, "data-testid": "home-card-header-action", children: actionLabel })
+  ] });
+};
+export {
+  HomeCardHeader as default
+};

package/dist/modules/homepage/components/HomeCard/index.d.ts

@@ -0,0 +1,4 @@
+export { default as HomeCard } from './HomeCard';
+export * from './HomeCard';
+export type { HomeCardHeaderProps } from './HomeCardHeader';
+export type { HomeCardContentProps } from './HomeCardContent';

package/dist/modules/homepage/components/LastInfos/LastInfos.d.ts

@@ -0,0 +1,49 @@
+export interface LastInfosProps {
+    /**
+     * ID of the info.
+     */
+    id: number | string;
+    /**
+     * URL of the icon to display in the upper left corner.
+     * i.e. "/workspace/document/36a04526-15a2-4e8f-adb6-cca75630e50d"
+     */
+    icon: string;
+    /**
+     * ID of the thread to be displayed next to the icon.
+     */
+    threadId: number | string;
+    /**
+     * Name of the thread to be displayed next to the icon.
+     * i.e. "Informations importantes"
+     */
+    threadName: string;
+    /**
+     * Title of the info.
+     */
+    title: string;
+    /**
+     * Content of the info.
+     */
+    content: string;
+    /**
+     * Publication date in ISO format.
+     */
+    publicationDate: string;
+    /**
+     * Whether the info is highlighted.
+     */
+    isHeadline: boolean;
+    /**
+     * Name of the user who posted this info.
+     */
+    username: string;
+    /**
+     * Handle the click event.
+     */
+    onClick?: (threadId: number | string, id: number | string) => void;
+}
+declare const LastInfos: {
+    ({ id, icon, threadId, threadName, content, isHeadline, title, onClick, }: LastInfosProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default LastInfos;

package/dist/modules/homepage/components/LastInfos/LastInfos.js

@@ -0,0 +1,58 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import clsx from "clsx";
+import SvgIconActualites from "../../../icons/components/apps/IconActualites.js";
+import Flex from "../../../../components/Flex/Flex.js";
+const LastInfos = ({
+  id,
+  icon,
+  threadId,
+  threadName,
+  content,
+  isHeadline,
+  title,
+  onClick
+}) => {
+  const {
+    excerpt,
+    images
+  } = useMemo(() => {
+    if (!content)
+      return {
+        excerpt: "",
+        images: []
+      };
+    const doc = new DOMParser().parseFromString(content, "text/html"), imageSources = Array.from(doc.querySelectorAll("img")).map((image) => image.getAttribute("src") ?? "").filter((src) => src.trim().length > 0);
+    return Array.from(doc.querySelectorAll("img, video, iframe, audio, embed")).forEach((mediaElement) => {
+      var _a;
+      (_a = mediaElement.parentNode) == null || _a.removeChild(mediaElement);
+    }), {
+      excerpt: (doc.body.textContent ?? "").trim(),
+      images: imageSources
+    };
+  }, [content]), previewImages = images.slice(0, 3), hasMoreImages = images.length > previewImages.length, remainingImagesCount = Math.max(images.length - previewImages.length, 0), actionLabel = `${threadName} - ${title}`;
+  return /* @__PURE__ */ jsxs("article", { className: clsx("last-infos-card", {
+    "last-infos-card-headline": isHeadline,
+    "last-infos-card-clickable": !!onClick
+  }), children: [
+    onClick && /* @__PURE__ */ jsx("button", { type: "button", className: "last-infos-card-action", onClick: () => onClick(threadId, id), "aria-label": actionLabel }),
+    /* @__PURE__ */ jsx("header", { className: "last-infos-card-header", children: /* @__PURE__ */ jsxs(Flex, { gap: "8", align: "center", justify: "start", className: "last-infos-card-thread", children: [
+      icon ? /* @__PURE__ */ jsx("img", { src: icon, alt: threadName, width: 24, height: 24, loading: "lazy", className: "last-infos-card-thread-icon" }) : /* @__PURE__ */ jsx(SvgIconActualites, { width: 24, height: 24, className: "last-infos-card-thread-icon" }),
+      /* @__PURE__ */ jsx("span", { className: "last-infos-card-thread-name", children: threadName })
+    ] }) }),
+    /* @__PURE__ */ jsxs(Flex, { gap: "4", direction: "column", className: "last-infos-card-content", children: [
+      /* @__PURE__ */ jsx("div", { className: "last-infos-card-title", children: title }),
+      /* @__PURE__ */ jsx("p", { className: "last-infos-card-excerpt", children: excerpt }),
+      previewImages.length > 0 && /* @__PURE__ */ jsx("div", { className: "last-infos-card-medias", children: previewImages.map((image, index) => /* @__PURE__ */ jsxs("div", { className: "last-infos-card-media", children: [
+        /* @__PURE__ */ jsx("img", { src: image, alt: "", className: "last-infos-card-media-image", loading: "lazy" }),
+        hasMoreImages && index === 2 && /* @__PURE__ */ jsxs("div", { className: "last-infos-card-media-overlay", children: [
+          "+",
+          remainingImagesCount
+        ] })
+      ] }, `${image}-${index}`)) })
+    ] })
+  ] });
+};
+export {
+  LastInfos as default
+};

package/dist/modules/homepage/components/LastInfos/LastInfosContainer.d.ts

@@ -0,0 +1,4 @@
+export declare function LastInfosContainer(): string | import("react/jsx-runtime").JSX.Element;
+export declare namespace LastInfosContainer {
+    var displayName: string;
+}

package/dist/modules/homepage/components/LastInfos/LastInfosContainer.js

@@ -0,0 +1,37 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { LastInfosList } from "./LastInfosList.js";
+import { useLastInfos } from "./useLastInfos.js";
+import TextSkeleton from "../../../../components/Skeleton/TextSkeleton.js";
+function LastInfosContainer() {
+  const {
+    infos,
+    isLoading,
+    error
+  } = useLastInfos();
+  return isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(TextSkeleton, { size: "lg" }),
+    /* @__PURE__ */ jsx(TextSkeleton, { size: "lg" }),
+    /* @__PURE__ */ jsx(TextSkeleton, { size: "lg" })
+  ] }) : error ? error.message : /* @__PURE__ */ jsx(LastInfosList, { infos: (infos == null ? void 0 : infos.map(({
+    id,
+    content,
+    title,
+    username,
+    thread,
+    modifiedDate,
+    headline: isHeadline
+  }) => ({
+    id,
+    content,
+    title,
+    username,
+    icon: thread.icon,
+    threadId: thread.id,
+    threadName: thread.title,
+    publicationDate: modifiedDate,
+    isHeadline
+  }))) ?? [] });
+}
+export {
+  LastInfosContainer
+};

package/dist/modules/homepage/components/LastInfos/LastInfosList.d.ts

@@ -0,0 +1,13 @@
+import { LastInfosProps } from './LastInfos';
+export interface LastInfosListProps {
+    /** List of Info to display. */
+    infos: Array<LastInfosProps>;
+    /** Handle a click on an info. If undefined, Actualites will be opened to read the info details. */
+    onInfoClick?: (threadId: number | string, id: number | string) => void;
+    /** Handle a click on the "See more" button. If undefined, Actualites will be opened. */
+    onSeeMoreClick?: () => void;
+}
+export declare function LastInfosList({ infos, onInfoClick: handleInfoClick, onSeeMoreClick: handleSeeMoreClick, }: LastInfosListProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace LastInfosList {
+    var displayName: string;
+}

package/dist/modules/homepage/components/LastInfos/LastInfosList.js

@@ -0,0 +1,31 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import SvgIconArrowRight from "../../../icons/components/IconArrowRight.js";
+import LastInfos from "./LastInfos.js";
+import illuLastInfosEmptyScreen from "@edifice.io/bootstrap/dist/images/homepage/illu-last-infos-beta.svg";
+import Flex from "../../../../components/Flex/Flex.js";
+import ButtonBeta from "../../../../components/ButtonBeta/ButtonBeta.js";
+import EmptyScreen from "../../../../components/EmptyScreen/EmptyScreen.js";
+function LastInfosList({
+  infos,
+  onInfoClick: handleInfoClick = (threadId, id) => {
+    window.open(`/actualites/threads/${threadId}?info=${id}`, "_self");
+  },
+  onSeeMoreClick: handleSeeMoreClick = () => {
+    window.open("/actualites", "_self");
+  }
+}) {
+  const {
+    t
+  } = useTranslation();
+  return /* @__PURE__ */ jsxs(Flex, { gap: "8", direction: "column", className: "last-infos-list", children: [
+    /* @__PURE__ */ jsxs(Flex, { justify: "between", align: "center", className: "last-infos-list-header", children: [
+      /* @__PURE__ */ jsx("h2", { className: "last-infos-list-title", children: t("homepage.last-infos-list.title") }),
+      /* @__PURE__ */ jsx(ButtonBeta, { color: "tertiary", variant: "ghost", className: "last-infos-list-seemore", rightIcon: /* @__PURE__ */ jsx(SvgIconArrowRight, {}), onClick: handleSeeMoreClick, children: t("homepage.last-infos-list.see.more") })
+    ] }),
+    /* @__PURE__ */ jsx(Flex, { gap: "16", direction: "column", className: "last-infos-list-body", children: infos.length === 0 ? /* @__PURE__ */ jsx(EmptyScreen, { imageSrc: illuLastInfosEmptyScreen, size: 64, text: t("homepage.last-infos-list.empty") }) : infos.map((infosProps) => /* @__PURE__ */ jsx(LastInfos, { onClick: handleInfoClick, ...infosProps }, infosProps.id)) })
+  ] });
+}
+export {
+  LastInfosList
+};

package/dist/modules/homepage/components/LastInfos/index.d.ts

@@ -0,0 +1,4 @@
+export * from './LastInfos';
+export { default as LastInfos } from './LastInfos';
+export * from './LastInfosContainer';
+export * from './LastInfosList';

package/dist/modules/homepage/components/LastInfos/useLastInfos.d.ts

@@ -0,0 +1,18 @@
+export interface LastInfosModel {
+    modifiedDate: string;
+    headline: boolean;
+    thread: {
+        id: number;
+        icon: string;
+        title: string;
+    };
+    title: string;
+    content: string;
+    username: string;
+    id: number;
+}
+export declare function useLastInfos(): {
+    infos: LastInfosModel[] | undefined;
+    isLoading: boolean;
+    error: Error | null;
+};

package/dist/modules/homepage/components/LastInfos/useLastInfos.js

@@ -0,0 +1,25 @@
+import { odeServices } from "@edifice.io/client";
+import { useQuery, queryOptions } from "@tanstack/react-query";
+function useLastInfos() {
+  const {
+    data,
+    isLoading,
+    error
+  } = useQuery(queryOptions({
+    queryKey: ["infos", "preview", "last", 6],
+    queryFn: async () => {
+      const http = odeServices.http(), infos = await http.get("/actualites/api/v1/infos/preview/last/6");
+      if (http.isResponseError())
+        throw new Error(http.latestResponse.statusText);
+      return infos;
+    }
+  }));
+  return {
+    infos: data,
+    isLoading,
+    error
+  };
+}
+export {
+  useLastInfos
+};

package/dist/modules/homepage/components/MessageFlashList/MessageFlash.d.ts

@@ -0,0 +1,12 @@
+import { IFlashMessageModel } from '@edifice.io/client';
+export type MessageFlashProps = {
+    /** Message to display */
+    message: IFlashMessageModel;
+    /** Callback when the message is closed */
+    onCloseMessage?: (message: IFlashMessageModel) => void;
+};
+declare const MessageFlash: {
+    ({ message, onCloseMessage }: MessageFlashProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default MessageFlash;

package/dist/modules/homepage/components/MessageFlashList/MessageFlash.js

@@ -0,0 +1,65 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import { useState, useRef, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import SvgIconAlertTriangle from "../../../icons/components/IconAlertTriangle.js";
+import SvgIconClose from "../../../icons/components/IconClose.js";
+import SvgIconInfoCircle from "../../../icons/components/IconInfoCircle.js";
+import { useEdificeClient } from "../../../../providers/EdificeClientProvider/EdificeClientProvider.hook.js";
+import useBreakpoint from "../../../../hooks/useBreakpoint/useBreakpoint.js";
+import IconButton from "../../../../components/Button/IconButton.js";
+import Flex from "../../../../components/Flex/Flex.js";
+import Card from "../../../../components/Card/Card.js";
+import ButtonBeta from "../../../../components/ButtonBeta/ButtonBeta.js";
+const MessageFlash = ({
+  message,
+  onCloseMessage
+}) => {
+  const {
+    currentLanguage
+  } = useEdificeClient(), [isCollapsed, setIsCollapsed] = useState(!0), [hasOverflow, setHasOverflow] = useState(!1), contentRef = useRef(null), checkContentTimeoutRef = useRef(void 0), {
+    t
+  } = useTranslation(), {
+    md
+  } = useBreakpoint();
+  let content = "";
+  message.contents && (currentLanguage && message.contents[currentLanguage] ? content = message.contents[currentLanguage] : message.contents.fr ? content = message.contents.fr : content = Object.keys(message.contents).map((key) => message.contents[key]).filter((cont) => cont !== null)[0]), useEffect(() => {
+    const checkOverflow = () => {
+      if (contentRef.current) {
+        const element = contentRef.current, originalClass = element.className;
+        element.className = element.className.replace(/text-truncate(-\d+)?/g, "").trim();
+        const computedStyle = window.getComputedStyle(element), lineHeight = parseFloat(computedStyle.lineHeight) || parseFloat(computedStyle.fontSize) * 1.2, contentHeight = element.scrollHeight, twoLinesHeight = lineHeight * 2;
+        setHasOverflow(contentHeight > twoLinesHeight + 2), element.className = originalClass;
+      }
+    };
+    content && (checkContentTimeoutRef.current && clearTimeout(checkContentTimeoutRef.current), checkContentTimeoutRef.current = setTimeout(checkOverflow, 0));
+  }, [content]), useEffect(() => () => {
+    checkContentTimeoutRef.current && clearTimeout(checkContentTimeoutRef.current);
+  });
+  const classes = clsx("message-flash", message.color ? `message-flash-${message.color}` : null), classesContent = clsx("message-flash-content", isCollapsed ? "text-truncate text-truncate-2" : null), handleCollapse = () => {
+    setIsCollapsed((collapsed) => !collapsed);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: classes, children: [
+    (hasOverflow && !isCollapsed || !hasOverflow) && /* @__PURE__ */ jsx(IconButton, { variant: "ghost", color: "tertiary", icon: /* @__PURE__ */ jsx(SvgIconClose, {}), onClick: () => {
+      onCloseMessage == null || onCloseMessage(message);
+    }, className: "message-flash-close-button", "data-testid": "message-flash-close-button", "aria-label": t("close.message", {
+      title: message.title
+    }), title: t("close.message", {
+      title: message.title
+    }) }),
+    /* @__PURE__ */ jsx("div", { className: "message-flash-icon", role: "img", "aria-label": message.color === "red" ? t("warning") : t("information"), children: message.color && message.color === "red" ? /* @__PURE__ */ jsx(SvgIconAlertTriangle, {}) : /* @__PURE__ */ jsx(SvgIconInfoCircle, {}) }),
+    /* @__PURE__ */ jsxs(Flex, { direction: "column", className: "w-100 message-flash-body", children: [
+      /* @__PURE__ */ jsx(Card.Title, { children: message.title }),
+      /* @__PURE__ */ jsx("div", { ref: contentRef, className: classesContent, dangerouslySetInnerHTML: {
+        __html: content
+      } }),
+      /* @__PURE__ */ jsxs(Flex, { direction: md ? "row" : "column", justify: "between", className: "message-flash-footer", children: [
+        /* @__PURE__ */ jsx("div", { className: "fst-italic", children: message.signature || "" }),
+        hasOverflow && /* @__PURE__ */ jsx(ButtonBeta, { "data-testid": isCollapsed ? "message-flash-view-more-button" : "message-flash-view-less-button", color: "default", variant: "ghost", onClick: handleCollapse, "aria-controls": `message-flash-${message.id}-content`, "aria-expanded": !isCollapsed, className: "message-flash-collapse-button", children: t(isCollapsed ? "read.more" : "read.less") })
+      ] })
+    ] })
+  ] });
+};
+export {
+  MessageFlash as default
+};

package/dist/modules/homepage/components/MessageFlashList/MessageFlashList.d.ts

@@ -0,0 +1,12 @@
+import { IFlashMessageModel } from '@edifice.io/client';
+export type MessageFlashListProps = {
+    /** List of messages to display */
+    messages: IFlashMessageModel[];
+    /** Callback when the message is closed */
+    onCloseMessage?: (message: IFlashMessageModel) => void;
+};
+declare const MessageFlashList: {
+    ({ messages, onCloseMessage, }: MessageFlashListProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default MessageFlashList;

package/dist/modules/homepage/components/MessageFlashList/MessageFlashList.js

@@ -0,0 +1,10 @@
+import { jsx } from "react/jsx-runtime";
+import MessageFlash from "./MessageFlash.js";
+import Flex from "../../../../components/Flex/Flex.js";
+const MessageFlashList = ({
+  messages,
+  onCloseMessage
+}) => /* @__PURE__ */ jsx("section", { role: "region", className: "message-flash-list", children: /* @__PURE__ */ jsx(Flex, { direction: "column", gap: "16", role: "list", children: messages.map((message) => /* @__PURE__ */ jsx("div", { role: "listitem", children: /* @__PURE__ */ jsx(MessageFlash, { message, onCloseMessage: (msg) => onCloseMessage == null ? void 0 : onCloseMessage(msg) }) }, message.id)) }) });
+export {
+  MessageFlashList as default
+};

package/dist/modules/homepage/components/MessageFlashList/MessageFlashListContainer.d.ts

@@ -0,0 +1,5 @@
+export declare const MessageFlashListContainer: {
+    (): import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};
+export default MessageFlashListContainer;

package/dist/modules/homepage/components/MessageFlashList/MessageFlashListContainer.js

@@ -0,0 +1,14 @@
+import { jsx } from "react/jsx-runtime";
+import { useMessageFlashListContainer } from "./hooks/useMessageFlashList.js";
+import MessageFlashList from "./MessageFlashList.js";
+const MessageFlashListContainer = () => {
+  const {
+    messages,
+    error,
+    handleMarkAsRead
+  } = useMessageFlashListContainer();
+  return !messages || messages.length === 0 || error ? null : /* @__PURE__ */ jsx(MessageFlashList, { messages, onCloseMessage: handleMarkAsRead });
+};
+export {
+  MessageFlashListContainer
+};

package/dist/modules/homepage/components/MessageFlashList/hooks/useMessageFlashList.d.ts

@@ -0,0 +1,16 @@
+import { IFlashMessageModel } from '@edifice.io/client';
+export interface UseMessageFlashListContainerReturn {
+    /** Array of flash messages */
+    messages: IFlashMessageModel[] | undefined;
+    /** Loading state for fetching messages */
+    isLoading: boolean;
+    /** Error state from fetching messages */
+    error: Error | null;
+    /** Handler to mark a message as read */
+    handleMarkAsRead: (message: IFlashMessageModel) => void;
+}
+/**
+ * Custom hook that provides flash messages data and handlers with exposed loading states
+ * @returns Object containing messages, loading state, error state, and mark as read handler
+ */
+export declare const useMessageFlashListContainer: () => UseMessageFlashListContainerReturn;

package/dist/modules/homepage/components/MessageFlashList/hooks/useMessageFlashList.js

@@ -0,0 +1,19 @@
+import { useMessagesFlash, useMarkAsRead } from "../services/queries/messagesFlash.js";
+const useMessageFlashListContainer = () => {
+  const {
+    data: messages,
+    isLoading,
+    error
+  } = useMessagesFlash(), markAsReadMessage = useMarkAsRead();
+  return {
+    messages,
+    isLoading,
+    error,
+    handleMarkAsRead: (message) => {
+      markAsReadMessage.mutate(message);
+    }
+  };
+};
+export {
+  useMessageFlashListContainer
+};

package/dist/modules/homepage/components/MessageFlashList/index.d.ts

@@ -0,0 +1,4 @@
+export * from './MessageFlash';
+export * from './MessageFlashList';
+export * from './MessageFlashListContainer';
+export { default as MessageFlashList } from './MessageFlashList';