@edifice.io/react 2.0.0-develop-rc.14 → 2.0.0-develop-rc.16

package/dist/modules/modals/ShareModal/hooks/useSearch.js

@@ -0,0 +1,178 @@
+import { jsx } from "react/jsx-runtime";
+import { useReducer, useEffect } from "react";
+import { odeServices } from "@edifice.io/ts-client";
+import { useTranslation } from "react-i18next";
+import { useDebounce } from "@uidotdev/usehooks";
+import { useEdificeClient } from "../../../../providers/EdificeClientProvider/EdificeClientProvider.hook.js";
+import SvgIconBookmark from "../../../icons/components/IconBookmark.js";
+import useIsAdml from "../../../../hooks/useIsAdml/useIsAdml.js";
+const initialState = {
+  searchInputValue: "",
+  searchResults: [],
+  searchAPIResults: [],
+  isSearching: !1
+};
+function reducer(state, action) {
+  switch (action.type) {
+    case "onChange":
+      return {
+        ...state,
+        searchInputValue: action.payload
+      };
+    case "isSearching":
+      return {
+        ...state,
+        isSearching: action.payload
+      };
+    case "addResult":
+      return {
+        ...state,
+        searchResults: action.payload
+      };
+    case "addApiResult":
+      return {
+        ...state,
+        searchAPIResults: action.payload
+      };
+    case "updateSearchResult":
+      return {
+        ...state,
+        searchResults: action.payload
+      };
+    case "emptyResult":
+      return {
+        ...state,
+        searchResults: action.payload
+      };
+    default:
+      throw new Error("Unhandled action type");
+  }
+}
+const defaultActions = [{
+  id: "read",
+  displayName: "read"
+}, {
+  id: "comment",
+  displayName: "comment"
+}], useSearch = ({
+  resourceId,
+  resourceCreatorId,
+  shareRights,
+  shareDispatch
+}) => {
+  const [state, dispatch] = useReducer(reducer, initialState), debouncedSearchInputValue = useDebounce(state.searchInputValue, 500), {
+    isAdml
+  } = useIsAdml(), {
+    appCode
+  } = useEdificeClient(), {
+    t
+  } = useTranslation();
+  useEffect(() => {
+    search(debouncedSearchInputValue);
+  }, [debouncedSearchInputValue]);
+  const handleSearchInputChange = (event) => {
+    const value = event.target.value;
+    dispatch({
+      type: "onChange",
+      payload: value
+    });
+  }, search = async (debouncedSearchInputValue2) => {
+    if (resourceId) {
+      if (dispatch({
+        type: "isSearching",
+        payload: !0
+      }), !isAdml && debouncedSearchInputValue2.length >= 1 || isAdml && debouncedSearchInputValue2.length >= 3) {
+        const resSearchShareSubjects = await odeServices.share().searchShareSubjects(appCode, resourceId, debouncedSearchInputValue2);
+        dispatch({
+          type: "addApiResult",
+          payload: resSearchShareSubjects
+        });
+        const adaptedResults = resSearchShareSubjects.filter((right) => !shareRights.rights.find((shareRight) => shareRight.id === right.id)).filter((right) => !(right.type === "user" && right.id === resourceCreatorId)).map((searchResult) => {
+          let label = searchResult.displayName;
+          return searchResult.type === "user" && searchResult.profile ? label = `${label} (${t(searchResult.profile)})` : searchResult.type === "group" && searchResult.structureName && (label = `${label} (${searchResult.structureName})`), {
+            value: searchResult.id,
+            label,
+            icon: searchResult.type === "sharebookmark" ? /* @__PURE__ */ jsx(SvgIconBookmark, {}) : null
+          };
+        });
+        dispatch({
+          type: "addResult",
+          payload: adaptedResults
+        });
+      } else
+        dispatch({
+          type: "emptyResult",
+          payload: []
+        }), Promise.resolve();
+      dispatch({
+        type: "isSearching",
+        payload: !1
+      });
+    }
+  };
+  return {
+    state,
+    showSearchAdmlHint: () => isAdml && state.searchInputValue.length < 3,
+    showSearchLoading: () => state.isSearching,
+    showSearchNoResults: () => !state.isSearching && !isAdml && debouncedSearchInputValue.length > 0 && state.searchResults.length === 0 || !state.isSearching && isAdml && debouncedSearchInputValue.length > 3 && state.searchResults.length === 0,
+    getSearchMinLength: () => isAdml ? 3 : 1,
+    handleSearchInputChange,
+    handleSearchResultsChange: async (model) => {
+      const shareSubject = state.searchAPIResults.find((searchAPIResult) => searchAPIResult.id === model[0]);
+      if (shareSubject) {
+        let rightsToAdd = [];
+        if (shareSubject.type === "sharebookmark") {
+          const bookmarkRes = await odeServices.directory().getBookMarkById(shareSubject.id);
+          rightsToAdd.push({
+            ...bookmarkRes,
+            type: "sharebookmark",
+            avatarUrl: "",
+            directoryUrl: "",
+            actions: defaultActions
+          }), bookmarkRes == null || bookmarkRes.users.filter((user) => !shareRights.rights.find((right) => right.id === user.id)).forEach((user) => {
+            rightsToAdd.push({
+              ...user,
+              type: "user",
+              avatarUrl: "",
+              directoryUrl: "",
+              actions: defaultActions,
+              isBookmarkMember: !0
+            });
+          }), bookmarkRes.groups.filter((group) => !shareRights.rights.find((right) => right.id === group.id)).forEach((group) => {
+            rightsToAdd.push({
+              ...group,
+              type: "group",
+              avatarUrl: "",
+              directoryUrl: "",
+              actions: defaultActions,
+              isBookmarkMember: !0
+            });
+          });
+        } else
+          rightsToAdd = [{
+            ...shareSubject,
+            actions: [{
+              id: "read",
+              displayName: "read"
+            }, {
+              id: "comment",
+              displayName: "comment"
+            }]
+          }];
+        shareDispatch({
+          type: "updateShareRights",
+          payload: {
+            ...shareRights,
+            rights: [...shareRights.rights, ...rightsToAdd]
+          }
+        }), dispatch({
+          type: "updateSearchResult",
+          payload: state.searchResults.filter((result) => result.value !== model[0])
+        });
+      }
+    }
+  };
+};
+export {
+  useSearch
+};

