Merge branch 'main' into python-xhr-esm

transloadit · Aug 19, 2022 · df203b1 · df203b1
2 parents 9cfd5ef + 655b8ba
commit df203b1
Show file tree

Hide file tree

Showing 43 changed files with 471 additions and 1,038 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -195,7 +195,12 @@ module.exports = {
         'examples/aws-presigned-url/*.js',
         'examples/bundled/*.js',
         'examples/custom-provider/client/*.js',
+        'examples/multiple-instances/*.js',
+        'examples/node-xhr/*.js',
+        'examples/php-xhr/*.js',
         'examples/python-xhr/*.js',
+        'examples/transloadit-markdown-bin/*.js',
+        'examples/xhr-bundle/*.js',
         'private/dev/*.js',
         'private/release/*.js',
         'private/remark-lint-uppy/*.js',

diff --git a/examples/bundled/package.json b/examples/bundled/package.json
@@ -2,14 +2,15 @@
   "name": "@uppy-example/bundled",
   "version": "0.0.0",
   "dependencies": {
-    "@babel/core": "^7.4.4",
     "@uppy/core": "workspace:*",
     "@uppy/dashboard": "workspace:*",
     "@uppy/google-drive": "workspace:*",
     "@uppy/instagram": "workspace:*",
     "@uppy/tus": "workspace:*",
     "@uppy/url": "workspace:*",
-    "@uppy/webcam": "workspace:*",
+    "@uppy/webcam": "workspace:*"
+  },
+  "devDependencies": {
     "parcel": "^2.0.0"
   },
   "private": true,

diff --git a/examples/cdn-example/index.html b/examples/cdn-example/index.html
@@ -12,13 +12,13 @@
 
     <script type="module">
       import {
-        Core,
+        Uppy,
         Dashboard,
         Webcam,
         Tus,
       } from "https://releases.transloadit.com/uppy/v3.0.0-beta.5/uppy.min.mjs";
 
-      const uppy = new Core.Uppy({ debug: true, autoProceed: false })
+      const uppy = new Uppy({ debug: true, autoProceed: false })
         .use(Dashboard, { trigger: "#uppyModalOpener" })
         .use(Webcam, { target: Dashboard })
         .use(Tus, { endpoint: "https://tusd.tusdemo.net/files/" });
@@ -32,8 +32,8 @@
     <script nomodule src="https://releases.transloadit.com/uppy/v3.0.0-beta.5/uppy.legacy.min.js"></script>
     <script nomodule>
       {
-        const { Core, Dashboard, Webcam, Tus } = Uppy;
-        const uppy = new Core.Uppy({ debug: true, autoProceed: false })
+        const { Dashboard, Webcam, Tus } = Uppy;
+        const uppy = new Uppy.Uppy({ debug: true, autoProceed: false })
           .use(Dashboard, { trigger: "#uppyModalOpener" })
           .use(Webcam, { target: Dashboard })
           .use(Tus, { endpoint: "https://tusd.tusdemo.net/files/" });

diff --git a/examples/multiple-instances/.gitignore b/examples/multiple-instances/.gitignore
diff --git a/examples/multiple-instances/readme.md → examples/multiple-instances/README.md b/examples/multiple-instances/readme.md → examples/multiple-instances/README.md
@@ -8,14 +8,14 @@ It has two instances on the same page, side-by-side, but with different `id`s so
 To run this example, make sure you've correctly installed the **repository root**:
 
 ```bash
-npm install
-npm run build
+corepack yarn install
+corepack yarn build
 ```
 
 That will also install the dependencies for this example.
 
 Then, again in the **repository root**, start this example by doing:
 
 ```bash
-npm run example multiple-instances
+corepack yarn workspace @uppy-example/multiple-instances start
 ```
diff --git a/examples/multiple-instances/index.html b/examples/multiple-instances/index.html
@@ -4,8 +4,6 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>Uppy example: Multiple instances</title>
-  </head>
-  <body>
     <style>
       main {
         display: flex;
@@ -14,6 +12,8 @@
       }
       h1 { text-align: center }
     </style>
+  </head>
+  <body>
     <main>
       <div>
         <h1>Instance A</h1>
@@ -24,8 +24,8 @@ <h1>Instance B</h1>
         <div id="b"></div>
       </div>
     </main>
+    <noscript>This app requires JavaScript to be enabled.</noscript>
 
-    <link href="uppy.min.css" rel="stylesheet">
-    <script src="bundle.js"></script>
+    <script src="./main.js" type="module"></script>
   </body>
 </html>
diff --git a/examples/multiple-instances/main.js b/examples/multiple-instances/main.js
@@ -1,6 +1,9 @@
-const Uppy = require('@uppy/core')
-const Dashboard = require('@uppy/dashboard')
-const GoldenRetriever = require('@uppy/golden-retriever')
+import Uppy from '@uppy/core'
+import Dashboard from '@uppy/dashboard'
+import GoldenRetriever from '@uppy/golden-retriever'
+
+import '@uppy/core/dist/style.css'
+import '@uppy/dashboard/dist/style.css'
 
 // Initialise two Uppy instances with the GoldenRetriever plugin,
 // but with different `id`s.

diff --git a/examples/multiple-instances/package.json b/examples/multiple-instances/package.json
@@ -1,17 +1,17 @@
 {
   "name": "@uppy-example/multiple-instances",
   "version": "0.0.0",
+  "type": "module",
   "dependencies": {
-    "@babel/core": "^7.4.4",
     "@uppy/core": "workspace:*",
     "@uppy/dashboard": "workspace:*",
-    "@uppy/golden-retriever": "workspace:*",
-    "babelify": "^10.0.0",
-    "budo": "^11.6.1"
+    "@uppy/golden-retriever": "workspace:*"
+  },
+  "devDependencies": {
+    "vite": "^3.0.0"
   },
   "private": true,
   "scripts": {
-    "css": "cp ../../packages/uppy/dist/uppy.min.css .",
-    "start": "yarn run css && budo main.js:bundle.js -- -t babelify"
+    "start": "vite"
   }
 }
diff --git a/examples/node-xhr/.gitignore b/examples/node-xhr/.gitignore
@@ -1,2 +1 @@
-uppy.min.css
-uploads
+uploads/
diff --git a/examples/node-xhr/readme.md → examples/node-xhr/README.md b/examples/node-xhr/readme.md → examples/node-xhr/README.md
@@ -6,15 +6,15 @@ This example uses Node server and `@uppy/xhr-upload` to upload files to the loca
 
 To run this example, make sure you've correctly installed the **repository root**:
 
-```bash
-npm install
-npm run build
+```sh
+corepack yarn install
+corepack yarn build
 ```
 
 That will also install the dependencies for this example.
 
 Then, again in the **repository root**, start this example by doing:
 
-```bash
-npm run example node-xhr
+```sh
+corepack yarn workspace @uppy-example/node-xhr start
 ```
diff --git a/examples/node-xhr/index.html b/examples/node-xhr/index.html
@@ -4,9 +4,9 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>Node.js + Uppy Example</title>
-    <link href="uppy.min.css" rel="stylesheet">
   </head>
   <body>
-    <script src="bundle.js"></script>
+    <noscript>The app requires JavaScript to be enabled.</noscript>
+    <script src="./main.js" type="module"></script>
   </body>
 </html>
diff --git a/examples/node-xhr/main.js b/examples/node-xhr/main.js
@@ -1,7 +1,11 @@
-const Uppy = require('@uppy/core')
-const Webcam = require('@uppy/webcam')
-const Dashboard = require('@uppy/dashboard')
-const XHRUpload = require('@uppy/xhr-upload')
+import Uppy from '@uppy/core'
+import Dashboard from '@uppy/dashboard'
+import XHRUpload from '@uppy/xhr-upload'
+import Webcam from '@uppy/webcam'
+
+import '@uppy/core/dist/style.css'
+import '@uppy/dashboard/dist/style.css'
+import '@uppy/webcam/dist/style.css'
 
 const uppy = new Uppy({
   debug: true,

diff --git a/examples/node-xhr/package.json b/examples/node-xhr/package.json
@@ -1,24 +1,22 @@
 {
   "name": "@uppy-example/node-xhr",
   "version": "0.0.0",
+  "type": "module",
   "dependencies": {
-    "@babel/core": "^7.4.4",
     "@uppy/core": "workspace:*",
     "@uppy/dashboard": "workspace:*",
     "@uppy/webcam": "workspace:*",
     "@uppy/xhr-upload": "workspace:*",
-    "babelify": "^10.0.0",
-    "budo": "^11.3.2",
-    "cookie-parser": "^1.4.6",
-    "cors": "^2.8.4",
-    "formidable": "^1.2.1",
-    "npm-run-all": "^4.1.3"
+    "formidable": "^3.2.4"
+  },
+  "devDependencies": {
+    "npm-run-all": "^4.1.3",
+    "vite": "^3.0.0"
   },
   "private": true,
   "scripts": {
-    "copy": "cp ../../packages/uppy/dist/uppy.min.css .",
-    "start": "npm-run-all --serial copy --parallel start:*",
-    "start:client": "budo main.js:bundle.js -- -t babelify",
-    "start:server": "mkdir -p uploads && node server.js"
+    "start": "npm-run-all --parallel start:server start:client",
+    "start:client": "vite",
+    "start:server": "node server.js"
   }
 }
diff --git a/examples/node-xhr/server.js b/examples/node-xhr/server.js
@@ -1,5 +1,16 @@
-const formidable = require('formidable')
-const http = require('node:http')
+#!/usr/bin/env node
+
+/* eslint-disable no-console */
+
+import http from 'node:http'
+import { fileURLToPath } from 'node:url'
+import { mkdir } from 'node:fs/promises'
+
+import formidable from 'formidable'
+
+const UPLOAD_DIR = new URL('./uploads/', import.meta.url)
+
+await mkdir(UPLOAD_DIR, { recursive: true })
 
 http.createServer((req, res) => {
   const headers = {
@@ -17,9 +28,10 @@ http.createServer((req, res) => {
   }
   if (req.url === '/upload' && req.method.toLowerCase() === 'post') {
     // parse a file upload
-    const form = new formidable.IncomingForm()
-    form.uploadDir = './uploads'
-    form.keepExtensions = true
+    const form = formidable({
+      keepExtensions: true,
+      uploadDir: fileURLToPath(UPLOAD_DIR),
+    })
 
     form.parse(req, (err, fields, files) => {
       if (err) {
@@ -28,11 +40,8 @@ http.createServer((req, res) => {
         res.write(JSON.stringify(err))
         return res.end()
       }
-      const file = files['files[]']
-      console.log('saved file to', file.path)
-      console.log('original name', file.name)
-      console.log('type', file.type)
-      console.log('size', file.size)
+      const { file:[{ filepath, originalFilename, mimetype, size }] } = files
+      console.log('saved file', { filepath, originalFilename, mimetype, size })
       res.writeHead(200, headers)
       res.write(JSON.stringify({ fields, files }))
       return res.end()

diff --git a/examples/php-xhr/.gitignore b/examples/php-xhr/.gitignore
@@ -1,2 +1 @@
-uppy.min.css
-uploads
+uploads/
diff --git a/examples/php-xhr/readme.md → examples/php-xhr/README.md b/examples/php-xhr/readme.md → examples/php-xhr/README.md
@@ -6,15 +6,15 @@ This example uses PHP server and `@uppy/xhr-upload` to upload files to the local
 
 To run this example, make sure you've correctly installed the **repository root**:
 
-```bash
-npm install
-npm run build
+```sh
+corepack yarn install
+corepack yarn build
 ```
 
 That will also install the dependencies for this example.
 
 Then, again in the **repository root**, start this example by doing:
 
-```bash
-npm run example php-xhr
+```sh
+corepack yarn workspace @uppy-example/php-xhr start
 ```
diff --git a/examples/php-xhr/index.html b/examples/php-xhr/index.html
@@ -4,9 +4,8 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>PHP + Uppy Example</title>
-    <link href="uppy.min.css" rel="stylesheet">
   </head>
   <body>
-    <script src="bundle.js"></script>
+    <script src="./main.js" type="module"></script>
   </body>
 </html>
diff --git a/examples/php-xhr/main.js b/examples/php-xhr/main.js
@@ -1,7 +1,11 @@
-const Uppy = require('@uppy/core')
-const Webcam = require('@uppy/webcam')
-const Dashboard = require('@uppy/dashboard')
-const XHRUpload = require('@uppy/xhr-upload')
+import Uppy from '@uppy/core'
+import Webcam from '@uppy/webcam'
+import Dashboard from '@uppy/dashboard'
+import XHRUpload from '@uppy/xhr-upload'
+
+import '@uppy/core/dist/style.css'
+import '@uppy/dashboard/dist/style.css'
+import '@uppy/webcam/dist/style.css'
 
 const uppy = new Uppy({
   debug: true,

diff --git a/examples/php-xhr/package.json b/examples/php-xhr/package.json
@@ -1,24 +1,21 @@
 {
   "name": "@uppy-example/php-xhr",
   "version": "0.0.0",
+  "type": "module",
   "dependencies": {
-    "@babel/core": "^7.4.4",
     "@uppy/core": "workspace:*",
     "@uppy/dashboard": "workspace:*",
     "@uppy/webcam": "workspace:*",
-    "@uppy/xhr-upload": "workspace:*",
-    "babelify": "^10.0.0",
-    "budo": "^11.3.2",
-    "cookie-parser": "^1.4.6",
-    "cors": "^2.8.4",
-    "formidable": "^1.2.1",
-    "npm-run-all": "^4.1.3"
+    "@uppy/xhr-upload": "workspace:*"
+  },
+  "devDependencies": {
+    "npm-run-all": "^4.1.3",
+    "vite": "^3.0.0"
   },
   "private": true,
   "scripts": {
-    "copy": "cp ../../packages/uppy/dist/uppy.min.css .",
-    "start": "npm-run-all --serial copy --parallel start:*",
-    "start:client": "budo main.js:bundle.js -- -t babelify",
-    "start:server": "mkdir -p uploads && php -S 0.0.0.0:3020"
+    "start": "npm-run-all --parallel start:server start:client",
+    "start:client": "vite",
+    "start:server": "mkdir -p uploads && php -S 0.0.0.0:3020 server.php"
   }
 }
diff --git a/examples/php-xhr/requirements.txt b/examples/php-xhr/requirements.txt
diff --git a/examples/php-xhr/upload.php → examples/php-xhr/server.php b/examples/php-xhr/upload.php → examples/php-xhr/server.php
@@ -18,14 +18,14 @@
     exit(0);
 }
 
-if ($_POST && !empty($_FILES["files"])) {
-    $target_dir = './uploads/';
-    $target_file = $target_dir . basename($_FILES['files']['name'][0]);
+if ($_POST && !empty($_FILES["file"])) {
+    $target_dir = __DIR__ . DIRECTORY_SEPARATOR . 'uploads';
+    $target_file = $target_dir . DIRECTORY_SEPARATOR . basename($_FILES['file']['name']);
     try {
-        if (move_uploaded_file($_FILES['files']['tmp_name'][0], $target_file)) {
+        if (move_uploaded_file($_FILES['file']['tmp_name'], $target_file)) {
             header('Access-Control-Allow-Origin: *');
             header('Content-type: application/json');
-            $data = ['url' => $target_file, 'message' => 'The file ' . basename($_FILES['files']['name'][0]) . ' has been uploaded.'];
+            $data = ['url' => $target_file, 'message' => 'The file ' . basename($_FILES['file']['name']) . ' has been uploaded.'];
             http_response_code(201);
             echo json_encode($data);
         } else {