imgix · luqven · Apr 11, 2022 · Apr 7, 2022 · Apr 7, 2022 · Apr 7, 2022
diff --git a/.gitignore b/.gitignore
@@ -1,6 +1,7 @@
 /node_modules/
 /lib/
 /test/
+/dist/
 /docs/node_modules
 custom-elements.json
 # top level source

diff --git a/dev/index.html b/dev/index.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Document</title>
+  </head>
+  <body>
+    <!-- HLS video that fills container -->
+    <div style="display: flex; width: 480px; height: 255px">
+      <ix-video
+        source="https://assets.imgix.video/videos/girl-reading-book-in-library.mp4"
+        controls
+      ></ix-video>
+    </div>
+    <!-- HLS video with no w attribute fills container w -->
+    <div style="display: flex; width: 480px; height: 255px">
+      <ix-video
+        source="https://assets.imgix.video/videos/girl-reading-book-in-library.mp4"
+        controls
+        height="255"
+      ></ix-video>
+    </div>
+    <!-- HLS video with w/h attributes -->
+    <ix-video
+      source="https://assets.imgix.video/videos/girl-reading-book-in-library.mp4"
+      controls
+      width="480"
+      height="255"
+    ></ix-video>
+    <!-- HLS video without w/h attributes -->
+    <ix-video
+      source="https://assets.imgix.video/videos/girl-reading-book-in-library.mp4"
+      controls
+    ></ix-video>
+    <!-- HLS video with dataSetup -->
+    <ix-video
+      source="https://assets.imgix.video/videos/girl-reading-book-in-library.mp4"
+      controls
+      dataSetup='{"width": 480}'
+    ></ix-video>
+    <!-- MP4 video that fills container -->
+    <div style="display: flex; width: 480px; height: 255px">
+      <ix-video
+        source="https://assets.imgix.net/videos/girl-reading-book-in-library.mp4"
+        controls
+        type="video/mp4"
+      ></ix-video>
+    </div>
+    <script type="module" src="./main.ts"></script>
+  </body>
+</html>
diff --git a/dev/main.ts b/dev/main.ts
@@ -0,0 +1 @@
+import '~/index';
diff --git a/dev/vite.config.ts b/dev/vite.config.ts
@@ -0,0 +1,9 @@
+import { resolve } from 'path';
+import { defineConfig } from 'vite';
+import viteConfig from '../vite.config';
+
+export default defineConfig({
+  ...viteConfig,
+  root: resolve(__dirname, './'),
+  publicDir: resolve(__dirname, './public'),
+});
diff --git a/dist/index.bundled.d.ts b/dist/index.bundled.d.ts
diff --git a/dist/index.bundled.d.ts.map b/dist/index.bundled.d.ts.map
diff --git a/dist/index.bundled.js b/dist/index.bundled.js