@edifice.io/react 2.0.0-develop-rc.4 → 2.0.0-develop-rc.7

package/README.md

@@ -1,4 +1,4 @@
-# Edifice React Components
+# Edifice React Library
 
 ![npm](https://img.shields.io/npm/v/@edifice.io/react?style=flat-square)
 ![bundlephobia](https://img.shields.io/bundlephobia/min/@edifice.io/react?style=flat-square)
@@ -7,104 +7,33 @@
 
 We follow [WAI ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/) rules and [Bootstrap 5](https://getbootstrap.com/docs/5.0/components/accordion/) guidelines when making our components
 
-### Build
+### Install
 
-```bash
-pnpm run build
 ```
-
-### Lint
-
-```bash
-pnpm run lint
+pnpm add @edifice.io/react
 ```
 
-If `pnpm run lint` shows issues, run this command to fix them.
+### Modules
 
-```bash
-pnpm run fix
-```
+Optional modules are available as `sub-imports`. You can use them in specific applications:
 
-### Prettier
-
-```bash
-pnpm run format
-```
+#### Audience
 
-## Structure
+Module to track views or reactions on a resource in a specific application (e.g: Blog)
 
-### Component Folder
+#### Editor
 
-- Folder name always in PascalCase: `Button`
-- Component file in PascalCase: `Button.tsx`
-- Export types & interfaces inside Component file
-- Stories file in PascalCase + `*.stories.tsx` : `Button.stories.tsx`
+Rich Text Editor using Tiptap and our `multimedia` module.
 
-```bash
-src
-  -- ComponentFolder
-    -- Component.tsx
-    -- Component.stories.tsx
-    -- index.ts
-```
-
-- Re-export the Component inside his own `index` file: `index.ts`
-- Export everything if Component has types & interfaces
-
-```jsx
-export { default as Component } from './Component';
-export * from './Component';
-```
+#### Modals
 
-### Component Guideline
+- Onboarding Modal to greet user and give him some useful informations about an application.
+- Publish Modal to publish a resource to the BPR application.
+- Resource Modal can be used to create or edit information about a resource
+- Share Modal allows a user to share one of his resource with specific roles to users
 
-- Always document basic guideline of Component with JSDoc format. Used by Storybook to generate documentation.
-
-```jsx
-/**
- * Primary UI component for user interaction
- */
-```
-
-### Interface description
-
-- Always document typescript types and interface with JSDoc syntax. Used by Storybook to generate documentation.
-
-```jsx
-// Interface description (e.g: TreeViewProps.tsx)
-export interface ButtonProps {
-  /**
-   * Is this the principal call to action on the page?
-   */
-  primary?: boolean;
-  /**
-   * What background color to use
-   */
-  backgroundColor?: string;
-  /**
-   * How large should the button be?
-   */
-  size?: "small" | "medium" | "large";
-  /**
-   * Button contents
-   */
-  label: string;
-  /**
-   * Optional click handler
-   */
-  onClick?: () => void;
-}
-```
-
-### Index file inside `src` folder
-
-- Entry point of this React Library.
-- Import your component inside `index.ts` file.
-
-```jsx
-export * from './Button';
-```
+#### Multimedia
 
-## Dev
+All our multimedia components to use in applications or in modules.
 
-You can build your component using `Storybook`. See [README](../../docs//README.md)
+- Linker, AudioRecorder, VideoRecorder, Iframe, Embed component, ...

package/dist/components/Alert/Alert.js

@@ -1,4 +1,4 @@
-import { jsx, Fragment, jsxs } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef, useState, useRef, useCallback, useImperativeHandle, useLayoutEffect, useEffect } from "react";
 import clsx from "clsx";
 import { useTranslation } from "react-i18next";
@@ -59,7 +59,7 @@ const Alert = /* @__PURE__ */ forwardRef(({
   }, confirmClasses = {
     "is-confirm": isConfirm
   }, divContainerClasses = clsx("alert gap-12", mapping[type].classModifier, toastClasses, confirmClasses, position, className);
-  return /* @__PURE__ */ jsx(Fragment, { children: isVisible ? /* @__PURE__ */ jsxs("div", { ref: refAlert, className: divContainerClasses, role: "alert", children: [
+  return isVisible ? /* @__PURE__ */ jsxs("div", { ref: refAlert, className: divContainerClasses, role: "alert", children: [
     !isConfirm && mapping[type].icon,
     /* @__PURE__ */ jsx("div", { className: "alert-content small", children }),
     button && /* @__PURE__ */ jsxs("div", { className: "ms-12", children: [
@@ -71,9 +71,9 @@ const Alert = /* @__PURE__ */ forwardRef(({
     autoClose && /* @__PURE__ */ jsx("div", { className: "alert-progress", style: {
       transform: "scaleX(0)"
     } })
-  ] }) : null });
-}), Alert$1 = Alert;
+  ] }) : null;
+});
 export {
   Alert,
-  Alert$1 as default
+  Alert as default
 };

package/dist/components/Table/TableExplorer.js

@@ -1,8 +1,8 @@
-import { jsx, Fragment } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 const TableExplorer = /* @__PURE__ */ forwardRef(({
   children
-}, ref) => /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("table", { ref, className: "table-explorer", children }) }));
+}, ref) => /* @__PURE__ */ jsx("table", { ref, className: "table-explorer", children }));
 export {
   TableExplorer,
   TableExplorer as default

package/dist/components/TextArea/TextArea.js

@@ -1,4 +1,4 @@
-import { jsx, Fragment } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import clsx from "clsx";
 import { useFormControl } from "../Form/FormContext.js";
@@ -27,7 +27,7 @@ const TextArea = /* @__PURE__ */ forwardRef(({
     "form-control-plaintext": isReadOnly,
     "no-validation-icon": noValidationIcon
   }, className);
-  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("textarea", { ref, id, className: classes, placeholder, required: isRequired, readOnly: isReadOnly, ...restProps }) });
+  return /* @__PURE__ */ jsx("textarea", { ref, id, className: classes, placeholder, required: isRequired, readOnly: isReadOnly, ...restProps });
 });
 export {
   TextArea,

package/dist/core/useConversation/useConversation.js

@@ -37,7 +37,7 @@ const useConversation = () => {
     msgLink,
     zimbraWorkflow
   };
-}, useConversation$1 = useConversation;
+};
 export {
-  useConversation$1 as default
+  useConversation as default
 };

