@edifice.io/react 2.6.9-develop-enabling.20261013152718 → 2.6.9-develop-integration.20261014191834

package/dist/modules/multimedia/ImageEditor/hooks/useImageEditor.js

@@ -1 +1,82 @@
-import{DEFAULT_SPRITE_NAME,autoResize,saveAsBlob,saveAsDataURL,updateImage,updateImageFromBlob}from"../effects/misc.js";import useHistoryTool from"./useHistoryTool.js";import useImageEffects from"./useImageEffects.js";import{useEffect,useState}from"react";function useImageEditor({imageSrc,spriteName=DEFAULT_SPRITE_NAME}){let[application,setApplication]=useState(void 0),[loading,setLoading]=useState(!0),{rotate,startBlur,startCrop,startResize,stopBlur,stopCrop,stopResize}=useImageEffects({spriteName,application,onSave(sprite){application&&updateImage(application,{imgDatasource:sprite,spriteName})}}),toBlob=()=>application?saveAsBlob(application):Promise.resolve(void 0),toDataURL=()=>{if(application)return saveAsDataURL(application)},{restore,historize,historyCount}=useHistoryTool({application,spriteName,onRestore(imgDatasource,state){application&&updateImageFromBlob(application,{imgDatasource,spriteName,settings:state})}});return useEffect(()=>{application&&(setLoading(!0),updateImage(application,{spriteName,imgDatasource:imageSrc}).finally(()=>setLoading(!1)))},[application,imageSrc,spriteName]),useEffect(()=>{if(!application)return;let handleResize=()=>{let sprite=application.stage.getChildByLabel(spriteName,!0);sprite&&autoResize(application,sprite)};return window.addEventListener(`resize`,handleResize),()=>window.removeEventListener(`resize`,handleResize)},[application,spriteName]),{historyCount,setApplication,restore,stopCrop,stopBlur,stopResize,startResize:async()=>{setLoading(!0),await historize(startResize),setLoading(!1)},startCrop:async()=>{setLoading(!0),await historize(startCrop),setLoading(!1)},startBlur:async()=>{setLoading(!0),await historize(startBlur),setLoading(!1)},rotate:async()=>{setLoading(!0),await historize(rotate),setLoading(!1)},toBlob,toDataURL,loading}}export{useImageEditor as default};
+import { useState, useEffect } from "react";
+import useHistoryTool from "./useHistoryTool.js";
+import useImageEffects from "./useImageEffects.js";
+import { updateImage, DEFAULT_SPRITE_NAME, saveAsBlob, saveAsDataURL, autoResize, updateImageFromBlob } from "../effects/misc.js";
+function useImageEditor({
+  imageSrc,
+  spriteName = DEFAULT_SPRITE_NAME
+}) {
+  const [application, setApplication] = useState(void 0), [loading, setLoading] = useState(!0), {
+    rotate,
+    startBlur,
+    startCrop,
+    startResize,
+    stopBlur,
+    stopCrop,
+    stopResize
+  } = useImageEffects({
+    spriteName,
+    application,
+    onSave(sprite) {
+      application && updateImage(application, {
+        imgDatasource: sprite,
+        spriteName
+      });
+    }
+  }), toBlob = () => application ? saveAsBlob(application) : Promise.resolve(void 0), toDataURL = () => {
+    if (application)
+      return saveAsDataURL(application);
+  }, {
+    restore,
+    historize,
+    historyCount
+  } = useHistoryTool({
+    application,
+    spriteName,
+    onRestore(imgDatasource, state) {
+      application && updateImageFromBlob(application, {
+        imgDatasource,
+        spriteName,
+        settings: state
+      });
+    }
+  });
+  return useEffect(() => {
+    application && (setLoading(!0), updateImage(application, {
+      spriteName,
+      imgDatasource: imageSrc
+    }).finally(() => setLoading(!1)));
+  }, [application, imageSrc, spriteName]), useEffect(() => {
+    if (!application) return;
+    const handleResize = () => {
+      const sprite = application.stage.getChildByLabel(spriteName, !0);
+      sprite && autoResize(application, sprite);
+    };
+    return window.addEventListener("resize", handleResize), () => window.removeEventListener("resize", handleResize);
+  }, [application, spriteName]), {
+    historyCount,
+    setApplication,
+    restore,
+    stopCrop,
+    stopBlur,
+    stopResize,
+    startResize: async () => {
+      setLoading(!0), await historize(startResize), setLoading(!1);
+    },
+    startCrop: async () => {
+      setLoading(!0), await historize(startCrop), setLoading(!1);
+    },
+    startBlur: async () => {
+      setLoading(!0), await historize(startBlur), setLoading(!1);
+    },
+    rotate: async () => {
+      setLoading(!0), await historize(rotate), setLoading(!1);
+    },
+    toBlob,
+    toDataURL,
+    loading
+  };
+}
+export {
+  useImageEditor as default
+};

package/dist/modules/multimedia/ImageEditor/hooks/useImageEffects.js

