@edifice.io/react 2.3.1-develop-b2school.20250916133741 → 2.3.1-develop-b2school-actualites.20250916153920

package/dist/index.js

@@ -98,12 +98,14 @@ import { default as default97 } from "./modules/multimedia/VideoRecorder/VideoRe
 import { default as default98 } from "./modules/multimedia/Workspace/Workspace.js";
 import { default as default99 } from "./modules/multimedia/WorkspaceFolders/WorkspaceFolders.js";
 import { AccessiblePalette, DefaultPalette } from "./components/ColorPicker/ColorPalette.js";
+import { Divider } from "./components/Divider/Divider.js";
 import { DropzoneContext, useDropzoneContext } from "./components/Dropzone/DropzoneContext.js";
 import { Column, Grid } from "./components/Grid/Grid.js";
 import { Layout } from "./components/Layout/Layout.js";
 import { List } from "./components/List/List.js";
 import { Menu } from "./components/Menu/components/Menu.js";
 import { Popover, PopoverBody, PopoverFooter, PopoverHeader } from "./components/Popover/Popover.js";
+import { SeparatedInfo } from "./components/SeparatedInfo/SeparatedInfo.js";
 import { Tabs } from "./components/Tabs/components/Tabs.js";
 import { Toolbar } from "./components/Toolbar/Toolbar.js";
 import { useTreeSortable } from "./components/Tree/hooks/useTreeSortable.js";