package/dist/core/useHasWorkflow/useHasWorkflow.js

@@ -10,7 +10,7 @@ function useHasWorkflow(workflow) {
         if (typeof workflow == "string")
           response = await mock.hasWorkflow(workflow);
         else
-          throw "not.implemented.yet)";
+          throw new Error("not.implemented.yet)");
       else
         typeof workflow == "string" ? response = await odeServices.rights().sessionHasWorkflowRight(workflow) : response = await odeServices.rights().sessionHasWorkflowRights(workflow);
       setState(response);

package/dist/core/useHeader/useHeader.js

@@ -20,9 +20,9 @@ function useHeader({
     username: user == null ? void 0 : user.firstName
   }), bookmarkedApps = useBookmark(), communityWorkflow = useHasWorkflow("net.atos.entng.community.controllers.CommunityController|view"), conversationWorflow = useHasWorkflow("org.entcore.conversation.controllers.ConversationController|view"), searchWorkflow = useHasWorkflow("fr.openent.searchengine.controllers.SearchEngineController|view"), toggleCollapsedNav = useCallback(() => {
     setIsCollapsed(!isCollapsed);
-  }, [isCollapsed]), handleLogout = async () => {
+  }, [isCollapsed]), handleLogout = useCallback(async () => {
     await odeServices.session().logout(), window.location.href = (theme == null ? void 0 : theme.logoutCallback) ?? "/auth/login";
-  };
+  }, [theme == null ? void 0 : theme.logoutCallback]);
   return useMemo(() => ({
     title,
     bookmarkedApps,
@@ -39,7 +39,7 @@ function useHeader({
     isCollapsed,
     toggleCollapsedNav,
     handleLogout
-  }), [appsRef, bookmarkedApps, communityWorkflow, conversationWorflow, isAppsHovered, isCollapsed, popoverAppsId, popoverSearchId, searchWorkflow, title, toggleCollapsedNav, userAvatar, userName, welcomeUser]);
+  }), [appsRef, bookmarkedApps, communityWorkflow, conversationWorflow, handleLogout, isAppsHovered, isCollapsed, popoverAppsId, popoverSearchId, searchWorkflow, title, toggleCollapsedNav, userAvatar, userName, welcomeUser]);
 }
 export {
   useHeader as default

package/dist/core/useLibraryUrl/useLibraryUrl.js

@@ -15,7 +15,7 @@ const useLibraryUrl = () => {
   libraryHost.endsWith("/") || (libraryHost = `${libraryHost}/`);
   const platformURLParam = libraryUrlSplit == null ? void 0 : libraryUrlSplit[1], searchParams = `application%5B0%5D=${appName}&page=1&sort_field=views&sort_order=desc`;
   return `${libraryHost}search/?${platformURLParam}&${searchParams}`;
-}, useLibraryUrl$1 = useLibraryUrl;
+};
 export {
-  useLibraryUrl$1 as default
+  useLibraryUrl as default
 };

