@manifest-editor/creators 1.3.0 → 1.3.1

package/dist/index.cjs

@@ -36,7 +36,7 @@ __export(iiif_browser_form_lazy_exports, {
   default: () => IIIFBrowserCreatorForm
 });
 function IIIFBrowserCreatorForm(props) {
-  const vault = (0, import_shell3.usePreviewVault)();
+  const vault = (0, import_react7.useMemo)(() => new import_helpers3.Vault(), []);
   const output = (0, import_react7.useMemo)(() => {
     return [
       {
@@ -54,27 +54,38 @@ function IIIFBrowserCreatorForm(props) {
       }
     ];
   }, [props.runCreate]);
+  const navigationOptions = (0, import_react7.useMemo)(() => {
+    return {
+      canCropImage: true,
+      canSelectCanvas: true,
+      canSelectManifest: false,
+      canSelectCollection: false,
+      // @todo fix the output so this one works.
+      multiSelect: false
+    };
+  }, []);
+  const uiOptions = (0, import_react7.useMemo)(() => {
+    return {
+      buttonClassName: "bg-me-primary-500 text-white hover:bg-me-primary-600"
+    };
+  }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_shell3.PreviewVaultBoundary, { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     import_iiif_browser2.IIIFBrowser,
     {
+      debug: true,
+      ui: uiOptions,
       vault,
       className: "iiif-browser border-none border-t rounded-none h-[70vh] min-h-[60vh] max-h-full max-w-full",
       output,
-      navigation: {
-        canCropImage: true,
-        canSelectCanvas: true,
-        canSelectManifest: false,
-        canSelectCollection: false,
-        // @todo fix the output so this one works.
-        multiSelect: false
-      }
+      navigation: navigationOptions
     }
   ) });
 }
-var import_shell3, import_iiif_browser2, import_react7, import_jsx_runtime27;
+var import_helpers3, import_shell3, import_iiif_browser2, import_react7, import_jsx_runtime27;
 var init_iiif_browser_form_lazy = __esm({
   "src/ContentResource/IIIFBrowserCreator/iiif-browser-form.lazy.tsx"() {
     "use strict";
+    import_helpers3 = require("@iiif/helpers");
     import_shell3 = require("@manifest-editor/shell");
     import_iiif_browser2 = require("iiif-browser");
     import_react7 = require("react");
@@ -125,11 +136,39 @@ var init_manifest_browser_form_lazy = __esm({
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
+  CreateAudioAnnotationForm: () => CreateAudioAnnotationForm,
+  CreateCaptionedImageAnnotation: () => CreateCaptionedImageAnnotation,
+  CreateHTMLAnnotation: () => CreateHTMLAnnotation,
+  CreateHTMLBodyForm: () => CreateHTMLBodyForm,
+  CreateImageServerForm: () => CreateImageServerForm,
+  CreateImageServiceAnnotationForm: () => CreateImageServiceAnnotationForm,
+  CreateImageUrlAnnotationForm: () => CreateImageUrlAnnotationForm,
+  CreateImageUrlForm: () => CreateImageUrlForm,
+  CreatePlaintextForm: () => CreatePlaintextForm,
+  CreateVideoAnnotationForm: () => CreateVideoAnnotationForm,
+  CreateWebPageForm: () => CreateWebPageForm,
+  IIIFBrowserCreatorForm: () => IIIFBrowserCreatorForm2,
+  YouTubeForm: () => YouTubeForm,
   allCreators: () => allCreators,
   audioAnnotation: () => audioAnnotation,
   captionedImageAnnotation: () => captionedImageAnnotation,
+  createAudioAnnotation: () => createAudioAnnotation,
+  createCaptionedImageAnnotation: () => createCaptionedImageAnnotation,
+  createFromIIIFBrowserOutput: () => createFromIIIFBrowserOutput,
+  createHtmlAnnotation: () => createHtmlAnnotation,
+  createHtmlBody: () => createHtmlBody,
+  createImageServer: () => createImageServer,
+  createImageServiceAnnotation: () => createImageServiceAnnotation,
+  createImageUrl: () => createImageUrl,
+  createImageUrlAnnotation: () => createImageUrlAnnotation,
+  createNoBodyAnnotation: () => createNoBodyAnnotation,
+  createPlaintext: () => createPlaintext,
+  createVideoAnnotation: () => createVideoAnnotation,
+  createWebPage: () => createWebPage,
+  createYoutubeBody: () => createYoutubeBody,
   emptyAnnotationPage: () => emptyAnnotationPage,
   emptyCanvas: () => emptyCanvas,
+  getYouTubeId: () => getYouTubeId,
   htmlAnnotation: () => htmlAnnotation,
   htmlBodyCreator: () => htmlBodyCreator,
   iiifBrowserCreator: () => iiifBrowserCreator,
@@ -141,12 +180,16 @@ __export(src_exports, {
   manifestBrowserCreator: () => manifestBrowserCreator,
   noBodyAnnotation: () => noBodyAnnotation,
   plaintextCreator: () => plaintextCreator,
+  validateYouTube: () => validateYouTube,
   videoAnnotation: () => videoAnnotation,
   webPageCreator: () => webPageCreator,
   youTubeBodyCreator: () => youTubeBodyCreator
 });
 module.exports = __toCommonJS(src_exports);
 
+// src/Annotation/AudioAnnotation/index.tsx
+var import_components2 = require("@manifest-editor/components");
+
 // src/Annotation/AudioAnnotation/create-audio-annotation.tsx
 var import_react2 = require("react");
 
@@ -542,12 +585,18 @@ async function createAudioAnnotation(data, ctx) {
   }
   if (targetType === "Canvas") {
     const canvasId = ctx.generateId("canvas");
-    const pageId = ctx.generateId("annotation-page", { id: canvasId, type: "Canvas" });
+    const pageId = ctx.generateId("annotation-page", {
+      id: canvasId,
+      type: "Canvas"
+    });
     const annotationResource = ctx.embed({
       ...annotation,
       motivation: "painting",
       body,
-      target: { type: "SpecificResource", source: { id: canvasId, type: "Canvas" } }
+      target: {
+        type: "SpecificResource",
+        source: { id: canvasId, type: "Canvas" }
+      }
     });
     const page = ctx.embed({
       id: pageId,
@@ -587,7 +636,15 @@ function CreateAudioAnnotationForm(props) {
     error ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_components.ErrorMessage, { children: error }) : null,
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_editors.InputContainer, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_editors.InputLabel, { htmlFor: "audio-url", children: "URL" }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_editors.Input, { type: "text", id: "audio-url", value: url, onChange: (e) => setUrl(e.target.value) })
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        import_editors.Input,
+        {
+          type: "text",
+          id: "audio-url",
+          value: url,
+          onChange: (e) => setUrl(e.target.value)
+        }
+      )
     ] }),
     url && !error ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
       import_editors.LanguageFieldEditor,
@@ -600,24 +657,38 @@ function CreateAudioAnnotationForm(props) {
       },
       url + "__" + duration
     ) }) : null,