@@ -148,6 +150,7 @@ export {
   default18 as Combobox,
   default83 as ConfirmModal,
   DefaultPalette,
+  Divider,
   DndTree,
   default19 as Dropdown,
   default20 as Dropzone,
@@ -192,6 +195,7 @@ export {
   default35 as SearchBar,
   default13 as SearchButton,
   default36 as Select,
+  SeparatedInfo,
   default89 as ShareBlog,
   default88 as ShareModal,
   default44 as SortableTree,

package/dist/modules/editor/components/Editor/EditorPreview.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Editor component properties
+ */
+export interface EditorPreviewProps {
+    /** Rich content to render. */
+    content: string;
+    /** Display with or without a border */
+    variant?: 'outline' | 'ghost';
+    onDetailClick?: () => void;
+    onMediaClick?: () => void;
+    maxMediaDisplayed?: number;
+}
+declare const EditorPreview: ({ content, variant, onDetailClick, onMediaClick, maxMediaDisplayed, }: EditorPreviewProps) => import("react/jsx-runtime").JSX.Element;
+export default EditorPreview;

package/dist/modules/editor/components/Editor/EditorPreview.js

@@ -0,0 +1,56 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import clsx from "clsx";
+import { getThumbnail } from "@edifice.io/utilities";
+import { useTranslation } from "react-i18next";
+import Image from "../../../../components/Image/Image.js";
+const EditorPreview = ({
+  content,
+  variant = "outline",
+  onDetailClick,
+  onMediaClick,
+  maxMediaDisplayed = 3
+}) => {
+  const {
+    t
+  } = useTranslation(), [summaryContent, setSummaryContent] = useState(""), [medias, setMedias] = useState([]), borderClass = clsx(variant === "outline" && "border rounded-3 py-12 px-16"), hasMediaCallback = onDetailClick || onMediaClick, handleMediaClick = (e) => {
+    onMediaClick && (e.stopPropagation(), onMediaClick());
+  };
+  return useEffect(() => {
+    const contentHTML = content;
+    if (contentHTML) {
+      const doc = new DOMParser().parseFromString(contentHTML, "text/html"), mediaElements = Array.from(doc.querySelectorAll("img, video, iframe, audio, embed"));
+      setMedias(mediaElements.filter((el) => el.tagName.toLowerCase() === "img").map((el) => {
+        const image = el;
+        return image.src ? {
+          url: getThumbnail(image.src, 0, 300),
+          alt: image.alt
+        } : {
+          url: "",
+          alt: ""
+        };
+      })), mediaElements.forEach((el) => {
+        var _a;
+        return (_a = el.parentNode) == null ? void 0 : _a.removeChild(el);
+      }), setSummaryContent(doc.body.textContent || "");
+    }
+  }, [content]), /* @__PURE__ */ jsxs("div", { className: borderClass, "data-testid": "editor-preview", onClick: onDetailClick, tabIndex: onDetailClick ? -1 : void 0, role: onDetailClick ? "button" : void 0, children: [
+    /* @__PURE__ */ jsx("div", { className: "flex-fill text-truncate text-truncate-2 post-preview-content overflow-hidden", children: summaryContent }),
+    /* @__PURE__ */ jsx("div", { onClick: handleMediaClick, tabIndex: hasMediaCallback ? -1 : void 0, role: hasMediaCallback ? "button" : void 0, className: "d-flex align-items-center justify-content-center gap-24 px-32 pt-16", children: medias.slice(0, maxMediaDisplayed).map((media, index) => /* @__PURE__ */ jsxs("div", { className: clsx("position-relative col-12 col-md-4 ", {
+      "d-none d-md-block": index >= 1
+    }), style: {
+      maxWidth: "150px"
+    }, children: [
+      /* @__PURE__ */ jsx(Image, { alt: media.alt, objectFit: "cover", ratio: "16", className: "rounded", src: media.url, sizes: "" }),
+      (index === 0 || index === 2) && medias.length - (index + 1) > 0 && /* @__PURE__ */ jsx("div", { className: clsx("position-absolute top-0 bottom-0 start-0 end-0 d-flex justify-content-center align-items-center rounded text-light bg-dark bg-opacity-50", {
+        "d-flex d-md-none": index === 0,
+        "d-none d-md-flex": index === 2
+      }), children: t("editor.preview.moreMedia", {
+        mediaCount: medias.length - (index + 1)
+      }) })
+    ] }, media.url)) })
+  ] });
+};
+export {
+  EditorPreview as default
+};

package/dist/modules/editor/components/Editor/EditorPreviewSkeleton.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Editor component properties
+ */
+export interface EditorPreviewSkeletonProps {
+    variant?: 'outline' | 'ghost';
+}
+declare const EditorPreview: ({ variant }: EditorPreviewSkeletonProps) => import("react/jsx-runtime").JSX.Element;
+export default EditorPreview;

package/dist/modules/editor/components/Editor/EditorPreviewSkeleton.js

@@ -0,0 +1,24 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+import TextSkeleton from "../../../../components/Skeleton/TextSkeleton.js";
+import Image from "../../../../components/Image/Image.js";
+const EditorPreview = ({
+  variant = "outline"
+}) => {
+  const borderClass = clsx(variant === "outline" && "border rounded-3"), contentClass = clsx("mt-16", variant === "outline" && "my-12 mx-16");
+  return /* @__PURE__ */ jsx("div", { className: borderClass, "data-testid": "editor-preview", children: /* @__PURE__ */ jsxs("div", { className: contentClass, children: [
+    /* @__PURE__ */ jsx(TextSkeleton, { className: "col-12" }),
+    /* @__PURE__ */ jsx(TextSkeleton, { className: "col-12" }),
+    /* @__PURE__ */ jsxs("div", { className: "d-flex justify-content-center gap-24 px-32 pt-16", children: [
+      /* @__PURE__ */ jsx("div", { style: {
+        maxWidth: "150px"
+      }, className: "col-12 col-md-4", children: /* @__PURE__ */ jsx(Image, { alt: "", objectFit: "cover", ratio: "16", className: "rounded placeholder", src: "", sizes: "" }) }),
+      /* @__PURE__ */ jsx("div", { style: {
+        maxWidth: "150px"
+      }, className: "col-12 col-md-4", children: /* @__PURE__ */ jsx(Image, { alt: "", objectFit: "cover", ratio: "16", className: "rounded placeholder", src: "", sizes: "" }) })
+    ] })
+  ] }) });
+};
+export {
+  EditorPreview as default
+};

package/dist/modules/editor/components/Editor/index.d.ts

@@ -1,3 +1,5 @@
 export * from './Editor';
 export { default as Editor } from './Editor';
+export { default as EditorPreview } from './EditorPreview';
+export { default as EditorPreviewSkeleton } from './EditorPreviewSkeleton';
 export { default as EditorSkeleton } from './EditorSkeleton';

package/dist/modules/icons/components/IconClockAlert.d.ts

@@ -0,0 +1,7 @@
+import { SVGProps } from 'react';
+interface SVGRProps {
+    title?: string;
+    titleId?: string;
+}
+declare const SvgIconClockAlert: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => import("react/jsx-runtime").JSX.Element;
+export default SvgIconClockAlert;

package/dist/modules/icons/components/IconClockAlert.js

@@ -0,0 +1,17 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+const SvgIconClockAlert = ({
+  title,
+  titleId,
+  ...props
+}) => /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", fill: "none", viewBox: "0 0 24 24", "aria-hidden": "true", "aria-labelledby": titleId, ...props, children: [
+  title ? /* @__PURE__ */ jsx("title", { id: titleId, children: title }) : null,
+  /* @__PURE__ */ jsxs("g", { fill: "currentColor", clipPath: "url(#icon-clock-alert_svg__a)", children: [
+    /* @__PURE__ */ jsx("path", { d: "M0 10.075C0 4.51 4.51 0 10.075 0c4.573 0 8.431 3.046 9.663 7.217a1 1 0 0 1-1.918.566A8.075 8.075 0 1 0 7.783 17.82a1 1 0 0 1-.566 1.918C3.046 18.506 0 14.648 0 10.075" }),
+    /* @__PURE__ */ jsx("path", { d: "M10.075 4.108a1 1 0 0 1 1 1v5.43a1 1 0 0 1-.357.767L7.83 13.728a1 1 0 1 1-1.286-1.532l2.53-2.123V5.108a1 1 0 0 1 1-1M17 13.3a1 1 0 0 1 1 1v2.2a1 1 0 1 1-2 0v-2.2a1 1 0 0 1 1-1M17 18.4a1 1 0 1 0 0 2h.006a1 1 0 1 0 0-2z" }),
+    /* @__PURE__ */ jsx("path", { fillRule: "evenodd", d: "M17 10a7 7 0 1 0 0 14 7 7 0 0 0 0-14m-5 7a5 5 0 1 1 10 0 5 5 0 0 1-10 0", clipRule: "evenodd" })
+  ] }),
+  /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: "icon-clock-alert_svg__a", children: /* @__PURE__ */ jsx("path", { fill: "#fff", d: "M0 0h24v24H0z" }) }) })
+] });
+export {
+  SvgIconClockAlert as default
+};

