@rindo/core 2.22.3 → 3.0.0-alpha.0

package/compiler/rindo.js

@@ -1,5 +1,5 @@
 /*!
- Rindo Compiler v2.22.3 | MIT Licensed | https://rindojs.web.app
+ Rindo Compiler v3.0.0-alpha.0 | MIT Licensed | https://rindojs.web.app
  */
 (function(exports) {
 'use strict';
@@ -34,7 +34,7 @@ if (!process.platform) {
   process.platform = 'rindo';
 }
 if (!process.version) {
-  process.version = 'v12.0.0';
+  process.version = 'v14.0.0';
 }
 process.browser = !!globalThis.location;
 
@@ -2097,7 +2097,7 @@ const process$3 = /*#__PURE__*/Object.assign(/*#__PURE__*/Object.create(null), p
   'default': process_1
 });
 
-const buildId = '1680683029';
+const buildId = '20230405110903';
 const minfyJsId = 'terser5.16.1_7';
 const optimizeCssId = 'autoprefixer10.4.13_postcss8.4.21_7';
 const parse5Version = '7.1.2';
@@ -2105,8 +2105,8 @@ const rollupVersion = '2.42.3';
 const sizzleVersion = '2.42.3';
 const terserVersion = '5.16.1';
 const typescriptVersion = '4.9.4';
-const vermoji = '🐉';
-const version$3 = '2.22.3';
+const vermoji = '🍌';
+const version$3 = '3.0.0-alpha.0';
 const versions = {
   rindo: version$3,
   parse5: parse5Version,
@@ -4207,8 +4207,8 @@ const createSystem = (c) => {
   const logger = (_a = c === null || c === void 0 ? void 0 : c.logger) !== null && _a !== void 0 ? _a : createLogger();
   const items = new Map();
   const destroys = new Set();
-  const addDestory = (cb) => destroys.add(cb);
-  const removeDestory = (cb) => destroys.delete(cb);
+  const addDestroy = (cb) => destroys.add(cb);
+  const removeDestroy = (cb) => destroys.delete(cb);
   const events = buildEvents();
   const hardwareConcurrency = (IS_BROWSER_ENV && navigator.hardwareConcurrency) || 1;
   const destroy = async () => {
@@ -4435,10 +4435,10 @@ const createSystem = (c) => {
       removedFiles: [],
       error: null,
     };
-    remoreDirSyncRecursive(p, opts, results);
+    removeDirSyncRecursive(p, opts, results);
     return results;
   };
-  const remoreDirSyncRecursive = (p, opts, results) => {
+  const removeDirSyncRecursive = (p, opts, results) => {
     if (!results.error) {
       p = normalize(p);
       const dirItemPaths = readDirSync(p);
@@ -4447,7 +4447,7 @@ const createSystem = (c) => {
           const item = items.get(dirItemPath);
           if (item) {
             if (item.isDirectory) {
-              remoreDirSyncRecursive(dirItemPath, opts, results);
+              removeDirSyncRecursive(dirItemPath, opts, results);
             }
             else if (item.isFile) {
               const removeFileResults = removeFileSync(dirItemPath);
@@ -4527,7 +4527,7 @@ const createSystem = (c) => {
         }
       }
     };
-    addDestory(close);
+    addDestroy(close);
     if (item) {
       item.isDirectory = true;
       item.isFile = false;
@@ -4546,7 +4546,7 @@ const createSystem = (c) => {
     }
     return {
       close() {
-        removeDestory(close);
+        removeDestroy(close);
         close();
       },
     };
@@ -4563,7 +4563,7 @@ const createSystem = (c) => {
         }
       }
     };
-    addDestory(close);
+    addDestroy(close);
     if (item) {
       item.isDirectory = false;
       item.isFile = true;
@@ -4582,7 +4582,7 @@ const createSystem = (c) => {
     }
     return {
       close() {
-        removeDestory(close);
+        removeDestroy(close);
         close();
       },
     };
@@ -4683,7 +4683,7 @@ const createSystem = (c) => {
     events,
     access,
     accessSync,
-    addDestory,
+    addDestroy,
     copyFile,
     createDir,
     createDirSync,
@@ -4708,7 +4708,7 @@ const createSystem = (c) => {
     readFileSync,
     realpath,
     realpathSync,
-    removeDestory,
+    removeDestroy,
     rename,
     fetch,
     resolvePath,
@@ -13348,15 +13348,15 @@ const relativeImport = (pathFrom, pathTo, ext, addPrefix = true) => {
   }
   return normalizePath$2(`${relativePath}/${basename(pathTo, ext)}`);
 };
-const getComponentsDtsSrcFilePath = (config) => join(config.srcDir, GENERATED_DTS$1);
-const getComponentsDtsTypesFilePath = (outputTarget) => join(outputTarget.typesDir, GENERATED_DTS$1);
+const getComponentsDtsSrcFilePath = (config) => join(config.srcDir, GENERATED_DTS);
+const getComponentsDtsTypesFilePath = (outputTarget) => join(outputTarget.typesDir, GENERATED_DTS);
 const isOutputTargetDist = (o) => o.type === DIST;
 const isOutputTargetDistCollection = (o) => o.type === DIST_COLLECTION;
 const isOutputTargetDistCustomElements = (o) => o.type === DIST_CUSTOM_ELEMENTS;
+// TODO: fully delete dist-custom-elements-bundle code
 const isOutputTargetDistCustomElementsBundle = (o) => o.type === DIST_CUSTOM_ELEMENTS_BUNDLE;
 const isOutputTargetCopy = (o) => o.type === COPY;
 const isOutputTargetDistLazy = (o) => o.type === DIST_LAZY;
-const isOutputTargetAngular = (o) => o.type === ANGULAR;
 const isOutputTargetDistLazyLoader = (o) => o.type === DIST_LAZY_LOADER;
 const isOutputTargetDistGlobalStyles = (o) => o.type === DIST_GLOBAL_STYLES;
 const isOutputTargetHydrate = (o) => o.type === DIST_HYDRATE_SCRIPT;
@@ -13370,12 +13370,12 @@ const isOutputTargetWww = (o) => o.type === WWW;
 const isOutputTargetStats = (o) => o.type === STATS;
 const isOutputTargetDistTypes = (o) => o.type === DIST_TYPES;
 const getComponentsFromModules = (moduleFiles) => sortBy(flatOne(moduleFiles.map((m) => m.cmps)), (c) => c.tagName);
-const ANGULAR = 'angular';
 const COPY = 'copy';
 const CUSTOM = 'custom';
 const DIST = 'dist';
 const DIST_COLLECTION = 'dist-collection';
 const DIST_CUSTOM_ELEMENTS = 'dist-custom-elements';
+// TODO: fully delete dist-custom-elements-bundle code
 const DIST_CUSTOM_ELEMENTS_BUNDLE = 'dist-custom-elements-bundle';
 const DIST_TYPES = 'dist-types';
 const DIST_HYDRATE_SCRIPT = 'dist-hydrate-script';
@@ -13402,7 +13402,6 @@ const VALID_CONFIG_OUTPUT_TARGETS = [
   DIST,
   DIST_COLLECTION,
   DIST_CUSTOM_ELEMENTS,
-  DIST_CUSTOM_ELEMENTS_BUNDLE,
   DIST_LAZY,
   DIST_HYDRATE_SCRIPT,
   // DOCS
@@ -13411,7 +13410,6 @@ const VALID_CONFIG_OUTPUT_TARGETS = [
   DOCS_VSCODE,
   DOCS_CUSTOM,
   // MISC
-  ANGULAR,
   COPY,
   CUSTOM,
   STATS,
@@ -13430,7 +13428,7 @@ function isValidConfigOutputTarget(targetType) {
   // see microsoft/TypeScript#31018 for some discussion of this
   return VALID_CONFIG_OUTPUT_TARGETS.includes(targetType);
 }
-const GENERATED_DTS$1 = 'components.d.ts';
+const GENERATED_DTS = 'components.d.ts';
 
 const getTsOptionsToExtend = (config) => {
   const tsOptions = {
@@ -13506,7 +13504,7 @@ const createTsBuildProgram = async (config, buildCallback) => {
       clearInterval(timeoutId);
     },
   };
-  config.sys.addDestory(() => tsWatchSys.clearTimeout(currentBuildTimeoutId));
+  config.sys.addDestroy(() => tsWatchSys.clearTimeout(currentBuildTimeoutId));
   /**
    * Create a {@link ts.WatchCompilerHost}. A CompilerHost allows a {@link ts.Program} to interact with the
    * {@link ts.System}, by acting as an intermediary:
@@ -20006,6 +20004,15 @@ const getTypeReferenceLocation = (typeName, tsNode) => {
   if (isExported) {
     return {
       location: 'local',
+      // If this is a local import, we know the path to the type
+      // is the same as the current source file path
+      //
+      // We need to explicitly include the path here because
+      // future logic for generating app types will use this resolved reference
+      // to ensure that type name collisions do no occur in the output type
+      // declaration file. If this path is omitted, the correct aliased type names
+      // will not be used for component event definitions
+      path: sourceFileObj.fileName,
     };
   }
   // This is most likely a global type, if it is a local that is not exported then typescript will inform the dev
@@ -56062,7 +56069,7 @@ const addDefineCustomElementFunctions = (compilerCtx, components, outputTarget)
         caseStatements.push(createCustomElementsDefineCase(principalComponent.tagName, customElementsDefineCallExpression));
         setupComponentDependencies(moduleFile, components, newStatements, caseStatements, tagNames);
         addDefineCustomElementFunction(tagNames, newStatements, caseStatements);
-        if (outputTarget.autoDefineCustomElements) {
+        if (outputTarget.customElementsExportBehavior === 'auto-define-custom-elements') {
           const conditionalDefineCustomElementCall = createAutoDefinitionExpression(principalComponent.componentClassName);
           newStatements.push(conditionalDefineCustomElementCall);
         }
@@ -57162,9 +57169,7 @@ const getBundleOptions = (config, buildCtx, compilerCtx, outputTarget) => ({
     // @see {@link https://rollupjs.org/guide/en/#conventions} for more info.
     index: '\0core',
   },
-  loader: {
-    '\0core': generateEntryPoint$1(outputTarget),
-  },
+  loader: {},
   inlineDynamicImports: outputTarget.inlineDynamicImports,
   preserveEntrySignatures: 'allow-extension',
 });
@@ -57181,7 +57186,7 @@ const getBundleOptions = (config, buildCtx, compilerCtx, outputTarget) => ({
 const bundleCustomElements$1 = async (config, compilerCtx, buildCtx, outputTarget) => {
   try {
     const bundleOpts = getBundleOptions(config, buildCtx, compilerCtx, outputTarget);
-    addCustomElementInputs(buildCtx, bundleOpts);
+    addCustomElementInputs(buildCtx, bundleOpts, outputTarget);
     const build = await bundleOutput(config, compilerCtx, buildCtx, bundleOpts);
     if (build) {
       const rollupOutput = await build.generate({
@@ -57243,11 +57248,17 @@ const bundleCustomElements$1 = async (config, compilerCtx, buildCtx, outputTarge
  * Create the virtual modules/input modules for the `dist-custom-elements` output target.
  * @param buildCtx the context for the current build
  * @param bundleOpts the bundle options to store the virtual modules under. acts as an output parameter
+ * @param outputTarget the configuration for the custom element output target
  */
-const addCustomElementInputs = (buildCtx, bundleOpts) => {
+const addCustomElementInputs = (buildCtx, bundleOpts, outputTarget) => {
   const components = buildCtx.components;
-  // an array to store the imports of these modules that we're going to add to our entry chunk
+  // An array to store the imports of these modules that we're going to add to our entry chunk
   const indexImports = [];
+  // An array to store the export declarations that we're going to add to our entry chunk
+  const indexExports = [];
+  // An array to store the exported component names that will be used for the `defineCustomElements`
+  // function on the `bundle` export behavior option
+  const exportNames = [];
   components.forEach((cmp) => {
     const exp = [];
     const exportName = dashToPascalCase$1(cmp.tagName);
@@ -57256,7 +57267,7 @@ const addCustomElementInputs = (buildCtx, bundleOpts) => {
     const coreKey = `\0${exportName}`;
     if (cmp.isPlain) {
       exp.push(`export { ${importName} as ${exportName} } from '${cmp.sourceFilePath}';`);
-      indexImports.push(`export { {${exportName} } from '${coreKey}';`);
+      indexExports.push(`export { {${exportName} } from '${coreKey}';`);
     }
     else {
       // the `importName` may collide with the `exportName`, alias it just in case it does with `importAs`
@@ -57269,25 +57280,55 @@ const addCustomElementInputs = (buildCtx, bundleOpts) => {
       // correct virtual module, if we instead referenced, for instance,
       // `cmp.sourceFilePath`, we would end up with duplicated modules in our
       // output.
-      indexImports.push(`export { ${exportName}, defineCustomElement as defineCustomElement${exportName} } from '${coreKey}';`);
+      indexExports.push(`export { ${exportName}, defineCustomElement as defineCustomElement${exportName} } from '${coreKey}';`);
     }
+    indexImports.push(`import { ${exportName} } from '${coreKey}';`);
+    exportNames.push(exportName);
     bundleOpts.inputs[cmp.tagName] = coreKey;
     bundleOpts.loader[coreKey] = exp.join('\n');
   });
-  bundleOpts.loader['\0core'] += indexImports.join('\n');
+  // Generate the contents of the entry file to be created by the bundler
+  bundleOpts.loader['\0core'] = generateEntryPoint$1(outputTarget, indexImports, indexExports, exportNames);
 };
 /**
  * Generate the entrypoint (`index.ts` file) contents for the `dist-custom-elements` output target
  * @param outputTarget the output target's configuration
+ * @param cmpImports The import declarations for local component modules.
+ * @param cmpExports The export declarations for local component modules.
+ * @param cmpNames The exported component names (could be aliased) from local component modules.
  * @returns the stringified contents to be placed in the entrypoint
  */
-const generateEntryPoint$1 = (outputTarget) => {
-  const imp = [];
-  imp.push(`export { setAssetPath, setNonce, setPlatformOptions } from '${RINDO_INTERNAL_CLIENT_ID}';`, `export * from '${USER_INDEX_ENTRY_ID}';`);
+const generateEntryPoint$1 = (outputTarget, cmpImports = [], cmpExports = [], cmpNames = []) => {
+  const body = [];
+  const imports = [];
+  const exports = [];
+  // Exports that are always present
+  exports.push(`export { setAssetPath, setNonce, setPlatformOptions } from '${RINDO_INTERNAL_CLIENT_ID}';`, `export * from '${USER_INDEX_ENTRY_ID}';`);
+  // Content related to global scripts
   if (outputTarget.includeGlobalScripts !== false) {
-    imp.push(`import { globalScripts } from '${RINDO_APP_GLOBALS_ID}';`, `globalScripts();`);
-  }
-  return imp.join('\n') + '\n';
+    imports.push(`import { globalScripts } from '${RINDO_APP_GLOBALS_ID}';`);
+    body.push(`globalScripts();`);
+  }
+  // Content related to the `bundle` export behavior
+  if (outputTarget.customElementsExportBehavior === 'bundle') {
+    imports.push(...cmpImports);
+    body.push('export const defineCustomElements = (opts) => {', "  if (typeof customElements !== 'undefined') {", '    [', ...cmpNames.map((cmp) => `      ${cmp},`), '    ].forEach(cmp => {', '      if (!customElements.get(cmp.is)) {', '        customElements.define(cmp.is, cmp, opts);', '      }', '    });', '  }', '};');
+  }
+  // Content related to the `single-export-module` export behavior
+  if (outputTarget.customElementsExportBehavior === 'single-export-module') {
+    exports.push(...cmpExports);
+  }
+  // Generate the contents of the file based on the parts
+  // defined above. This keeps the file structure consistent as
+  // new export behaviors may be added
+  let content = '';
+  // Add imports to file content
+  content += imports.length ? imports.join('\n') + '\n' : '';
+  // Add exports to file content
+  content += exports.length ? exports.join('\n') + '\n' : '';
+  // Add body to file content
+  content += body.length ? '\n' + body.join('\n') + '\n' : '';
+  return content;
 };
 /**
  * Get the series of custom transformers that will be applied to a Rindo project's source code during the TypeScript
@@ -57318,6 +57359,7 @@ const getCustomElementCustomTransformer = (config, compilerCtx, components, outp
   ];
 };
 
+// TODO: fully delete dist-custom-elements-bundle code
 const outputCustomElementsBundle = async (config, compilerCtx, buildCtx) => {
   if (!config.buildDist) {
     return;
@@ -59089,195 +59131,6 @@ const getLazyEntry = (isBrowser) => {
   return s.toString();
 };
 
-const outputAngular = async (config, compilerCtx, buildCtx) => {
-  if (!config.buildDist) {
-    return;
-  }
-  const angularOutputTargets = config.outputTargets.filter(isOutputTargetAngular);
-  if (angularOutputTargets.length === 0) {
-    return;
-  }
-  const timespan = buildCtx.createTimeSpan(`generate angular proxies started`, true);
-  await Promise.all(angularOutputTargets.map((outputTarget) => angularDirectiveProxyOutput(config, compilerCtx, buildCtx, outputTarget)));
-  timespan.finish(`generate angular proxies finished`);
-};
-const angularDirectiveProxyOutput = (config, compilerCtx, buildCtx, outputTarget) => {
-  const filteredComponents = getFilteredComponents(outputTarget.excludeComponents, buildCtx.components);
-  return Promise.all([
-    generateProxies(config, compilerCtx, buildCtx, filteredComponents, outputTarget),
-    generateAngularArray(compilerCtx, filteredComponents, outputTarget),
-    generateAngularUtils(compilerCtx, outputTarget),
-  ]);
-};
-const getFilteredComponents = (excludeComponents = [], cmps) => {
-  return sortBy(cmps, (cmp) => cmp.tagName).filter((c) => !excludeComponents.includes(c.tagName) && !c.internal);
-};
-const generateProxies = async (config, compilerCtx, buildCtx, components, outputTarget) => {
-  const proxies = getProxies(components);
-  const distTypesDir = dirname(buildCtx.packageJson.types);
-  const dtsFilePath = join(config.rootDir, distTypesDir, GENERATED_DTS);
-  const componentsTypeFile = relativeImport(outputTarget.directivesProxyFile, dtsFilePath, '.d.ts');
-  const imports = `/* eslint-disable */
-/* tslint:disable */
-/* auto-generated angular directive proxies */
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, NgZone } from '@angular/core';`;
-  const sourceImports = !outputTarget.componentCorePackage
-    ? `import { Components } from '${componentsTypeFile}';`
-    : `import { Components } from '${outputTarget.componentCorePackage}';`;
-  const final = [imports, getProxyUtils(outputTarget), sourceImports, proxies];
-  const finalText = final.join('\n') + '\n';
-  const tsSourceFile = t.createSourceFile(GENERATED_DTS, finalText, t.ScriptTarget.Latest, false);
-  const tsPrinter = t.createPrinter({
-    newLine: t.NewLineKind.LineFeed,
-  });
-  const formattedCode = tsPrinter.printFile(tsSourceFile);
-  return compilerCtx.fs.writeFile(outputTarget.directivesProxyFile, formattedCode);
-};
-const getProxies = (components) => {
-  return components.map(getProxy).join('\n');
-};
-const getProxyCmp = (inputs, methods) => {
-  const hasInputs = inputs.length > 0;
-  const hasMethods = methods.length > 0;
-  const proxMeta = [];
-  if (!hasInputs && !hasMethods) {
-    return '';
-  }
-  if (hasInputs)
-    proxMeta.push(`inputs: ['${inputs.join(`', '`)}']`);
-  if (hasMethods)
-    proxMeta.push(`'methods': ['${methods.join(`', '`)}']`);
-  return `@ProxyCmp({${proxMeta.join(', ')}})`;
-};
-const getProxy = (cmpMeta) => {
-  // Collect component meta
-  const inputs = getInputs(cmpMeta);
-  const outputs = getOutputs(cmpMeta);
-  const methods = getMethods(cmpMeta);
-  const hasOutputs = outputs.length > 0;
-  // Generate Angular @Directive
-  const directiveOpts = [
-    `selector: \'${cmpMeta.tagName}\'`,
-    `changeDetection: ChangeDetectionStrategy.OnPush`,
-    `template: '<ng-content></ng-content>'`,
-  ];
-  if (inputs.length > 0) {
-    directiveOpts.push(`inputs: ['${inputs.join(`', '`)}']`);
-  }
-  const tagNameAsPascal = dashToPascalCase$1(cmpMeta.tagName);
-  const lines = [
-    `
-export declare interface ${tagNameAsPascal} extends Components.${tagNameAsPascal} {}
-${getProxyCmp(inputs, methods)}
-@Component({ ${directiveOpts.join(', ')} })
-export class ${tagNameAsPascal} {`,
-  ];
-  // Generate outputs
-  outputs.forEach((output) => {
-    lines.push(`  ${output}!: EventEmitter<CustomEvent>;`);
-  });
-  lines.push('  protected el: HTMLElement;');
-  lines.push(`  constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
-  c.detach();
-  this.el = r.nativeElement;`);
-  if (hasOutputs) {
-    lines.push(`  proxyOutputs(this, this.el, ['${outputs.join(`', '`)}']);`);
-  }
-  lines.push(`  }`);
-  lines.push(`}`);
-  return lines.join('\n');
-};
-const getInputs = (cmpMeta) => {
-  return [
-    ...cmpMeta.properties.filter((prop) => !prop.internal).map((prop) => prop.name),
-    ...cmpMeta.virtualProperties.map((prop) => prop.name),
-  ].sort();
-};
-const getOutputs = (cmpMeta) => {
-  return cmpMeta.events.filter((ev) => !ev.internal).map((prop) => prop.name);
-};
-const getMethods = (cmpMeta) => {
-  return cmpMeta.methods.filter((method) => !method.internal).map((prop) => prop.name);
-};
-const getProxyUtils = (outputTarget) => {
-  if (!outputTarget.directivesUtilsFile) {
-    return PROXY_UTILS.replace(/export function/g, 'function');
-  }
-  else {
-    const utilsPath = relativeImport(outputTarget.directivesProxyFile, outputTarget.directivesUtilsFile, '.ts');
-    return `import { ProxyCmp, proxyOutputs } from '${utilsPath}';\n`;
-  }
-};
-const generateAngularArray = (compilerCtx, components, outputTarget) => {
-  if (!outputTarget.directivesArrayFile) {
-    return Promise.resolve();
-  }
-  const proxyPath = relativeImport(outputTarget.directivesArrayFile, outputTarget.directivesProxyFile, '.ts');
-  const directives = components
-    .map((cmpMeta) => dashToPascalCase$1(cmpMeta.tagName))
-    .map((className) => `  d.${className}`)
-    .join(',\n');
-  const c = `
-import type * as d from '${proxyPath}';
-
-export const DIRECTIVES = [
-${directives}
-];
-`;
-  return compilerCtx.fs.writeFile(outputTarget.directivesArrayFile, c);
-};
-const generateAngularUtils = async (compilerCtx, outputTarget) => {
-  if (outputTarget.directivesUtilsFile) {
-    await compilerCtx.fs.writeFile(outputTarget.directivesUtilsFile, '/* eslint-disable */\n/* tslint:disable */\n' + PROXY_UTILS);
-  }
-};
-const PROXY_UTILS = `import { fromEvent } from 'rxjs';
-
-export const proxyInputs = (Cmp: any, inputs: string[]) => {
-  const Prototype = Cmp.prototype;
-  inputs.forEach(item => {
-  Object.defineProperty(Prototype, item, {
-    get() {
-    return this.el[item];
-    },
-    set(val: any) {
-    this.z.runOutsideAngular(() => (this.el[item] = val));
-    }
-  });
-  });
-};
-
-export const proxyMethods = (Cmp: any, methods: string[]) => {
-  const Prototype = Cmp.prototype;
-  methods.forEach(methodName => {
-  Prototype[methodName] = function () {
-    const args = arguments;
-    return this.z.runOutsideAngular(() =>
-    this.el[methodName].apply(this.el, args)
-    );
-  };
-  });
-};
-
-export const proxyOutputs = (instance: any, el: any, events: string[]) => {
-  events.forEach(eventName => instance[eventName] = fromEvent(el, eventName));
-}
-
-export function ProxyCmp(opts: { inputs?: any; methods?: any }) {
-  const decorator =  function(cls: any){
-  if (opts.inputs) {
-    proxyInputs(cls, opts.inputs);
-  }
-  if (opts.methods) {
-    proxyMethods(cls, opts.methods);
-  }
-  return cls;
-  };
-  return decorator;
-}
-`;
-const GENERATED_DTS = 'components.d.ts';
-
 const generateCustomDocs = async (config, docsData, outputTargets) => {
   const customOutputTargets = outputTargets.filter(isOutputTargetDocsCustom);
   if (customOutputTargets.length === 0) {
@@ -60600,29 +60453,38 @@ const generateCustomElementsTypes = async (config, compilerCtx, buildCtx, typesD
  * @param outputTarget the output target for which types are being currently generated
  */
 const generateCustomElementsTypesOutput$1 = async (config, compilerCtx, buildCtx, typesDir, outputTarget) => {
+  const isBarrelExport = outputTarget.customElementsExportBehavior === 'single-export-module';
+  const isBundleExport = outputTarget.customElementsExportBehavior === 'bundle';
   // the path where we're going to write the typedef for the whole dist-custom-elements output
   const customElementsDtsPath = join(outputTarget.dir, 'index.d.ts');
   // the directory where types for the individual components are written
   const componentsTypeDirectoryRelPath = relative$1(outputTarget.dir, typesDir);
   const components = buildCtx.components.filter((m) => !m.isCollectionDependency);
   const code = [
-    `/* ${config.namespace} custom elements */`,
-    ...components.map((component) => {
-      const exportName = dashToPascalCase$1(component.tagName);
-      const importName = component.componentClassName;
-      // typedefs for individual components can be found under paths like
-      // $TYPES_DIR/components/my-component/my-component.d.ts
-      //
-      // To construct this path we:
-      //
-      // - get the relative path to the component's source file from the source directory
-      // - join that relative path to the relative path from the `index.d.ts` file to the
-      //   directory where typedefs are saved
-      const componentSourceRelPath = relative$1(config.srcDir, component.sourceFilePath).replace('.tsx', '');
-      const componentDTSPath = join(componentsTypeDirectoryRelPath, componentSourceRelPath);
-      return `export { ${importName} as ${exportName} } from '${componentDTSPath}';`;
-    }),
-    ``,
+    // To mirror the index.js file and only export the typedefs for the
+    // entities exported there, we will re-export the typedefs iff
+    // the `customElementsExportBehavior` is set to barrel component exports
+    ...(isBarrelExport
+      ? [
+        `/* ${config.namespace} custom elements */`,
+        ...components.map((component) => {
+          const exportName = dashToPascalCase$1(component.tagName);
+          const importName = component.componentClassName;
+          // typedefs for individual components can be found under paths like
+          // $TYPES_DIR/components/my-component/my-component.d.ts
+          //
+          // To construct this path we:
+          //
+          // - get the relative path to the component's source file from the source directory
+          // - join that relative path to the relative path from the `index.d.ts` file to the
+          //   directory where typedefs are saved
+          const componentSourceRelPath = relative$1(config.srcDir, component.sourceFilePath).replace('.tsx', '');
+          const componentDTSPath = join(componentsTypeDirectoryRelPath, componentSourceRelPath);
+          return `export { ${importName} as ${exportName} } from '${componentDTSPath}';`;
+        }),
+        ``,
+      ]
+      : []),
     `/**`,
     ` * Used to manually set the base path where assets can be found.`,
     ` * If the script is used as "module", it's recommended to use "import.meta.url",`,
@@ -60650,16 +60512,41 @@ const generateCustomElementsTypesOutput$1 = async (config, compilerCtx, buildCtx
     `  rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;`,
     `}`,
     `export declare const setPlatformOptions: (opts: SetPlatformOptions) => void;`,
+    ...(isBundleExport
+      ? [
+        ``,
+        `/**`,
+        ` * Utility to define all custom elements within this package using the tag name provided in the component's source.`,
+        ` * When defining each custom element, it will also check it's safe to define by:`,
+        ` *`,
+        ` * 1. Ensuring the "customElements" registry is available in the global context (window).`,
+        ` * 2. Ensuring that the component tag name is not already defined.`,
+        ` *`,
+        ` * Use the standard [customElements.define()](https://developer.mozilla.org/en-US/docs/Web/API/CustomElementRegistry/define)`,
+        ` * method instead to define custom elements individually, or to provide a different tag name.`,
+        ` */`,
+        `export declare const defineCustomElements: (opts?: any) => void;`,
+      ]
+      : []),
   ];
   const componentsDtsRelPath = relDts$1(outputTarget.dir, join(typesDir, 'components.d.ts'));
-  const usersIndexJsPath = join(config.srcDir, 'index.ts');
-  const hasUserIndex = await compilerCtx.fs.access(usersIndexJsPath);
-  if (hasUserIndex) {
-    const userIndexRelPath = normalizePath$2(dirname(componentsDtsRelPath));
-    code.push(`export * from '${userIndexRelPath}';`);
-  }
-  else {
-    code.push(`export * from '${componentsDtsRelPath}';`);
+  // To mirror the index.js file and only export the typedefs for the
+  // entities exported there, we will re-export the typedefs iff
+  // the `customElementsExportBehavior` is set to barrel component exports
+  if (isBarrelExport) {
+    // If there is an `index.ts` file in the src directory, we'll re-export anything
+    // exported from that file
+    // Otherwise, we'll export everything from the auto-generated `components.d.ts`
+    // file in the output directory
+    const usersIndexJsPath = join(config.srcDir, 'index.ts');
+    const hasUserIndex = await compilerCtx.fs.access(usersIndexJsPath);
+    if (hasUserIndex) {
+      const userIndexRelPath = normalizePath$2(dirname(componentsDtsRelPath));
+      code.push(`export * from '${userIndexRelPath}';`);
+    }
+    else {
+      code.push(`export * from '${componentsDtsRelPath}';`);
+    }
   }
   await compilerCtx.fs.writeFile(customElementsDtsPath, code.join('\n') + `\n`, {
     outputTargetType: outputTarget.type,
@@ -60711,6 +60598,7 @@ const relDts$1 = (fromPath, dtsPath) => {
   return normalizePath$2(dtsPath.replace('.d.ts', ''));
 };
 
+// TODO: fully delete dist-custom-elements-bundle code
 const generateCustomElementsBundleTypes = async (config, compilerCtx, buildCtx, distDtsFilePath) => {
   const outputTargets = config.outputTargets.filter(isOutputTargetDistCustomElementsBundle);
   await Promise.all(outputTargets.map((outputTarget) => generateCustomElementsTypesOutput(config, compilerCtx, buildCtx, distDtsFilePath, outputTarget)));
@@ -61204,10 +61092,10 @@ const generateAppTypes = async (config, compilerCtx, buildCtx, destination) => {
   // immediately write the components.d.ts file to disk and put it into fs memory
   let componentsDtsFilePath = getComponentsDtsSrcFilePath(config);
   if (!areTypesInternal) {
-    componentsDtsFilePath = resolve$3(destination, GENERATED_DTS$1);
+    componentsDtsFilePath = resolve$3(destination, GENERATED_DTS);
     componentTypesFileContent = updateRindoTypesImports(destination, componentsDtsFilePath, componentTypesFileContent);
   }
-  const writeResults = await compilerCtx.fs.writeFile(componentsDtsFilePath, componentTypesFileContent, {
+  const writeResults = await compilerCtx.fs.writeFile(normalizePath$2(componentsDtsFilePath), componentTypesFileContent, {
     immediateWrite: true,
   });
   const hasComponentsDtsChanged = writeResults.changedContent;
@@ -61249,17 +61137,15 @@ const generateComponentTypesFile = (config, buildCtx, areTypesInternal) => {
   });
   c.push(COMPONENTS_DTS_HEADER);
   c.push(`import { HTMLRindoElement, JSXBase } from "@rindo/core/internal";`);
-  // write the import statements for our type declaration file
-  c.push(...Object.keys(typeImportData).map((filePath) => {
+  // Map event type metadata to partial expressions (omitting import/export keywords)
+  // e.g. { TestEvent } from '../path/to/event/test-event.interface';
+  const expressions = Object.keys(typeImportData).map((filePath) => {
     const typeData = typeImportData[filePath];
-    let importFilePath;
+    let importFilePath = filePath;
     if (isAbsolute$1(filePath)) {
       importFilePath = normalizePath$2('./' + relative$1(config.srcDir, filePath)).replace(/\.(tsx|ts)$/, '');
     }
-    else {
-      importFilePath = filePath;
-    }
-    return `import { ${typeData
+    return `{ ${typeData
       .sort(sortImportNames)
       .map((td) => {
       if (td.localName === td.importName) {
@@ -61270,7 +61156,9 @@ const generateComponentTypesFile = (config, buildCtx, areTypesInternal) => {
       }
     })
       .join(`, `)} } from "${importFilePath}";`;
-  }));
+  });
+  // Write all import and export statements for event types
+  c.push(...expressions.map((ref) => `import ${ref}`), ...expressions.map((ref) => `export ${ref}`));
   c.push(`export namespace Components {`);
   c.push(...modules.map((m) => `${m.component}`));
   c.push(`}`);
@@ -61906,7 +61794,6 @@ const generateOutputTargets = async (config, compilerCtx, buildCtx) => {
   compilerCtx.changedModules.clear();
   invalidateRollupCaches(compilerCtx);
   await Promise.all([
-    outputAngular(config, compilerCtx, buildCtx),
     outputCopy(config, compilerCtx, buildCtx),
     outputCollection(config, compilerCtx, buildCtx, changedModuleFiles),
     outputCustomElements(config, compilerCtx, buildCtx),
@@ -62281,12 +62168,6 @@ const componentDecoratorToStatic = (config, typeChecker, diagnostics, cmpNode, n
   }
   styleToStatic(newMembers, componentOptions);
   const assetsDirs = componentOptions.assetsDirs || [];
-  if (isString$1(componentOptions.assetsDir)) {
-    assetsDirs.push(componentOptions.assetsDir);
-    const warn = buildWarn(diagnostics);
-    warn.messageText = `@Component option "assetsDir" should be renamed to "assetsDirs" and the value should be an array of strings.`;
-    augmentDiagnosticWithNode(warn, componentDecorator);
-  }
   if (assetsDirs.length > 0) {
     newMembers.push(createStaticGetter('assetsDirs', convertValueToLiteral(assetsDirs)));
   }
@@ -66207,7 +66088,7 @@ const createTsWatchProgram = async (config, buildCallback) => {
       return clearInterval(id);
     },
   };
-  config.sys.addDestory(() => tsWatchSys.clearTimeout(timeoutId));
+  config.sys.addDestroy(() => tsWatchSys.clearTimeout(timeoutId));
   const tsWatchHost = t.createWatchCompilerHost(config.tsconfig, optionsToExtend, tsWatchSys, t.createEmitAndSemanticDiagnosticsBuilderProgram, (reportDiagnostic) => {
     config.logger.debug('watch reportDiagnostic:' + reportDiagnostic.messageText);
   }, (reportWatchStatus) => {
@@ -66332,7 +66213,7 @@ const createWatchBuild = async (config, compilerCtx) => {
       watchingDirs.set(dirPath, config.sys.watchDirectory(dirPath, onDirChange, recursive));
     }
   };
-  config.sys.addDestory(close);
+  config.sys.addDestroy(close);
   return {
     start,
     close,
@@ -67691,7 +67572,7 @@ const createSysWorker = (config) => {
     config.maxConcurrentWorkers > 0 &&
     config.sys.hardwareConcurrency > 1) {
     const workerCtrl = config.sys.createWorkerController(config.maxConcurrentWorkers);
-    config.sys.addDestory(() => workerCtrl.destroy());
+    config.sys.addDestroy(() => workerCtrl.destroy());
     config.logger.debug(`create workers, maxWorkers: ${workerCtrl.maxWorkers}`);
     return createWorkerMainContext(workerCtrl);
   }
@@ -67949,32 +67830,6 @@ const getUserConfigName = (config, correctConfigName) => {
   return correctConfigName;
 };
 
-const validateAngular = (config, userOutputs) => {
-  const angularOutputTargets = userOutputs.filter(isOutputTargetAngular);
-  return angularOutputTargets.map((outputTarget) => {
-    let directivesProxyFile = outputTarget.directivesProxyFile;
-    if (directivesProxyFile && !isAbsolute$1(directivesProxyFile)) {
-      directivesProxyFile = join(config.rootDir, directivesProxyFile);
-    }
-    let directivesArrayFile = outputTarget.directivesArrayFile;
-    if (directivesArrayFile && !isAbsolute$1(directivesArrayFile)) {
-      directivesArrayFile = join(config.rootDir, directivesArrayFile);
-    }
-    let directivesUtilsFile = outputTarget.directivesUtilsFile;
-    if (directivesUtilsFile && !isAbsolute$1(directivesUtilsFile)) {
-      directivesUtilsFile = join(config.rootDir, directivesUtilsFile);
-    }
-    return {
-      type: 'angular',
-      componentCorePackage: outputTarget.componentCorePackage,
-      directivesProxyFile,
-      directivesArrayFile,
-      directivesUtilsFile,
-      excludeComponents: outputTarget.excludeComponents || [],
-    };
-  });
-};
-
 /**
  * Validate and return DIST_COLLECTION output targets, ensuring that the `dir`
  * property is set on them.
@@ -67994,6 +67849,29 @@ const validateCollection = (config, userOutputs) => {
   });
 };
 
+/**
+ * The collection of valid export behaviors.
+ * Used to generate a type for typed configs as well as output target validation
+ * for the `dist-custom-elements` output target.
+ *
+ * Adding a value to this const array will automatically add it as a valid option on the
+ * output target configuration for `customElementsExportBehavior`.
+ *
+ * - `default`: No additional export or definition behavior will happen.
+ * - `auto-define-custom-elements`: Enables the auto-definition of a component and its children (recursively) in the custom elements registry. This
+ * functionality allows consumers to bypass the explicit call to define a component, its children, its children's
+ * children, etc. Users of this flag should be aware that enabling this functionality may increase bundle size.
+ * - `bundle`: A `defineCustomElements` function will be exported from the distribution directory. This behavior was added to allow easy migration
+ * from `dist-custom-elements-bundle` to `dist-custom-elements`.
+ * - `single-export-module`: All components will be re-exported from the specified directory's root `index.js` file.
+ */
+const CustomElementsExportBehaviorOptions = [
+  'default',
+  'auto-define-custom-elements',
+  'bundle',
+  'single-export-module',
+];
+
 /**
  * Validate a series of {@link d.CopyTask}s
  * @param copy the copy tasks to validate, or a boolean to specify if copy tasks are enabled
@@ -68037,6 +67915,15 @@ const validateCustomElement = (config, userOutputs) => {
     if (!isBoolean$1(outputTarget.externalRuntime)) {
       outputTarget.externalRuntime = true;
     }
+    if (!isBoolean$1(outputTarget.generateTypeDeclarations)) {
+      outputTarget.generateTypeDeclarations = true;
+    }
+    // Export behavior must be defined on the validated target config and must
+    // be one of the export behavior valid values
+    if (outputTarget.customElementsExportBehavior == null ||
+      !CustomElementsExportBehaviorOptions.includes(outputTarget.customElementsExportBehavior)) {
+      outputTarget.customElementsExportBehavior = 'default';
+    }
     // unlike other output targets, Rindo does not allow users to define the output location of types at this time
     if (outputTarget.generateTypeDeclarations) {
       const typesDirectory = getAbsolutePath(config, join(defaultDir, 'types'));
@@ -68059,6 +67946,7 @@ const validateCustomElement = (config, userOutputs) => {
   }, []);
 };
 
+// TODO: fully delete dist-custom-elements-bundle code
 const validateCustomElementBundle = (config, userOutputs) => {
   return userOutputs.filter(isOutputTargetDistCustomElementsBundle).reduce((arr, o) => {
     const outputTarget = {
@@ -68581,11 +68469,6 @@ const validateOutputTargets = (config, diagnostics) => {
       const err = buildError(diagnostics);
       err.messageText = `Invalid outputTarget type "${outputTarget.type}". Valid outputTarget types include: ${VALID_CONFIG_OUTPUT_TARGETS.map((t) => `"${t}"`).join(', ')}`;
     }
-    else if (outputTarget.type === DIST_CUSTOM_ELEMENTS_BUNDLE) {
-      // TODO: Remove this check when the 'dist-custom-elements-bundle' is removed
-      const warning = buildWarn(diagnostics);
-      warning.messageText = `dist-custom-elements-bundle is deprecated and will be removed in a future major version release. Use "dist-custom-elements" instead.`;
-    }
   });
   config.outputTargets = [
     ...validateCollection(config, userOutputs),
@@ -68596,7 +68479,6 @@ const validateOutputTargets = (config, diagnostics) => {
     ...validateWww(config, diagnostics, userOutputs),
     ...validateDist(config, userOutputs),
     ...validateDocs(config, diagnostics, userOutputs),
-    ...validateAngular(config, userOutputs),
     ...validateStats(config, userOutputs),
   ];
   // hydrate also gets info from the www output
@@ -69188,7 +69070,7 @@ const validateConfig = (userConfig = {}, bootstrapConfig) => {
     validatedConfig.buildEs5 === true || (!validatedConfig.devMode && validatedConfig.buildEs5 === 'prod');
   setBooleanConfig(validatedConfig, 'minifyCss', null, !validatedConfig.devMode);
   setBooleanConfig(validatedConfig, 'minifyJs', null, !validatedConfig.devMode);
-  setBooleanConfig(validatedConfig, 'sourceMap', null, typeof validatedConfig.sourceMap === 'undefined' ? false : validatedConfig.sourceMap);
+  setBooleanConfig(validatedConfig, 'sourceMap', null, typeof validatedConfig.sourceMap === 'undefined' ? true : validatedConfig.sourceMap);
   setBooleanConfig(validatedConfig, 'watch', 'watch', false);
   setBooleanConfig(validatedConfig, 'buildDocs', 'docs', !validatedConfig.devMode);
   setBooleanConfig(validatedConfig, 'buildDist', 'esm', !validatedConfig.devMode || validatedConfig.buildEs5);
@@ -70091,7 +69973,7 @@ const getComponentPathContent = (componentGraph, outputTarget) => {
 const dependencies = [
 	{
 		name: "@rindo/core",
-		version: "2.22.3",
+		version: "3.0.0-alpha.0",
 		main: "compiler/rindo.js",
 		resources: [
 			"package.json",