diff --git a/package.json b/package.json
index 2c2b06a8..f9656f4e 100644
--- a/package.json
+++ b/package.json
@@ -54,7 +54,7 @@
     "@rollup/plugin-typescript": "^3.1.1",
     "@sambego/storybook-state": "^1.3.6",
     "@stoplight/eslint-config": "^1.2.0",
-    "@stoplight/markdown-viewer": "^4.3.2",
+    "@stoplight/markdown-viewer": "^4.3.4",
     "@stoplight/scripts": "^8.2.0",
     "@stoplight/storybook-config": "^2.0.6",
     "@stoplight/types": "^11.9.0",
diff --git a/src/__tests__/__snapshots__/index.spec.tsx.snap b/src/__tests__/__snapshots__/index.spec.tsx.snap
index 5e959e3c..103a20b6 100644
--- a/src/__tests__/__snapshots__/index.spec.tsx.snap
+++ b/src/__tests__/__snapshots__/index.spec.tsx.snap
@@ -392,7 +392,11 @@ exports[`HTML Output given anyOf combiner placed next to allOf given allOf mergi
                       <span>boolean</span>
                     </div>
                   </div>
-                  <div><div title=\\"Is this account enabled\\">Is this account enabled</div></div>
+                  <div>
+                    <div title=\\"Is this account enabled\\">
+                      <div class=\\"MarkdownViewer\\"><p>Is this account enabled</p></div>
+                    </div>
+                  </div>
                 </div>
               </div>
               <div></div>
@@ -525,8 +529,12 @@ exports[`HTML Output given complex type that includes array and complex array su
                   <div
                     title=\\"This description can be long and should truncate once it reaches the end of the row. If it's not truncating then theres and issue that needs to be fixed. Help!\\"
                   >
-                    This description can be long and should truncate once it reaches the end of the row. If it's not
-                    truncating then theres and issue that needs to be fixed. Help!
+                    <div class=\\"MarkdownViewer\\">
+                      <p>
+                        This description can be long and should truncate once it reaches the end of the row. If it's not
+                        truncating then theres and issue that needs to be fixed. Help!
+                      </p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -659,7 +667,11 @@ exports[`HTML Output given oneOf combiner placed next to allOf given allOf mergi
                       <span>boolean</span>
                     </div>
                   </div>
-                  <div><div title=\\"Is this account enabled\\">Is this account enabled</div></div>
+                  <div>
+                    <div title=\\"Is this account enabled\\">
+                      <div class=\\"MarkdownViewer\\"><p>Is this account enabled</p></div>
+                    </div>
+                  </div>
                 </div>
               </div>
               <div></div>
@@ -1062,8 +1074,12 @@ exports[`HTML Output should match arrays/of-complex-objects.json 1`] = `
                     <div
                       title=\\"The user's full name. This description can be long and should truncate once it reaches the end of the row. If it's not truncating then theres and issue that needs to be fixed. Help!\\"
                     >
-                      The user's full name. This description can be long and should truncate once it reaches the end of
-                      the row. If it's not truncating then theres and issue that needs to be fixed. Help!
+                      <div class=\\"MarkdownViewer\\">
+                        <p>
+                          The user's full name. This description can be long and should truncate once it reaches the end
+                          of the row. If it's not truncating then theres and issue that needs to be fixed. Help!
+                        </p>
+                      </div>
                     </div>
                   </div>
                 </div>
@@ -1159,8 +1175,12 @@ exports[`HTML Output should match arrays/of-complex-objects.json 1`] = `
                     <div
                       title=\\"This description can be long and should truncate once it reaches the end of the row. If it's not truncating then theres and issue that needs to be fixed. Help!\\"
                     >
-                      This description can be long and should truncate once it reaches the end of the row. If it's not
-                      truncating then theres and issue that needs to be fixed. Help!
+                      <div class=\\"MarkdownViewer\\">
+                        <p>
+                          This description can be long and should truncate once it reaches the end of the row. If it's
+                          not truncating then theres and issue that needs to be fixed. Help!
+                        </p>
+                      </div>
                     </div>
                   </div>
                 </div>
@@ -2338,7 +2358,11 @@ exports[`HTML Output should match combiners/allOfs/todo-full.json 1`] = `
                         </div>
                         <span>required</span>
                       </div>
-                      <div><div title=\\"The user's full name.\\">The user's full name.</div></div>
+                      <div>
+                        <div title=\\"The user's full name.\\">
+                          <div class=\\"MarkdownViewer\\"><p>The user's full name.</p></div>
+                        </div>
+                      </div>
                     </div>
                   </div>
                   <div></div>
@@ -2556,7 +2580,7 @@ exports[`HTML Output should match combiners/allOfs/with-type.json 1`] = `
                   </div>
                   <div>
                     <div title=\\"The identifier of the existing reservation.\\">
-                      The identifier of the existing reservation.
+                      <div class=\\"MarkdownViewer\\"><p>The identifier of the existing reservation.</p></div>
                     </div>
                   </div>
                 </div>
@@ -2811,8 +2835,12 @@ exports[`HTML Output should match default-schema.json 1`] = `
                   <div
                     title=\\"The user's full name. This description can be long and should truncate once it reaches the end of the row. If it's not truncating then theres and issue that needs to be fixed. Help!\\"
                   >
-                    The user's full name. This description can be long and should truncate once it reaches the end of
-                    the row. If it's not truncating then theres and issue that needs to be fixed. Help!
+                    <div class=\\"MarkdownViewer\\">
+                      <p>
+                        The user's full name. This description can be long and should truncate once it reaches the end
+                        of the row. If it's not truncating then theres and issue that needs to be fixed. Help!
+                      </p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -2908,8 +2936,12 @@ exports[`HTML Output should match default-schema.json 1`] = `
                   <div
                     title=\\"This description can be long and should truncate once it reaches the end of the row. If it's not truncating then theres and issue that needs to be fixed. Help!\\"
                   >
-                    This description can be long and should truncate once it reaches the end of the row. If it's not
-                    truncating then theres and issue that needs to be fixed. Help!
+                    <div class=\\"MarkdownViewer\\">
+                      <p>
+                        This description can be long and should truncate once it reaches the end of the row. If it's not
+                        truncating then theres and issue that needs to be fixed. Help!
+                      </p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -3391,7 +3423,11 @@ exports[`HTML Output should match references/nested.json 1`] = `
                     <span>object</span>
                   </div>
                 </div>
-                <div><div title=\\"something\\">something</div></div>
+                <div>
+                  <div title=\\"something\\">
+                    <div class=\\"MarkdownViewer\\"><p>something</p></div>
+                  </div>
+                </div>
               </div>
             </div>
             <div></div>
@@ -3408,7 +3444,11 @@ exports[`HTML Output should match references/nested.json 1`] = `
                         <span>object</span>
                       </div>
                     </div>
-                    <div><div title=\\"something\\">something</div></div>
+                    <div>
+                      <div title=\\"something\\">
+                        <div class=\\"MarkdownViewer\\"><p>something</p></div>
+                      </div>
+                    </div>
                   </div>
                 </div>
                 <div></div>
@@ -3467,7 +3507,9 @@ exports[`HTML Output should match tickets.schema.json 1`] = `
                   </div>
                 </div>
                 <div>
-                  <div title=\\"List of ticketing options of the order.\\">List of ticketing options of the order.</div>
+                  <div title=\\"List of ticketing options of the order.\\">
+                    <div class=\\"MarkdownViewer\\"><p>List of ticketing options of the order.</p></div>
+                  </div>
                 </div>
               </div>
             </div>
@@ -3501,7 +3543,7 @@ exports[`HTML Output should match tickets.schema.json 1`] = `
                 </div>
                 <div>
                   <div title=\\"Common ticketing options to all order items.\\">
-                    Common ticketing options to all order items.
+                    <div class=\\"MarkdownViewer\\"><p>Common ticketing options to all order items.</p></div>
                   </div>
                 </div>
               </div>
@@ -3523,7 +3565,7 @@ exports[`HTML Output should match tickets.schema.json 1`] = `
                 </div>
                 <div>
                   <div title=\\"Ticketing option selection per order item.\\">
-                    Ticketing option selection per order item.
+                    <div class=\\"MarkdownViewer\\"><p>Ticketing option selection per order item.</p></div>
                   </div>
                 </div>
               </div>
@@ -3545,10 +3587,14 @@ exports[`HTML Output should match tickets.schema.json 1`] = `
                       <div
                         title=\\"The status that addresses if a specific ticket option is active or not. The status active is used before ticketing or before exchange confirmation. After ticketing, the status changes in completed. This allows to store ticketing options already used at ticketing time and to clean up all non selected options after ticketing or exchanged confirmation.\\"
                       >
-                        The status that addresses if a specific ticket option is active or not. The status active is
-                        used before ticketing or before exchange confirmation. After ticketing, the status changes in
-                        completed. This allows to store ticketing options already used at ticketing time and to clean up
-                        all non selected options after ticketing or exchanged confirmation.
+                        <div class=\\"MarkdownViewer\\">
+                          <p>
+                            The status that addresses if a specific ticket option is active or not. The status active is
+                            used before ticketing or before exchange confirmation. After ticketing, the status changes
+                            in completed. This allows to store ticketing options already used at ticketing time and to
+                            clean up all non selected options after ticketing or exchanged confirmation.
+                          </p>
+                        </div>
                       </div>
                     </div>
                   </div>
@@ -3579,7 +3625,9 @@ exports[`HTML Output should match tickets.schema.json 1`] = `
                     </div>
                     <div>
                       <div title=\\"Structure that contains ticketing options per order item.\\">
-                        Structure that contains ticketing options per order item.
+                        <div class=\\"MarkdownViewer\\">
+                          <p>Structure that contains ticketing options per order item.</p>
+                        </div>
                       </div>
                     </div>
                   </div>
@@ -3617,7 +3665,7 @@ exports[`HTML Output should match tickets.schema.json 1`] = `
                         </div>
                         <div>
                           <div title=\\"Available ticketing options for a given order item.\\">
-                            Available ticketing options for a given order item.
+                            <div class=\\"MarkdownViewer\\"><p>Available ticketing options for a given order item.</p></div>
                           </div>
                         </div>
                       </div>
@@ -3637,7 +3685,9 @@ exports[`HTML Output should match tickets.schema.json 1`] = `
                               <span>read-only</span>
                             </div>
                             <div>
-                              <div title=\\"Ticketing option short-description.\\">Ticketing option short-description.</div>
+                              <div title=\\"Ticketing option short-description.\\">
+                                <div class=\\"MarkdownViewer\\"><p>Ticketing option short-description.</p></div>
+                              </div>
                             </div>
                           </div>
                           <div>
@@ -3666,8 +3716,12 @@ exports[`HTML Output should match tickets.schema.json 1`] = `
                               <div
                                 title=\\"Flag to specify which ticketing option is selected. Only one option is allowed to be selected.\\"
                               >
-                                Flag to specify which ticketing option is selected. Only one option is allowed to be
-                                selected.
+                                <div class=\\"MarkdownViewer\\">
+                                  <p>
+                                    Flag to specify which ticketing option is selected. Only one option is allowed to be
+                                    selected.
+                                  </p>
+                                </div>
                               </div>
                             </div>
                           </div>
@@ -3689,7 +3743,9 @@ exports[`HTML Output should match tickets.schema.json 1`] = `
                             </div>
                             <div>
                               <div title=\\"Additional passenger required info specific to the given ticketing option.\\">
-                                Additional passenger required info specific to the given ticketing option.
+                                <div class=\\"MarkdownViewer\\">
+                                  <p>Additional passenger required info specific to the given ticketing option.</p>
+                                </div>
                               </div>
                             </div>
                           </div>
@@ -3709,7 +3765,11 @@ exports[`HTML Output should match tickets.schema.json 1`] = `
                                 <span>object</span>
                               </div>
                             </div>
-                            <div><div title=\\"Data for ticket delivery.\\">Data for ticket delivery.</div></div>
+                            <div>
+                              <div title=\\"Data for ticket delivery.\\">
+                                <div class=\\"MarkdownViewer\\"><p>Data for ticket delivery.</p></div>
+                              </div>
+                            </div>
                           </div>
                         </div>
                         <div></div>
@@ -3794,7 +3854,11 @@ exports[`HTML Output should match tickets.schema.json 1`] = `
                                   <div
                                     title=\\"The name of the Station in case you select pick up at station as a delivery type\\"
                                   >
-                                    The name of the Station in case you select pick up at station as a delivery type
+                                    <div class=\\"MarkdownViewer\\">
+                                      <p>
+                                        The name of the Station in case you select pick up at station as a delivery type
+                                      </p>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
diff --git a/src/components/shared/Description.tsx b/src/components/shared/Description.tsx
index 59554c97..6c410c31 100644
--- a/src/components/shared/Description.tsx
+++ b/src/components/shared/Description.tsx
@@ -1,8 +1,8 @@
+import { MarkdownViewer } from '@stoplight/markdown-viewer';
 import * as React from 'react';
 
 export const Description: React.FunctionComponent<{ value: string }> = ({ value }) => (
-  // TODO (JJ): Add mosaic popover showing full description in MarkdownViewer
   <div className="sl-w-full sl-text-muted" title={value}>
-    {value}
+    <MarkdownViewer markdown={value} />
   </div>
 );
diff --git a/yarn.lock b/yarn.lock
index cd73a4c9..679a916b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2405,13 +2405,13 @@
   dependencies:
     wolfy87-eventemitter "~5.2.8"
 
-"@stoplight/markdown-viewer@^4.3.2":
-  version "4.3.2"
-  resolved "https://registry.yarnpkg.com/@stoplight/markdown-viewer/-/markdown-viewer-4.3.2.tgz#8a746fc731df15f884edfc7e1e6c831b84a2cad7"
-  integrity sha512-sNmZSzHKuWh19Kfd90vAjQkupL93UGUq1ZnKZDi6a5RroDD3MYcc5su/MrTsvTwXwTda8y1z2tMogBDujzlE1w==
+"@stoplight/markdown-viewer@^4.3.4":
+  version "4.3.4"
+  resolved "https://registry.yarnpkg.com/@stoplight/markdown-viewer/-/markdown-viewer-4.3.4.tgz#9b5e04ff7b90fb7d1e172c07c140d5466763a7d1"
+  integrity sha512-yIhjUckgHhsKGs2bLeQvYo1KgU4hbGfIYmwSwzSu648DSn3kxq5igAlujUf+K5ntK4kXpab3MjrbOojmb5OsIA==
   dependencies:
     "@stoplight/json" "^3.6"
-    "@stoplight/markdown" "^2.9.1"
+    "@stoplight/markdown" "^2.11.0"
     "@stoplight/react-error-boundary" "^1.0.0"
     classnames "^2"
     dompurify "^2.0.11"
@@ -2420,10 +2420,10 @@
     remark-slug "^6.0.0"
     unified "^9.0.0"
 
-"@stoplight/markdown@^2.9.1":
-  version "2.10.0"
-  resolved "https://registry.yarnpkg.com/@stoplight/markdown/-/markdown-2.10.0.tgz#b8cf098a8c76a0342bf89637a978ea2047576ce4"
-  integrity sha512-UdvFMtcxCY4RoU7e/9Bbhbe4G1ej4vBni/NQl7+cU0UrcI3Bz6jzxeweF9q6vsF7716+cX1u95tduyRk2zVWEQ==
+"@stoplight/markdown@^2.11.0":
+  version "2.11.0"
+  resolved "https://registry.yarnpkg.com/@stoplight/markdown/-/markdown-2.11.0.tgz#a4736be93200d0d74dbbdba6d5c302308f77257e"
+  integrity sha512-EPUzoEPl1vC0V9PwC47XRYCcmhXCOpJ0JfPZsn2uFYX5I4gchJU6bXJ+03u/8ZwzPMpqvmU7/y/UvEEGkrKzkg==
   dependencies:
     "@stoplight/yaml" "^4.0.2"
     lodash "^4.17.15"