feat: prepare @rocket/launch release

modernweb-dev · Jul 30, 2022 · 6c949ee · 6c949ee
1 parent 09cca4c
commit 6c949ee
Show file tree

Hide file tree

Showing 127 changed files with 2,841 additions and 637 deletions.
diff --git a/examples/01-hydration-starter/site/pages/index.rocket.js b/examples/01-hydration-starter/site/pages/index.rocket.js
@@ -18,6 +18,7 @@ export async function registerCustomElements() {
     await import('#components/MyCounter.js').then(m => m.MyCounter),
   );
 }
+export const needsLoader = true;
 /* END - Rocket auto generated - do not touch */
 
 export default () => html`

diff --git a/examples/01-hydration-starter/site/pages/pageTreeData.rocketGenerated.json b/examples/01-hydration-starter/site/pages/pageTreeData.rocketGenerated.json
@@ -5,5 +5,11 @@
   "url": "/",
   "outputRelativeFilePath": "index.html",
   "sourceRelativeFilePath": "index.rocket.js",
-  "level": 0
+  "level": 0,
+  "components": {
+    "hello-wave": "#components/HelloWave.js::HelloWave",
+    "hello-typer": "#components/HelloTyper.js::HelloTyper",
+    "my-counter": "#components/MyCounter.js::MyCounter"
+  },
+  "needsLoader": true
 }
diff --git a/examples/02-blog-starter/site/pages/pageTreeData.rocketGenerated.json b/examples/02-blog-starter/site/pages/pageTreeData.rocketGenerated.json
@@ -7,6 +7,13 @@
   "outputRelativeFilePath": "index.html",
   "sourceRelativeFilePath": "index.rocket.js",
   "level": 0,
+  "components": {
+    "blog-author": "rocket-blog-starter/components/BlogAuthor::BlogAuthor",
+    "blog-header": "rocket-blog-starter/components/BlogHeader::BlogHeader",
+    "blog-post": "rocket-blog-starter/components/BlogPost::BlogPost",
+    "blog-post-preview": "rocket-blog-starter/components/BlogPostPreview::BlogPostPreview",
+    "site-footer": "rocket-blog-starter/components/SiteFooter::SiteFooter"
+  },
   "description": "The perfect starter for your perfect blog.",
   "layout": false,
   "permalink": "https://example.com/",
@@ -26,7 +33,14 @@
       "url": "/about/",
       "outputRelativeFilePath": "about/index.html",
       "sourceRelativeFilePath": "about.rocket.md",
-      "level": 1
+      "level": 1,
+      "components": {
+        "blog-author": "rocket-blog-starter/components/BlogAuthor::BlogAuthor",
+        "blog-header": "rocket-blog-starter/components/BlogHeader::BlogHeader",
+        "blog-post": "rocket-blog-starter/components/BlogPost::BlogPost",
+        "blog-post-preview": "rocket-blog-starter/components/BlogPostPreview::BlogPostPreview",
+        "site-footer": "rocket-blog-starter/components/SiteFooter::SiteFooter"
+      }
     },
     {
       "name": "blog/index.rocket.js",
@@ -35,6 +49,13 @@
       "outputRelativeFilePath": "blog/index.html",
       "sourceRelativeFilePath": "blog/index.rocket.js",
       "level": 1,
+      "components": {
+        "blog-author": "rocket-blog-starter/components/BlogAuthor::BlogAuthor",
+        "blog-header": "rocket-blog-starter/components/BlogHeader::BlogHeader",
+        "blog-post": "rocket-blog-starter/components/BlogPost::BlogPost",
+        "blog-post-preview": "rocket-blog-starter/components/BlogPostPreview::BlogPostPreview",
+        "site-footer": "rocket-blog-starter/components/SiteFooter::SiteFooter"
+      },
       "layout": false,
       "children": [
         {
@@ -48,6 +69,13 @@
           "level": 2,
           "author": "Thomas Allmer (@daKmoR)",
           "authorHref": "https://twitter.com/daKmoR",
+          "components": {
+            "blog-author": "rocket-blog-starter/components/BlogAuthor::BlogAuthor",
+            "blog-header": "rocket-blog-starter/components/BlogHeader::BlogHeader",
+            "blog-post": "rocket-blog-starter/components/BlogPost::BlogPost",
+            "blog-post-preview": "rocket-blog-starter/components/BlogPostPreview::BlogPostPreview",
+            "site-footer": "rocket-blog-starter/components/SiteFooter::SiteFooter"
+          },
           "description": "Just a Hello World Post!",
           "publishDate": "12 Sep 2021",
           "value": 128
@@ -64,6 +92,13 @@
           "alt": "Liftoff Flames",
           "author": "Thomas Allmer (@daKmoR)",
           "authorHref": "https://twitter.com/daKmoR",
+          "components": {
+            "blog-author": "rocket-blog-starter/components/BlogAuthor::BlogAuthor",
+            "blog-header": "rocket-blog-starter/components/BlogHeader::BlogHeader",
+            "blog-post": "rocket-blog-starter/components/BlogPost::BlogPost",
+            "blog-post-preview": "rocket-blog-starter/components/BlogPostPreview::BlogPostPreview",
+            "site-footer": "rocket-blog-starter/components/SiteFooter::SiteFooter"
+          },
           "description": "Now with an image!",
           "heroImage": "./assets/liftoff-flames.jpg",
           "publishDate": "13 Sep 2021",

diff --git a/examples/50-landing-theme-spark/site/pages/pageTreeData.rocketGenerated.json b/examples/50-landing-theme-spark/site/pages/pageTreeData.rocketGenerated.json
@@ -6,5 +6,25 @@
   "url": "/",
   "outputRelativeFilePath": "index.html",
   "sourceRelativeFilePath": "index.rocket.html",
-  "level": 0
+  "level": 0,
+  "components": {
+    "block-columns": "@rocket/components/block-columns.js::BlockColumns",
+    "testimonial-small": "@rocket/components/testimonial-small.js::TestimonialSmall",
+    "feature-small": "@rocket/components/feature-small.js::FeatureSmall",
+    "the-block": "@rocket/components/the-block.js::TheBlock",
+    "inline-notification": "@rocket/components/inline-notification.js::InlineNotification",
+    "permanent-notification": "@rocket/components/permanent-notification.js::PermanentNotification",
+    "card-icon": "@rocket/components/card-icon.js::CardIcon",
+    "server-icon": "@rocket/components/server-icon.js::ServerIcon",
+    "opengraph-overview": "@rocket/components/open-graph-overview.js::OpenGraphOverview",
+    "rocket-drawer": "@rocket/components/drawer.js::RocketDrawer",
+    "rocket-header": "@rocket/components/header.js::RocketHeader",
+    "main-docs": "@rocket/components/main-docs.js::MainDocs",
+    "main-content": "@rocket/components/main-content.js::MainContent",
+    "rocket-social-link": "@rocket/components/social-link.js::RocketSocialLink",
+    "content-area": "@rocket/components/content-area.js::ContentArea",
+    "block-blue": "@rocket/spark/block-blue.js::BlockBlue",
+    "block-features": "@rocket/spark/block-features.js::BlockFeatures",
+    "block-columns-gray": "#components/BlockColumnsGray.js::BlockColumnsGray"
+  }
 }
diff --git a/...xtures/01-config/05-long-file-header-comment/site/pages/pageTreeData.rocketGenerated.json b/...xtures/01-config/05-long-file-header-comment/site/pages/pageTreeData.rocketGenerated.json
@@ -5,6 +5,9 @@
   "outputRelativeFilePath": "index.html",
   "sourceRelativeFilePath": "index.rocket.js",
   "level": 0,
+  "components": {
+    "my-el": "@test/components::MyVeryLongElementName"
+  },
   "fakeComponents": "",
   "fakeHtml": "",
   "fakeLayout": "",

diff --git a/packages/components/exports/components.js b/packages/components/exports/components.js
@@ -14,5 +14,7 @@ export const rocketComponents = {
   'rocket-drawer': '@rocket/components/drawer.js::RocketDrawer',
   'rocket-header': '@rocket/components/header.js::RocketHeader',
   'main-docs': '@rocket/components/main-docs.js::MainDocs',
+  'main-content': '@rocket/components/main-content.js::MainContent',
   'rocket-social-link': '@rocket/components/social-link.js::RocketSocialLink',
+  'content-area': '@rocket/components/content-area.js::ContentArea',
 };
diff --git a/packages/components/exports/content-area.js b/packages/components/exports/content-area.js
@@ -0,0 +1 @@
+export { ContentArea } from '../src/content-area/ContentArea.js';
diff --git a/packages/components/exports/main-content.js b/packages/components/exports/main-content.js
@@ -0,0 +1 @@
+export { MainContent } from '../src/main-content/MainContent.js';
diff --git a/packages/components/src/content-area/ContentArea.js b/packages/components/src/content-area/ContentArea.js
@@ -0,0 +1,30 @@
+import { LitElement, html, css } from 'lit';
+
+export class ContentArea extends LitElement {
+  render() {
+    return html`
+      <div id="content-area">
+        <slot></slot>
+      </div>
+    `;
+  }
+
+  static styles = [
+    css`
+      /** content-area */
+      #content-area {
+        padding: 0 20px;
+        display: block;
+        justify-content: space-between;
+        align-items: center;
+      }
+      @media screen and (min-width: 1024px) {
+        #content-area {
+          max-width: 1200px;
+          margin: 0 auto;
+          position: relative;
+        }
+      }
+    `,
+  ];
+}
diff --git a/packages/components/src/header/RocketHeader.js b/packages/components/src/header/RocketHeader.js
@@ -3,13 +3,11 @@ import { LitElement, html, css } from 'lit';
 export class RocketHeader extends LitElement {
   render() {
     return html`