package/dist/modules/modals/ShareModal/hooks/useShare.d.ts

@@ -0,0 +1,54 @@
+import { ShareRight, ShareRightAction, ShareRightActionDisplayName, ShareRightWithVisibles } from '@edifice.io/ts-client';
+import { ShareOptions, ShareResourceMutation } from '../ShareModal';
+interface UseShareResourceModalProps {
+    /**
+     * Resource ID (assetId)
+     */
+    resourceId: ShareOptions["resourceId"];
+    /**
+     * Resource Rights (based on the new rights array)
+     */
+    resourceRights: ShareOptions["resourceRights"];
+    /**
+     * Resource Creator Id: Id of the user who created the resource
+     */
+    resourceCreatorId: ShareOptions["resourceCreatorId"];
+    shareResource?: ShareResourceMutation;
+    onSuccess: () => void;
+    setIsLoading: (value: boolean) => void;
+}
+type State = {
+    isSharing: boolean;
+    shareRights: ShareRightWithVisibles;
+    shareRightActions: ShareRightAction[];
+};
+export type ShareAction = {
+    type: "init";
+    payload: Partial<State>;
+} | {
+    type: "updateShareRights";
+    payload: ShareRightWithVisibles;
+} | {
+    type: "toggleRight";
+    payload: ShareRightWithVisibles;
+} | {
+    type: "deleteRow";
+    payload: ShareRightWithVisibles;
+} | {
+    type: "isSharing";
+    payload: boolean;
+};
+export default function useShare({ resourceId, resourceRights, resourceCreatorId, shareResource, setIsLoading, onSuccess, }: UseShareResourceModalProps): {
+    state: {
+        isSharing: boolean;
+        shareRights: ShareRightWithVisibles;
+        shareRightActions: ShareRightAction[];
+    };
+    dispatch: import('react').Dispatch<ShareAction>;
+    currentIsAuthor: () => boolean;
+    myAvatar: string;
+    handleDeleteRow: (shareRight: ShareRight) => void;
+    handleShare: () => Promise<void>;
+    toggleRight: (shareRight: ShareRight, actionName: ShareRightActionDisplayName) => void;
+};
+export {};

