pixel-react 1.6.8 → 1.6.9

package/src/utils/compareObjects/compareObjects.ts

@@ -1,53 +1,53 @@
-// Define a type for any object
-export type AnyObject = Record<string, unknown>;
-
-export const compareObjects = (
-  obj1: AnyObject | null,
-  obj2: AnyObject | null
-): boolean => {
-  // Check if both are strictly equal (handles primitive types and same reference)
-  if (obj1 === obj2) return true;
-
-  // Check if either is null or not an object
-  if (
-    obj1 == null ||
-    obj2 == null ||
-    typeof obj1 !== 'object' ||
-    typeof obj2 !== 'object'
-  ) {
-    return false;
-  }
-
-  // Handle array comparison
-  const isArray1 = Array.isArray(obj1);
-  const isArray2 = Array.isArray(obj2);
-  if (isArray1 !== isArray2) return false; // One is an array, the other is not
-
-  // Create arrays of keys for both objects
-  const keys1 = isArray1 ? obj1 : Object.keys(obj1);
-  const keys2 = isArray2 ? obj2 : Object.keys(obj2);
-
-  // Check if the number of keys is different
-  if (keys1.length !== keys2.length) return false;
-
-  // Create a Set for keys2 for O(1) lookups (only for objects)
-  if (!isArray1) {
-    const keysSet2 = new Set<string>(keys2 as string[]);
-
-    // Check each key and value
-    return keys1.every((key) => {
-      return (
-        keysSet2.has(key) &&
-        compareObjects(
-          obj1[key] as AnyObject | null,
-          obj2[key] as AnyObject | null
-        )
-      );
-    });
-  } else {
-    // If arrays, compare elements directly
-    return keys1.every((item, index) =>
-      compareObjects(item as AnyObject | null, keys2[index] as AnyObject | null)
-    );
-  }
-};
+// Define a type for any object
+export type AnyObject = Record<string, unknown>;
+
+export const compareObjects = (
+  obj1: AnyObject | null,
+  obj2: AnyObject | null
+): boolean => {
+  // Check if both are strictly equal (handles primitive types and same reference)
+  if (obj1 === obj2) return true;
+
+  // Check if either is null or not an object
+  if (
+    obj1 == null ||
+    obj2 == null ||
+    typeof obj1 !== 'object' ||
+    typeof obj2 !== 'object'
+  ) {
+    return false;
+  }
+
+  // Handle array comparison
+  const isArray1 = Array.isArray(obj1);
+  const isArray2 = Array.isArray(obj2);
+  if (isArray1 !== isArray2) return false; // One is an array, the other is not
+
+  // Create arrays of keys for both objects
+  const keys1 = isArray1 ? obj1 : Object.keys(obj1);
+  const keys2 = isArray2 ? obj2 : Object.keys(obj2);
+
+  // Check if the number of keys is different
+  if (keys1.length !== keys2.length) return false;
+
+  // Create a Set for keys2 for O(1) lookups (only for objects)
+  if (!isArray1) {
+    const keysSet2 = new Set<string>(keys2 as string[]);
+
+    // Check each key and value
+    return keys1.every((key) => {
+      return (
+        keysSet2.has(key) &&
+        compareObjects(
+          obj1[key] as AnyObject | null,
+          obj2[key] as AnyObject | null
+        )
+      );
+    });
+  } else {
+    // If arrays, compare elements directly
+    return keys1.every((item, index) =>
+      compareObjects(item as AnyObject | null, keys2[index] as AnyObject | null)
+    );
+  }
+};

package/src/utils/debounce/debounce.stories.tsx