-      <div id="content-area">
-        <slot name="logo"></slot>
-        <slot name="search"></slot>
-        <slot id="content"></slot>
-        <slot name="mobile-menu"></slot>
-        <slot name="social"></slot>
-      </div>
+      <slot name="logo"></slot>
+      <slot name="search"></slot>
+      <slot id="content"></slot>
+      <slot name="mobile-menu"></slot>
+      <slot name="social"></slot>
     `;
   }
 
@@ -27,6 +25,9 @@ export class RocketHeader extends LitElement {
         --shadow-strength: 1%;
         --shadow-2: 0 3px 5px -2px hsl(var(--shadow-color) / calc(var(--shadow-strength) + 3%)),
           0 7px 14px -5px hsl(var(--shadow-color) / calc(var(--shadow-strength) + 5%));
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
       }
 
       slot[name='logo']::slotted(*) {
@@ -49,20 +50,6 @@ export class RocketHeader extends LitElement {
         }
       }
 
-      /** content-area */
-      #content-area {
-        padding: 0 20px;
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-      }
-      @media screen and (min-width: 1024px) {
-        #content-area {
-          max-width: 1200px;
-          margin: 0 auto;
-        }
-      }
-
       slot[name='social']::slotted(*:last-child) {
         margin-right: 0;
       }

diff --git a/packages/components/src/main-content/MainContent.js b/packages/components/src/main-content/MainContent.js
@@ -0,0 +1,55 @@
+import { LitElement, html, css } from 'lit';
+
+export class MainContent extends LitElement {
+  render() {
+    return html`
+      <div id="content">
+        <slot id="content-slot"></slot>
+      </div>
+      <div id="toc">
+        <div id="toc-sticky">
+          <slot name="toc"></slot>
+        </div>
+      </div>
+    `;
+  }
+
+  static styles = [
+    css`
+      :host {
+        display: grid;
+        gap: 5ch;
+      }
+
+      #toc {
+        display: none;
+        max-width: 25ch;
+      }
+      #content {
+        max-width: 100vw;
+        box-sizing: border-box;
+        /* makes sure that code blocks don't grow bigger then main => see https://css-tricks.com/preventing-a-grid-blowout/ */
+        min-width: 0;
+      }
+
+      @media screen and (min-width: 1024px) {
+        #toc {
+          display: block;
+        }
+        #content {
+          grid-column: 2 / 3;
+        }
+        #toc {
+          grid-column: 3 / 4;
+        }
+      }
+
+      #toc-sticky {
+        position: sticky;
+        top: 70px;
+        overflow: auto;
+        max-height: calc(100vh - 70px);
+      }
+    `,
+  ];
+}
diff --git a/packages/components/src/main-docs/MainDocs.js b/packages/components/src/main-docs/MainDocs.js
@@ -3,27 +3,25 @@ import { LitElement, html, css } from 'lit';
 export class MainDocs extends LitElement {
   render() {
     return html`
