@edifice.io/react 2.6.9 → 2.6.10-develop-b2school.20261019104630

package/dist/modules/homepage/components/Agenda/services/api/agendaService.d.ts

@@ -0,0 +1,24 @@
+import { Calendar, CalendarEvent } from '@edifice.io/client';
+/**
+ * Creates an agenda service with methods to fetch the current user's
+ * calendars and upcoming events (homepage "Agenda" widget).
+ *
+ * Backend contract (provisional, see IMPULS-5880/IMPULS-6095): `GET
+ * /calendar/calendars` lists the user's calendars, `GET
+ * /calendar/events/widget?calendarId=...&nb=N` returns up to `N` events for
+ * the given calendars. Whether that second endpoint already excludes past
+ * (fully elapsed) events isn't guaranteed, so callers should re-apply that
+ * filter themselves.
+ *
+ * @param baseURL The base URL for the agenda service API.
+ */
+export declare const createAgendaService: (baseURL: string) => {
+    /**
+     * Get the calendars the current user can see events from.
+     */
+    getCalendars(): Promise<Calendar[]>;
+    /**
+     * Get up to `nb` events for the given calendars, in no particular order.
+     */
+    getEvents(calendarIds: string[], nb: number): Promise<CalendarEvent[]>;
+};

package/dist/modules/homepage/components/Agenda/services/api/agendaService.js

@@ -0,0 +1,45 @@
+import { odeServices } from "@edifice.io/client";
+const toCalendar = ({
+  _id,
+  title,
+  color,
+  isExternal
+}) => ({
+  id: _id,
+  title,
+  color,
+  isExternal
+}), toCalendarEvent = ({
+  _id,
+  title,
+  allday,
+  startMoment,
+  endMoment,
+  calendar
+}) => ({
+  id: _id,
+  calendarId: calendar[0],
+  title,
+  startMoment,
+  endMoment,
+  allDay: allday
+}), createAgendaService = (baseURL) => ({
+  /**
+   * Get the calendars the current user can see events from.
+   */
+  async getCalendars() {
+    return (await odeServices.http().get(`${baseURL}/calendar/calendars`)).map(toCalendar);
+  },
+  /**
+   * Get up to `nb` events for the given calendars, in no particular order.
+   */
+  async getEvents(calendarIds, nb) {
+    if (calendarIds.length === 0)
+      return [];
+    const query = new URLSearchParams();
+    return calendarIds.forEach((id) => query.append("calendarId", id)), query.set("nb", String(nb)), (await odeServices.http().get(`${baseURL}/calendar/events/widget?${query.toString()}`)).map(toCalendarEvent);
+  }
+});
+export {
+  createAgendaService
+};

package/dist/modules/homepage/components/Agenda/services/api/index.d.ts

@@ -0,0 +1,4 @@
+export declare const agendaService: {
+    getCalendars(): Promise<import('@edifice.io/client').Calendar[]>;
+    getEvents(calendarIds: string[], nb: number): Promise<import('@edifice.io/client').CalendarEvent[]>;
+};

package/dist/modules/homepage/components/Agenda/services/api/index.js

@@ -0,0 +1,5 @@
+import { createAgendaService } from "./agendaService.js";
+const agendaService = createAgendaService("");
+export {
+  agendaService
+};

package/dist/modules/homepage/components/Agenda/services/queries/agenda.d.ts

@@ -0,0 +1,19 @@
+import { Calendar, CalendarEvent } from '@edifice.io/client';
+export declare const agendaQueryKeys: {
+    calendars: () => readonly ["agenda", "calendars"];
+    events: (calendarIds: string[], nb: number) => readonly ["agenda", "events", string[], number];
+};
+export declare const agendaQueryOptions: {
+    getCalendars(): import('@tanstack/react-query').OmitKeyof<import('@tanstack/react-query').UseQueryOptions<Calendar[], Error, Calendar[], import('@tanstack/react-query').QueryKey>, "queryFn"> & {
+        queryFn?: import('@tanstack/react-query').QueryFunction<Calendar[], import('@tanstack/react-query').QueryKey, never> | undefined;
+    } & {
+        queryKey: import('@tanstack/react-query').DataTag<import('@tanstack/react-query').QueryKey, Calendar[]>;
+    };
+    getEvents(calendarIds: string[], nb: number): import('@tanstack/react-query').OmitKeyof<import('@tanstack/react-query').UseQueryOptions<CalendarEvent[], Error, CalendarEvent[], import('@tanstack/react-query').QueryKey>, "queryFn"> & {
+        queryFn?: import('@tanstack/react-query').QueryFunction<CalendarEvent[], import('@tanstack/react-query').QueryKey, never> | undefined;
+    } & {
+        queryKey: import('@tanstack/react-query').DataTag<import('@tanstack/react-query').QueryKey, CalendarEvent[]>;
+    };
+};
+export declare const useCalendars: () => import('@tanstack/react-query').UseQueryResult<Calendar[], Error>;
+export declare const useEvents: (calendarIds: string[], nb: number) => import('@tanstack/react-query').UseQueryResult<CalendarEvent[], Error>;