package/dist/modules/modals/ShareModal/hooks/useShare.js

@@ -0,0 +1,192 @@
+import { useReducer, useEffect } from "react";
+import { odeServices } from "@edifice.io/ts-client";
+import { useTranslation } from "react-i18next";
+import { useEdificeClient } from "../../../../providers/EdificeClientProvider/EdificeClientProvider.hook.js";
+import useUser from "../../../../hooks/useUser/useUser.js";
+import useToast from "../../../../hooks/useToast/useToast.js";
+const initialState = {
+  isSharing: !1,
+  shareRights: {
+    rights: [],
+    visibleBookmarks: [],
+    visibleGroups: [],
+    visibleUsers: []
+  },
+  shareRightActions: []
+};
+function reducer(state, action) {
+  switch (action.type) {
+    case "init":
+      return {
+        ...state,
+        ...action.payload
+      };
+    case "deleteRow":
+      return {
+        ...state,
+        shareRights: action.payload
+      };
+    case "updateShareRights":
+      return {
+        ...state,
+        shareRights: action.payload
+      };
+    case "toggleRight":
+      return {
+        ...state,
+        shareRights: action.payload
+      };
+    case "isSharing":
+      return {
+        ...state,
+        isSharing: action.payload
+      };
+    default:
+      throw new Error("Unhandled action type");
+  }
+}
+function useShare({
+  resourceId,
+  resourceRights,
+  resourceCreatorId,
+  shareResource,
+  setIsLoading,
+  onSuccess
+}) {
+  const {
+    appCode
+  } = useEdificeClient(), {
+    user,
+    avatar
+  } = useUser(), toast = useToast(), {
+    t
+  } = useTranslation(), [state, dispatch] = useReducer(reducer, initialState);
+  useEffect(() => {
+    resourceId && (async () => {
+      try {
+        const [shareRightActions, shareRights] = await Promise.all([odeServices.share().getActionsForApp(appCode), odeServices.share().getRightsForResource(appCode, resourceId)]);
+        dispatch({
+          type: "init",
+          payload: {
+            shareRightActions,
+            shareRights
+          }
+        });
+      } catch (error) {
+        console.error(error);
+      }
+      setIsLoading(!1);
+    })();
+  }, [resourceId]);
+  const toggleRight = (shareRight, actionName) => {
+    var _a, _b;
+    const {
+      rights,
+      ...props
+    } = state.shareRights, newShareRights = [...rights], index = newShareRights.findIndex((x) => x.id === shareRight.id), actionObject = state.shareRightActions.filter((shareRightAction) => shareRightAction.id === actionName)[0];
+    if (newShareRights[index].actions.findIndex((action) => action.id === actionName) > -1) {
+      let updatedActions = newShareRights[index].actions.filter((action) => action.id !== actionName);
+      const requiredActions = state.shareRightActions.filter((shareRightAction) => {
+        var _a2;
+        return (_a2 = shareRightAction.requires) == null ? void 0 : _a2.includes(actionName);
+      });
+      updatedActions = updatedActions.filter((action) => !requiredActions.find((requiredAction) => requiredAction.id === action.id)), newShareRights[index] = {
+        ...newShareRights[index],
+        actions: updatedActions
+      };
+    } else {
+      const requiredActions = state.shareRightActions.filter((shareRightAction) => {
+        var _a2;
+        return ((_a2 = actionObject.requires) == null ? void 0 : _a2.includes(shareRightAction.id)) && !newShareRights[index].actions.find((action) => action.id === shareRightAction.id);
+      });
+      newShareRights[index] = {
+        ...newShareRights[index],
+        actions: [...newShareRights[index].actions, actionObject, ...requiredActions]
+      };
+    }
+    shareRight.type === "sharebookmark" && ((_a = newShareRights[index].users) == null || _a.forEach((user2) => {
+      const userIndex = newShareRights.findIndex((item) => item.id === user2.id);
+      newShareRights[userIndex] = {
+        ...newShareRights[userIndex],
+        actions: newShareRights[index].actions
+      };
+    }), (_b = newShareRights[index].groups) == null || _b.forEach((user2) => {
+      const userIndex = newShareRights.findIndex((item) => item.id === user2.id);
+      newShareRights[userIndex] = {
+        ...newShareRights[userIndex],
+        actions: newShareRights[index].actions
+      };
+    })), dispatch({
+      type: "toggleRight",
+      payload: {
+        rights: newShareRights,
+        ...props
+      }
+    });
+  }, notifySuccess = (value) => {
+    Object.keys(value)[0] === "error" ? (toast.error(t("explorer.shared.status.error")), console.error("Failed to save share", value)) : toast.success(t("explorer.shared.status.saved"));
+  };
+  return {
+    state,
+    dispatch,
+    currentIsAuthor: () => resourceCreatorId === (user == null ? void 0 : user.userId),
+    myAvatar: avatar,
+    handleDeleteRow: (shareRight) => {
+      dispatch({
+        type: "deleteRow",
+        payload: {
+          ...state.shareRights,
+          rights: state.shareRights.rights.filter((right) => {
+            var _a, _b;
+            return right.id !== shareRight.id && !((_a = shareRight.users) != null && _a.find((user2) => user2.id === right.id)) && !((_b = shareRight.groups) != null && _b.find((group) => group.id === right.id));
+          })
+        }
+      });
+    },
+    handleShare: async () => {
+      dispatch({
+        type: "isSharing",
+        payload: !0
+      });
+      try {
+        const myRights = resourceRights.filter((right) => user && right.includes(`user:${user.userId}`)).map((right) => right.split(":")[2]).filter((right) => !!right), shares = [...state.shareRights.rights];
+        if (myRights.length > 0) {
+          const actions = myRights.map((right) => ({
+            displayName: right,
+            id: right
+          }));
+          shares.push({
+            actions,
+            avatarUrl: "",
+            directoryUrl: "",
+            displayName: user.username,
+            id: user.userId,
+            type: "user"
+          });
+        }
+        if (shareResource) {
+          const result = await shareResource.mutateAsync({
+            resourceId,
+            rights: shares
+          });
+          notifySuccess(result);
+        } else {
+          const result = await odeServices.share().saveRights(appCode, resourceId, shares);
+          notifySuccess(result);
+        }
+        onSuccess();
+      } catch (error) {
+        typeof error == "string" && toast.error(t("explorer.shared.status.error")), console.error("Failed to save share", error);
+      } finally {
+        dispatch({
+          type: "isSharing",
+          payload: !1
+        });
+      }
+    },
+    toggleRight
+  };
+}
+export {
+  useShare as default
+};

