feat: Rename new default theme (#771)

Old theme is remaining as `classic`, new theme is now `gerwig`.
muxinc · Oct 2, 2023 · b91c509 · b91c509 · vercel · Oct 2, 2023
1 parent 4f1b684
commit b91c509
Show file tree

Hide file tree

Showing 11 changed files with 23 additions and 23 deletions.
diff --git a/examples/nextjs-with-typescript/pages/MuxPlayer.tsx b/examples/nextjs-with-typescript/pages/MuxPlayer.tsx
@@ -4,7 +4,7 @@ import Script from 'next/script';
 import MuxPlayer, { MuxPlayerProps } from "@mux/mux-player-react";
 import "@mux/mux-player/themes/minimal";
 import "@mux/mux-player/themes/microvideo";
-import "@mux/mux-player/themes/2023";
+import "@mux/mux-player/themes/gerwig";
 import { useEffect, useReducer, useRef, useState } from "react";
 import mediaAssetsJSON from "@mux/assets/media-assets.json";
 import { useRouter } from "next/router";
@@ -472,7 +472,7 @@ function MuxPlayerPage({ location }: Props) {
           value={state.theme}
           name="theme"
           onChange={genericOnChange}
-          values={['classic', 'microvideo', 'minimal', '2023']}
+          values={['classic', 'microvideo', 'minimal', 'gerwig']}
         />
         <TextRenderer
           value={state.envKey}

diff --git a/examples/vanilla-ts-esm/public/index.html b/examples/vanilla-ts-esm/public/index.html
@@ -35,7 +35,7 @@ <h1><a href="/">Elements</a></h1>
         <li><a href="./mux-player-poster-slot.html" class="player">&lt;mux-player&gt; (poster slot)</a></li>
         <li><a href="./mux-player-audio-tracks.html" class="player">&lt;mux-player&gt; (audio tracks)</a></li>
         <li><a href="./mux-player-theme.html" class="player">&lt;mux-player&gt; (microvideo theme)</a></li>
-        <li><a href="./mux-player-theme-2023.html" class="player">&lt;mux-player&gt; (2023 theme)</a></li>
+        <li><a href="./mux-player-theme-gerwig.html" class="player">&lt;mux-player&gt; (Gerwig theme)</a></li>
         <li><a href="./mux-uploader-simple.html" class="uploader">&lt;mux-uploader&gt;</a></li>
         <li><a href="./mux-uploader-full.html" class="uploader">&lt;mux-uploader&gt; (full-page)</a></li>
       </ul>

diff --git a/...-ts-esm/public/mux-player-theme-2023.html → ...s-esm/public/mux-player-theme-gerwig.html b/...-ts-esm/public/mux-player-theme-2023.html → ...s-esm/public/mux-player-theme-gerwig.html
@@ -2,14 +2,14 @@
 <html>
   <head>
     <meta name="viewport" content="width=device-width" />
-    <title>&lt;mux-player&gt; theme 2023</title>
+    <title>&lt;mux-player&gt; theme Gerwig</title>
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/water.css@2/out/water.css">
     <link rel="stylesheet" href="./styles.css">
     <script
       defer
       src="https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"
     ></script>
-    <script type="module" src="./dist/mux-player-2023-theme.js"></script>
+    <script type="module" src="./dist/mux-player-gerwig-theme.js"></script>
     <script type="module" src="./dist/mux-player.js"></script>
     <style>
       mux-player {
@@ -45,13 +45,13 @@ <h1><a href="/">Elements</a></h1>
     </header>
 
     <mux-player
-      theme="2023"
+      theme="gerwig"
       stream-type="on-demand"
       playback-id="VcmKA6aqzIzlg3MayLJDnbF55kX00mds028Z65QxvBYaA"
     ></mux-player>
 
     <mux-player
-      theme="2023"
+      theme="gerwig"
       stream-type="live:dvr"
       playback-id="v69RSHhFelSm4701snP22dYz2jICy4E4FUyk02rW4gxRM"
       title="My amazing video"

diff --git a/examples/vanilla-ts-esm/src/mux-player-2023-theme.ts b/examples/vanilla-ts-esm/src/mux-player-2023-theme.ts
diff --git a/examples/vanilla-ts-esm/src/mux-player-gerwig-theme.ts b/examples/vanilla-ts-esm/src/mux-player-gerwig-theme.ts
@@ -0,0 +1 @@
+export * as ThemeGerwig from "@mux/mux-player/themes/gerwig";
diff --git a/packages/mux-player-react/src/themes/2023.ts b/packages/mux-player-react/src/themes/2023.ts
diff --git a/packages/mux-player-react/src/themes/gerwig.ts b/packages/mux-player-react/src/themes/gerwig.ts
@@ -0,0 +1,3 @@
+// @ts-ignore
+import '@mux/mux-player/themes/gerwig';
+export default 'gerwig';
diff --git a/packages/mux-player/package.json b/packages/mux-player/package.json
@@ -53,11 +53,11 @@
       "browser": "./dist/themes/classic/index.mjs",
       "default": "./dist/themes/classic/index.cjs.js"
     },
-    "./themes/2023": {
-      "import": "./dist/themes/2023/index.mjs",
-      "require": "./dist/themes/2023/index.cjs.js",
-      "browser": "./dist/themes/2023/index.mjs",
-      "default": "./dist/themes/2023/index.cjs.js"
+    "./themes/gerwig": {
+      "import": "./dist/themes/gerwig/index.mjs",
+      "require": "./dist/themes/gerwig/index.cjs.js",
+      "browser": "./dist/themes/gerwig/index.mjs",
+      "default": "./dist/themes/gerwig/index.cjs.js"
     }
   },
   "types": "./dist/types/index.d.ts",

diff --git a/packages/mux-player/scripts/build-themes.mjs b/packages/mux-player/scripts/build-themes.mjs
@@ -1,7 +1,7 @@
 #!/usr/bin/env node
 import { build } from 'esbuild';
 
-const themes = ['classic', 'microvideo', 'minimal', '2023'];
+const themes = ['classic', 'microvideo', 'minimal', 'gerwig'];
 const devMode = process.argv.includes('--dev');
 
 const shared = {

diff --git a/...ages/mux-player/src/themes/2023/2023.html → .../mux-player/src/themes/gerwig/gerwig.html b/...ages/mux-player/src/themes/2023/2023.html → .../mux-player/src/themes/gerwig/gerwig.html
@@ -1,4 +1,4 @@
-<template id="media-theme-2023">
+<template id="media-theme-gerwig">
   <style>
     @keyframes pre-play-hide {
       0% {

diff --git a/packages/mux-player/src/themes/2023/index.ts → ...ges/mux-player/src/themes/gerwig/index.ts b/packages/mux-player/src/themes/2023/index.ts → ...ges/mux-player/src/themes/gerwig/index.ts
@@ -1,17 +1,17 @@
 // @ts-ignore
-import theme from './2023.html';
+import theme from './gerwig.html';
 import { document, globalThis } from '../../polyfills';
 import { MediaThemeElement } from 'media-chrome/dist/media-theme-element.js';
 
 const template = document.createElement('template');
 if ('innerHTML' in template) template.innerHTML = theme;
 
-class MediaTheme2023 extends MediaThemeElement {
+class MediaThemeGerwig extends MediaThemeElement {
   static template = template.content?.children?.[0];
 }
 
-if (!globalThis.customElements.get('media-theme-2023')) {
-  globalThis.customElements.define('media-theme-2023', MediaTheme2023);
+if (!globalThis.customElements.get('media-theme-gerwig')) {
+  globalThis.customElements.define('media-theme-gerwig', MediaThemeGerwig);
 }
 
-export default MediaTheme2023;
+export default MediaThemeGerwig;
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export * as ThemeGerwig from "@mux/mux-player/themes/gerwig";