package/dist/core/useMediaLibrary/useMediaLibrary.js

@@ -52,7 +52,7 @@ const useMediaLibrary = () => {
       (_a = mediaLibraryRef.current) != null && _a.type && uploads && uploads.length > 0 && await remove(uploads);
     }
   };
-}, useMediaLibrary$1 = useMediaLibrary;
+};
 export {
-  useMediaLibrary$1 as default
+  useMediaLibrary as default
 };

package/dist/core/useOdeIcons/useOdeIcons.d.ts

@@ -1,4 +1,4 @@
-import { IWidget, IWebApp } from 'edifice-ts-client';
+import { IWebApp } from 'edifice-ts-client';
 export default function useOdeIcons(): {
     getIconClass: (app: IWebApp | string) => string;
     getBackgroundIconClass: (app: IWebApp | string) => string;

package/dist/core/useResource/useResource.d.ts

@@ -1,3 +1,2 @@
-import { IResource } from 'edifice-ts-client';
 declare const useResource: (application: string, id: string) => IResource;
 export default useResource;

package/dist/core/useTrashedResource/useTrashedResource.js

@@ -21,7 +21,7 @@ const useTrashedResource = (id) => {
         statusText: "Not Found"
       });
   }, [trashed]);
-}, useTrashedResource$1 = useTrashedResource;
+};
 export {
-  useTrashedResource$1 as default
+  useTrashedResource as default
 };

package/dist/core/useUpload/useUpload.d.ts

@@ -1,18 +1,17 @@
-import { WorkspaceElement, WorkspaceVisibility } from 'edifice-ts-client';
 import { Status } from '../../types';
-declare const useUpload: (visibility?: WorkspaceVisibility, application?: string) => {
+declare const useUpload: (visibility?: any, application?: string) => {
     getUploadStatus: (upload: File | Blob) => Status | undefined;
     setUploadStatus: (blob: File | Blob, status: Status) => void;
     clearUploadStatus: (blob: File | Blob) => void;
     uploadFile: (file: File, metadata?: {
         duration: number;
-    }) => Promise<WorkspaceElement | null>;
+    }) => Promise<any>;
     uploadAlternateFile: (original: File, replacement: File, metadata?: {
         duration: number;
-    }) => Promise<WorkspaceElement | null>;
+    }) => Promise<any>;
     uploadBlob: (blob: Blob, metadata?: {
         filename?: string;
         duration?: number;
-    }) => Promise<WorkspaceElement | null>;
+    }) => Promise<any>;
 };
 export default useUpload;

package/dist/core/useUpload/useUpload.js

@@ -1,8 +1,8 @@
 import { useState, useCallback } from "react";
 import { ERROR_CODE, odeServices } from "edifice-ts-client";
 import useBrowserInfo from "../../hooks/useBrowserInfo/useBrowserInfo.js";
-import useWorkspaceFile from "../useWorkspaceFile/useWorkspaceFile.js";
 import { getOrGenerateBlobId } from "../../utils/blob.js";