@@ -1,81 +1,81 @@
-import { debounce } from './debounce'; // Adjust the import path as necessary
-
-export default {
-  title: 'Utils/debounce',
-  component: debounce,
-};
-
-export const Default = () => {
-  const testCases = [
-    {
-      description: 'Basic function call',
-      expectedOutput: 'Function called! (after delay)',
-      delay: 300,
-      setup: () => {
-        const debouncedFunc = debounce(
-          () => console.log('Function called!'),
-          300
-        );
-        debouncedFunc(); // Call the debounced function
-      },
-      code: `const debouncedFunc = debounce(() => console.log('Function called!'), 300);\ndebouncedFunc();`,
-    },
-    {
-      description: 'Rapid calls within delay',
-      expectedOutput: 'Debounced call! (only once after delay)',
-      delay: 500,
-      setup: () => {
-        const debouncedFunc = debounce(
-          () => console.log('Debounced call!'),
-          500
-        );
-        for (let i = 0; i < 5; i++) {
-          debouncedFunc(); // Call the debounced function multiple times
-        }
-      },
-      code: `const debouncedFunc = debounce(() => console.log('Debounced call!'), 500);\nfor (let i = 0; i < 5; i++) {\n  debouncedFunc();\n}`,
-    },
-    {
-      description: 'Cancel debounced function',
-      expectedOutput: 'Function should not be called if canceled',
-      delay: 200,
-      setup: () => {
-        const debouncedFunc = debounce(
-          () => console.log('Should not be called!'),
-          200
-        );
-        debouncedFunc(); // Call the debounced function
-        debouncedFunc.cancel(); // Cancel the function
-      },
-      code: `const debouncedFunc = debounce(() => console.log('Should not be called!'), 200);\ndebouncedFunc();\ndebouncedFunc.cancel();`,
-    },
-  ];
-
-  return (
-    <div>
-      <h1>
-        <u>debounce(function, delay)</u> - Demonstrating debounce functionality
-      </h1>
-      {testCases.map(
-        ({ description, expectedOutput, delay, setup, code }, index) => (
-          <div key={index}>
-            <h3>{description}</h3>
-            <button
-              onClick={() => {
-                setup(); // Run the setup for the test case
-                setTimeout(() => {
-                  console.log(expectedOutput);
-                }, delay + 100); // Wait a bit longer than the delay to check output
-              }}
-            >
-              Run Test
-            </button>
-            <pre>
-              <code>{code}</code>
-            </pre>
-          </div>
-        )
-      )}
-    </div>
-  );
-};
+import { debounce } from './debounce'; // Adjust the import path as necessary
+
+export default {
+  title: 'Utils/debounce',
+  component: debounce,
+};
+
+export const Default = () => {
+  const testCases = [
+    {
+      description: 'Basic function call',
+      expectedOutput: 'Function called! (after delay)',
+      delay: 300,
+      setup: () => {
+        const debouncedFunc = debounce(
+          () => console.log('Function called!'),
+          300
+        );
+        debouncedFunc(); // Call the debounced function
+      },
+      code: `const debouncedFunc = debounce(() => console.log('Function called!'), 300);\ndebouncedFunc();`,
+    },
+    {
+      description: 'Rapid calls within delay',
+      expectedOutput: 'Debounced call! (only once after delay)',
+      delay: 500,
+      setup: () => {
+        const debouncedFunc = debounce(
+          () => console.log('Debounced call!'),
+          500
+        );
+        for (let i = 0; i < 5; i++) {
+          debouncedFunc(); // Call the debounced function multiple times
+        }
+      },
+      code: `const debouncedFunc = debounce(() => console.log('Debounced call!'), 500);\nfor (let i = 0; i < 5; i++) {\n  debouncedFunc();\n}`,
+    },
+    {
+      description: 'Cancel debounced function',
+      expectedOutput: 'Function should not be called if canceled',
+      delay: 200,
+      setup: () => {
+        const debouncedFunc = debounce(
+          () => console.log('Should not be called!'),
+          200
+        );
+        debouncedFunc(); // Call the debounced function
+        debouncedFunc.cancel(); // Cancel the function
+      },
+      code: `const debouncedFunc = debounce(() => console.log('Should not be called!'), 200);\ndebouncedFunc();\ndebouncedFunc.cancel();`,
+    },
+  ];
+
+  return (
+    <div>
+      <h1>
+        <u>debounce(function, delay)</u> - Demonstrating debounce functionality
+      </h1>
+      {testCases.map(
+        ({ description, expectedOutput, delay, setup, code }, index) => (
+          <div key={index}>
+            <h3>{description}</h3>
+            <button
+              onClick={() => {
+                setup(); // Run the setup for the test case
+                setTimeout(() => {
+                  console.log(expectedOutput);
+                }, delay + 100); // Wait a bit longer than the delay to check output
+              }}
+            >
+              Run Test
+            </button>
+            <pre>
+              <code>{code}</code>
+            </pre>
+          </div>
+        )
+      )}
+    </div>
+  );
+};