-    url && !error ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_iiif_vault2.CanvasPanel.AudioHTML, { media: { url, duration, type: "Sound" }, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      MediaControls,
+    url && !error ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      import_react_iiif_vault2.CanvasPanel.AudioHTML,
       {
-        onError: (error2) => setError(error2),
-        onDuration: (duration2) => setDuration(duration2)
+        media: { url, duration, type: "Sound" },
+        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          MediaControls,
+          {
+            onError: (error2) => setError(error2),
+            onDuration: (duration2) => setDuration(duration2)
+          },
+          url + "__" + duration
+        )
       },
       url + "__" + duration
-    ) }, url + "__" + duration) : null,
+    ) : null,
     duration && !error ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_editors.FormFieldWrapper, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_editors.InputLabel, { htmlFor: "duration", children: "Duration" }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_editors.Input, { type: "number", id: "duration", value: duration, onChange: (e) => setDuration(e.target.valueAsNumber) })
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        import_editors.Input,
+        {
+          type: "number",
+          id: "duration",
+          value: duration,
+          onChange: (e) => setDuration(e.target.valueAsNumber)
+        }
+      )
     ] }) : null,
     url && !error && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Button, { onClick: onSubmit, children: "Add audio" })
   ] });
 }
 
 // src/Annotation/AudioAnnotation/index.tsx
-var import_components2 = require("@manifest-editor/components");
 var import_jsx_runtime5 = require("react/jsx-runtime");
 var audioAnnotation = {
   id: "@manifest-editor/audio-annotation",
@@ -775,6 +846,9 @@ var captionedImageAnnotation = {
   }
 };
 
+// src/Annotation/HTMLAnnotation/index.tsx
+var import_components4 = require("@manifest-editor/components");
+
 // src/Annotation/HTMLAnnotation/create-html-annotation.tsx
 var import_react4 = require("react");
 var import_editors3 = require("@manifest-editor/editors");
