Merge pull request #328 from estruyf/dev

Bumps [follow-redirects](https://github.com/follow-redirects/follow-redirects) from 1.14.6 to 1.14.8.
- [Release notes](https://github.com/follow-redirects/follow-redirects/releases)
- [Commits](https://github.com/follow-redirects/follow-redirects/compare/v1.14.6...v1.14.8)

---
updated-dependencies:
- dependency-name: follow-redirects
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>

.frontmatter/content/mediaDb.json

@@ -1 +1 @@
-{}
+{"assets":{"v7.0.0":{"snippets-dashboard.png":{"caption":"Snippets dashboard","alt":"Snippets dashboard"}}}}

.github/workflows/release-beta.yml

@@ -3,6 +3,7 @@ on:
   push:
     branches:
       - dev
+  workflow_dispatch:
 
 jobs:
   build:

.vscodeignore

@@ -22,4 +22,8 @@ assets/v2.*
 assets/v3.*
 assets/v4.*
 assets/sponsors
-dist/*.html
+dist/*.html
+frontmatter.json
+.frontmatter
+webpack
+README.beta.md

CHANGELOG.md

@@ -1,6 +1,136 @@
 # Change Log
 
-## [6.0.0] - 2022-01-xx - [Release Notes](https://beta.frontmatter.codes/updates/v6.0.0)
+## [7.2.0] - 2022-05-02 - [Release notes](https://beta.frontmatter.codes/updates/v7.2.0)
+
+### 🎨 Enhancements
+
+- New tag design for the tags, category, and taxonomy fields
+- [#263](https://github.com/estruyf/vscode-front-matter/issues/263): WYSIWYG string field option
+- [#308](https://github.com/estruyf/vscode-front-matter/issues/308): New `File` field
+- [#314](https://github.com/estruyf/vscode-front-matter/issues/314): New preview actions to open the page in the browser and refresh the preview
+- [#322](https://github.com/estruyf/vscode-front-matter/issues/322): Show parent folder name when file is an index page (`index.md` / `_index.md`)
+- [#323](https://github.com/estruyf/vscode-front-matter/issues/323): Added 11ty, jekyll, and docusaurus to the framework selection list
+- [#325](https://github.com/estruyf/vscode-front-matter/issues/325): Better welcome experience that allows you to add content folders straight from the welcome view
+- [#326](https://github.com/estruyf/vscode-front-matter/issues/326): Content type actions to create, update, or set according to the current file
+
+### ⚡️ Optimizations
+
+- [#316](https://github.com/estruyf/vscode-front-matter/issues/316): Suppress file parsing errors when closing the dashboard
+
+### 🐞 Fixes
+
+- Updated JSON schema link to supported version by VS Code (draft-07)
+- Hide the view mode action from the Front Matter panel if no custom modes are defined
+- Fix in decode base64 uploaded video files
+- Fix for a lightbox on other types of documents (pdf, etc.)
+- Fix for hiding the image preview on slide-over for none image documents
+- [#324](https://github.com/estruyf/vscode-front-matter/issues/324): Fix for the framework selection on the welcome screen
+
+## [7.1.2] - 2022-04-11
+
+### 🐞 Fixes
+
+- [#315](https://github.com/estruyf/vscode-front-matter/issues/315): Fix draft tab navigation
+
+## [7.1.1] - 2022-04-08
+
+### 🐞 Fixes
+
+- Fix in menu item with `stopPropagation` not defined.
+
+## [7.1.0] - 2022-04-07 - [Release notes](https://beta.frontmatter.codes/updates/v7.1.0)
+
+### 🎨 Enhancements
+ 
+- [#240](https://github.com/estruyf/vscode-front-matter/issues/240): Capability added to define display modes
+- [#246](https://github.com/estruyf/vscode-front-matter/issues/246): Support to add multiple tags/keywords/taxonomy via comma separated values
+- [#293](https://github.com/estruyf/vscode-front-matter/issues/293): Support added for setting preview images in block fields
+- [#294](https://github.com/estruyf/vscode-front-matter/issues/294): Full-text search allows you to search through all your page content
+- [#297](https://github.com/estruyf/vscode-front-matter/issues/297): SEO Keywords input got moved to the SEO section
+- [#301](https://github.com/estruyf/vscode-front-matter/issues/301): Show tags on the content cards
+- [#303](https://github.com/estruyf/vscode-front-matter/issues/303): Content card actions to quickly view, delete, or run custom scripts
+- [#310](https://github.com/estruyf/vscode-front-matter/issues/310): Supported mime types for media dashboard
+
+### ⚡️ Optimizations
+
+- [#296](https://github.com/estruyf/vscode-front-matter/issues/296): Loading optimization of the content dashboard
+
+### 🐞 Fixes
+
+- [#302](https://github.com/estruyf/vscode-front-matter/issues/302): Fix for spinner when navigating between tabs
+- [#304](https://github.com/estruyf/vscode-front-matter/issues/304): Fix yaml stringify which caused additional fields to be added
+- [#305](https://github.com/estruyf/vscode-front-matter/issues/305): Fix for overflow issue in taxonomy picker
+- [#306](https://github.com/estruyf/vscode-front-matter/issues/306): Fix for default value of content type fields
+- [#311](https://github.com/estruyf/vscode-front-matter/issues/311): Fix for updating snippets 
+
+## [7.0.0] - 2022-03-21 - [Release notes](https://beta.frontmatter.codes/updates/v7.0.0)
+
+### ✨ New Features
+
+- [#175](https://github.com/estruyf/vscode-front-matter/issues/175): New snippet support + dashboard
+- [#281](https://github.com/estruyf/vscode-front-matter/issues/281): New `isPublishDate` and `isModifiedDate` datetime field properties
+
+### 🎨 Enhancements
+
+- Light color theme enhancements to media cards
+- Light color theme enhancements to folder cards
+- Added collapse and dashboard button to the view title of the FM Panel
+- Show content commands only when a supported file type is active
+- Added `{{year}}`, `{{month}}`, and `{{day}}` placeholders for fields
+- [#272](https://github.com/estruyf/vscode-front-matter/issues/272): New slide over panel for showing details of media files
+- [#276](https://github.com/estruyf/vscode-front-matter/issues/276): Add a Front Matter walkthrough for VS Code
+- [#270](https://github.com/estruyf/vscode-front-matter/issues/270): Only show media files from public folder if `pageBundle` is not enabled on any of the content types
+- [#282](https://github.com/estruyf/vscode-front-matter/issues/282): Insert relative paths for media files located in a page bundle (also sub-folders)
+- [#283](https://github.com/estruyf/vscode-front-matter/issues/283): Added published date sorting options for the content dashboard
+- [#286](https://github.com/estruyf/vscode-front-matter/issues/286): Refresh button added for the content page
+- [#287](https://github.com/estruyf/vscode-front-matter/issues/287): Show folder name on `index.md` files for recently modified files
+- [#292](https://github.com/estruyf/vscode-front-matter/issues/292): Lower fuzzy search threshold for the content dashboard
+
+### 🐞 Fixes
+
+- [#279](https://github.com/estruyf/vscode-front-matter/issues/279): Fix for content dashboard updates for all registered types
+- [#280](https://github.com/estruyf/vscode-front-matter/issues/280): Fix to not automatically set dates on new files that do not contain front matter
+- [#284](https://github.com/estruyf/vscode-front-matter/issues/284): Show the WYSIWYG controls on all supported file types
+- [#290](https://github.com/estruyf/vscode-front-matter/issues/290): Fix for onDidChangeTextEditorSelection listener sending metadata updates
+
+## [6.1.1] - 2022-03-02
+
+### 🐞 Fixes
+
+- [#275](https://github.com/estruyf/vscode-front-matter/issues/275): Fix for rendering the panel when content contains an invalid markdown syntax tree
+
+## [6.1.0] - 2022-02-28 - [Release notes](https://beta.frontmatter.codes/updates/v6.1.0)
+
+### ✨ New features
+
+- [#176](https://github.com/estruyf/vscode-front-matter/issues/176): New `block` field type that allows you to you to define a group of fields which can be used to create a list of data
+
+### 🎨 Enhancements
+
+- Updated the activity bar icon for better visibility
+- Storing the panel collapse section states
+- [#241](https://github.com/estruyf/vscode-front-matter/issues/241): Added taxonomy limit field property which allows you to limit the number of selections
+- [#242](https://github.com/estruyf/vscode-front-matter/issues/242): Keep comments at the root of the front matter
+- [#248](https://github.com/estruyf/vscode-front-matter/issues/248): Added support for front matter highlighting to all file types specified in `frontMatter.content.supportedFileTypes`
+- [#255](https://github.com/estruyf/vscode-front-matter/issues/255): Added support for default values on block fields / data creation
+- [#257](https://github.com/estruyf/vscode-front-matter/issues/257): Allow preview images to be used in multi-dimensional fields
+- [#271](https://github.com/estruyf/vscode-front-matter/issues/271): Added image size placeholders for media snippets
+
+### ⚡️ Optimizations
+
+- Show the data item its details when clicking on the record
+- Refactoring of the explorer view panel listeners
+- Added `{{now}}` placeholder to the publishing date for content creation
+- [#243](https://github.com/estruyf/vscode-front-matter/issues/243): Refactoring front matter parsing
+
+### 🐞 Fixes
+
+- [#247](https://github.com/estruyf/vscode-front-matter/issues/247): Fix the front matter highlighting in markdown documents
+- [#261](https://github.com/estruyf/vscode-front-matter/issues/261): Fix to allow that tag and category fields can be renamed
+- [#264](https://github.com/estruyf/vscode-front-matter/issues/264): Fix for Windows paths on content folder registration
+- [#268](https://github.com/estruyf/vscode-front-matter/issues/268): Fix for panel which only shows loading indicator
+
+## [6.0.0] - 2022-01-25 - [Release Notes](https://beta.frontmatter.codes/updates/v6.0.0)
 
 ### ✨ New features
 

README.beta.md

@@ -17,8 +17,8 @@
   
   <img src="https://vsmarketplacebadge.apphb.com/rating/eliostruyf.vscode-front-matter.svg" alt="Ratings" style="display: inline-block;margin-left:10px" />
 
-  <a href="https://www.buymeacoffee.com/zMeFRy9" title="Buy me a coffee" style="margin-left:10px">
-    <img src="https://img.shields.io/badge/Buy%20me%20a%20coffee-€%203-blue?logo=buy-me-a-coffee&style=flat" alt="Buy me a coffee" style="display: inline-block" />
+  <a href="https://github.com/sponsors/estruyf" title="Become a sponsor" style="margin-left:10px">
+    <img src="https://img.shields.io/github/sponsors/estruyf?color=%23CE2E7C&logo=github&style=flat" alt="Sponsor the project" style="display: inline-block" />
   </a>
 </p>
 
@@ -49,17 +49,23 @@ A couple of our extension highlights that hopefully get you interested in giving
 > Missing something? Let us know by opening an issue on the [GitHub repository](https://github.com/estruyf/vscode-front-matter/issues/new/choose)
 
 <p align="center">
-  <img src="./assets/v6.0.0/content-preview.png" alt="Site preview" style="display: inline-block" />
+  <img src="https://frontmatter.codes/assets/marketplace/v6.0.0/content-preview.png" alt="Site preview" style="display: inline-block" />
 </p>
 
 > If you see something missing in your article creation flow, please feel free to reach out.
 
+**Version 7**
+
+Snippets support for Front Matter has been added!
+
+![Snippets dashboard](https://frontmatter.codes/assets/marketplace/v7.0.0/snippets-dashboard.png)
+
 **Version 6**
 
 In this version, we introduced the new data files/folders dashboard. You can find more information about the release in our [v6.0.0 release notes](https://frontmatter.codes/updates/v6.0.0).
 
 <p align="center">
-  <img src="./assets/v6.0.0/data-dashboard.png" alt="Data dashboard" style="display: inline-block" />
+  <img src="https://frontmatter.codes/assets/marketplace/v6.0.0/data-dashboard.png" alt="Data dashboard" style="display: inline-block" />
 </p>
 
 > Data files/folders are pieces of content that do not belong to any markdown content, but live on their own. Most of the time, these data files are used to store additional information about your project/blog/website that will be used to render the content.
@@ -69,7 +75,7 @@ In this version, we introduced the new data files/folders dashboard. You can fin
 The new media dashboard redesign got introduced + support for setting metadata on media files [v5.0.0 release notes](https://frontmatter.codes/updates/v5.0.0).
 
 <p align="center">
-  <img src="./assets/v5.9.0/media-dashboard.png" alt="Data dashboard" style="display: inline-block" />
+  <img src="https://frontmatter.codes/assets/marketplace/v5.9.0/media-dashboard.png" alt="Data dashboard" style="display: inline-block" />
 </p>
 
 **Version 4**
@@ -160,26 +166,15 @@ You can open showcase issues for the following things:
 ## 🖤 Backers & Sponsors 👇 🤘
 
 <p align="center">
-  <a href="https://github.com/apowell656" title="Andre Powell">
-    <img height="64px" style="border-radius:50%" src="https://avatars.githubusercontent.com/u/1969515" />
-  </a>
-  <a href="https://github.com/timschps" title="Tim Schaeps">
-    <img height="64px" style="border-radius:50%" src="https://avatars.githubusercontent.com/u/13098307" />
-  </a>
-  <a href="https://github.com/zivbk1" title="Bryan Klein">
-    <img height="64px" style="border-radius:50%" src="https://avatars.githubusercontent.com/u/6154767" />
-  </a>
-  <a href="https://github.com/flikteoh" title="FlikTeoh">
-    <img height="64px" style="border-radius:50%" src="https://avatars.githubusercontent.com/u/1472065" />
-  </a>
+  <img src="https://frontmatter.codes/api/img-sponsors" />
 </p>
 
 <br />
 
 <p align="center">
   <a href="https://vercel.com/?utm_source=vscode-frontmatter&utm_campaign=oss">
-    <img src="assets/sponsors/powered-by-vercel.png" />
-   </a>
+    <img src="https://frontmatter.codes/assets/sponsors/powered-by-vercel.png" />
+  </a>
 </p>
 
 ## 🔑 License
@@ -190,6 +185,6 @@ You can open showcase issues for the following things:
 
 <p align="center">
   <a href="https://visitorbadge.io">
-      <img src="https://estruyf-github.azurewebsites.net/api/VisitorHit?user=estruyf&repo=vscode-front-matter&countColor=%23F05450&labelColor=%230E131F" height="25px" />
+    <img src="https://estruyf-github.azurewebsites.net/api/VisitorHit?user=estruyf&repo=vscode-front-matter&countColor=%23F05450&labelColor=%230E131F" height="25px" />
    </a>
 </p>

README.md

@@ -15,8 +15,8 @@
   
   <img src="https://vsmarketplacebadge.apphb.com/rating/eliostruyf.vscode-front-matter.svg" alt="Ratings" style="display: inline-block;margin-left:10px" />
 
-  <a href="https://www.buymeacoffee.com/zMeFRy9" title="Buy me a coffee" style="margin-left:10px">
-    <img src="https://img.shields.io/badge/Buy%20me%20a%20coffee-€%203-blue?logo=buy-me-a-coffee&style=flat" alt="Buy me a coffee" style="display: inline-block" />
+  <a href="https://github.com/sponsors/estruyf" title="Become a sponsor" style="margin-left:10px">
+    <img src="https://img.shields.io/github/sponsors/estruyf?color=%23CE2E7C&logo=github&style=flat" alt="Sponsor the project" style="display: inline-block" />
   </a>
 </p>
 
@@ -47,17 +47,23 @@ A couple of our extension highlights that hopefully get you interested in giving
 > Missing something? Let us know by opening an issue on the [GitHub repository](https://github.com/estruyf/vscode-front-matter/issues/new/choose)
 
 <p align="center">
-  <img src="./assets/v6.0.0/content-preview.png" alt="Site preview" style="display: inline-block" />
+  <img src="https://frontmatter.codes/assets/marketplace/v6.0.0/content-preview.png" alt="Site preview" style="display: inline-block" />
 </p>
 
 > If you see something missing in your article creation flow, please feel free to reach out.
 
+**Version 7**
+
+Snippets support for Front Matter has been added!
+
+![Snippets dashboard](https://frontmatter.codes/assets/marketplace/v7.0.0/snippets-dashboard.png)
+
 **Version 6**
 
 In this version, we introduced the new data files/folders dashboard. You can find more information about the release in our [v6.0.0 release notes](https://frontmatter.codes/updates/v6.0.0).
 
 <p align="center">
-  <img src="./assets/v6.0.0/data-dashboard.png" alt="Data dashboard" style="display: inline-block" />
+  <img src="https://frontmatter.codes/assets/marketplace/v6.0.0/data-dashboard.png" alt="Data dashboard" style="display: inline-block" />
 </p>
 
 > Data files/folders are pieces of content that do not belong to any markdown content, but live on their own. Most of the time, these data files are used to store additional information about your project/blog/website that will be used to render the content.
@@ -67,7 +73,7 @@ In this version, we introduced the new data files/folders dashboard. You can fin
 The new media dashboard redesign got introduced + support for setting metadata on media files [v5.0.0 release notes](https://frontmatter.codes/updates/v5.0.0).
 
 <p align="center">
-  <img src="./assets/v5.9.0/media-dashboard.png" alt="Data dashboard" style="display: inline-block" />
+  <img src="https://frontmatter.codes/assets/marketplace/v5.9.0/media-dashboard.png" alt="Data dashboard" style="display: inline-block" />
 </p>
 
 **Version 4**
@@ -158,25 +164,14 @@ You can open showcase issues for the following things:
 ## 🖤 Backers & Sponsors 👇 🤘
 
 <p align="center">
-  <a href="https://github.com/apowell656" title="Andre Powell">
-    <img height="64px" style="border-radius:50%" src="https://avatars.githubusercontent.com/u/1969515" />
-  </a>
-  <a href="https://github.com/timschps" title="Tim Schaeps">
-    <img height="64px" style="border-radius:50%" src="https://avatars.githubusercontent.com/u/13098307" />
-  </a>
-  <a href="https://github.com/zivbk1" title="Bryan Klein">
-    <img height="64px" style="border-radius:50%" src="https://avatars.githubusercontent.com/u/6154767" />
-  </a>
-  <a href="https://github.com/flikteoh" title="FlikTeoh">
-    <img height="64px" style="border-radius:50%" src="https://avatars.githubusercontent.com/u/1472065" />
-  </a>
+  <img src="https://frontmatter.codes/api/img-sponsors" />
 </p>
 
 <br />
 
 <p align="center">
   <a href="https://vercel.com/?utm_source=vscode-frontmatter&utm_campaign=oss">
-    <img src="assets/sponsors/powered-by-vercel.png" />
+    <img src="https://frontmatter.codes/assets/sponsors/powered-by-vercel.png" />
    </a>
 </p>
 
@@ -189,6 +184,6 @@ You can open showcase issues for the following things:
 
 <p align="center">
   <a href="https://visitorbadge.io">
-      <img src="https://estruyf-github.azurewebsites.net/api/VisitorHit?user=estruyf&repo=vscode-front-matter&countColor=%23F05450&labelColor=%230E131F" height="25px" />
-   </a>
+    <img src="https://estruyf-github.azurewebsites.net/api/VisitorHit?user=estruyf&repo=vscode-front-matter&countColor=%23F05450&labelColor=%230E131F" height="25px" />
+  </a>
 </p>

assets/empty.svg

@@ -0,0 +1,2 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1" height="1">
+</svg>

assets/frontmatter-mag-min.svg

@@ -1 +0,0 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1249.98 1249.98"><rect x="25" y="25" width="1199.98" height="1199.98" style="fill:none;stroke:#AD0670;stroke-miterlimit:10;stroke-width:50px"/><path d="M171.89,489.56H95.38V127.21H230.6V212.4H171.89v52.8h54.68v81.91H171.89Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M461.79,489.56H379l-37.8-129.08c-.37-2.18-1-5.08-1.93-8.68s-2.05-7.9-3.39-12.91l.55,23.94V489.56H260.33V127.21h78.34q51.75,0,77.43,26.05,32.65,33.32,32.66,94.81,0,65.71-43.85,90.82ZM336.84,295H342q13.21,0,22-12.91t8.81-32.86q0-40.59-33.21-40.6h-2.75Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M691.68,309.56q0,82.85-29.54,134.71-29.35,51.63-76.51,51.63-41.82,0-71.74-39.66Q476.29,406,476.28,305.57q0-96.23,39.26-147.15,29.18-37.78,69.18-37.79,49,0,78,51.17T691.68,309.56Zm-79.44.7q0-98.32-27.16-98.33-13.58,0-21.65,25.81-7.89,23.94-7.89,70.41,0,45.77,7.43,71t20.65,25.23q13.57,0,20.91-24.88Q612.24,354.62,612.24,310.26Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M724.34,489.56V127.21h73l38.35,127.2q3.1,11.27,7.06,25.81t8.72,33.56l7.88,31.92Q855.17,298.52,853,265t-2.2-56.33V127.21h73V489.56h-73l-38.53-133.3q-6.06-21.35-10.92-40t-8.53-35.56q2.38,38.26,3.49,66.65t1.1,49.76v92.46Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M1062.31,489.56H985.8V214H943.6V127.21h162.56V214h-43.85Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M122.7,730.59h35.82l27.36,133.72q5,25.05,9.16,50.2t7.55,52.74q.39-3.6.6-5.62a25.33,25.33,0,0,1,.4-2.87l5.84-37.56,5.23-35.66L219.29,862l24.35-131.39h36.22l28.57,327.72h-40l-7-111.22q-.41-8.49-.71-14.64c-.2-4.11-.3-7.5-.3-10.19l-1.81-43.94-1-40.33c0-.28,0-.88-.1-1.8s-.17-2.16-.3-3.72l-1,6.58q-1.61,11.69-2.91,20.38t-2.32,14.65L245.65,904l-2,11.25-26.16,143.06H189.3L164.75,934.78q-5-24.4-8.95-49.56t-7.14-52.75l-12.08,225.84H97.14Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M395.56,730.59h32.6l66.6,327.72H453.31l-11.67-63.89H380.06l-11.87,63.89H327.94Zm40,229.66L426.35,908q-9.27-53.28-15.1-113.77Q408.43,823.78,404,854t-10.46,64.2l-7.65,42Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M496.17,730.59H632.4v38.63H585.51v289.09h-41V769.22H496.17Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M639,730.59H775.26v38.63H728.38v289.09h-41V769.22H639Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M806.65,730.59H917.93V768H848.5V871.74h61.58V909.1H848.5V1021h69.43v37.35H806.65Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M964.61,730.59h55.13q34.21,0,50.91,17.19,21.13,22.29,21.13,68.14,0,35.24-11.16,56.56t-31.9,26.43l57.15,159.4h-42.46l-57-160.46v160.46H964.61Zm41.85,145.18q24.35,0,34.41-11.88t10.06-40.12a138.46,138.46,0,0,0-2.11-26.11q-2.11-10.81-6.64-17.61a27.08,27.08,0,0,0-11.67-10,41.58,41.58,0,0,0-17-3.18h-7Z" transform="translate(24 24)" style="fill:#AD0670"/></svg>

assets/frontmatter-mag.svg

@@ -1 +0,0 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1249.98 1249.98"><rect x="25" y="25" width="1199.98" height="1199.98" style="fill:none;stroke:#AD0670;stroke-miterlimit:10;stroke-width:50px"/><path d="M171.89,489.56H95.38V127.21H230.6V212.4H171.89v52.8h54.68v81.91H171.89Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M461.79,489.56H379l-37.8-129.08c-.37-2.18-1-5.08-1.93-8.68s-2.05-7.9-3.39-12.91l.55,23.94V489.56H260.33V127.21h78.34q51.75,0,77.43,26.05,32.65,33.32,32.66,94.81,0,65.71-43.85,90.82ZM336.84,295H342q13.21,0,22-12.91t8.81-32.86q0-40.59-33.21-40.6h-2.75Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M691.68,309.56q0,82.85-29.54,134.71-29.35,51.63-76.51,51.63-41.82,0-71.74-39.66Q476.29,406,476.28,305.57q0-96.23,39.26-147.15,29.18-37.78,69.18-37.79,49,0,78,51.17T691.68,309.56Zm-79.44.7q0-98.32-27.16-98.33-13.58,0-21.65,25.81-7.89,23.94-7.89,70.41,0,45.77,7.43,71t20.65,25.23q13.57,0,20.91-24.88Q612.24,354.62,612.24,310.26Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M724.34,489.56V127.21h73l38.35,127.2q3.1,11.27,7.06,25.81t8.72,33.56l7.88,31.92Q855.17,298.52,853,265t-2.2-56.33V127.21h73V489.56h-73l-38.53-133.3q-6.06-21.35-10.92-40t-8.53-35.56q2.38,38.26,3.49,66.65t1.1,49.76v92.46Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M1062.31,489.56H985.8V214H943.6V127.21h162.56V214h-43.85Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M122.7,730.59h35.82l27.36,133.72q5,25.05,9.16,50.2t7.55,52.74q.39-3.6.6-5.62a25.33,25.33,0,0,1,.4-2.87l5.84-37.56,5.23-35.66L219.29,862l24.35-131.39h36.22l28.57,327.72h-40l-7-111.22q-.41-8.49-.71-14.64c-.2-4.11-.3-7.5-.3-10.19l-1.81-43.94-1-40.33c0-.28,0-.88-.1-1.8s-.17-2.16-.3-3.72l-1,6.58q-1.61,11.69-2.91,20.38t-2.32,14.65L245.65,904l-2,11.25-26.16,143.06H189.3L164.75,934.78q-5-24.4-8.95-49.56t-7.14-52.75l-12.08,225.84H97.14Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M395.56,730.59h32.6l66.6,327.72H453.31l-11.67-63.89H380.06l-11.87,63.89H327.94Zm40,229.66L426.35,908q-9.27-53.28-15.1-113.77Q408.43,823.78,404,854t-10.46,64.2l-7.65,42Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M496.17,730.59H632.4v38.63H585.51v289.09h-41V769.22H496.17Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M639,730.59H775.26v38.63H728.38v289.09h-41V769.22H639Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M806.65,730.59H917.93V768H848.5V871.74h61.58V909.1H848.5V1021h69.43v37.35H806.65Z" transform="translate(24 24)" style="fill:#AD0670"/><path d="M964.61,730.59h55.13q34.21,0,50.91,17.19,21.13,22.29,21.13,68.14,0,35.24-11.16,56.56t-31.9,26.43l57.15,159.4h-42.46l-57-160.46v160.46H964.61Zm41.85,145.18q24.35,0,34.41-11.88t10.06-40.12a138.46,138.46,0,0,0-2.11-26.11q-2.11-10.81-6.64-17.61a27.08,27.08,0,0,0-11.67-10,41.58,41.58,0,0,0-17-3.18h-7Z" transform="translate(24 24)" style="fill:#AD0670"/></svg>

assets/frontmatter-short-min.svg

@@ -1,16 +1,17 @@
 <?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 25.4.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!-- Generator: Adobe Illustrator 26.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 viewBox="0 0 1250 1250" style="enable-background:new 0 0 1250 1250;" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:none;stroke:#02AEB7;stroke-width:50;stroke-miterlimit:10;}
-	.st1{fill:#02AEB7;}
-</style>
-<rect x="25" y="25" class="st0" width="1200" height="1200"/>
-<path class="st1" d="M316,1082.3H119.4V151.2h347.5v218.9H316v135.7h140.5v210.5H316V1082.3z"/>
-<path class="st1" d="M602.2,151.2H704l77.7,379.9c9.5,47.4,18.1,95,26,142.6c7.9,47.6,15,97.6,21.4,149.8c0.7-6.8,1.3-12.1,1.7-16
+<path fill="#C5C5C5" d="M316,1082.3H119.4V151.2h347.5v218.9H316v135.7h140.5v210.5H316V1082.3z"/>
+<path fill="#C5C5C5" d="M602.2,151.2H704l77.7,379.9c9.5,47.4,18.1,95,26,142.6s15,97.6,21.4,149.8c0.7-6.8,1.3-12.1,1.7-16
 	c0.2-2.7,0.6-5.5,1.1-8.2l16.6-106.7l14.9-101.3l13.2-66.9l69.2-373.3h102.9l81.2,931.1h-113.6l-19.9-316c-0.8-16.1-1.4-29.9-2-41.6
 	c-0.6-11.7-0.9-21.3-0.9-29L988.3,571l-2.8-114.6c0-0.8,0-2.5-0.3-5.1s-0.5-6.1-0.9-10.6l-2.8,18.7c-3,22.1-5.8,41.4-8.3,57.9
-	c-2.5,16.5-4.7,30.3-6.6,41.6l-15.1,84.9l-5.7,32l-74.3,406.4h-80.1l-69.7-351c-9.5-46.2-17.9-93.1-25.4-140.8
-	c-7.5-47.7-14.2-97.6-20.3-149.9l-34.3,641.6H529.6L602.2,151.2z"/>
+	s-4.7,30.3-6.6,41.6l-15.1,84.9l-5.7,32l-74.3,406.4h-80.1l-69.7-351c-9.5-46.2-17.9-93.1-25.4-140.8s-14.2-97.6-20.3-149.9
+	l-34.3,641.6H529.6L602.2,151.2z"/>
+<rect x="119.4" y="0.1" fill="#C5C5C5" width="184" height="64.7"/>
+<rect x="395.7" y="0.1" fill="#C5C5C5" width="184" height="64.7"/>
+<rect x="675.3" y="0.1" fill="#C5C5C5" width="184" height="64.7"/>
+<rect x="119.4" y="1184.7" fill="#C5C5C5" width="184" height="64.7"/>
+<rect x="395.7" y="1184.7" fill="#C5C5C5" width="184" height="64.7"/>
+<rect x="675.3" y="1184.7" fill="#C5C5C5" width="184" height="64.7"/>
 </svg>

assets/frontmatter-teal-min.svg

@@ -1 +0,0 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1249.98 1249.98"><rect x="25" y="25" width="1199.98" height="1199.98" style="fill:none;stroke:#02aeb7;stroke-miterlimit:10;stroke-width:50px"/><path d="M171.89,489.56H95.38V127.21H230.6V212.4H171.89v52.8h54.68v81.91H171.89Z" transform="translate(24 24)" style="fill:#02aeb7"/><path d="M461.79,489.56H379l-37.8-129.08c-.37-2.18-1-5.08-1.93-8.68s-2.05-7.9-3.39-12.91l.55,23.94V489.56H260.33V127.21h78.34q51.75,0,77.43,26.05,32.65,33.32,32.66,94.81,0,65.71-43.85,90.82ZM336.84,295H342q13.21,0,22-12.91t8.81-32.86q0-40.59-33.21-40.6h-2.75Z" transform="translate(24 24)" style="fill:#02aeb7"/><path d="M691.68,309.56q0,82.85-29.54,134.71-29.35,51.63-76.51,51.63-41.82,0-71.74-39.66Q476.29,406,476.28,305.57q0-96.23,39.26-147.15,29.18-37.78,69.18-37.79,49,0,78,51.17T691.68,309.56Zm-79.44.7q0-98.32-27.16-98.33-13.58,0-21.65,25.81-7.89,23.94-7.89,70.41,0,45.77,7.43,71t20.65,25.23q13.57,0,20.91-24.88Q612.24,354.62,612.24,310.26Z" transform="translate(24 24)" style="fill:#02aeb7"/><path d="M724.34,489.56V127.21h73l38.35,127.2q3.1,11.27,7.06,25.81t8.72,33.56l7.88,31.92Q855.17,298.52,853,265t-2.2-56.33V127.21h73V489.56h-73l-38.53-133.3q-6.06-21.35-10.92-40t-8.53-35.56q2.38,38.26,3.49,66.65t1.1,49.76v92.46Z" transform="translate(24 24)" style="fill:#02aeb7"/><path d="M1062.31,489.56H985.8V214H943.6V127.21h162.56V214h-43.85Z" transform="translate(24 24)" style="fill:#02aeb7"/><path d="M122.7,730.59h35.82l27.36,133.72q5,25.05,9.16,50.2t7.55,52.74q.39-3.6.6-5.62a25.33,25.33,0,0,1,.4-2.87l5.84-37.56,5.23-35.66L219.29,862l24.35-131.39h36.22l28.57,327.72h-40l-7-111.22q-.41-8.49-.71-14.64c-.2-4.11-.3-7.5-.3-10.19l-1.81-43.94-1-40.33c0-.28,0-.88-.1-1.8s-.17-2.16-.3-3.72l-1,6.58q-1.61,11.69-2.91,20.38t-2.32,14.65L245.65,904l-2,11.25-26.16,143.06H189.3L164.75,934.78q-5-24.4-8.95-49.56t-7.14-52.75l-12.08,225.84H97.14Z" transform="translate(24 24)" style="fill:#02aeb7"/><path d="M395.56,730.59h32.6l66.6,327.72H453.31l-11.67-63.89H380.06l-11.87,63.89H327.94Zm40,229.66L426.35,908q-9.27-53.28-15.1-113.77Q408.43,823.78,404,854t-10.46,64.2l-7.65,42Z" transform="translate(24 24)" style="fill:#02aeb7"/><path d="M496.17,730.59H632.4v38.63H585.51v289.09h-41V769.22H496.17Z" transform="translate(24 24)" style="fill:#02aeb7"/><path d="M639,730.59H775.26v38.63H728.38v289.09h-41V769.22H639Z" transform="translate(24 24)" style="fill:#02aeb7"/><path d="M806.65,730.59H917.93V768H848.5V871.74h61.58V909.1H848.5V1021h69.43v37.35H806.65Z" transform="translate(24 24)" style="fill:#02aeb7"/><path d="M964.61,730.59h55.13q34.21,0,50.91,17.19,21.13,22.29,21.13,68.14,0,35.24-11.16,56.56t-31.9,26.43l57.15,159.4h-42.46l-57-160.46v160.46H964.61Zm41.85,145.18q24.35,0,34.41-11.88t10.06-40.12a138.46,138.46,0,0,0-2.11-26.11q-2.11-10.81-6.64-17.61a27.08,27.08,0,0,0-11.67-10,41.58,41.58,0,0,0-17-3.18h-7Z" transform="translate(24 24)" style="fill:#02aeb7"/></svg>

assets/frontmatter.svg

@@ -1 +0,0 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1249.98 1249.98"><rect x="25" y="25" width="1199.98" height="1199.98" style="fill:none;stroke:#000000;stroke-miterlimit:10;stroke-width:50px"/><path d="M171.89,489.56H95.38V127.21H230.6V212.4H171.89v52.8h54.68v81.91H171.89Z" transform="translate(24 24)" style="fill:#000000"/><path d="M461.79,489.56H379l-37.8-129.08c-.37-2.18-1-5.08-1.93-8.68s-2.05-7.9-3.39-12.91l.55,23.94V489.56H260.33V127.21h78.34q51.75,0,77.43,26.05,32.65,33.32,32.66,94.81,0,65.71-43.85,90.82ZM336.84,295H342q13.21,0,22-12.91t8.81-32.86q0-40.59-33.21-40.6h-2.75Z" transform="translate(24 24)" style="fill:#000000"/><path d="M691.68,309.56q0,82.85-29.54,134.71-29.35,51.63-76.51,51.63-41.82,0-71.74-39.66Q476.29,406,476.28,305.57q0-96.23,39.26-147.15,29.18-37.78,69.18-37.79,49,0,78,51.17T691.68,309.56Zm-79.44.7q0-98.32-27.16-98.33-13.58,0-21.65,25.81-7.89,23.94-7.89,70.41,0,45.77,7.43,71t20.65,25.23q13.57,0,20.91-24.88Q612.24,354.62,612.24,310.26Z" transform="translate(24 24)" style="fill:#000000"/><path d="M724.34,489.56V127.21h73l38.35,127.2q3.1,11.27,7.06,25.81t8.72,33.56l7.88,31.92Q855.17,298.52,853,265t-2.2-56.33V127.21h73V489.56h-73l-38.53-133.3q-6.06-21.35-10.92-40t-8.53-35.56q2.38,38.26,3.49,66.65t1.1,49.76v92.46Z" transform="translate(24 24)" style="fill:#000000"/><path d="M1062.31,489.56H985.8V214H943.6V127.21h162.56V214h-43.85Z" transform="translate(24 24)" style="fill:#000000"/><path d="M122.7,730.59h35.82l27.36,133.72q5,25.05,9.16,50.2t7.55,52.74q.39-3.6.6-5.62a25.33,25.33,0,0,1,.4-2.87l5.84-37.56,5.23-35.66L219.29,862l24.35-131.39h36.22l28.57,327.72h-40l-7-111.22q-.41-8.49-.71-14.64c-.2-4.11-.3-7.5-.3-10.19l-1.81-43.94-1-40.33c0-.28,0-.88-.1-1.8s-.17-2.16-.3-3.72l-1,6.58q-1.61,11.69-2.91,20.38t-2.32,14.65L245.65,904l-2,11.25-26.16,143.06H189.3L164.75,934.78q-5-24.4-8.95-49.56t-7.14-52.75l-12.08,225.84H97.14Z" transform="translate(24 24)" style="fill:#000000"/><path d="M395.56,730.59h32.6l66.6,327.72H453.31l-11.67-63.89H380.06l-11.87,63.89H327.94Zm40,229.66L426.35,908q-9.27-53.28-15.1-113.77Q408.43,823.78,404,854t-10.46,64.2l-7.65,42Z" transform="translate(24 24)" style="fill:#000000"/><path d="M496.17,730.59H632.4v38.63H585.51v289.09h-41V769.22H496.17Z" transform="translate(24 24)" style="fill:#000000"/><path d="M639,730.59H775.26v38.63H728.38v289.09h-41V769.22H639Z" transform="translate(24 24)" style="fill:#000000"/><path d="M806.65,730.59H917.93V768H848.5V871.74h61.58V909.1H848.5V1021h69.43v37.35H806.65Z" transform="translate(24 24)" style="fill:#000000"/><path d="M964.61,730.59h55.13q34.21,0,50.91,17.19,21.13,22.29,21.13,68.14,0,35.24-11.16,56.56t-31.9,26.43l57.15,159.4h-42.46l-57-160.46v160.46H964.61Zm41.85,145.18q24.35,0,34.41-11.88t10.06-40.12a138.46,138.46,0,0,0-2.11-26.11q-2.11-10.81-6.64-17.61a27.08,27.08,0,0,0-11.67-10,41.58,41.58,0,0,0-17-3.18h-7Z" transform="translate(24 24)" style="fill:#000000"/></svg>

assets/icons/frontmatter-dark.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30"><path d="M4,11.4H2.2V2.9H5.4v2H4V6.1H5.3V8H4Z" transform="translate(1 1)" fill="#C5C5C5"/><path d="M10.9,11.4H9l-.9-3V8.2C8,8.1,8,8,7.9,7.8v3.6H6.1V2.9H8a2.88,2.88,0,0,1,1.9.6,3.11,3.11,0,0,1,.8,2.2A2.25,2.25,0,0,1,9.6,7.8ZM8,6.8h.1a.55.55,0,0,0,.5-.3,1.88,1.88,0,0,0,.2-.8c0-.6-.3-1-.8-1H8Z" transform="translate(1 1)" fill="#C5C5C5"/><path d="M16.5,7.2a6.08,6.08,0,0,1-.7,3.2A2.14,2.14,0,0,1,14,11.6a2.09,2.09,0,0,1-1.7-.9,5.84,5.84,0,0,1-.9-3.5,5.84,5.84,0,0,1,.9-3.5A2.09,2.09,0,0,1,14,2.8,2.16,2.16,0,0,1,15.9,4,8.24,8.24,0,0,1,16.5,7.2Zm-1.9,0c0-1.5-.2-2.3-.7-2.3-.2,0-.4.2-.5.6a6.53,6.53,0,0,0-.2,1.7,7.18,7.18,0,0,0,.2,1.7c.1.4.3.6.5.6s.4-.2.5-.6A7.93,7.93,0,0,0,14.6,7.2Z" transform="translate(1 1)" fill="#C5C5C5"/><path d="M17.2,11.4V2.9H19l.9,3c.1.1.1.3.2.6s.1.5.2.8l.2.7c-.1-.7-.1-1.4-.2-1.9a6.64,6.64,0,0,1-.1-1.3V2.9H22v8.5H20.3l-.9-3.1-.3-.9c-.1-.3-.1-.6-.2-.8,0,.6.1,1.1.1,1.6v3.4H17.2Z" transform="translate(1 1)" fill="#C5C5C5"/><path d="M25.3,11.4H23.5V4.9h-1v-2h3.9v2H25.3Z" transform="translate(1 1)" fill="#C5C5C5"/><rect x="1" y="1" width="28" height="28" fill="none" stroke="#C5C5C5" stroke-miterlimit="10" stroke-width="2"/><path d="M2.9,17h.9l.6,3a5,5,0,0,1,.2,1.2c.1.4.1.8.2,1.2v-.2l.2-.9.1-.8.1-.5.6-3h.9l.7,7.5h-1l-.2-2.6V19.5h0v.1a.9.9,0,0,1-.1.5c-.1.2,0,.2-.1.3l-.1.7v.3l-.6,3.3H4.5l-.6-2.8a5.16,5.16,0,0,1-.2-1.1c-.1-.4-.1-.8-.2-1.2l-.3,5.2h-1Z" transform="translate(1 1)" fill="#C5C5C5"/><path d="M9.3,17h.8l1.6,7.5h-1L10.4,23H8.9l-.3,1.5h-1Zm1,5.2L10,21c-.1-.8-.3-1.7-.4-2.6a6.75,6.75,0,0,1-.2,1.4l-.3,1.5-.2,1h1.4Z" transform="translate(1 1)" fill="#C5C5C5"/><path d="M11.5,17h3.3v.9H13.7v6.7h-1V17.9H11.5Z" transform="translate(1 1)" fill="#C5C5C5"/><path d="M14.8,17h3.3v.9H17v6.7H16V17.9H14.8Z" transform="translate(1 1)" fill="#C5C5C5"/><path d="M18.7,17h2.7v.9H19.7v2.4h1.5v.9H19.7v2.6h1.7v.9H18.7Z" transform="translate(1 1)" fill="#C5C5C5"/><path d="M22.3,17h1.3c.6,0,1,.1,1.2.4a2.35,2.35,0,0,1,.5,1.6,2.5,2.5,0,0,1-.3,1.3,1.24,1.24,0,0,1-.8.6l1.4,3.7h-1l-1.4-3.7v3.7h-1V17Zm1,3.3c.4,0,.7-.1.8-.3s.2-.5.2-.9a1.27,1.27,0,0,0-.1-.6c-.1-.2-.1-.3-.2-.4s-.2-.2-.3-.2-.3-.1-.4-.1h-.2v2.5Z" transform="translate(1 1)" fill="#C5C5C5"/></svg>

assets/icons/frontmatter-light.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30"><path d="M4,11.4H2.2V2.9H5.4v2H4V6.1H5.3V8H4Z" transform="translate(1 1)" fill="#424242"/><path d="M10.9,11.4H9l-.9-3V8.2C8,8.1,8,8,7.9,7.8v3.6H6.1V2.9H8a2.88,2.88,0,0,1,1.9.6,3.11,3.11,0,0,1,.8,2.2A2.25,2.25,0,0,1,9.6,7.8ZM8,6.8h.1a.55.55,0,0,0,.5-.3,1.88,1.88,0,0,0,.2-.8c0-.6-.3-1-.8-1H8Z" transform="translate(1 1)" fill="#424242"/><path d="M16.5,7.2a6.08,6.08,0,0,1-.7,3.2A2.14,2.14,0,0,1,14,11.6a2.09,2.09,0,0,1-1.7-.9,5.84,5.84,0,0,1-.9-3.5,5.84,5.84,0,0,1,.9-3.5A2.09,2.09,0,0,1,14,2.8,2.16,2.16,0,0,1,15.9,4,8.24,8.24,0,0,1,16.5,7.2Zm-1.9,0c0-1.5-.2-2.3-.7-2.3-.2,0-.4.2-.5.6a6.53,6.53,0,0,0-.2,1.7,7.18,7.18,0,0,0,.2,1.7c.1.4.3.6.5.6s.4-.2.5-.6A7.93,7.93,0,0,0,14.6,7.2Z" transform="translate(1 1)" fill="#424242"/><path d="M17.2,11.4V2.9H19l.9,3c.1.1.1.3.2.6s.1.5.2.8l.2.7c-.1-.7-.1-1.4-.2-1.9a6.64,6.64,0,0,1-.1-1.3V2.9H22v8.5H20.3l-.9-3.1-.3-.9c-.1-.3-.1-.6-.2-.8,0,.6.1,1.1.1,1.6v3.4H17.2Z" transform="translate(1 1)" fill="#424242"/><path d="M25.3,11.4H23.5V4.9h-1v-2h3.9v2H25.3Z" transform="translate(1 1)" fill="#424242"/><rect x="1" y="1" width="28" height="28" fill="none" stroke="#424242" stroke-miterlimit="10" stroke-width="2"/><path d="M2.9,17h.9l.6,3a5,5,0,0,1,.2,1.2c.1.4.1.8.2,1.2v-.2l.2-.9.1-.8.1-.5.6-3h.9l.7,7.5h-1l-.2-2.6V19.5h0v.1a.9.9,0,0,1-.1.5c-.1.2,0,.2-.1.3l-.1.7v.3l-.6,3.3H4.5l-.6-2.8a5.16,5.16,0,0,1-.2-1.1c-.1-.4-.1-.8-.2-1.2l-.3,5.2h-1Z" transform="translate(1 1)" fill="#424242"/><path d="M9.3,17h.8l1.6,7.5h-1L10.4,23H8.9l-.3,1.5h-1Zm1,5.2L10,21c-.1-.8-.3-1.7-.4-2.6a6.75,6.75,0,0,1-.2,1.4l-.3,1.5-.2,1h1.4Z" transform="translate(1 1)" fill="#424242"/><path d="M11.5,17h3.3v.9H13.7v6.7h-1V17.9H11.5Z" transform="translate(1 1)" fill="#424242"/><path d="M14.8,17h3.3v.9H17v6.7H16V17.9H14.8Z" transform="translate(1 1)" fill="#424242"/><path d="M18.7,17h2.7v.9H19.7v2.4h1.5v.9H19.7v2.6h1.7v.9H18.7Z" transform="translate(1 1)" fill="#424242"/><path d="M22.3,17h1.3c.6,0,1,.1,1.2.4a2.35,2.35,0,0,1,.5,1.6,2.5,2.5,0,0,1-.3,1.3,1.24,1.24,0,0,1-.8.6l1.4,3.7h-1l-1.4-3.7v3.7h-1V17Zm1,3.3c.4,0,.7-.1.8-.3s.2-.5.2-.9a1.27,1.27,0,0,0-.1-.6c-.1-.2-.1-.3-.2-.4s-.2-.2-.3-.2-.3-.1-.4-.1h-.2v2.5Z" transform="translate(1 1)" fill="#424242"/></svg>

assets/icons/frontmatter-short-dark.svg

@@ -1,12 +1,17 @@
 <?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 25.4.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!-- Generator: Adobe Illustrator 26.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 viewBox="0 0 1250 1250" style="enable-background:new 0 0 1250 1250;" xml:space="preserve">
-<rect x="25" y="25" fill="none" stroke="#ffffff" stroke-width="50" stroke-miterlimit="10" width="1200" height="1200"/>
-<path fill="#ffffff" d="M316,1082.3H119.4V151.2h347.5v218.9H316v135.7h140.5v210.5H316V1082.3z"/>
-<path fill="#ffffff" d="M602.2,151.2H704l77.7,379.9c9.5,47.4,18.1,95,26,142.6c7.9,47.6,15,97.6,21.4,149.8c0.7-6.8,1.3-12.1,1.7-16
+<path fill="#C5C5C5" d="M316,1082.3H119.4V151.2h347.5v218.9H316v135.7h140.5v210.5H316V1082.3z"/>
+<path fill="#C5C5C5" d="M602.2,151.2H704l77.7,379.9c9.5,47.4,18.1,95,26,142.6s15,97.6,21.4,149.8c0.7-6.8,1.3-12.1,1.7-16
 	c0.2-2.7,0.6-5.5,1.1-8.2l16.6-106.7l14.9-101.3l13.2-66.9l69.2-373.3h102.9l81.2,931.1h-113.6l-19.9-316c-0.8-16.1-1.4-29.9-2-41.6
 	c-0.6-11.7-0.9-21.3-0.9-29L988.3,571l-2.8-114.6c0-0.8,0-2.5-0.3-5.1s-0.5-6.1-0.9-10.6l-2.8,18.7c-3,22.1-5.8,41.4-8.3,57.9
-	c-2.5,16.5-4.7,30.3-6.6,41.6l-15.1,84.9l-5.7,32l-74.3,406.4h-80.1l-69.7-351c-9.5-46.2-17.9-93.1-25.4-140.8
-	c-7.5-47.7-14.2-97.6-20.3-149.9l-34.3,641.6H529.6L602.2,151.2z"/>
+	s-4.7,30.3-6.6,41.6l-15.1,84.9l-5.7,32l-74.3,406.4h-80.1l-69.7-351c-9.5-46.2-17.9-93.1-25.4-140.8s-14.2-97.6-20.3-149.9
+	l-34.3,641.6H529.6L602.2,151.2z"/>
+<rect x="119.4" y="0.1" fill="#C5C5C5" width="184" height="64.7"/>
+<rect x="395.7" y="0.1" fill="#C5C5C5" width="184" height="64.7"/>
+<rect x="675.3" y="0.1" fill="#C5C5C5" width="184" height="64.7"/>
+<rect x="119.4" y="1184.7" fill="#C5C5C5" width="184" height="64.7"/>
+<rect x="395.7" y="1184.7" fill="#C5C5C5" width="184" height="64.7"/>
+<rect x="675.3" y="1184.7" fill="#C5C5C5" width="184" height="64.7"/>
 </svg>

assets/icons/frontmatter-short-light.svg

@@ -1,12 +1,17 @@
 <?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 25.4.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!-- Generator: Adobe Illustrator 26.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 viewBox="0 0 1250 1250" style="enable-background:new 0 0 1250 1250;" xml:space="preserve">
-<rect x="25" y="25" fill="none" stroke="#424242" stroke-width="50" stroke-miterlimit="10" width="1200" height="1200"/>
 <path fill="#424242" d="M316,1082.3H119.4V151.2h347.5v218.9H316v135.7h140.5v210.5H316V1082.3z"/>
-<path fill="#424242" d="M602.2,151.2H704l77.7,379.9c9.5,47.4,18.1,95,26,142.6c7.9,47.6,15,97.6,21.4,149.8c0.7-6.8,1.3-12.1,1.7-16
+<path fill="#424242" d="M602.2,151.2H704l77.7,379.9c9.5,47.4,18.1,95,26,142.6s15,97.6,21.4,149.8c0.7-6.8,1.3-12.1,1.7-16
 	c0.2-2.7,0.6-5.5,1.1-8.2l16.6-106.7l14.9-101.3l13.2-66.9l69.2-373.3h102.9l81.2,931.1h-113.6l-19.9-316c-0.8-16.1-1.4-29.9-2-41.6
 	c-0.6-11.7-0.9-21.3-0.9-29L988.3,571l-2.8-114.6c0-0.8,0-2.5-0.3-5.1s-0.5-6.1-0.9-10.6l-2.8,18.7c-3,22.1-5.8,41.4-8.3,57.9
-	c-2.5,16.5-4.7,30.3-6.6,41.6l-15.1,84.9l-5.7,32l-74.3,406.4h-80.1l-69.7-351c-9.5-46.2-17.9-93.1-25.4-140.8
-	c-7.5-47.7-14.2-97.6-20.3-149.9l-34.3,641.6H529.6L602.2,151.2z"/>
+	s-4.7,30.3-6.6,41.6l-15.1,84.9l-5.7,32l-74.3,406.4h-80.1l-69.7-351c-9.5-46.2-17.9-93.1-25.4-140.8s-14.2-97.6-20.3-149.9
+	l-34.3,641.6H529.6L602.2,151.2z"/>
+<rect x="119.4" y="0.1" fill="#424242" width="184" height="64.7"/>
+<rect x="395.7" y="0.1" fill="#424242" width="184" height="64.7"/>
+<rect x="675.3" y="0.1" fill="#424242" width="184" height="64.7"/>
+<rect x="119.4" y="1184.7" fill="#424242" width="184" height="64.7"/>
+<rect x="395.7" y="1184.7" fill="#424242" width="184" height="64.7"/>
+<rect x="675.3" y="1184.7" fill="#424242" width="184" height="64.7"/>
 </svg>

assets/icons/frontmatter-small-dark.svg

@@ -8,4 +8,4 @@
 	c-0.6-11.7-0.9-21.3-0.9-29L988.3,571l-2.8-114.6c0-0.8,0-2.5-0.3-5.1s-0.5-6.1-0.9-10.6l-2.8,18.7c-3,22.1-5.8,41.4-8.3,57.9
 	c-2.5,16.5-4.7,30.3-6.6,41.6l-15.1,84.9l-5.7,32l-74.3,406.4h-80.1l-69.7-351c-9.5-46.2-17.9-93.1-25.4-140.8
 	c-7.5-47.7-14.2-97.6-20.3-149.9l-34.3,641.6H529.6L602.2,151.2z"/>
-</svg>
+</svg>

assets/icons/scissors-dark.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="#C5C5C5" stroke-width="2">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M14.121 14.121L19 19m-7-7l7-7m-7 7l-2.879 2.879M12 12L9.121 9.121m0 5.758a3 3 0 10-4.243 4.243 3 3 0 004.243-4.243zm0-5.758a3 3 0 10-4.243-4.243 3 3 0 004.243 4.243z" />
+</svg>

assets/icons/scissors-light.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="#424242" stroke-width="2">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M14.121 14.121L19 19m-7-7l7-7m-7 7l-2.879 2.879M12 12L9.121 9.121m0 5.758a3 3 0 10-4.243 4.243 3 3 0 004.243-4.243zm0-5.758a3 3 0 10-4.243-4.243 3 3 0 004.243 4.243z" />
+</svg>

assets/media/styles.css

@@ -143,11 +143,13 @@
 }
 
 .article__tags {
+  /* position: relative; */
   margin-bottom: 1rem;
 }
 
 .article__tags__dropbox {
-  width: 90%;
+  /* Minus the twice the padding */
+  width: calc(100% - 2.5rem);
   margin: 0;
   padding: 0;
   z-index: 1;
@@ -165,22 +167,27 @@
   border: 1px solid var(--vscode-inputValidation-infoBorder);
 }
 
+.article__tags__input input:disabled {
+  border-color: transparent;
+}
+
 .article__tags__input.freeform {
   position: relative;
+  outline: 1px solid var(--vscode-inputValidation-infoBorder);
+  outline-offset: -1px;
 }
 
 .article__tags__input.freeform input {
   padding-right: 35px;
+  border: 0;
 }
 
 .article__tags__input button {
   position: absolute;
-  bottom: 1px;
-  top: 1px;
-  right: 1px;
+  bottom: 0;
+  top: 0;
+  right: 0;
   width: 30px;
-  padding-bottom: 2px; 
-  padding-top: 2px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -214,60 +221,6 @@
   margin-top: 1rem;
 }
 
-.article__tags__items__item {
-  display: inline-flex;
-  margin-bottom: .5rem;
-  margin-right: .5rem;
-}
-
-.article__tags__items__item {
-  display: inline-block;
-  margin-bottom: .5rem;
-  margin-right: .5rem;
-}
-
-.article__tags__items__item_add,
-.article__tags__items__item_delete {
-  display: inline-block;
-  width: auto;
-}
-
-.article__tags__items__item svg {
-  display: inline;
-  vertical-align: bottom;
-}
-
-.article__tags__items__item_delete span {
-  margin-left: .5rem;
-}
-
-.article__tags__items__pill_notexists {
-  color: var(--vscode-inputValidation-errorForeground);
-  background-color: var(--vscode-inputValidation-errorBackground);
-  padding-left: .5rem;
-}
-
-.article__tags__items__pill_notexists:hover {
-  color: var(--vscode-inputValidation-errorForeground);
-  background-color: var(--vscode-inputValidation-errorBackground);
-
-  filter: contrast(60%);
-}
-
-.article__tags__items__item_add {
-  color: var(--vscode-inputValidation-infoForeground);
-  background-color: var(--vscode-inputValidation-infoBackground);
-  border-right: 1px solid var(--vscode-inputValidation-infoBorder);
-}
-
-.article__tags__items__item_add:hover {
-  color: var(--vscode-inputValidation-infoForeground);
-  background-color: var(--vscode-inputValidation-infoBackground);
-  border-right: 1px solid var(--vscode-inputValidation-infoBorder);
-
-  filter: contrast(60%);
-}
-
 .article__actions > * + *,
 .other_actions > * + *,
 .base__actions > * + *,
@@ -348,6 +301,11 @@
   color: var(--vscode-button-secondaryForeground);
 }
 
+.ext_link_block a:hover,
+.ext_link_block button:hover {
+  background-color: var(--vscode-button-secondaryHoverBackground);
+}
+
 .table__cell {
   overflow: hidden;
 }
@@ -448,17 +406,17 @@ input:checked + .field__toggle__slider:before {
 
 .vscode-dark .metadata_field__box {
   background: rgba(255, 255, 255, 0.1);
-  border: 2px dashed rgba(255, 255, 255, 0.2);
+  border: 1px dashed rgba(255, 255, 255, 0.2);
 }
 
 .vscode-light .metadata_field__box {
   background: rgba(0, 0, 0, 0.1);
-  border: 2px dashed rgba(0, 0, 0, 0.2);
+  border: 1px dashed rgba(0, 0, 0, 0.2);
 }
 
 .metadata_field__box {
   background: rgba(255, 255, 255, 0.1);
-  border: 2px dashed rgba(255, 255, 255, 0.2);
+  border: 1px dashed rgba(255, 255, 255, 0.2);
   margin-bottom: .5rem;
   padding: .5rem 1rem;
 }
@@ -632,18 +590,21 @@ input:checked + .field__toggle__slider:before {
   max-height: 16rem;
 }
 
+.metadata_field__file__button,
 .metadata_field__preview_image__button {
   background-color: transparent;
-  border: 2px dashed var(--vscode-button-background);
+  border: 1px dashed var(--vscode-button-background);
   padding: 1.5rem;
   filter: brightness(85%);
 }
 
+.metadata_field__file__button:hover,
 .metadata_field__preview_image__button:hover {
   background-color: rgba(255, 255, 255, .1);
   filter: brightness(100%);
 }
 
+.metadata_field__file__button svg,
 .metadata_field__preview_image__button svg {
   color: var(--vscode-foreground);
   display: block;
@@ -652,6 +613,7 @@ input:checked + .field__toggle__slider:before {
   margin: 0 auto;
 }
 
+.metadata_field__file__button span,
 .metadata_field__preview_image__button span {
   color: var(--vscode-foreground);
   display: inline-block;
@@ -766,8 +728,12 @@ input:checked + .field__toggle__slider:before {
 }
 
 /* Timepicker */
+.react-datepicker button {
+  outline: 0;
+}
+
 .react-datepicker button:hover {
-  background-color: none !important;
+  background: none !important;
 }
 
 .react-datepicker__triangle {

assets/walkthrough/documentation.md

@@ -0,0 +1,3 @@
+## Documentation
+
+Our documentation can be found at: [https://frontmatter.codes/docs](https://frontmatter.codes/docs)

assets/walkthrough/get-started.md

@@ -0,0 +1,11 @@
+## Getting started
+
+Thanks for installing Front Matter!
+
+To get started, open our dashboard which will guide you through the initialization process of your project.
+
+When you haven't initialized your project yet, you will see the Front Matter's welcome screen on which you will have to perform the following steps:
+
+- Project initialization
+- Content folders registration
+- Framework initialization

assets/walkthrough/support-the-project.md

@@ -0,0 +1,8 @@
+## Support the project
+
+Front Matter is an open source project and we are always looking for new contributors, supporters, and partners. If you are interested in backing the project, please consider supporting it by donating. You can donate at via the following links:
+
+- [GitHub Sponsors](https://github.com/sponsors/estruyf)
+- [Open Collective](https://opencollective.com/frontmatter)
+
+> Each sponsor/backer will be mentioned on the [Front Matter](https://frontmatter.codes) website and on the [GitHub repository](https://github.com/estruyf/vscode-front-matter).

frontmatter.json

@@ -0,0 +1,55 @@
+{
+  "$schema": "https://beta.frontmatter.codes/frontmatter.schema.json",
+  "frontMatter.framework.id": "other",
+  "frontMatter.content.publicFolder": "",
+  "frontMatter.content.pageFolders": [
+    {
+      "title": ".vscode",
+      "path": "[[workspace]]/.vscode"
+    }
+  ],
+  "frontMatter.content.snippets": {
+    "New version": {
+      "description": "Insert a new version to the changelog",
+      "body": [
+        "## [{{version}}] - {{year}}-{{month}}-{{day}}",
+        "",
+        "### ✨ New features",
+        "",
+        "### 🎨 Enhancements",
+        "",
+        "### ⚡️ Optimizations",
+        "",
+        "### 🐞 Fixes"
+      ],
+      "fields": [
+        {
+          "type": "string",
+          "name": "version",
+          "title": "Version",
+          "single": true
+        },
+        {
+          "type": "string",
+          "name": "year",
+          "title": "Year",
+          "default": "2022"
+        },
+        {
+          "type": "string",
+          "name": "month",
+          "title": "Month",
+          "default": "xx"
+        },
+        {
+          "type": "string",
+          "name": "day",
+          "title": "Day",
+          "default": "xx"
+        }
+      ],
+      "openingTags": "{{",
+      "closingTags": "}}"
+    }
+  }
+}

package.json

@@ -3,7 +3,7 @@
   "displayName": "Front Matter",
   "description": "Front Matter is a CMS that runs within Visual Studio Code. It gives you the power and control of a full-blown CMS while also providing you the flexibility and speed of the static site generator of your choice like: Hugo, Jekyll, Hexo, NextJs, Gatsby, and many more...",
   "icon": "assets/frontmatter-teal-128x128.png",
-  "version": "6.0.0",
+  "version": "7.2.0",
   "preview": false,
   "publisher": "eliostruyf",
   "galleryBanner": {
@@ -45,26 +45,10 @@
     "url": "https://github.com/estruyf/vscode-front-matter"
   },
   "activationEvents": [
-    "*",
-    "onCommand:frontMatter.insertTags",
-    "onCommand:frontMatter.insertCategories",
-    "onCommand:frontMatter.createTag",
-    "onCommand:frontMatter.createCategory",
-    "onCommand:frontMatter.exportTaxonomy",
-    "onCommand:frontMatter.remap",
-    "onCommand:frontMatter.setLastModifiedDate",
-    "onCommand:frontMatter.generateSlug",
-    "onCommand:frontMatter.createFromTemplate",
-    "onCommand:frontMatter.registerFolder",
-    "onCommand:frontMatter.unregisterFolder",
-    "onCommand:frontMatter.createContent",
-    "onCommand:frontMatter.init",
-    "onCommand:frontMatter.collapseSections",
-    "onCommand:frontMatter.preview",
-    "onCommand:frontMatter.dashboard",
-    "onCommand:frontMatter.promoteSettings",
-    "onCommand:frontMatter.insertImage",
-    "onView:frontMatter.explorer"
+    "workspaceContains:**/.frontmatter",
+    "workspaceContains:**/frontmatter.json",
+    "onView:frontMatter.explorer",
+    "onStartupFinished"
   ],
   "main": "./dist/extension.js",
   "contributes": {
@@ -73,7 +57,7 @@
         {
           "id": "frontmatter-explorer",
           "title": "FrontMatter",
-          "icon": "assets/frontmatter.svg"
+          "icon": "assets/frontmatter-short-min.svg"
         }
       ]
     },
@@ -82,7 +66,7 @@
         {
           "id": "frontMatter.explorer",
           "name": "FrontMatter",
-          "icon": "assets/frontmatter.svg",
+          "icon": "assets/frontmatter-short-min.svg",
           "contextualTitle": "FrontMatter",
           "type": "webview"
         }
@@ -235,6 +219,47 @@
           "markdownDescription": "Specify the folder name where all your assets are located. For instance in Hugo this is the `static` folder. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.content.publicfolder)",
           "scope": "Content"
         },
+        "frontMatter.content.snippets": {
+          "type": "object",
+          "markdownDescription": "Define the snippets you want to use in your content. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.content.snippets)",
+          "additionalProperties": {
+            "type": "object",
+            "required": [
+              "body",
+              "fields"
+            ],
+            "properties": {
+              "body": {
+                "markdownDescription": "The snippet content.",
+                "type": [
+                  "string",
+                  "array"
+                ],
+                "items": {
+                  "type": "string"
+                }
+              },
+              "description": {
+                "description": "The snippet description.",
+                "type": "string"
+              },
+              "fields": {
+                "$ref": "#contenttypefield"
+              },
+              "openingTags": {
+                "description": "The snippet opening tags.",
+                "type": "string",
+                "default": "[["
+              },
+              "closingTags": {
+                "description": "The snippet closing tags.",
+                "type": "string",
+                "default": "]]"
+              }
+            },
+            "additionalProperties": false
+          }
+        },
         "frontMatter.content.sorting": {
           "type": "array",
           "default": [],
@@ -354,13 +379,19 @@
           },
           "scope": "Custom scripts"
         },
+        "frontMatter.dashboard.content.cardTags": {
+          "type": "string",
+          "default": "tags",
+          "markdownDescription": "Specify the name of the metadata field that will be used to show the tags on the content card. When empty or null, it will hide the tags from the card. [Check in the docs](https://frontmatter.codes/docs/settings#frontMatter.dashboard.content.cardTags)",
+          "scope": "Dashboard"
+        },
         "frontMatter.dashboard.mediaSnippet": {
           "type": "array",
           "default": [],
           "markdownDescription": "Specify the a snippet for your custom media insert markup. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.dashboard.mediasnippet)",
           "items": {
             "type": "string",
-            "description": "The parts of your snippet. Use `{mediaUrl}` as placeholder where the path of the image needs to be inserted."
+            "description": "Use the `{mediaUrl}`, `{caption}`, `{alt}`, `{filename}`, `{mediaHeight}`, and `{mediaWidth}` placeholders in your snippet to automatically insert the media information."
           },
           "scope": "dashboard"
         },
@@ -517,6 +548,12 @@
           },
           "scope": "Data"
         },
+        "frontMatter.file.preserveCasing": {
+          "type": "boolean",
+          "default": false,
+          "markdownDescription": "Specify if you want to preserve the casing of your file names from the title. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.file.preservecasing)",
+          "scope": "File"
+        },
         "frontMatter.framework.id": {
           "type": "string",
           "default": "",
@@ -530,6 +567,55 @@
           "default": null,
           "markdownDescription": "Specify the command you want to use to start your static site generator or framework. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.framework.startcommand)"
         },
+        "frontMatter.global.activeMode": {
+          "type": [
+            "string",
+            "null"
+          ],
+          "default": "",
+          "markdownDescription": "Specify the activated mode of Front Matter. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.global.activemode)",
+          "scope": "Global"
+        },
+        "frontMatter.global.modes": {
+          "type": "array",
+          "default": [],
+          "markdownDescription": "Specify the modes you want to use for Front Matter. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.global.modes)",
+          "items": {
+            "type": "object",
+            "default": {},
+            "properties": {
+              "id": {
+                "type": "string",
+                "description": "The ID of your mode."
+              },
+              "features": {
+                "type": "array",
+                "default": [],
+                "description": "The features you want to use for your mode.",
+                "items": {
+                  "type": "string",
+                  "enum": [
+                    "panel.globalSettings",
+                    "panel.seo",
+                    "panel.actions",
+                    "panel.contentType",
+                    "panel.metadata",
+                    "panel.recentlyModified",
+                    "panel.otherActions",
+                    "dashboard.snippets.view",
+                    "dashboard.snippets.manage",
+                    "dashboard.data.view"
+                  ]
+                }
+              }
+            },
+            "required": [
+              "id",
+              "features"
+            ]
+          },
+          "scope": "Global"
+        },
         "frontMatter.global.notifications": {
           "type": "array",
           "items": {
@@ -560,6 +646,19 @@
           "markdownDescription": "Specify the default sorting option for the media dashboard. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.media.defaultsorting)",
           "scope": "Content"
         },
+        "frontMatter.media.supportedMimeTypes": {
+          "type": "array",
+          "default": [
+            "image/*",
+            "video/*",
+            "audio/*"
+          ],
+          "markdownDescription": "Specify the mime types to support for the media files. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.media.supportedMimeTypes)",
+          "items": {
+            "type": "string"
+          },
+          "scope": "Media"
+        },
         "frontMatter.panel.freeform": {
           "type": "boolean",
           "default": true,
@@ -646,12 +745,15 @@
                         "datetime",
                         "boolean",
                         "image",
+                        "file",
                         "choice",
                         "taxonomy",
                         "tags",
                         "categories",
                         "draft",
-                        "fields"
+                        "fields",
+                        "json",
+                        "block"
                       ],
                       "description": "Define the type of field"
                     },
@@ -664,7 +766,14 @@
                       "description": "Title to show in the UI"
                     },
                     "default": {
-                      "type": "string",
+                      "type": [
+                        "string",
+                        "number",
+                        "boolean",
+                        "array",
+                        "object",
+                        "null"
+                      ],
                       "description": "Default value"
                     },
                     "choices": {
@@ -695,6 +804,11 @@
                       "default": false,
                       "description": "Is a single line field"
                     },
+                    "wysiwyg": {
+                      "type": "boolean",
+                      "default": false,
+                      "description": "Is a WYSIWYG field (HTML output)"
+                    },
                     "multiple": {
                       "type": "boolean",
                       "default": false,
@@ -715,8 +829,52 @@
                       "default": "",
                       "description": "The ID of your taxonomy field"
                     },
+                    "fileExtensions": {
+                      "type": "array",
+                      "description": "Specify the file extensions to allow for the file picker",
+                      "items": {
+                        "type": "string"
+                      }
+                    },
                     "fields": {
                       "$ref": "#contenttypefield"
+                    },
+                    "fieldGroup": {
+                      "type": [
+                        "string",
+                        "array"
+                      ],
+                      "default": [],
+                      "description": "The ID(s) of your field group(s) defined in the `frontMatter.taxonomy.fieldGroups` setting",
+                      "items": {
+                        "type": "string"
+                      }
+                    },
+                    "dataType": {
+                      "type": [
+                        "string",
+                        "array"
+                      ],
+                      "default": [],
+                      "description": "The ID(s) of your data type(s) defined in the `frontMatter.data.types` setting",
+                      "items": {
+                        "type": "string"
+                      }
+                    },
+                    "taxonomyLimit": {
+                      "type": "number",
+                      "default": 0,
+                      "description": "Limit the number of taxonomies to select. Set to 0 to allow unlimited."
+                    },
+                    "isPublishDate": {
+                      "type": "boolean",
+                      "default": false,
+                      "description": "Specify if the field is the publish date field"
+                    },
+                    "isModifiedDate": {
+                      "type": "boolean",
+                      "default": false,
+                      "description": "Specify if the field is the modified date field"
                     }
                   },
                   "additionalProperties": false,
@@ -725,6 +883,20 @@
                     "name"
                   ],
                   "allOf": [
+                    {
+                      "if": {
+                        "properties": {
+                          "type": {
+                            "const": "file"
+                          }
+                        }
+                      },
+                      "then": {
+                        "required": [
+                          "fileExtensions"
+                        ]
+                      }
+                    },
                     {
                       "if": {
                         "properties": {
@@ -766,6 +938,34 @@
                           "fields"
                         ]
                       }
+                    },
+                    {
+                      "if": {
+                        "properties": {
+                          "type": {
+                            "const": "block"
+                          }
+                        }
+                      },
+                      "then": {
+                        "required": [
+                          "fieldGroup"
+                        ]
+                      }
+                    },
+                    {
+                      "if": {
+                        "properties": {
+                          "type": {
+                            "const": "json"
+                          }
+                        }
+                      },
+                      "then": {
+                        "required": [
+                          "dataType"
+                        ]
+                      }
                     }
                   ]
                 }
