Merge pull request #919 from ember-learn/merge-main

Merge main

Author: mansona

app/components/class-field-description.hbs

@@ -54,14 +54,14 @@
       <div class='parameter'>
         <dt>{{param.name}}</dt>
         <dd class='parameter-type'>{{param.type}}</dd>
-        <dd>{{param.description}}</dd>
+        <dd><MarkdownToHtml @markdown={{param.description}} /></dd>
         {{#if param.props}}
           <dl class='parameters'>
             {{#each param.props as |prop|}}
               <div class='prop'>
                 <dt>{{prop.name}}</dt>
                 <dd class='parameter-type'>{{prop.type}}</dd>
-                <dd>{{prop.description}}</dd>
+                <dd><MarkdownToHtml @markdown={{prop.description}} /></dd>
               </div>
             {{/each}}
           </dl>
@@ -72,9 +72,9 @@
       <div class='return'>
         <dt>returns</dt>
         <dd class='return-type'>{{@field.return.type}}</dd>
-        <dd>{{@field.return.description}}</dd>
+        <dd><MarkdownToHtml @markdown={{@field.return.description}} /></dd>
       </div>
     {{/if}}
   </dl>
-  {{html-safe @field.description}}
+  <MarkdownToHtml @markdown={{@field.description}} />
 </section>

app/components/import-example.hbs

@@ -1,21 +1 @@
-<div class='highlight javascript'>
-  <div class='ribbon'></div>
-  {{#if (is-clipboard-supported)}}
-    <div class='import-copy'>
-      {{#if this.showClipboardSuccessIcon}}
-        {{svg-jar 'success' width='24px' height='24px'}}
-      {{else}}
-        <CopyButton @clipboardText={{concat 'import ' @item " from '" @package "';"}} @title='Copy to clipboard' @success={{this.showSuccess}}>
-          {{svg-jar 'copy' width='24px' height='24px'}}
-        </CopyButton>
-      {{/if}}
-    </div>
-  {{/if}}
-  <table class='CodeRay'>
-    <tbody>
-      <tr>
-        <td class='code'><pre><span class='wrapper'><span class='keyword'>import</span> {{@item}} <span class='keyword'>from</span> <span class='string'>'{{@package}}'</span>;</span></pre></td>
-      </tr>
-    </tbody>
-  </table>
-</div>
+<MarkdownToHtml @markdown={{this.markdown}} />

app/components/import-example.js

@@ -1,14 +1,10 @@
-import { action } from '@ember/object';
 import Component from '@glimmer/component';
-import { later } from '@ember/runloop';
-import { tracked } from '@glimmer/tracking';
 
 export default class ImportExample extends Component {
-  @tracked showClipboardSuccessIcon = false;
-
-  @action
-  showSuccess() {
-    this.showClipboardSuccessIcon = true;
-    later(this, () => (this.showClipboardSuccessIcon = false), 950);
+  get markdown() {
+    let md = `\`\`\`js
+import ${this.args.item} from '${this.args.package}';
+\`\`\``;
+    return md;
   }
 }

app/controllers/project-version/index.js

@@ -1,5 +1,5 @@
 import Controller from '@ember/controller';
-import { htmlSafe } from '@ember/string';
+import { htmlSafe } from '@ember/template';
 
 export default Controller.extend({
   oldPackageImportSyntax: htmlSafe(

app/helpers/html-safe.js

@@ -1,5 +1,5 @@
 import { helper } from '@ember/component/helper';
-import { htmlSafe as emberHtmlSafe } from '@ember/string';
+import { htmlSafe as emberHtmlSafe } from '@ember/template';
 
 export function htmlSafe([content]) {
   return emberHtmlSafe(content);

app/routes/project-version/modules/module.js

@@ -18,7 +18,7 @@ export default class ModuleRoute extends ClassRoute.extend(ScrollTracker) {
 
     // These modules should not have `ember-` tacked onto the front of them
     // when forming the ids and URLs.
-    let isNotEmber = klass.match(/@glimmer|rsvp|jquery/);
+    let isNotEmber = klass.match(/@warp-drive|@glimmer|rsvp|jquery/);
 
     if (!~klass.indexOf(project) && !isNotEmber) {
       klass = `${project}-${klass}`;

app/templates/project-version/classes/class.hbs

@@ -68,7 +68,7 @@
   {{#if (and (not (eq this.static 1)) this.hasImportExample)}}
     <ImportExample @item={{@model.name}} @package={{this.module}} />
   {{/if}}
-  <p class="description">{{html-safe @model.description}}</p>
+  <p class="description"><MarkdownToHtml @markdown={{@model.description}} /></p>
 
   {{#if (or @model.methods @model.properties @model.events)}}
     <div class="tabbed-layout">

app/templates/project-version/modules/module.hbs

@@ -19,7 +19,7 @@
     {{/if}}
   </p>
 
-  <p class="description">{{html-safe this.model.description}}</p>
+  <p class="description"><MarkdownToHtml @markdown={{this.model.description}} /></p>
 
   {{#if this.submodules}}
     <section>

config/fastboot.js

@@ -0,0 +1,9 @@
+module.exports = function () {
+  return {
+    buildSandboxGlobals(defaultGlobals) {
+      return Object.assign({}, defaultGlobals, {
+        atob: atob,
+      });
+    },
+  };
+};

ember-cli-build.js

@@ -44,5 +44,14 @@ module.exports = function (defaults) {
     destDir: '/assets/',
   });
 
-  return mergeTrees([app.toTree(), mappingsTree]);
+  const { Webpack } = require('@embroider/webpack');
+  const appTree = require('@embroider/compat').compatBuild(app, Webpack, {
+    staticAddonTrees: true,
+    staticAddonTestSupportTrees: true,
+    staticHelpers: true,
+    staticModifiers: true,
+    staticComponents: true,
+  });
+
+  return mergeTrees([require('prember').prerender(app, appTree), mappingsTree]);
 };