@thumbmarkjs/thumbmarkjs 1.7.3 → 1.7.5

package/src/thumbmark.custom-components.test.ts

@@ -0,0 +1,87 @@
+import { Thumbmark } from './thumbmark';
+import { customComponents } from './factory';
+import { getThumbmark, includeComponent as includeGlobalComponent } from './index';
+
+describe('Thumbmark custom components', () => {
+    beforeEach(() => {
+        for (const key of Object.keys(customComponents)) {
+            delete customComponents[key];
+        }
+    });
+
+    test('custom components stay scoped to the instance that registered them', async () => {
+        const tm1 = new Thumbmark({ logging: false });
+        const tm2 = new Thumbmark({ logging: false });
+
+        tm1.includeComponent('instanceOnly', async () => ({
+            value: 'tm1'
+        }));
+
+        const tm1Result = await tm1.get({ include: ['instanceOnly'] });
+        const tm2Result = await tm2.get({ include: ['instanceOnly'] });
+
+        expect(tm1Result.components.instanceOnly).toEqual({ value: 'tm1' });
+        expect(tm2Result.components.instanceOnly).toBeUndefined();
+    });
+
+    test('deprecated global includeComponent still registers components for getThumbmark', async () => {
+        includeGlobalComponent('legacyGlobal', async () => ({
+            value: 'global'
+        }));
+
+        const result = await getThumbmark({
+            logging: false,
+            include: ['legacyGlobal']
+        });
+
+        expect(result.components.legacyGlobal).toEqual({ value: 'global' });
+    });
+
+    test('getThumbmark accepts an optional custom component registry', async () => {
+        const result = await getThumbmark({
+            logging: false,
+            include: ['directCustom']
+        }, {
+            directCustom: async () => ({
+                value: 'direct'
+            })
+        });
+
+        expect(result.components.directCustom).toEqual({ value: 'direct' });
+    });
+
+    test('deprecated global includeComponent still registers components for Thumbmark.get()', async () => {
+        includeGlobalComponent('legacyGlobal', async () => ({
+            value: 'global'
+        }));
+
+        const tm = new Thumbmark({ logging: false });
+        const result = await tm.get({
+            include: ['legacyGlobal']
+        });
+
+        expect(result.components.legacyGlobal).toEqual({ value: 'global' });
+    });
+
+    test('instance custom components override deprecated global ones for the same key', async () => {
+        includeGlobalComponent('sharedKey', async () => ({
+            value: 'global'
+        }));
+
+        const tm = new Thumbmark({ logging: false });
+        tm.includeComponent('sharedKey', async () => ({
+            value: 'instance'
+        }));
+
+        const globalResult = await getThumbmark({
+            logging: false,
+            include: ['sharedKey']
+        });
+        const instanceResult = await tm.get({
+            include: ['sharedKey']
+        });
+
+        expect(globalResult.components.sharedKey).toEqual({ value: 'global' });
+        expect(instanceResult.components.sharedKey).toEqual({ value: 'instance' });
+    });
+});

package/src/thumbmark.ts

@@ -1,8 +1,8 @@
 import { optionsInterface } from "./options";
-import { getThumbmark, includeComponent as globalIncludeComponent, ThumbmarkResponse } from './functions';
+import { getThumbmark, ThumbmarkResponse } from './functions';
 import { getVersion } from "./utils/version";
 import { defaultOptions } from "./options";
-import { componentInterface } from "./factory";
+import { componentFunctionInterface, componentInterface } from "./factory";
 
 /**
  * A client for generating thumbmarks with a persistent configuration.
@@ -10,6 +10,7 @@ import { componentInterface } from "./factory";
     
 export class Thumbmark {
     private options: optionsInterface;
+    private customComponents: Record<string, componentFunctionInterface | null>;
   
     /**
      * Creates a new Thumbmarker client instance.
@@ -17,6 +18,7 @@ export class Thumbmark {
      */
     constructor(options?: optionsInterface) {
       this.options = { ...defaultOptions, ...options };
+      this.customComponents = {};
     }
   
     /**
@@ -26,7 +28,7 @@ export class Thumbmark {
      */
     public async get(overrideOptions?: optionsInterface): Promise<ThumbmarkResponse> {
       const finalOptions = { ...this.options, ...overrideOptions };
-      return getThumbmark(finalOptions);
+      return getThumbmark(finalOptions, this.customComponents);
     }
     public getVersion(): string {
       return getVersion()
@@ -37,6 +39,6 @@ export class Thumbmark {
      * @param fn - The component function
      */
     public includeComponent(key: string, fn: (options?: optionsInterface) => Promise<componentInterface | null>) {
-      globalIncludeComponent(key, fn);
+      this.customComponents[key] = fn;
     }
-}
+}