+
+ )
+}
+
+export default App
diff --git a/src/RemoveBG.tsx b/src/RemoveBG.tsx
new file mode 100644
index 0000000..053de06
--- /dev/null
+++ b/src/RemoveBG.tsx
@@ -0,0 +1,263 @@
+import { link, table } from "@nextui-org/theme"
+import {
+ Button,
+ Cell,
+ Column,
+ DropZone,
+ FileTrigger,
+ Row,
+ Table,
+ TableBody,
+ TableHeader,
+ type FileDropItem,
+} from "react-aria-components"
+import { Toaster } from "sonner"
+import { Spinner } from "@nextui-org/react"
+import { proxy, useSnapshot } from "valtio"
+import { AnimatePresence, motion } from "framer-motion"
+import MotionNumber from "motion-number"
+import workerUrl from "./ai?worker&url"
+import { createBirpc } from "birpc"
+import type { ServerFunctions } from "./ai"
+import PQueue from "p-queue"
+
+// classes
+const tableCls = table()
+const linkCls = link()
+
+const js = `import ${JSON.stringify(new URL(workerUrl, import.meta.url))}`
+const blob = new Blob([js], { type: "application/javascript" })
+function createWorker(
+ onProgress: (progress: number) => void,
+) {
+ const objURL = URL.createObjectURL(blob)
+ const worker = new Worker(new URL(objURL), { type: "module" })
+ worker.addEventListener("error", (e) => {
+ URL.revokeObjectURL(objURL)
+ })
+ const rpc = createBirpc
+ {
+ const files = e.items.filter((file) => file.kind === "file") as FileDropItem[]
+ onFiles(await Promise.all(files.map((file) => file.getFile())))
+ }}
+ >
+ {
+ if (!e) {
+ return
+ }
+ let files = Array.from(e)
+ if (files.length === 0) {
+ return
+ }
+ onFiles(files)
+ }}
+ acceptedFileTypes={["image/*"]}
+ >
+
+
+
+ {
+ const files = e.items.filter((file) => file.kind === "file") as FileDropItem[]
+ onFiles(await Promise.all(files.map((file) => file.getFile())))
+ }}
+ >
+ {
+ if (!e) {
+ return
+ }
+ let files = Array.from(e)
+ if (files.length === 0) {
+ return
+ }
+ onFiles(files)
+ }}
+ acceptedFileTypes={["image/*"]}
+ >
+
+
+
+
+
+
+ + Or upload a dictory +
++ Images are not uploaded to the server, they are converted directly in your browser. +
+
+
+
+
+