@@ -865,7 +939,6 @@ function CreateHTMLAnnotation(props) {
 }
 
 // src/Annotation/HTMLAnnotation/index.tsx
-var import_components4 = require("@manifest-editor/components");
 var import_jsx_runtime9 = require("react/jsx-runtime");
 var htmlAnnotation = {
   id: "@manifest-editor/html-annotation",
@@ -889,6 +962,9 @@ var htmlAnnotation = {
   }
 };
 
+// src/Annotation/ImageServiceAnnotation/index.tsx
+var import_components5 = require("@manifest-editor/components");
+
 // src/side-effects/reposition-multiple-images.ts
 var import_image_3 = require("@iiif/parser/image-3");
 var import_editor_api = require("@manifest-editor/editor-api");
@@ -912,7 +988,7 @@ var repositionMultipleImages = {
       if (!annoPage) {
         return;
       }
-      if (annoPage.items.length < 2) {
+      if (annoPage.items.length < 2 && !canvas.behavior.includes("multi-image")) {
         return;
       }
       const bodies = vault.get(fullAnno.body);
@@ -923,10 +999,18 @@ var repositionMultipleImages = {
       if (imageService) {
         if (imageService.width && imageService.height) {
           if (imageService.width !== body.width) {
-            vault.modifyEntityField({ id: body.id, type: "ContentResource" }, "width", imageService.width);
+            vault.modifyEntityField(
+              { id: body.id, type: "ContentResource" },
+              "width",
+              imageService.width
+            );
           }
           if (imageService.height !== body.height) {
-            vault.modifyEntityField({ id: body.id, type: "ContentResource" }, "height", imageService.height);
+            vault.modifyEntityField(
+              { id: body.id, type: "ContentResource" },
+              "height",
+              imageService.height
+            );
           }
         }
       }
@@ -970,6 +1054,9 @@ var resizeResourceToEmptyCanvas = {
       if (!canvas.items) {
         return;
       }
+      if (canvas.behavior.includes("multi-image")) {
+        return;
+      }
       const annoPage = vault.get(canvas.items[0]);
       if (!annoPage) {
         return;
@@ -1027,6 +1114,9 @@ var resizeToFitService = {
       if (!canvas.items) {
         return;
       }
+      if (canvas.behavior.includes("multi-image")) {
+        return;
+      }
       const annoPage = vault.get(canvas.items[0]);
       if (!annoPage) {
         return;
@@ -1042,10 +1132,18 @@ var resizeToFitService = {
       if (imageService) {
         if (imageService.width && imageService.height) {
           if (imageService.width !== body.width) {
-            vault.modifyEntityField({ id: body.id, type: "ContentResource" }, "width", imageService.width);
+            vault.modifyEntityField(
+              { id: body.id, type: "ContentResource" },
+              "width",
+              imageService.width
+            );
           }
           if (imageService.height !== body.height) {
-            vault.modifyEntityField({ id: body.id, type: "ContentResource" }, "height", imageService.height);
+            vault.modifyEntityField(
+              { id: body.id, type: "ContentResource" },
+              "height",
+              imageService.height
+            );
           }
         }
       }
@@ -1125,9 +1223,13 @@ async function createImageServiceAnnotation(data, ctx) {
     type: "Annotation"
   };
   const targetType = ctx.options.targetType;
-  const resource = await ctx.create("@manifest-editor/image-service-creator", data, {
-    parent: { resource: annotation, property: "body" }
-  });
+  const resource = await ctx.create(
+    "@manifest-editor/image-service-creator",
+    data,
+    {
+      parent: { resource: annotation, property: "body" }
+    }
+  );
   if (targetType === "Annotation") {
     return {
       ...annotation,
@@ -1138,12 +1240,18 @@ async function createImageServiceAnnotation(data, ctx) {
   }
   if (targetType === "Canvas") {
     const canvasId = ctx.generateId("canvas");
-    const pageId = ctx.generateId("annotation-page", { id: canvasId, type: "Canvas" });
+    const pageId = ctx.generateId("annotation-page", {
+      id: canvasId,
+      type: "Canvas"
+    });
     const annotationResource = ctx.embed({
       ...annotation,
       motivation: "painting",
       body: [resource],
-      target: { type: "SpecificResource", source: { id: canvasId, type: "Canvas" } }
+      target: {
+        type: "SpecificResource",
+        source: { id: canvasId, type: "Canvas" }
+      }
     });
     const page = ctx.embed({
       id: pageId,
@@ -1165,7 +1273,6 @@ function CreateImageServiceAnnotationForm(props) {
 }
 
 // src/Annotation/ImageServiceAnnotation/index.tsx
-var import_components5 = require("@manifest-editor/components");
 var import_jsx_runtime12 = require("react/jsx-runtime");
 var imageServiceAnnotation = {
   id: "@manifest-editor/image-service-annotation",
@@ -1185,12 +1292,19 @@ var imageServiceAnnotation = {
     parentTypes: ["AnnotationPage", "Manifest"],
     parentFields: ["items"]
   },
-  sideEffects: [resizeToFitService, resizeResourceToEmptyCanvas, repositionMultipleImages],
+  sideEffects: [
+    resizeToFitService,
+    resizeResourceToEmptyCanvas,
+    repositionMultipleImages
+  ],
   staticFields: {
     type: "Annotation"
   }
 };
 
+// src/Annotation/ImageUrlAnnotation/index.tsx
+var import_components6 = require("@manifest-editor/components");
+
 // src/ContentResource/ImageUrlCreator/create-image-url.tsx
 var import_editors6 = require("@manifest-editor/editors");
 var import_shell = require("@manifest-editor/shell");
@@ -1238,9 +1352,13 @@ async function createImageUrlAnnotation(data, ctx) {
     type: "Annotation"
   };
   const targetType = ctx.options.targetType;
-  const resource = await ctx.create("@manifest-editor/image-url-creator", data, {
-    parent: { resource: annotation, property: "body" }
-  });
+  const resource = await ctx.create(
+    "@manifest-editor/image-url-creator",
+    data,
+    {
+      parent: { resource: annotation, property: "body" }
+    }
+  );
   if (targetType === "Annotation") {
     return {
       ...annotation,
@@ -1251,12 +1369,18 @@ async function createImageUrlAnnotation(data, ctx) {
   }
   if (targetType === "Canvas") {
     const canvasId = ctx.generateId("canvas");
-    const pageId = ctx.generateId("annotation-page", { id: canvasId, type: "Canvas" });
+    const pageId = ctx.generateId("annotation-page", {
+      id: canvasId,
+      type: "Canvas"
+    });
     const annotationResource = ctx.embed({
       ...annotation,
       motivation: "painting",
       body: [resource],
-      target: { type: "SpecificResource", source: { id: canvasId, type: "Canvas" } }
+      target: {
+        type: "SpecificResource",
+        source: { id: canvasId, type: "Canvas" }
+      }
     });
     const page = ctx.embed({
       id: pageId,
@@ -1278,7 +1402,6 @@ function CreateImageUrlAnnotationForm(props) {
 }
 
 // src/Annotation/ImageUrlAnnotation/index.tsx
-var import_components6 = require("@manifest-editor/components");
 var import_jsx_runtime15 = require("react/jsx-runtime");
 var imageUrlAnnotation = {
   id: "@manifest-editor/image-url-annotation",
@@ -1298,7 +1421,11 @@ var imageUrlAnnotation = {
     parentTypes: ["AnnotationPage", "Manifest"],
     parentFields: ["items"]
   },
-  sideEffects: [resizeToFitService, resizeResourceToEmptyCanvas, repositionMultipleImages],
+  sideEffects: [
+    resizeToFitService,
+    resizeResourceToEmptyCanvas,
+    repositionMultipleImages
+  ],
   staticFields: {
     type: "Annotation"
   }
@@ -1336,11 +1463,13 @@ function createNoBodyAnnotation(data, ctx) {
   });
 }
 
+// src/Annotation/VideoAnnotation/index.tsx
+var import_components9 = require("@manifest-editor/components");
+
 // src/Annotation/VideoAnnotation/create-video-annotation.tsx
 var import_helpers2 = require("@iiif/helpers");
-var import_editors7 = require("@manifest-editor/editors");
 var import_components8 = require("@manifest-editor/components");
-var import_react5 = require("react");
+var import_editors7 = require("@manifest-editor/editors");
 
 // ../ui/ui/VideoPlayer/VideoPlayer.tsx
 var import_react_iiif_vault3 = require("react-iiif-vault");
@@ -1380,6 +1509,7 @@ function VideoPlayer({
 }
 
 // src/Annotation/VideoAnnotation/create-video-annotation.tsx
+var import_react5 = require("react");
 var import_jsx_runtime18 = require("react/jsx-runtime");
 async function createVideoAnnotation(data, ctx) {
   const annotation = {
@@ -1387,7 +1517,7 @@ async function createVideoAnnotation(data, ctx) {
     type: "Annotation"
   };
   const targetType = ctx.options.targetType;
-  const body = await ctx.embed({
+  const body = ctx.embed({
     id: data.url,
     type: "Video",
     format: "video/mp4",
@@ -1406,12 +1536,18 @@ async function createVideoAnnotation(data, ctx) {
   }
   if (targetType === "Canvas") {
     const canvasId = ctx.generateId("canvas");
-    const pageId = ctx.generateId("annotation-page", { id: canvasId, type: "Canvas" });
+    const pageId = ctx.generateId("annotation-page", {
+      id: canvasId,
+      type: "Canvas"
+    });
     const annotationResource = ctx.embed({
       ...annotation,
       motivation: "painting",
       body,
-      target: { type: "SpecificResource", source: { id: canvasId, type: "Canvas" } }
+      target: {
+        type: "SpecificResource",
+        source: { id: canvasId, type: "Canvas" }
+      }
     });
     const page = ctx.embed({
       id: pageId,
@@ -1457,7 +1593,15 @@ function CreateVideoAnnotationForm(props) {
     error ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_components8.ErrorMessage, { children: error }) : null,
     /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_editors7.InputContainer, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_editors7.InputLabel, { htmlFor: "video-url", children: "URL" }),
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_editors7.Input, { type: "text", id: "video-url", value: url, onChange: (e) => setUrl(e.target.value) })
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+        import_editors7.Input,
+        {
+          type: "text",
+          id: "video-url",
+          value: url,
+          onChange: (e) => setUrl(e.target.value)
+        }
+      )
     ] }),
     url && !error ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
       import_editors7.LanguageFieldEditor,
@@ -1508,7 +1652,6 @@ function CreateVideoAnnotationForm(props) {
 }
 
 // src/Annotation/VideoAnnotation/index.tsx
-var import_components9 = require("@manifest-editor/components");
 var import_jsx_runtime19 = require("react/jsx-runtime");
 var videoAnnotation = {
   id: "@manifest-editor/video-annotation",
@@ -1554,7 +1697,14 @@ var ThumbnailStripIcon = () => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
 var import_jsx_runtime21 = require("react/jsx-runtime");
 var emptyAnnotationPage = {
   id: "@manifest-editor/empty-annotation-page",
-  create: createEmptyAnnotationPage,
+  create: (data, ctx) => {
+    return ctx.embed({
+      id: ctx.generateId("annotations"),
+      label: data.label,
+      type: "AnnotationPage",
+      items: []
+    });
+  },
   label: "Empty annotation page",
   summary: "AnnotationPage with nothing",
   icon: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ThumbnailStripIcon, {}),
@@ -1569,21 +1719,28 @@ var emptyAnnotationPage = {
     }
   }
 };
-async function createEmptyAnnotationPage(data, ctx) {
-  return ctx.embed({
-    id: ctx.generateId("annotations"),
-    label: data.label,
-    type: "AnnotationPage",
-    items: []
-  });
-}
 
 // src/Canvas/EmptyCanvas/index.tsx
 var import_components10 = require("@manifest-editor/components");
 var import_jsx_runtime22 = require("react/jsx-runtime");
 var emptyCanvas = {
   id: "@manifest-editor/empty-canvas",
-  create: createEmptyCanvas,
+  create: (data, ctx) => {
+    const canvasId = ctx.generateId("canvas");
+    const page = ctx.embed({
+      id: ctx.generateId("annotation-page", { id: canvasId, type: "Canvas" }),
+      type: "AnnotationPage",
+      items: []
+    });
+    return {
+      id: canvasId,
+      type: "Canvas",
+      label: data.label || { en: [""] },
+      height: data.height || 1e3,
+      width: data.width || 1e3,
+      items: [page]
+    };
+  },
   label: "Empty canvas",
   summary: "No content",
   icon: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_components10.EmptyCanvasIcon, {}),
@@ -1594,24 +1751,9 @@ var emptyCanvas = {
     parentFields: ["items"]
   }
 };
-async function createEmptyCanvas(data, ctx) {
-  const canvasId = ctx.generateId("canvas");
-  const page = ctx.embed({
-    id: ctx.generateId("annotation-page", { id: canvasId, type: "Canvas" }),
-    type: "AnnotationPage",
-    items: []
-  });
-  return {
-    id: canvasId,
-    type: "Canvas",
-    label: data.label || { en: [""] },
-    height: data.height || 1e3,
-    width: data.width || 1e3,
-    items: [page]
-  };
-}
 
 // src/Canvas/InternalCanvas/index.tsx
+var import_iiif_browser = require("@manifest-editor/iiif-browser");
 var import_react_iiif_vault4 = require("react-iiif-vault");
 
 // ../../node_modules/.pnpm/tiny-invariant@1.3.3/node_modules/tiny-invariant/dist/esm/tiny-invariant.js
@@ -1630,7 +1772,6 @@ function invariant(condition, message) {
 }
 
 // src/Canvas/InternalCanvas/index.tsx
-var import_iiif_browser = require("@manifest-editor/iiif-browser");
 var import_jsx_runtime23 = require("react/jsx-runtime");
 var internalCanvas = {
   id: "@manifest-editor/internal-canvas",
@@ -1676,11 +1817,18 @@ async function createInternalCanvas(data, ctx) {
   return ctx.embed({ id: data.id, type: "Canvas" });
 }
 
+// ../ui/icons/TextFormatIcon.tsx
+var import_jsx_runtime24 = require("react/jsx-runtime");
+var TextFormatIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", height: "1em", width: "1em", ...props, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("path", { d: "M0 0h24v24H0z", fill: "none" }),
+  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("path", { d: "M5 17v2h14v-2H5zm4.5-4.2h5l.9 2.2h2.1L12.75 4h-1.5L6.5 15h2.1l.9-2.2zM12 5.98 13.87 11h-3.74L12 5.98z" })
+] });
+
 // src/ContentResource/HTMLBodyCreator/create-html-body.tsx
 var import_editors8 = require("@manifest-editor/editors");
 var import_shell2 = require("@manifest-editor/shell");
 var import_react6 = require("react");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 async function createHtmlBody(data, ctx) {
   return ctx.embed({
     id: ctx.generateId(`html/${data.language}`),
@@ -1700,10 +1848,10 @@ function CreateHTMLBodyForm(props) {
       body
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(PaddedSidebarContainer, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_editors8.InputContainer, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_editors8.InputLabel, { children: "HTML Body" }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(PaddedSidebarContainer, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_editors8.InputContainer, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_editors8.InputLabel, { children: "HTML Body" }),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
         import_editors8.RichTextLanguageField,
         {
           value: body,
@@ -1714,17 +1862,10 @@ function CreateHTMLBodyForm(props) {
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Button, { onClick: () => onSubmit(), children: "Create" })
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Button, { onClick: () => onSubmit(), children: "Create" })
   ] });
 }
 
-// ../ui/icons/TextFormatIcon.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
-var TextFormatIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", height: "1em", width: "1em", ...props, children: [
-  /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("path", { d: "M0 0h24v24H0z", fill: "none" }),
-  /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("path", { d: "M5 17v2h14v-2H5zm4.5-4.2h5l.9 2.2h2.1L12.75 4h-1.5L6.5 15h2.1l.9-2.2zM12 5.98 13.87 11h-3.74L12 5.98z" })
-] });
-
 // src/ContentResource/HTMLBodyCreator/index.tsx
 var import_jsx_runtime26 = require("react/jsx-runtime");
 var htmlBodyCreator = {
@@ -1752,23 +1893,29 @@ var htmlBodyCreator = {
 var import_components11 = require("@manifest-editor/components");
 
 // src/ContentResource/IIIFBrowserCreator/iiif-browser-creator.tsx
-var import_helpers3 = require("@iiif/helpers");
+var import_helpers4 = require("@iiif/helpers");
+var import_image_33 = require("@iiif/parser/image-3");
 var import_react8 = require("react");
+function croppedRegion(imageServiceId, region, size) {
+  return `${imageServiceId}/${Math.floor(region.x)},${Math.floor(region.y)},${Math.floor(region.width)},${Math.floor(
+    region.height
+  )}/${size}/0/default.jpg`;
+}
 async function createFromIIIFBrowserOutput(data, ctx) {
   const targetType = ctx.options.targetType;
   if (Array.isArray(data.output)) {
     throw new Error("Multiple items not yet supported");
   }
-  const contentState = (0, import_helpers3.normaliseContentState)(
-    typeof data.output === "string" ? (0, import_helpers3.parseContentState)(data.output) : data.output
+  const contentState = (0, import_helpers4.normaliseContentState)(
+    typeof data.output === "string" ? (0, import_helpers4.parseContentState)(data.output) : data.output
   );
   if (!contentState.target || contentState.target.length === 0) {
     throw new Error("No target found in content state");
   }
   const target = contentState.target[0];
   const type = target.source.type;
-  const previewVault = ctx.getPreviewVault();
-  if (targetType === "Canvas" || targetType === "Annotation") {
+  const previewVault = new import_helpers4.Vault();
+  if (targetType === "Canvas" || targetType === "Annotation" || targetType === "ContentResource") {
     if (type === "Canvas") {
       const canvasId = target.source.id;
       const manifestId = target.source.partOf?.find(
@@ -1785,16 +1932,24 @@ async function createFromIIIFBrowserOutput(data, ctx) {
       }
       const annotationPage = previewVault.get(canvas.items[0]);
       const annotation = previewVault.get(annotationPage.items[0]);
-      if (targetType === "Annotation" || targetType === "Canvas") {
+      if (targetType === "Annotation" || targetType === "Canvas" || targetType === "ContentResource") {
         const fullAnnotation = previewVault.toPresentation3(annotation);
+        fullAnnotation.id = ctx.generateId("Annotation");
+        let service = null;
+        const dimensions = { width: 0, height: 0 };
         if (fullAnnotation?.body?.service) {
           const width = fullAnnotation?.body.width;
           const height = fullAnnotation?.body.height;
-          const service = Array.isArray(fullAnnotation?.body?.service) ? fullAnnotation?.body?.service[0] : fullAnnotation?.body?.service;
-          if (!service.width || !service.height) {
+          service = (0, import_image_33.getImageServices)(fullAnnotation?.body)[0];
+          if (service && (!service.width || !service.height)) {
             service.width = width;
             service.height = height;
           }
+          dimensions.width = width;
+          dimensions.height = height;
+          if (data.trackSize) {
+            data.trackSize(dimensions);
+          }
         }
         if (target.selector && target.selector.type === "BoxSelector") {
           const selector = {
@@ -1807,12 +1962,30 @@ async function createFromIIIFBrowserOutput(data, ctx) {
               ~~target.selector.spatial.height
             ].join(",")
           };
+          const newBody = { ...fullAnnotation.body };
+          let thumbnailId = "";
+          if (service) {
+            const id = service.id || service["@id"] || "";
+            if (id) {
+              newBody.id = croppedRegion(id, target.selector.spatial, "max");
+              thumbnailId = croppedRegion(id, target.selector.spatial, "512,");
+            }
+          }
           fullAnnotation.body = {
             id: ctx.generateId("SpecificResource", annotation),
             type: "SpecificResource",
-            source: fullAnnotation.body,
+            source: newBody,
             selector
           };
+          if (data.trackSize) {
+            data.trackSize({
+              width: ~~target.selector.spatial.width,
+              height: ~~target.selector.spatial.height
+            });
+          }
+          if (targetType === "ContentResource") {
+            return fullAnnotation.body;
+          }
           if (targetType === "Canvas") {
             const canvasId2 = ctx.generateId("Canvas", annotation);
             fullAnnotation.target = canvasId2;
@@ -1827,6 +2000,17 @@ async function createFromIIIFBrowserOutput(data, ctx) {
               type: "Canvas",
               width: ~~target.selector.spatial.width,
               height: ~~target.selector.spatial.height,
+              thumbnail: thumbnailId ? [
+                ctx.embed({
+                  id: thumbnailId,
+                  type: "Image",
+                  format: "image/jpeg",
+                  width: 512,
+                  height: Math.round(
+                    target.selector.spatial.height / target.selector.spatial.width * 512
+                  )
+                })
+              ] : void 0,
               items: [annotationPage2]
             });
           }
@@ -1895,9 +2079,6 @@ var imageServiceCreator = {
   resourceFields: ["id", "type", "height", "width", "format", "service"],
   supports: {
     parentFields: ["logo", "body", "thumbnail"]
-  },
-  staticFields: {
-    type: "Image"
   }
 };
 
@@ -1936,7 +2117,9 @@ async function createPlaintext(data, ctx) {
   });
 }
 function CreatePlaintextForm(props) {
-  const [label, setLabel] = (0, import_react9.useState)({ en: ["View as text"] });
+  const [label, setLabel] = (0, import_react9.useState)({
+    en: ["View as text"]
+  });
   const onSubmit = (e) => {
     e.preventDefault();
     const data = new FormData(e.target);
@@ -1984,10 +2167,19 @@ var plaintextCreator = {
   }
 };
 
+// ../ui/icons/LinkIcon.tsx
+var import_jsx_runtime33 = require("react/jsx-runtime");
+function LinkIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "#000000", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("path", { d: "M0 0h24v24H0z", fill: "none" }),
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("path", { d: "M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z" })
+  ] });
+}
+
 // src/ContentResource/WebPageCreator/create-web-page.tsx
 var import_editors10 = require("@manifest-editor/editors");
 var import_react10 = require("react");
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 async function createWebPage(data, ctx) {
   return ctx.embed({
     id: data.url,
@@ -2006,8 +2198,8 @@ function CreateWebPageForm(props) {
       props.runCreate({ url: formData.url, label });
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(PaddedSidebarContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("form", { onSubmit, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(PaddedSidebarContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("form", { onSubmit, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
       import_editors10.LanguageFieldEditor,
       {
         focusId: "label",
@@ -2016,23 +2208,14 @@ function CreateWebPageForm(props) {
         onSave: (e) => setLabel(e.toInternationalString())
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_editors10.InputContainer, { $wide: true, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_editors10.InputLabel, { htmlFor: "id", children: "Link" }),
-      /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_editors10.Input, { id: "url", name: "url", defaultValue: "" })
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_editors10.InputContainer, { $wide: true, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_editors10.InputLabel, { htmlFor: "id", children: "Link" }),
+      /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_editors10.Input, { id: "url", name: "url", defaultValue: "" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Button, { type: "submit", children: "Create link" })
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Button, { type: "submit", children: "Create link" })
   ] }) });
 }
 
-// ../ui/icons/LinkIcon.tsx
-var import_jsx_runtime34 = require("react/jsx-runtime");
-function LinkIcon() {
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "#000000", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("path", { d: "M0 0h24v24H0z", fill: "none" }),
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("path", { d: "M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z" })
-  ] });
-}
-
 // src/ContentResource/WebPageCreator/index.tsx
 var import_jsx_runtime35 = require("react/jsx-runtime");
 var webPageCreator = {
@@ -2062,6 +2245,9 @@ function getYouTubeId(url) {
   const id = (url || "").match(ytRegex);
   return id ? id[1] : null;
 }
+function validateYouTube(data) {
+  return !!getYouTubeId(data.youtubeUrl);
+}
 async function createYoutubeBody(data, ctx) {
   const id = getYouTubeId(data.youtubeUrl);
   const body = ctx.embed({
@@ -2165,16 +2351,19 @@ var youTubeBodyCreator = {
   }
 };
 
+// src/Manifest/ManifestBrowserCreator/index.tsx
+var import_components14 = require("@manifest-editor/components");
+
 // src/Manifest/ManifestBrowserCreator/manifest-browser-creator.tsx
-var import_helpers4 = require("@iiif/helpers");
+var import_helpers5 = require("@iiif/helpers");
 var import_react11 = require("react");
 async function createFromManifestBrowserOutput(data, ctx) {
   const targetType = ctx.options.targetType;
   if (Array.isArray(data.output)) {
     throw new Error("Multiple items not yet supported");
   }
-  const contentState = (0, import_helpers4.normaliseContentState)(
-    typeof data.output === "string" ? (0, import_helpers4.parseContentState)(data.output) : data.output
+  const contentState = (0, import_helpers5.normaliseContentState)(
+    typeof data.output === "string" ? (0, import_helpers5.parseContentState)(data.output) : data.output
   );
   const target = contentState.target[0];
   const previewVault = ctx.getPreviewVault();
@@ -2203,11 +2392,12 @@ async function createFromManifestBrowserOutput(data, ctx) {
   }
   throw new Error("Not yet supported.");
 }
-var ManifestBrowserCreatorForm2 = (0, import_react11.lazy)(() => Promise.resolve().then(() => (init_manifest_browser_form_lazy(), manifest_browser_form_lazy_exports)));
+var ManifestBrowserCreatorForm2 = (0, import_react11.lazy)(
+  () => Promise.resolve().then(() => (init_manifest_browser_form_lazy(), manifest_browser_form_lazy_exports))
+);
 
 // src/Manifest/ManifestBrowserCreator/index.tsx
 init_manifest_browser_form_lazy();
-var import_components14 = require("@manifest-editor/components");
 var import_jsx_runtime39 = require("react/jsx-runtime");
 var manifestBrowserCreator = {
   id: "@manifest-editor/manifest-browser-creator",