@@ -808,7 +1008,9 @@
                 {
                   "title": "Publishing date",
                   "name": "date",
-                  "type": "datetime"
+                  "type": "datetime",
+                  "default": "{{now}}",
+                  "isPublishDate": true
                 },
                 {
                   "title": "Content preview",
@@ -864,13 +1066,36 @@
         "frontMatter.taxonomy.dateField": {
           "type": "string",
           "default": "date",
-          "markdownDescription": "This setting is used to define the publishing date field of your articles. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.taxonomy.datefield)"
+          "markdownDescription": "This setting is used to define the publishing date field of your articles. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.taxonomy.datefield)",
+          "deprecationMessage": "This setting is deprecated and will be removed in the next major version. Please use the new `isPublishDate` settings instead in your content types date fields."
         },
         "frontMatter.taxonomy.dateFormat": {
           "type": "string",
           "markdownDescription": "Specify the date format for your articles. Check [date-fns formating](https://date-fns.org/v2.0.1/docs/format) for more information. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.taxonomy.dateformat)",
           "scope": "Taxonomy"
         },
+        "frontMatter.taxonomy.fieldGroups": {
+          "type": "array",
+          "markdownDescription": "Define the field groups you want to use for your block fields. [Check in the docs](https://frontmatter.codes/docs/settings#frontMatter.taxonomy.fieldgroups)",
+          "default": [],
+          "items": {
+            "type": "object",
+            "properties": {
+              "id": {
+                "type": "string",
+                "description": "The name of the field group"
+              },
+              "fields": {
+                "$ref": "#contenttypefield"
+              }
+            },
+            "additionalProperties": false,
+            "required": [
+              "name",
+              "fields"
+            ]
+          }
+        },
         "frontMatter.taxonomy.frontMatterType": {
           "type": "string",
           "default": "YAML",
@@ -896,7 +1121,8 @@
         "frontMatter.taxonomy.modifiedField": {
           "type": "string",
           "default": "lastmod",
-          "markdownDescription": "This setting is used to define the modified date field of your articles. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.taxonomy.modifiedfield)"
+          "markdownDescription": "This setting is used to define the modified date field of your articles. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.taxonomy.modifiedfield)",
+          "deprecationMessage": "This setting is deprecated and will be removed in the next major version. Please use the new `isModifiedDate` settings instead in your content types date fields."
         },
         "frontMatter.taxonomy.noPropertyValueQuotes": {
           "type": "array",
@@ -956,6 +1182,11 @@
           },
           "scope": "Taxonomy"
         },
+        "frontMatter.telemetry.disable": {
+          "type": "boolean",
+          "default": false,
+          "markdownDescription": "Specify if you want to disable the telemetry. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.telemetry.disable)"
+        },
         "frontMatter.templates.folder": {
           "type": "string",
           "default": ".frontmatter/templates",
@@ -976,6 +1207,30 @@
         "title": "Authenticate",
         "category": "Front matter"
       },
+      {
+        "command": "frontMatter.contenttype.generate",
+        "title": "Generate content type from current file",
+        "category": "Front matter"
+      },
+      {
+        "command": "frontMatter.contenttype.addMissingFields",
+        "title": "Add missing fields from front matter to content type",
+        "category": "Front matter"
+      },
+      {
+        "command": "frontMatter.contenttype.setContentType",
+        "title": "Set the content type to use for the current file",
+        "category": "Front matter"
+      },
+      {
+        "command": "frontMatter.markup.blockquote",
+        "title": "Blockquote",
+        "category": "Front matter",
+        "icon": {
+          "light": "assets/icons/blockquote-light.svg",
+          "dark": "assets/icons/blockquote-dark.svg"
+        }
+      },
       {
         "command": "frontMatter.markup.bold",
         "title": "Bold",
@@ -1012,15 +1267,6 @@
           "dark": "assets/icons/codeblock-dark.svg"
         }
       },