@@ -1 +1,55 @@
-import{start,stop}from"../effects/blur.js";import{save,start as start$1,stop as stop$1}from"../effects/crop.js";import{save as save$1,start as start$2,stop as stop$2}from"../effects/resize.js";import{rotate}from"../effects/rotate.js";function useImageEffects({application,spriteName,onSave}){return{rotate:async()=>{application&&await rotate(application,spriteName)},startCrop:()=>{application&&start$1(application,{spriteName})},stopCrop:save$2=>{if(application){if(save$2){let result=save(application);if(result){onSave(result);return}}stop$1(application)}},startBlur:()=>{application&&start(application,{spriteName})},stopBlur:()=>{application&&stop(application)},startResize:()=>{application&&start$2(application,spriteName)},stopResize:save=>{if(application){if(save){let result=save$1(application);result&&onSave(result)}stop$2(application)}}}}export{useImageEffects as default};
+import { start as start$1, stop as stop$1 } from "../effects/blur.js";
+import { start, save, stop } from "../effects/crop.js";
+import { save as save$1, stop as stop$2, start as start$2 } from "../effects/resize.js";
+import { rotate } from "../effects/rotate.js";
+function useImageEffects({
+  application,
+  spriteName,
+  onSave
+}) {
+  return {
+    rotate: async () => {
+      application && await rotate(application, spriteName);
+    },
+    startCrop: () => {
+      application && start(application, {
+        spriteName
+      });
+    },
+    stopCrop: (save$12) => {
+      if (application) {
+        if (save$12) {
+          const result = save(application);
+          if (result) {
+            onSave(result);
+            return;
+          }
+        }
+        stop(application);
+      }
+    },
+    startBlur: () => {
+      application && start$1(application, {
+        spriteName
+      });
+    },
+    stopBlur: () => {
+      application && stop$1(application);
+    },
+    startResize: () => {
+      application && start$2(application, spriteName);
+    },
+    stopResize: (save2) => {
+      if (application) {
+        if (save2) {
+          const result = save$1(application);
+          result && onSave(result);
+        }
+        stop$2(application);
+      }
+    }
+  };
+}
+export {
+  useImageEffects as default
+};

package/dist/modules/multimedia/ImageEditor/utilities/aggregate.js

@@ -1 +1,13 @@
-function aggregate(delay,map,callback){let timerId,pending=[];return function(arg){pending.push(map(arg)),!timerId&&(timerId=setTimeout(()=>{let copy=[...pending];pending.splice(0,pending.length),callback(copy),timerId=void 0},delay))}}export{aggregate};
+function aggregate(delay, map, callback) {
+  let timerId;
+  const pending = [];
+  return function(arg) {
+    pending.push(map(arg)), !timerId && (timerId = setTimeout(() => {
+      const copy = [...pending];
+      pending.splice(0, pending.length), callback(copy), timerId = void 0;
+    }, delay));
+  };
+}
+export {
+  aggregate
+};

package/dist/modules/multimedia/ImagePicker/ImagePicker.js

@@ -1 +1,40 @@
-import SvgIconDelete from"../../icons/components/IconDelete.js";import SvgIconEdit from"../../icons/components/IconEdit.js";import IconButton from"../../../components/Button/IconButton.js";import AppIcon from"../../../components/AppIcon/AppIcon.js";import Avatar from"../../../components/Avatar/Avatar.js";import clsx$1 from"clsx";import{useEffect,useState}from"react";import{jsx,jsxs}from"react/jsx-runtime";var ImagePicker=({addButtonLabel=`Add image`,deleteButtonLabel=`Delete image`,src,className,mediaLibraryRef,libraryMedia,app,onUploadImage,onDeleteImage})=>{let[preview,setPreview]=useState(src||``);return useEffect(()=>{libraryMedia&&(setPreview(libraryMedia),onUploadImage(libraryMedia))},[libraryMedia]),jsxs(`div`,{id:`image-input`,className:clsx$1(`image-input`,className),children:[jsxs(`div`,{className:`image-input-actions gap-8`,children:[jsx(IconButton,{"aria-label":addButtonLabel,color:`tertiary`,icon:jsx(SvgIconEdit,{}),onClick:()=>{mediaLibraryRef.current?.show(`image`)},type:`button`,variant:`ghost`}),jsx(IconButton,{"aria-label":deleteButtonLabel,color:`danger`,disabled:!preview,icon:jsx(SvgIconDelete,{}),onClick:()=>{setPreview(``),onDeleteImage()},type:`button`,variant:`ghost`})]}),preview?jsx(Avatar,{alt:``,src:preview,size:`xl`}):jsx(AppIcon,{app,iconFit:`ratio`,size:`160`,variant:`rounded`})]})};export{ImagePicker as default};
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import clsx from "clsx";
+import SvgIconDelete from "../../icons/components/IconDelete.js";
+import SvgIconEdit from "../../icons/components/IconEdit.js";
+import IconButton from "../../../components/Button/IconButton.js";
+import Avatar from "../../../components/Avatar/Avatar.js";
+import AppIcon from "../../../components/AppIcon/AppIcon.js";
+const ImagePicker = ({
+  addButtonLabel = "Add image",
+  deleteButtonLabel = "Delete image",
+  src,
+  className,
+  mediaLibraryRef,
+  libraryMedia,
+  app,
+  onUploadImage,
+  onDeleteImage
+}) => {
+  const [preview, setPreview] = useState(src || "");
+  useEffect(() => {
+    libraryMedia && (setPreview(libraryMedia), onUploadImage(libraryMedia));
+  }, [libraryMedia]);
+  const handleClick = () => {
+    var _a;
+    (_a = mediaLibraryRef.current) == null || _a.show("image");
+  }, handleClean = () => {
+    setPreview(""), onDeleteImage();
+  }, classes = clsx("image-input", className);
+  return /* @__PURE__ */ jsxs("div", { id: "image-input", className: classes, children: [
+    /* @__PURE__ */ jsxs("div", { className: "image-input-actions gap-8", children: [
+      /* @__PURE__ */ jsx(IconButton, { "aria-label": addButtonLabel, color: "tertiary", icon: /* @__PURE__ */ jsx(SvgIconEdit, {}), onClick: handleClick, type: "button", variant: "ghost" }),
+      /* @__PURE__ */ jsx(IconButton, { "aria-label": deleteButtonLabel, color: "danger", disabled: !preview, icon: /* @__PURE__ */ jsx(SvgIconDelete, {}), onClick: handleClean, type: "button", variant: "ghost" })
+    ] }),
+    preview ? /* @__PURE__ */ jsx(Avatar, { alt: "", src: preview, size: "xl" }) : /* @__PURE__ */ jsx(AppIcon, { app, iconFit: "ratio", size: "160", variant: "rounded" })
+  ] });
+};
+export {
+  ImagePicker as default
+};