package/dist/modules/icons/components/index.d.ts

@@ -24,6 +24,7 @@ export { default as IconCantoo } from './IconCantoo';
 export { default as IconCenter } from './IconCenter';
 export { default as IconCheck } from './IconCheck';
 export { default as IconChecklist } from './IconChecklist';
+export { default as IconClockAlert } from './IconClockAlert';
 export { default as IconClock } from './IconClock';
 export { default as IconCloseFullScreen } from './IconCloseFullScreen';
 export { default as IconClose } from './IconClose';

package/dist/modules/multimedia/VideoRecorder/VideoRecorder.js

@@ -1,18 +1,23 @@
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { forwardRef, useState, useRef, useImperativeHandle, useEffect, useCallback } from "react";
 import { odeServices } from "@edifice.io/client";
 import { getBestSupportedMimeType, convertMsToMS } from "@edifice.io/utilities";
 import { useTranslation } from "react-i18next";
+import SvgIconPause from "../../icons/components/IconPause.js";
+import SvgIconPlayFilled from "../../icons/components/IconPlayFilled.js";
+import SvgIconRecordStop from "../../icons/components/IconRecordStop.js";
 import SvgIconRecordVideo from "../../icons/components/IconRecordVideo.js";
 import SvgIconRecord from "../../icons/components/IconRecord.js";
