ember-repl 3.0.0-beta.0 → 3.0.0-beta.2

package/README.md

@@ -21,6 +21,11 @@ your app's initial time-to-interactive/etc stats.
 * ember-auto-import v2 or above
 * Node.js v14 or above
 
+## Capabilities 
+
+* gjs 
+* hbs 
+* markdown with gjs/hbs blocks (glimdown)
 
 ## Installation
 
@@ -48,20 +53,71 @@ Object.assign(window, {
 
 ```
 
-Additionally, because the ember-template-compiler is presently "goofy" in `ember-source`, we must do this in `ember-cli-build.js`:
+## Usage
+
+### Compiling GJS 
+
+There are two ways to compile gjs text, imperatively via `compileJS`, where you manage the reactivity yourself. 
+Or `Compiled`, which is a resource that manages the reactivity for you.
+
+#### Automatic reactivity via the Resource
+
+Following the Resources documentation, you can use `Compiled` in both 
+template-only or class-backed contexts:
 
 ```js 
-const app = new EmberApp(defaults, {
-  // ...
-});
-app.import('vendor/ember/ember-template-compiler.js');
+import { Compiled } from 'ember-repl';
+
+<template>
+  {{#let (Compiled @gjsText 'gjs') as |compileResult|}}
+
+    {{#if compileResult.error}}
+      an error! {{compileResult.error}}
+    {{/if}}
+
+    {{#if compileResult.component}}
+      <compileResult.component />
+    {{/if}}
+
+  {{/let}}
+</template>
 
-// ...
 ```
 
-## Usage
+One advantage of using a backing JS context, is that you can utilize the `keepLatest` 
+resource so that when an error occurs, you could keep rendering the latest successful compile.
+
+```js 
+import Component from '@glimmer/component';
+import { Compiled } from 'ember-repl';
+import { use } from 'ember-resources'; 
+import { keepLatest } from 'ember-resources/util/keep-latest';
+
+export class Renderer extends Component {
+  @use compile = Compiled(() => this.args.gjsText, 'gjs');
+
+  @use latest = keepLatest({
+    value: () => this.compile.component,
+    when: () => this.compile.error,
+  }); 
+
+  <template> 
+    {{#if this.compile.error}}
+      Error! {{this.compile.error}}
+    {{/if}}
+
+    {{! This will keep showing even when there is an error.
+        Which can help reduce visual jitter }} 
+    {{#if this.latest.value}}
+      <this.latest.latest />
+    {{/if}}
+
+  </template>
+}
+```
+
 
-**`compileJS`**
+#### Managing your own reactivity
 
 ```js
 import Component from '@glimmer/component';
@@ -84,7 +140,14 @@ export class Renderer extends Component {
 {{/if}}
 ```
 
-**`compileHBS`**
+
+### Compiling HBS 
+
+#### Automatic reactivity via the Resource
+
+The hbs utilities do not provide a utility Resource. 
+
+#### Managing your own reactivity
 
 ```js
 import Component from '@glimmer/component';
@@ -98,6 +161,110 @@ export class Renderer extends Component {
 <this.compileResult.component />
 ```
 
+
+### Compiling Markdown
+
+There are two ways to compile markdown text, imperatively via `compile` (passing the `glimdown` format), where you manage the reactivity yourself. 
+Or `CompileMarkdown`, which is a resource that manages the reactivity for you.
+
+#### Automatic reactivity via the Resource
+
+Following the Resources documentation, you can use `Compiled` in both 
+template-only or class-backed contexts:
+
+```js 
+import { Compiled } from 'ember-repl';
+
+<template>
+  {{#let (Compiled @mdText 'glimdown') as |compileResult|}}
+
+    {{#if compileResult.error}}
+      an error! {{compileResult.error}}
+    {{/if}}
+
+    {{#if compileResult.component}}
+      <compileResult.component />
+    {{/if}}
+
+  {{/let}}
+</template>
+
+```
+
+One advantage of using a backing JS context, is that you can utilize the `keepLatest` 
+resource so that when an error occurs, you could keep rendering the latest successful compile.
+
+```js 
+import Component from '@glimmer/component';
+import { Compiled } from 'ember-repl';
+import { use } from 'ember-resources'; 
+import { keepLatest } from 'ember-resources/util/keep-latest';
+
+export class Renderer extends Component {
+  @use compile = Compiled(() => this.args.mdText, 'glimdown');
+
+  @use latest = keepLatest({
+    value: () => this.compile.component,
+    when: () => this.compile.error,
+  }); 
+
+  <template> 
+    {{#if this.compile.error}}
+      Error! {{this.compile.error}}
+    {{/if}}
+
+    {{! This will keep showing even when there is an error.
+        Which can help reduce visual jitter }} 
+    {{#if this.latest.value}}
+      <this.latest.latest />
+    {{/if}}
+
+  </template>
+}
+```
+
+
+#### Managing your own reactivity
+
+```js
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { compile } from 'ember-repl';
+
+export class Renderer extends Component {
+  @tracked component;
+  @tracked error;
+  @tracked isCompiling;
+
+  constructor(...args) {
+    super(...args);
+
+    compile('...', {
+      format: 'glimdown', // or 'gjs' or 'hbs'
+      onSuccess: async (component) => {
+        this.error = null;
+        this.isCompiling = false; 
+        this.component = component;
+        
+      },
+      onError: async (error) => {
+        this.isCompiling = false; 
+        this.error = error;
+      },
+      onCompileStart: async () => {
+        this.isCompiling = true; 
+      }
+    });
+  }
+}
+```
+```hbs
+{{#if this.component}}
+  <this.component />
+{{/if}}
+```
+
+
 ### Using existing components
 
 `ember-repl` is strict-mode only, so any component that you want to invoke
@@ -242,39 +409,6 @@ packagerOptions: {
 },
 ```
 
-If you are using ember-repl to showcase a styleguide _and_ have maximum strictness enabled in embroider,
-you'll need to manually (or programatically) list out each of the components you want to force to be
-included in the build output using the `buildComponentMap` function in your `ember-cli-build.js`.
-For example:
-
-```js
-const { Webpack } = require('@embroider/webpack');
-const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
-
-return require('@embroider/compat').compatBuild(app, Webpack, {
-  extraPublicTrees: [
-    require('ember-repl').buildComponentMap([
-      'limber/components/limber/menu',
-      'limber/components/limber/header',
-      'limber/components/external-link',
-      'limber/components/popper-j-s',
-      'ember-repl',
-    ]),
-  ],
-  // ...
-});
-```
-
-this emits an `/ember-repl/component-map.js` file in your public tree,
-which can then be `await import`ed and used via:
-
-```js
-let { COMPONENT_MAP } = await import('/ember-repl/component-map.js');
-
-let { component, error, name } = await compileJS(code, COMPONENT_MAP);
-```
-
-
 ## Security
 
 Many developers know that evaluating runnable user input is a huge security risk.

package/dist/browser/compile/formats.d.ts

@@ -0,0 +1,16 @@
+import { CompileResult } from "../types.js";
+import { EvalImportMap, ScopeMap } from "./types.js";
+declare function compileGJS(gjsInput: string, importMap?: EvalImportMap): Promise<CompileResult>;
+declare function compileHBS(hbsInput: string, options?: {
+    moduleName?: string;
+    scope?: Record<string, unknown>;
+}): Promise<CompileResult>;
+declare function compileMD(glimdownInput: string, options?: {
+    importMap?: EvalImportMap;
+    topLevelScope?: ScopeMap;
+    CopyComponent?: string;
+    ShadowComponent?: string;
+}): Promise<CompileResult & {
+    rootTemplate?: string;
+}>;
+export { compileGJS, compileHBS, compileMD };

package/dist/browser/compile/formats.js

@@ -0,0 +1,170 @@
+import { invocationName } from '../utils.js';
+
+async function compileAll(js, importMap) {
+  let modules = await Promise.all(js.map(async ({
+    code
+  }) => {
+    return await compileGJS(code, importMap);
+  }));
+  return modules;
+}
+async function compileGJS(gjsInput, importMap) {
+  try {
+    let {
+      compileJS
+    } = await import('../js.js');
+    return await compileJS(gjsInput, importMap);
+  } catch (error) {
+    return {
+      error: error,
+      name: 'unknown'
+    };
+  }
+}
+async function compileHBS(hbsInput, options) {
+  try {
+    let {
+      compileHBS
+    } = await import('../hbs.js');
+    return compileHBS(hbsInput, options);
+  } catch (error) {
+    return {
+      error: error,
+      name: 'unknown'
+    };
+  }
+}
+async function extractScope(liveCode, importMap) {
+  let scope = [];
+  let hbs = liveCode.filter(code => code.lang === 'hbs');
+  let js = liveCode.filter(code => ['js', 'gjs'].includes(code.lang));
+  if (js.length > 0) {
+    let compiled = await compileAll(js, importMap);
+    await Promise.all(compiled.map(async info => {
+      // using web worker + import maps is not available yet (need firefox support)
+      // (and to somehow be able to point at npm)
+      //
+      // if ('importPath' in info) {
+      //   return scope.push({
+      //     moduleName: name,
+      //     component: await import(/* webpackIgnore: true */ info.importPath),
+      //   });
+      // }
+
+      return scope.push(info);
+    }));
+  }
+  for (let {
+    code
+  } of hbs) {
+    let compiled = await compileHBS(code);
+    scope.push(compiled);
+  }
+  return scope;
+}
+async function compileMD(glimdownInput, options) {
+  let importMap = options?.importMap;
+  let topLevelScope = options?.topLevelScope ?? {};
+  let rootTemplate;
+  let liveCode;
+  let scope = [];
+
+  /**
+   * Step 1: Convert Markdown To HTML (Ember).
+   *
+   *         The remark plugin, remark-code-extra also extracts
+   *         and transforms the code blocks we care about.
+   *
+   *         These blocks will be compiled through babel and eval'd so the
+   *         compiled rootTemplate can invoke them
+   */
+  try {
+    let {
+      parseMarkdown
+    } = await import('./markdown-to-ember.js');
+    let {
+      templateOnlyGlimdown,
+      blocks
+    } = await parseMarkdown(glimdownInput, {
+      CopyComponent: options?.CopyComponent,
+      ShadowComponent: options?.ShadowComponent
+    });
+    rootTemplate = templateOnlyGlimdown;
+    liveCode = blocks;
+  } catch (error) {
+    return {
+      error: error,
+      name: 'unknown'
+    };
+  }
+
+  /**
+   * Step 2: Compile the live code samples
+   */
+  if (liveCode.length > 0) {
+    try {
+      scope = await extractScope(liveCode, importMap);
+    } catch (error) {
+      console.info({
+        scope
+      });
+      console.error(error);
+      return {
+        error: error,
+        rootTemplate,
+        name: 'unknown'
+      };
+    }
+  }
+
+  /**
+   * Make sure non of our snippets errored
+   *
+   * TODO: for these errors, report them differently so that we
+   * can render the 'Ember' and still highlight the correct line?
+   * or maybe there is a way to highlight in the editor instead?
+   */
+  for (let {
+    error,
+    component
+  } of scope) {
+    if (!component) {
+      if (error) {
+        return {
+          error,
+          rootTemplate,
+          name: 'unknown'
+        };
+      }
+    }
+  }
+
+  /**
+   * Step 4: Compile the Ember Template
+   */
+  try {
+    let localScope = scope.reduce((accum, {
+      component,
+      name
+    }) => {
+      accum[invocationName(name)] = component;
+      return accum;
+    }, {});
+    return await compileHBS(rootTemplate, {
+      moduleName: 'DynamicRootTemplate',
+      scope: {
+        ...topLevelScope,
+        ...localScope
+      }
+    });
+  } catch (error) {
+    return {
+      error: error,
+      rootTemplate,
+      name: 'unknown'
+    };
+  }
+}
+
+export { compileGJS, compileHBS, compileMD };
+//# sourceMappingURL=formats.js.map

package/dist/browser/compile/formats.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"formats.js","sources":["../../../src/browser/compile/formats.ts"],"sourcesContent":["import { invocationName } from '../utils';\n\nimport type { CompileResult } from '../types';\nimport type { ExtractedCode } from './markdown-to-ember';\nimport type { EvalImportMap, ScopeMap } from './types';\n\nasync function compileAll(js: { code: string }[], importMap?: EvalImportMap) {\n  let modules = await Promise.all(\n    js.map(async ({ code }) => {\n      return await compileGJS(code, importMap);\n    })\n  );\n\n  return modules;\n}\n\nexport async function compileGJS(\n  gjsInput: string,\n  importMap?: EvalImportMap\n): Promise<CompileResult> {\n  try {\n    let { compileJS } = await import('../js');\n\n    return await compileJS(gjsInput, importMap);\n  } catch (error) {\n    return { error: error as Error, name: 'unknown' };\n  }\n}\n\nexport async function compileHBS(\n  hbsInput: string,\n  options?: {\n    moduleName?: string;\n    scope?: Record<string, unknown>;\n  }\n): Promise<CompileResult> {\n  try {\n    let { compileHBS } = await import('../hbs');\n\n    return compileHBS(hbsInput, options);\n  } catch (error) {\n    return { error: error as Error, name: 'unknown' };\n  }\n}\n\nasync function extractScope(\n  liveCode: ExtractedCode[],\n  importMap?: EvalImportMap\n): Promise<CompileResult[]> {\n  let scope: CompileResult[] = [];\n\n  let hbs = liveCode.filter((code) => code.lang === 'hbs');\n  let js = liveCode.filter((code) => ['js', 'gjs'].includes(code.lang));\n\n  if (js.length > 0) {\n    let compiled = await compileAll(js, importMap);\n\n    await Promise.all(\n      compiled.map(async (info) => {\n        // using web worker + import maps is not available yet (need firefox support)\n        // (and to somehow be able to point at npm)\n        //\n        // if ('importPath' in info) {\n        //   return scope.push({\n        //     moduleName: name,\n        //     component: await import(/* webpackIgnore: true */ info.importPath),\n        //   });\n        // }\n\n        return scope.push(info);\n      })\n    );\n  }\n\n  for (let { code } of hbs) {\n    let compiled = await compileHBS(code);\n\n    scope.push(compiled);\n  }\n\n  return scope;\n}\n\nexport async function compileMD(\n  glimdownInput: string,\n  options?: {\n    importMap?: EvalImportMap;\n    topLevelScope?: ScopeMap;\n    CopyComponent?: string;\n    ShadowComponent?: string;\n  }\n): Promise<CompileResult & { rootTemplate?: string }> {\n  let importMap = options?.importMap;\n  let topLevelScope = options?.topLevelScope ?? {};\n  let rootTemplate: string;\n  let liveCode: ExtractedCode[];\n  let scope: CompileResult[] = [];\n\n  /**\n   * Step 1: Convert Markdown To HTML (Ember).\n   *\n   *         The remark plugin, remark-code-extra also extracts\n   *         and transforms the code blocks we care about.\n   *\n   *         These blocks will be compiled through babel and eval'd so the\n   *         compiled rootTemplate can invoke them\n   */\n  try {\n    let { parseMarkdown } = await import('./markdown-to-ember');\n    let { templateOnlyGlimdown, blocks } = await parseMarkdown(glimdownInput, {\n      CopyComponent: options?.CopyComponent,\n      ShadowComponent: options?.ShadowComponent,\n    });\n\n    rootTemplate = templateOnlyGlimdown;\n    liveCode = blocks;\n  } catch (error) {\n    return { error: error as Error, name: 'unknown' };\n  }\n\n  /**\n   * Step 2: Compile the live code samples\n   */\n  if (liveCode.length > 0) {\n    try {\n      scope = await extractScope(liveCode, importMap);\n    } catch (error) {\n      console.info({ scope });\n      console.error(error);\n\n      return { error: error as Error, rootTemplate, name: 'unknown' };\n    }\n  }\n\n  /**\n   * Make sure non of our snippets errored\n   *\n   * TODO: for these errors, report them differently so that we\n   * can render the 'Ember' and still highlight the correct line?\n   * or maybe there is a way to highlight in the editor instead?\n   */\n  for (let { error, component } of scope) {\n    if (!component) {\n      if (error) {\n        return { error, rootTemplate, name: 'unknown' };\n      }\n    }\n  }\n\n  /**\n   * Step 4: Compile the Ember Template\n   */\n  try {\n    let localScope = scope.reduce((accum, { component, name }) => {\n      accum[invocationName(name)] = component;\n\n      return accum;\n    }, {} as Record<string, unknown>);\n\n    return await compileHBS(rootTemplate, {\n      moduleName: 'DynamicRootTemplate',\n      scope: {\n        ...topLevelScope,\n        ...localScope,\n      },\n    });\n  } catch (error) {\n    return { error: error as Error, rootTemplate, name: 'unknown' };\n  }\n}\n"],"names":["compileAll","js","importMap","modules","Promise","all","map","code","compileGJS","gjsInput","compileJS","error","name","compileHBS","hbsInput","options","extractScope","liveCode","scope","hbs","filter","lang","includes","length","compiled","info","push","compileMD","glimdownInput","topLevelScope","rootTemplate","parseMarkdown","templateOnlyGlimdown","blocks","CopyComponent","ShadowComponent","console","component","localScope","reduce","accum","invocationName","moduleName"],"mappings":"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"}

package/dist/browser/compile/index.d.ts

@@ -0,0 +1,33 @@
+import { EvalImportMap, ScopeMap } from "./types.js";
+import { ComponentLike } from '@glint/template';
+type Format = 'glimdown' | 'gjs' | 'hbs';
+declare const CACHE: Map<string, ComponentLike>;
+/**
+ * This compileMD is a more robust version of the raw compiling used in "formats".
+ * This function manages cache, and has events for folks building UIs to hook in to
+ */
+declare function compile(text: string, { format, onSuccess, onError, onCompileStart, ...options }: {
+    format: Format;
+    onSuccess: (component: ComponentLike) => Promise<unknown> | unknown;
+    onError: (error: string) => Promise<unknown> | unknown;
+    onCompileStart: () => Promise<unknown> | unknown;
+    importMap?: EvalImportMap;
+    CopyComponent?: string;
+    ShadowComponent?: string;
+    topLevelScope?: ScopeMap;
+}): Promise<void>;
+type Input = string | undefined | null;
+/**
+ * By default, this compiles to `glimdown`. A Markdown format which
+ * extracts `live` tagged code snippets and compiles them to components.
+ */
+declare const Compiled: ((markdownText: Input | (() => Input), format?: Format | (() => Format) | undefined) => {
+    isReady: boolean;
+    error: unknown;
+    component: ComponentLike;
+}) | (() => {
+    isReady: boolean;
+    error: unknown;
+    component: ComponentLike;
+});
+export { CACHE, compile, Compiled };

package/dist/browser/compile/index.js

@@ -0,0 +1,90 @@
+import { resourceFactory, resource, cell } from 'ember-resources';
+import { nameFor } from '../utils.js';
+import { compileMD, compileGJS, compileHBS } from './formats.js';
+
+const CACHE = new Map();
+const SUPPORTED_FORMATS = ['glimdown', 'gjs', 'hbs'];
+
+/**
+ * This compileMD is a more robust version of the raw compiling used in "formats".
+ * This function manages cache, and has events for folks building UIs to hook in to
+ */
+async function compile(text, {
+  format,
+  onSuccess,
+  onError,
+  onCompileStart,
+  ...options
+}) {
+  let id = nameFor(text);
+  let existing = CACHE.get(id);
+  if (existing) {
+    onSuccess(existing);
+    return;
+  }
+  if (!SUPPORTED_FORMATS.includes(format)) {
+    await onError(`Unsupported format: ${format}. Supported formats: ${SUPPORTED_FORMATS}`);
+    return;
+  }
+  await onCompileStart();
+  if (!text) {
+    await onError('No Input Document yet');
+    return;
+  }
+  let result;
+  if (format === 'glimdown') {
+    result = await compileMD(text, options);
+  } else if (format === 'gjs') {
+    result = await compileGJS(text, options.importMap);
+  } else if (format === 'hbs') {
+    result = await compileHBS(text, {
+      scope: options.topLevelScope
+    });
+  } else {
+    await onError(`Unsupported format: ${format}. Supported formats: ${SUPPORTED_FORMATS}`);
+    return;
+  }
+  if (result.error) {
+    await onError(result.error.message || `${result.error}`);
+    return;
+  }
+  CACHE.set(id, result.component);
+  await onSuccess(result.component);
+}
+/**
+ * By default, this compiles to `glimdown`. A Markdown format which
+ * extracts `live` tagged code snippets and compiles them to components.
+ */
+const Compiled = resourceFactory((markdownText, format) => {
+  return resource(() => {
+    let _format = (typeof format === 'function' ? format() : format) || 'glimdown';
+    let input = typeof markdownText === 'function' ? markdownText() : markdownText;
+    let ready = cell(false);
+    let error = cell();
+    let result = cell();
+    if (input) {
+      compile(input, {
+        format: _format,
+        onSuccess: async component => {
+          result.current = component;
+          ready.set(true);
+          error.set(null);
+        },
+        onError: async e => {
+          error.set(e);
+        },
+        onCompileStart: async () => {
+          ready.set(false);
+        }
+      });
+    }
+    return () => ({
+      isReady: ready.current,
+      error: error.current,
+      component: result.current
+    });
+  });
+});
+
+export { CACHE, Compiled, compile };
+//# sourceMappingURL=index.js.map

package/dist/browser/compile/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/browser/compile/index.ts"],"sourcesContent":["import { cell, resource, resourceFactory } from 'ember-resources';\n\nimport { nameFor } from '../utils';\nimport {\n  compileGJS as processGJS,\n  compileHBS as processHBS,\n  compileMD as processMD,\n} from './formats';\n\nimport type { CompileResult } from '../types';\nimport type { EvalImportMap, ScopeMap } from './types';\nimport type { ComponentLike } from '@glint/template';\ntype Format = 'glimdown' | 'gjs' | 'hbs';\n\nexport const CACHE = new Map<string, ComponentLike>();\n\nconst SUPPORTED_FORMATS = ['glimdown', 'gjs', 'hbs'];\n\n/**\n * This compileMD is a more robust version of the raw compiling used in \"formats\".\n * This function manages cache, and has events for folks building UIs to hook in to\n */\nexport async function compile(\n  text: string,\n  {\n    format,\n    onSuccess,\n    onError,\n    onCompileStart,\n    ...options\n  }: {\n    format: Format;\n    onSuccess: (component: ComponentLike) => Promise<unknown> | unknown;\n    onError: (error: string) => Promise<unknown> | unknown;\n    onCompileStart: () => Promise<unknown> | unknown;\n    importMap?: EvalImportMap;\n    CopyComponent?: string;\n    ShadowComponent?: string;\n    topLevelScope?: ScopeMap;\n  }\n) {\n  let id = nameFor(text);\n\n  let existing = CACHE.get(id);\n\n  if (existing) {\n    onSuccess(existing);\n\n    return;\n  }\n\n  if (!SUPPORTED_FORMATS.includes(format)) {\n    await onError(`Unsupported format: ${format}. Supported formats: ${SUPPORTED_FORMATS}`);\n\n    return;\n  }\n\n  await onCompileStart();\n\n  if (!text) {\n    await onError('No Input Document yet');\n\n    return;\n  }\n\n  let result: CompileResult;\n\n  if (format === 'glimdown') {\n    result = await processMD(text, options);\n  } else if (format === 'gjs') {\n    result = await processGJS(text, options.importMap);\n  } else if (format === 'hbs') {\n    result = await processHBS(text, {\n      scope: options.topLevelScope,\n    });\n  } else {\n    await onError(`Unsupported format: ${format}. Supported formats: ${SUPPORTED_FORMATS}`);\n\n    return;\n  }\n\n  if (result.error) {\n    await onError(result.error.message || `${result.error}`);\n\n    return;\n  }\n\n  CACHE.set(id, result.component as ComponentLike);\n\n  await onSuccess(result.component as ComponentLike);\n}\n\ntype Input = string | undefined | null;\n\n/**\n * By default, this compiles to `glimdown`. A Markdown format which\n * extracts `live` tagged code snippets and compiles them to components.\n */\nexport const Compiled = resourceFactory(\n  (markdownText: Input | (() => Input), format?: Format | (() => Format)) => {\n    return resource(() => {\n      let _format: Format = (typeof format === 'function' ? format() : format) || 'glimdown';\n      let input = typeof markdownText === 'function' ? markdownText() : markdownText;\n      let ready = cell(false);\n      let error = cell();\n      let result = cell<ComponentLike>();\n\n      if (input) {\n        compile(input, {\n          format: _format,\n          onSuccess: async (component) => {\n            result.current = component;\n            ready.set(true);\n            error.set(null);\n          },\n          onError: async (e) => {\n            error.set(e);\n          },\n          onCompileStart: async () => {\n            ready.set(false);\n          },\n        });\n      }\n\n      return () => ({\n        isReady: ready.current,\n        error: error.current,\n        component: result.current,\n      });\n    });\n  }\n);\n"],"names":["CACHE","Map","SUPPORTED_FORMATS","compile","text","format","onSuccess","onError","onCompileStart","options","id","nameFor","existing","get","includes","result","processMD","processGJS","importMap","processHBS","scope","topLevelScope","error","message","set","component","Compiled","resourceFactory","markdownText","resource","_format","input","ready","cell","current","e","isReady"],"mappings":"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"}

package/dist/browser/compile/markdown-to-ember.d.ts

@@ -0,0 +1,18 @@
+interface ExtractedCode {
+    name: string;
+    code: string;
+    lang: string;
+}
+interface LiveCodeExtraction {
+    templateOnlyGlimdown: string;
+    blocks: ExtractedCode[];
+}
+interface ParseMarkdownOptions {
+    CopyComponent?: string;
+    ShadowComponent?: string;
+}
+/**
+ * @internal not under semver
+ */
+declare function parseMarkdown(input: string, options?: ParseMarkdownOptions): Promise<LiveCodeExtraction>;
+export { ExtractedCode, LiveCodeExtraction, parseMarkdown };