package/dist/modules/multimedia/Linker/ExternalLinker/ExternalLinker.js

@@ -1 +1,45 @@
-import Checkbox from"../../../../components/Checkbox/Checkbox.js";import useToggle from"../../../../hooks/useToggle/useToggle.js";import Input from"../../../../components/Input/Input.js";import Label from"../../../../components/Label/Label.js";import FormControl from"../../../../components/Form/FormControl.js";import{StringUtils}from"@edifice.io/utilities";import{useEffect,useState}from"react";import{Fragment as Fragment$1,jsx,jsxs}from"react/jsx-runtime";import{useTranslation}from"react-i18next";var ExternalLinker=({link,onChange,multiNodeSelected=!1})=>{let{t}=useTranslation(),[linkText,setLinkText]=useState(link?.text||``),[linkURL,setLinkURL]=useState(link?.url||``),[isBlankTarget,toggleBlankTarget]=useToggle(link?link.target===`_blank`:!0);return useEffect(()=>{multiNodeSelected&&link?.text&&setLinkText(link.text.slice(0,20)+`...`)},[multiNodeSelected,link]),useEffect(()=>{if(!linkURL.length){onChange?.();return}let newLink={url:linkURL,text:multiNodeSelected?link?.text:linkText||linkURL,target:isBlankTarget?`_blank`:void 0};!StringUtils.isLocalURL(linkURL)&&!StringUtils.startWithHttp(linkURL)&&(newLink.url=`http://`+linkURL),onChange?.(newLink)},[linkText,linkURL,isBlankTarget]),jsx(Fragment$1,{children:jsxs(`div`,{className:`d-flex flex-column flex-fill gap-24`,children:[jsxs(FormControl,{id:`linkText`,isOptional:!0,children:[jsx(Label,{children:t(`bbm.linker.ext.text`)}),jsx(Input,{type:`text`,placeholder:t(`bbm.linker.ext.text.placeholder`),size:`md`,disabled:multiNodeSelected,value:linkText,onChange:e=>setLinkText(e.target.value)})]}),jsxs(FormControl,{id:`linkUrl`,isRequired:!0,children:[jsx(Label,{children:t(`bbm.linker.ext.url`)}),jsx(Input,{type:`text`,placeholder:t(`bbm.linker.ext.url.placeholder`),size:`md`,value:linkURL,onChange:e=>setLinkURL(e.target.value)})]}),jsx(Checkbox,{label:t(`bbm.linker.open.tab`),onChange:()=>toggleBlankTarget(),checked:isBlankTarget})]})})};export{ExternalLinker as default};
+import { jsx, Fragment, jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { StringUtils } from "@edifice.io/utilities";
+import useToggle from "../../../../hooks/useToggle/useToggle.js";
+import FormControl from "../../../../components/Form/FormControl.js";
+import Label from "../../../../components/Label/Label.js";
+import Input from "../../../../components/Input/Input.js";
+import Checkbox from "../../../../components/Checkbox/Checkbox.js";
+const ExternalLinker = ({
+  link,
+  onChange,
+  multiNodeSelected = !1
+}) => {
+  const {
+    t
+  } = useTranslation(), [linkText, setLinkText] = useState((link == null ? void 0 : link.text) || ""), [linkURL, setLinkURL] = useState((link == null ? void 0 : link.url) || ""), [isBlankTarget, toggleBlankTarget] = useToggle(link ? link.target === "_blank" : !0);
+  return useEffect(() => {
+    multiNodeSelected && (link != null && link.text) && setLinkText(link.text.slice(0, 20) + "...");
+  }, [multiNodeSelected, link]), useEffect(() => {
+    if (!linkURL.length) {
+      onChange == null || onChange();
+      return;
+    }
+    const newLink = {
+      url: linkURL,
+      text: multiNodeSelected ? link == null ? void 0 : link.text : linkText || linkURL,
+      target: isBlankTarget ? "_blank" : void 0
+    };
+    !StringUtils.isLocalURL(linkURL) && !StringUtils.startWithHttp(linkURL) && (newLink.url = "http://" + linkURL), onChange == null || onChange(newLink);
+  }, [linkText, linkURL, isBlankTarget]), /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: "d-flex flex-column flex-fill gap-24", children: [
+    /* @__PURE__ */ jsxs(FormControl, { id: "linkText", isOptional: !0, children: [
+      /* @__PURE__ */ jsx(Label, { children: t("bbm.linker.ext.text") }),
+      /* @__PURE__ */ jsx(Input, { type: "text", placeholder: t("bbm.linker.ext.text.placeholder"), size: "md", disabled: multiNodeSelected, value: linkText, onChange: (e) => setLinkText(e.target.value) })
+    ] }),
+    /* @__PURE__ */ jsxs(FormControl, { id: "linkUrl", isRequired: !0, children: [
+      /* @__PURE__ */ jsx(Label, { children: t("bbm.linker.ext.url") }),
+      /* @__PURE__ */ jsx(Input, { type: "text", placeholder: t("bbm.linker.ext.url.placeholder"), size: "md", value: linkURL, onChange: (e) => setLinkURL(e.target.value) })
+    ] }),
+    /* @__PURE__ */ jsx(Checkbox, { label: t("bbm.linker.open.tab"), onChange: () => toggleBlankTarget(), checked: isBlankTarget })
+  ] }) });
+};
+export {
+  ExternalLinker
+};

