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

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

@@ -0,0 +1 @@
+{"version":3,"file":"useImageEditor.js","sources":["../../../../../src/modules/multimedia/ImageEditor/hooks/useImageEditor.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport * as PIXI from 'pixi.js';\n\nimport '@pixi/mixin-get-child-by-name';\nimport useHistoryTool from './useHistoryTool';\nimport useImageEffects from './useImageEffects';\nimport {\n  DEFAULT_SPRITE_NAME,\n  updateImage,\n  saveAsBlob,\n  saveAsDataURL,\n  updateImageFromBlob,\n} from '../effects/misc';\n\n/**\n * This hook expose all the functions available for the pixi editor:\n * - all the effects (crop, resize, rotate, blur)\n * - historize every action\n * - backup functions\n *\n * @param args.spriteName The spriteName of the original image\n * @param args.imageSrc The URL of the image to edit\n * @returns all the action available for the image editor\n */\nexport default function useImageEditor({\n  imageSrc,\n  spriteName = DEFAULT_SPRITE_NAME,\n}: {\n  imageSrc: string;\n  spriteName?: string;\n}) {\n  const [application, setApplication] = useState<PIXI.Application | undefined>(\n    undefined,\n  );\n\n  const [loading, setLoading] = useState(true);\n\n  const {\n    rotate,\n    startBlur,\n    startCrop,\n    startResize,\n    stopBlur,\n    stopCrop,\n    stopResize,\n  } = useImageEffects({\n    spriteName,\n    application,\n    onSave(sprite) {\n      if (application) {\n        updateImage(application, {\n          imgDatasource: sprite,\n          spriteName,\n        });\n      }\n    },\n  });\n\n  const toBlob = (): Promise<Blob | undefined> => {\n    if (!application) return Promise.resolve(undefined);\n    return saveAsBlob(application);\n  };\n  const toDataURL = (): string | undefined => {\n    if (!application) return undefined;\n    return saveAsDataURL(application);\n  };\n\n  const { restore, historize, historyCount } = useHistoryTool({\n    application,\n    spriteName,\n    onRestore(imgDatasource, state) {\n      if (!application) return undefined;\n      updateImageFromBlob(application, {\n        imgDatasource,\n        spriteName,\n        settings: state,\n      });\n    },\n  });\n\n  useEffect(() => {\n    if (!application) return undefined;\n    setLoading(true);\n    updateImage(application, { spriteName, imgDatasource: imageSrc }).finally(\n      () => setLoading(false),\n    );\n  }, [application, imageSrc, spriteName]);\n\n  return {\n    historyCount,\n    setApplication,\n    restore,\n    stopCrop,\n    stopBlur,\n    stopResize,\n    startResize: async () => {\n      setLoading(true);\n      await historize(startResize);\n      setLoading(false);\n    },\n    startCrop: async () => {\n      setLoading(true);\n      await historize(startCrop);\n      setLoading(false);\n    },\n    startBlur: async () => {\n      setLoading(true);\n      await historize(startBlur);\n      setLoading(false);\n    },\n    rotate: async () => {\n      setLoading(true);\n      await historize(rotate);\n      setLoading(false);\n    },\n    toBlob,\n    toDataURL,\n    loading,\n  };\n}\n"],"names":["useImageEditor","imageSrc","spriteName","DEFAULT_SPRITE_NAME","application","setApplication","useState","undefined","loading","setLoading","rotate","startBlur","startCrop","startResize","stopBlur","stopCrop","stopResize","useImageEffects","onSave","sprite","updateImage","imgDatasource","toBlob","saveAsBlob","Promise","resolve","toDataURL","saveAsDataURL","restore","historize","historyCount","useHistoryTool","onRestore","state","updateImageFromBlob","settings","useEffect","finally"],"mappings":";;;;;AAyBA,SAAwBA,EAAe;AAAA,EACrCC,UAAAA;AAAAA,EACAC,YAAAA,IAAaC;AAIf,GAAG;AACD,QAAM,CAACC,GAAaC,CAAc,IAAIC,EACpCC,MACF,GAEM,CAACC,GAASC,CAAU,IAAIH,EAAS,EAAI,GAErC;AAAA,IACJI,QAAAA;AAAAA,IACAC,WAAAA;AAAAA,IACAC,WAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,YAAAA;AAAAA,MACEC,EAAgB;AAAA,IAClBf,YAAAA;AAAAA,IACAE,aAAAA;AAAAA,IACAc,OAAOC,GAAQ;AACb,MAAIf,KACFgB,EAAYhB,GAAa;AAAA,QACvBiB,eAAeF;AAAAA,QACfjB,YAAAA;AAAAA,MAAAA,CACD;AAAA,IAEL;AAAA,EAAA,CACD,GAEKoB,IAASA,MACRlB,IACEmB,EAAWnB,CAAW,IADJoB,QAAQC,QAAQlB,MAAS,GAG9CmB,IAAYA,MAA0B;AACtC,QAACtB;AACL,aAAOuB,EAAcvB,CAAW;AAAA,EAAA,GAG5B;AAAA,IAAEwB,SAAAA;AAAAA,IAASC,WAAAA;AAAAA,IAAWC,cAAAA;AAAAA,MAAiBC,EAAe;AAAA,IAC1D3B,aAAAA;AAAAA,IACAF,YAAAA;AAAAA,IACA8B,UAAUX,GAAeY,GAAO;AAC1B,MAAC7B,KACL8B,EAAoB9B,GAAa;AAAA,QAC/BiB,eAAAA;AAAAA,QACAnB,YAAAA;AAAAA,QACAiC,UAAUF;AAAAA,MAAAA,CACX;AAAA,IACH;AAAA,EAAA,CACD;AAEDG,SAAAA,EAAU,MAAM;AACV,IAAChC,MACLK,EAAW,EAAI,GACfW,EAAYhB,GAAa;AAAA,MAAEF,YAAAA;AAAAA,MAAYmB,eAAepB;AAAAA,IAAU,CAAA,EAAEoC,QAChE,MAAM5B,EAAW,EAAK,CACxB;AAAA,EACC,GAAA,CAACL,GAAaH,GAAUC,CAAU,CAAC,GAE/B;AAAA,IACL4B,cAAAA;AAAAA,IACAzB,gBAAAA;AAAAA,IACAuB,SAAAA;AAAAA,IACAb,UAAAA;AAAAA,IACAD,UAAAA;AAAAA,IACAE,YAAAA;AAAAA,IACAH,aAAa,YAAY;AACvBJ,MAAAA,EAAW,EAAI,GACf,MAAMoB,EAAUhB,CAAW,GAC3BJ,EAAW,EAAK;AAAA,IAClB;AAAA,IACAG,WAAW,YAAY;AACrBH,MAAAA,EAAW,EAAI,GACf,MAAMoB,EAAUjB,CAAS,GACzBH,EAAW,EAAK;AAAA,IAClB;AAAA,IACAE,WAAW,YAAY;AACrBF,MAAAA,EAAW,EAAI,GACf,MAAMoB,EAAUlB,CAAS,GACzBF,EAAW,EAAK;AAAA,IAClB;AAAA,IACAC,QAAQ,YAAY;AAClBD,MAAAA,EAAW,EAAI,GACf,MAAMoB,EAAUnB,CAAM,GACtBD,EAAW,EAAK;AAAA,IAClB;AAAA,IACAa,QAAAA;AAAAA,IACAI,WAAAA;AAAAA,IACAlB,SAAAA;AAAAA,EAAAA;AAEJ;"}

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

