refactor: run formatter

Author: dmitry-stepanenko

packages/qwik-angular/src/index.qwik.ts

@@ -1,3 +1,7 @@
 export { qwikify$, qwikifyQrl } from './lib/qwikify';
 
-export type { QwikifyProps, QwikifiedComponentProps, WithRequiredProps } from './lib/types';
+export type {
+  QwikifyProps,
+  QwikifiedComponentProps,
+  WithRequiredProps,
+} from './lib/types';

packages/qwik-angular/src/index.ts

@@ -1 +1 @@
-export * from './index.qwik';
+export * from './index.qwik';

packages/qwik-angular/src/lib/client.ts

@@ -33,9 +33,16 @@ export class ClientRenderer {
 
   private initialized = false;
 
-  constructor(private component: Type<unknown>, private initialProps: Record<string, unknown>) {}
-
-  async render(hostElement: Element, slot: Element | undefined, props = this.initialProps) {
+  constructor(
+    private component: Type<unknown>,
+    private initialProps: Record<string, unknown>
+  ) {}
+
+  async render(
+    hostElement: Element,
+    slot: Element | undefined,
+    props = this.initialProps
+  ) {
     await this.loadZoneJs();
     try {
       this.appRef = await createApplication({
@@ -51,7 +58,10 @@ export class ClientRenderer {
       this.mirror = reflectComponentType(this.component);
 
       const projectableNodes =
-        slot && extractProjectableNodes(slot, [...(this.mirror?.ngContentSelectors ?? [])]);
+        slot &&
+        extractProjectableNodes(slot, [
+          ...(this.mirror?.ngContentSelectors ?? []),
+        ]);
 
       this.componentRef = createComponent(this.component, {
         environmentInjector: this.appRef!.injector,
@@ -109,10 +119,16 @@ export class ClientRenderer {
       return;
     }
 
-    const eventEmitters = this.mirror.outputs.map(({ propName, templateName }) => {
-      const emitter = (this.componentRef.instance as any)[propName] as EventEmitter<any>;
-      return emitter.pipe(map((value: any) => ({ name: templateName, value })));
-    });
+    const eventEmitters = this.mirror.outputs.map(
+      ({ propName, templateName }) => {
+        const emitter = (this.componentRef.instance as any)[
+          propName
+        ] as EventEmitter<any>;
+        return emitter.pipe(
+          map((value: any) => ({ name: templateName, value }))
+        );
+      }
+    );
     const outputEvents = merge(...eventEmitters);
     // listen for events from the merged stream and dispatch them as custom events
     outputEvents.pipe(takeUntil(this.onDestroy$)).subscribe((e) => {

packages/qwik-angular/src/lib/extract-projectable-nodes.ts

@@ -1,7 +1,10 @@
 // source: https://github.com/angular/angular/blob/d1ea1f4c7f3358b730b0d94e65b00bc28cae279c/packages/elements/src/extract-projectable-nodes.ts
 // this util is not exposed from the Angular package, thus copying it here
 
-export function extractProjectableNodes(host: Element, ngContentSelectors: string[]): Node[][] {
+export function extractProjectableNodes(
+  host: Element,
+  ngContentSelectors: string[]
+): Node[][] {
   const nodes = host.childNodes;
   const projectableNodes: Node[][] = ngContentSelectors.map(() => []);
   let wildcardIndex = -1;
@@ -16,7 +19,11 @@ export function extractProjectableNodes(host: Element, ngContentSelectors: strin
 
   for (let i = 0, ii = nodes.length; i < ii; ++i) {
     const node = nodes[i];
-    const ngContentIndex = findMatchingIndex(node, ngContentSelectors, wildcardIndex);
+    const ngContentIndex = findMatchingIndex(
+      node,
+      ngContentSelectors,
+      wildcardIndex
+    );
 
     if (ngContentIndex !== -1) {
       projectableNodes[ngContentIndex].push(node);
@@ -26,7 +33,11 @@ export function extractProjectableNodes(host: Element, ngContentSelectors: strin
   return projectableNodes;
 }
 
-function findMatchingIndex(node: Node, selectors: string[], defaultIndex: number): number {
+function findMatchingIndex(
+  node: Node,
+  selectors: string[],
+  defaultIndex: number
+): number {
   let matchingIndex = defaultIndex;
 
   if (isElement(node)) {
@@ -62,7 +73,9 @@ function matchesSelector(el: any, selector: string): boolean {
       elProto.oMatchesSelector ||
       elProto.webkitMatchesSelector;
   }
-  return el.nodeType === Node.ELEMENT_NODE ? _matches.call(el, selector) : false;
+  return el.nodeType === Node.ELEMENT_NODE
+    ? _matches.call(el, selector)
+    : false;
 }
 
 /**

packages/qwik-angular/src/lib/qwikify.tsx

@@ -83,7 +83,11 @@ export function qwikifyQrl<PROPS extends {}>(
               hostRef.value = el;
               if (isBrowser && internalState.value) {
                 internalState.value.renderer &&
-                  (await internalState.value.renderer.render(el, slotRef.value, props));
+                  (await internalState.value.renderer.render(
+                    el,
+                    slotRef.value,
+                    props
+                  ));
               }
             });
           }}

packages/qwik-angular/src/lib/server.tsx

@@ -34,11 +34,18 @@ const create = ɵRender3ComponentFactory.prototype.create;
   environmentInjector?: any
 ) {
   if (projectableNodesMap.has(this.componentType)) {
-    const document_local: typeof document = this['ngModule'].injector.get(DOCUMENT);
+    const document_local: typeof document =
+      this['ngModule'].injector.get(DOCUMENT);
     const slotComment = document_local.createComment(SLOT_MARK);
     projectableNodes = [[slotComment]]; // TODO: support multiple ng-content
   }
-  return create.call(this, injector, projectableNodes, rootSelectorOrNode, environmentInjector);
+  return create.call(
+    this,
+    injector,
+    projectableNodes,
+    rootSelectorOrNode,
+    environmentInjector
+  );
 };
 
 const QWIK_ANGULAR_STATIC_PROPS = new InjectionToken<{
@@ -73,7 +80,8 @@ const STATIC_PROPS_HOOK_PROVIDER: Provider = {
             // because there might be additional props
             // that aren't actually Input defined on the Component
             mirror.inputs.some(
-              ({ templateName, propName }) => templateName === key || propName === key
+              ({ templateName, propName }) =>
+                templateName === key || propName === key
             )
           ) {
             compRef.setInput(key, value);

packages/qwik-angular/src/lib/slot.ts

@@ -1,4 +1,6 @@
-export const getHostProps = (props: Record<string, any>): Record<string, any> => {
+export const getHostProps = (
+  props: Record<string, any>
+): Record<string, any> => {
   const obj: Record<string, any> = {};
   Object.keys(props).forEach((key) => {
     if (key.startsWith(HOST_PREFIX)) {
@@ -8,7 +10,9 @@ export const getHostProps = (props: Record<string, any>): Record<string, any> =>
   return obj;
 };
 
-export const getAngularProps = (props: Record<string, any>): Record<string, any> => {
+export const getAngularProps = (
+  props: Record<string, any>
+): Record<string, any> => {
   const obj: Record<string, any> = {};
   Object.keys(props).forEach((key) => {
     if (!key.startsWith('client:') && !key.startsWith(HOST_PREFIX)) {

packages/qwik-angular/src/lib/types.ts

@@ -77,7 +77,8 @@ export interface QwikifyBase {
   'host:onMouseOver$'?: PropFunction<(ev: Event) => void>;
 }
 
-export type QwikifyProps<PROPS extends Record<string, any>> = PROPS & QwikifyBase;
+export type QwikifyProps<PROPS extends Record<string, any>> = PROPS &
+  QwikifyBase;
 
 export interface QwikifyOptions {
   tagName?: string;
@@ -89,9 +90,10 @@ export interface QwikifyOptions {
 type TransformKey<K> = K extends string ? `${K}$` : K;
 
 type QwikifiedOutputs<ComponentType, Props extends keyof ComponentType> = {
-  [K in keyof Pick<ComponentType, Props> as TransformKey<K>]: ComponentType[K] extends EventEmitter<
-    infer V
-  >
+  [K in keyof Pick<
+    ComponentType,
+    Props
+  > as TransformKey<K>]: ComponentType[K] extends EventEmitter<infer V>
     ? (value: V) => void
     : never;
 };
@@ -145,7 +147,9 @@ export type QwikifiedComponentProps<
   ComponentType,
   Inputs extends keyof ComponentType = never,
   Outputs extends keyof ComponentType = never
-> = Partial<Pick<ComponentType, Inputs> & QwikifiedOutputs<ComponentType, Outputs>>;
+> = Partial<
+  Pick<ComponentType, Inputs> & QwikifiedOutputs<ComponentType, Outputs>
+>;
 
 /**
  * Marks provided keys `K` of type `T` as required
@@ -167,4 +171,5 @@ export type QwikifiedComponentProps<
  * }
  * ```
  */
-export type WithRequiredProps<T, K extends keyof T> = Omit<T, K> & Required<Pick<T, K>>;
+export type WithRequiredProps<T, K extends keyof T> = Omit<T, K> &
+  Required<Pick<T, K>>;

packages/qwik-angular/src/lib/vite-plugin/vite.ts

@@ -49,25 +49,31 @@ function analogQwikPlugin(options: PluginOptions) {
       return {
         optimizeDeps: {
           include: [
-            "@angular/core",
-            "@angular/platform-browser",
-            "@angular/platform-browser/animations",
-            "@angular/compiler",
-            "@angular/common",
-            "@angular/animations",
-            "@angular/animations/browser",
+            '@angular/core',
+            '@angular/platform-browser',
+            '@angular/platform-browser/animations',
+            '@angular/compiler',
+            '@angular/common',
+            '@angular/animations',
+            '@angular/animations/browser',
           ],
           exclude: ['@angular/platform-server'],
         },
       };
     },
 
     load: function (id) {
-      if (viteCommand === 'serve' && bundleSassFilePaths?.some((p) => id.includes(p))) {
+      if (
+        viteCommand === 'serve' &&
+        bundleSassFilePaths?.some((p) => id.includes(p))
+      ) {
         // TODO: normalize path
         id = id.replace(/\?(.*)/, '');
         try {
-          const compiledAsset = compile(id, options.bundleSassFilesInDevMode?.compileOptions).css;
+          const compiledAsset = compile(
+            id,
+            options.bundleSassFilesInDevMode?.compileOptions
+          ).css;
           return compiledAsset;
         } catch (e) {
           // if failed to compile, do nothing

packages/qwik-angular/src/lib/wake-up-signal.ts

@@ -2,7 +2,10 @@ import { $, useOn, useOnDocument, useSignal } from '@builder.io/qwik';
 import { isServer } from '@builder.io/qwik/build';
 import type { QwikifyOptions, QwikifyProps } from './types';
 
-export const useWakeupSignal = (props: QwikifyProps<{}>, opts: QwikifyOptions = {}) => {
+export const useWakeupSignal = (
+  props: QwikifyProps<{}>,
+  opts: QwikifyOptions = {}
+) => {
   const signal = useSignal(false);
   const activate = $(() => (signal.value = true));
   const clientOnly = !!(props['client:only'] || opts?.clientOnly);