diff --git a/static/usage/v6/datetime/highlightedDates/array/index.md b/static/usage/v6/datetime/highlightedDates/array/index.md
index 6eb7c9ec130..813279cbf79 100644
--- a/static/usage/v6/datetime/highlightedDates/array/index.md
+++ b/static/usage/v6/datetime/highlightedDates/array/index.md
@@ -9,7 +9,7 @@ import angular_example_component_ts from './angular/example_component_ts.md';
 
 <Playground
   size="medium"
-  version={6}
+  version="6"
   code={{
     javascript,
     react,
diff --git a/static/usage/v6/datetime/highlightedDates/callback/index.md b/static/usage/v6/datetime/highlightedDates/callback/index.md
index 106ec4476e7..437e43fd262 100644
--- a/static/usage/v6/datetime/highlightedDates/callback/index.md
+++ b/static/usage/v6/datetime/highlightedDates/callback/index.md
@@ -9,7 +9,7 @@ import angular_example_component_ts from './angular/example_component_ts.md';
 
 <Playground
   size="medium"
-  version={6}
+  version="6"
   code={{
     javascript,
     react,
diff --git a/static/usage/v6/icon/basic/index.md b/static/usage/v6/icon/basic/index.md
index 4dd4e6c27c9..6b3a026b7dc 100644
--- a/static/usage/v6/icon/basic/index.md
+++ b/static/usage/v6/icon/basic/index.md
@@ -5,4 +5,4 @@ import react from './react.md';
 import vue from './vue.md';
 import angular from './angular.md';
 
-<Playground version={6} size="xsmall" code={{ javascript, react, vue, angular }} src="usage/v6/icon/basic/demo.html" />
+<Playground version="6" size="xsmall" code={{ javascript, react, vue, angular }} src="usage/v6/icon/basic/demo.html" />
diff --git a/static/usage/v6/tabs/router/index.md b/static/usage/v6/tabs/router/index.md
index 92bdc7799fe..7acff190150 100644
--- a/static/usage/v6/tabs/router/index.md
+++ b/static/usage/v6/tabs/router/index.md
@@ -42,7 +42,7 @@ import react_library_page_tsx from './react/library_page_tsx.md';
 import react_search_page_tsx from './react/search_page_tsx.md';
 
 <Playground
-  version={6}
+  version="6"
   code={{
     javascript,
     angular: {
diff --git a/static/usage/v7/datetime/highlightedDates/array/index.md b/static/usage/v7/datetime/highlightedDates/array/index.md
index 6438d84fcf3..96aa850f02e 100644
--- a/static/usage/v7/datetime/highlightedDates/array/index.md
+++ b/static/usage/v7/datetime/highlightedDates/array/index.md
@@ -9,7 +9,7 @@ import angular_example_component_ts from './angular/example_component_ts.md';
 
 <Playground
   size="medium"
-  version={7}
+  version="7"
   code={{
     javascript,
     react,
diff --git a/static/usage/v7/datetime/highlightedDates/callback/index.md b/static/usage/v7/datetime/highlightedDates/callback/index.md
index 106f90210cf..3950bc634e1 100644
--- a/static/usage/v7/datetime/highlightedDates/callback/index.md
+++ b/static/usage/v7/datetime/highlightedDates/callback/index.md
@@ -9,7 +9,7 @@ import angular_example_component_ts from './angular/example_component_ts.md';
 
 <Playground
   size="medium"
-  version={7}
+  version="7"
   code={{
     javascript,
     react,
diff --git a/static/usage/v7/icon/basic/index.md b/static/usage/v7/icon/basic/index.md
index f766b6112ac..dee026232ff 100644
--- a/static/usage/v7/icon/basic/index.md
+++ b/static/usage/v7/icon/basic/index.md
@@ -5,4 +5,4 @@ import react from './react.md';
 import vue from './vue.md';
 import angular from './angular.md';
 
-<Playground version={7} size="xsmall" code={{ javascript, react, vue, angular }} src="usage/v7/icon/basic/demo.html" />
+<Playground version="7" size="xsmall" code={{ javascript, react, vue, angular }} src="usage/v7/icon/basic/demo.html" />
diff --git a/static/usage/v7/tabs/router/index.md b/static/usage/v7/tabs/router/index.md
index 77161af269f..771f9414182 100644
--- a/static/usage/v7/tabs/router/index.md
+++ b/static/usage/v7/tabs/router/index.md
@@ -42,7 +42,7 @@ import react_library_page_tsx from './react/library_page_tsx.md';
 import react_search_page_tsx from './react/search_page_tsx.md';
 
 <Playground
-  version={7}
+  version="7"
   code={{
     javascript,
     angular: {
diff --git a/static/usage/v8/datetime/highlightedDates/array/index.md b/static/usage/v8/datetime/highlightedDates/array/index.md
index c72db6d82aa..12a14addda0 100644
--- a/static/usage/v8/datetime/highlightedDates/array/index.md
+++ b/static/usage/v8/datetime/highlightedDates/array/index.md
@@ -9,7 +9,7 @@ import angular_example_component_ts from './angular/example_component_ts.md';
 
 <Playground
   size="medium"
-  version={7}
+  version="8"
   code={{
     javascript,
     react,
diff --git a/static/usage/v8/datetime/highlightedDates/callback/index.md b/static/usage/v8/datetime/highlightedDates/callback/index.md
index d546ea2a118..02dedd65624 100644
--- a/static/usage/v8/datetime/highlightedDates/callback/index.md
+++ b/static/usage/v8/datetime/highlightedDates/callback/index.md
@@ -9,7 +9,7 @@ import angular_example_component_ts from './angular/example_component_ts.md';
 
 <Playground
   size="medium"
-  version={7}
+  version="8"
   code={{
     javascript,
     react,
diff --git a/static/usage/v8/icon/basic/index.md b/static/usage/v8/icon/basic/index.md
index dda963a2ca8..85d80b257de 100644
--- a/static/usage/v8/icon/basic/index.md
+++ b/static/usage/v8/icon/basic/index.md
@@ -5,4 +5,4 @@ import react from './react.md';
 import vue from './vue.md';
 import angular from './angular.md';
 
-<Playground version={7} size="xsmall" code={{ javascript, react, vue, angular }} src="usage/v8/icon/basic/demo.html" />
+<Playground version="8" size="xsmall" code={{ javascript, react, vue, angular }} src="usage/v8/icon/basic/demo.html" />
diff --git a/static/usage/v8/tabs/router/index.md b/static/usage/v8/tabs/router/index.md
index ad0ed4dabe1..76c9c52c4e5 100644
--- a/static/usage/v8/tabs/router/index.md
+++ b/static/usage/v8/tabs/router/index.md
@@ -42,7 +42,7 @@ import react_library_page_tsx from './react/library_page_tsx.md';
 import react_search_page_tsx from './react/search_page_tsx.md';
 
 <Playground
-  version={7}
+  version="8"
   code={{
     javascript,
     angular: {