+import useWorkspaceFile from "../useWorkspaceFile/useWorkspaceFile.js";
 const useUpload = (visibility, application = "media-library") => {
   const [status, setStatus] = useState({}), {
     browser,

package/dist/core/useUploadFiles/useUploadFiles.d.ts

@@ -1,7 +1,7 @@
 import { WorkspaceElement, WorkspaceVisibility } from 'edifice-ts-client';
 declare const useUploadFiles: ({ handleOnChange, visibility, application, }: {
     handleOnChange: (uploadedFiles: WorkspaceElement[]) => void;
-    visibility?: WorkspaceVisibility | undefined;
+    visibility?: any;
     application?: string | undefined;
 }) => {
     /** List of files added from device */
@@ -9,9 +9,9 @@ declare const useUploadFiles: ({ handleOnChange, visibility, application, }: {
     getUploadStatus: (upload: Blob | File) => import('../../types').Status | undefined;
     clearUploadStatus: (blob: Blob | File) => void;
     uploadedFiles: WorkspaceElement[];
-    editingImage: WorkspaceElement | undefined;
-    setEditingImage: import('react').Dispatch<import('react').SetStateAction<WorkspaceElement | undefined>>;
-    getUrl: (resource?: WorkspaceElement, timestamp?: boolean) => string;
+    editingImage: any;
+    setEditingImage: import('react').Dispatch<any>;
+    getUrl: (resource?: any, timestamp?: boolean) => string;
     updateImage: ({ blob, legend, altText: alt, }: {
         blob: Blob;
         legend: string;
@@ -19,7 +19,7 @@ declare const useUploadFiles: ({ handleOnChange, visibility, application, }: {
     }) => Promise<void>;
     uploadFile: (file: File, metadata?: {
         duration: number;
-    } | undefined) => Promise<WorkspaceElement | null>;
+    } | undefined) => Promise<any>;
     removeFile: (file: File) => Promise<void>;
 };
 export default useUploadFiles;

package/dist/core/useUploadFiles/useUploadFiles.js

@@ -1,9 +1,9 @@
 import { useState, useCallback, useEffect } from "react";
 import { useDropzoneContext } from "../../components/Dropzone/DropzoneContext.js";
-import useWorkspaceFile from "../useWorkspaceFile/useWorkspaceFile.js";
 import useUpload from "../useUpload/useUpload.js";
 import useImageResizer from "../../hooks/useImageResizer/useImageResizer.js";
 import { addTimestampToImageUrl } from "../../utils/addTimestampToUrl.js";
+import useWorkspaceFile from "../useWorkspaceFile/useWorkspaceFile.js";
 const useUploadFiles = ({
   handleOnChange,
   visibility,
@@ -95,7 +95,7 @@ const useUploadFiles = ({
     uploadFile,
     removeFile
   };
-}, useUploadFiles$1 = useUploadFiles;
+};
 export {
-  useUploadFiles$1 as default
+  useUploadFiles as default
 };

package/dist/core/useWorkspaceFile/useWorkspaceFile.d.ts

@@ -7,15 +7,15 @@ declare const useWorkspaceFile: () => {
         legend?: string | undefined;
         application?: string | undefined;
         parentId?: string | undefined;
-        visibility?: WorkspaceVisibility | undefined;
+        visibility?: any;
     }) => Promise<string | {
-        file: WorkspaceElement;
+        file: any;
         src: string;
     }>;
     create: (file: File, params?: {
         visibility?: WorkspaceVisibility;
         application?: string | undefined;
-    }) => Promise<WorkspaceElement>;
-    remove: (file: WorkspaceElement | WorkspaceElement[]) => Promise<void>;
+    }) => Promise<any>;
+    remove: (file: WorkspaceElement | WorkspaceElement[]) => Promise<any>;
 };
 export default useWorkspaceFile;

package/dist/core/useWorkspaceFile/useWorkspaceFile.js

@@ -43,7 +43,7 @@ const useWorkspaceFile = () => ({
   create: async (file, params) => await odeServices.workspace().saveFile(file, params),
   // put,
   remove: async (file) => !file || Array.isArray(file) && file.length === 0 ? Promise.resolve() : await odeServices.workspace().deleteFile(Array.isArray(file) ? file : [file])
-}), useWorkspaceFile$1 = useWorkspaceFile;
+});
 export {
-  useWorkspaceFile$1 as default
+  useWorkspaceFile as default
 };

package/dist/core/useWorkspaceSearch/useWorkspaceSearch.d.ts

@@ -1,9 +1,9 @@
-import { Role, ID, WorkspaceElement, WorkspaceSearchFilter } from 'edifice-ts-client';
+import { ID, Role, WorkspaceElement, WorkspaceSearchFilter } from 'edifice-ts-client';
 import { TreeNode } from '../../components';
 export type FolderNode = TreeNode & {
     files?: WorkspaceElement[];
 };
 export default function useWorkspaceSearch(rootId: string, rootName: string, filter: WorkspaceSearchFilter, format: Role | Role[] | null): {
     root: FolderNode;
-    loadContent: (folderId?: ID) => void;
+    loadContent: (folderId?: any) => void;
 };

package/dist/core/useWorkspaceSearch/useWorkspaceSearch.js

@@ -32,7 +32,7 @@ function useWorkspaceSearch(rootId, rootName, filter, format) {
           ...result,
           _id: "" + Math.round(Math.random() * 9999)
         };