-      {
-        "command": "frontMatter.markup.blockquote",
-        "title": "Codeblock",
-        "category": "Front matter",
-        "icon": {
-          "light": "assets/icons/blockquote-light.svg",
-          "dark": "assets/icons/blockquote-dark.svg"
-        }
-      },
       {
         "command": "frontMatter.collapseSections",
         "title": "Collapse sections",
@@ -1097,14 +1343,23 @@
         "category": "Front matter"
       },
       {
-        "command": "frontMatter.insertImage",
-        "title": "Insert image into your content",
+        "command": "frontMatter.insertMedia",
+        "title": "Insert media into your content",
         "category": "Front matter",
         "icon": {
           "dark": "/assets/icons/media-dark.svg",
           "light": "/assets/icons/media-light.svg"
         }
       },
+      {
+        "command": "frontMatter.insertSnippet",
+        "title": "Insert snippet into your content",
+        "category": "Front matter",
+        "icon": {
+          "dark": "/assets/icons/scissors-dark.svg",
+          "light": "/assets/icons/scissors-light.svg"
+        }
+      },
       {
         "command": "frontMatter.insertTags",
         "title": "Insert tags",
@@ -1146,6 +1401,15 @@
           "light": "/assets/icons/frontmatter-small-light.svg"
         }
       },