@@ -1,52 +1,53 @@
-import { start as start$1, stop as stop$1 } from "../effects/blur.js";
-import { start, save, stop } from "../effects/crop.js";
-import { save as save$1, stop as stop$2, start as start$2 } from "../effects/resize.js";
-import { rotate } from "../effects/rotate.js";
-function useImageEffects({
-  application,
-  spriteName,
-  onSave
+import { start as f, stop as u } from "../effects/blur.js";
+import { start as $, save as m, stop as n } from "../effects/crop.js";
+import { save as z, stop as B, start as C } from "../effects/resize.js";
+import { rotate as R } from "../effects/rotate.js";
+function k({
+  application: t,
+  spriteName: s,
+  onSave: o
 }) {
   return {
     rotate: async () => {
-      application && await rotate(application, spriteName);
+      t && await R(t, s);
     },
     startCrop: () => {
-      application && start(application, {
-        spriteName
+      t && $(t, {
+        spriteName: s
       });
     },
-    stopCrop: (save$12) => {
-      if (application) {
-        if (save$12) {
-          const result = save(application);
-          result && onSave(result);
+    stopCrop: (e) => {
+      if (t) {
+        if (e) {
+          const r = m(t);
+          r && o(r);
         }
-        stop(application);
+        n(t);
       }
     },
     startBlur: () => {
-      application && start$1(application, {
-        spriteName
+      t && f(t, {
+        spriteName: s
       });
     },
     stopBlur: () => {
-      application && stop$1(application);
+      t && u(t);
     },
     startResize: () => {
-      application && start$2(application, spriteName);
+      t && C(t, s);
     },
-    stopResize: (save2) => {
-      if (application) {
-        if (save2) {
-          const result = save$1(application);
-          result && onSave(result);
+    stopResize: (e) => {
+      if (t) {
+        if (e) {
+          const r = z(t);
+          r && o(r);
         }
-        stop$2(application);
+        B(t);
       }
     }
   };
 }
 export {
-  useImageEffects as default
+  k as default
 };
+//# sourceMappingURL=useImageEffects.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useImageEffects.js","sources":["../../../../../src/modules/multimedia/ImageEditor/hooks/useImageEffects.ts"],"sourcesContent":["import * as PIXI from 'pixi.js';\n\nimport * as blurEffect from '../effects/blur';\nimport * as cropEffect from '../effects/crop';\nimport * as resizeEffect from '../effects/resize';\nimport * as rotateEffect from '../effects/rotate';\n\nexport interface UseImageEffectsProps {\n  spriteName: string;\n  application?: PIXI.Application;\n  onSave(sprite: PIXI.Sprite): void;\n}\n/**\n * This hook expose all effects of the pixi editor\n *\n * @param args.spriteName The spriteName of the original image\n * @param args.application The PIXI.Application context\n * @param args.onSave A callback called when the sprite changes\n * @returns all the action available for the image editor\n */\nexport default function useImageEffects({\n  application,\n  spriteName,\n  onSave,\n}: UseImageEffectsProps) {\n  const startCrop = () => {\n    if (!application) return;\n    cropEffect.start(application, { spriteName });\n  };\n  const stopCrop = (save: boolean) => {\n    if (!application) return;\n    if (save) {\n      const result = cropEffect.save(application);\n      result && onSave(result);\n    }\n    cropEffect.stop(application);\n  };\n  const startBlur = () => {\n    if (!application) return;\n    blurEffect.start(application, { spriteName });\n  };\n  const stopBlur = () => {\n    if (!application) return;\n    blurEffect.stop(application);\n  };\n  const stopResize = (save: boolean) => {\n    if (!application) return;\n    if (save) {\n      const result = resizeEffect.save(application);\n      result && onSave(result);\n    }\n    resizeEffect.stop(application);\n  };\n  const startResize = () => {\n    if (!application) return;\n    resizeEffect.start(application, spriteName);\n  };\n  const rotate = async () => {\n    if (!application) return;\n    await rotateEffect.rotate(application, spriteName);\n  };\n  return {\n    rotate,\n    startCrop,\n    stopCrop,\n    startBlur,\n    stopBlur,\n    startResize,\n    stopResize,\n  };\n}\n"],"names":["useImageEffects","application","spriteName","onSave","rotateEffect","startCrop","cropEffect","stopCrop","save","result","startBlur","blurEffect","stopBlur","startResize","start","stopResize","resizeEffect"],"mappings":";;;;AAoBA,SAAwBA,EAAgB;AAAA,EACtCC,aAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,QAAAA;AACoB,GAAG;AAqChB,SAAA;AAAA,IAAA,QAJQ,YAAY;AACzB,MAAKF,KACCG,MAAAA,EAAoBH,GAAaC,CAAU;AAAA,IAAA;AAAA,IAIjDG,WAtCgBA,MAAM;AACtB,MAAKJ,KACLK,EAAiBL,GAAa;AAAA,QAAEC,YAAAA;AAAAA,MAAAA,CAAY;AAAA,IAAA;AAAA,IAqC5CK,UAnCeA,CAACC,MAAkB;AAClC,UAAKP,GACL;AAAA,YAAIO,GAAM;AACFC,gBAAAA,IAASH,EAAgBL,CAAW;AAC1CQ,UAAAA,KAAUN,EAAOM,CAAM;AAAA,QACzB;AACAH,QAAAA,EAAgBL,CAAW;AAAA;AAAA,IAAA;AAAA,IA8B3BS,WA5BgBA,MAAM;AACtB,MAAKT,KACLU,EAAiBV,GAAa;AAAA,QAAEC,YAAAA;AAAAA,MAAAA,CAAY;AAAA,IAAA;AAAA,IA2B5CU,UAzBeA,MAAM;AACrB,MAAKX,KACLU,EAAgBV,CAAW;AAAA,IAAA;AAAA,IAwB3BY,aAdkBA,MAAM;AACxB,MAAKZ,KACQa,EAAMb,GAAaC,CAAU;AAAA,IAAA;AAAA,IAa1Ca,YAvBiBA,CAACP,MAAkB;AACpC,UAAKP,GACL;AAAA,YAAIO,GAAM;AACFC,gBAAAA,IAASO,EAAkBf,CAAW;AAC5CQ,UAAAA,KAAUN,EAAOM,CAAM;AAAA,QACzB;AACAO,QAAAA,EAAkBf,CAAW;AAAA;AAAA,IAAA;AAAA,EAiB7Bc;AAEJ;"}

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

@@ -1,13 +1,14 @@
-function aggregate(delay, map, callback) {
-  let timerId;
-  const pending = [];
-  return function(arg) {
-    pending.push(map(arg)), !timerId && (timerId = setTimeout(() => {
-      const copy = [...pending];
-      pending.splice(0, pending.length), callback(copy), timerId = void 0;
-    }, delay));
+function u(n, i, o) {
+  let e;
+  const t = [];
+  return function(r) {
+    t.push(i(r)), !e && (e = setTimeout(() => {
+      const c = [...t];
+      t.splice(0, t.length), o(c), e = void 0;
+    }, n));
   };
 }
 export {
-  aggregate
+  u as aggregate
 };
+//# sourceMappingURL=aggregate.js.map

package/dist/modules/multimedia/ImageEditor/utils/aggregate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"aggregate.js","sources":["../../../../../src/modules/multimedia/ImageEditor/utils/aggregate.ts"],"sourcesContent":["/**\n * This function aggregate events and call the callback with aggregated events every {delay}\n *\n * @param delay delay between each call\n * @param map a function to transform event from {INPUT} to {OUTPUT}\n * @param callback a callback called with aggregated events every x ms\n * @returns a function that take as argument (INPUT)=>void\n */\nexport function aggregate<INPUT, OUTPUT>(\n  delay: number,\n  map: (input: INPUT) => OUTPUT,\n  callback: (aggregated: OUTPUT[]) => void,\n): (arg: INPUT) => void {\n  let timerId: number | undefined;\n  const pending: OUTPUT[] = [];\n  return function (arg: INPUT) {\n    pending.push(map(arg));\n    if (timerId) {\n      return;\n    }\n    timerId = setTimeout(() => {\n      const copy = [...pending];\n      // remove all\n      pending.splice(0, pending.length);\n      // call with aggregated\n      callback(copy);\n      // reset timer\n      timerId = undefined;\n    }, delay) as unknown as number;\n  };\n}\n"],"names":["aggregate","delay","map","callback","timerId","pending","arg","push","setTimeout","copy","splice","length","undefined"],"mappings":"AAQgBA,SAAAA,EACdC,GACAC,GACAC,GACsB;AAClBC,MAAAA;AACJ,QAAMC,IAAoB,CAAA;AAC1B,SAAO,SAAUC,GAAY;AAE3B,IADQC,EAAAA,KAAKL,EAAII,CAAG,CAAC,GACjBF,CAAAA,MAGJA,IAAUI,WAAW,MAAM;AACnBC,YAAAA,IAAO,CAAC,GAAGJ,CAAO;AAEhBK,MAAAA,EAAAA,OAAO,GAAGL,EAAQM,MAAM,GAEhCR,EAASM,CAAI,GAEHG,IAAAA;AAAAA,OACTX,CAAK;AAAA,EAAA;AAEZ;"}

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

@@ -1,5 +1,5 @@
 import { ComponentPropsWithRef } from 'react';
-import { IWebApp } from 'edifice-ts-client';
+import { IWebApp } from '@edifice.io/ts-client';
 export interface ImagePickerWorkspaceProps extends ComponentPropsWithRef<'input'> {
     /**
      * Accessible description of the add button

package/dist/modules/multimedia/ImagePickerWorkspace/ImagePickerWorkspace.js

@@ -1,39 +1,40 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useState, useEffect } from "react";
-import clsx from "clsx";
-import { IconButton } from "../../../components/Button/IconButton.js";
-import { Icon } from "../../../components/Icon/Icon.js";
-import { Avatar } from "../../../components/Avatar/Avatar.js";
-import { AppIcon } from "../../../components/AppIcon/AppIcon.js";
-const ImagePickerWorkspace = ({
-  addButtonLabel = "Add image",
-  deleteButtonLabel = "Delete image",
-  src,
-  className,
-  mediaLibraryRef,
-  libraryMedia,
-  app,
-  onUploadImage,
-  onDeleteImage
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { useState as x, useEffect as C } from "react";
+import I from "clsx";
+import { IconButton as r } from "../../../components/Button/IconButton.js";
+import { Icon as s } from "../../../components/Icon/Icon.js";
+import { Avatar as w } from "../../../components/Avatar/Avatar.js";
+import { AppIcon as z } from "../../../components/AppIcon/AppIcon.js";
+const E = ({
+  addButtonLabel: c = "Add image",
+  deleteButtonLabel: m = "Delete image",
+  src: l,
+  className: p,
+  mediaLibraryRef: d,
+  libraryMedia: t,
+  app: u,
+  onUploadImage: f,
+  onDeleteImage: g
 }) => {
-  const [preview, setPreview] = useState(src || "");
-  useEffect(() => {
-    libraryMedia && (setPreview(libraryMedia), onUploadImage(libraryMedia));
-  }, [libraryMedia]);
-  const handleClick = () => {
-    var _a;
-    (_a = mediaLibraryRef.current) == null || _a.show("image");
-  }, handleClean = () => {
-    setPreview(""), onDeleteImage();
-  }, classes = clsx("image-input", className);
-  return /* @__PURE__ */ jsxs("div", { id: "image-input", className: classes, children: [
-    /* @__PURE__ */ jsxs("div", { className: "image-input-actions gap-8", children: [
-      /* @__PURE__ */ jsx(IconButton, { "aria-label": addButtonLabel, color: "tertiary", icon: /* @__PURE__ */ jsx(Icon, { name: "edit" }), onClick: handleClick, type: "button", variant: "ghost" }),
-      /* @__PURE__ */ jsx(IconButton, { "aria-label": deleteButtonLabel, color: "danger", disabled: !preview, icon: /* @__PURE__ */ jsx(Icon, { name: "delete", size: "20" }), onClick: handleClean, type: "button", variant: "ghost" })
+  const [o, i] = x(l || "");
+  C(() => {
+    t && (i(t), f(t));
+  }, [t]);
+  const v = () => {
+    var a;
+    (a = d.current) == null || a.show("image");
+  }, h = () => {
+    i(""), g();
+  }, k = I("image-input", p);
+  return /* @__PURE__ */ n("div", { id: "image-input", className: k, children: [
+    /* @__PURE__ */ n("div", { className: "image-input-actions gap-8", children: [
+      /* @__PURE__ */ e(r, { "aria-label": c, color: "tertiary", icon: /* @__PURE__ */ e(s, { name: "edit" }), onClick: v, type: "button", variant: "ghost" }),
+      /* @__PURE__ */ e(r, { "aria-label": m, color: "danger", disabled: !o, icon: /* @__PURE__ */ e(s, { name: "delete", size: "20" }), onClick: h, type: "button", variant: "ghost" })
     ] }),
-    preview ? /* @__PURE__ */ jsx(Avatar, { alt: "", src: preview, size: "xl" }) : /* @__PURE__ */ jsx(AppIcon, { app, iconFit: "ratio", size: "160", variant: "rounded" })
+    o ? /* @__PURE__ */ e(w, { alt: "", src: o, size: "xl" }) : /* @__PURE__ */ e(z, { app: u, iconFit: "ratio", size: "160", variant: "rounded" })
   ] });
 };
 export {
-  ImagePickerWorkspace as default
+  E as default
 };
+//# sourceMappingURL=ImagePickerWorkspace.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ImagePickerWorkspace.js","sources":["../../../../src/modules/multimedia/ImagePickerWorkspace/ImagePickerWorkspace.tsx"],"sourcesContent":["import { ComponentPropsWithRef, useEffect, useState } from 'react';\n\nimport { IWebApp } from '@edifice.io/ts-client';\n\nimport clsx from 'clsx';\nimport { Icon } from '../../..';\nimport { AppIcon } from '../../../components/AppIcon';\nimport { Avatar } from '../../../components/Avatar';\nimport { IconButton } from '../../../components/Button';\n\nexport interface ImagePickerWorkspaceProps\n  extends ComponentPropsWithRef<'input'> {\n  /**\n   * Accessible description of the add button\n   */\n  addButtonLabel: string;\n  /**\n   * Accessible description of the delete button\n   */\n  deleteButtonLabel: string;\n  /**\n   * Provide a default image as placeholder\n   */\n  src?: string;\n  /**\n   * Pathe element select in WorkSpace\n   */\n  libraryMedia: string;\n  /**\n   * Element select in WorkSpace\n   */\n  mediaLibraryRef: any;\n  /**\n   * To show the icon of an application\n   */\n  app?: IWebApp | undefined;\n\n  appCode?: string;\n  /**\n   * Optional class for styling purpose\n   */\n  className?: string;\n  /**\n   * Callback when uploading image\n   */\n  onUploadImage: (file: File | string) => void;\n  /**\n   * Callback when deleting image\n   */\n  onDeleteImage: () => void;\n}\n\nconst ImagePickerWorkspace = ({\n  addButtonLabel = 'Add image',\n  deleteButtonLabel = 'Delete image',\n  src,\n  className,\n  mediaLibraryRef,\n  libraryMedia,\n  app,\n  onUploadImage,\n  onDeleteImage,\n}: ImagePickerWorkspaceProps) => {\n  const [preview, setPreview] = useState<string>(src || '');\n\n  useEffect(() => {\n    if (libraryMedia) {\n      setPreview(libraryMedia);\n      onUploadImage(libraryMedia);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [libraryMedia]);\n\n  const handleClick = () => {\n    mediaLibraryRef.current?.show('image');\n  };\n\n  const handleClean = () => {\n    setPreview('');\n    onDeleteImage();\n  };\n\n  const classes = clsx('image-input', className);\n\n  return (\n    <div id=\"image-input\" className={classes}>\n      <div className=\"image-input-actions gap-8\">\n        <IconButton\n          aria-label={addButtonLabel}\n          color=\"tertiary\"\n          icon={<Icon name=\"edit\" />}\n          onClick={handleClick}\n          type=\"button\"\n          variant=\"ghost\"\n        />\n        <IconButton\n          aria-label={deleteButtonLabel}\n          color=\"danger\"\n          disabled={!preview}\n          icon={<Icon name=\"delete\" size=\"20\" />}\n          onClick={handleClean}\n          type=\"button\"\n          variant=\"ghost\"\n        />\n      </div>\n      {preview ? (\n        <Avatar alt=\"\" src={preview} size=\"xl\" />\n      ) : (\n        <AppIcon app={app} iconFit=\"ratio\" size=\"160\" variant=\"rounded\" />\n      )}\n    </div>\n  );\n};\n\nImagePickerWorkspace.displayName = 'ImagePickerWorkspace';\n\nexport default ImagePickerWorkspace;\n"],"names":["ImagePickerWorkspace","addButtonLabel","deleteButtonLabel","src","className","mediaLibraryRef","libraryMedia","app","onUploadImage","onDeleteImage","preview","setPreview","useState","useEffect","handleClick","current","show","handleClean","classes","clsx","jsxs","jsx","IconButton","Icon","Avatar","AppIcon"],"mappings":";;;;;;;AAoDA,MAAMA,IAAuBA,CAAC;AAAA,EAC5BC,gBAAAA,IAAiB;AAAA,EACjBC,mBAAAA,IAAoB;AAAA,EACpBC,KAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,iBAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAC,KAAAA;AAAAA,EACAC,eAAAA;AAAAA,EACAC,eAAAA;AACyB,MAAM;AAC/B,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAiBT,KAAO,EAAE;AAExDU,EAAAA,EAAU,MAAM;AACd,IAAIP,MACFK,EAAWL,CAAY,GACvBE,EAAcF,CAAY;AAAA,EAC5B,GAEC,CAACA,CAAY,CAAC;AAEjB,QAAMQ,IAAcA,MAAM;;AACRC,KAAAA,IAAAA,EAAAA,YAAAA,QAAAA,EAASC,KAAK;AAAA,EAAO,GAGjCC,IAAcA,MAAM;AACxBN,IAAAA,EAAW,EAAE,GACCF;EAAA,GAGVS,IAAUC,EAAK,eAAef,CAAS;AAE7C,SACG,gBAAAgB,EAAA,OAAA,EAAI,IAAG,eAAc,WAAWF,GAC/B,UAAA;AAAA,IAAC,gBAAAE,EAAA,OAAA,EAAI,WAAU,6BACb,UAAA;AAAA,MAAA,gBAAAC,EAACC,KACC,cAAYrB,GACZ,OAAM,YACN,MAAO,gBAAAoB,EAAAE,GAAA,EAAK,MAAK,OAAA,CAAM,GACvB,SAAST,GACT,MAAK,UACL,SAAQ,SAAO;AAAA,MAEjB,gBAAAO,EAACC,KACC,cAAYpB,GACZ,OAAM,UACN,UAAU,CAACQ,GACX,MAAM,gBAAAW,EAACE,KAAK,MAAK,UAAS,MAAK,KAAO,CAAA,GACtC,SAASN,GACT,MAAK,UACL,SAAQ,QAAO,CAAA;AAAA,IAAA,GAEnB;AAAA,IACCP,IACE,gBAAAW,EAAAG,GAAA,EAAO,KAAI,IAAG,KAAKd,GAAS,MAAK,KAAI,CAAA,IAEtC,gBAAAW,EAACI,KAAQ,KAAAlB,GAAU,SAAQ,SAAQ,MAAK,OAAM,SAAQ,WACvD;AAAA,EACH,EAAA,CAAA;AAEJ;"}

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

@@ -1,45 +1,46 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useState, useEffect } from "react";
-import { useTranslation } from "react-i18next";
-import { StringUtils } from "../../../utils/StringUtils.js";
-import useToggle from "../../../hooks/useToggle/useToggle.js";
-import { FormControl } from "../../../components/Form/FormControl.js";
-import { Label } from "../../../components/Label/Label.js";
-import { Input } from "../../../components/Input/Input.js";
-import { Checkbox } from "../../../components/Checkbox/Checkbox.js";
-const ExternalLinker = ({
-  link,
-  onChange,
-  multiNodeSelected = !1
+import { jsxs as i, jsx as s } from "react/jsx-runtime";
+import { useState as c, useEffect as f } from "react";
+import { useTranslation as T } from "react-i18next";
+import { StringUtils as u } from "../../../utils/StringUtils.js";
+import n from "../../../hooks/useToggle/useToggle.js";
+import { FormControl as b } from "../../../components/Form/FormControl.js";
+import { Label as d } from "../../../components/Label/Label.js";
+import { Input as L } from "../../../components/Input/Input.js";
+import { Checkbox as v } from "../../../components/Checkbox/Checkbox.js";
+const w = ({
+  link: t,
+  onChange: r,
+  multiNodeSelected: a = !1
 }) => {
   const {
-    t
-  } = useTranslation(), [linkText, setLinkText] = useState((link == null ? void 0 : link.text) || ""), [linkURL, setLinkURL] = useState((link == null ? void 0 : link.url) || ""), [isBlankTarget, toggleBlankTarget] = useToggle(link ? link.target === "_blank" : !0);
-  return useEffect(() => {
-    multiNodeSelected && (link != null && link.text) && setLinkText(link.text.slice(0, 20) + "...");
-  }, [multiNodeSelected, link]), useEffect(() => {
-    if (!linkURL.length) {
-      onChange == null || onChange();
+    t: l
+  } = T(), [m, p] = c((t == null ? void 0 : t.text) || ""), [e, h] = c((t == null ? void 0 : t.url) || ""), [x, g] = n(t ? t.target === "_blank" : !0);
+  return f(() => {
+    a && (t != null && t.text) && p(t.text.slice(0, 20) + "...");
+  }, [a, t]), f(() => {
+    if (!e.length) {
+      r == null || r();
       return;
     }
-    const newLink = {
-      url: linkURL,
-      text: multiNodeSelected ? link == null ? void 0 : link.text : linkText || linkURL,
-      target: isBlankTarget ? "_blank" : void 0
+    const o = {
+      url: e,
+      text: a ? t == null ? void 0 : t.text : m || e,
+      target: x ? "_blank" : void 0
     };
-    !StringUtils.isLocalURL(linkURL) && !StringUtils.startWithHttp(linkURL) && (newLink.url = "http://" + linkURL), onChange == null || onChange(newLink);
-  }, [linkText, linkURL, isBlankTarget]), /* @__PURE__ */ jsxs("div", { className: "d-flex flex-column flex-fill gap-24", children: [
-    /* @__PURE__ */ jsxs(FormControl, { id: "linkText", isOptional: !0, children: [
-      /* @__PURE__ */ jsx(Label, { children: t("bbm.linker.ext.text") }),
-      /* @__PURE__ */ jsx(Input, { type: "text", placeholder: t("bbm.linker.ext.text.placeholder"), size: "md", disabled: multiNodeSelected, value: linkText, onChange: (e) => setLinkText(e.target.value) })
+    !u.isLocalURL(e) && !u.startWithHttp(e) && (o.url = "http://" + e), r == null || r(o);
+  }, [m, e, x]), /* @__PURE__ */ i("div", { className: "d-flex flex-column flex-fill gap-24", children: [
+    /* @__PURE__ */ i(b, { id: "linkText", isOptional: !0, children: [
+      /* @__PURE__ */ s(d, { children: l("bbm.linker.ext.text") }),
+      /* @__PURE__ */ s(L, { type: "text", placeholder: l("bbm.linker.ext.text.placeholder"), size: "md", disabled: a, value: m, onChange: (o) => p(o.target.value) })
     ] }),
-    /* @__PURE__ */ jsxs(FormControl, { id: "linkUrl", isRequired: !0, children: [
-      /* @__PURE__ */ jsx(Label, { children: t("bbm.linker.ext.url") }),
-      /* @__PURE__ */ jsx(Input, { type: "text", placeholder: t("bbm.linker.ext.url.placeholder"), size: "md", value: linkURL, onChange: (e) => setLinkURL(e.target.value) })
+    /* @__PURE__ */ i(b, { id: "linkUrl", isRequired: !0, children: [
+      /* @__PURE__ */ s(d, { children: l("bbm.linker.ext.url") }),
+      /* @__PURE__ */ s(L, { type: "text", placeholder: l("bbm.linker.ext.url.placeholder"), size: "md", value: e, onChange: (o) => h(o.target.value) })
     ] }),
-    /* @__PURE__ */ jsx(Checkbox, { label: t("bbm.linker.open.tab"), onChange: () => toggleBlankTarget(), checked: isBlankTarget })
+    /* @__PURE__ */ s(v, { label: l("bbm.linker.open.tab"), onChange: () => g(), checked: x })
   ] });
 };
 export {
-  ExternalLinker as default
+  w as default
 };
+//# sourceMappingURL=ExternalLinker.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ExternalLinker.js","sources":["../../../../src/modules/multimedia/Linker/ExternalLinker.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { useTranslation } from 'react-i18next';\n\nimport { Checkbox, FormControl, Input, Label } from '../../../components';\nimport { useToggle } from '../../../hooks';\nimport { StringUtils } from '../../../utils/StringUtils';\n\n/**\n * Properties for the ExternalLink.\n */\nexport interface IExternalLink {\n  /** Link Url */\n  url: string;\n  /** Link text for the llink display */\n  text?: string;\n  /** Link target (default: _blank) */\n  target?: '_blank';\n}\n\n/**\n * Properties for the ExternalLinker react component.\n */\nexport type ExternalLinkerProps = {\n  /** Default link to update. */\n  link?: Partial<IExternalLink>;\n  /**\n   * Set true if the user select multiple nodes. (note simple text selection)\n   */\n  multiNodeSelected?: boolean;\n  /** Target */\n  target?: '_blank';\n  /** Notify when the user change any link information */\n  onChange?: (link?: IExternalLink) => void;\n};\n\nconst ExternalLinker = ({\n  link,\n  onChange,\n  multiNodeSelected = false,\n}: ExternalLinkerProps) => {\n  const { t } = useTranslation();\n\n  const [linkText, setLinkText] = useState<string>(link?.text || '');\n  const [linkURL, setLinkURL] = useState<string>(link?.url || '');\n  const [isBlankTarget, toggleBlankTarget] = useToggle(\n    link ? link.target === '_blank' : true,\n  );\n\n  useEffect(() => {\n    if (multiNodeSelected && link?.text) {\n      setLinkText(link.text.slice(0, 20) + '...');\n    }\n  }, [multiNodeSelected, link]);\n\n  useEffect(() => {\n    if (!linkURL.length) {\n      onChange?.();\n      return;\n    }\n\n    const newLink: IExternalLink = {\n      url: linkURL,\n      text: !multiNodeSelected ? linkText || linkURL : link?.text,\n      target: isBlankTarget ? '_blank' : undefined,\n    };\n    if (\n      !StringUtils.isLocalURL(linkURL) &&\n      !StringUtils.startWithHttp(linkURL)\n    ) {\n      newLink.url = 'http://' + linkURL;\n    }\n    onChange?.(newLink);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [linkText, linkURL, isBlankTarget]);\n\n  return (\n    <div className=\"d-flex flex-column flex-fill gap-24\">\n      <FormControl id=\"linkText\" isOptional>\n        <Label>{t('bbm.linker.ext.text')}</Label>\n        <Input\n          type=\"text\"\n          placeholder={t('bbm.linker.ext.text.placeholder')}\n          size=\"md\"\n          disabled={multiNodeSelected}\n          value={linkText}\n          onChange={(e) => setLinkText(e.target.value)}\n        />\n      </FormControl>\n      <FormControl id=\"linkUrl\" isRequired>\n        <Label>{t('bbm.linker.ext.url')}</Label>\n        <Input\n          type=\"text\"\n          placeholder={t('bbm.linker.ext.url.placeholder')}\n          size=\"md\"\n          value={linkURL}\n          onChange={(e) => setLinkURL(e.target.value)}\n        />\n      </FormControl>\n      <Checkbox\n        label={t('bbm.linker.open.tab')}\n        onChange={() => toggleBlankTarget()}\n        checked={isBlankTarget}\n      />\n    </div>\n  );\n};\n\nexport default ExternalLinker;\n"],"names":["ExternalLinker","link","onChange","multiNodeSelected","t","useTranslation","linkText","setLinkText","useState","text","linkURL","setLinkURL","url","isBlankTarget","toggleBlankTarget","useToggle","target","useEffect","slice","length","newLink","undefined","StringUtils","isLocalURL","startWithHttp","jsxs","FormControl","jsx","Label","Input","e","value","Checkbox"],"mappings":";;;;;;;;;AAoCA,MAAMA,IAAiBA,CAAC;AAAA,EACtBC,MAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,mBAAAA,IAAoB;AACD,MAAM;AACnB,QAAA;AAAA,IAAEC,GAAAA;AAAAA,MAAMC,EAAe,GAEvB,CAACC,GAAUC,CAAW,IAAIC,GAAiBP,KAAAA,gBAAAA,EAAMQ,SAAQ,EAAE,GAC3D,CAACC,GAASC,CAAU,IAAIH,GAAiBP,KAAAA,gBAAAA,EAAMW,QAAO,EAAE,GACxD,CAACC,GAAeC,CAAiB,IAAIC,EACzCd,IAAOA,EAAKe,WAAW,WAAW,EACpC;AAEAC,SAAAA,EAAU,MAAM;AACVd,IAAAA,MAAqBF,KAAAA,QAAAA,EAAMQ,SAC7BF,EAAYN,EAAKQ,KAAKS,MAAM,GAAG,EAAE,IAAI,KAAK;AAAA,EAC5C,GACC,CAACf,GAAmBF,CAAI,CAAC,GAE5BgB,EAAU,MAAM;AACV,QAAA,CAACP,EAAQS,QAAQ;AACR,MAAAjB,KAAA,QAAAA;AACX;AAAA,IACF;AAEA,UAAMkB,IAAyB;AAAA,MAC7BR,KAAKF;AAAAA,MACLD,MAAON,IAA0CF,KAAAA,gBAAAA,EAAMQ,OAA5BH,KAAYI;AAAAA,MACvCM,QAAQH,IAAgB,WAAWQ;AAAAA,IAAAA;AAGnC,IAAA,CAACC,EAAYC,WAAWb,CAAO,KAC/B,CAACY,EAAYE,cAAcd,CAAO,MAElCU,EAAQR,MAAM,YAAYF,IAE5BR,KAAAA,QAAAA,EAAWkB;AAAAA,EAEV,GAAA,CAACd,GAAUI,GAASG,CAAa,CAAC,GAGnC,gBAAAY,EAAC,OAAI,EAAA,WAAU,uCACb,UAAA;AAAA,IAAA,gBAAAA,EAACC,GAAY,EAAA,IAAG,YAAW,YAAU,IACnC,UAAA;AAAA,MAAC,gBAAAC,EAAAC,GAAA,EAAOxB,UAAEA,EAAA,qBAAqB,EAAE,CAAA;AAAA,MACjC,gBAAAuB,EAACE,KACC,MAAK,QACL,aAAazB,EAAE,iCAAiC,GAChD,MAAK,MACL,UAAUD,GACV,OAAOG,GACP,UAAWwB,CAAAA,MAAMvB,EAAYuB,EAAEd,OAAOe,KAAK,GAAE;AAAA,IAAA,GAEjD;AAAA,IACC,gBAAAN,EAAAC,GAAA,EAAY,IAAG,WAAU,YAAU,IAClC,UAAA;AAAA,MAAC,gBAAAC,EAAAC,GAAA,EAAOxB,UAAEA,EAAA,oBAAoB,EAAE,CAAA;AAAA,wBAC/ByB,GACC,EAAA,MAAK,QACL,aAAazB,EAAE,gCAAgC,GAC/C,MAAK,MACL,OAAOM,GACP,UAAWoB,CAAAA,MAAMnB,EAAWmB,EAAEd,OAAOe,KAAK,GAAE;AAAA,IAAA,GAEhD;AAAA,IACA,gBAAAJ,EAACK,GACC,EAAA,OAAO5B,EAAE,qBAAqB,GAC9B,UAAU,MAAMU,EAAAA,GAChB,SAASD,EAAc,CAAA;AAAA,EAE3B,EAAA,CAAA;AAEJ;"}

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

@@ -1,4 +1,4 @@
-import { App, ILinkedResource } from 'edifice-ts-client';
+import { App, ILinkedResource } from '@edifice.io/ts-client';
 /**
  * Definition of an internal link.
  */

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

@@ -1,114 +1,115 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useState, useCallback, useEffect } from "react";
-import { odeServices } from "edifice-ts-client";
-import { useTranslation } from "react-i18next";
-import { LinkerCard } from "../LinkerCard/LinkerCard.js";
-import { useResourceSearch } from "../../../core/useResourceSearch/useResourceSearch.js";
-import useDebounce from "../../../hooks/useDebounce/useDebounce.js";
-import { SearchBar } from "../../../components/SearchBar/SearchBar.js";
-import { EmptyScreen } from "../../../components/EmptyScreen/EmptyScreen.js";
-import usePaths from "../../../core/usePaths/usePaths.js";
-import { useOdeTheme } from "../../../core/ThemeProvider/ThemeProvider.js";
-import { AppIcon } from "../../../components/AppIcon/AppIcon.js";
-import { Dropdown } from "../../../components/Dropdown/Dropdown.js";
-import { Icon } from "../../../components/Icon/Icon.js";
-const InternalLinker = ({
-  appCode,
-  defaultAppCode,
-  defaultResourceId,
-  onChange,
-  onSelect,
-  multiple = !0
+import { jsx as s, jsxs as b } from "react/jsx-runtime";
+import { useState as f, useCallback as u, useEffect as h } from "react";
+import { odeServices as G } from "@edifice.io/ts-client";
+import { useTranslation as H } from "react-i18next";
+import { LinkerCard as J } from "../LinkerCard/LinkerCard.js";
+import { useResourceSearch as K } from "../../../core/useResourceSearch/useResourceSearch.js";
+import Q from "../../../hooks/useDebounce/useDebounce.js";
+import { SearchBar as U } from "../../../components/SearchBar/SearchBar.js";
+import { EmptyScreen as V } from "../../../components/EmptyScreen/EmptyScreen.js";
+import X from "../../../core/usePaths/usePaths.js";
+import { useOdeTheme as Y } from "../../../core/ThemeProvider/ThemeProvider.js";
+import { AppIcon as Z } from "../../../components/AppIcon/AppIcon.js";
+import { Dropdown as x } from "../../../components/Dropdown/Dropdown.js";
+import { Icon as ee } from "../../../components/Icon/Icon.js";
+const he = ({
+  appCode: E,
+  defaultAppCode: C,
+  defaultResourceId: y,
+  onChange: N,
+  onSelect: v,
+  multiple: L = !0
 }) => {
   const {
-    t
-  } = useTranslation(), {
-    theme
-  } = useOdeTheme(), [imagePath] = usePaths(), {
-    resourceApplications,
-    loadResources
-  } = useResourceSearch(appCode), [options, setOptions] = useState(), [selectedApplication, setSelectedApplication] = useState(), [searchTerms, setSearchTerms] = useState(), debounceSearch = useDebounce(searchTerms || "", 500), [resources, setResources] = useState([]), loadAndDisplayResources = useCallback((search) => {
-    async function load() {
-      if (selectedApplication)
+    t: d
+  } = H(), {
+    theme: m
+  } = Y(), [D] = X(), {
+    resourceApplications: w,
+    loadResources: T
+  } = K(E), [c, B] = f(), [o, P] = f(), [S, M] = f(), R = Q(S || "", 500), [i, $] = f([]), p = u((e) => {
+    async function t() {
+      if (o)
         try {
-          const searchLower = search == null ? void 0 : search.toLowerCase(), resources2 = (await loadResources({
-            application: selectedApplication.application,
-            search,
-            types: [selectedApplication.application],
+          const r = e == null ? void 0 : e.toLowerCase(), a = (await T({
+            application: o.application,
+            search: e,
+            types: [o.application],
             filters: {},
             pagination: {
               startIdx: 0,
               pageSize: 300
             }
             // ignored at the moment
-          })).filter((resource) => {
-            var _a, _b, _c;
-            return !searchLower || searchLower.length === 0 ? !0 : ((_a = resource.name) == null ? void 0 : _a.toLowerCase().includes(searchLower)) || ((_b = resource.creatorName) == null ? void 0 : _b.toLowerCase().includes(searchLower)) || ((_c = resource.description) == null ? void 0 : _c.toLowerCase().includes(searchLower)) || !1;
-          }).sort((a, b) => a.modifiedAt < b.modifiedAt ? 1 : -1);
-          setResources(resources2);
+          })).filter((n) => {
+            var A, z, O;
+            return !r || r.length === 0 ? !0 : ((A = n.name) == null ? void 0 : A.toLowerCase().includes(r)) || ((z = n.creatorName) == null ? void 0 : z.toLowerCase().includes(r)) || ((O = n.description) == null ? void 0 : O.toLowerCase().includes(r)) || !1;
+          }).sort((n, j) => n.modifiedAt < j.modifiedAt ? 1 : -1);
+          $(a);
           return;
         } catch {
         }
-      setResources([]);
+      $([]);
     }
-    load();
-  }, [loadResources, selectedApplication]), [selectedDocuments, setSelectedDocuments] = useState([]), handleOptionClick = (option) => {
-    onChange == null || onChange(option), setSelectedApplication(option);
-  }, handleSearchChange = (event) => {
-    const newText = event.target.value;
-    setSearchTerms(newText.toString());
-  }, handleSubmit = useCallback((event) => {
-    loadAndDisplayResources(searchTerms), event.stopPropagation(), event.preventDefault();
-  }, [loadAndDisplayResources, searchTerms]), getSelectedResourceIndex = useCallback((resourceId) => selectedDocuments.findIndex((selectedDocument) => selectedDocument.assetId === resourceId), [selectedDocuments]), selectResource = useCallback((resource) => {
-    setSelectedDocuments(multiple ? (previousState) => [...previousState, resource] : [resource]);
-  }, [setSelectedDocuments, multiple]), toggleResourceSelection = useCallback((resource) => {
-    const index = getSelectedResourceIndex(resource.assetId);
-    index < 0 ? selectResource(resource) : setSelectedDocuments(selectedDocuments.filter((_value, i) => i !== index));
-  }, [getSelectedResourceIndex, selectResource, selectedDocuments]);
-  return useEffect(() => {
+    t();
+  }, [T, o]), [l, g] = f([]), W = (e) => {
+    N == null || N(e), P(e);
+  }, _ = (e) => {
+    const t = e.target.value;
+    M(t.toString());
+  }, q = u((e) => {
+    p(S), e.stopPropagation(), e.preventDefault();
+  }, [p, S]), k = u((e) => l.findIndex((t) => t.assetId === e), [l]), I = u((e) => {
+    g(L ? (t) => [...t, e] : [e]);
+  }, [g, L]), F = u((e) => {
+    const t = k(e.assetId);
+    t < 0 ? I(e) : g(l.filter((r, a) => a !== t));
+  }, [k, I, l]);
+  return h(() => {
     (async () => {
-      const appPromises = resourceApplications.map((application) => odeServices.session().getWebApp(application)), webApps = await Promise.all(appPromises);
-      setOptions(resourceApplications.map((application, index) => {
-        var _a;
+      const e = w.map((r) => G.session().getWebApp(r)), t = await Promise.all(e);
+      B(w.map((r, a) => {
+        var n;
         return {
-          application,
-          displayName: t(((_a = webApps[index]) == null ? void 0 : _a.displayName) ?? application),
-          icon: /* @__PURE__ */ jsx(AppIcon, { app: webApps[index] })
+          application: r,
+          displayName: d(((n = t[a]) == null ? void 0 : n.displayName) ?? r),
+          icon: /* @__PURE__ */ s(Z, { app: t[a] })
         };
-      }).sort((app1, app2) => app1.displayName.localeCompare(app2.displayName)));
+      }).sort((r, a) => r.displayName.localeCompare(a.displayName)));
     })();
-  }, [resourceApplications, t]), useEffect(() => {
-    loadAndDisplayResources(debounceSearch);
-  }, [loadAndDisplayResources, debounceSearch]), useEffect(() => {
-    onSelect == null || onSelect(selectedDocuments);
-  }, [selectedDocuments]), useEffect(() => {
-    if (defaultAppCode) {
-      const option = options == null ? void 0 : options.find((option2) => defaultAppCode === option2.application);
-      setSelectedApplication(option), loadAndDisplayResources("");
+  }, [w, d]), h(() => {
+    p(R);
+  }, [p, R]), h(() => {
+    v == null || v(l);
+  }, [l]), h(() => {
+    if (C) {
+      const e = c == null ? void 0 : c.find((t) => C === t.application);
+      P(e), p("");
     }
-  }, [options]), useEffect(() => {
-    if (defaultResourceId && getSelectedResourceIndex(defaultResourceId) < 0) {
-      const resource = resources == null ? void 0 : resources.find((resource2) => defaultResourceId === resource2.assetId);
-      resource && selectResource(resource);
+  }, [c]), h(() => {
+    if (y && k(y) < 0) {
+      const e = i == null ? void 0 : i.find((t) => y === t.assetId);
+      e && I(e);
     }
-  }, [resources]), /* @__PURE__ */ jsxs("div", { className: "d-flex flex-column flex-fill overflow-hidden", children: [
-    /* @__PURE__ */ jsxs("div", { className: "search d-flex bg-light rounded-top border border-bottom-0", children: [
-      /* @__PURE__ */ jsx("div", { className: "flex-shrink-1 px-8 py-12 border-end", children: /* @__PURE__ */ jsxs(Dropdown, { overflow: !0, children: [
-        /* @__PURE__ */ jsx(Dropdown.Trigger, { icon: /* @__PURE__ */ jsx("div", { className: "pe-8", children: (selectedApplication == null ? void 0 : selectedApplication.icon) || /* @__PURE__ */ jsx(Icon, { name: "applications" }) }), label: t((selectedApplication == null ? void 0 : selectedApplication.displayName) || "bbm.linker.int.choose"), variant: "ghost", size: "md" }),
-        /* @__PURE__ */ jsx(Dropdown.Menu, { children: options == null ? void 0 : options.map((option) => /* @__PURE__ */ jsx(Dropdown.Item, { icon: option.icon, onClick: () => handleOptionClick(option), children: option.displayName }, option.application)) })
+  }, [i]), /* @__PURE__ */ b("div", { className: "d-flex flex-column flex-fill overflow-hidden", children: [
+    /* @__PURE__ */ b("div", { className: "search d-flex bg-light rounded-top border border-bottom-0", children: [
+      /* @__PURE__ */ s("div", { className: "flex-shrink-1 px-8 py-12 border-end", children: /* @__PURE__ */ b(x, { overflow: !0, children: [
+        /* @__PURE__ */ s(x.Trigger, { icon: /* @__PURE__ */ s("div", { className: "pe-8", children: (o == null ? void 0 : o.icon) || /* @__PURE__ */ s(ee, { name: "applications" }) }), label: d((o == null ? void 0 : o.displayName) || "bbm.linker.int.choose"), variant: "ghost", size: "md" }),
+        /* @__PURE__ */ s(x.Menu, { children: c == null ? void 0 : c.map((e) => /* @__PURE__ */ s(x.Item, { icon: e.icon, onClick: () => W(e), children: e.displayName }, e.application)) })
       ] }) }),
-      /* @__PURE__ */ jsx("div", { className: "flex-grow-1 align-self-center", children: /* @__PURE__ */ jsx("form", { className: "gap-16 d-flex w-100 align-items-center px-16 py-8", onSubmit: handleSubmit, children: /* @__PURE__ */ jsx(SearchBar, { isVariant: !0, placeholder: t("search"), size: "lg", className: "w-100", disabled: !selectedApplication, onChange: handleSearchChange }) }) })
+      /* @__PURE__ */ s("div", { className: "flex-grow-1 align-self-center", children: /* @__PURE__ */ s("form", { className: "gap-16 d-flex w-100 align-items-center px-16 py-8", onSubmit: q, children: /* @__PURE__ */ s(U, { isVariant: !0, placeholder: d("search"), size: "lg", className: "w-100", disabled: !o, onChange: _ }) }) })
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: "internal-linker flex-grow-1 w-100 rounded-bottom border gap-0 overflow-auto", children: [
-      selectedApplication && resources && resources.length > 0 && /* @__PURE__ */ jsx("div", { children: resources.map((resource) => {
-        const isSelected = selectedDocuments.findIndex((doc) => doc.assetId === resource.assetId) >= 0;
-        return /* @__PURE__ */ jsx(LinkerCard, { doc: resource, isSelected, onClick: () => toggleResourceSelection(resource) }, resource.path);
+    /* @__PURE__ */ b("div", { className: "internal-linker flex-grow-1 w-100 rounded-bottom border gap-0 overflow-auto", children: [
+      o && i && i.length > 0 && /* @__PURE__ */ s("div", { children: i.map((e) => {
+        const t = l.findIndex((r) => r.assetId === e.assetId) >= 0;
+        return /* @__PURE__ */ s(J, { doc: e, isSelected: t, onClick: () => F(e) }, e.path);
       }) }),
-      selectedApplication && resources && resources.length <= 0 && /* @__PURE__ */ jsx("div", { className: "d-flex justify-content-center mt-16", children: /* @__PURE__ */ jsx(EmptyScreen, { imageSrc: `${imagePath}/${theme == null ? void 0 : theme.bootstrapVersion}/illu-empty-search-${selectedApplication.application}.svg`, text: t("bbm.linker.int.notfound"), className: "mt-16" }) }),
-      !selectedApplication && /* @__PURE__ */ jsx("div", { className: "d-flex justify-content-center mt-32", children: /* @__PURE__ */ jsx(EmptyScreen, { imageSrc: `${imagePath}/${theme == null ? void 0 : theme.bootstrapVersion}/illu-empty-search.svg`, text: t("bbm.linker.int.empty"), className: "mt-32" }) })
+      o && i && i.length <= 0 && /* @__PURE__ */ s("div", { className: "d-flex justify-content-center mt-16", children: /* @__PURE__ */ s(V, { imageSrc: `${D}/${m == null ? void 0 : m.bootstrapVersion}/illu-empty-search-${o.application}.svg`, text: d("bbm.linker.int.notfound"), className: "mt-16" }) }),
+      !o && /* @__PURE__ */ s("div", { className: "d-flex justify-content-center mt-32", children: /* @__PURE__ */ s(V, { imageSrc: `${D}/${m == null ? void 0 : m.bootstrapVersion}/illu-empty-search.svg`, text: d("bbm.linker.int.empty"), className: "mt-32" }) })
     ] })
   ] });
 };
 export {
-  InternalLinker as default
+  he as default
 };
+//# sourceMappingURL=InternalLinker.js.map