package/dist/modules/modals/ShareModal/hooks/useShareBookmark.d.ts

@@ -0,0 +1,23 @@
+import { Dispatch } from 'react';
+import { ShareRightWithVisibles } from '@edifice.io/ts-client';
+import { ShareAction } from './useShare';
+interface UseShareBookmarkProps {
+    shareRights: ShareRightWithVisibles;
+    shareDispatch: Dispatch<ShareAction>;
+}
+export type BookmarkProps = {
+    name: string;
+    id: string;
+};
+export declare const useShareBookmark: ({ shareRights, shareDispatch, }: UseShareBookmarkProps) => {
+    refBookmark: import('react').RefObject<HTMLInputElement>;
+    showBookmark: boolean;
+    showBookmarkInput: boolean;
+    bookmark: BookmarkProps;
+    handleBookmarkChange: () => void;
+    setBookmark: Dispatch<import('react').SetStateAction<BookmarkProps>>;
+    handleOnSave: () => void;
+    toggleBookmark: () => void;
+    toggleBookmarkInput: Dispatch<import('react').SetStateAction<boolean>>;
+};
+export {};

package/dist/modules/modals/ShareModal/hooks/useShareBookmark.js

@@ -0,0 +1,67 @@
+import { useRef, useState, useId } from "react";
+import { odeServices } from "@edifice.io/ts-client";
+import { useTranslation } from "react-i18next";
+import { useToggle } from "@uidotdev/usehooks";
+import useToast from "../../../../hooks/useToast/useToast.js";
+const useShareBookmark = ({
+  shareRights,
+  shareDispatch
+}) => {
+  const toast = useToast(), {
+    t
+  } = useTranslation(), refBookmark = useRef(null), [bookmark, setBookmark] = useState({
+    name: "",
+    id: useId()
+  }), [showBookmark, setShowBookmark] = useToggle(!1), [showBookmarkInput, toggleBookmarkInput] = useState(!1), toggleBookmark = () => {
+    setShowBookmark();
+  }, handleBookmarkChange = () => {
+    setBookmark((prev) => {
+      var _a;
+      return {
+        ...prev,
+        name: ((_a = refBookmark.current) == null ? void 0 : _a.value) || ""
+      };
+    });
+  }, saveBookmark = async (name) => {
+    try {
+      const res = await odeServices.directory().saveBookmarks(name, {
+        users: shareRights.rights.filter((right) => right.type === "user").map((u) => u.id),
+        groups: shareRights.rights.filter((right) => right.type === "group").map((u) => u.id),
+        bookmarks: shareRights.rights.filter((right) => right.type === "sharebookmark").map((u) => u.id)
+      });
+      toast.success(t("explorer.bookmarked.status.saved")), shareDispatch({
+        type: "updateShareRights",
+        payload: {
+          ...shareRights,
+          visibleBookmarks: [...shareRights.visibleBookmarks, {
+            displayName: name,
+            id: res.id
+          }]
+        }
+      }), setBookmark((prev) => ({
+        ...prev,
+        bookmarkId: prev.id + (/* @__PURE__ */ new Date()).getTime().toString()
+      })), toggleBookmarkInput(!1);
+    } catch (e) {
+      console.error("Failed to save bookmark", e), toast.error(t("explorer.bookmarked.status.error"));
+    }
+  };
+  return {
+    refBookmark,
+    showBookmark,
+    showBookmarkInput,
+    bookmark,
+    handleBookmarkChange,
+    setBookmark,
+    handleOnSave: () => {
+      var _a;
+      const inputValue = ((_a = refBookmark.current) == null ? void 0 : _a.value) || "";
+      saveBookmark(inputValue);
+    },
+    toggleBookmark,
+    toggleBookmarkInput
+  };
+};
+export {
+  useShareBookmark
+};