package/dist/modules/multimedia/Linker/InternalLinker/InternalLinker.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 import { App, ILinkedResource } from '@edifice.io/client';
 /**
  * Definition of an internal link.
@@ -32,6 +33,11 @@ export interface InternalLinkerProps {
     applicationList?: ApplicationOption[];
     /** Whether to show the application selector */
     showApplicationSelector?: boolean;
+    /**
+     * Rendered on the search row, where the application selector sits, for
+     * consumers that hide that selector but still need a filter of their own.
+     */
+    searchFilter?: ReactNode;
     /** Disable application selecetor */
     disableApplicationSelector?: boolean;
     /** Optional callback to filter resources after loading. Applied in addition to search filters. */
@@ -49,5 +55,5 @@ export interface InternalLinkerProps {
     /** Label for the "load more" button. Defaults to the `bbm.linker.see.more` i18n key. */
     loadMoreLabel?: string;
 }
-export declare const InternalLinker: ({ appCode, defaultAppCode, defaultResourceId, onChange, onSelect, multiple, resourceList, applicationList, showApplicationSelector, disableApplicationSelector, resourceFilter, onSearch, hasMoreResources, onLoadMore, loadMoreLabel, }: InternalLinkerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const InternalLinker: ({ appCode, defaultAppCode, defaultResourceId, onChange, onSelect, multiple, resourceList, applicationList, showApplicationSelector, searchFilter, disableApplicationSelector, resourceFilter, onSearch, hasMoreResources, onLoadMore, loadMoreLabel, }: InternalLinkerProps) => import("react/jsx-runtime").JSX.Element;
 export default InternalLinker;

package/dist/modules/multimedia/Linker/InternalLinker/InternalLinker.js

@@ -1 +1,153 @@
-import SvgIconApplications from"../../../icons/components/IconApplications.js";import Button from"../../../../components/Button/Button.js";import{useEdificeTheme}from"../../../../providers/EdificeThemeProvider/EdificeThemeProvider.hook.js";import{emptyScreenMapping}from"../../../../utilities/emptyscreen-mapping/emptyscreen-mapping.js";import{useResourceSearch}from"../../../../hooks/useResourceSearch/useResourceSearch.js";import LinkerCard from"../../LinkerCard/LinkerCard.js";import AppIcon from"../../../../components/AppIcon/AppIcon.js";import SearchBar from"../../../../components/SearchBar/SearchBar.js";import Dropdown from"../../../../components/Dropdown/Dropdown.js";import EmptyScreen from"../../../../components/EmptyScreen/EmptyScreen.js";import{useCallback,useEffect,useState}from"react";import{jsx,jsxs}from"react/jsx-runtime";import{useTranslation}from"react-i18next";import{odeServices}from"@edifice.io/client";import{useDebounce}from"@uidotdev/usehooks";var InternalLinker=({appCode,defaultAppCode,defaultResourceId,onChange,onSelect,multiple=!0,resourceList,applicationList,showApplicationSelector=!0,disableApplicationSelector=!1,resourceFilter,onSearch,hasMoreResources,onLoadMore,loadMoreLabel})=>{let{t}=useTranslation(),{theme}=useEdificeTheme(),{resourceApplications,loadResources}=useResourceSearch(appCode),[options,setOptions]=useState(),[selectedApplication,setSelectedApplication]=useState(),[searchTerms,setSearchTerms]=useState(),debounceSearch=useDebounce(searchTerms||``,500),[resources,setResources]=useState([]),filterResources=useCallback((resource,search)=>{if(!search)return!0;let searchParam=search?.toLowerCase()||``;return resource.name?.toLowerCase().includes(searchParam)||resource.creatorName?.toLowerCase().includes(searchParam)||resource.description?.toLowerCase().includes(searchParam)},[]),sortResources=useCallback(resources=>resources.sort((a,b)=>a.modifiedAt<b.modifiedAt?1:-1),[]),loadAndDisplayResources=useCallback(search=>{async function load(){if(onSearch){try{setResources(await onSearch(search||``,selectedApplication))}catch{setResources([])}return}if(resourceList){let filteredResources=resourceList.filter(resource=>filterResources(resource,search));resourceFilter&&(filteredResources=filteredResources.filter(resourceFilter)),setResources(sortResources(filteredResources));return}else if(selectedApplication)try{let resources=(await loadResources({application:selectedApplication.application,search,types:[selectedApplication.application],filters:{},pagination:{startIdx:0,pageSize:300}})).filter(resource=>filterResources(resource,search));resourceFilter&&(resources=resources.filter(resourceFilter)),setResources(sortResources(resources));return}catch{}setResources([])}load()},[onSearch,loadResources,selectedApplication,filterResources,sortResources,resourceList,resourceFilter]),[selectedDocuments,setSelectedDocuments]=useState([]),handleOptionClick=option=>{onChange?.(option),setSelectedApplication(option)},handleSearchChange=event=>{let newText=event.target.value;setSearchTerms(newText.toString())},handleSubmit=useCallback(event=>{loadAndDisplayResources(searchTerms),event.stopPropagation(),event.preventDefault()},[loadAndDisplayResources,searchTerms]),getSelectedResourceIndex=useCallback(resourceId=>selectedDocuments.findIndex(selectedDocument=>selectedDocument.assetId===resourceId),[selectedDocuments]),selectResource=useCallback(resource=>{setSelectedDocuments(multiple?previousState=>[...previousState,resource]:[resource])},[setSelectedDocuments,multiple]),toggleResourceSelection=useCallback(resource=>{let index=getSelectedResourceIndex(resource.assetId);index<0?selectResource(resource):setSelectedDocuments(selectedDocuments.filter((_value,i)=>i!==index))},[getSelectedResourceIndex,selectResource,selectedDocuments]);return useEffect(()=>{(async()=>{if(applicationList){setOptions(applicationList.sort((app1,app2)=>app1.displayName.localeCompare(app2.displayName)));return}let appPromises=resourceApplications.map(application=>odeServices.session().getWebApp(application)),webApps=await Promise.all(appPromises);setOptions(resourceApplications.map((application,index)=>{let displayName=webApps[index]?.displayName??application;return application===`exercizer`?displayName=`bbm.linker.int.app.exercizer`:application===`formulaire`&&(displayName=`bbm.linker.int.app.forms`),{application,displayName:t(displayName??application),icon:jsx(AppIcon,{app:webApps[index],size:`24`})}}).sort((a,b)=>a.displayName.localeCompare(b.displayName)))})()},[resourceApplications,t,applicationList]),useEffect(()=>{loadAndDisplayResources(debounceSearch)},[loadAndDisplayResources,debounceSearch]),useEffect(()=>{onSelect?.(selectedDocuments)},[selectedDocuments]),useEffect(()=>{let safeDefaultAppCode=defaultAppCode??(applicationList?.length===1&&applicationList?.[0]?.application);if(safeDefaultAppCode){let option=options?.find(option=>safeDefaultAppCode===option.application);setSelectedApplication(option),loadAndDisplayResources(``)}},[options,defaultAppCode]),useEffect(()=>{if(defaultResourceId&&getSelectedResourceIndex(defaultResourceId)<0){let resource=resources?.find(resource=>defaultResourceId===resource.assetId);resource&&selectResource(resource)}},[resources]),jsxs(`div`,{className:`d-flex flex-column flex-fill overflow-hidden`,children:[jsxs(`div`,{className:`search d-flex bg-light rounded-top border border-bottom-0`,children:[showApplicationSelector&&jsx(`div`,{className:`flex-shrink-1 px-8 py-12 border-end`,children:jsxs(Dropdown,{overflow:!0,children:[jsx(Dropdown.Trigger,{icon:jsx(`div`,{className:`pe-8`,children:selectedApplication?.icon||jsx(SvgIconApplications,{})}),label:jsxs(`span`,{className:`d-md-inline d-sm-none`,children:[` `,t(selectedApplication?.displayName||`bbm.linker.int.choose`)]}),variant:`ghost`,size:`md`,disabled:disableApplicationSelector}),jsx(Dropdown.Menu,{children:options?.map(option=>jsx(Dropdown.Item,{icon:option.icon,onClick:()=>handleOptionClick(option),children:option.displayName},option.application))})]})}),jsx(`div`,{className:`flex-grow-1 align-self-center`,children:jsx(`form`,{className:`gap-16 d-flex w-100 align-items-center px-16 py-8`,onSubmit:handleSubmit,children:jsx(SearchBar,{isVariant:!0,placeholder:t(`search`),size:`lg`,className:`w-100`,disabled:!selectedApplication,onChange:handleSearchChange})})})]}),jsxs(`div`,{className:`internal-linker flex-grow-1 w-100 rounded-bottom border gap-0 overflow-auto`,children:[selectedApplication&&resources&&resources.length>0&&jsxs(`div`,{children:[resources.map(resource=>jsx(LinkerCard,{doc:resource,isSelected:selectedDocuments.findIndex(doc=>doc.assetId===resource.assetId)>=0,onClick:()=>toggleResourceSelection(resource)},resource.path)),hasMoreResources&&jsx(`div`,{className:`d-grid gap-2 col-4 mx-auto my-24`,children:jsx(Button,{type:`button`,color:`secondary`,variant:`filled`,onClick:onLoadMore,children:loadMoreLabel??t(`bbm.linker.see.more`)})})]}),selectedApplication&&resources&&resources.length<=0&&jsx(`div`,{className:`d-flex justify-content-center mt-16`,children:jsx(EmptyScreen,{imageSrc:emptyScreenMapping[theme?.bootstrapVersion??`one`][selectedApplication?.application],text:t(`bbm.linker.int.notfound`),className:`mt-16`})}),!selectedApplication&&jsx(`div`,{className:`d-flex justify-content-center mt-32`,children:jsx(EmptyScreen,{imageSrc:emptyScreenMapping[theme?.bootstrapVersion??`one`].empty,text:t(`bbm.linker.int.empty`),className:`mt-32`})})]})]})};export{InternalLinker as default};
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useCallback, useEffect } from "react";
+import { odeServices } from "@edifice.io/client";
+import { useTranslation } from "react-i18next";
+import { useDebounce } from "@uidotdev/usehooks";
+import { useEdificeTheme } from "../../../../providers/EdificeThemeProvider/EdificeThemeProvider.hook.js";
+import SvgIconApplications from "../../../icons/components/IconApplications.js";
+import LinkerCard from "../../LinkerCard/LinkerCard.js";
+import { useResourceSearch } from "../../../../hooks/useResourceSearch/useResourceSearch.js";
+import AppIcon from "../../../../components/AppIcon/AppIcon.js";
+import Dropdown from "../../../../components/Dropdown/Dropdown.js";
+import SearchBar from "../../../../components/SearchBar/SearchBar.js";
+import Button from "../../../../components/Button/Button.js";
+import EmptyScreen from "../../../../components/EmptyScreen/EmptyScreen.js";
+import { emptyScreenMapping } from "../../../../utilities/emptyscreen-mapping/emptyscreen-mapping.js";
+const InternalLinker = ({
+  appCode,
+  defaultAppCode,
+  defaultResourceId,
+  onChange,
+  onSelect,
+  multiple = !0,
+  resourceList,
+  applicationList,
+  showApplicationSelector = !0,
+  searchFilter,
+  disableApplicationSelector = !1,
+  resourceFilter,
+  onSearch,
+  hasMoreResources,
+  onLoadMore,
+  loadMoreLabel
+}) => {
+  const {
+    t
+  } = useTranslation(), {
+    theme
+  } = useEdificeTheme(), {
+    resourceApplications,
+    loadResources
+  } = useResourceSearch(appCode), [options, setOptions] = useState(), [selectedApplication, setSelectedApplication] = useState(), [searchTerms, setSearchTerms] = useState(), debounceSearch = useDebounce(searchTerms || "", 500), [resources, setResources] = useState([]), filterResources = useCallback((resource, search) => {
+    var _a, _b, _c;
+    if (!search) return !0;
+    const searchParam = (search == null ? void 0 : search.toLowerCase()) || "";
+    return ((_a = resource.name) == null ? void 0 : _a.toLowerCase().includes(searchParam)) || ((_b = resource.creatorName) == null ? void 0 : _b.toLowerCase().includes(searchParam)) || ((_c = resource.description) == null ? void 0 : _c.toLowerCase().includes(searchParam));
+  }, []), sortResources = useCallback((resources2) => resources2.sort((a, b) => a.modifiedAt < b.modifiedAt ? 1 : -1), []), loadAndDisplayResources = useCallback((search) => {
+    async function load() {
+      if (onSearch) {
+        try {
+          setResources(await onSearch(search || "", selectedApplication));
+        } catch {
+          setResources([]);
+        }
+        return;
+      }
+      if (resourceList) {
+        let filteredResources = resourceList.filter((resource) => filterResources(resource, search));
+        resourceFilter && (filteredResources = filteredResources.filter(resourceFilter)), setResources(sortResources(filteredResources));
+        return;
+      } else if (selectedApplication)
+        try {
+          let resources2 = (await loadResources({
+            application: selectedApplication.application,
+            search,
+            types: [selectedApplication.application],
+            filters: {},
+            pagination: {
+              startIdx: 0,
+              pageSize: 300
+            }
+            // ignored at the moment
+          })).filter((resource) => filterResources(resource, search));
+          resourceFilter && (resources2 = resources2.filter(resourceFilter)), setResources(sortResources(resources2));
+          return;
+        } catch {
+        }
+      setResources([]);
+    }
+    load();
+  }, [onSearch, loadResources, selectedApplication, filterResources, sortResources, resourceList, resourceFilter]), [selectedDocuments, setSelectedDocuments] = useState([]), handleOptionClick = (option) => {
+    onChange == null || onChange(option), setSelectedApplication(option);
+  }, handleSearchChange = (event) => {
+    const newText = event.target.value;
+    setSearchTerms(newText.toString());
+  }, handleSubmit = useCallback((event) => {
+    loadAndDisplayResources(searchTerms), event.stopPropagation(), event.preventDefault();
+  }, [loadAndDisplayResources, searchTerms]), getSelectedResourceIndex = useCallback((resourceId) => selectedDocuments.findIndex((selectedDocument) => selectedDocument.assetId === resourceId), [selectedDocuments]), selectResource = useCallback((resource) => {
+    setSelectedDocuments(multiple ? (previousState) => [...previousState, resource] : [resource]);
+  }, [setSelectedDocuments, multiple]), toggleResourceSelection = useCallback((resource) => {
+    const index = getSelectedResourceIndex(resource.assetId);
+    index < 0 ? selectResource(resource) : setSelectedDocuments(selectedDocuments.filter((_value, i) => i !== index));
+  }, [getSelectedResourceIndex, selectResource, selectedDocuments]);
+  return useEffect(() => {
+    (async () => {
+      if (applicationList) {
+        setOptions(applicationList.sort((app1, app2) => app1.displayName.localeCompare(app2.displayName)));
+        return;
+      }
+      const appPromises = resourceApplications.map((application) => odeServices.session().getWebApp(application)), webApps = await Promise.all(appPromises), opts = resourceApplications.map((application, index) => {
+        var _a;
+        let displayName = ((_a = webApps[index]) == null ? void 0 : _a.displayName) ?? application;
+        return application === "exercizer" ? displayName = "bbm.linker.int.app.exercizer" : application === "formulaire" && (displayName = "bbm.linker.int.app.forms"), {
+          application,
+          displayName: t(displayName ?? application),
+          icon: /* @__PURE__ */ jsx(AppIcon, { app: webApps[index], size: "24" })
+        };
+      }).sort((a, b) => a.displayName.localeCompare(b.displayName));
+      setOptions(opts);
+    })();
+  }, [resourceApplications, t, applicationList]), useEffect(() => {
+    loadAndDisplayResources(debounceSearch);
+  }, [loadAndDisplayResources, debounceSearch]), useEffect(() => {
+    onSelect == null || onSelect(selectedDocuments);
+  }, [selectedDocuments]), useEffect(() => {
+    var _a;
+    const safeDefaultAppCode = defaultAppCode ?? ((applicationList == null ? void 0 : applicationList.length) === 1 && ((_a = applicationList == null ? void 0 : applicationList[0]) == null ? void 0 : _a.application));
+    if (safeDefaultAppCode) {
+      const option = options == null ? void 0 : options.find((option2) => safeDefaultAppCode === option2.application);
+      setSelectedApplication(option), loadAndDisplayResources("");
+    }
+  }, [options, defaultAppCode]), useEffect(() => {
+    if (defaultResourceId && getSelectedResourceIndex(defaultResourceId) < 0) {
+      const resource = resources == null ? void 0 : resources.find((resource2) => defaultResourceId === resource2.assetId);
+      resource && selectResource(resource);
+    }
+  }, [resources]), /* @__PURE__ */ jsxs("div", { className: "d-flex flex-column flex-fill overflow-hidden", children: [
+    /* @__PURE__ */ jsxs("div", { className: "search d-flex bg-light rounded-top border border-bottom-0", children: [
+      showApplicationSelector && /* @__PURE__ */ jsx("div", { className: "flex-shrink-1 px-8 py-12 border-end", children: /* @__PURE__ */ jsxs(Dropdown, { overflow: !0, children: [
+        /* @__PURE__ */ jsx(Dropdown.Trigger, { icon: /* @__PURE__ */ jsx("div", { className: "pe-8", children: (selectedApplication == null ? void 0 : selectedApplication.icon) || /* @__PURE__ */ jsx(SvgIconApplications, {}) }), label: /* @__PURE__ */ jsxs("span", { className: "d-md-inline d-sm-none", children: [
+          " ",
+          t((selectedApplication == null ? void 0 : selectedApplication.displayName) || "bbm.linker.int.choose")
+        ] }), variant: "ghost", size: "md", disabled: disableApplicationSelector }),
+        /* @__PURE__ */ jsx(Dropdown.Menu, { children: options == null ? void 0 : options.map((option) => /* @__PURE__ */ jsx(Dropdown.Item, { icon: option.icon, onClick: () => handleOptionClick(option), children: option.displayName }, option.application)) })
+      ] }) }),
+      !showApplicationSelector && searchFilter && /* @__PURE__ */ jsx("div", { className: "flex-shrink-1 px-8 py-12 border-end align-self-center", children: searchFilter }),
+      /* @__PURE__ */ jsx("div", { className: "flex-grow-1 align-self-center", children: /* @__PURE__ */ jsx("form", { className: "gap-16 d-flex w-100 align-items-center px-16 py-8", onSubmit: handleSubmit, children: /* @__PURE__ */ jsx(SearchBar, { isVariant: !0, placeholder: t("search"), size: "lg", className: "w-100", disabled: !selectedApplication, onChange: handleSearchChange }) }) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "internal-linker flex-grow-1 w-100 rounded-bottom border gap-0 overflow-auto", children: [
+      selectedApplication && resources && resources.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+        resources.map((resource) => {
+          const isSelected = selectedDocuments.findIndex((doc) => doc.assetId === resource.assetId) >= 0;
+          return /* @__PURE__ */ jsx(LinkerCard, { doc: resource, isSelected, onClick: () => toggleResourceSelection(resource) }, resource.path);
+        }),
+        hasMoreResources && /* @__PURE__ */ jsx("div", { className: "d-grid gap-2 col-4 mx-auto my-24", children: /* @__PURE__ */ jsx(Button, { type: "button", color: "secondary", variant: "filled", onClick: onLoadMore, children: loadMoreLabel ?? t("bbm.linker.see.more") }) })
+      ] }),
+      selectedApplication && resources && resources.length <= 0 && /* @__PURE__ */ jsx("div", { className: "d-flex justify-content-center mt-16", children: /* @__PURE__ */ jsx(EmptyScreen, { imageSrc: emptyScreenMapping[(theme == null ? void 0 : theme.bootstrapVersion) ?? "one"][selectedApplication == null ? void 0 : selectedApplication.application], text: t("bbm.linker.int.notfound"), className: "mt-16" }) }),
+      !selectedApplication && /* @__PURE__ */ jsx("div", { className: "d-flex justify-content-center mt-32", children: /* @__PURE__ */ jsx(EmptyScreen, { imageSrc: emptyScreenMapping[(theme == null ? void 0 : theme.bootstrapVersion) ?? "one"].empty, text: t("bbm.linker.int.empty"), className: "mt-32" }) })
+    ] })
+  ] });
+};
+export {
+  InternalLinker
+};