+      {
+        "command": "frontMatter.dashboard.snippets",
+        "title": "Open snippets dashboard",
+        "category": "Front matter",
+        "icon": {
+          "dark": "/assets/icons/frontmatter-small-dark.svg",
+          "light": "/assets/icons/frontmatter-small-light.svg"
+        }
+      },
       {
         "command": "frontMatter.markup.orderedlist",
         "title": "Ordered list",
@@ -1193,6 +1457,12 @@
           "dark": "assets/icons/strikethrough-dark.svg"
         }
       },
+      {
+        "command": "frontMatter.mode.switch",
+        "title": "Switch mode",
+        "category": "Front matter",
+        "icon": "$(preview)"
+      },
       {
         "command": "frontMatter.markup.tasklist",
         "title": "Task list",
@@ -1212,63 +1482,68 @@
       "editor/title": [
         {
           "command": "frontMatter.markup.heading",
-          "group": "navigation@-132",
-          "when": "resourceLangId == markdown && frontMatter:markdown:wysiwyg"
+          "group": "navigation@-133",
+          "when": "frontMatter:file:isValid == true && frontMatter:markdown:wysiwyg"
         },
         {
           "command": "frontMatter.markup.bold",
-          "group": "navigation@-131",
-          "when": "resourceLangId == markdown && frontMatter:markdown:wysiwyg"
+          "group": "navigation@-132",
+          "when": "frontMatter:file:isValid == true && frontMatter:markdown:wysiwyg"
         },
         {
           "command": "frontMatter.markup.italic",
-          "group": "navigation@-130",
-          "when": "resourceLangId == markdown && frontMatter:markdown:wysiwyg"
+          "group": "navigation@-131",
+          "when": "frontMatter:file:isValid == true && frontMatter:markdown:wysiwyg"
         },
         {
           "command": "frontMatter.markup.strikethrough",
+          "group": "navigation@-130",
+          "when": "frontMatter:file:isValid == true && frontMatter:markdown:wysiwyg"
+        },
+        {
+          "command": "frontMatter.insertSnippet",
           "group": "navigation@-129",
-          "when": "resourceLangId == markdown && frontMatter:markdown:wysiwyg"
+          "when": "frontMatter:file:isValid == true && frontMatter:dashboard:snippets:enabled"
         },
         {
-          "command": "frontMatter.markup.blockquote",
+          "command": "frontMatter.insertMedia",
           "group": "navigation@-128",
-          "when": "resourceLangId == markdown && frontMatter:markdown:wysiwyg"
-        },
-        {
-          "command": "frontMatter.insertImage",
-          "group": "navigation@-127",
-          "when": "resourceLangId == markdown"
+          "when": "frontMatter:file:isValid == true"
         },
         {
           "command": "frontMatter.markup.options",
           "group": "navigation@-126",
-          "when": "resourceLangId == markdown && frontMatter:markdown:wysiwyg"
+          "when": "frontMatter:file:isValid == true && frontMatter:markdown:wysiwyg"
         },
         {
           "command": "frontMatter.markup.orderedlist",
           "group": "1_markup@1",
-          "when": "resourceLangId == markdown && frontMatter:markdown:wysiwyg"
+          "when": "frontMatter:file:isValid == true && frontMatter:markdown:wysiwyg"
         },
         {
           "command": "frontMatter.markup.unorderedlist",
           "group": "1_markup@2",
-          "when": "resourceLangId == markdown && frontMatter:markdown:wysiwyg"
+          "when": "frontMatter:file:isValid == true && frontMatter:markdown:wysiwyg"
         },
         {
           "command": "frontMatter.markup.tasklist",
           "group": "1_markup@3",
-          "when": "resourceLangId == markdown && frontMatter:markdown:wysiwyg"
+          "when": "frontMatter:file:isValid == true && frontMatter:markdown:wysiwyg"
         },
         {
           "command": "frontMatter.markup.code",
           "group": "1_markup@4",
-          "when": "resourceLangId == markdown && frontMatter:markdown:wysiwyg"
+          "when": "frontMatter:file:isValid == true && frontMatter:markdown:wysiwyg"
         },
         {
           "command": "frontMatter.markup.codeblock",
           "group": "1_markup@5",
-          "when": "resourceLangId == markdown && frontMatter:markdown:wysiwyg"
+          "when": "frontMatter:file:isValid == true && frontMatter:markdown:wysiwyg"
+        },
+        {
+          "command": "frontMatter.markup.blockquote",
+          "group": "1_markup@6",
+          "when": "frontMatter:file:isValid == true && frontMatter:markdown:wysiwyg"
         },
         {
           "command": "frontMatter.dashboard",
@@ -1311,6 +1586,14 @@
           "command": "frontMatter.preview",
           "when": "frontMatterCanOpenPreview"
         },
+        {
+          "command": "frontMatter.dashboard.data",
+          "when": "frontMatter:dashboard:data:enabled"
+        },
+        {
+          "command": "frontMatter.dashboard.snippets",
+          "when": "frontMatter:dashboard:snippets:enabled"
+        },
         {
           "command": "frontMatter.collapseSections",
           "when": "false"
@@ -1374,12 +1657,75 @@
         {
           "command": "frontMatter.markup.options",
           "when": "false"
+        },
+        {
+          "command": "frontMatter.insertSnippet",
+          "when": "frontMatter:file:isValid == true && frontMatter:dashboard:snippets:enabled"
+        },
+        {
+          "command": "frontMatter.insertMedia",
+          "when": "frontMatter:file:isValid == true"
+        },
+        {
+          "command": "frontMatter.createCategory",
+          "when": "frontMatter:file:isValid == true"
+        },
+        {
+          "command": "frontMatter.createTag",
+          "when": "frontMatter:file:isValid == true"
+        },
+        {
+          "command": "frontMatter.insertCategories",
+          "when": "frontMatter:file:isValid == true"
+        },
+        {
+          "command": "frontMatter.insertTags",
+          "when": "frontMatter:file:isValid == true"
+        },
+        {
+          "command": "frontMatter.createTemplate",
+          "when": "frontMatter:file:isValid == true"
+        },
+        {
+          "command": "frontMatter.preview",
+          "when": "frontMatter:file:isValid == true"
+        },
+        {
+          "command": "frontMatter.setLastModifiedDate",
+          "when": "frontMatter:file:isValid == true"
+        },
+        {
+          "command": "frontMatter.generateSlug",
+          "when": "frontMatter:file:isValid == true"
+        },
+        {
+          "command": "frontMatter.contenttype.generate",
+          "when": "frontMatter:file:isValid == true"
+        },
+        {
+          "command": "frontMatter.contenttype.addMissingFields",
+          "when": "frontMatter:file:isValid == true"
+        },
+        {
+          "command": "frontMatter.contenttype.setContentType",
+          "when": "frontMatter:file:isValid == true"
         }
       ],
       "view/title": [
         {
           "command": "frontMatter.collapseSections",
-          "group": "frontmatter-explorer"
+          "group": "navigation@0",
+          "when": "view == frontMatter.explorer"
+        },
+        {
+          "command": "frontMatter.mode.switch",
+          "group": "navigation@1",
+          "when": "view == frontMatter.explorer && frontMatter:has:modes == true"
+        },
+        {
+          "command": "frontMatter.dashboard",
+          "group": "navigation@2",
+          "when": "view == frontMatter.explorer"
         }
       ]
     },
@@ -1391,6 +1737,48 @@
           "text.html.markdown"
         ]
       }
