feat: Added compatibility of MDJS with SSGors with HMR and updated dependencies on lion/lit

packages/mdjs-core/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Change Log
 
+## 0.21.0
+
+### Minor Changes
+
+- 60e9eae5: Moved clearing of the variables to inside functions that process the MD files
+
 ## 0.20.0
 
 ### Minor Changes

packages/mdjs-core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mdjs/core",
-  "version": "0.20.0",
+  "version": "0.21.0",
   "publishConfig": {
     "access": "public"
   },

packages/mdjs-core/src/mdjsParse.js

@@ -5,13 +5,13 @@ import { remove } from 'unist-util-remove';
 /** @typedef {import('unist').Node} Node */
 
 export function mdjsParse() {
-  let jsCode = '';
-
   /**
    * @param {Node} tree
    * @param {VFileOptions} file
    */
   function transformer(tree, file) {
+    let jsCode = '';
+
     visit(
       tree,
       'code',

packages/mdjs-core/src/mdjsStoryParse.js

@@ -54,7 +54,7 @@ export function mdjsStoryParse({
   previewStoryTag = defaultPreviewStoryTag,
 } = {}) {
   /** @type {Story[]} */
-  const stories = [];
+  let stories = [];
   let htmlIndex = 0;
 
   /* eslint-disable no-param-reassign */
@@ -181,6 +181,7 @@ export function mdjsStoryParse({
   async function transformer(tree, file) {
     // unifiedjs expects node changes to be made on the given node...
     await init;
+    stories = [];
     // @ts-ignore
     visit(tree, 'code', nodeCodeVisitor);
     // we can only return/modify the tree but stories should not be part of the tree

packages/mdjs-preview/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @mdjs/mdjs-preview
 
+## 0.6.0
+
+### Minor Changes
+
+- 50c830c1: Pass serializable changes without using JSON to allow other postMessages 
+- 60e9eae5: Updated the dependencies to the latest versions
+
 ## 0.5.9
 
 ### Patch Changes

packages/mdjs-preview/index.js

@@ -1,62 +1,23 @@
 export { MdJsPreview } from './src/MdJsPreview.js';
 
 // reexport used lit to ensure users can sync html & rendering
-export {
-  html,
-  CSSResult,
-  adoptStyles,
-  css,
-  getCompatibleStyle,
-  supportsAdoptingStyleSheets,
-  unsafeCSS,
-  UpdatingElement,
-  notEqual,
-  ReactiveElement,
-  svg,
-  noChange,
-  nothing,
-  render,
-  LitElement,
-  defaultConverter,
-} from 'lit';
+export * from 'lit';
 
-export {
-  customElement,
-  property,
-  state,
-  eventOptions,
-  query,
-  queryAll,
-  queryAsync,
-  queryAssignedNodes,
-} from 'lit/decorators.js';
+export * from 'lit/decorators.js';
 
-export { directive, Directive } from 'lit/directive.js';
+export * from 'lit/directive.js';
 
-export { AsyncDirective } from 'lit/async-directive.js';
+export * from 'lit/async-directive.js';
 
-export {
-  isPrimitive,
-  TemplateResultType,
-  isTemplateResult,
-  isDirectiveResult,
-  getDirectiveClass,
-  isSingleExpression,
-  insertPart,
-  setChildPartValue,
-  setCommittedValue,
-  getCommittedValue,
-  removePart,
-  clearPart,
-} from 'lit/directive-helpers.js';
+export * from 'lit/directive-helpers.js';
 
-export { asyncAppend } from 'lit/directives/async-append.js';
-export { asyncReplace } from 'lit/directives/async-replace.js';
-export { cache } from 'lit/directives/cache.js';
-export { classMap } from 'lit/directives/class-map.js';
-export { guard } from 'lit/directives/guard.js';
-export { ifDefined } from 'lit/directives/if-defined.js';
-export { repeat } from 'lit/directives/repeat.js';
-export { styleMap } from 'lit/directives/style-map.js';
-export { unsafeHTML } from 'lit/directives/unsafe-html.js';
-export { until } from 'lit/directives/until.js';
+export * from 'lit/directives/async-append.js';
+export * from 'lit/directives/async-replace.js';
+export * from 'lit/directives/cache.js';
+export * from 'lit/directives/class-map.js';
+export * from 'lit/directives/guard.js';
+export * from 'lit/directives/if-defined.js';
+export * from 'lit/directives/repeat.js';
+export * from 'lit/directives/style-map.js';
+export * from 'lit/directives/unsafe-html.js';
+export * from 'lit/directives/until.js';

packages/mdjs-preview/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mdjs/mdjs-preview",
-  "version": "0.5.9",
+  "version": "0.6.0",
   "publishConfig": {
     "access": "public"
   },
@@ -34,9 +34,9 @@
     "src"
   ],
   "dependencies": {
-    "@lion/accordion": "^0.9.0",
-    "@open-wc/scoped-elements": "^2.0.0",
-    "lit": "^2.3.0"
+    "@lion/ui": "^0.11.2",
+    "@open-wc/scoped-elements": "^3.0.5",
+    "lit": "^3.2.1"
   },
   "types": "dist-types/index.d.ts"
 }

packages/mdjs-preview/server/LayoutSimulator.js

@@ -91,7 +91,7 @@ export class LayoutSimulator {
                 width: dimensions.width,
                 height: dimensions.height,
               };
-              parent.postMessage(JSON.stringify(data), '*');
+              parent.postMessage(data, '*');
             });
             observer.observe(document.body);
           </script>

packages/mdjs-preview/src/MdJsPreview.js

@@ -1,6 +1,6 @@
 import { LitElement, html, css, nothing, render } from 'lit';
-import { ScopedElementsMixin } from '@open-wc/scoped-elements';
-import { LionAccordion } from '@lion/accordion';
+import { ScopedElementsMixin } from '@open-wc/scoped-elements/lit-element.js';
+import { LionAccordion } from '@lion/ui/accordion';
 
 import {
   subscribe,

packages/mdjs-preview/src/resizeHandler.js

@@ -6,8 +6,8 @@ export function addResizeHandler() {
     return;
   }
   window.addEventListener('message', ev => {
-    const data = JSON.parse(ev.data);
-    if (data.action === 'mdjs-viewer-resize') {
+    const { data } = ev;
+    if (data?.action === 'mdjs-viewer-resize') {
       const viewer = /** @type {import('./MdJsPreview.js').MdJsPreview} */ (
         document.body.querySelector(`[mdjs-story-name="${data.storyKey}"]`)
       );

packages/mdjs-story/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @mdjs/mdjs-story
 
+## 0.4.0
+
+### Minor Changes
+
+- 60e9eae5: Updated the dependencies to the latest versions
+
 ## 0.3.2
 
 ### Patch Changes

packages/mdjs-story/index.js

@@ -1,62 +1,23 @@
 export { MdJsStory } from './src/MdJsStory.js';
 
 // reexport used lit to ensure users can sync html & rendering
-export {
-  html,
-  CSSResult,
-  adoptStyles,
-  css,
-  getCompatibleStyle,
-  supportsAdoptingStyleSheets,
-  unsafeCSS,
-  UpdatingElement,
-  notEqual,
-  ReactiveElement,
-  svg,
-  noChange,
-  nothing,
-  render,
-  LitElement,
-  defaultConverter,
-} from 'lit';
+export * from 'lit';
 
-export {
-  customElement,
-  property,
-  state,
-  eventOptions,
-  query,
-  queryAll,
-  queryAsync,
-  queryAssignedNodes,
-} from 'lit/decorators.js';
+export * from 'lit/decorators.js';
 
-export { directive, Directive } from 'lit/directive.js';
+export * from 'lit/directive.js';
 
-export { AsyncDirective } from 'lit/async-directive.js';
+export * from 'lit/async-directive.js';
 
-export {
-  isPrimitive,
-  TemplateResultType,
-  isTemplateResult,
-  isDirectiveResult,
-  getDirectiveClass,
-  isSingleExpression,
-  insertPart,
-  setChildPartValue,
-  setCommittedValue,
-  getCommittedValue,
-  removePart,
-  clearPart,
-} from 'lit/directive-helpers.js';
+export * from 'lit/directive-helpers.js';
 
-export { asyncAppend } from 'lit/directives/async-append.js';
-export { asyncReplace } from 'lit/directives/async-replace.js';
-export { cache } from 'lit/directives/cache.js';
-export { classMap } from 'lit/directives/class-map.js';
-export { guard } from 'lit/directives/guard.js';
-export { ifDefined } from 'lit/directives/if-defined.js';
-export { repeat } from 'lit/directives/repeat.js';
-export { styleMap } from 'lit/directives/style-map.js';
-export { unsafeHTML } from 'lit/directives/unsafe-html.js';
-export { until } from 'lit/directives/until.js';
+export * from 'lit/directives/async-append.js';
+export * from 'lit/directives/async-replace.js';
+export * from 'lit/directives/cache.js';
+export * from 'lit/directives/class-map.js';
+export * from 'lit/directives/guard.js';
+export * from 'lit/directives/if-defined.js';
+export * from 'lit/directives/repeat.js';
+export * from 'lit/directives/style-map.js';
+export * from 'lit/directives/unsafe-html.js';
+export * from 'lit/directives/until.js';

packages/mdjs-story/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mdjs/mdjs-story",
-  "version": "0.3.2",
+  "version": "0.4.0",
   "publishConfig": {
     "access": "public"
   },
@@ -31,7 +31,7 @@
     "src"
   ],
   "dependencies": {
-    "lit": "^2.3.0"
+    "lit": "^3.2.1"
   },
   "types": "dist-types/index.d.ts"
 }