package/dist/modules/multimedia/LinkerCard/LinkerCard.js

@@ -1 +1,34 @@
-import SvgIconUsers from"../../icons/components/IconUsers.js";import useDate from"../../../hooks/useDate/useDate.js";import Image from"../../../components/Image/Image.js";import AppIcon from"../../../components/AppIcon/AppIcon.js";import Card from"../../../components/Card/Card.js";import clsx$1 from"clsx";import{useMemo}from"react";import{jsx,jsxs}from"react/jsx-runtime";var LinkerCard=({doc,isClickable=!0,isSelectable=!1,isSelected=!1,onClick,className})=>{let{fromNow}=useDate(),displayDate=useMemo(()=>doc.fromDate??fromNow(doc.modifiedAt),[doc.fromDate,doc.modifiedAt,fromNow]);return jsx(Card,{className:clsx$1(`card-linker shadow-none`,className),isClickable,isSelectable,isSelected,onClick,children:jsxs(Card.Body,{space:`8`,children:[jsx(`div`,{className:`card-image ps-8 pe-4`,children:doc.thumbnail&&doc.thumbnail.length>0?jsx(Image,{alt:``,height:48,width:48,src:doc.thumbnail,objectFit:`cover`,className:`rounded h-full`,style:{aspectRatio:1/1}}):jsx(AppIcon,{app:doc.application,iconFit:`ratio`,size:`48`,variant:`rounded`})}),jsxs(`div`,{className:`w-75`,children:[jsx(Card.Text,{children:doc.name}),jsx(Card.Text,{className:`text-black-50`,children:doc?.creatorName})]}),jsx(`div`,{className:`d-none d-md-block text-black-50 ps-4 pe-8`,children:jsx(Card.Text,{children:displayDate})}),doc.shared&&jsx(`div`,{className:`ps-4 pe-8`,children:jsx(SvgIconUsers,{width:`20`,height:`20`})})]})})};export{LinkerCard as default};
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import clsx from "clsx";
+import SvgIconUsers from "../../icons/components/IconUsers.js";
+import useDate from "../../../hooks/useDate/useDate.js";
+import Card from "../../../components/Card/Card.js";
+import Image from "../../../components/Image/Image.js";
+import AppIcon from "../../../components/AppIcon/AppIcon.js";
+const LinkerCard = ({
+  doc,
+  isClickable = !0,
+  isSelectable = !1,
+  isSelected = !1,
+  onClick,
+  className
+}) => {
+  const {
+    fromNow
+  } = useDate(), displayDate = useMemo(() => doc.fromDate ?? fromNow(doc.modifiedAt), [doc.fromDate, doc.modifiedAt, fromNow]);
+  return /* @__PURE__ */ jsx(Card, { className: clsx("card-linker shadow-none", className), isClickable, isSelectable, isSelected, onClick, children: /* @__PURE__ */ jsxs(Card.Body, { space: "8", children: [
+    /* @__PURE__ */ jsx("div", { className: "card-image ps-8 pe-4", children: doc.thumbnail && doc.thumbnail.length > 0 ? /* @__PURE__ */ jsx(Image, { alt: "", height: 48, width: 48, src: doc.thumbnail, objectFit: "cover", className: "rounded h-full", style: {
+      aspectRatio: 1 / 1
+    } }) : /* @__PURE__ */ jsx(AppIcon, { app: doc.application, iconFit: "ratio", size: "48", variant: "rounded" }) }),
+    /* @__PURE__ */ jsxs("div", { className: "w-75", children: [
+      /* @__PURE__ */ jsx(Card.Text, { children: doc.name }),
+      /* @__PURE__ */ jsx(Card.Text, { className: "text-black-50", children: doc == null ? void 0 : doc.creatorName })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "d-none d-md-block text-black-50 ps-4 pe-8", children: /* @__PURE__ */ jsx(Card.Text, { children: displayDate }) }),
+    doc.shared && /* @__PURE__ */ jsx("div", { className: "ps-4 pe-8", children: /* @__PURE__ */ jsx(SvgIconUsers, { width: "20", height: "20" }) })
+  ] }) });
+};
+export {
+  LinkerCard as default
+};

package/dist/modules/multimedia/MediaLibrary/MediaLibrary.d.ts

@@ -1,4 +1,4 @@
-import { WorkspaceElement, WorkspaceVisibility } from '@edifice.io/client';
+import { NextcloudDocument, WorkspaceElement, WorkspaceVisibility } from '@edifice.io/client';
 import { TabsItemProps } from '../../../components';
 import { ExternalLinkTabProps } from './innertabs/ExternalLink';
 import { InternalLinkTabProps, InternalLinkTabResult } from './innertabs/InternalLink';
@@ -54,7 +54,7 @@ export interface MediaLibraryRef {
 /**
  * The resulting type depends on the actual selected Tab when modal is closed.
  */
-export type MediaLibraryResult = WorkspaceElement[] | WorkspaceElement | InternalLinkTabResult | string | /*TODO(ENABLING-1155): type des autres résultats ?*/ any;
+export type MediaLibraryResult = WorkspaceElement[] | WorkspaceElement | NextcloudDocument[] | InternalLinkTabResult | string | /*TODO type des autres résultats ?*/ any;
 /**
  * MediaLibrary component properties
  */