+    ],
+    "walkthroughs": [
+      {
+        "id": "frontmatter.welcome",
+        "title": "Get started with Front Matter",
+        "description": "Discover the features of Front Matter and learn how to use the CMS for your SSG or static site.",
+        "steps": [
+          {
+            "id": "frontmatter.welcome.init",
+            "title": "Get started",
+            "description": "Initial steps to get started.\n[Open dashboard](command:frontMatter.dashboard)",
+            "media": {
+              "markdown": "assets/walkthrough/get-started.md"
+            },
+            "completionEvents": [
+              "onContext:frontMatterInitialized"
+            ]
+          },
+          {
+            "id": "frontmatter.welcome.documentation",
+            "title": "Documentation",
+            "description": "Check out the documentation for Front Matter.\n[View our documentation](https://frontmatter.codes/docs)",
+            "media": {
+              "markdown": "assets/walkthrough/documentation.md"
+            },
+            "completionEvents": [
+              "onLink:https://frontmatter.codes/docs"
+            ]
+          },
+          {
+            "id": "frontmatter.welcome.supporter",
+            "title": "Support the project",
+            "description": "Become a supporter.\n[Support the project](https://github.com/sponsors/estruyf)",
+            "media": {
+              "markdown": "assets/walkthrough/support-the-project.md"
+            },
+            "completionEvents": [
+              "onLink:https://github.com/sponsors/estruyf"
+            ]
+          }
+        ]
+      }
     ]
   },
   "scripts": {
@@ -1412,8 +1800,8 @@
   },
   "devDependencies": {
     "@bendera/vscode-webview-elements": "0.6.2",
-    "@estruyf/vscode": "0.0.2",
-    "@headlessui/react": "^1.4.1",
+    "@estruyf/vscode": "0.0.3",
+    "@headlessui/react": "^1.5.0",
     "@heroicons/react": "1.0.4",
     "@iarna/toml": "2.2.3",
     "@octokit/rest": "^18.12.0",
@@ -1421,9 +1809,14 @@
     "@sentry/tracing": "^6.13.3",
     "@tailwindcss/forms": "^0.3.3",
     "@types/glob": "7.1.3",
+    "@types/invariant": "^2.2.35",
     "@types/js-yaml": "3.12.1",
+    "@types/lodash.omit": "^4.5.6",
     "@types/lodash.uniqby": "4.7.6",
+    "@types/lodash.xor": "^4.5.6",
+    "@types/mime-types": "^2.1.1",
     "@types/mocha": "^5.2.6",
+    "@types/mustache": "^4.1.2",
     "@types/node": "10.17.48",
     "@types/node-fetch": "^2.5.12",
     "@types/react": "17.0.0",
@@ -1431,7 +1824,8 @@
     "@types/react-dom": "17.0.0",
     "@types/vscode": "^1.63.0",
     "@vscode/codicons": "0.0.20",
-    "@vscode/webview-ui-toolkit": "^0.8.1",
+    "@vscode/extension-telemetry": "^0.4.7",
+    "@vscode/webview-ui-toolkit": "^0.9.1",
     "@webpack-cli/serve": "^1.6.0",
     "ajv": "^8.8.2",
     "array-move": "^4.0.0",
@@ -1439,15 +1833,20 @@
     "css-loader": "5.2.7",
     "date-fns": "2.23.0",
     "downshift": "6.0.6",
-    "fuse.js": "6.4.6",
+    "fuse.js": "6.5.3",
     "glob": "7.1.6",
     "gray-matter": "4.0.2",
     "html-loader": "1.3.2",
     "html-webpack-plugin": "4.5.0",
     "image-size": "^1.0.0",
+    "invariant": "^2.2.4",
     "lodash-es": "^4.17.21",
+    "lodash.omit": "^4.5.0",
     "lodash.uniqby": "4.7.0",
+    "lodash.xor": "^4.5.0",
     "mdast-util-from-markdown": "1.0.0",
+    "mime-types": "^2.1.35",
+    "mustache": "^4.2.0",
     "node-json-db": "^1.3.0",
     "npm-run-all": "^4.1.5",
     "path-browserify": "^1.0.1",
@@ -1458,12 +1857,14 @@
     "react-datepicker": "4.2.1",
     "react-dom": "17.0.1",
     "react-dropzone": "^11.3.4",
+    "react-quill": "^2.0.0-beta.4",
     "react-sortable-hoc": "^2.0.0",
     "react-toastify": "^8.1.0",
     "recoil": "^0.4.1",
     "rimraf": "^3.0.2",
     "style-loader": "2.0.0",
     "tailwindcss": "^2.2.7",
+    "tailwindcss-nested-groups": "^1.2.4",
     "ts-loader": "8.0.3",
     "tslint": "6.1.3",
     "typescript": "^4.5.4",
@@ -1476,9 +1877,11 @@
     "webpack": "^5.65.0",
     "webpack-bundle-analyzer": "^4.5.0",
     "webpack-cli": "^4.9.1",
-    "webpack-dev-server": "^4.6.0"
+    "webpack-dev-server": "^4.6.0",
+    "yaml": "^1.10.2",
+    "yawn-yaml": "^1.5.0"
   },
   "dependencies": {
     "node-fetch": "^2.6.7"
   }