-      <div id="content-area">
-        <div id="menu">
-          <div id="menu-sticky">
-            <slot name="menu"></slot>
-          </div>
+      <div id="menu">
+        <div id="menu-sticky">
+          <slot name="menu"></slot>
         </div>
-        <div id="content">
-          <slot id="content-slot"></slot>
-        </div>
-        <div id="toc">
-          <div id="toc-sticky">
-            <slot name="toc"></slot>
-          </div>
+      </div>
+      <div id="content">
+        <slot id="content-slot"></slot>
+      </div>
+      <div id="toc">
+        <div id="toc-sticky">
+          <slot name="toc"></slot>
         </div>
       </div>
     `;
   }
 
   static styles = [
     css`
-      #content-area {
+      :host {
         display: grid;
         gap: 5ch;
       }
@@ -42,10 +40,6 @@ export class MainDocs extends LitElement {
       }
 
       @media screen and (min-width: 1024px) {
-        #content-area {
-          max-width: 1200px;
-          margin: 0 auto;
-        }
         #menu,
         #toc {
           display: block;

diff --git a/packages/engine/src/layouts/Layout.js b/packages/engine/src/layouts/Layout.js
@@ -132,4 +132,17 @@ export class Layout {
     this.options = originalOptions;
     return output;
   }
