🖌 Add support for aside directive (#341)

Co-authored-by: Rowan Cockett <[email protected]>

.changeset/early-nails-act.md

@@ -0,0 +1,5 @@
+---
+'myst-to-react': minor
+---
+
+Add support for margin directives

packages/myst-to-react/src/basic.tsx

@@ -42,6 +42,10 @@ type CaptionNumber = {
   identifier: string;
 };
 
+type Aside = {
+  type: 'aside';
+};
+
 type BasicNodeRenderers = {
   text: NodeRenderer<spec.Text>;
   span: NodeRenderer<GenericNode>;
@@ -80,6 +84,7 @@ type BasicNodeRenderers = {
   definitionList: NodeRenderer<DefinitionList>;
   definitionTerm: NodeRenderer<DefinitionTerm>;
   definitionDescription: NodeRenderer<DefinitionDescription>;
+  aside: NodeRenderer<Aside>;
 };
 
 const BASIC_RENDERERS: BasicNodeRenderers = {
@@ -363,6 +368,13 @@ const BASIC_RENDERERS: BasicNodeRenderers = {
       </dd>
     );
   },
+  aside({ node }) {
+    return (
+      <aside className="text-sm lg:h-0 col-margin-right">
+        <MyST ast={node.children} />
+      </aside>
+    );
+  },
 };
 
 export default BASIC_RENDERERS;