@edifice.io/react 2.3.0-develop-b2school.20250901133825 → 2.3.0-develop-pedago.20250902121609

package/dist/modules/modals/ResourceModal/ResourceModal.d.ts

@@ -7,13 +7,53 @@ export interface FormInputs {
     enablePublic: boolean;
     formSlug: string;
 }
+/**
+ * Custom translations interface for overriding default translations
+ */
+export interface ResourceModalTranslations {
+    title?: string;
+    description?: string;
+    cancel?: string;
+    create?: string;
+    save?: string;
+    header?: {
+        create?: string;
+        edit?: string;
+    };
+    heading?: {
+        general?: string;
+        access?: string;
+    };
+    placeholder?: {
+        title?: string;
+        description?: string;
+    };
+    imagepicker?: {
+        add?: string;
+        delete?: string;
+    };
+    success?: {
+        created?: string;
+        updated?: string;
+    };
+}
 interface BaseProps {
+    /** Controls modal visibility */
     isOpen: boolean;
+    /** Custom content to be displayed after the form fields */
     children?: ReactNode | ((...props: any) => ReactNode);
+    /** Maximum length for the title input */
     inputMaxLength?: number;
+    /** Maximum length for the description textarea */
     textareaMaxLength?: number;
-    onSuccess: () => void;
+    /** Callback when operation succeeds, with operation result as parameter */
+    onSuccess: (result: CreateResult | UpdateResult, param: CreateParameters | UpdateParameters) => void;
+    /** Callback when operation is cancelled */
     onCancel: () => void;
+    /** Override application code (uses EdificeClient context by default) */
+    appCode?: string;
+    /** Custom translations for the modal */
+    translations?: ResourceModalTranslations;
 }
 interface CreateProps extends BaseProps {
     mode: 'create';
@@ -26,5 +66,20 @@ interface UpdateProps extends BaseProps {
     resourceId: ID;
 }
 type Props = CreateProps | UpdateProps;
-export declare const ResourceModal: ({ isOpen, onCancel, onSuccess, children, inputMaxLength, textareaMaxLength, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
+/**
+ * ResourceModal component for creating or updating resources
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <ResourceModal
+ *   mode="create"
+ *   isOpen={true}
+ *   onCancel={() => setOpen(false)}
+ *   onSuccess={(result) => console.log('Resource created:', result)}
+ *   currentFolder={{ id: 'default' }}
+ * />
+ * ```
+ */
+export declare const ResourceModal: ({ isOpen, onCancel, onSuccess, children, appCode: customAppCode, translations: customT, inputMaxLength, textareaMaxLength, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
 export default ResourceModal;

package/dist/modules/modals/ResourceModal/ResourceModal.js

@@ -25,14 +25,17 @@ const DEFAULT_INPUT_MAX_LENGTH = 60, DEFAULT_TEXTAREA_MAX_LENGTH = 400, Resource
   onCancel,
   onSuccess,
   children,
+  appCode: customAppCode,
+  translations: customT = {},
   inputMaxLength = DEFAULT_INPUT_MAX_LENGTH,
   textareaMaxLength = DEFAULT_TEXTAREA_MAX_LENGTH,
   ...props
 }) => {
+  var _a, _b, _c, _d, _e, _f;
   const {
-    appCode: application,
+    appCode: contextAppCode,
     currentApp
-  } = useEdificeClient(), {
+  } = useEdificeClient(), application = customAppCode || contextAppCode, {
     t
   } = useTranslation(), {
     mode
@@ -65,7 +68,7 @@ const DEFAULT_INPUT_MAX_LENGTH = 60, DEFAULT_TEXTAREA_MAX_LENGTH = 400, Resource
     isUpdating,
     selectedResource: isUpdating ? resource : void 0
   }), watchedDescription = watch("description"), onSubmit = async function(formData) {
-    var _a, _b;
+    var _a2, _b2;
     try {
       const data = {
         description: formData.description || "",
@@ -74,21 +77,22 @@ const DEFAULT_INPUT_MAX_LENGTH = 60, DEFAULT_TEXTAREA_MAX_LENGTH = 400, Resource
         slug: formData.enablePublic && formData.formSlug || "",
         thumbnail
       };
+      let result, param;
       if (isCreating) {
         const createParams = {
           ...data,
           folder: props.currentFolder === void 0 || // Fix #WB2-1296: when searching, currentFolder is undefined
-          ((_a = props.currentFolder) == null ? void 0 : _a.id) === "default" ? void 0 : parseInt(((_b = props.currentFolder) == null ? void 0 : _b.id) || ""),
+          ((_a2 = props.currentFolder) == null ? void 0 : _a2.id) === "default" ? void 0 : parseInt(((_b2 = props.currentFolder) == null ? void 0 : _b2.id) || ""),
           application
         };
-        props.createResource ? await props.createResource.mutateAsync(createParams) : await odeServices.resource(application).create(createParams);
+        param = createParams, props.createResource ? result = await props.createResource.mutateAsync(createParams) : result = await odeServices.resource(application).create(createParams);
       } else {
         const updateParams = {
           ...data,
           entId: resource.assetId,
           trashed: resource.trashed
         };
-        props.updateResource ? await props.updateResource.mutateAsync(updateParams) : await odeServices.resource(application).update(updateParams);
+        param = updateParams, props.updateResource ? result = await props.updateResource.mutateAsync(updateParams) : result = await odeServices.resource(application).update(updateParams);
       }
       toast.success(/* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx("strong", { children: t(isCreating ? "explorer.resource.created" : "explorer.resource.updated") }),
@@ -106,21 +110,21 @@ const DEFAULT_INPUT_MAX_LENGTH = 60, DEFAULT_TEXTAREA_MAX_LENGTH = 400, Resource
           "Public:",
           formData.enablePublic ? t("explorer.enable.public.yes") : t("explorer.enable.public.no")
         ] })
-      ] })), onSuccess();
+      ] })), onSuccess(result, param);
     } catch (e) {
       console.error(e);
     }
   };
   return isUpdating && !resource ? /* @__PURE__ */ jsx(LoadingScreen, {}) : /* @__PURE__ */ createPortal(/* @__PURE__ */ jsxs(Modal, { id: `${mode}-resource`, size: "lg", isOpen, onModalClose: onCancel, children: [
-    /* @__PURE__ */ jsx(Modal.Header, { onModalClose: onCancel, children: t(`explorer.resource.editModal.header.${isCreating ? "create" : "edit"}`) }),
+    /* @__PURE__ */ jsx(Modal.Header, { onModalClose: onCancel, children: ((_a = customT.header) == null ? void 0 : _a[isCreating ? "create" : "edit"]) ?? t(`explorer.resource.editModal.header.${isCreating ? "create" : "edit"}`) }),
     /* @__PURE__ */ jsxs(Modal.Body, { children: [
-      /* @__PURE__ */ jsx(Heading, { headingStyle: "h4", level: "h3", className: "mb-16", children: t("explorer.resource.editModal.heading.general") }),
+      /* @__PURE__ */ jsx(Heading, { headingStyle: "h4", level: "h3", className: "mb-16", children: ((_b = customT.heading) == null ? void 0 : _b.general) ?? t("explorer.resource.editModal.heading.general") }),
       /* @__PURE__ */ jsxs("form", { id: formId, onSubmit: handleSubmit(onSubmit), children: [
         /* @__PURE__ */ jsxs("div", { className: "d-block d-md-flex gap-16 mb-24", children: [
-          /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(ImagePicker, { app: currentApp, src: isUpdating && (resource == null ? void 0 : resource.thumbnail) || "", addButtonLabel: t("explorer.imagepicker.button.add"), deleteButtonLabel: t("explorer.imagepicker.button.delete"), onUploadImage: handleUploadImage, onDeleteImage: handleDeleteImage, className: "align-self-center mt-8", libraryMedia, mediaLibraryRef }) }),
+          /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(ImagePicker, { app: currentApp, src: isUpdating && (resource == null ? void 0 : resource.thumbnail) || "", addButtonLabel: ((_c = customT.imagepicker) == null ? void 0 : _c.add) ?? t("explorer.imagepicker.button.add"), deleteButtonLabel: ((_d = customT.imagepicker) == null ? void 0 : _d.delete) ?? t("explorer.imagepicker.button.delete"), onUploadImage: handleUploadImage, onDeleteImage: handleDeleteImage, className: "align-self-center mt-8", libraryMedia, mediaLibraryRef }) }),
           /* @__PURE__ */ jsxs("div", { className: "col", children: [
             /* @__PURE__ */ jsxs(FormControl, { id: "title", className: "mb-16", isRequired: !0, children: [
-              /* @__PURE__ */ jsx(Label, { children: t("title") }),
+              /* @__PURE__ */ jsx(Label, { children: customT.title ?? t("title") }),
               /* @__PURE__ */ jsx(Input, { type: "text", defaultValue: isUpdating ? resource == null ? void 0 : resource.name : "", ...register("title", {
                 required: !0,
                 maxLength: inputMaxLength,
@@ -128,14 +132,14 @@ const DEFAULT_INPUT_MAX_LENGTH = 60, DEFAULT_TEXTAREA_MAX_LENGTH = 400, Resource
                   value: /[^ ]/,
                   message: "invalid title"
                 }
-              }), placeholder: t("explorer.resource.editModal.title.placeholder"), size: "md", "aria-required": !0, maxLength: inputMaxLength })
+              }), placeholder: ((_e = customT.placeholder) == null ? void 0 : _e.title) ?? t("explorer.resource.editModal.title.placeholder"), size: "md", "aria-required": !0, maxLength: inputMaxLength })
             ] }),
             /* @__PURE__ */ jsxs(FormControl, { id: "description", isOptional: !0, children: [
-              /* @__PURE__ */ jsx(Label, { children: t("description") }),
+              /* @__PURE__ */ jsx(Label, { children: customT.description ?? t("description") }),
               /* @__PURE__ */ jsx(TextArea, { defaultValue: (resource == null ? void 0 : resource.description) || "", ...register("description", {
                 required: !1,
                 maxLength: textareaMaxLength
-              }), placeholder: t("explorer.resource.editModal.description.placeholder"), size: "md", maxLength: textareaMaxLength }),
+              }), placeholder: ((_f = customT.placeholder) == null ? void 0 : _f.description) ?? t("explorer.resource.editModal.description.placeholder"), size: "md", maxLength: textareaMaxLength }),
               watchedDescription && /* @__PURE__ */ jsx(TextareaCounter, { content: watchedDescription, maxLength: textareaMaxLength })
             ] })
           ] })
@@ -144,8 +148,8 @@ const DEFAULT_INPUT_MAX_LENGTH = 60, DEFAULT_TEXTAREA_MAX_LENGTH = 400, Resource
       ] })
     ] }),
     /* @__PURE__ */ jsxs(Modal.Footer, { children: [
-      /* @__PURE__ */ jsx(Button, { color: "tertiary", onClick: onCancel, type: "button", variant: "ghost", children: t("explorer.cancel") }),
-      /* @__PURE__ */ jsx(Button, { form: formId, type: "submit", color: "primary", isLoading: isSubmitting, variant: "filled", disabled: !isValid || isSubmitting, children: t(isCreating ? "explorer.create" : "save") })
+      /* @__PURE__ */ jsx(Button, { color: "tertiary", onClick: onCancel, type: "button", variant: "ghost", children: customT.cancel ?? t("explorer.cancel") }),
+      /* @__PURE__ */ jsx(Button, { form: formId, type: "submit", color: "primary", isLoading: isSubmitting, variant: "filled", disabled: !isValid || isSubmitting, children: isCreating ? customT.create ?? t("explorer.create") : customT.save ?? t("save") })
     ] }),
     /* @__PURE__ */ jsx(MediaLibrary, { appCode: application, ref: mediaLibraryRef, multiple: !1, visibility: "protected", ...mediaLibraryHandlers })
   ] }), document.getElementById("portal"));

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