+
+  getCurrentPage() {
+    if (this.options.pageTree) {
+      return this.options.pageTree.getPage(this.data.sourceRelativeFilePath);
+    }
+  }
+
+  getCurrentPageData() {
+    const current = this.getCurrentPage();
+    if (current) {
+      return current.model;
+    }
+  }
 }
diff --git a/packages/engine/src/transformers/AdjustAssetUrls.js b/packages/engine/src/transformers/AdjustAssetUrls.js
@@ -52,6 +52,7 @@ export class AdjustAssetUrls {
     assetElements = [
       { tagName: 'img', attribute: 'src' },
       { tagName: 'img', attribute: 'srcset' },
+      { tagName: 'source', attribute: 'src' },
       { tagName: 'source', attribute: 'srcset' },
       { tagName: 'a', attribute: 'href' },
       { tagName: 'link', attribute: 'href' },

diff --git a/...ode/fixtures/01-data-cascade/04-import-as-original/docs/pageTreeData.rocketGenerated.json b/...ode/fixtures/01-data-cascade/04-import-as-original/docs/pageTreeData.rocketGenerated.json
@@ -4,5 +4,9 @@
   "url": "/",
   "outputRelativeFilePath": "index.html",
   "sourceRelativeFilePath": "index.rocket.js",
-  "level": 0
+  "level": 0,
+  "options": {
+    "a": "aValue",
+    "b": "bValue"
+  }
 }
diff --git a/...de/fixtures/13-config/03-long-file-header-comment/pages/pageTreeData.rocketGenerated.json b/...de/fixtures/13-config/03-long-file-header-comment/pages/pageTreeData.rocketGenerated.json
@@ -5,6 +5,9 @@
   "outputRelativeFilePath": "index.html",
   "sourceRelativeFilePath": "index.rocket.js",
   "level": 0,
+  "components": {
+    "my-el": "@test/components::MyVeryLongElementName"
+  },
   "fakeComponents": "",
   "fakeHtml": "",
   "fakeLayout": "",

diff --git a/...st-node/fixtures/14-components/01-load-server-side/docs/pageTreeData.rocketGenerated.json b/...st-node/fixtures/14-components/01-load-server-side/docs/pageTreeData.rocketGenerated.json
@@ -4,5 +4,8 @@
   "url": "/",
   "outputRelativeFilePath": "index.html",
   "sourceRelativeFilePath": "index.rocket.js",
-  "level": 0
+  "level": 0,
+  "components": {
+    "my-el": "@test/components::MyEl"
+  }
 }
diff --git a/...st-node/fixtures/14-components/02-register-hydrate/docs/pageTreeData.rocketGenerated.json b/...st-node/fixtures/14-components/02-register-hydrate/docs/pageTreeData.rocketGenerated.json
@@ -5,5 +5,8 @@
   "outputRelativeFilePath": "index.html",
   "sourceRelativeFilePath": "index.rocket.js",
   "level": 0,
+  "components": {
+    "my-el": "@test/components::MyEl"
+  },
   "needsLoader": true
 }