-}
+}

src/commands/Article.ts

@@ -1,17 +1,21 @@
+import { DEFAULT_CONTENT_TYPE } from './../constants/ContentType';
 import { isValidFile } from './../helpers/isValidFile';
-import { SETTING_AUTO_UPDATE_DATE, SETTING_MODIFIED_FIELD, SETTING_SLUG_UPDATE_FILE_NAME, SETTING_TEMPLATES_PREFIX, CONFIG_KEY, SETTING_DATE_FORMAT, SETTING_SLUG_PREFIX, SETTING_SLUG_SUFFIX, SETTINGS_CONTENT_PLACEHOLDERS } from './../constants';
+import { SETTING_AUTO_UPDATE_DATE, SETTING_MODIFIED_FIELD, SETTING_SLUG_UPDATE_FILE_NAME, SETTING_TEMPLATES_PREFIX, CONFIG_KEY, SETTING_DATE_FORMAT, SETTING_SLUG_PREFIX, SETTING_SLUG_SUFFIX, SETTING_CONTENT_PLACEHOLDERS, TelemetryEvent } from './../constants';
 import * as vscode from 'vscode';
 import { Field, TaxonomyType } from "../models";
 import { format } from "date-fns";
 import { ArticleHelper, Settings, SlugHelper } from '../helpers';
-import matter = require('gray-matter');
 import { Notifications } from '../helpers/Notifications';
 import { extname, basename, parse, dirname } from 'path';
 import { COMMAND_NAME, DefaultFields } from '../constants';
 import { DashboardData } from '../models/DashboardData';
-import { ExplorerView } from '../explorerView/ExplorerView';
 import { DateHelper } from '../helpers/DateHelper';
 import { parseWinPath } from '../helpers/parseWinPath';
