perf(core): use for...of

biome recommandation: use for...of instead of forEach

Closes #11

packages/core/biome.jsonc

@@ -12,9 +12,6 @@
         "noAssignInExpressions": "off",
         "noConfusingVoidType": "off"
       },
-      "complexity": {
-        "noForEach": "warn" // Should be error before v1 for increase the performance
-      },
       "correctness": {
         "useJsxKeyInIterable": "off" // Stencil generate jsx key for us
       },

packages/core/plugins/api-spec-generator.ts

@@ -17,7 +17,9 @@ export function apiSpecGenerator(opts: ApiSpecOption): OutputTargetDocsCustom {
     type: 'docs-custom',
     generator: docsData => {
       const content: string[] = [];
-      docsData.components.forEach(cmp => generateComponent(cmp, content));
+      for (const component of docsData.components) {
+        generateComponent(component, content);
+      }
 
       const contentStr = content.join('\n');
       return new Promise(resolve => {
@@ -33,21 +35,21 @@ function generateComponent(component: JsonDocsComponent, content: string[]) {
   content.push('');
   content.push(`${component.tag},${component.encapsulation}`);
 
-  component.props.forEach(prop => {
+  for (const prop of component.props) {
     content.push(
       `${component.tag},prop,${prop.name},${prop.type},${prop.default},${prop.required},${prop.reflectToAttr}`,
     );
-  });
-  component.methods.forEach(prop => {
-    content.push(`${component.tag},method,${prop.name},${prop.signature}`);
-  });
-  component.events.forEach(prop => {
-    content.push(`${component.tag},event,${prop.event},${prop.detail},${prop.bubbles}`);
-  });
-  component.styles.forEach(prop => {
-    content.push(`${component.tag},css-prop,${prop.name}`);
-  });
-  component.parts.forEach(part => {
+  }
+  for (const method of component.methods) {
+    content.push(`${component.tag},method,${method.name},${method.signature}`);
+  }
+  for (const event of component.events) {
+    content.push(`${component.tag},event,${event.event},${event.detail},${event.bubbles}`);
+  }
+  for (const style of component.styles) {
+    content.push(`${component.tag},css-prop,${style.name}`);
+  }
+  for (const part of component.parts) {
     content.push(`${component.tag},part,${part.name}`);
-  });
+  }
 }

packages/core/src/components/accordion-group/accordion-group.tsx

@@ -66,10 +66,10 @@ export class AccordionGroup implements ComponentInterface {
   }
 
   componentDidLoad(): void {
-    this.accordions.forEach(accordion => {
+    for (const accordion of this.accordions) {
       if (this.readonly) accordion.readonly = this.readonly;
       if (this.disabled) accordion.disabled = this.disabled;
-    });
+    }
     this.applyOpen();
   }
 

packages/core/src/components/input-file/input-file.tsx

@@ -184,6 +184,7 @@ export class InputFile implements ComponentInterface {
   componentDidLoad(): void {
     const { value } = this;
     const files = Array.isArray(value) ? value : [value];
+
     files.forEach((file, idx) => (this.nativeInput.files[idx] = file));
   }
 

packages/core/src/components/radio-group/radio-group.tsx

@@ -139,32 +139,24 @@ export class RadioGroup implements ComponentInterface {
   }
 
   componentDidLoad(): void {
-    this.radios.forEach(radio => {
+    for (const radio of this.radios) {
       radio.name = this.name;
-      if (this.required) radio.required = this.required;
-      if (this.disabled) radio.disabled = this.disabled;
-    });
-    this.applyColor();
-    this.applySize();
-    this.applyCheck();
-  }
 
-  private applyColor(): void {
-    if (!this.color) return;
-    this.radios
-      .filter(radio => !radio.color)
-      .forEach(radio => {
+      if (this.required) {
+        radio.required = this.required;
+      }
+      if (this.disabled) {
+        radio.disabled = this.disabled;
+      }
+      if (this.color) {
         radio.color = this.color;
-      });
-  }
-
-  private applySize(): void {
-    if (!this.size) return;
-    this.radios
-      .filter(radio => !radio.size)
-      .forEach(radio => {
+      }
+      if (this.size) {
         radio.size = this.size;
-      });
+      }
+    }
+
+    this.applyCheck();
   }
 
   private applyCheck(): void {

packages/core/src/config/components.config.ts

@@ -21,7 +21,9 @@ export class ComponentConfig {
     const component = this.get(tag);
     const uniqueKeys = new Set([...Object.keys(component), ...Object.keys(defaultValue)]);
 
-    [...uniqueKeys].forEach(key => (ref[key] ??= component[key] ?? defaultValue[key]));
+    for (const key of uniqueKeys) {
+      ref[key] ??= component[key] ?? defaultValue[key];
+    }
   }
 
   setProp<Tag extends keyof Options, Prop extends keyof Options[Tag]>(

packages/core/src/utils/click-outside.ts

@@ -54,15 +54,15 @@ export function registerClickOutside(
   opt: ClickOutsideOptions = ClickOutsideOptionsDefaults,
 ): void {
   const excludedNodes = getExcludedNodes(opt);
-  getTriggerEvents(opt).forEach(triggerEvent => {
+  for (const triggerEvent of getTriggerEvents(opt)) {
     window.addEventListener(
       triggerEvent,
       (e: Event) => {
         initClickOutside(e, component, element, callback, excludedNodes);
       },
       false,
     );
-  });
+  }
 }
 
 /**
@@ -74,15 +74,15 @@ export function removeClickOutside(
   callback: () => void,
   opt: ClickOutsideOptions = ClickOutsideOptionsDefaults,
 ): void {
-  getTriggerEvents(opt).forEach(triggerEvent => {
+  for (const triggerEvent of getTriggerEvents(opt)) {
     window.removeEventListener(
       triggerEvent,
       (e: Event) => {
         initClickOutside(e, component, element, callback);
       },
       false,
     );
-  });
+  }
 }
 
 function initClickOutside(

packages/core/src/utils/helpers.ts

@@ -17,15 +17,17 @@ export type Attributes = { [key: string]: any };
 export const inheritAttributes = (el: HTMLElement, attributes: string[] = []) => {
   const attributeObject: Attributes = {};
 
-  attributes.forEach(attr => {
-    if (el.hasAttribute(attr)) {
-      const value = el.getAttribute(attr);
-      if (value !== null) {
-        attributeObject[attr] = el.getAttribute(attr);
-      }
-      el.removeAttribute(attr);
+  for (const attr of attributes) {
+    if (!el.hasAttribute(attr)) {
+      continue;
     }
-  });
+
+    const value = el.getAttribute(attr);
+    if (value !== null) {
+      attributeObject[attr] = el.getAttribute(attr);
+    }
+    el.removeAttribute(attr);
+  }
 
   return attributeObject;
 };