package/dist/modules/modals/ShareModal/hooks/useShareMutation.d.ts

@@ -0,0 +1,13 @@
+import { PutShareResponse, ShareRight } from '@edifice.io/ts-client';
+import { UseMutationOptions, UseMutationResult } from '../../../../../node_modules/@tanstack/react-query';
+declare const useShareMutation: ({ application, options, }: {
+    application: string;
+    options?: UseMutationOptions<PutShareResponse, Error, {
+        resourceId: string;
+        rights: ShareRight[];
+    }>;
+}) => UseMutationResult<PutShareResponse, Error, {
+    resourceId: string;
+    rights: ShareRight[];
+}>;
+export default useShareMutation;

package/dist/modules/modals/ShareModal/hooks/useShareMutation.js

@@ -0,0 +1,15 @@
+import { odeServices } from "@edifice.io/ts-client";
+import { useMutation } from "@tanstack/react-query";
+const useShareMutation = ({
+  application,
+  options
+}) => useMutation({
+  mutationFn: async ({
+    resourceId,
+    rights
+  }) => await odeServices.share().saveRights(application, resourceId, rights),
+  ...options
+});
+export {
+  useShareMutation as default
+};

package/dist/modules/modals/ShareModal/utils/hasRight.d.ts

@@ -0,0 +1,2 @@
+import { ShareRight, ShareRightAction } from '@edifice.io/ts-client';
+export declare const hasRight: (shareRight: ShareRight, shareAction: ShareRightAction) => boolean;

