perf: remove recursion

Author: arjunkdot

CONTRIBUTING.md

@@ -0,0 +1,85 @@
+# Contributing to Hexashades
+
+First off, thank you for considering contributing to Hexashades! I welcome contributions from everyone, whether you're fixing a typo or submitting a major feature. To make the contribution process smooth and consistent, I ask that you follow these guidelines.
+
+## Table of Contents
+
+- [Code of Conduct](#code-of-conduct)
+- [How to Contribute](#how-to-contribute)
+  - [Reporting Bugs](#reporting-bugs)
+  - [Suggesting Enhancements](#suggesting-enhancements)
+  - [Submitting a Pull Request](#submitting-a-pull-request)
+- [Development Setup](#development-setup)
+- [Commit Message Guidelines](#commit-message-guidelines)
+- [License](#license)
+
+## Code of Conduct
+
+By participating in this project, you agree to follow the [Code of Conduct](CODE_OF_CONDUCT.md). Please read it to ensure a positive experience for everyone.
+
+## How to Contribute
+
+### Reporting Bugs
+
+If you find a bug in the project, please help by reporting it:
+
+1. Check the issue tracker to see if the bug has already been reported.
+2. If not, open a new issue with a detailed description of the problem, including steps to reproduce it, your environment (OS, Node.js version, etc.), and any relevant logs or error messages.
+
+### Suggesting Enhancements
+
+If you have an idea for a new feature or improvement:
+
+1. Check if the feature has already been suggested.
+2. If not, open a new issue with a clear description of the enhancement and why it would be useful. I love hearing your ideas!
+
+### Submitting a Pull Request
+
+I appreciate your contributions! To submit a pull request (PR), follow these steps:
+
+1. Fork the repository and create a new branch for your changes.
+2. Write clear, concise commit messages that explain your changes.
+3. Ensure that your code adheres to the project's coding style and passes any existing tests.
+4. If applicable, write tests for your changes and make sure they pass.
+5. Open a pull request against the main branch (usually `main` or `master`).
+
+I will review your PR and provide feedback. Be prepared to make revisions if necessary.
+
+## Development Setup
+
+To set up the project for local development, follow these steps:
+
+1.  Clone the repository:
+
+    ```bash
+    git clone https://github.com/arjunkdot/hexashades.git
+    ```
+
+2.  Install the dependencies:
+
+    ```bash
+    npm install
+    ```
+
+    or
+
+    ```bash
+    pnpm install
+    ```
+
+    Make sure to follow any additional setup instructions in the README.md if applicable.
+
+## Commit Message Guidelines
+
+I follow a simple convention for commit messages:
+
+- Use the present tense: "Add feature" not "Added feature."
+- Use a short, descriptive message (50 characters or less).
+- If the change is related to an issue, reference the issue number using #.
+
+## Example
+
+Please refer to [Conventional Commits](https://www.conventionalcommits.org/) for more details.
+
+License
+By contributing to this project, you agree that your contributions will be licensed under the [MIT License](LICENSE).

src/index.ts

@@ -5,15 +5,11 @@ type RgbType = {
 };
 
 export class Colors {
-    result: string[];
-    limit: number;
-    prefix: boolean;
+    result: string[] = [];
+    limit: number = 0;
+    prefix: boolean = false;
 
-    constructor() {
-        this.result = [];
-        this.limit = 0;
-        this.prefix = false;
-    }
+    constructor() { }
 
     #hex2Rgb(hex: string) {
         const sections = this.#hex2Groups(hex);
@@ -51,23 +47,28 @@ export class Colors {
     }
 
     #padHex(color: string) {
-        return `${color[0].padStart(2, color[0])}${color[1].padStart(2, color[1])}${color[2].padStart(2, color[2])}`;
+        return `${color.padStart(6, color[0])}`
     }
 
-    #generateShades(rgb: RgbType, percentage: number) {
-        const rgbShade = {
-            red: this.#getShade(rgb.red, this.limit),
-            green: this.#getShade(rgb.green, this.limit),
-            blue: this.#getShade(rgb.blue, this.limit),
-        };
-        const hex = this.#rgb2hex(rgbShade);
-        this.result.push(`${this.prefix ? '#' + hex : hex}`);
-        this.limit += percentage;
-        if (this.limit >= 100) {
-            return;
+    #generate(rgb: RgbType, percentage: number, type: 'shades' | 'tints') {
+        const color: RgbType = { red: 0, green: 0, blue: 0 };
+
+        if (type === 'shades') {
+            color.red = this.#getShade(rgb.red, this.limit);
+            color.green = this.#getShade(rgb.green, this.limit);
+            color.blue = this.#getShade(rgb.blue, this.limit);
+        } else {
+            color.red = this.#getTint(rgb.red, this.limit);
+            color.green = this.#getTint(rgb.green, this.limit);
+            color.blue = this.#getTint(rgb.blue, this.limit);
+        }
+
+        while (this.limit < 100) {
+            const hex = this.#rgb2hex(color);
+            this.result.push(`${this.prefix ? '#' + hex : hex}`);
+            this.limit += percentage;
         }
 
-        this.#generateShades(rgb, percentage);
     }
 
     #getTint(color: number, percentage: number) {
@@ -76,21 +77,6 @@ export class Colors {
         return (tint > 255) ? 255 : tint;
     }
 
-    #generateTints(rgb: RgbType, percentage: number) {
-        this.limit += percentage;
-        const rgbTint = {
-            red: this.#getTint(rgb.red, this.limit),
-            green: this.#getTint(rgb.green, this.limit),
-            blue: this.#getTint(rgb.blue, this.limit),
-        };
-        const hex = this.#rgb2hex(rgbTint);
-        this.result.push(`${this.prefix ? '#' + hex : hex}`);
-        if (this.limit >= 100) {
-            return;
-        }
-        this.#generateTints(rgb, percentage);
-    }
-
     createColors(color: string, percentage: number, prefix: boolean = false) {
         // Check if the input exists
         if (!color || !percentage) {
@@ -100,14 +86,10 @@ export class Colors {
         if (typeof color !== 'string' || typeof percentage !== 'number' || typeof prefix !== 'boolean') {
             throw new Error('Invalid input. Wrong input types are given.');
         }
-        // Check if the percentage is valid
-        if (percentage < 0 || percentage > 100) {
-            throw new Error('Invalid input. Invalid percentage value is given.')
-        }
-        // Check if HEX is valid
-        if (color.length !== 3 && color.length !== 6) {
-            throw new Error("Invalid input. Not a valid length.");
+        if (color.length !== 3 && color.length !== 6 || percentage < 0 || percentage > 100) {
+            throw new Error('Invalid input. Wrong input values are given.');
         }
+
         // Pad the HEX string if it has only 3 characters
         if (color.length === 3) {
             color = this.#padHex(color);
@@ -118,15 +100,16 @@ export class Colors {
 
         const rgb = this.#hex2Rgb(color);
         // Generate Tints
-        this.#generateTints(rgb, percentage);
+        this.#generate(rgb, percentage, 'tints');
         // Reset Limit
         this.limit = 0;
         // Generate Shades
-        this.#generateShades(rgb, percentage);
+        this.#generate(rgb, percentage, 'shades');
 
         // Arrange colors in ascending order
-        const tints = this.result.slice(0, this.result.length / 2).reverse();
-        const shades = this.result.slice(this.result.length / 2, this.result.length).reverse();
+        const mid = this.result.length / 2
+        const tints = this.result.slice(0, mid).reverse();
+        const shades = this.result.slice(mid).reverse();
         shades.unshift(`${this.prefix ? '#' + color : color}`);
 
         // Reset global variables

tests/outputs/errors.test.ts

@@ -17,28 +17,28 @@ describe("throws an error", () => {
 
   test("for invalid input length", () => {
     expect(() => ctx.createColors("66", 10)).toThrow(
-      "Invalid input. Not a valid length."
+      "Invalid input. Wrong input values are given."
     );
     expect(() => ctx.createColors("6", 10)).toThrow(
-      "Invalid input. Not a valid length."
+      "Invalid input. Wrong input values are given."
     );
     expect(() => ctx.createColors("6666", 10)).toThrow(
-      "Invalid input. Not a valid length."
+      "Invalid input. Wrong input values are given."
     );
     expect(() => ctx.createColors("66666", 10)).toThrow(
-      "Invalid input. Not a valid length."
+      "Invalid input. Wrong input values are given."
     );
     expect(() => ctx.createColors("6666666", 10)).toThrow(
-      "Invalid input. Not a valid length."
+      "Invalid input. Wrong input values are given."
     );
   });
 
   test("for invalid percentage value", () => {
     expect(() => ctx.createColors("66", -10)).toThrow(
-      "Invalid input. Invalid percentage value is given."
+      "Invalid input. Wrong input values are given."
     );
     expect(() => ctx.createColors("66", 110)).toThrow(
-      "Invalid input. Invalid percentage value is given."
+      "Invalid input. Wrong input values are given."
     );
   });