package/src/utils/debounce/debounce.ts

@@ -1,28 +1,28 @@
-type Callback = (...args: any[]) => void;
-
-// Export the DebouncedFunction interface to make it publicly accessible
-export interface DebouncedFunction extends Function {
-  cancel: () => void;
-}
-
-export const debounce = (func: Callback, delay: number): DebouncedFunction => {
-  let timeoutId: ReturnType<typeof setTimeout> | null = null;
-
-  const debounced: DebouncedFunction = function (this: any, ...args: any[]) {
-    // Clear the previous timeout if it exists
-    if (timeoutId) clearTimeout(timeoutId);
-
-    // Set a new timeout
-    timeoutId = setTimeout(() => {
-      func.apply(this, args);
-    }, delay);
-  };
-
-  // Method to cancel the debounced function
-  debounced.cancel = () => {
-    if (timeoutId) clearTimeout(timeoutId);
-    timeoutId = null;
-  };
-
-  return debounced;
-};
+type Callback = (...args: any[]) => void;
+
+// Export the DebouncedFunction interface to make it publicly accessible
+export interface DebouncedFunction extends Function {
+  cancel: () => void;
+}
+
+export const debounce = (func: Callback, delay: number): DebouncedFunction => {
+  let timeoutId: ReturnType<typeof setTimeout> | null = null;
+
+  const debounced: DebouncedFunction = function (this: any, ...args: any[]) {
+    // Clear the previous timeout if it exists
+    if (timeoutId) clearTimeout(timeoutId);
+
+    // Set a new timeout
+    timeoutId = setTimeout(() => {
+      func.apply(this, args);
+    }, delay);
+  };
+
+  // Method to cancel the debounced function
+  debounced.cancel = () => {
+    if (timeoutId) clearTimeout(timeoutId);
+    timeoutId = null;
+  };
+
+  return debounced;
+};

package/src/utils/downloadFile/saveFileFromBlob.stories.tsx