package/dist/modules/modals/ShareModal/utils/showShareRightLine.d.ts

@@ -0,0 +1,2 @@
+import { ShareRight } from '@edifice.io/ts-client';
+export declare const showShareRightLine: (shareRight: ShareRight, showBookmarkMembers: boolean) => boolean;

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

@@ -0,0 +1,12 @@
+import { WorkspaceElement, WorkspaceVisibility } from '@edifice.io/ts-client';
+export interface AudioRecorderProps {
+    onSaveSuccess?: (resource: WorkspaceElement) => void;
+    onRecordUpdated?: (recordURL?: string) => void;
+    hideSaveAction?: boolean;
+    visibility?: WorkspaceVisibility;
+}
+export interface AudioRecorderRef {
+    save: () => Promise<WorkspaceElement | undefined>;
+}
+declare const AudioRecorder: import('react').ForwardRefExoticComponent<AudioRecorderProps & import('react').RefAttributes<unknown>>;
+export default AudioRecorder;

package/dist/modules/multimedia/AudioRecorder/AudioRecorder.js

@@ -0,0 +1,49 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { forwardRef, useImperativeHandle, useState } from "react";
+import clsx from "clsx";
+import { useTranslation } from "react-i18next";
+import SvgIconMic from "../../icons/components/IconMic.js";
+import AudioRecorderTimer from "./AudioRecorderTimer.js";
+import useAudioRecorder from "./useAudioRecorder.js";
+import FormControl from "../../../components/Form/FormControl.js";
+import Input from "../../../components/Input/Input.js";
+import { Toolbar } from "../../../components/Toolbar/Toolbar.js";
+const AudioRecorder = /* @__PURE__ */ forwardRef(({
+  onSaveSuccess,
+  onRecordUpdated,
+  hideSaveAction = !1,
+  visibility = "protected"
+}, ref) => {
+  const {
+    recordState,
+    playState,
+    recordTime,
+    audioRef,
+    audioNameRef,
+    toolbarItems,
+    maxDuration,
+    handlePlayEnded,
+    handleSave
+  } = useAudioRecorder(onSaveSuccess, onRecordUpdated, hideSaveAction, visibility, "media-library"), {
+    t
+  } = useTranslation();
+  useImperativeHandle(ref, () => ({
+    save: handleSave
+  }));
+  const [audioTime, setAudioTime] = useState(0), classColor = clsx({
+    "text-danger": recordState === "RECORDING",
+    "text-success": playState === "PLAYING"
+  }), handleTimeUpdate = (event) => {
+    setAudioTime(event.target.currentTime);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "audio-recorder m-auto d-flex flex-column", children: [
+    /* @__PURE__ */ jsx(FormControl, { id: "recordName", className: "mb-32", isRequired: !0, isReadOnly: recordState === "SAVED" || recordState === "SAVING", children: /* @__PURE__ */ jsx(Input, { type: "text", size: "sm", placeholder: t("bbm.audio.recorder.name"), ref: audioNameRef, defaultValue: t("bbm.audio.recorder.defaultName") + (/* @__PURE__ */ new Date()).toLocaleDateString() }) }),
+    /* @__PURE__ */ jsx("div", { className: "audio-recorder-icon mx-auto", children: /* @__PURE__ */ jsx(SvgIconMic, { width: 64, height: 64, className: classColor }) }),
+    /* @__PURE__ */ jsx(AudioRecorderTimer, { recordState, playState, recordTime, audioTime, maxDuration }),
+    /* @__PURE__ */ jsx("audio", { ref: audioRef, onEnded: handlePlayEnded, onTimeUpdate: handleTimeUpdate, children: /* @__PURE__ */ jsx("track", { default: !0, kind: "captions", srcLang: "fr", src: "" }) }),
+    /* @__PURE__ */ jsx(Toolbar, { items: toolbarItems })
+  ] });
+});
+export {
+  AudioRecorder as default
+};

