Add document-retrieval to Hub as a task (#1097)

---------

Co-authored-by: vb <[email protected]>

Author: merveenoyan

packages/tasks/src/pipelines.ts

@@ -676,6 +676,12 @@ export const PIPELINE_DATA = {
 		color: "red",
 		hideInDatasets: true,
 	},
+	"visual-document-retrieval": {
+		name: "Visual Document Retrieval",
+		modality: "multimodal",
+		color: "yellow",
+		hideInDatasets: true,
+	},
 	"any-to-any": {
 		name: "Any-to-Any",
 		modality: "multimodal",

packages/tasks/src/tasks/index.ts

@@ -174,6 +174,7 @@ export const TASKS_MODEL_LIBRARIES: Record<PipelineType, ModelLibraryKey[]> = {
 	"text-to-3d": ["diffusers"],
 	"image-to-3d": ["diffusers"],
 	"any-to-any": ["transformers"],
+	"visual-document-retrieval": ["transformers"],
 };
 
 /**
@@ -202,6 +203,7 @@ export const TASKS_DATA: Record<PipelineType, TaskData | undefined> = {
 	"automatic-speech-recognition": getData("automatic-speech-recognition", automaticSpeechRecognition),
 	"depth-estimation": getData("depth-estimation", depthEstimation),
 	"document-question-answering": getData("document-question-answering", documentQuestionAnswering),
+	"visual-document-retrieval": getData("visual-document-retrieval", placeholder),
 	"feature-extraction": getData("feature-extraction", featureExtraction),
 	"fill-mask": getData("fill-mask", fillMask),
 	"graph-ml": undefined,

packages/widgets/src/lib/components/Icons/IconVisualDocumentRetrieval.svelte

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32" {...$$props}><path fill="currentColor" d="m27.4 14.7l-6.1-6.1C21 8.2 20.5 8 20 8h-8c-1.1 0-2 .9-2 2v18c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V16.1c0-.5-.2-1-.6-1.4M20 10l5.9 6H20zm-8 18V10h6v6c0 1.1.9 2 2 2h6v10z"/><path fill="currentColor" d="M6 18H4V4c0-1.1.9-2 2-2h14v2H6z"/></svg>

packages/widgets/src/lib/components/PipelineIcon/PipelineIcon.svelte

@@ -45,6 +45,7 @@
 	import IconVideoTextToText from "../Icons/IconVideoTextToText.svelte";
 	import IconAnyToAny from "../Icons/IconAnyToAny.svelte";
 	import IconKeypointDetection from "../Icons/IconKeypointDetection.svelte";
+	import IconVisualDocumentRetrieval from "../IconsVisualDocumentRetrieval.svelte";
 	import type { WidgetType } from "@huggingface/tasks";
 
 	export let classNames = "";
@@ -101,6 +102,7 @@
 		"video-text-to-text": IconVideoTextToText,
 		"any-to-any": IconAnyToAny,
 		"keypoint-detection": IconKeypointDetection,
+		"visual-document-retrieval": IconVisualDocumentRetrieval,
 	};
 
 	$: iconComponent =