package/dist/modules/homepage/components/Agenda/services/queries/agenda.js

@@ -0,0 +1,26 @@
+import { useQuery, queryOptions } from "@tanstack/react-query";
+import { agendaService } from "../api/index.js";
+const agendaQueryKeys = {
+  calendars: () => ["agenda", "calendars"],
+  events: (calendarIds, nb) => ["agenda", "events", calendarIds, nb]
+}, agendaQueryOptions = {
+  getCalendars() {
+    return queryOptions({
+      queryKey: agendaQueryKeys.calendars(),
+      queryFn: async () => agendaService.getCalendars()
+    });
+  },
+  getEvents(calendarIds, nb) {
+    return queryOptions({
+      queryKey: agendaQueryKeys.events(calendarIds, nb),
+      queryFn: async () => agendaService.getEvents(calendarIds, nb),
+      enabled: calendarIds.length > 0
+    });
+  }
+}, useCalendars = () => useQuery(agendaQueryOptions.getCalendars()), useEvents = (calendarIds, nb) => useQuery(agendaQueryOptions.getEvents(calendarIds, nb));
+export {
+  agendaQueryKeys,
+  agendaQueryOptions,
+  useCalendars,
+  useEvents
+};

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

@@ -0,0 +1,9 @@
+import { BriefMeArticle, BriefMeStatus } from './types';
+export interface BriefMeProps {
+    handleActionClick: () => void;
+    status: BriefMeStatus;
+    category: string;
+    onCategoryChange: (value: string) => void;
+    articles: BriefMeArticle[];
+}
+export default function BriefMe({ handleActionClick, status, category, onCategoryChange, articles, }: BriefMeProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,59 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import illuBriefMeError from "@edifice.io/bootstrap/dist/images/homepage/illu-briefme-error.svg";
+import clsx from "clsx";
+import { useTranslation } from "react-i18next";
+import SvgIconExternalLink from "../../../icons/components/IconExternalLink.js";
+import HomeCard from "../HomeCard/HomeCard.js";
+import IconButton from "../../../../components/Button/IconButton.js";
+import SegmentedControl from "../../../../components/SegmentedControl/SegmentedControl.js";
+import TextSkeleton from "../../../../components/Skeleton/TextSkeleton.js";
+import Image from "../../../../components/Image/Image.js";
+function BriefMe({
+  handleActionClick,
+  status,
+  category,
+  onCategoryChange,
+  articles
+}) {
+  const {
+    t
+  } = useTranslation(), categoryOptions = [{
+    label: t("homepage.briefme.category.briefme"),
+    value: "briefme"
+  }, {
+    label: t("homepage.briefme.category.brief-eco"),
+    value: "brief-eco"
+  }, {
+    label: t("homepage.briefme.category.brief-science"),
+    value: "brief-science"
+  }];
+  return /* @__PURE__ */ jsxs(HomeCard, { variant: "primary", className: "briefme", children: [
+    /* @__PURE__ */ jsxs("div", { className: "briefme__header", children: [
+      /* @__PURE__ */ jsx("h3", { className: "briefme__title", children: t("homepage.briefme.title") }),
+      /* @__PURE__ */ jsx(IconButton, { "aria-label": t("homepage.briefme.open"), onClick: handleActionClick, icon: /* @__PURE__ */ jsx(SvgIconExternalLink, {}), variant: "ghost", color: "tertiary" })
+    ] }),
+    /* @__PURE__ */ jsxs(HomeCard.Content, { className: clsx("briefme__body", `briefme__body--${status}`), children: [
+      status !== "error" && /* @__PURE__ */ jsx(SegmentedControl, { "aria-label": t("homepage.briefme.categories"), options: categoryOptions, value: category, onChange: onCategoryChange, className: "briefme__categories" }),
+      status === "loading" && /* @__PURE__ */ jsxs("div", { className: "briefme__loading", "data-testid": "briefme-loading", children: [
+        /* @__PURE__ */ jsx(TextSkeleton, { size: "lg", className: "briefme__loading-item" }),
+        /* @__PURE__ */ jsx(TextSkeleton, { size: "lg", className: "briefme__loading-item" }),
+        /* @__PURE__ */ jsx(TextSkeleton, { size: "lg", className: "briefme__loading-item" })
+      ] }),
+      status === "error" && /* @__PURE__ */ jsxs("div", { className: "briefme__error", children: [
+        /* @__PURE__ */ jsx(Image, { src: illuBriefMeError, alt: "", className: "briefme__error-illu" }),
+        /* @__PURE__ */ jsxs("p", { className: "briefme__error-message", children: [
+          /* @__PURE__ */ jsx("span", { className: "briefme__error-line", children: t("homepage.briefme.error.connection") }),
+          /* @__PURE__ */ jsx("span", { className: "briefme__error-line", children: t("homepage.briefme.error.help") })
+        ] })
+      ] }),
+      status === "empty" && /* @__PURE__ */ jsx("p", { className: "briefme__empty", children: t("homepage.briefme.empty") }),
+      status === "default" && /* @__PURE__ */ jsx("ul", { className: "briefme__list", children: articles.map((article) => /* @__PURE__ */ jsxs("li", { className: "briefme__article", children: [
+        /* @__PURE__ */ jsx("span", { className: "briefme__article-date", children: article.date }),
+        /* @__PURE__ */ jsx("a", { className: "briefme__article-title", href: article.url, target: "_blank", rel: "noopener noreferrer", children: article.title })
+      ] }, article.id)) })
+    ] })
+  ] });
+}
+export {
+  BriefMe as default
+};

package/dist/modules/homepage/components/BriefMe/BriefMeContainer.d.ts

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

package/dist/modules/homepage/components/BriefMe/BriefMeContainer.js

@@ -0,0 +1,17 @@
+import { jsx } from "react/jsx-runtime";
+import BriefMe from "./BriefMe.js";
+import { useBriefMe } from "./useBriefMe.js";
+function BriefMeContainer() {
+  const {
+    category,
+    setCategory,
+    articles,
+    status
+  } = useBriefMe();
+  return /* @__PURE__ */ jsx(BriefMe, { handleActionClick: () => {
+    window.open("https://brief.me", "_blank", "noopener,noreferrer");
+  }, status, category, onCategoryChange: (value) => setCategory(value), articles });
+}
+export {
+  BriefMeContainer
+};

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

@@ -0,0 +1,4 @@
+export * from './BriefMe';
+export { default as BriefMe } from './BriefMe';
+export * from './BriefMeContainer';
+export * from './useBriefMe';

package/dist/modules/homepage/components/BriefMe/types.d.ts

@@ -0,0 +1,17 @@
+export interface BriefMeArticle {
+    id: string;
+    date: string;
+    title: string;
+    url: string;
+}
+export type BriefMeStatus = 'loading' | 'default' | 'empty' | 'error';
+/**
+ * Brief.me feeds are proxied and cached by app-registry, one endpoint per
+ * category. Keys match the SegmentedControl option values of `BriefMe`.
+ */
+export declare const BRIEFME_ENDPOINTS: {
+    readonly briefme: "/appregistry/widget/cache/external/briefme";
+    readonly 'brief-eco': "/appregistry/widget/cache/external/briefeco";
+    readonly 'brief-science': "/appregistry/widget/cache/external/briefscience";
+};
+export type BriefMeCategory = keyof typeof BRIEFME_ENDPOINTS;

package/dist/modules/homepage/components/BriefMe/types.js

@@ -0,0 +1,8 @@
+const BRIEFME_ENDPOINTS = {
+  briefme: "/appregistry/widget/cache/external/briefme",
+  "brief-eco": "/appregistry/widget/cache/external/briefeco",
+  "brief-science": "/appregistry/widget/cache/external/briefscience"
+};
+export {
+  BRIEFME_ENDPOINTS
+};

package/dist/modules/homepage/components/BriefMe/useBriefMe.d.ts

@@ -0,0 +1,31 @@
+import { School } from '@edifice.io/client';
+import { BriefMeArticle, BriefMeCategory, BriefMeStatus } from './types';
+interface BriefMeEntry {
+    title: string;
+    published_at: string;
+    url: string;
+}
+/**
+ * Article URLs served by Brief.me embed the literal `ID_ETAB` and `ID_ENT`
+ * placeholders, which identify the subscribing school to their SSO. Both are
+ * replaced by base64-encoded values: the school UAI, and the GAR code taken
+ * from its exports.
+ */
+export declare function buildGarLink(url: string, school?: School): string;
+export declare function briefMeQueryOptions(category: BriefMeCategory): import('@tanstack/react-query').OmitKeyof<import('@tanstack/react-query').UseQueryOptions<BriefMeEntry[], Error, BriefMeEntry[], import('@tanstack/react-query').QueryKey>, "queryFn"> & {
+    queryFn?: import('@tanstack/react-query').QueryFunction<BriefMeEntry[], import('@tanstack/react-query').QueryKey, never> | undefined;
+} & {
+    queryKey: import('@tanstack/react-query').DataTag<import('@tanstack/react-query').QueryKey, BriefMeEntry[]>;
+};
+/**
+ * Loads the Brief.me articles of the selected category (most recent first,
+ * capped at `BRIEFME_MAX_ARTICLES`), and resolves their links against the
+ * school currently selected by the user.
+ */
+export declare function useBriefMe(): {
+    category: "briefme" | "brief-eco" | "brief-science";
+    setCategory: import('react').Dispatch<import('react').SetStateAction<"briefme" | "brief-eco" | "brief-science">>;
+    articles: BriefMeArticle[];
+    status: BriefMeStatus;
+};
+export {};

package/dist/modules/homepage/components/BriefMe/useBriefMe.js

@@ -0,0 +1,51 @@
+import { odeServices } from "@edifice.io/client";
+import { queryOptions, useQuery } from "@tanstack/react-query";
+import { useState, useMemo } from "react";
+import useDate from "../../../../hooks/useDate/useDate.js";
+import { useUserSchools } from "../../hooks/useUserSchools.js";
+import { BRIEFME_ENDPOINTS } from "./types.js";
+const BRIEFME_DEFAULT_CATEGORY = "briefme", BRIEFME_MAX_ARTICLES = 5;
+function buildGarLink(url, school) {
+  const schoolExports = (school == null ? void 0 : school.exports) ?? [], garExport = schoolExports.find((entry) => entry.startsWith("GAR-")), garCode = garExport ? garExport.replace("GAR-", "") : schoolExports[0] ?? "";
+  return url.replace("ID_ETAB", btoa((school == null ? void 0 : school.UAI) ?? "")).replace("ID_ENT", btoa(garCode));
+}
+function briefMeQueryOptions(category) {
+  return queryOptions({
+    queryKey: ["briefme", category],
+    queryFn: async () => {
+      const http = odeServices.http(), feed = await http.get(BRIEFME_ENDPOINTS[category]);
+      if (http.isResponseError())
+        throw new Error(http.latestResponse.statusText);
+      if (!feed || feed.error || !Array.isArray(feed.results))
+        throw new Error((feed == null ? void 0 : feed.error) ?? "briefme.invalid.response");
+      return feed.results;
+    }
+  });
+}
+function useBriefMe() {
+  const [category, setCategory] = useState(BRIEFME_DEFAULT_CATEGORY), {
+    selectedSchool
+  } = useUserSchools(), {
+    formatDate
+  } = useDate(), {
+    data,
+    isLoading,
+    error
+  } = useQuery(briefMeQueryOptions(category)), articles = useMemo(() => [...data ?? []].sort((a, b) => new Date(b.published_at).getTime() - new Date(a.published_at).getTime()).slice(0, BRIEFME_MAX_ARTICLES).map((entry) => ({
+    id: entry.url,
+    date: formatDate(entry.published_at, "long"),
+    title: entry.title,
+    url: buildGarLink(entry.url, selectedSchool)
+  })), [data, selectedSchool, formatDate]), status = error ? "error" : isLoading ? "loading" : articles.length > 0 ? "default" : "empty";
+  return {
+    category,
+    setCategory,
+    articles,
+    status
+  };
+}
+export {
+  briefMeQueryOptions,
+  buildGarLink,
+  useBriefMe
+};

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

@@ -0,0 +1,7 @@
+import { CantineSection, CantineStatus } from './types';
+export interface CantineProps {
+    status: CantineStatus;
+    sections: CantineSection[];
+    handleFullScreenClick: () => void;
+}
+export default function Cantine({ status, sections, handleFullScreenClick, }: CantineProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,44 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import illuCantineEmpty from "@edifice.io/bootstrap/dist/images/homepage/cantine/illu-cantine-empty.svg";
+import { useTranslation } from "react-i18next";
+import SvgIconFullScreen from "../../../icons/components/IconFullScreen.js";
+import CantineMenuSection from "./components/CantineMenuSection.js";
+import HomeCard from "../HomeCard/HomeCard.js";
+import ButtonBeta from "../../../../components/ButtonBeta/ButtonBeta.js";
+import TextSkeleton from "../../../../components/Skeleton/TextSkeleton.js";
+import Image from "../../../../components/Image/Image.js";
+function Cantine({
+  status,
+  sections,
+  handleFullScreenClick
+}) {
+  const {
+    t
+  } = useTranslation();
+  return /* @__PURE__ */ jsxs(HomeCard, { variant: "primary", className: "cantine", children: [
+    /* @__PURE__ */ jsxs("div", { className: "cantine__header", children: [
+      /* @__PURE__ */ jsx("h3", { className: "cantine__title", children: t("homepage.widget.cantine.title") }),
+      status !== "error" && /* @__PURE__ */ jsx(ButtonBeta, { "aria-label": t("homepage.widget.cantine.open"), onClick: handleFullScreenClick, leftIcon: /* @__PURE__ */ jsx(SvgIconFullScreen, {}), variant: "ghost", color: "tertiary" })
+    ] }),
+    /* @__PURE__ */ jsxs(HomeCard.Content, { className: "cantine__content", children: [
+      status === "loading" && /* @__PURE__ */ jsxs("div", { className: "cantine__loading", "data-testid": "cantine-loading", children: [
+        /* @__PURE__ */ jsx(TextSkeleton, { size: "lg", className: "cantine__loading-item" }),
+        /* @__PURE__ */ jsx(TextSkeleton, { size: "lg", className: "cantine__loading-item" }),
+        /* @__PURE__ */ jsx(TextSkeleton, { size: "lg", className: "cantine__loading-item" })
+      ] }),
+      status === "error" && /* @__PURE__ */ jsxs("div", { className: "cantine__error", children: [
+        /* @__PURE__ */ jsx(Image, { src: illuCantineEmpty, alt: t("homepage.widget.cantine.emptyIllustration"), className: "cantine__error-illu" }),
+        /* @__PURE__ */ jsx("p", { className: "cantine__error-message", children: t("homepage.widget.cantine.error") })
+      ] }),
+      status === "empty" && /* @__PURE__ */ jsxs("div", { className: "cantine__empty", children: [
+        /* @__PURE__ */ jsx(Image, { src: illuCantineEmpty, alt: t("homepage.widget.cantine.emptyIllustration"), className: "cantine__empty-illu" }),
+        /* @__PURE__ */ jsx("p", { className: "cantine__empty-message", children: t("homepage.widget.cantine.empty") }),
+        /* @__PURE__ */ jsx(ButtonBeta, { variant: "outline", rightIcon: /* @__PURE__ */ jsx(SvgIconFullScreen, {}), onClick: handleFullScreenClick, children: t("homepage.widget.cantine.seeMore") })
+      ] }),
+      status === "default" && /* @__PURE__ */ jsx("ul", { className: "cantine__menu", children: sections.map((section) => /* @__PURE__ */ jsx(CantineMenuSection, { category: section.category, items: section.items }, section.category)) })
+    ] })
+  ] });
+}
+export {
+  Cantine as default
+};

package/dist/modules/homepage/components/Cantine/CantineContainer.d.ts

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

package/dist/modules/homepage/components/Cantine/CantineContainer.js

@@ -0,0 +1,18 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import Cantine from "./Cantine.js";
+import { CantineModalContainer } from "./CantineModalContainer.js";
+import { useCantine } from "./hooks/useCantine.js";
+function CantineContainer() {
+  const {
+    sections,
+    status
+  } = useCantine(), [isModalOpen, setIsModalOpen] = useState(!1);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Cantine, { status, sections, handleFullScreenClick: () => setIsModalOpen(!0) }),
+    isModalOpen && /* @__PURE__ */ jsx(CantineModalContainer, { onClose: () => setIsModalOpen(!1) })
+  ] });
+}
+export {
+  CantineContainer
+};