package/dist/modules/multimedia/AudioRecorder/AudioRecorderTimer.js

@@ -0,0 +1,26 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { convertMsToMS } from "@edifice.io/utilities";
+import SvgIconMic from "../../icons/components/IconMic.js";
+import SvgIconPause from "../../icons/components/IconPause.js";
+import SvgIconRecord from "../../icons/components/IconRecord.js";
+const AudioRecorderTimer = ({
+  recordState,
+  playState,
+  recordTime,
+  audioTime,
+  maxDuration
+}) => /* @__PURE__ */ jsxs("div", { className: "audio-recorder-time my-16 mx-auto", children: [
+  playState === "IDLE" && /* @__PURE__ */ jsxs("div", { className: "d-flex align-items-center", children: [
+    recordState === "PAUSED" ? /* @__PURE__ */ jsx(SvgIconPause, { width: 12, height: 12, className: "me-8 text-danger" }) : /* @__PURE__ */ jsx(SvgIconRecord, { width: 12, height: 12, className: "me-8 text-danger" }),
+    convertMsToMS(recordState !== "IDLE" ? recordTime : 0) + " / " + convertMsToMS(maxDuration)
+  ] }),
+  playState !== "IDLE" && /* @__PURE__ */ jsxs("div", { className: "d-flex align-items-center mx-auto", children: [
+    /* @__PURE__ */ jsx(SvgIconMic, { width: 12, height: 12, className: "me-8" }),
+    convertMsToMS(audioTime * 1e3),
+    " /",
+    convertMsToMS(recordTime)
+  ] })
+] });
+export {
+  AudioRecorderTimer as default
+};

package/dist/modules/multimedia/AudioRecorder/useAudioRecorder.d.ts

@@ -0,0 +1,16 @@
+import { WorkspaceElement, WorkspaceVisibility } from '@edifice.io/ts-client';
+import { ToolbarItem } from '../../../components';
+export type RecordState = "IDLE" | "RECORDING" | "PAUSED" | "RECORDED" | "SAVING" | "SAVED";
+export type PlayState = "IDLE" | "PLAYING" | "PAUSED";
+export default function useAudioRecorder(onSaveSuccess?: (resource: WorkspaceElement) => void, onUpdateRecord?: (audioUrl?: string) => void, hideSaveAction?: boolean, visibility?: WorkspaceVisibility, application?: string): {
+    recordState: RecordState;
+    playState: PlayState;
+    audioContext: AudioContext | undefined;
+    recordTime: number;
+    maxDuration: number;
+    audioRef: import('react').RefObject<HTMLAudioElement>;
+    audioNameRef: import('react').RefObject<HTMLInputElement>;
+    toolbarItems: ToolbarItem[];
+    handlePlayEnded: () => void;
+    handleSave: () => Promise<WorkspaceElement | undefined>;
+};