-        return ret.name = result.eType == "folder" ? "folder id=" + ret._id : "file id=" + ret._id, ret;
+        return ret.name = result.eType === "folder" ? "folder id=" + ret._id : "file id=" + ret._id, ret;
       }))) : await odeServices.workspace().listDocuments(filter, realWorkspaceId), subfolders = [], files = [];
       payload.filter((f) => {
         if (!format || f.eType === "folder") return !0;

package/dist/editor.js

@@ -1,18 +1,18 @@
 import { EditorContent, useEditor } from "@tiptap/react";
 import { default as default2 } from "./modules/editor/components/Editor/Editor.js";
-import { EditorToolbar } from "./modules/editor/components/EditorToolbar/EditorToolbar.js";
 import { default as default3 } from "./modules/editor/components/BubbleMenuEditImage/BubbleMenuEditImage.js";
 import { default as default4 } from "./modules/editor/components/NodeView/AudioNodeView.js";
 import { default as default5 } from "./modules/editor/components/NodeView/AttachmentNodeView.js";
 import { default as default6 } from "./modules/editor/components/NodeView/ImageNodeView.js";
 import { default as default7 } from "./modules/editor/components/NodeView/LinkerNodeView.js";
 import { default as default8 } from "./modules/editor/components/NodeView/VideoNodeView.js";
+import { default as default9 } from "./modules/editor/components/Toolbar/TableToolbar.js";
+import { default as default10 } from "./modules/editor/components/Toolbar/LinkToolbar.js";
+import { EditorToolbar } from "./modules/editor/components/EditorToolbar/EditorToolbar.js";
 import { AttachmentRenderer } from "./modules/editor/components/Renderer/AttachmentRenderer.js";
 import { AudioRenderer } from "./modules/editor/components/Renderer/AudioRenderer.js";
 import { LinkerRenderer } from "./modules/editor/components/Renderer/LinkerRenderer.js";
 import { MediaRenderer } from "./modules/editor/components/Renderer/MediaRenderer.js";
-import { default as default9 } from "./modules/editor/components/Toolbar/TableToolbar.js";
-import { default as default10 } from "./modules/editor/components/Toolbar/LinkToolbar.js";
 import { useActionOptions } from "./modules/editor/hooks/useActionOptions.js";
 import { useCommentEditor } from "./modules/editor/hooks/useCommentEditor.js";
 import { EditorContext, useEditorContext } from "./modules/editor/hooks/useEditorContext.js";

package/dist/hooks/useBrowserInfo/useBrowserInfo.js

@@ -1,7 +1,7 @@
 import UAParser from "ua-parser-js";
 function useBrowserInfo(userAgent) {
   var _a, _b, _c;
-  const uaParser = new UAParser(userAgent), os = uaParser.getOS(), device = uaParser.getDevice(), browser = uaParser.getBrowser(), isIphone = ((_a = device.model) == null ? void 0 : _a.indexOf("iPhone")) != -1, isIpod = ((_b = device.model) == null ? void 0 : _b.indexOf("iPod")) != -1, isIpad = ((_c = device.model) == null ? void 0 : _c.indexOf("iPad")) != -1;
+  const uaParser = new UAParser(userAgent), os = uaParser.getOS(), device = uaParser.getDevice(), browser = uaParser.getBrowser(), isIphone = ((_a = device.model) == null ? void 0 : _a.indexOf("iPhone")) !== -1, isIpod = ((_b = device.model) == null ? void 0 : _b.indexOf("iPod")) !== -1, isIpad = ((_c = device.model) == null ? void 0 : _c.indexOf("iPad")) !== -1;
   return {
     os,
     device,

package/dist/hooks/useDropdown/useDropdown.d.ts

@@ -1,4 +1,4 @@
-import { MutableRefObject, Dispatch, SetStateAction } from 'react';
+import { Dispatch, MutableRefObject, SetStateAction } from 'react';
 import { Placement } from '@floating-ui/react';
 export declare enum KEYS {
     Enter = "Enter",

package/dist/hooks/useDropdown/useDropdown.js

@@ -152,7 +152,7 @@ const useDropdown = (placement, extraTriggerKeyDownHandler, isTriggerHovered = !
     },
     setVisible
   };
-}, useDropdown$1 = useDropdown;
+};
 export {
-  useDropdown$1 as default
+  useDropdown as default
 };

package/dist/hooks/useDropzone/useDropzone.js

@@ -70,7 +70,7 @@ const useDropzone = (props) => {
     /** Callback to attach to your `input[type=file]` HTMLElement. */
     handleOnChange
   };
-}, useDropzone$1 = useDropzone;
+};
 export {
-  useDropzone$1 as default
+  useDropzone as default
 };

package/dist/hooks/useToast/useToast.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import toast from "react-hot-toast";
-import Alert from "../../components/Alert/Alert.js";
+import { Alert } from "../../components/Alert/Alert.js";
 const DEFAULT_POSITION = "top-right";
 function useToast() {
   return {