@@ -1,62 +1,62 @@
-import { saveFileFromBlob } from './saveFileFromBlob';
-import { Toastify, toast } from '../../components/Toastify/Toastify';
-
-export default {
-  title: 'Utils/saveFileFromBlob',
-  component: saveFileFromBlob,
-};
-
-export const Default = () => {
-  const testCases = [
-    {
-      blob: new Blob(['Hello, world!'], { type: 'text/plain' }),
-      filename: 'hello.txt',
-    },
-    {
-      blob: new Blob(['{ "key": "value" }'], { type: 'application/json' }),
-      filename: 'data.json',
-    },
-    {
-      blob: null,
-      filename: 'invalid.txt',
-      expectedError: 'Invalid Blob object',
-    },
-  ];
-
-  const handleDownload = (blob: Blob | null, filename: string) => {
-    try {
-      if (blob instanceof Blob) {
-        saveFileFromBlob(blob, filename);
-        toast.success(`File "${filename}" downloaded successfully!`);
-      } else {
-        throw new Error('Invalid Blob object');
-      }
-    } catch (error: any) {
-      toast.error(error.message);
-    }
-  };
-
-  return (
-    <>
-      <div>
-        <h1>saveFileFromBlob - Test Cases</h1>
-        {testCases.map(({ blob, filename, expectedError }, index) => (
-          <div key={index} style={{ marginBottom: '1rem' }}>
-            <button
-              onClick={() => handleDownload(blob as Blob, filename)}
-              style={{ marginRight: '1rem' }}
-            >
-              Download {filename}
-            </button>
-            {expectedError && (
-              <span style={{ color: 'red' }}>
-                Expected Error: {expectedError}
-              </span>
-            )}
-          </div>
-        ))}
-      </div>
-      <Toastify />
-    </>
-  );
-};
+import { saveFileFromBlob } from './saveFileFromBlob';
+import { Toastify, toast } from '../../components/Toastify/Toastify';
+
+export default {
+  title: 'Utils/saveFileFromBlob',
+  component: saveFileFromBlob,
+};
+
+export const Default = () => {
+  const testCases = [
+    {
+      blob: new Blob(['Hello, world!'], { type: 'text/plain' }),
+      filename: 'hello.txt',
+    },
+    {
+      blob: new Blob(['{ "key": "value" }'], { type: 'application/json' }),
+      filename: 'data.json',
+    },
+    {
+      blob: null,
+      filename: 'invalid.txt',
+      expectedError: 'Invalid Blob object',
+    },
+  ];
+
+  const handleDownload = (blob: Blob | null, filename: string) => {
+    try {
+      if (blob instanceof Blob) {
+        saveFileFromBlob(blob, filename);
+        toast.success(`File "${filename}" downloaded successfully!`);
+      } else {
+        throw new Error('Invalid Blob object');
+      }
+    } catch (error: any) {
+      toast.error(error.message);
+    }
+  };
+
+  return (
+    <>
+      <div>
+        <h1>saveFileFromBlob - Test Cases</h1>
+        {testCases.map(({ blob, filename, expectedError }, index) => (
+          <div key={index} style={{ marginBottom: '1rem' }}>
+            <button
+              onClick={() => handleDownload(blob as Blob, filename)}
+              style={{ marginRight: '1rem' }}
+            >
+              Download {filename}
+            </button>
+            {expectedError && (
+              <span style={{ color: 'red' }}>
+                Expected Error: {expectedError}
+              </span>
+            )}
+          </div>
+        ))}
+      </div>
+      <Toastify />
+    </>
+  );
+};

package/src/utils/downloadFile/saveFileFromBlob.ts