-import { useCameras } from "./useCameras.js";
-import { VideoRecorderToolbar } from "./VideoRecorderToolbar.js";
+import SvgIconRefresh from "../../icons/components/IconRefresh.js";
+import SvgIconSave from "../../icons/components/IconSave.js";
 import useUpload from "../../../hooks/useUpload/useUpload.js";
+import useBrowserInfo from "../../../hooks/useBrowserInfo/useBrowserInfo.js";
 import FormControl from "../../../components/Form/FormControl.js";
 import Label from "../../../components/Label/Label.js";
 import Select from "../../../components/Select/Select.js";
 import LoadingScreen from "../../../components/LoadingScreen/LoadingScreen.js";
-const VideoRecorder = /* @__PURE__ */ forwardRef(({
+import { Toolbar } from "../../../components/Toolbar/Toolbar.js";
+const VIDEO_HEIGHT = 9, VIDEO_WIDTH = 16, VideoRecorder = /* @__PURE__ */ forwardRef(({
   appCode,
   caption,
   onSuccess,
@@ -20,14 +25,17 @@ const VideoRecorder = /* @__PURE__ */ forwardRef(({
   onRecordUpdated,
   hideSaveAction = !1
 }, ref) => {
-  const {
-    inputDevices,
-    setPreferedDevice,
-    restartStream,
-    stream
-  } = useCameras(), [maxDuration, setMaxDuration] = useState(18e4), [recording, setRecording] = useState(!1), [recorded, setRecorded] = useState(!1), [playing, setPlaying] = useState(!1), [saving, setSaving] = useState(!1), [saved, setSaved] = useState(!1), [mimeType, setMimeType] = useState(""), [recordedChunks, setRecordedChunks] = useState([]), [recordedVideo, setRecordedVideo] = useState(), [recordedTime, setRecordedTime] = useState(0), [playedTime, setPlayedTime] = useState(0), videoRef = useRef(null), recorderRef = useRef(null), {
+  const [maxDuration, setMaxDuration] = useState(18e4), [inputDevices, setInputDevices] = useState([]), [recording, setRecording] = useState(!1), [recorded, setRecorded] = useState(!1), [playing, setPlaying] = useState(!1), [saving, setSaving] = useState(!1), [saved, setSaved] = useState(!1), [mediaStreamConstraints, setMediaStreamConstraints] = useState({
+    audio: !0,
+    video: {
+      facingMode: "environment",
+      aspectRatio: VIDEO_WIDTH / VIDEO_HEIGHT
+    }
+  }), [stream, setStream] = useState(), [mimeType, setMimeType] = useState(""), [recordedChunks, setRecordedChunks] = useState([]), [recordedVideo, setRecordedVideo] = useState(), [recordedTime, setRecordedTime] = useState(0), [playedTime, setPlayedTime] = useState(0), videoRef = useRef(null), recorderRef = useRef(null), {
     uploadBlob
-  } = useUpload(void 0, appCode);
+  } = useUpload(void 0, appCode), {
+    device
+  } = useBrowserInfo(navigator.userAgent);
   useImperativeHandle(ref, () => ({
     save: handleSave
   }));
@@ -35,23 +43,10 @@ const VideoRecorder = /* @__PURE__ */ forwardRef(({
     t
   } = useTranslation();
   useEffect(() => {
-    initMaxDuration();
-  }, []);
-  async function initMaxDuration() {
-    try {
-      const videoConfResponse = await odeServices.video().getVideoConf();
-      setMaxDuration(videoConfResponse.maxDuration * 60 * 1e3);
-    } catch {
-      setMaxDuration(3 * 60 * 1e3);
-    }
-  }
-  useEffect(() => {
-    try {
-      videoRef.current && (videoRef.current.src && (window.URL.revokeObjectURL(videoRef.current.src), videoRef.current.src = ""), stream && (videoRef.current.srcObject = stream, videoRef.current.autoplay = !0, videoRef.current.volume = 1, videoRef.current.muted = !0));
-    } catch (err) {
-      console.error(err);
-    }
-  }, [stream]), useEffect(() => {
+    initMaxDuration(), initInputDevices();
+  }, []), useEffect(() => (stream || enableStream(mediaStreamConstraints), () => {
+    stream && stream.getTracks().forEach((track) => track.stop());
+  }), [stream]), useEffect(() => {
     if (recordedChunks.length && !recording && videoRef.current) {
       const finalVideo = new Blob(recordedChunks, {
         type: mimeType
@@ -81,7 +76,40 @@ const VideoRecorder = /* @__PURE__ */ forwardRef(({
       };
     }
   }, [playing]);
-  const handleRecord = useCallback(() => {
+  const initMaxDuration = async () => {
+    const videoConfResponse = await odeServices.video().getVideoConf();
+    setMaxDuration((videoConfResponse.maxDuration ?? 3) * 60 * 1e3);
+  }, initInputDevices = async () => {
+    const videoDevices = (await navigator.mediaDevices.enumerateDevices()).filter((device2) => device2.kind === "videoinput");
+    switch (device.type) {
+      case "mobile":
+      case "tablet": {
+        const backCamera = {
+          deviceId: "environment",
+          label: t("video.back.camera"),
+          groupId: "",
+          kind: "videoinput"
+        }, frontCamera = {
+          deviceId: "user",
+          label: t("video.front.camera"),
+          groupId: "",
+          kind: "videoinput"
+        };
+        (videoDevices == null ? void 0 : videoDevices.length) > 1 ? setInputDevices([backCamera, frontCamera]) : setInputDevices([backCamera]);
+        break;
+      }
+      default:
+        setInputDevices(videoDevices);
+        break;
+    }
+  }, enableStream = async (mediaStreamConstraints2) => {
+    try {
+      const mediaStream = await navigator.mediaDevices.getUserMedia(mediaStreamConstraints2);
+      setStream(mediaStream), videoRef.current && (videoRef.current.src && (window.URL.revokeObjectURL(videoRef.current.src), videoRef.current.src = ""), videoRef.current.srcObject = mediaStream, videoRef.current.autoplay = !0, videoRef.current.volume = 1, videoRef.current.muted = !0);
+    } catch (err) {
+      console.error(err);
+    }
+  }, handleRecord = useCallback(() => {
     setRecording(!0), videoRef && videoRef.current && (videoRef.current.muted = !0);
     const mimeType2 = getBestSupportedMimeType();
     setMimeType(mimeType2), stream && (recorderRef.current = new MediaRecorder(stream, {
@@ -98,7 +126,7 @@ const VideoRecorder = /* @__PURE__ */ forwardRef(({
     var _a, _b;
     videoRef && videoRef.current && (videoRef.current.muted = !1), playing ? ((_b = videoRef == null ? void 0 : videoRef.current) == null || _b.pause(), setPlaying(!1)) : ((_a = videoRef == null ? void 0 : videoRef.current) == null || _a.play(), setPlaying(!0));
   }, [playing]), handleReset = () => {
-    setRecorded(!1), setRecording(!1), setPlaying(!1), setSaved(!1), setRecordedTime(0), setRecordedChunks([]), setRecordedVideo(void 0), restartStream(), onRecordUpdated && onRecordUpdated();
+    setRecorded(!1), setRecording(!1), setPlaying(!1), setSaved(!1), setRecordedTime(0), setRecordedChunks([]), setRecordedVideo(void 0), enableStream(mediaStreamConstraints), onRecordUpdated && onRecordUpdated();
   }, handleSave = async () => {
     var _a;
     if ((_a = videoRef == null ? void 0 : videoRef.current) == null || _a.pause(), setSaving(!0), !recordedVideo) {
@@ -113,14 +141,95 @@ const VideoRecorder = /* @__PURE__ */ forwardRef(({
     onError("Error while uploading video"), setSaving(!1), setSaved(!0);
   }, handleEnded = () => {
     setPlaying(!1), setPlayedTime(0), videoRef.current && (videoRef.current.currentTime = 0);
-  }, handleInputDeviceChange = useCallback((option) => {
+  }, handleInputDeviceChange = (option) => {
     var _a;
     const selectedDevice = inputDevices.find((inputDevice) => inputDevice.label === option);
-    ((_a = recorderRef.current) == null ? void 0 : _a.state) === "recording" && (recorderRef.current.requestData(), recorderRef.current.stop()), setPreferedDevice(selectedDevice);
-  }, [inputDevices, stream]);
-  return useEffect(() => {
+    let mediaStreamConstraints2 = {};
+    selectedDevice != null && selectedDevice.deviceId ? ((selectedDevice == null ? void 0 : selectedDevice.deviceId) === "environment" || (selectedDevice == null ? void 0 : selectedDevice.deviceId) === "user" ? mediaStreamConstraints2 = {
+      audio: !0,
+      video: {
+        aspectRatio: VIDEO_WIDTH / VIDEO_HEIGHT,
+        facingMode: selectedDevice == null ? void 0 : selectedDevice.deviceId
+      }
+    } : mediaStreamConstraints2 = {
+      audio: !0,
+      video: {
+        aspectRatio: VIDEO_WIDTH / VIDEO_HEIGHT,
+        deviceId: selectedDevice.deviceId
+      }
+    }, setMediaStreamConstraints(mediaStreamConstraints2), stream && (((_a = recorderRef.current) == null ? void 0 : _a.state) === "recording" && (recorderRef.current.requestData(), recorderRef.current.stop()), stream.getTracks().forEach((track) => track.stop()), setStream(void 0)), enableStream(mediaStreamConstraints2)) : console.error("Selected input device id is null");
+  };
+  useEffect(() => {
     recordedTime >= maxDuration && handleStop();
-  }, [recordedTime, handleStop]), /* @__PURE__ */ jsxs("div", { className: "video-recorder d-flex flex-fill flex-column align-items-center pb-8", children: [
+  }, [recordedTime, handleStop]);
+  const toolbarItems = [{
+    type: "icon",
+    name: "record",
+    props: {
+      icon: /* @__PURE__ */ jsx(SvgIconRecord, { color: recording || recorded ? "" : "red" }),
+      color: "danger",
+      disabled: recording || recorded || saving,
+      onClick: handleRecord,
+      "aria-label": t("bbm.video.record.start")
+    },
+    tooltip: t("bbm.video.record.start")
+  }, {
+    type: "icon",
+    name: "stop",
+    props: {
+      icon: /* @__PURE__ */ jsx(SvgIconRecordStop, {}),
+      disabled: !recording || recorded || saving,
+      onClick: handleStop,
+      "aria-label": t("bbm.video.record.stop")
+    },
+    tooltip: t("bbm.video.record.stop")
+  }, {
+    type: "icon",
+    name: "play",
+    visibility: playing ? "hide" : "show",
+    props: {
+      icon: /* @__PURE__ */ jsx(SvgIconPlayFilled, {}),
+      disabled: !recorded || saving,
+      onClick: handlePlayPause,
+      "aria-label": t("bbm.video.play.start")
+    },
+    tooltip: t("bbm.video.play.start")
+  }, {
+    type: "icon",
+    name: "pause",
+    visibility: playing ? "show" : "hide",
+    props: {
+      icon: /* @__PURE__ */ jsx(SvgIconPause, {}),
+      disabled: !recorded || saving,
+      onClick: handlePlayPause,
+      "aria-label": t("bbm.video.play.pause")
+    },
+    tooltip: t("bbm.video.play.pause")
+  }, {
+    type: "divider"
+  }, {
+    type: "icon",
+    name: "reset",
+    props: {
+      icon: /* @__PURE__ */ jsx(SvgIconRefresh, {}),
+      disabled: !recorded || saving,
+      onClick: handleReset,
+      "aria-label": t("bbm.video.record.reset")
+    },
+    tooltip: t("bbm.video.record.reset")
+  }, {
+    type: "icon",
+    name: "save",
+    visibility: hideSaveAction ? "hide" : "show",
+    props: {
+      icon: /* @__PURE__ */ jsx(SvgIconSave, {}),
+      disabled: !recorded || saving || saved,
+      onClick: handleSave,
+      "aria-label": t("bbm.video.record.save")
+    },
+    tooltip: t("bbm.video.record.save")
+  }];
+  return /* @__PURE__ */ jsxs("div", { className: "video-recorder d-flex flex-fill flex-column align-items-center pb-8", children: [
     /* @__PURE__ */ jsx("div", { className: "video-recorder-caption d-none d-md-block", children: caption }),
     inputDevices.length > 1 && /* @__PURE__ */ jsx("div", { className: "video-recorder-devices mb-12", children: /* @__PURE__ */ jsxs(FormControl, { id: "selectInputDevice", children: [
       /* @__PURE__ */ jsx(Label, { className: "d-none d-md-block", children: t("bbm.video.record.select.devices.label") }),
@@ -146,7 +255,7 @@ const VideoRecorder = /* @__PURE__ */ forwardRef(({
           ] })
         ] })
       ] }),
-      stream && /* @__PURE__ */ jsx(VideoRecorderToolbar, { playing, recording, recorded, saving, saved, hideSaveAction, handleRecord, handleStop, handlePlayPause, handleReset, handleSave })
+      stream && /* @__PURE__ */ jsx(Toolbar, { items: toolbarItems, className: "position-absolute bottom-0 start-50 bg-white" })
     ] }),
     saving && /* @__PURE__ */ jsx(LoadingScreen, { position: !1, caption: t("bbm.video.save.loader.caption") })
   ] });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@edifice.io/react",
-  "version": "2.3.1-develop-b2school.20250916133741",
+  "version": "2.3.1-develop-b2school-actualites.20250916153920",
   "description": "Edifice React Library",
   "keywords": [
     "react",
@@ -130,9 +130,9 @@
     "react-slugify": "^3.0.3",
     "swiper": "^10.1.0",
     "ua-parser-js": "^1.0.36",
-    "@edifice.io/bootstrap": "2.3.1-develop-b2school.20250916133741",
-    "@edifice.io/tiptap-extensions": "2.3.1-develop-b2school.20250916133741",
-    "@edifice.io/utilities": "2.3.1-develop-b2school.20250916133741"
+    "@edifice.io/bootstrap": "2.3.1-develop-b2school-actualites.20250916153920",
+    "@edifice.io/tiptap-extensions": "2.3.1-develop-b2school-actualites.20250916153920",
+    "@edifice.io/utilities": "2.3.1-develop-b2school-actualites.20250916153920"
   },
   "devDependencies": {
     "@babel/plugin-transform-react-pure-annotations": "^7.23.3",
@@ -163,8 +163,8 @@
     "vite": "^5.4.11",
     "vite-plugin-dts": "^4.1.0",
     "vite-tsconfig-paths": "^5.0.1",
-    "@edifice.io/client": "2.3.1-develop-b2school.20250916133741",
-    "@edifice.io/config": "2.3.1-develop-b2school.20250916133741"
+    "@edifice.io/client": "2.3.1-develop-b2school-actualites.20250916153920",
+    "@edifice.io/config": "2.3.1-develop-b2school-actualites.20250916153920"
   },
   "peerDependencies": {
     "@react-spring/web": "^9.7.5",

package/dist/modules/multimedia/VideoRecorder/VideoRecorderToolbar.d.ts

@@ -1,18 +0,0 @@
-import { WorkspaceElement } from '@edifice.io/client';
-export interface VideoRecorderToolbarProps {
-    playing: boolean;
-    recording: boolean;
-    recorded: boolean;
-    saving: boolean;
-    saved: boolean;
-    hideSaveAction: boolean;
-    handleRecord: () => void;
-    handleStop: () => void;
-    handlePlayPause: () => void;
-    handleReset: () => void;
-    handleSave: () => void;
-}
-export interface VideoRecorderRef {
-    save: () => Promise<WorkspaceElement | undefined>;
-}
-export declare const VideoRecorderToolbar: ({ playing, recording, recorded, saving, saved, hideSaveAction, handleRecord, handleStop, handlePlayPause, handleReset, handleSave, }: VideoRecorderToolbarProps) => import("react/jsx-runtime").JSX.Element;

package/dist/modules/multimedia/VideoRecorder/VideoRecorderToolbar.js

@@ -1,96 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { useTranslation } from "react-i18next";
-import SvgIconPause from "../../icons/components/IconPause.js";
-import SvgIconPlayFilled from "../../icons/components/IconPlayFilled.js";
-import SvgIconRecordStop from "../../icons/components/IconRecordStop.js";
-import SvgIconRecord from "../../icons/components/IconRecord.js";
-import SvgIconRefresh from "../../icons/components/IconRefresh.js";
-import SvgIconSave from "../../icons/components/IconSave.js";
-import { Toolbar } from "../../../components/Toolbar/Toolbar.js";
-const VideoRecorderToolbar = ({
-  playing,
-  recording,
-  recorded,
-  saving,
-  saved,
-  hideSaveAction,
-  handleRecord,
-  handleStop,
-  handlePlayPause,
-  handleReset,
-  handleSave
-}) => {
-  const {
-    t
-  } = useTranslation(), toolbarItems = [{
-    type: "icon",
-    name: "record",
-    props: {
-      icon: /* @__PURE__ */ jsx(SvgIconRecord, { color: recording || recorded ? "" : "red" }),
-      color: "danger",
-      disabled: recording || recorded || saving,
-      onClick: handleRecord,
-      "aria-label": t("bbm.video.record.start")
-    },
-    tooltip: t("bbm.video.record.start")
-  }, {
-    type: "icon",
-    name: "stop",
-    props: {
-      icon: /* @__PURE__ */ jsx(SvgIconRecordStop, {}),
-      disabled: !recording || recorded || saving,
-      onClick: handleStop,
-      "aria-label": t("bbm.video.record.stop")
-    },
-    tooltip: t("bbm.video.record.stop")
-  }, {
-    type: "icon",
-    name: "play",
-    visibility: playing ? "hide" : "show",
-    props: {
-      icon: /* @__PURE__ */ jsx(SvgIconPlayFilled, {}),
-      disabled: !recorded || saving,
-      onClick: handlePlayPause,
-      "aria-label": t("bbm.video.play.start")
-    },
-    tooltip: t("bbm.video.play.start")
-  }, {
-    type: "icon",
-    name: "pause",
-    visibility: playing ? "show" : "hide",
-    props: {
-      icon: /* @__PURE__ */ jsx(SvgIconPause, {}),
-      disabled: !recorded || saving,
-      onClick: handlePlayPause,
-      "aria-label": t("bbm.video.play.pause")
-    },
-    tooltip: t("bbm.video.play.pause")
-  }, {
-    type: "divider"
-  }, {
-    type: "icon",
-    name: "reset",
-    props: {
-      icon: /* @__PURE__ */ jsx(SvgIconRefresh, {}),
-      disabled: !recorded || saving,
-      onClick: handleReset,
-      "aria-label": t("bbm.video.record.reset")
-    },
-    tooltip: t("bbm.video.record.reset")
-  }, {
-    type: "icon",
-    name: "save",
-    visibility: hideSaveAction ? "hide" : "show",
-    props: {
-      icon: /* @__PURE__ */ jsx(SvgIconSave, {}),
-      disabled: !recorded || saving || saved,
-      onClick: handleSave,
-      "aria-label": t("bbm.video.record.save")
-    },
-    tooltip: t("bbm.video.record.save")
-  }];
-  return /* @__PURE__ */ jsx(Toolbar, { items: toolbarItems, className: "position-absolute bottom-0 start-50 bg-white" });
-};
-export {
-  VideoRecorderToolbar
-};

package/dist/modules/multimedia/VideoRecorder/useCameras.d.ts

@@ -1,10 +0,0 @@
-export declare function useCameras(): {
-    /** Readonly list (array) of available video input devices. */
-    inputDevices: MediaDeviceInfo[];
-    /** Select which input video device to use. */
-    setPreferedDevice: (device?: MediaDeviceInfo) => void;
-    /** The current video stream. */
-    stream: MediaStream | undefined;
-    /** Start a video stream from the default or prefered device. */
-    restartStream: () => void;
-};