package/dist/modules/homepage/components/Cantine/CantineModal.d.ts

@@ -0,0 +1,24 @@
+import { School } from '@edifice.io/client';
+import { CantineMenuType, CantineSection, CantineStatus } from './types';
+export interface CantineModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    schools: School[];
+    selectedSchool?: School;
+    onSchoolChange: (schoolId: string) => void;
+    hasDinner: boolean;
+    menuType: CantineMenuType;
+    onMenuTypeChange: (menuType: CantineMenuType) => void;
+    date: string;
+    canGoPrevious: boolean;
+    canGoNext: boolean;
+    onPreviousDay: () => void;
+    onNextDay: () => void;
+    sections: CantineSection[];
+    status: CantineStatus;
+}
+declare const CantineModal: {
+    ({ isOpen, onClose, schools, selectedSchool, onSchoolChange, hasDinner, menuType, onMenuTypeChange, date, canGoPrevious, canGoNext, onPreviousDay, onNextDay, sections, status, }: CantineModalProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default CantineModal;

package/dist/modules/homepage/components/Cantine/CantineModal.js

@@ -0,0 +1,88 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import illuCantineEmpty from "@edifice.io/bootstrap/dist/images/homepage/cantine/illu-cantine-empty.svg";
+import { useTranslation } from "react-i18next";
+import SvgIconRafterLeft from "../../../icons/components/IconRafterLeft.js";
+import SvgIconRafterRight from "../../../icons/components/IconRafterRight.js";
+import CantineLegend from "./components/CantineLegend.js";
+import CantineMenuSection from "./components/CantineMenuSection.js";
+import useDate from "../../../../hooks/useDate/useDate.js";
+import ModalBeta from "../../../../components/ModalBeta/ModalBeta.js";
+import FormControl from "../../../../components/Form/FormControl.js";
+import Label from "../../../../components/Label/Label.js";
+import Select from "../../../../components/Select/Select.js";
+import ButtonBeta from "../../../../components/ButtonBeta/ButtonBeta.js";
+import TextSkeleton from "../../../../components/Skeleton/TextSkeleton.js";
+import Image from "../../../../components/Image/Image.js";
+const CantineModal = ({
+  isOpen,
+  onClose,
+  schools,
+  selectedSchool,
+  onSchoolChange,
+  hasDinner,
+  menuType,
+  onMenuTypeChange,
+  date,
+  canGoPrevious,
+  canGoNext,
+  onPreviousDay,
+  onNextDay,
+  sections,
+  status
+}) => {
+  const {
+    t
+  } = useTranslation(), {
+    formatDate
+  } = useDate(), hasSchoolSelect = schools.length > 1, menuTypeOptions = [{
+    value: "lunch",
+    label: t("homepage.widget.cantine.lunch")
+  }, {
+    value: "dinner",
+    label: t("homepage.widget.cantine.dinner")
+  }];
+  return /* @__PURE__ */ jsxs(ModalBeta, { id: "cantine-modal", size: "l", isOpen, onModalClose: onClose, children: [
+    /* @__PURE__ */ jsx(ModalBeta.Header, { onModalClose: onClose, children: t("homepage.widget.cantine.title") }),
+    /* @__PURE__ */ jsxs(ModalBeta.Body, { className: "cantine-modal", children: [
+      /* @__PURE__ */ jsxs("div", { className: "cantine-modal__aside", children: [
+        (hasSchoolSelect || hasDinner) && /* @__PURE__ */ jsx("div", { className: "cantine-modal__form", children: /* @__PURE__ */ jsxs("div", { className: "cantine-modal__fields", children: [
+          hasSchoolSelect && /* @__PURE__ */ jsxs(FormControl, { id: "cantine-modal-school", className: "cantine-modal__field", children: [
+            /* @__PURE__ */ jsx(Label, { className: "cantine-modal__label", children: t("homepage.widget.cantine.school") }),
+            /* @__PURE__ */ jsx(Select, { block: !0, placeholderOption: t("homepage.widget.cantine.school"), options: schools.map((school) => ({
+              value: school.id,
+              label: school.name
+            })), selectedValue: selectedSchool && {
+              value: selectedSchool.id,
+              label: selectedSchool.name
+            }, onValueChange: (option) => onSchoolChange(typeof option == "string" ? option : option.value) })
+          ] }),
+          hasDinner && /* @__PURE__ */ jsxs(FormControl, { id: "cantine-modal-menu", className: "cantine-modal__field", children: [
+            /* @__PURE__ */ jsx(Label, { className: "cantine-modal__label", children: t("homepage.widget.cantine.menu") }),
+            /* @__PURE__ */ jsx(Select, { block: !0, placeholderOption: t("homepage.widget.cantine.lunch"), options: menuTypeOptions, selectedValue: menuTypeOptions.find((option) => option.value === menuType), onValueChange: (option) => onMenuTypeChange(typeof option == "string" ? option : option.value) })
+          ] })
+        ] }) }),
+        /* @__PURE__ */ jsx(CantineLegend, {})
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "cantine-modal__panel", children: [
+        /* @__PURE__ */ jsxs("div", { className: "cantine-modal__nav", children: [
+          /* @__PURE__ */ jsx(ButtonBeta, { "aria-label": t("homepage.widget.cantine.previousDay"), leftIcon: /* @__PURE__ */ jsx(SvgIconRafterLeft, {}), variant: "ghost", color: "tertiary", disabled: !canGoPrevious, onClick: onPreviousDay }),
+          /* @__PURE__ */ jsx("p", { className: "cantine-modal__date", children: formatDate(date, "dddd D MMMM") }),
+          /* @__PURE__ */ jsx(ButtonBeta, { "aria-label": t("homepage.widget.cantine.nextDay"), leftIcon: /* @__PURE__ */ jsx(SvgIconRafterRight, {}), variant: "ghost", color: "tertiary", disabled: !canGoNext, onClick: onNextDay })
+        ] }),
+        status === "loading" && /* @__PURE__ */ jsxs("div", { className: "cantine-modal__loading", "data-testid": "cantine-modal-loading", children: [
+          /* @__PURE__ */ jsx(TextSkeleton, { size: "lg", className: "cantine-modal__loading-item" }),
+          /* @__PURE__ */ jsx(TextSkeleton, { size: "lg", className: "cantine-modal__loading-item" }),
+          /* @__PURE__ */ jsx(TextSkeleton, { size: "lg", className: "cantine-modal__loading-item" })
+        ] }),
+        (status === "empty" || status === "error") && /* @__PURE__ */ jsxs("div", { className: "cantine-modal__empty", children: [
+          /* @__PURE__ */ jsx(Image, { src: illuCantineEmpty, alt: t("homepage.widget.cantine.emptyIllustration"), className: "cantine-modal__empty-illu" }),
+          /* @__PURE__ */ jsx("p", { className: "cantine-modal__empty-message", children: t("homepage.widget.cantine.empty") })
+        ] }),
+        status === "default" && /* @__PURE__ */ jsx("ul", { className: "cantine-modal__menu", children: sections.map((section) => /* @__PURE__ */ jsx(CantineMenuSection, { category: section.category, items: section.items }, section.category)) })
+      ] })
+    ] })
+  ] });
+};
+export {
+  CantineModal as default
+};

package/dist/modules/homepage/components/Cantine/CantineModalContainer.d.ts

@@ -0,0 +1,7 @@
+export interface CantineModalContainerProps {
+    onClose: () => void;
+}
+export declare function CantineModalContainer({ onClose }: CantineModalContainerProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace CantineModalContainer {
+    var displayName: string;
+}

package/dist/modules/homepage/components/Cantine/CantineModalContainer.js

@@ -0,0 +1,12 @@
+import { jsx } from "react/jsx-runtime";
+import CantineModal from "./CantineModal.js";
+import { useCantineModal } from "./hooks/useCantineModal.js";
+function CantineModalContainer({
+  onClose
+}) {
+  const cantineModal = useCantineModal();
+  return /* @__PURE__ */ jsx(CantineModal, { isOpen: !0, onClose, ...cantineModal });
+}
+export {
+  CantineModalContainer
+};

package/dist/modules/homepage/components/Cantine/components/CantineLegend.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Meaning of the quality pictograms displayed next to the dishes, plus the
+ * legal notice required by the canteen provider.
+ */
+export default function CantineLegend(): import("react/jsx-runtime").JSX.Element;

package/dist/modules/homepage/components/Cantine/components/CantineLegend.js

@@ -0,0 +1,22 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { DISH_TAGS } from "./cantineLabels.js";
+import Image from "../../../../../components/Image/Image.js";
+function CantineLegend() {
+  const {
+    t
+  } = useTranslation();
+  return /* @__PURE__ */ jsxs("div", { className: "cantine-modal__legend", children: [
+    /* @__PURE__ */ jsxs("div", { className: "cantine-modal__legend-list", children: [
+      /* @__PURE__ */ jsx("h3", { className: "cantine-modal__legend-title", children: t("homepage.widget.cantine.legend.title") }),
+      DISH_TAGS.map((tag) => /* @__PURE__ */ jsxs("p", { className: "cantine-modal__legend-item", children: [
+        /* @__PURE__ */ jsx(Image, { src: tag.icon, alt: t(tag.i18nKey, tag.defaultLabel), className: "cantine-modal__legend-icon" }),
+        t(tag.i18nKey, tag.defaultLabel)
+      ] }, tag.flag))
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "cantine-modal__notice", children: t("homepage.widget.cantine.legend.notice") })
+  ] });
+}
+export {
+  CantineLegend as default
+};

package/dist/modules/homepage/components/Cantine/components/CantineMenuSection.d.ts

@@ -0,0 +1,6 @@
+import { CantineCategory, CantineDish } from '../types';
+export interface CantineMenuSectionProps {
+    category: CantineCategory;
+    items: CantineDish[];
+}
+export default function CantineMenuSection({ category, items, }: CantineMenuSectionProps): import("react/jsx-runtime").JSX.Element;

package/dist/modules/homepage/components/Cantine/components/CantineMenuSection.js

@@ -0,0 +1,28 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { CATEGORY_CONFIG, DISH_TAGS } from "./cantineLabels.js";
+import Image from "../../../../../components/Image/Image.js";
+function CantineMenuSection({
+  category,
+  items
+}) {
+  const {
+    t
+  } = useTranslation(), config = CATEGORY_CONFIG[category];
+  return /* @__PURE__ */ jsxs("li", { className: `cantine__section cantine__section-${category}`, children: [
+    /* @__PURE__ */ jsxs("div", { className: "cantine__section-header", children: [
+      /* @__PURE__ */ jsx("span", { className: "cantine__section-icon", children: /* @__PURE__ */ jsx(Image, { src: config.icon, alt: t(config.i18nKey, config.defaultLabel) }) }),
+      /* @__PURE__ */ jsx("h4", { className: "cantine__section-title", children: t(config.i18nKey, config.defaultLabel) })
+    ] }),
+    /* @__PURE__ */ jsx("ul", { className: "cantine__items", children: items.map((item) => /* @__PURE__ */ jsxs("li", { className: "cantine__item", children: [
+      /* @__PURE__ */ jsxs("div", { className: "cantine__item-text", children: [
+        /* @__PURE__ */ jsx("p", { className: "cantine__item-label", children: item.label }),
+        item.allergens.length > 0 && /* @__PURE__ */ jsx("p", { className: "cantine__item-allergens", children: item.allergens.join(", ") })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "cantine__item-tags", children: DISH_TAGS.filter((tag) => item[tag.flag]).map((tag) => /* @__PURE__ */ jsx(Image, { src: tag.icon, alt: t(tag.i18nKey, tag.defaultLabel), className: "cantine__item-tag" }, tag.flag)) })
+    ] }, item.id)) })
+  ] });
+}
+export {
+  CantineMenuSection as default
+};