@@ -1,13 +1,24 @@
+import { ReactNode } from 'react';
 import { WorkspaceElement } from '@edifice.io/client';
 import { CardProps } from '../../../components';
 export interface FileCardProps extends CardProps {
     /**
      * WorkspaceElement
-     * */
+     */
     doc: WorkspaceElement;
+    /**
+     * Custom icon to override the default based on file type
+     * Can be a string or a React node
+     */
+    customIcon?: ReactNode;
+    /**
+     * Custom color class to override the default based on file type
+     * Example: "bg-purple-300" or any valid CSS class
+     */
+    customColor?: string;
 }
 declare const FileCard: {
-    ({ doc, isClickable, isSelectable, isSelected, onClick, className, }: FileCardProps): import("react/jsx-runtime").JSX.Element;
+    ({ doc, isClickable, isSelectable, isSelected, onClick, className, onSelect, isFocused, app, customIcon, customColor, }: FileCardProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default FileCard;

package/dist/modules/multimedia/FileCard/FileCard.js

@@ -15,11 +15,21 @@ const FileCard = ({
   isSelectable = !1,
   isSelected = !1,
   onClick,
-  className
+  className,
+  onSelect,
+  isFocused,
+  app,
+  customIcon,
+  customColor
 }) => {
-  var _a;
   const ref = useRef(null), type = DocumentHelper.getRole(doc);
   function getRoleMap(type2) {
+    if (customIcon !== void 0 || customColor !== void 0)
+      return {
+        icon: customIcon || /* @__PURE__ */ jsx(SvgIconTextPage, { width: 22, height: 22 }),
+        color: customColor || "bg-gray-300",
+        hasShadow: !1
+      };
     const roleMappings = {
       csv: {
         icon: ".CSV",
@@ -72,17 +82,17 @@ const FileCard = ({
     };
     return roleMappings[type2] || roleMappings.unknown;
   }
-  const file = clsx("file position-relative rounded", ((_a = getRoleMap(type ?? "default")) == null ? void 0 : _a.color) ?? "bg-yellow-200"), mediaSrc = type === "img" || type === "video" ? odeServices.workspace().getThumbnailUrl(doc) : null, hasThumbnail = useThumbnail(mediaSrc, {
+  const roleMap = getRoleMap(type ?? "unknown"), file = clsx("file position-relative rounded", (roleMap == null ? void 0 : roleMap.color) ?? "bg-yellow-200"), mediaSrc = type === "img" || type === "video" ? odeServices.workspace().getThumbnailUrl(doc) : null, hasThumbnail = useThumbnail(mediaSrc, {
     ref
   }), imageStyles = hasThumbnail && {
     backgroundImage: `url(${mediaSrc})`,
     backgroundSize: "cover"
   };
-  return /* @__PURE__ */ jsx(Card, { className: clsx("card-file", className), isClickable, isSelectable, isSelected, onClick, children: /* @__PURE__ */ jsxs(Card.Body, { space: "8", children: [
+  return /* @__PURE__ */ jsx(Card, { className: clsx("card-file", className), isClickable, isSelectable, isSelected, onClick, app, isFocused, onSelect, children: /* @__PURE__ */ jsxs(Card.Body, { space: "8", children: [
     /* @__PURE__ */ jsx("div", { ref, className: file, style: {
       aspectRatio: "16/10",
       ...imageStyles
-    }, children: type !== "img" || type === "img" && !hasThumbnail ? /* @__PURE__ */ jsx(FileIcon, { type, roleMap: getRoleMap(type) }) : null }),
+    }, children: type !== "img" || type === "img" && !hasThumbnail ? /* @__PURE__ */ jsx(FileIcon, { type, roleMap }) : null }),
     /* @__PURE__ */ jsxs("div", { className: "mt-4", children: [
       /* @__PURE__ */ jsx(Card.Text, { children: doc.name }),
       /* @__PURE__ */ jsx(Card.Text, { className: "text-black-50", children: doc == null ? void 0 : doc.ownerName })

package/dist/modules/multimedia/FileCard/FileIcon.d.ts

@@ -1,6 +1,10 @@
 import { Role } from '@edifice.io/client';
 declare const FileIcon: ({ type, roleMap, }: {
     type: Role | "unknown";
-    roleMap?: Record<string, string | JSX.Element>;
+    roleMap?: {
+        icon: React.ReactNode | string;
+        color: string;
+        hasShadow?: boolean;
+    };
 }) => import("react/jsx-runtime").JSX.Element;
 export default FileIcon;

package/dist/modules/multimedia/FileCard/FileIcon.js

@@ -5,8 +5,8 @@ const FileIcon = ({
   type,
   roleMap
 }) => {
-  const hasNoShadow = typeof (roleMap == null ? void 0 : roleMap.icon) != "string" && type !== "unknown", fileicon = clsx("position-absolute top-50 start-50 translate-middle", {
-    "p-12 rounded-circle shadow": hasNoShadow
+  const hasShadow = typeof (roleMap == null ? void 0 : roleMap.icon) != "string" && type !== "unknown" && (roleMap == null ? void 0 : roleMap.hasShadow) !== !1, fileicon = clsx("position-absolute top-50 start-50 translate-middle", {
+    "p-12 rounded-circle shadow": hasShadow
   }, roleMap == null ? void 0 : roleMap.color);
   return /* @__PURE__ */ jsx("div", { className: fileicon, children: (roleMap == null ? void 0 : roleMap.icon) ?? /* @__PURE__ */ jsx(SvgIconPaperclip, {}) });
 };

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

@@ -35,7 +35,9 @@ export type MediaLibraryType =
 /** Embedded websites */
  | 'embedder'
 /** Hyperlinks */
- | 'hyperlink';
+ | 'hyperlink'
+/** Studio mode for recording audio and video */
+ | 'studio';
 export interface MediaLibraryRef {
     /** Open the Media Library on given type. */
     show: (type: MediaLibraryType) => void;

package/dist/modules/multimedia/MediaLibrary/MediaLibrary.js

@@ -56,6 +56,11 @@ const orderedTabs = [
   embedder: {
     title: "bbm.embed.modal.title",
     defaultTab: "iframe"
+  },
+  // Add studio type with video-capture as default tab
+  studio: {
+    title: "bbm.studio.modal.title",
+    defaultTab: "audio-capture"
   }
 }, MediaLibrary = /* @__PURE__ */ forwardRef(({
   appCode,
@@ -101,7 +106,7 @@ const orderedTabs = [
       icon: /* @__PURE__ */ jsx(SvgIconRecordVideo, {}),
       label: t("bbm.video"),
       content: /* @__PURE__ */ jsx(InnerTabs.Video, {}),
-      availableFor: ["video"],
+      availableFor: ["video", "studio"],
       isEnable: () => !!videoCaptureWorkflow
     },
     "audio-capture": {
@@ -109,7 +114,7 @@ const orderedTabs = [
       icon: /* @__PURE__ */ jsx(SvgIconMic, {}),
       label: t("bbm.audio"),
       content: /* @__PURE__ */ jsx(InnerTabs.Audio, {}),
-      availableFor: ["audio"],
+      availableFor: ["audio", "studio"],
       isEnable: () => !!workspaceCreateWorkflow
     },
     "external-link": {

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

@@ -2,6 +2,7 @@ export * from './AudioRecorder';
 export * from './Embed';
 export * from './ImageEditor';
 export * from './ImagePicker';
+export * from './FileCard';
 export * from './Linker';
 export * from './MediaLibrary';
 export * from './VideoEmbed';

package/dist/multimedia.js

@@ -2,23 +2,25 @@ import { default as default2 } from "./modules/multimedia/AudioRecorder/AudioRec
 import { default as default3 } from "./modules/multimedia/Embed/Embed.js";
 import { default as default4 } from "./modules/multimedia/ImageEditor/components/ImageEditor.js";
 import { default as default5 } from "./modules/multimedia/ImagePicker/ImagePicker.js";
-import { default as default6 } from "./modules/multimedia/MediaLibrary/MediaLibrary.js";
-import { default as default7 } from "./modules/multimedia/VideoEmbed/VideoEmbed.js";
-import { default as default8 } from "./modules/multimedia/VideoRecorder/VideoRecorder.js";
-import { default as default9 } from "./modules/multimedia/Workspace/Workspace.js";
-import { default as default10 } from "./modules/multimedia/WorkspaceFolders/WorkspaceFolders.js";
+import { default as default6 } from "./modules/multimedia/FileCard/FileCard.js";
+import { default as default7 } from "./modules/multimedia/MediaLibrary/MediaLibrary.js";
+import { default as default8 } from "./modules/multimedia/VideoEmbed/VideoEmbed.js";
+import { default as default9 } from "./modules/multimedia/VideoRecorder/VideoRecorder.js";
+import { default as default10 } from "./modules/multimedia/Workspace/Workspace.js";
+import { default as default11 } from "./modules/multimedia/WorkspaceFolders/WorkspaceFolders.js";
 import { ExternalLinker } from "./modules/multimedia/Linker/ExternalLinker/ExternalLinker.js";
 import { InternalLinker } from "./modules/multimedia/Linker/InternalLinker/InternalLinker.js";
 export {
   default2 as AudioRecorder,
   default3 as Embed,
   ExternalLinker,
+  default6 as FileCard,
   default4 as ImageEditor,
   default5 as ImagePicker,
   InternalLinker,
-  default6 as MediaLibrary,
-  default7 as VideoEmbed,
-  default8 as VideoRecorder,
-  default9 as Workspace,
-  default10 as WorkspaceFolders
+  default7 as MediaLibrary,
+  default8 as VideoEmbed,
+  default9 as VideoRecorder,
+  default10 as Workspace,
+  default11 as WorkspaceFolders
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@edifice.io/react",
-  "version": "2.3.0-develop-b2school.20250901133825",
+  "version": "2.3.0-develop-pedago.20250902121609",
   "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.0-develop-b2school.20250901133825",
-    "@edifice.io/tiptap-extensions": "2.3.0-develop-b2school.20250901133825",
-    "@edifice.io/utilities": "2.3.0-develop-b2school.20250901133825"
+    "@edifice.io/bootstrap": "2.3.0-develop-pedago.20250902121609",
+    "@edifice.io/tiptap-extensions": "2.3.0-develop-pedago.20250902121609",
+    "@edifice.io/utilities": "2.3.0-develop-pedago.20250902121609"
   },
   "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.0-develop-b2school.20250901133825",
-    "@edifice.io/config": "2.3.0-develop-b2school.20250901133825"
+    "@edifice.io/client": "2.3.0-develop-pedago.20250902121609",
+    "@edifice.io/config": "2.3.0-develop-pedago.20250902121609"
   },
   "peerDependencies": {
     "@react-spring/web": "^9.7.5",