+import { Telemetry } from '../helpers/Telemetry';
+import { ParsedFrontMatter } from '../parsers';
+import { MediaListener } from '../listeners/panel';
+import { NavigationType } from '../dashboardWebView/models';
+import { processKnownPlaceholders } from '../helpers/PlaceholderHelper';
 
 
 export class Article {
@@ -26,7 +30,7 @@ export class Article {
       return;
     }
 
-    const article = Article.getCurrent();
+    const article = ArticleHelper.getCurrent();
 
     if (!article) {
       return;
@@ -102,7 +106,7 @@ export class Article {
    * Update the date in the front matter
    * @param article 
    */
-  public static updateDate(article: matter.GrayMatterFile<string>, forceCreate: boolean = false) {
+  public static updateDate(article: ParsedFrontMatter, forceCreate: boolean = false) {
     article.data = ArticleHelper.updateDates(article.data);   
     return article;
   }
@@ -124,7 +128,7 @@ export class Article {
 
     ArticleHelper.update(
       editor,
-      updatedArticle as matter.GrayMatterFile<string>
+      updatedArticle as ParsedFrontMatter
     );
   }
 
@@ -144,15 +148,16 @@ export class Article {
 
   private static setLastModifiedDateInner(
     document: vscode.TextDocument
-  ): matter.GrayMatterFile<string> | undefined {
+  ): ParsedFrontMatter | undefined {
     const article = ArticleHelper.getFrontMatterFromDocument(document);
 
-    if (!article) {
+    // Only set the date, if there is already front matter set
+    if (!article || !article.data || Object.keys(article.data).length === 0) {
       return;
     }
 
     const cloneArticle = Object.assign({}, article);
-    const dateField = Settings.get(SETTING_MODIFIED_FIELD) as string || DefaultFields.LastModified;
+    const dateField = ArticleHelper.getModifiedDateField(article) || DefaultFields.LastModified;
     try {
       cloneArticle.data[dateField] = Article.formatDate(new Date());
       return cloneArticle;
@@ -165,6 +170,8 @@ export class Article {
    * Generate the slug based on the article title
    */
 	public static async generateSlug() {
+		Telemetry.send(TelemetryEvent.generateSlug);
+    
     const prefix = Settings.get(SETTING_SLUG_PREFIX) as string;
     const suffix = Settings.get(SETTING_SLUG_SUFFIX) as string;
     const updateFileName = Settings.get(SETTING_SLUG_UPDATE_FILE_NAME) as string;
@@ -197,13 +204,14 @@ export class Article {
         }
 
         // Update the fields containing a custom placeholder that depends on slug
-        const placeholders = Settings.get<{id: string, value: string}[]>(SETTINGS_CONTENT_PLACEHOLDERS);
+        const placeholders = Settings.get<{id: string, value: string}[]>(SETTING_CONTENT_PLACEHOLDERS);
         const customPlaceholders = placeholders?.filter(p => p.value.includes("{{slug}}"));
+        const dateFormat = Settings.get(SETTING_DATE_FORMAT) as string;
         for (const customPlaceholder of (customPlaceholders || [])) {
           const customPlaceholderFields = contentType.fields.filter(f => f.default === `{{${customPlaceholder.id}}}`);
           for (const pField of customPlaceholderFields) {
             article.data[pField.name] = customPlaceholder.value;
-            article.data[pField.name] = ArticleHelper.processKnownPlaceholders(article.data[pField.name], articleTitle);
+            article.data[pField.name] = processKnownPlaceholders(article.data[pField.name], articleTitle, dateFormat);
           }
         }
       }
@@ -291,7 +299,7 @@ export class Article {
    */
   public static async autoUpdate(event: vscode.TextDocumentWillSaveEvent) {
     const document = event.document;
-    if (document && ArticleHelper.isMarkdownFile(document)) {
+    if (document && ArticleHelper.isSupportedFile(document)) {
       const autoUpdate = Settings.get(SETTING_AUTO_UPDATE_DATE);
 
       if (autoUpdate) {
@@ -316,17 +324,21 @@ export class Article {
   /**
    * Insert an image from the media dashboard into the article
    */
-  public static async insertImage() {
+  public static async insertMedia() {
 		let editor = vscode.window.activeTextEditor;
     if (!editor) {
       return;
     }
 
+    const article = ArticleHelper.getFrontMatter(editor);
+    const contentType = article && article.data ? ArticleHelper.getContentType(article.data) : DEFAULT_CONTENT_TYPE;
+
     const position = editor.selection.active;
 
     await vscode.commands.executeCommand(COMMAND_NAME.dashboard, {
       type: "media",
       data: {
+        pageBundle: !!contentType.pageBundle,
         filePath: editor.document.uri.fsPath,
         fieldName: basename(editor.document.uri.fsPath),
         position
@@ -334,25 +346,34 @@ export class Article {
     } as DashboardData);
 
     // Let the editor panel know you are selecting an image
-    ExplorerView.getInstance().getMediaSelection();
+    MediaListener.getMediaSelection();
 	}
 
   /**
-   * Get the current article
+   * Insert a snippet into the article
    */
-  private static getCurrent(): matter.GrayMatterFile<string> | undefined {
-    const editor = vscode.window.activeTextEditor;
+  public static async insertSnippet() {
+		let editor = vscode.window.activeTextEditor;
     if (!editor) {
       return;
     }
 
-    const article = ArticleHelper.getFrontMatter(editor);
-    if (!article) {
-      return;
-    }
+    const position = editor.selection.active;
+    const selectionText = editor.document.getText(editor.selection);
 
-    return article;
-  }
+    const article = ArticleHelper.getFrontMatter(editor);
+
+    await vscode.commands.executeCommand(COMMAND_NAME.dashboard, {
+      type: NavigationType.Snippets,
+      data: {
+        fileTitle: article?.data.title || "",
+        filePath: editor.document.uri.fsPath,
+        fieldName: basename(editor.document.uri.fsPath),
+        position,
+        selection: selectionText
+      }
+    } as DashboardData);
+	}
 
   /**
    * Update the article date and return it
@@ -361,7 +382,7 @@ export class Article {
    * @param field 
    * @param forceCreate 
    */
-  private static articleDate(article: matter.GrayMatterFile<string>, field: string, forceCreate: boolean) {
+  private static articleDate(article: ParsedFrontMatter, field: string, forceCreate: boolean) {
     if (typeof article.data[field] !== "undefined" || forceCreate) {
       article.data[field] = Article.formatDate(new Date());
     }

src/commands/Backers.ts

@@ -5,6 +5,7 @@ import { Credentials } from "../services/Credentials";
 import fetch from "node-fetch";
 import { ExplorerView } from '../explorerView/ExplorerView';
 import { Dashboard } from './Dashboard';
+import { SettingsListener } from '../listeners/panel';
 
 export class Backers {
   private static creds: Credentials | null = null;
@@ -60,7 +61,7 @@ export class Backers {
       if (!prevData) {
         const explorerView = ExplorerView.getInstance();
         if (explorerView.visible) {
-          explorerView.getSettings();
+          SettingsListener.getSettings();
         }
     
         if (Dashboard.isOpen) {

src/commands/Dashboard.ts

@@ -1,6 +1,4 @@
-import { PagesListener } from './../listeners/PagesListener';
-import { ExtensionListener } from './../listeners/ExtensionListener';
-import { SETTINGS_DASHBOARD_OPENONSTART, CONTEXT } from '../constants';
+import { SETTING_DASHBOARD_OPENONSTART, CONTEXT } from '../constants';
 import { join } from "path";
 import { commands, Uri, ViewColumn, Webview, WebviewPanel, window } from "vscode";
 import { Logger, Settings as SettingsHelper } from '../helpers';
@@ -8,10 +6,10 @@ import { DashboardCommand } from '../dashboardWebView/DashboardCommand';
 import { Extension } from '../helpers/Extension';
 import { WebviewHelper } from '@estruyf/vscode';
 import { DashboardData } from '../models/DashboardData';
-import { ExplorerView } from '../explorerView/ExplorerView';
 import { MediaLibrary } from '../helpers/MediaLibrary';
-import { DashboardListener, MediaListener, SettingsListener } from '../listeners';
-import { DataListener } from '../listeners/DataListener';
+import { DashboardListener, MediaListener, SettingsListener, TelemetryListener, DataListener, PagesListener, ExtensionListener, SnippetListener } from '../listeners/dashboard';
+import { MediaListener as PanelMediaListener } from '../listeners/panel'
+import { ModeListener } from '../listeners/general';
 
 export class Dashboard {
   private static webview: WebviewPanel | null = null;
@@ -26,7 +24,7 @@ export class Dashboard {
    * Init the dashboard
    */
   public static async init() {
-    const openOnStartup = SettingsHelper.get(SETTINGS_DASHBOARD_OPENONSTART);
+    const openOnStartup = SettingsHelper.get(SETTING_DASHBOARD_OPENONSTART);
     if (openOnStartup) {
       Dashboard.open();
     }
@@ -116,8 +114,7 @@ export class Dashboard {
     Dashboard.webview.onDidChangeViewState(async () => {
       if (!this.webview?.visible) {
         Dashboard._viewData = undefined;
-        const panel = ExplorerView.getInstance(extensionUri);
-        panel.getMediaSelection();
+        PanelMediaListener.getMediaSelection();
 
         Dashboard.postWebviewMessage({ command: DashboardCommand.viewData, data: null });
       }
@@ -128,8 +125,7 @@ export class Dashboard {
     Dashboard.webview.onDidDispose(async () => {
       Dashboard.isDisposed = true;
       Dashboard._viewData = undefined;
-      const panel = ExplorerView.getInstance(extensionUri);
-      panel.getMediaSelection();
+      PanelMediaListener.getMediaSelection();
       await commands.executeCommand('setContext', CONTEXT.isDashboardOpen, false);
     });
 
@@ -146,6 +142,9 @@ export class Dashboard {
       PagesListener.process(msg);
       SettingsListener.process(msg);
       DataListener.process(msg);
+      TelemetryListener.process(msg);
+      SnippetListener.process(msg);
+      ModeListener.process(msg);
     });
   }
 

src/commands/Folders.ts

@@ -1,7 +1,7 @@
 import { Questions } from './../helpers/Questions';
-import { SETTINGS_CONTENT_PAGE_FOLDERS, SETTINGS_CONTENT_STATIC_FOLDER, SETTINGS_CONTENT_SUPPORTED_FILETYPES } from './../constants';
+import { SETTING_CONTENT_PAGE_FOLDERS, SETTING_CONTENT_STATIC_FOLDER, SETTING_CONTENT_SUPPORTED_FILETYPES, TelemetryEvent } from './../constants';
 import { commands, Uri, workspace, window } from "vscode";
-import { basename, join } from "path";
+import { basename, dirname, join, relative, sep } from "path";
 import { ContentFolder, FileInfo, FolderInfo } from "../models";
 import uniqBy = require("lodash.uniqby");
 import { Template } from "./Template";
@@ -12,8 +12,10 @@ import { format } from 'date-fns';
 import { Dashboard } from './Dashboard';
 import { parseWinPath } from '../helpers/parseWinPath';
 import { MediaHelpers } from '../helpers/MediaHelpers';
-import { MediaListener, PagesListener } from '../listeners';
+import { MediaListener, PagesListener, SettingsListener } from '../listeners/dashboard';
 import { DEFAULT_FILE_TYPES } from '../constants/DefaultFileTypes';
+import { Telemetry } from '../helpers/Telemetry';
+import { glob } from 'glob';
 
 export const WORKSPACE_PLACEHOLDER = `[[workspace]]`;
 
@@ -25,7 +27,7 @@ export class Folders {
    */
   public static async addMediaFolder(data?: {selectedFolder?: string}) {
     let wsFolder = Folders.getWorkspaceFolder();
-    const staticFolder = Settings.get<string>(SETTINGS_CONTENT_STATIC_FOLDER);
+    const staticFolder = Settings.get<string>(SETTING_CONTENT_STATIC_FOLDER);
 
     let startPath = "";
 
@@ -68,6 +70,8 @@ export class Folders {
       MediaHelpers.resetMedia();
       MediaListener.sendMediaFiles(0, folderName);
     }
+
+    Telemetry.send(TelemetryEvent.addMediaFolder);
   }
 
   /**
@@ -122,6 +126,10 @@ export class Folders {
       await Folders.update(folders);
 
       Notifications.info(`Folder registered`);
+
+		  Telemetry.send(TelemetryEvent.registerFolder);
+
+      SettingsListener.getSettings();
     }
   }
 
@@ -134,6 +142,8 @@ export class Folders {
       let folders = Folders.get();
       folders = folders.filter(f => f.path !== folder.fsPath);
       await Folders.update(folders);
+
+		  Telemetry.send(TelemetryEvent.unregisterFolder);
     }
   }
 
@@ -203,7 +213,7 @@ export class Folders {
    * Get the registered folders information
    */
   public static async getInfo(limit?: number): Promise<FolderInfo[] | null> {
-    const supportedFiles = Settings.get<string[]>(SETTINGS_CONTENT_SUPPORTED_FILETYPES);
+    const supportedFiles = Settings.get<string[]>(SETTING_CONTENT_SUPPORTED_FILETYPES);
     const folders = Folders.get();
     if (folders && folders.length > 0) {
       let folderInfo: FolderInfo[] = [];
@@ -231,12 +241,14 @@ export class Folders {
               for (const file of files) {
                 try {
                   const fileName = basename(file.fsPath);
+                  const folderName = dirname(file.fsPath).split(sep).pop();
                   
                   const stats = await workspace.fs.stat(file);
 
                   fileStats.push({
                     filePath: file.fsPath,
                     fileName,
+                    folderName,
                     ...stats
                   });
                 } catch (error) {
@@ -274,13 +286,31 @@ export class Folders {
    */
   public static get(): ContentFolder[] {
     const wsFolder = Folders.getWorkspaceFolder();
-    const folders: ContentFolder[] = Settings.get(SETTINGS_CONTENT_PAGE_FOLDERS) as ContentFolder[];
+    const folders: ContentFolder[] = Settings.get(SETTING_CONTENT_PAGE_FOLDERS) as ContentFolder[];
     
     return folders.map(folder => ({
       ...folder,
       path: Folders.absWsFolder(folder, wsFolder)
     }));
   }
+  
+  /**
+   * Update the folder settings
+   * @param folders 
+   */
+  public static async update(folders: ContentFolder[]) {
+    const wsFolder = Folders.getWorkspaceFolder();
+
+    let folderDetails = folders.map(folder => ({ 
+      ...folder,
+      path: Folders.relWsFolder(folder, wsFolder) 
+    }));
+
+    await Settings.update(SETTING_CONTENT_PAGE_FOLDERS, folderDetails, true);
+
+    // Reinitialize the folder listeners
+    PagesListener.startWatchers();
+  }
 
   /**
    * Retrieve the absolute file path
@@ -294,24 +324,6 @@ export class Folders {
     absPath = isWindows ? absPath.split('/').join('\\') : absPath;
     return absPath;
   }
-  
-  /**
-   * Update the folder settings
-   * @param folders 
-   */
-  private static async update(folders: ContentFolder[]) {
-    const wsFolder = Folders.getWorkspaceFolder();
-
-    let folderDetails = folders.map(folder => ({ 
-      ...folder,
-      path: Folders.relWsFolder(folder, wsFolder) 
-    }));
-
-    await Settings.update(SETTINGS_CONTENT_PAGE_FOLDERS, folderDetails, true);
-
-    // Reinitialize the folder listeners
-    PagesListener.startWatchers();
-  }
 
   /**
    * Generate the absolute URL for the workspace
@@ -321,7 +333,7 @@ export class Folders {
    */
   private static absWsFolder(folder: ContentFolder, wsFolder?: Uri) {
     const isWindows = process.platform === 'win32';
-    let absPath =  folder.path.replace(WORKSPACE_PLACEHOLDER, parseWinPath(wsFolder?.fsPath || ""));
+    let absPath = folder.path.replace(WORKSPACE_PLACEHOLDER, parseWinPath(wsFolder?.fsPath || ""));
     absPath = isWindows ? absPath.split('/').join('\\') : absPath;
     return absPath;
   }
@@ -332,14 +344,48 @@ export class Folders {
    * @param wsFolder 
    * @returns 
    */
-  private static relWsFolder(folder: ContentFolder, wsFolder?: Uri) {
+  public static relWsFolder(folder: ContentFolder, wsFolder?: Uri) {
     const isWindows = process.platform === 'win32';
-    let absPath =  folder.path.replace(parseWinPath(wsFolder?.fsPath || ""), WORKSPACE_PLACEHOLDER);
+    let absPath = parseWinPath(folder.path).replace(parseWinPath(wsFolder?.fsPath || ""), WORKSPACE_PLACEHOLDER);
     absPath = isWindows ? absPath.split('\\').join('/') : absPath;
     return absPath;
   }
-}
 
-function SETTINGS_CONTENT_SUPPORTED_FILES<T>(SETTINGS_CONTENT_SUPPORTED_FILES: any) {
-  throw new Error('Function not implemented.');
+  /**
+   * Find the content folders
+   */
+  public static async getContentFolders() {
+    // Find folders that contain files
+    const wsFolder = Folders.getWorkspaceFolder();
+    const supportedFiles = Settings.get<string[]>(SETTING_CONTENT_SUPPORTED_FILETYPES) || DEFAULT_FILE_TYPES;
+    const patterns = supportedFiles.map(fileType => `${join(wsFolder?.fsPath || "", "**", `*${fileType.startsWith('.') ? '' : '.'}${fileType}`)}`);
+    let folders: string[] = [];
+
+    for (const pattern of patterns) {
+      folders = [...folders, ...(await this.findFolders(pattern))];
+    }
+    
+    // Filter out the workspace folder
+    if (wsFolder) {
+      folders = folders.filter(folder => folder !== wsFolder.fsPath);
+    }
+
+    const uniqueFolders = [...new Set(folders)];
+    return uniqueFolders.map(folder => relative(wsFolder?.path || "", folder));
+  }
+
+  /**
+   * Retrieve all content folders
+   * @param pattern 
+   * @returns 
+   */
+  private static findFolders(pattern: string): Promise<string[]> {
+    return new Promise(resolve => {
+      glob(pattern, { ignore: "**/node_modules/**" }, (err, files) => {
+        const allFolders = files.map(file => dirname(file));
+        const uniqueFolders = [...new Set(allFolders)];
+        resolve(uniqueFolders);
+      });
+    });
+  }
 }

src/commands/Preview.ts

@@ -1,13 +1,15 @@
-import { SETTING_PREVIEW_HOST, SETTING_PREVIEW_PATHNAME, CONTEXT } from './../constants';
+import { Telemetry } from './../helpers/Telemetry';
+import { SETTING_PREVIEW_HOST, SETTING_PREVIEW_PATHNAME, CONTEXT, TelemetryEvent, PreviewCommands } from './../constants';
 import { ArticleHelper } from './../helpers/ArticleHelper';
 import { join } from "path";
 import { commands, env, Uri, ViewColumn, window } from "vscode";
-import { Settings } from '../helpers';
+import { Extension, Settings } from '../helpers';
 import { PreviewSettings } from '../models';
 import { format } from 'date-fns';
 import { DateHelper } from '../helpers/DateHelper';
 import { Article } from '.';
 import { urlJoin } from 'url-join-ts';
+import { WebviewHelper } from '@estruyf/vscode';
 
 
 export class Preview {
@@ -70,8 +72,8 @@ export class Preview {
     );
 
     webView.iconPath = {
-      dark: Uri.file(join(extensionPath, 'assets/frontmatter-dark.svg')),
-      light: Uri.file(join(extensionPath, 'assets/frontmatter.svg'))
+      dark: Uri.file(join(extensionPath, 'assets/icons/frontmatter-short-dark.svg')),
+      light: Uri.file(join(extensionPath, 'assets/icons/frontmatter-short-light.svg'))
     }
 
     const localhostUrl = await env.asExternalUri(
@@ -80,59 +82,64 @@ export class Preview {
 
     const cspSource = webView.webview.cspSource;
 
-    webView.webview.html = `<!DOCTYPE html>
-  <head>
-    <meta
-        http-equiv="Content-Security-Policy"
-        content="default-src 'none'; frame-src ${localhostUrl} ${cspSource} http: https:; img-src ${localhostUrl} ${cspSource} http: https:; script-src ${localhostUrl} ${cspSource} 'unsafe-inline'; style-src ${localhostUrl} ${cspSource} 'self' 'unsafe-inline' http: https:;"
-    />
-    <style>
-      html,body { 
-        margin: 0;
-        padding: 0;
-        background: white;
-        height: 100%;
-        width: 100%;
-      }
-      
-      body {
-        margin: 0;
-        padding: 0;
+    webView.webview.onDidReceiveMessage(message => {
+      switch (message.command) {
+        case PreviewCommands.toVSCode.open:
+          if (message.data) {
+            commands.executeCommand('vscode.open', message.data);
+          }
+          return;
       }
+    });
 
-      iframe {
-        width: 100%;
-        height: calc(100% - 30px);
-        border: 0;
-        margin-top: 30px;
-      }
 
-      .slug {
-        width: 100%;
-        position: fixed;
-        height: 30px;
-        display: flex;
-        align-items: center;
-        background-color: var(--vscode-editor-background);
-        border-bottom: 1px solid var(--vscode-focusBorder);
-      }
+    const dashboardFile = "dashboardWebView.js";
+    const localPort = `9000`;
+    const localServerUrl = `localhost:${localPort}`;
 
-      input {
-        color: var(--vscode-editor-foreground);
-        padding: 0.25rem 0.5rem;
-        background: none;
-        border: 0;
-        width: 100%;
-      }
-    </style>
-  </head>
-  <body>
-    <div class="slug">
-      <input type="text" value="${urlJoin(localhostUrl.toString(), slug || '')}" disabled />
-    </div>
-    <iframe src="${urlJoin(localhostUrl.toString(), slug || '')}" >
-  </body>
-</html>`;
+    const nonce = WebviewHelper.getNonce();
+
+    const ext = Extension.getInstance();
+    const isProd = ext.isProductionMode;
+    const version = ext.getVersion();
+    const isBeta = ext.isBetaVersion();
+    const extensionUri = ext.extensionPath;
+    
+    const csp = [
+      `default-src 'none';`,
+      `img-src ${localhostUrl} ${cspSource} http: https:;`,
+      `script-src ${isProd ? `'nonce-${nonce}'` : `http://${localServerUrl} http://0.0.0.0:${localPort}`} 'unsafe-eval'`,
+      `style-src ${cspSource} 'self' 'unsafe-inline' http: https:`,
+      `connect-src https://o1022172.ingest.sentry.io ${isProd ? `` : `ws://${localServerUrl} ws://0.0.0.0:${localPort} http://${localServerUrl} http://0.0.0.0:${localPort}`}`,
+      `frame-src ${localhostUrl} ${cspSource} http: https:;`,
+    ];
+
+    let scriptUri = "";
+    if (isProd) {
+      scriptUri = webView.webview.asWebviewUri(Uri.joinPath(extensionUri, 'dist', dashboardFile)).toString();
+    } else {
+      scriptUri = `http://${localServerUrl}/${dashboardFile}`; 
+    }
+
+    webView.webview.html = `
+      <!DOCTYPE html>
+      <html lang="en" style="width:100%;height:100%;margin:0;padding:0;">
+        <head>
+          <meta charset="UTF-8">
+          <meta http-equiv="Content-Security-Policy" content="${csp.join('; ')}">
+          <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+          <title>Front Matter Preview</title>
+        </head>
+        <body style="width:100%;height:100%;margin:0;padding:0;overflow:hidden">
+          <div id="app" data-type="preview" data-url="${urlJoin(localhostUrl.toString(), slug || '')}" data-isProd="${isProd}" data-environment="${isBeta ? "BETA" : "main"}" data-version="${version.usedVersion}" style="width:100%;height:100%;margin:0;padding:0;"></div>
+
+          <script ${isProd ? `nonce="${nonce}"` : ""} src="${scriptUri}"></script>
+        </body>
+      </html>
+    `;
+
+    Telemetry.send(TelemetryEvent.openPreview);
   }
 
   /**

src/commands/Project.ts

@@ -1,11 +1,13 @@
+import { Telemetry } from './../helpers/Telemetry';
 import { workspace, Uri } from "vscode";
 import { join } from "path";
 import * as fs from "fs";
 import { Notifications } from "../helpers/Notifications";
 import { Template } from "./Template";
 import { Folders } from "./Folders";
-import { Settings } from "../helpers";
-import { SETTINGS_CONTENT_DEFAULT_FILETYPE } from "../constants";
+import { FrameworkDetector, Logger, Settings } from "../helpers";
+import { SETTING_CONTENT_DEFAULT_FILETYPE, TelemetryEvent } from "../constants";
+import { SettingsListener } from '../listeners/dashboard';
 
 export class Project {
 
@@ -28,7 +30,7 @@ categories: []
   public static async init(sampleTemplate: boolean = true) {
     try {
       Settings.createTeamSettings();
-      const fileType = Settings.get<string>(SETTINGS_CONTENT_DEFAULT_FILETYPE);
+      const fileType = Settings.get<string>(SETTING_CONTENT_DEFAULT_FILETYPE);
 
       const folder = Template.getSettings();
       const templatePath = Project.templatePath();
@@ -47,7 +49,21 @@ categories: []
         fs.writeFileSync(article.fsPath, Project.content, { encoding: "utf-8" });
         Notifications.info("Project initialized successfully.");
       }
+
+      Telemetry.send(TelemetryEvent.initialization);
+
+
+      // Check if you can find the framework
+      const wsFolder = Folders.getWorkspaceFolder();
+      const framework = FrameworkDetector.get(wsFolder?.fsPath || "");
+
+      if (framework) {
+        SettingsListener.setFramework(framework.name);
+      }
+
+      SettingsListener.getSettings();
     } catch (err: any) {
+      Logger.error(`Project::init: ${err?.message || err}`);
       Notifications.error(`Sorry, something went wrong - ${err?.message || err}`);
     }
   }

src/commands/Settings.ts

@@ -1,10 +1,9 @@
 import * as vscode from 'vscode';
-import * as matter from 'gray-matter';
 import * as fs from 'fs';
 import { TaxonomyType } from "../models";
 import { SETTING_TAXONOMY_TAGS, SETTING_TAXONOMY_CATEGORIES, EXTENSION_NAME } from '../constants';
 import { ArticleHelper, Settings as SettingsHelper, FilesHelper } from '../helpers';
-import { TomlEngine, getFmLanguage, getFormatOpts } from '../helpers/TomlEngine';
+import { FrontMatterParser } from '../parsers';
 import { DumpOptions } from 'js-yaml';
 import { Notifications } from '../helpers/Notifications';
 
@@ -90,10 +89,6 @@ export class Settings {
       const progressNr = allMdFiles.length/100;
       progress.report({ increment: 0});
 
-      // Get language options
-      const language = getFmLanguage();
-      const langOpts = getFormatOpts(language);
-
       let i = 0;
       for (const file of allMdFiles) {
         progress.report({ increment: (++i/progressNr) });
@@ -102,10 +97,7 @@ export class Settings {
           const txtData = mdFile.getText();
           if (txtData) {
             try {
-              const article = matter(txtData, {
-                ...TomlEngine,
-                ...langOpts
-              });
+              const article = FrontMatterParser.fromFile(txtData);
               if (article && article.data) {
                 const { data } = article;
                 const mdTags = data["tags"];
@@ -218,13 +210,8 @@ export class Settings {
         progress.report({ increment: (++i/progressNr) });
         const mdFile = fs.readFileSync(file.path, { encoding: "utf8" });
         if (mdFile) {
-          const language = getFmLanguage();
-          const langOpts = getFormatOpts(language);
           try {
-            const article = matter(mdFile, {
-              ...TomlEngine,
-              ...langOpts
-            });
+            const article = FrontMatterParser.fromFile(mdFile);
             if (article && article.data) {
               const { data } = article;
               let taxonomies: string[] = data[matterProp];
@@ -239,9 +226,7 @@ export class Settings {
                   data[matterProp] = [...new Set(taxonomies)].sort();
                   const spaces = vscode.window.activeTextEditor?.options?.tabSize;
                   // Update the file
-                  fs.writeFileSync(file.path, matter.stringify(article.content, article.data, {
-                    ...TomlEngine,
-                    ...langOpts,
+                  fs.writeFileSync(file.path, FrontMatterParser.toFile(article.content, article.data, {
                     indent: spaces || 2
                   } as DumpOptions as any), { encoding: "utf8" });
                 }

src/commands/StatusListener.ts

@@ -1,9 +1,11 @@
-import { SETTING_SEO_DESCRIPTION_FIELD, SETTING_SEO_DESCRIPTION_LENGTH, SETTING_SEO_TITLE_LENGTH } from './../constants';
+import { CONTEXT, SETTING_SEO_DESCRIPTION_FIELD, SETTING_SEO_DESCRIPTION_LENGTH, SETTING_SEO_TITLE_LENGTH } from './../constants';
 import * as vscode from 'vscode';
 import { ArticleHelper, SeoHelper, Settings } from '../helpers';
 import { ExplorerView } from '../explorerView/ExplorerView';
 import { DefaultFields } from '../constants';
 import { ContentType } from '../helpers/ContentType';
+import { DataListener } from '../listeners/panel';
+import { commands } from 'vscode';
 
 export class StatusListener {
   
@@ -23,8 +25,10 @@ export class StatusListener {
     }
     
     let editor = vscode.window.activeTextEditor;
-    if (editor && ArticleHelper.isMarkdownFile()) {
+    if (editor && ArticleHelper.isSupportedFile()) {
       try {
+        commands.executeCommand('setContext', CONTEXT.isValidFile, true);
+
         const article = ArticleHelper.getFrontMatter(editor);
 
         // Update the StatusBar based on the article draft state
@@ -58,7 +62,7 @@ export class StatusListener {
         
         const panel = ExplorerView.getInstance();
         if (panel && panel.visible) {
-          panel.pushMetadata(article!.data);
+          DataListener.pushMetadata(article!.data);
         }
 
         return;
@@ -66,9 +70,11 @@ export class StatusListener {
         // Nothing to do
       }
     } else {
+      commands.executeCommand('setContext', CONTEXT.isValidFile, false);
+
       const panel = ExplorerView.getInstance();
       if (panel && panel.visible) {
-        panel.pushMetadata(null);
+        DataListener.pushMetadata(null);
       }
     }
 

src/commands/Template.ts

@@ -2,7 +2,7 @@ import { Questions } from './../helpers/Questions';
 import * as vscode from 'vscode';
 import * as path from 'path';
 import * as fs from 'fs';
-import { SETTINGS_CONTENT_DEFAULT_FILETYPE, SETTING_TEMPLATES_FOLDER, SETTING_TEMPLATES_PREFIX } from '../constants';
+import { SETTING_CONTENT_DEFAULT_FILETYPE, SETTING_TEMPLATES_FOLDER, TelemetryEvent } from '../constants';
 import { ArticleHelper, Settings } from '../helpers';
 import { Article } from '.';
 import { Notifications } from '../helpers/Notifications';
@@ -11,8 +11,9 @@ import { Project } from './Project';
 import { Folders } from './Folders';
 import { ContentType } from '../helpers/ContentType';
 import { ContentType as IContentType } from '../models';
-import { PagesListener } from '../listeners';
+import { PagesListener } from '../listeners/dashboard';
 import { extname } from 'path';
+import { Telemetry } from '../helpers/Telemetry';
 
 export class Template {
 
@@ -22,6 +23,10 @@ export class Template {
   public static async init() {
     const isInitialized = await Template.isInitialized();
     await vscode.commands.executeCommand('setContext', CONTEXT.canInit, !isInitialized);
+
+    if (isInitialized) {
+      await vscode.commands.executeCommand('setContext', CONTEXT.initialized, true);
+    }
   }
 
   /**
@@ -51,9 +56,9 @@ export class Template {
   public static async generate() {
     const folder = Template.getSettings();
     const editor = vscode.window.activeTextEditor;
-    const fileType = Settings.get<string>(SETTINGS_CONTENT_DEFAULT_FILETYPE);
+    const fileType = Settings.get<string>(SETTING_CONTENT_DEFAULT_FILETYPE);
 
-    if (folder && editor && ArticleHelper.isMarkdownFile()) {
+    if (folder && editor && ArticleHelper.isSupportedFile()) {
       const article = ArticleHelper.getFrontMatter(editor);
       const clonedArticle = Object.assign({}, article);
 
@@ -175,6 +180,8 @@ export class Template {
 
     Notifications.info(`Your new content has been created.`);
 
+    Telemetry.send(TelemetryEvent.createContentFromTemplate);
+
     // Trigger a refresh for the dashboard
     PagesListener.refresh();
   }

src/commands/Wysiwyg.ts

@@ -1,5 +1,5 @@
 import { commands, window, Selection, QuickPickItem } from "vscode";
-import { COMMAND_NAME, CONTEXT, SETTINGS_CONTENT_WYSIWYG } from "../constants";
+import { COMMAND_NAME, CONTEXT, SETTING_CONTENT_WYSIWYG } from "../constants";
 import { Settings } from "../helpers";
 
 enum MarkupType {
@@ -24,7 +24,7 @@ export class Wysiwyg {
    */
   public static async registerCommands(subscriptions: any) {
 
-    const wysiwygEnabled = Settings.get(SETTINGS_CONTENT_WYSIWYG);
+    const wysiwygEnabled = Settings.get(SETTING_CONTENT_WYSIWYG);
 
     if (!wysiwygEnabled) {
       return;
@@ -54,6 +54,7 @@ export class Wysiwyg {
         { label: "$(tasklist) Task list", detail: "Add a task list", alwaysShow: true },
         { label: "$(code) Code", detail: "Add inline code snippet", alwaysShow: true },
         { label: "$(symbol-namespace) Code block", detail: "Add a code block", alwaysShow: true },
+        { label: "$(quote) Blockquote", detail: "Add a blockquote", alwaysShow: true },
       ]
 
       const option = await window.showQuickPick([ ...qpItems ], {  
@@ -73,6 +74,8 @@ export class Wysiwyg {
           await this.addMarkup(MarkupType.code);
         } else if (option.label === qpItems[4].label) {
           await this.addMarkup(MarkupType.codeblock);
+        } else if (option.label === qpItems[5].label) {
+          await this.addMarkup(MarkupType.blockquote);
         }
       }
     }));

src/components/features/FeatureFlag.tsx

@@ -0,0 +1,26 @@
+import * as React from 'react';
+
+export interface IFeatureFlagProps {
+  flag: string;
+  features: string[] | null;
+  alternative?: JSX.Element;
+}
+
+export const FeatureFlag: React.FunctionComponent<IFeatureFlagProps> = ({ flag, features, alternative, children }: React.PropsWithChildren<IFeatureFlagProps>) => {
+  
+  if (!features ||( features.length > 0 && !features.includes(flag))) {
+    if (alternative) {
+      return alternative;
+    }
+
+    return null;
+  }
+
+  
+  
+  return (
+    <>
+      {children}
+    </>
+  );
+};

src/components/uniforms-frontmatter/AutoField.tsx

@@ -0,0 +1,41 @@
+import * as invariant from 'invariant';
+import { createAutoField } from 'uniforms';
+import { PreviewImageField } from '../../panelWebView/components/Fields/PreviewImageField';
+export { AutoFieldProps } from 'uniforms';
+
+import BoolField from './BoolField';
+import DateField from './DateField';
+import ListField from './ListField';
+import NestField from './NestField';
+import NumField from './NumField';
+import RadioField from './RadioField';
+import SelectField from './SelectField';
+import TextField from './TextField';
+
+const AutoField = createAutoField(props => {
+
+  if (props.allowedValues) {
+    return props.checkboxes && props.fieldType !== Array
+      ? RadioField
+      : SelectField;
+  }
+
+  switch (props.fieldType) {
+    case Array:
+      return ListField;
+    case Boolean:
+      return BoolField;
+    case Date:
+      return DateField;
+    case Number:
+      return NumField;
+    case Object:
+      return NestField;
+    case String:
+      return TextField;
+  }
+
+  return invariant(false, 'Unsupported field type: %s', props.fieldType);
+});
+
+export default AutoField;

src/components/uniforms-frontmatter/AutoFields.tsx

@@ -0,0 +1,29 @@
+import { ComponentType, createElement, Fragment } from 'react';
+import { useForm } from 'uniforms';
+
+import AutoField from './AutoField';
+
+export type AutoFieldsProps = {
+  autoField?: ComponentType<{ name: string }>;
+  element?: ComponentType | string;
+  fields?: string[];
+  omitFields?: string[];
+};
+
+export default function AutoFields({
+  autoField = AutoField,
+  element = Fragment,
+  fields,
+  omitFields = [],
+  ...props
+}: AutoFieldsProps) {
+  const { schema } = useForm();
+
+  return createElement(
+    element,
+    props,
+    (fields ?? schema.getSubfields())
+      .filter(field => !omitFields.includes(field))
+      .map(field => createElement(autoField, { key: field, name: field })),
+  );
+}

src/components/uniforms-frontmatter/AutoForm.tsx

@@ -0,0 +1,13 @@
+import { AutoForm } from 'uniforms';
+
+import ValidatedQuickForm from './ValidatedQuickForm';
+
+function Auto(parent: any) {
+  class _ extends AutoForm.Auto(parent) {
+    static Auto = Auto;
+  }
+
+  return _ as unknown as AutoForm;
+}
+
+export default Auto(ValidatedQuickForm);

src/components/uniforms-frontmatter/BaseForm.tsx

@@ -0,0 +1,13 @@
+import { BaseForm } from 'uniforms';
+
+function Unstyled(parent: any) {
+  class _ extends parent {
+    static Unstyled = Unstyled;
+
+    static displayName = `Unstyled${parent.displayName}`;
+  }
+
+  return _ as unknown as typeof BaseForm;
+}
+
+export default Unstyled(BaseForm);

src/components/uniforms-frontmatter/BoolField.css

@@ -0,0 +1,52 @@
+.field__toggle {
+  position: relative;
+  display: inline-block;
+  width: 50px;
+  height: 24px;
+}
+
+.field__toggle input { 
+  opacity: 0;
+  width: 0;
+  height: 0;
+}
+
+.field__toggle__slider {
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: var(--frontmatter-toggle-secondaryBackground, var(--vscode-button-secondaryBackground));
+  -webkit-transition: .4s;
+  transition: .4s;
+  border-radius: 34px;
+}
+
+.field__toggle__slider:before {
+  position: absolute;
+  content: "";
+  height: 16px;
+  width: 16px;
+  left: 4px;
+  bottom: 4px;
+  background-color: white;
+  -webkit-transition: .4s;
+  transition: .4s;
+  border-radius: 50%;
+}
+
+input:checked + .field__toggle__slider {
+  background-color: var(--frontmatter-toggle-background, var(--vscode-button-background));
+}
+
+input:focus + .field__toggle__slider {
+  box-shadow: 0 0 1px var(--frontmatter-toggle-background, var(--vscode-button-background));
+}
+
+input:checked + .field__toggle__slider:before {
+  -webkit-transform: translateX(26px);
+  -ms-transform: translateX(26px);
+  transform: translateX(26px);
+}

src/components/uniforms-frontmatter/BoolField.tsx

@@ -0,0 +1,44 @@
+import * as React from 'react';
+import { Ref } from 'react';
+import { HTMLFieldProps, connectField, filterDOMProps } from 'uniforms';
+import './BoolField.css';
+import { LabelField } from './LabelField';
+
+export type BoolFieldProps = HTMLFieldProps<
+  boolean,
+  HTMLDivElement,
+  { inputRef?: Ref<HTMLInputElement> }
+>;
+
+function Bool({
+  disabled,
+  id,
+  inputRef,
+  label,
+  name,
+  onChange,
+  readOnly,
+  value,
+  ...props
+}: BoolFieldProps) {
+  return (
+    <div {...filterDOMProps(props)}>
+      <LabelField label={label} id={id} required={props.required} />
+      
+      <label className="field__toggle">
+        <input
+          checked={value || false}
+          disabled={disabled}
+          id={id}
+          name={name}
+          onChange={() => !disabled && !readOnly && onChange(!value)}
+          ref={inputRef}
+          type="checkbox"
+        />
+        <span className="field__toggle__slider"></span>
+      </label>
+    </div>
+  );
+}
+
+export default connectField<BoolFieldProps>(Bool, { kind: 'leaf' });

src/components/uniforms-frontmatter/DateField.tsx

@@ -0,0 +1,57 @@
+import * as React from 'react';
+import { Ref } from 'react';
+import { HTMLFieldProps, connectField, filterDOMProps } from 'uniforms';
+
+/* istanbul ignore next */
+const DateConstructor = (typeof global === 'object' ? global : window).Date;
+const dateFormat = (value?: Date) => value?.toISOString().slice(0, -8);
+
+export type DateFieldProps = HTMLFieldProps<
+  Date,
+  HTMLDivElement,
+  { inputRef?: Ref<HTMLInputElement>; max?: Date; min?: Date }
+>;
+
+function Date({
+  disabled,
+  id,
+  inputRef,
+  label,
+  max,
+  min,
+  name,
+  onChange,
+  placeholder,
+  readOnly,
+  value,
+  ...props
+}: DateFieldProps) {
+  return (
+    <div {...filterDOMProps(props)}>
+      {label && <label htmlFor={id}>{label}</label>}
+
+      <input
+        disabled={disabled}
+        id={id}
+        max={dateFormat(max)}
+        min={dateFormat(min)}
+        name={name}
+        onChange={event => {
+          const date = new DateConstructor(event.target.valueAsNumber);
+          if (date.getFullYear() < 10000) {
+            onChange(date);
+          } else if (isNaN(event.target.valueAsNumber)) {
+            onChange(undefined);
+          }
+        }}
+        placeholder={placeholder}
+        readOnly={readOnly}
+        ref={inputRef}
+        type="datetime-local"
+        value={dateFormat(value) ?? ''}
+      />
+    </div>
+  );
+}
+
+export default connectField<DateFieldProps>(Date, { kind: 'leaf' });

src/components/uniforms-frontmatter/ErrorField.tsx

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { HTMLProps } from 'react';
+import { Override, connectField, filterDOMProps } from 'uniforms';
+
+export type ErrorFieldProps = Override<
+  Omit<HTMLProps<HTMLDivElement>, 'onChange'>,
+  { error?: any; errorMessage?: string }
+>;
+
+function Error({ children, error, errorMessage, ...props }: ErrorFieldProps) {
+  return !error ? null : (
+    <div {...filterDOMProps(props)}>{children || errorMessage}</div>
+  );
+}
+
+export default connectField<ErrorFieldProps>(Error, {
+  initialValue: false,
+  kind: 'leaf',
+});

src/components/uniforms-frontmatter/ErrorsField.css

@@ -0,0 +1,18 @@
+
+
+.autoform-error {
+  background-color: var(--frontmatter-error-background, var(--vscode-inputValidation-errorBackground));
+  border: 1px solid var(--frontmatter-error-border, var(--vscode-inputValidation-errorBorder));
+  border-radius: 2px;
+  margin: 20px 0px;
+  padding: 10px;
+  color: var(--frontmatter-error-foreground, var(--vscode-editor-foreground));
+
+  ul {
+    margin-bottom: 0;
+  }
+
+  li {
+    text-transform: capitalize;
+  }
+}

src/components/uniforms-frontmatter/ErrorsField.tsx

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { HTMLProps } from 'react';
+import { filterDOMProps, useForm } from 'uniforms';
+import './ErrorsField.css';
+
+export type ErrorsFieldProps = HTMLProps<HTMLDivElement>;
+
+export default function ErrorsField(props: ErrorsFieldProps) {
+  const { error, schema } = useForm();
+  return !error && !props.children ? null : (
+    <div className='autoform-error'>
+      <div {...filterDOMProps(props)}>
+        {props.children}
+
+        <ul>
+          {schema.getErrorMessages(error).map((message, index) => (
+            <li key={index}>{message}</li>
+          ))}
+        </ul>
+      </div>
+    </div>
+  );
+}

src/components/uniforms-frontmatter/HiddenField.tsx

@@ -0,0 +1,35 @@
+import * as React from 'react';
+import { HTMLProps, Ref, useEffect } from 'react';
+import { Override, filterDOMProps, useField } from 'uniforms';
+
+export type HiddenFieldProps = Override<
+  HTMLProps<HTMLInputElement>,
+  {
+    inputRef?: Ref<HTMLInputElement>;
+    name: string;
+    noDOM?: boolean;
+    value?: any;
+  }
+>;
+
+export default function HiddenField({ value, ...rawProps }: HiddenFieldProps) {
+  const props = useField(rawProps.name, rawProps, { initialValue: false })[0];
+
+  useEffect(() => {
+    if (value !== undefined && value !== props.value) {
+      props.onChange(value);
+    }
+  });
+
+  return props.noDOM ? null : (
+    <input
+      disabled={props.disabled}
+      name={props.name}
+      readOnly={props.readOnly}
+      ref={props.inputRef}
+      type="hidden"
+      value={value ?? props.value ?? ''}
+      {...filterDOMProps(props)}
+    />
+  );
+}

src/components/uniforms-frontmatter/LabelField.css

@@ -0,0 +1,14 @@
+
+
+.autoform__label {
+  display: block;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  line-height: 16px;
+  font-weight: bold;
+
+  .autoform__label__required {
+    color: var(--vscode-inputValidation-errorBorder);
+    margin-left: 0.25rem;
+  }
+}