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

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

@@ -0,0 +1 @@
+{"version":3,"file":"InternalLinker.js","sources":["../../../../src/modules/multimedia/Linker/InternalLinker.tsx"],"sourcesContent":["import { FormEvent, useCallback, useEffect, useState } from 'react';\n\nimport { App, odeServices } from '@edifice.io/ts-client';\n/*\n * Augmented definition of a resource, until behaviours are dropped.\n * The path would otherwise be found by using `IWebResourceService.getViewUrl(resource)`\n */\nimport { ILinkedResource } from '@edifice.io/ts-client';\nimport { useTranslation } from 'react-i18next';\n\nimport { AppIcon, Dropdown, EmptyScreen, Icon } from '../../../components';\nimport { SearchBar } from '../../../components/SearchBar';\nimport { useOdeTheme, usePaths, useResourceSearch } from '../../../core';\nimport { useDebounce } from '../../../hooks';\nimport LinkerCard from '../LinkerCard/LinkerCard';\n\n/**\n * Definition of an internal link.\n */\ntype ApplicationOption = {\n  icon?: JSX.Element;\n  application: string;\n  displayName: string;\n};\n\n/**\n * Properties for the InternalLinker react component.\n */\nexport interface InternalLinkerProps {\n  /** Currently running application */\n  appCode: App;\n  /** When defined, preloads and displays this type of resources. */\n  defaultAppCode?: App | null;\n  /** When defined, selects this resource (defaultApp must be specified) */\n  defaultResourceId?: string | null;\n  /** Notify when the user selects an application in the dropdown */\n  onChange?: (application?: ApplicationOption) => void;\n  /** Notify when resources selection changes */\n  onSelect?: (resources: ILinkedResource[]) => void;\n  multiple: boolean | undefined;\n}\n\n/** The InternalLinker component */\nconst InternalLinker = ({\n  appCode,\n  defaultAppCode,\n  defaultResourceId,\n  onChange,\n  onSelect,\n  multiple = true,\n}: InternalLinkerProps) => {\n  const { t } = useTranslation();\n  const { theme } = useOdeTheme();\n  const [imagePath] = usePaths();\n\n  // Get available applications, and a function to load their resources.\n  const { resourceApplications, loadResources } = useResourceSearch(appCode);\n\n  // List of options (applications with name and icon) to display, for the user to choose.\n  const [options, setOptions] = useState<Array<ApplicationOption>>();\n  // User selected application\n  const [selectedApplication, setSelectedApplication] = useState<\n    ApplicationOption | undefined\n  >();\n  // User search terms (typed in an input) and its debounced equivalent.\n  const [searchTerms, setSearchTerms] = useState<string | undefined>();\n  const debounceSearch = useDebounce<string>(searchTerms || '', 500);\n\n  // List of resources to display.\n  const [resources, setResources] = useState<ILinkedResource[] | undefined>([]);\n  // Function to load and display resources of the currently selected application.\n  const loadAndDisplayResources = useCallback(\n    (search?: string) => {\n      async function load() {\n        if (selectedApplication) {\n          try {\n            const searchLower = search?.toLowerCase();\n            const resources = (\n              await loadResources({\n                application: selectedApplication.application,\n                search,\n                types: [selectedApplication.application],\n                filters: {},\n                pagination: { startIdx: 0, pageSize: 300 }, // ignored at the moment\n              })\n            )\n              .filter((resource) => {\n                // Filter in lowercase only\n                if (!searchLower || searchLower.length === 0) return true;\n                const found =\n                  resource.name?.toLowerCase().includes(searchLower) ||\n                  resource.creatorName?.toLowerCase().includes(searchLower) ||\n                  resource.description?.toLowerCase().includes(searchLower) ||\n                  false;\n                return found;\n              })\n              .sort((a, b) => (a.modifiedAt < b.modifiedAt ? 1 : -1));\n\n            setResources(resources);\n            return; // end here\n          } catch {\n            // continue on error\n          }\n        }\n        setResources([]);\n      }\n      load();\n    },\n    [loadResources, selectedApplication],\n  );\n\n  // List of selected documents\n  const [selectedDocuments, setSelectedDocuments] = useState<ILinkedResource[]>(\n    [],\n  );\n\n  // Notify parent when an application is selected.\n  const handleOptionClick = (option: ApplicationOption) => {\n    onChange?.(option);\n    setSelectedApplication(option);\n  };\n\n  // Handle search input events (and debounce)\n  const handleSearchChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const newText = event.target.value;\n    setSearchTerms(newText.toString());\n  };\n  const handleSubmit = useCallback(\n    (event: FormEvent) => {\n      loadAndDisplayResources(searchTerms);\n      event.stopPropagation();\n      event.preventDefault();\n    },\n    [loadAndDisplayResources, searchTerms],\n  );\n\n  /**\n   * Check if a resource is selected.\n   * @returns its index in selectedDocuments, or -1 if not selected.\n   */\n  const getSelectedResourceIndex = useCallback(\n    (resourceId: string) => {\n      return selectedDocuments.findIndex(\n        (selectedDocument) => selectedDocument.assetId === resourceId,\n      );\n    },\n    [selectedDocuments],\n  );\n\n  // Select a resource.\n  const selectResource = useCallback(\n    (resource: ILinkedResource) => {\n      if (multiple) {\n        // Add this resource to the previous selected ones.\n        setSelectedDocuments((previousState) => [...previousState, resource]);\n      } else {\n        // Replace previous selection by this resource.\n        setSelectedDocuments([resource]);\n      }\n    },\n    [setSelectedDocuments, multiple],\n  );\n\n  // Handle [de-]selection of a resource by the user.\n  const toggleResourceSelection = useCallback(\n    (resource: ILinkedResource) => {\n      const index = getSelectedResourceIndex(resource.assetId);\n      if (index < 0) {\n        selectResource(resource);\n      } else {\n        // De-select resource (clicked twice)\n        setSelectedDocuments(\n          selectedDocuments.filter((_value, i) => i !== index),\n        );\n      }\n    },\n    [getSelectedResourceIndex, selectResource, selectedDocuments],\n  );\n\n  // Update dropdown when available applications list is updated.\n  useEffect(() => {\n    (async () => {\n      const appPromises = resourceApplications.map((application) =>\n        odeServices.session().getWebApp(application),\n      );\n      const webApps = await Promise.all(appPromises);\n      setOptions(\n        resourceApplications\n          .map((application, index) => {\n            return {\n              application,\n              displayName: t(webApps[index]?.displayName ?? application),\n              icon: <AppIcon app={webApps[index]}></AppIcon>,\n            } as ApplicationOption;\n          })\n          .sort((app1, app2) =>\n            app1.displayName.localeCompare(app2.displayName),\n          ),\n      );\n    })();\n  }, [resourceApplications, t]);\n\n  // Load and display search results when debounce is over\n  useEffect(() => {\n    loadAndDisplayResources(debounceSearch);\n  }, [loadAndDisplayResources, debounceSearch]);\n\n  // Notify parent when resources selection changes.\n  useEffect(() => {\n    onSelect?.(selectedDocuments);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [selectedDocuments]);\n\n  // Preselect default option and load associated resources, if specified.\n  useEffect(() => {\n    if (defaultAppCode) {\n      const option = options?.find(\n        (option) => defaultAppCode === option.application,\n      );\n      setSelectedApplication(option);\n      loadAndDisplayResources('');\n    }\n    /* Note : when options changes, `defaultAppCode` and `loadAndDisplayResources` are\n     * already set at a correct value. So we remove them from the dependency array,\n     * otherwise they will provoke side effects forbiding user from changing the selected app.\n     */\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [options]);\n\n  // Preselect default resource, if specified.\n  useEffect(() => {\n    if (defaultResourceId && getSelectedResourceIndex(defaultResourceId) < 0) {\n      const resource = resources?.find(\n        (resource) => defaultResourceId === resource.assetId,\n      );\n      resource && selectResource(resource);\n    }\n    /* Note : when resources changes, `defaultResourceId`, `getSelectedResourceIndex`\n     * and `selectResource` are already set at a correct value.\n     * So we remove them from the dependency array, otherwise they will provoke side effects\n     * forbiding user from changing the selected resources.\n     */\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [resources]);\n\n  return (\n    <div className=\"d-flex flex-column flex-fill overflow-hidden\">\n      <div className=\"search d-flex bg-light rounded-top border border-bottom-0\">\n        <div className=\"flex-shrink-1 px-8 py-12 border-end\">\n          <Dropdown overflow>\n            <Dropdown.Trigger\n              icon={\n                <div className=\"pe-8\">\n                  {selectedApplication?.icon || <Icon name=\"applications\" />}\n                </div>\n              }\n              label={t(\n                selectedApplication?.displayName || 'bbm.linker.int.choose',\n              )}\n              variant=\"ghost\"\n              size=\"md\"\n            />\n            <Dropdown.Menu>\n              {options?.map((option) => (\n                <Dropdown.Item\n                  key={option.application}\n                  icon={option.icon}\n                  onClick={() => handleOptionClick(option)}\n                >\n                  {option.displayName}\n                </Dropdown.Item>\n              ))}\n            </Dropdown.Menu>\n          </Dropdown>\n        </div>\n        <div className=\"flex-grow-1 align-self-center\">\n          <form\n            className=\"gap-16 d-flex w-100 align-items-center px-16 py-8\"\n            onSubmit={handleSubmit}\n          >\n            <SearchBar\n              isVariant\n              placeholder={t('search')}\n              size=\"lg\"\n              className=\"w-100\"\n              disabled={selectedApplication ? false : true}\n              onChange={handleSearchChange}\n            />\n          </form>\n        </div>\n      </div>\n\n      <div className=\"internal-linker flex-grow-1 w-100 rounded-bottom border gap-0 overflow-auto\">\n        {selectedApplication && resources && resources.length > 0 && (\n          <div>\n            {resources.map((resource) => {\n              const isSelected =\n                selectedDocuments.findIndex(\n                  (doc) => doc.assetId === resource.assetId,\n                ) >= 0;\n              return (\n                <LinkerCard\n                  key={resource.path}\n                  doc={resource}\n                  isSelected={isSelected}\n                  onClick={() => toggleResourceSelection(resource)}\n                />\n              );\n            })}\n          </div>\n        )}\n\n        {selectedApplication && resources && resources.length <= 0 && (\n          <div className=\"d-flex justify-content-center mt-16\">\n            <EmptyScreen\n              imageSrc={`${imagePath}/${theme?.bootstrapVersion}/illu-empty-search-${selectedApplication.application}.svg`}\n              text={t('bbm.linker.int.notfound')}\n              className=\"mt-16\"\n            />\n          </div>\n        )}\n\n        {!selectedApplication && (\n          <div className=\"d-flex justify-content-center mt-32\">\n            <EmptyScreen\n              imageSrc={`${imagePath}/${theme?.bootstrapVersion}/illu-empty-search.svg`}\n              text={t('bbm.linker.int.empty')}\n              className=\"mt-32\"\n            />\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport default InternalLinker;\n"],"names":["InternalLinker","appCode","defaultAppCode","defaultResourceId","onChange","onSelect","multiple","t","useTranslation","theme","useOdeTheme","imagePath","usePaths","resourceApplications","loadResources","useResourceSearch","options","setOptions","useState","selectedApplication","setSelectedApplication","searchTerms","setSearchTerms","debounceSearch","useDebounce","resources","setResources","loadAndDisplayResources","useCallback","search","load","searchLower","toLowerCase","application","types","filters","pagination","startIdx","pageSize","filter","resource","length","name","includes","creatorName","description","sort","a","b","modifiedAt","selectedDocuments","setSelectedDocuments","handleOptionClick","option","handleSearchChange","event","newText","target","value","toString","handleSubmit","stopPropagation","preventDefault","getSelectedResourceIndex","resourceId","findIndex","selectedDocument","assetId","selectResource","previousState","toggleResourceSelection","index","_value","i","useEffect","appPromises","map","odeServices","session","getWebApp","webApps","Promise","all","displayName","icon","jsx","AppIcon","app1","app2","localeCompare","find","jsxs","Dropdown","Icon","SearchBar","isSelected","doc","LinkerCard","path","EmptyScreen","bootstrapVersion"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-import { IResource } from 'edifice-ts-client';
+import { IResource } from '@edifice.io/ts-client';
 import { CardProps } from '../../../components';
 export interface LinkerCardProps extends CardProps {
     /**

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

@@ -1,39 +1,40 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useMemo } from "react";
-import clsx from "clsx";
-import useDate from "../../../core/useDate/useDate.js";
-import { Card } from "../../../components/Card/Card.js";
-import { Image } from "../../../components/Image/Image.js";
-import { AppIcon } from "../../../components/AppIcon/AppIcon.js";
-import { Icon } from "../../../components/Icon/Icon.js";
-const LinkerCard = ({
-  doc,
-  isClickable = !0,
-  isSelectable = !1,
-  isSelected = !1,
-  onClick,
-  className
+import { jsx as a, jsxs as i } from "react/jsx-runtime";
+import { useMemo as p } from "react";
+import d from "clsx";
+import h from "../../../core/useDate/useDate.js";
+import { Card as r } from "../../../components/Card/Card.js";
+import { Image as f } from "../../../components/Image/Image.js";
+import { AppIcon as u } from "../../../components/AppIcon/AppIcon.js";
+import { Icon as x } from "../../../components/Icon/Icon.js";
+const I = ({
+  doc: e,
+  isClickable: s = !0,
+  isSelectable: m = !1,
+  isSelected: l = !1,
+  onClick: n,
+  className: o
 }) => {
   const {
-    fromNow
-  } = useDate(), {
-    fromDate
-  } = useMemo(() => ({
-    fromDate: fromNow(doc.modifiedAt)
-  }), [fromNow, doc]);
-  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: {
+    fromNow: t
+  } = h(), {
+    fromDate: c
+  } = p(() => ({
+    fromDate: t(e.modifiedAt)
+  }), [t, e]);
+  return /* @__PURE__ */ a(r, { className: d("card-linker shadow-none", o), isClickable: s, isSelectable: m, isSelected: l, onClick: n, children: /* @__PURE__ */ i(r.Body, { space: "8", children: [
+    /* @__PURE__ */ a("div", { className: "card-image ps-8 pe-4", children: e.thumbnail && e.thumbnail.length > 0 ? /* @__PURE__ */ a(f, { alt: "", height: 48, width: 48, src: e.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__ */ a(u, { app: e.application, iconFit: "ratio", size: "48", variant: "rounded" }) }),
+    /* @__PURE__ */ i("div", { className: "w-75", children: [
+      /* @__PURE__ */ a(r.Text, { children: e.name }),
+      /* @__PURE__ */ a(r.Text, { className: "text-black-50", children: e == null ? void 0 : e.creatorName })
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "d-none d-md-block text-black-50 ps-4 pe-8", children: /* @__PURE__ */ jsx(Card.Text, { children: fromDate }) }),
-    doc.shared && /* @__PURE__ */ jsx("div", { className: "ps-4 pe-8", children: /* @__PURE__ */ jsx(Icon, { name: "users", size: "20" }) })
+    /* @__PURE__ */ a("div", { className: "d-none d-md-block text-black-50 ps-4 pe-8", children: /* @__PURE__ */ a(r.Text, { children: c }) }),
+    e.shared && /* @__PURE__ */ a("div", { className: "ps-4 pe-8", children: /* @__PURE__ */ a(x, { name: "users", size: "20" }) })
   ] }) });
 };
 export {
-  LinkerCard,
-  LinkerCard as default
+  I as LinkerCard,
+  I as default
 };
+//# sourceMappingURL=LinkerCard.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LinkerCard.js","sources":["../../../../src/modules/multimedia/LinkerCard/LinkerCard.tsx"],"sourcesContent":["import { useMemo } from 'react';\n\nimport { IResource } from '@edifice.io/ts-client';\nimport clsx from 'clsx';\n\nimport { AppIcon, Card, CardProps, Icon, Image } from '../../../components';\nimport { useDate } from '../../../core/useDate';\n\nexport interface LinkerCardProps extends CardProps {\n  /**\n   * Resource to render as a card\n   * */\n  doc: IResource;\n}\n\nexport const LinkerCard = ({\n  doc,\n  isClickable = true,\n  isSelectable = false,\n  isSelected = false,\n  onClick,\n  className,\n}: LinkerCardProps) => {\n  const { fromNow } = useDate();\n\n  const { fromDate } = useMemo(\n    () => ({\n      fromDate: fromNow(doc.modifiedAt),\n    }),\n    [fromNow, doc],\n  );\n\n  return (\n    <Card\n      className={clsx('card-linker shadow-none', className)}\n      isClickable={isClickable}\n      isSelectable={isSelectable}\n      isSelected={isSelected}\n      onClick={onClick}\n    >\n      <Card.Body space=\"8\">\n        <div className=\"card-image ps-8 pe-4\">\n          {doc.thumbnail && doc.thumbnail.length > 0 ? (\n            <Image\n              alt=\"\"\n              height={48}\n              width={48}\n              src={doc.thumbnail}\n              objectFit=\"cover\"\n              className=\"rounded h-full\"\n              style={{ aspectRatio: 1 / 1 }}\n            />\n          ) : (\n            <AppIcon\n              app={doc.application}\n              iconFit=\"ratio\"\n              size=\"48\"\n              variant=\"rounded\"\n            />\n          )}\n        </div>\n\n        <div className=\"w-75\">\n          <Card.Text>{doc.name}</Card.Text>\n          <Card.Text className=\"text-black-50\">{doc?.creatorName}</Card.Text>\n        </div>\n\n        <div className=\"d-none d-md-block text-black-50 ps-4 pe-8\">\n          <Card.Text>{fromDate}</Card.Text>\n        </div>\n\n        {doc.shared && (\n          <div className=\"ps-4 pe-8\">\n            <Icon name=\"users\" size=\"20\" />\n          </div>\n        )}\n      </Card.Body>\n    </Card>\n  );\n};\n\nLinkerCard.displayName = 'LinkerCard';\n\nexport default LinkerCard;\n"],"names":["LinkerCard","doc","isClickable","isSelectable","isSelected","onClick","className","fromNow","useDate","fromDate","useMemo","modifiedAt","Card","clsx","jsxs","jsx","thumbnail","length","Image","aspectRatio","AppIcon","application","name","creatorName","shared","Icon"],"mappings":";;;;;;;;AAeO,MAAMA,IAAaA,CAAC;AAAA,EACzBC,KAAAA;AAAAA,EACAC,aAAAA,IAAc;AAAA,EACdC,cAAAA,IAAe;AAAA,EACfC,YAAAA,IAAa;AAAA,EACbC,SAAAA;AAAAA,EACAC,WAAAA;AACe,MAAM;AACf,QAAA;AAAA,IAAEC,SAAAA;AAAAA,MAAYC,EAAQ,GAEtB;AAAA,IAAEC,UAAAA;AAAAA,EAAS,IAAIC,EACnB,OAAO;AAAA,IACLD,UAAUF,EAAQN,EAAIU,UAAU;AAAA,EAElC,IAAA,CAACJ,GAASN,CAAG,CACf;AAEA,2BACGW,GACC,EAAA,WAAWC,EAAK,2BAA2BP,CAAS,GACpD,aAAAJ,GACA,cAAAC,GACA,YAAAC,GACA,SAAAC,GAEA,UAAC,gBAAAS,EAAAF,EAAK,MAAL,EAAU,OAAM,KACf,UAAA;AAAA,IAAC,gBAAAG,EAAA,OAAA,EAAI,WAAU,wBACZd,UAAIe,EAAAA,aAAaf,EAAIe,UAAUC,SAAS,IACvC,gBAAAF,EAACG,GACC,EAAA,KAAI,IACJ,QAAQ,IACR,OAAO,IACP,KAAKjB,EAAIe,WACT,WAAU,SACV,WAAU,kBACV,OAAO;AAAA,MAAEG,aAAa,IAAI;AAAA,IAAA,EAC1B,CAAA,IAED,gBAAAJ,EAAAK,GAAA,EACC,KAAKnB,EAAIoB,aACT,SAAQ,SACR,MAAK,MACL,SAAQ,WAEX,EACH,CAAA;AAAA,IAEA,gBAAAP,EAAC,OAAI,EAAA,WAAU,QACb,UAAA;AAAA,MAAA,gBAAAC,EAACH,EAAK,MAAL,EAAWX,UAAAA,EAAIqB,MAAK;AAAA,wBACpBV,EAAK,MAAL,EAAU,WAAU,iBAAiBX,iCAAKsB,aAAY;AAAA,IAAA,GACzD;AAAA,IAEA,gBAAAR,EAAC,SAAI,WAAU,6CACb,4BAACH,EAAK,MAAL,EAAWH,UAAAA,EAAAA,CAAS,EACvB,CAAA;AAAA,IAECR,EAAIuB,UACF,gBAAAT,EAAA,OAAA,EAAI,WAAU,aACb,UAAC,gBAAAA,EAAAU,GAAA,EAAK,MAAK,SAAQ,MAAK,KAAI,CAAA,GAC9B;AAAA,EAAA,EAEJ,CAAA,EACF,CAAA;AAEJ;"}

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

@@ -1,4 +1,4 @@
-import { WorkspaceElement, WorkspaceVisibility } from 'edifice-ts-client';
+import { WorkspaceElement, WorkspaceVisibility } from '@edifice.io/ts-client';
 import { TabsItemProps } from '../../../components/Tabs/TabsItem';
 import { ExternalLinkTabProps } from './innertabs/ExternalLink';
 import { InternalLinkTabProps, InternalLinkTabResult } from './innertabs/InternalLink';

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

@@ -1,16 +1,16 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { forwardRef, useRef, useImperativeHandle, useState, useMemo, useEffect, useCallback } from "react";
-import { odeServices } from "edifice-ts-client";
-import { useTranslation } from "react-i18next";
-import { Modal } from "../../../components/Modal/Modal.js";
-import { MediaLibraryContext } from "./MediaLibraryContext.js";
-import { InnerTabs } from "./innertabs/index.js";
-import { useHttpErrorToast } from "../../../core/useHttpErrorToast/useHttpErrorToast.js";
-import useHasWorkflow from "../../../core/useHasWorkflow/useHasWorkflow.js";
-import { Tabs } from "../../../components/Tabs/Tabs.js";
-import { Icon } from "../../../components/Icon/Icon.js";
-import { Button } from "../../../components/Button/Button.js";
-const orderedTabs = [
+import { jsx as a, jsxs as E, Fragment as $ } from "react/jsx-runtime";
+import { forwardRef as ee, useRef as P, useImperativeHandle as ae, useState as c, useMemo as W, useEffect as oe, useCallback as ne } from "react";
+import { odeServices as te } from "@edifice.io/ts-client";
+import { useTranslation as le } from "react-i18next";
+import { Modal as v } from "../../../components/Modal/Modal.js";
+import { MediaLibraryContext as ie } from "./MediaLibraryContext.js";
+import { InnerTabs as l } from "./innertabs/index.js";
+import { useHttpErrorToast as re } from "../../../core/useHttpErrorToast/useHttpErrorToast.js";
+import R from "../../../core/useHasWorkflow/useHasWorkflow.js";
+import { Tabs as g } from "../../../components/Tabs/Tabs.js";
+import { Icon as i } from "../../../components/Icon/Icon.js";
+import { Button as V } from "../../../components/Button/Button.js";
+const de = [
   "audio-capture",
   "video-capture",
   "internal-link",
@@ -25,7 +25,7 @@ const orderedTabs = [
   // Media browser
   "video-embedder"
   // Link to a hosted video
-], mediaLibraryTypes = {
+], C = {
   none: null,
   audio: {
     title: "bbm.audio.modal.title",
@@ -51,161 +51,162 @@ const orderedTabs = [
     title: "bbm.embed.modal.title",
     defaultTab: "iframe"
   }
-}, MediaLibrary = /* @__PURE__ */ forwardRef(({
-  appCode,
-  visibility,
-  multiple,
-  onSuccess,
-  onCancel,
-  onTabChange
-}, ref) => {
-  var _a;
-  const linkTabProps = useRef(), refModal = useRef(null);
-  useImperativeHandle(ref, () => ({
-    show,
-    hide,
-    showLink,
-    type,
-    ...refModal.current
-  })), useHttpErrorToast({
+}, xe = /* @__PURE__ */ ee(({
+  appCode: k,
+  visibility: m,
+  multiple: A,
+  onSuccess: F,
+  onCancel: j,
+  onTabChange: h
+}, B) => {
+  var O;
+  const s = P(), N = P(null);
+  ae(B, () => ({
+    show: J,
+    hide: Q,
+    showLink: X,
+    type: t,
+    ...N.current
+  })), re({
     isDismissible: !0,
     duration: 1 / 0
   });
   const {
-    t
-  } = useTranslation(), workspaceCreateWorkflow = useHasWorkflow("org.entcore.workspace.controllers.WorkspaceController|addDocument"), videoCaptureWorkflow = useHasWorkflow("com.opendigitaleducation.video.controllers.VideoController|capture"), [type, setType] = useState(null), availableTabs = {
+    t: n
+  } = le(), I = R("org.entcore.workspace.controllers.WorkspaceController|addDocument"), z = R("com.opendigitaleducation.video.controllers.VideoController|capture"), [t, b] = c(null), K = {
     workspace: {
       id: "workspace",
-      icon: /* @__PURE__ */ jsx(Icon, { name: "folder" }),
-      label: t("bbm.workspace"),
-      content: /* @__PURE__ */ jsx(InnerTabs.Workspace, {}),
+      icon: /* @__PURE__ */ a(i, { name: "folder" }),
+      label: n("bbm.workspace"),
+      content: /* @__PURE__ */ a(l.Workspace, {}),
       availableFor: ["audio", "video", "image", "attachment"],
       isEnable: null
     },
     upload: {
       id: "upload",
-      icon: /* @__PURE__ */ jsx(Icon, { name: "smartphone" }),
-      label: t("bbm.device"),
-      content: /* @__PURE__ */ jsx(InnerTabs.Upload, {}),
+      icon: /* @__PURE__ */ a(i, { name: "smartphone" }),
+      label: n("bbm.device"),
+      content: /* @__PURE__ */ a(l.Upload, {}),
       availableFor: ["audio", "video", "image", "attachment"],
-      isEnable: () => !!workspaceCreateWorkflow
+      isEnable: () => !!I
     },
     "video-capture": {
       id: "video-capture",
-      icon: /* @__PURE__ */ jsx(Icon, { name: "record-video" }),
-      label: t("bbm.video"),
-      content: /* @__PURE__ */ jsx(InnerTabs.Video, {}),
+      icon: /* @__PURE__ */ a(i, { name: "record-video" }),
+      label: n("bbm.video"),
+      content: /* @__PURE__ */ a(l.Video, {}),
       availableFor: ["video"],
-      isEnable: () => !!videoCaptureWorkflow
+      isEnable: () => !!z
     },
     "audio-capture": {
       id: "audio-capture",
-      icon: /* @__PURE__ */ jsx(Icon, { name: "mic" }),
-      label: t("bbm.audio"),
-      content: /* @__PURE__ */ jsx(InnerTabs.Audio, {}),
+      icon: /* @__PURE__ */ a(i, { name: "mic" }),
+      label: n("bbm.audio"),
+      content: /* @__PURE__ */ a(l.Audio, {}),
       availableFor: ["audio"],
-      isEnable: () => !!workspaceCreateWorkflow
+      isEnable: () => !!I
     },
     "external-link": {
       id: "external-link",
-      icon: /* @__PURE__ */ jsx(Icon, { name: "globe" }),
-      label: t("bbm.linker.ext"),
-      content: /* @__PURE__ */ jsx(InnerTabs.ExternalLink, { ...linkTabProps.current }),
+      icon: /* @__PURE__ */ a(i, { name: "globe" }),
+      label: n("bbm.linker.ext"),
+      content: /* @__PURE__ */ a(l.ExternalLink, { ...s.current }),
       availableFor: ["hyperlink"],
       isEnable: null
     },
     "internal-link": {
       id: "internal-link",
-      icon: /* @__PURE__ */ jsx(Icon, { name: "applications" }),
-      label: t("bbm.linker.int"),
-      content: /* @__PURE__ */ jsx(InnerTabs.InternalLink, { ...linkTabProps.current }),
+      icon: /* @__PURE__ */ a(i, { name: "applications" }),
+      label: n("bbm.linker.int"),
+      content: /* @__PURE__ */ a(l.InternalLink, { ...s.current }),
       availableFor: ["hyperlink"],
       isEnable: null
     },
     iframe: {
       id: "iframe",
-      icon: /* @__PURE__ */ jsx(Icon, { name: "code" }),
-      label: t("bbm.embed"),
-      content: /* @__PURE__ */ jsx(InnerTabs.Iframe, {}),
+      icon: /* @__PURE__ */ a(i, { name: "code" }),
+      label: n("bbm.embed"),
+      content: /* @__PURE__ */ a(l.Iframe, {}),
       availableFor: ["embedder"],
       isEnable: null
     },
     "video-embedder": {
       id: "iframe",
-      icon: /* @__PURE__ */ jsx(Icon, { name: "code" }),
-      label: t("bbm.embed"),
-      content: /* @__PURE__ */ jsx(InnerTabs.VideoEmbedder, {}),
+      icon: /* @__PURE__ */ a(i, { name: "code" }),
+      label: n("bbm.embed"),
+      content: /* @__PURE__ */ a(l.VideoEmbedder, {}),
       availableFor: ["video"],
       isEnable: null
     }
-  }, tabs = useMemo(
-    () => orderedTabs.map((key) => availableTabs[key]).filter((tab) => {
-      var _a2;
-      return ((_a2 = tab.isEnable) == null ? void 0 : _a2.call(tab)) !== !1 && (tab.availableFor.length === 0 || tab.availableFor.includes(type));
+  }, r = W(
+    () => de.map((e) => K[e]).filter((e) => {
+      var o;
+      return ((o = e.isEnable) == null ? void 0 : o.call(e)) !== !1 && (e.availableFor.length === 0 || e.availableFor.includes(t));
     }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [type]
-  ), [defaultTabId, setDefaultTabId] = useState(), defaultTabIdx = useMemo(() => {
-    const index = tabs.findIndex((t2) => t2.id === defaultTabId);
-    return 0 > index || index >= tabs.length ? 0 : index;
-  }, [tabs, defaultTabId]), [resultCounter, setResultCounter] = useState(), [result, setResult] = useState(), [deletionsOnCancel, setDeletionsOnCancel] = useState([]), [onSuccessAction, setPreSuccess] = useState();
-  function setVisibleTab(tab) {
-    throw tabs.findIndex((t2) => t2.id === tab) < 0 ? new Error("tab.not.visible") : new Error("not.implemented.yet");
+    [t]
+  ), [u, f] = c(), U = W(() => {
+    const e = r.findIndex((o) => o.id === u);
+    return 0 > e || e >= r.length ? 0 : e;
+  }, [r, u]), [y, M] = c(), [p, L] = c(), [S, D] = c([]), [w, H] = c();
+  function q(e) {
+    throw r.findIndex((d) => d.id === e) < 0 ? new Error("tab.not.visible") : new Error("not.implemented.yet");
   }
-  function switchType(type2) {
-    linkTabProps.current = void 0, setDefaultTabId(void 0), setType(type2);
+  function G(e) {
+    s.current = void 0, f(void 0), b(e);
   }
-  const show = (type2) => {
-    setType(type2);
-  }, hide = () => {
-    setType(null);
-  }, showLink = (props) => {
-    linkTabProps.current = props, !("resourceId" in props || "appPrefix" in props) && setDefaultTabId("external-link"), setType("hyperlink");
+  const J = (e) => {
+    b(e);
+  }, Q = () => {
+    b(null);
+  }, X = (e) => {
+    s.current = e, !("resourceId" in e || "appPrefix" in e) && f("external-link"), b("hyperlink");
   };
-  useEffect(() => {
-    var _a2, _b;
-    const typeKey = type || "none";
-    !defaultTabId && typeof ((_a2 = mediaLibraryTypes[typeKey]) == null ? void 0 : _a2.defaultTab) == "string" && setDefaultTabId((_b = mediaLibraryTypes[typeKey]) == null ? void 0 : _b.defaultTab);
-  }, [defaultTabId, type]);
-  const modalHeader = t(((_a = mediaLibraryTypes[type ?? "none"]) == null ? void 0 : _a.title) ?? "bbm"), resetState = () => {
-    linkTabProps.current = void 0, setResult(void 0), setResultCounter(void 0), setDefaultTabId(void 0), setPreSuccess(void 0), setDeletionsOnCancel([]);
-  }, handleTabChange = (tab) => {
-    onTabChange == null || onTabChange(tab, deletionsOnCancel), resetState();
-  }, handleOnSuccess = useCallback(() => {
-    const triggerSuccess = async (result2) => {
-      result2 instanceof Array && ["protected", "public"].findIndex((v) => v === visibility) >= 0 && (result2 = await odeServices.workspace().transferDocuments(result2, appCode ?? "media-library", visibility)), onSuccess(result2);
+  oe(() => {
+    var o, d;
+    const e = t || "none";
+    !u && typeof ((o = C[e]) == null ? void 0 : o.defaultTab) == "string" && f((d = C[e]) == null ? void 0 : d.defaultTab);
+  }, [u, t]);
+  const Y = n(((O = C[t ?? "none"]) == null ? void 0 : O.title) ?? "bbm"), x = () => {
+    s.current = void 0, L(void 0), M(void 0), f(void 0), H(void 0), D([]);
+  }, Z = (e) => {
+    h == null || h(e, S), x();
+  }, _ = ne(() => {
+    const e = async (o) => {
+      o instanceof Array && ["protected", "public"].findIndex((d) => d === m) >= 0 && (o = await te.workspace().transferDocuments(o, k ?? "media-library", m)), F(o);
     };
-    onSuccessAction ? onSuccessAction().then((result2) => {
-      triggerSuccess(result2);
-    }) : result && triggerSuccess(result), resetState();
-  }, [onSuccessAction, result, onSuccess, visibility, appCode]), handleOnCancel = () => {
-    onCancel(deletionsOnCancel), resetState();
+    w ? w().then((o) => {
+      e(o);
+    }) : p && e(p), x();
+  }, [w, p, F, m, k]), T = () => {
+    j(S), x();
   };
-  return type && /* @__PURE__ */ jsx(MediaLibraryContext.Provider, { value: {
-    appCode,
-    visibility,
-    multiple,
-    type,
-    setResultCounter,
-    setResult,
-    setCancellable: (uploads) => setDeletionsOnCancel([...uploads]),
-    setVisibleTab,
-    switchType,
-    setPreSuccess
-  }, children: /* @__PURE__ */ jsxs(Modal, { id: "media-library", isOpen: type !== null, onModalClose: handleOnCancel, size: "lg", viewport: !0, scrollable: !0, children: [
-    /* @__PURE__ */ jsx(Modal.Header, { onModalClose: handleOnCancel, children: modalHeader }),
-    /* @__PURE__ */ jsx(Tabs, { items: tabs, defaultId: tabs[defaultTabIdx].id, onChange: handleTabChange, children: (currentItem) => /* @__PURE__ */ jsxs(Fragment, { children: [
-      tabs.length > 1 && /* @__PURE__ */ jsx(Tabs.List, { className: "mt-16" }),
-      /* @__PURE__ */ jsx(Modal.Body, { className: "d-flex", children: /* @__PURE__ */ jsx(Tabs.Panel, { currentItem, children: currentItem == null ? void 0 : currentItem.content }) })
+  return t && /* @__PURE__ */ a(ie.Provider, { value: {
+    appCode: k,
+    visibility: m,
+    multiple: A,
+    type: t,
+    setResultCounter: M,
+    setResult: L,
+    setCancellable: (e) => D([...e]),
+    setVisibleTab: q,
+    switchType: G,
+    setPreSuccess: H
+  }, children: /* @__PURE__ */ E(v, { id: "media-library", isOpen: t !== null, onModalClose: T, size: "lg", viewport: !0, scrollable: !0, children: [
+    /* @__PURE__ */ a(v.Header, { onModalClose: T, children: Y }),
+    /* @__PURE__ */ a(g, { items: r, defaultId: r[U].id, onChange: Z, children: (e) => /* @__PURE__ */ E($, { children: [
+      r.length > 1 && /* @__PURE__ */ a(g.List, { className: "mt-16" }),
+      /* @__PURE__ */ a(v.Body, { className: "d-flex", children: /* @__PURE__ */ a(g.Panel, { currentItem: e, children: e == null ? void 0 : e.content }) })
     ] }) }),
-    /* @__PURE__ */ jsxs(Modal.Footer, { children: [
-      /* @__PURE__ */ jsx(Button, { type: "button", color: "tertiary", variant: "ghost", onClick: handleOnCancel, children: t("cancel") }),
-      /* @__PURE__ */ jsx(Button, { type: "button", color: "primary", variant: "filled", disabled: typeof result > "u", onClick: handleOnSuccess, children: resultCounter && resultCounter > 1 ? t("addMultiple", {
-        number: resultCounter
-      }) : t("add") })
+    /* @__PURE__ */ E(v.Footer, { children: [
+      /* @__PURE__ */ a(V, { type: "button", color: "tertiary", variant: "ghost", onClick: T, children: n("cancel") }),
+      /* @__PURE__ */ a(V, { type: "button", color: "primary", variant: "filled", disabled: typeof p > "u", onClick: _, children: y && y > 1 ? n("addMultiple", {
+        number: y
+      }) : n("add") })
     ] })
   ] }) });
 });
 export {
-  MediaLibrary as default
+  xe as default
 };
+//# sourceMappingURL=MediaLibrary.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MediaLibrary.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -1,10 +1,10 @@
-import { WorkspaceElement } from 'edifice-ts-client';
-import { MediaLibraryType, AvailableTab, MediaLibraryResult } from './MediaLibrary';
+import { WorkspaceElement, WorkspaceVisibility } from '@edifice.io/ts-client';
+import { AvailableTab, MediaLibraryResult, MediaLibraryType } from './MediaLibrary';
 export declare const MediaLibraryContext: import('react').Context<{
     /** Application code (example: "blog") */
     appCode: string;
     /** Visibility of the uploaded files. */
-    visibility?: any;
+    visibility?: WorkspaceVisibility | undefined;
     /** Allow selecting / uploading multiple files at once ? */
     multiple?: boolean | undefined;
     /** Type of resource to search for. */
@@ -33,7 +33,7 @@ export declare function useMediaLibraryContext(): {
     /** Application code (example: "blog") */
     appCode: string;
     /** Visibility of the uploaded files. */
-    visibility?: any;
+    visibility?: WorkspaceVisibility | undefined;
     /** Allow selecting / uploading multiple files at once ? */
     multiple?: boolean | undefined;
     /** Type of resource to search for. */

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

@@ -1,12 +1,13 @@
-import { createContext, useContext } from "react";
-const MediaLibraryContext = /* @__PURE__ */ createContext(null);
-function useMediaLibraryContext() {
-  const context = useContext(MediaLibraryContext);
-  if (!context)
+import { createContext as t, useContext as n } from "react";
+const o = /* @__PURE__ */ t(null);
+function i() {
+  const e = n(o);
+  if (!e)
     throw new Error("Innertabs compound components cannot be rendered outside the MediaLibrary component");
-  return context;
+  return e;
 }
 export {
-  MediaLibraryContext,
-  useMediaLibraryContext
+  o as MediaLibraryContext,
+  i as useMediaLibraryContext
 };
+//# sourceMappingURL=MediaLibraryContext.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MediaLibraryContext.js","sources":["../../../../src/modules/multimedia/MediaLibrary/MediaLibraryContext.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nimport { WorkspaceElement, WorkspaceVisibility } from '@edifice.io/ts-client';\n\nimport {\n  AvailableTab,\n  MediaLibraryResult,\n  MediaLibraryType,\n} from './MediaLibrary';\n\nexport const MediaLibraryContext = createContext<{\n  /** Application code (example: \"blog\") */\n  appCode: string;\n\n  /** Visibility of the uploaded files. */\n  visibility?: WorkspaceVisibility;\n\n  /** Allow selecting / uploading multiple files at once ? */\n  multiple?: boolean;\n\n  /** Type of resource to search for. */\n  type: MediaLibraryType | null;\n\n  /** Set the counter in the success button label. */\n  setResultCounter: (count?: number) => void;\n\n  /**\n   * Set a innertab-specific callback which gets the result when success button is clicked.\n   */\n  setResult: (result?: MediaLibraryResult) => void;\n\n  /** Memoize uploaded elements to be deleted on cancellation. */\n  setCancellable: (uploads: WorkspaceElement[]) => void;\n\n  /**\n   * Allow an innertab to switch display to another innertab.\n   * This function will throw an error if switching failed.\n   */\n  setVisibleTab: (tab: AvailableTab) => void;\n\n  /** Allow an innertab to switch type of the media library. */\n  switchType: (type: MediaLibraryType) => void;\n\n  /**\n   * Allow an innertab to set action to execute before triggering onSuccess.\n   */\n  setPreSuccess: (\n    onSuccessAction?: () => () => Promise<MediaLibraryResult>,\n  ) => void;\n}>(null!);\n\nexport function useMediaLibraryContext() {\n  const context = useContext(MediaLibraryContext);\n  if (!context) {\n    throw new Error(\n      `Innertabs compound components cannot be rendered outside the MediaLibrary component`,\n    );\n  }\n  return context;\n}\n"],"names":["MediaLibraryContext","useMediaLibraryContext","context","useContext","Error"],"mappings":";AAUaA,MAAAA,sBAuCV,IAAK;AAED,SAASC,IAAyB;AACjCC,QAAAA,IAAUC,EAAWH,CAAmB;AAC9C,MAAI,CAACE;AACG,UAAA,IAAIE,MACR,qFACF;AAEKF,SAAAA;AACT;"}

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

@@ -1,19 +1,20 @@
-import { jsx } from "react/jsx-runtime";
-import { useRef } from "react";
-import { useMediaLibraryContext } from "../MediaLibraryContext.js";
-import AudioRecorder from "../../AudioRecorder/AudioRecorder.js";
-const Audio = () => {
+import { jsx as s } from "react/jsx-runtime";
+import { useRef as c } from "react";
+import { useMediaLibraryContext as i } from "../MediaLibraryContext.js";
+import d from "../../AudioRecorder/AudioRecorder.js";
+const S = () => {
   const {
-    setResult,
-    setPreSuccess,
-    visibility
-  } = useMediaLibraryContext(), ref = useRef(null);
-  return /* @__PURE__ */ jsx(AudioRecorder, { ref, onRecordUpdated: (recordURL) => {
-    recordURL ? (setResult(recordURL), setPreSuccess(() => ref.current.save)) : setResult();
-  }, onSaveSuccess: (audioRessource) => {
-    audioRessource && setResult(audioRessource);
-  }, hideSaveAction: !0, visibility });
+    setResult: t,
+    setPreSuccess: n,
+    visibility: r
+  } = i(), o = c(null);
+  return /* @__PURE__ */ s(d, { ref: o, onRecordUpdated: (e) => {
+    e ? (t(e), n(() => o.current.save)) : t();
+  }, onSaveSuccess: (e) => {
+    e && t(e);
+  }, hideSaveAction: !0, visibility: r });
 };
 export {
-  Audio
+  S as Audio
 };
+//# sourceMappingURL=Audio.js.map

package/dist/modules/multimedia/MediaLibrary/innertabs/Audio.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Audio.js","sources":["../../../../../src/modules/multimedia/MediaLibrary/innertabs/Audio.tsx"],"sourcesContent":["import { useRef } from 'react';\n\nimport { WorkspaceElement } from '@edifice.io/ts-client';\n\nimport { AudioRecorder } from '../../AudioRecorder';\nimport { AudioRecorderRef } from '../../AudioRecorder/AudioRecorder';\nimport { useMediaLibraryContext } from '../MediaLibraryContext';\n\nexport const Audio = () => {\n  const { setResult, setPreSuccess, visibility } = useMediaLibraryContext();\n  const ref = useRef<AudioRecorderRef>(null);\n\n  const handleOnUpdateRecord = (recordURL?: string) => {\n    if (recordURL) {\n      setResult(recordURL);\n      setPreSuccess(() => ref.current!.save);\n    } else {\n      setResult();\n    }\n  };\n\n  const handleOnSaveSuccess = (audioRessource?: WorkspaceElement) => {\n    if (audioRessource) {\n      setResult(audioRessource);\n    }\n  };\n\n  return (\n    <AudioRecorder\n      ref={ref}\n      onRecordUpdated={handleOnUpdateRecord}\n      onSaveSuccess={handleOnSaveSuccess}\n      hideSaveAction={true}\n      visibility={visibility}\n    ></AudioRecorder>\n  );\n};\n"],"names":["Audio","setResult","setPreSuccess","visibility","useMediaLibraryContext","ref","useRef","jsx","AudioRecorder","handleOnUpdateRecord","recordURL","current","save","handleOnSaveSuccess","audioRessource"],"mappings":";;;;AAQO,MAAMA,IAAQA,MAAM;AACnB,QAAA;AAAA,IAAEC,WAAAA;AAAAA,IAAWC,eAAAA;AAAAA,IAAeC,YAAAA;AAAAA,MAAeC,EAAuB,GAClEC,IAAMC,EAAyB,IAAI;AAkBvC,SAAA,gBAAAC,EAACC,KACC,KAAAH,GACA,iBAlByBI,CAACC,MAAuB;AACnD,IAAIA,KACFT,EAAUS,CAAS,GACLR,EAAA,MAAMG,EAAIM,QAASC,IAAI,KAE3BX;EACZ,GAaE,eAVwBY,CAACC,MAAsC;AACjE,IAAIA,KACFb,EAAUa,CAAc;AAAA,EAC1B,GAQE,gBAAgB,IAChB,YAAAX,EACD,CAAA;AAEL;"}

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

@@ -1,17 +1,18 @@
-import { jsx } from "react/jsx-runtime";
-import ExternalLinker from "../../Linker/ExternalLinker.js";
-import { useMediaLibraryContext } from "../MediaLibraryContext.js";
-const ExternalLink = ({
-  link,
-  multiNodeSelected = !1
+import { jsx as o } from "react/jsx-runtime";
+import a from "../../Linker/ExternalLinker.js";
+import { useMediaLibraryContext as i } from "../MediaLibraryContext.js";
+const x = ({
+  link: n,
+  multiNodeSelected: e = !1
 }) => {
   const {
-    setResult
-  } = useMediaLibraryContext();
-  return /* @__PURE__ */ jsx(ExternalLinker, { link, onChange: (link2) => {
-    setResult(link2);
-  }, multiNodeSelected });
+    setResult: r
+  } = i();
+  return /* @__PURE__ */ o(a, { link: n, onChange: (t) => {
+    r(t);
+  }, multiNodeSelected: e });
 };
 export {
-  ExternalLink
+  x as ExternalLink
 };
+//# sourceMappingURL=ExternalLink.js.map

package/dist/modules/multimedia/MediaLibrary/innertabs/ExternalLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExternalLink.js","sources":["../../../../../src/modules/multimedia/MediaLibrary/innertabs/ExternalLink.tsx"],"sourcesContent":["import ExternalLinker, { IExternalLink } from '../../Linker/ExternalLinker';\nimport { useMediaLibraryContext } from '../MediaLibraryContext';\n\nexport type ExternalLinkTabProps = {\n  multiNodeSelected?: boolean;\n  link?: Partial<IExternalLink>;\n};\n\nexport const ExternalLink = ({\n  link,\n  multiNodeSelected = false,\n}: ExternalLinkTabProps) => {\n  const { setResult } = useMediaLibraryContext();\n\n  const handleLinkChange = (link?: IExternalLink) => {\n    setResult(link);\n  };\n\n  return (\n    <ExternalLinker\n      link={link}\n      onChange={handleLinkChange}\n      multiNodeSelected={multiNodeSelected}\n    />\n  );\n};\n"],"names":["ExternalLink","link","multiNodeSelected","setResult","useMediaLibraryContext","jsx","ExternalLinker","handleLinkChange"],"mappings":";;;AAQO,MAAMA,IAAeA,CAAC;AAAA,EAC3BC,MAAAA;AAAAA,EACAC,mBAAAA,IAAoB;AACA,MAAM;AACpB,QAAA;AAAA,IAAEC,WAAAA;AAAAA,MAAcC,EAAuB;AAM7C,SACG,gBAAAC,EAAAC,GAAA,EACC,MAAAL,GACA,UAPqBM,CAACN,MAAyB;AACjDE,IAAAA,EAAUF,CAAI;AAAA,EAAA,GAOZ,mBAAAC,EACA,CAAA;AAEN;"}