@@ -1,40 +1,40 @@
-// saveFileFromBlob.ts
-
-/**
- * Save a file from a Blob object.
- * This utility handles downloading files in browsers, including IE support.
- *
- * @param blob - The Blob object representing the file.
- * @param filename - The name of the file to save.
- */
-interface NavigatorWithMsSaveBlob extends Navigator {
-  msSaveOrOpenBlob?: (_blob: Blob, _filename: string) => void;
-}
-
-export const saveFileFromBlob = (blob: Blob, filename: string): void => {
-  if (!blob || !(blob instanceof Blob)) {
-    console.error('Invalid Blob object');
-    throw new Error('Invalid Blob object');
-  }
-
-  const navigatorWithMsSaveBlob = window.navigator as NavigatorWithMsSaveBlob;
-
-  if (navigatorWithMsSaveBlob.msSaveOrOpenBlob) {
-    const saveBlob = navigatorWithMsSaveBlob.msSaveOrOpenBlob;
-    if (saveBlob) {
-      saveBlob(blob, filename);
-    }
-  } else {
-    // For modern browsers
-    const anchorElement = document.createElement('a');
-    document.body.appendChild(anchorElement);
-    const objectURL = window.URL.createObjectURL(blob);
-    anchorElement.href = objectURL;
-    anchorElement.download = filename;
-    anchorElement.click();
-    setTimeout(() => {
-      window.URL.revokeObjectURL(objectURL);
-      document.body.removeChild(anchorElement);
-    }, 0);
-  }
-};
+// saveFileFromBlob.ts
+
+/**
+ * Save a file from a Blob object.
+ * This utility handles downloading files in browsers, including IE support.
+ *
+ * @param blob - The Blob object representing the file.
+ * @param filename - The name of the file to save.
+ */
+interface NavigatorWithMsSaveBlob extends Navigator {
+  msSaveOrOpenBlob?: (_blob: Blob, _filename: string) => void;
+}
+
+export const saveFileFromBlob = (blob: Blob, filename: string): void => {
+  if (!blob || !(blob instanceof Blob)) {
+    console.error('Invalid Blob object');
+    throw new Error('Invalid Blob object');
+  }
+
+  const navigatorWithMsSaveBlob = window.navigator as NavigatorWithMsSaveBlob;
+
+  if (navigatorWithMsSaveBlob.msSaveOrOpenBlob) {
+    const saveBlob = navigatorWithMsSaveBlob.msSaveOrOpenBlob;
+    if (saveBlob) {
+      saveBlob(blob, filename);
+    }
+  } else {
+    // For modern browsers
+    const anchorElement = document.createElement('a');
+    document.body.appendChild(anchorElement);
+    const objectURL = window.URL.createObjectURL(blob);
+    anchorElement.href = objectURL;
+    anchorElement.download = filename;
+    anchorElement.click();
+    setTimeout(() => {
+      window.URL.revokeObjectURL(objectURL);
+      document.body.removeChild(anchorElement);
+    }, 0);
+  }
+};

package/src/utils/ffID/ffID.stories.tsx

@@ -1,35 +1,35 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { ffid } from './ffid'; // Adjust the import path if needed
-import { useState } from 'react';
-
-const meta: Meta<typeof ffid> = {
-  title: 'Utils/ffid',
-  component: ffid,
-  parameters: {
-    layout: 'centered',
-  },
-  tags: ['autodocs'],
-};
-
-type Story = StoryObj;
-
-// Primary story to display a generated ID
-export const Primary: Story = {
-  render: () => {
-    const [generatedId, setGeneratedId] = useState(ffid());
-
-    const regenerateId = () => {
-      setGeneratedId(ffid());
-    };
-
-    return (
-      <div>
-        <h3>Generated Unique ID</h3>
-        <p>{generatedId}</p>
-        <button onClick={regenerateId}>Generate New ID</button>
-      </div>
-    );
-  },
-};
-
-export default meta;
+import type { Meta, StoryObj } from '@storybook/react';
+import { ffid } from './ffid'; // Adjust the import path if needed
+import { useState } from 'react';
+
+const meta: Meta<typeof ffid> = {
+  title: 'Utils/ffid',
+  component: ffid,
+  parameters: {
+    layout: 'centered',
+  },
+  tags: ['autodocs'],
+};
+
+type Story = StoryObj;
+
+// Primary story to display a generated ID
+export const Primary: Story = {
+  render: () => {
+    const [generatedId, setGeneratedId] = useState(ffid());
+
+    const regenerateId = () => {
+      setGeneratedId(ffid());
+    };
+
+    return (
+      <div>
+        <h3>Generated Unique ID</h3>
+        <p>{generatedId}</p>
+        <button onClick={regenerateId}>Generate New ID</button>
+      </div>
+    );
+  },
+};
+
+export default meta;

package/src/utils/ffID/ffid.ts

@@ -1,7 +1,7 @@
-export const ffid = (): string =>
-  'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (char) =>
-    (
-      (char === 'x' ? Math.random() * 16 : ((Math.random() * 16) & 0x3) | 0x8) |
-      0
-    ).toString(16)
-  );
+export const ffid = (): string =>
+  'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (char) =>
+    (
+      (char === 'x' ? Math.random() * 16 : ((Math.random() * 16) & 0x3) | 0x8) |
+      0
+    ).toString(16)
+  );