@getmicdrop/svelte-components 5.19.0 → 5.20.0

package/dist/utils/imageValidation.spec.js

@@ -1,223 +1,223 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import {
-  validateImage,
-  getImageAcceptAttribute,
-  getValidationMessages,
-  MAX_FILE_SIZE,
-  MAX_DIMENSION,
-  ALLOWED_IMAGE_TYPES,
-} from './imageValidation';
-
-describe('imageValidation', () => {
-  beforeEach(() => {
-    // Mock URL.createObjectURL and URL.revokeObjectURL
-    global.URL.createObjectURL = vi.fn(() => 'mock-object-url');
-    global.URL.revokeObjectURL = vi.fn();
-  });
-
-  describe('constants', () => {
-    it('MAX_FILE_SIZE is 20MB', () => {
-      expect(MAX_FILE_SIZE).toBe(20 * 1024 * 1024);
-    });
-
-    it('MAX_DIMENSION is 8000', () => {
-      expect(MAX_DIMENSION).toBe(8000);
-    });
-
-    it('ALLOWED_IMAGE_TYPES includes common formats', () => {
-      expect(ALLOWED_IMAGE_TYPES).toContain('image/jpeg');
-      expect(ALLOWED_IMAGE_TYPES).toContain('image/png');
-      expect(ALLOWED_IMAGE_TYPES).toContain('image/webp');
-      expect(ALLOWED_IMAGE_TYPES).toContain('image/heic');
-      expect(ALLOWED_IMAGE_TYPES).toContain('image/heif');
-    });
-  });
-
-  describe('validateImage', () => {
-    it('rejects invalid file type', async () => {
-      const file = new File(['content'], 'test.gif', { type: 'image/gif' });
-      const result = await validateImage(file);
-
-      expect(result.valid).toBe(false);
-      expect(result.error).toContain('Invalid file format');
-    });
-
-    it('rejects file that is too large', async () => {
-      // Create a mock file larger than 20MB
-      const largeContent = new ArrayBuffer(21 * 1024 * 1024);
-      const file = new File([largeContent], 'large.jpg', { type: 'image/jpeg' });
-
-      const result = await validateImage(file);
-
-      expect(result.valid).toBe(false);
-      expect(result.error).toContain('File too large');
-      expect(result.error).toContain('20MB');
-    });
-
-    it('accepts valid JPEG file', async () => {
-      const file = new File(['content'], 'test.jpg', { type: 'image/jpeg' });
-
-      // Mock Image loading using class
-      vi.stubGlobal('Image', class {
-        constructor() {
-          this.width = 100;
-          this.height = 100;
-          this.onload = null;
-          this.onerror = null;
-          this._src = '';
-        }
-        set src(value) {
-          this._src = value;
-          setTimeout(() => this.onload?.call(this), 0);
-        }
-        get src() { return this._src; }
-      });
-
-      const result = await validateImage(file);
-
-      expect(result.valid).toBe(true);
-      expect(result.error).toBe(null);
-      expect(result.dimensions).toEqual({ width: 100, height: 100 });
-    });
-
-    it('accepts valid PNG file', async () => {
-      const file = new File(['content'], 'test.png', { type: 'image/png' });
-
-      vi.stubGlobal('Image', class {
-        constructor() {
-          this.width = 500;
-          this.height = 500;
-          this.onload = null;
-          this.onerror = null;
-          this._src = '';
-        }
-        set src(value) { this._src = value; setTimeout(() => this.onload?.call(this), 0); }
-        get src() { return this._src; }
-      });
-
-      const result = await validateImage(file);
-
-      expect(result.valid).toBe(true);
-    });
-
-    it('accepts valid WebP file', async () => {
-      const file = new File(['content'], 'test.webp', { type: 'image/webp' });
-
-      vi.stubGlobal('Image', class {
-        constructor() {
-          this.width = 200;
-          this.height = 200;
-          this.onload = null;
-          this.onerror = null;
-          this._src = '';
-        }
-        set src(value) { this._src = value; setTimeout(() => this.onload?.call(this), 0); }
-        get src() { return this._src; }
-      });
-
-      const result = await validateImage(file);
-
-      expect(result.valid).toBe(true);
-    });
-
-    it('rejects image with dimensions too large', async () => {
-      const file = new File(['content'], 'test.jpg', { type: 'image/jpeg' });
-
-      vi.stubGlobal('Image', class {
-        constructor() {
-          this.width = 9000;
-          this.height = 9000;
-          this.onload = null;
-          this.onerror = null;
-          this._src = '';
-        }
-        set src(value) { this._src = value; setTimeout(() => this.onload?.call(this), 0); }
-        get src() { return this._src; }
-      });
-
-      const result = await validateImage(file);
-
-      expect(result.valid).toBe(false);
-      expect(result.error).toContain('dimensions too large');
-      expect(result.dimensions).toEqual({ width: 9000, height: 9000 });
-    });
-
-    it('handles image load error', async () => {
-      const file = new File(['content'], 'test.jpg', { type: 'image/jpeg' });
-
-      vi.stubGlobal('Image', class {
-        constructor() {
-          this.onload = null;
-          this.onerror = null;
-          this._src = '';
-        }
-        set src(value) { this._src = value; setTimeout(() => this.onerror?.(), 0); }
-        get src() { return this._src; }
-      });
-
-      const result = await validateImage(file);
-
-      expect(result.valid).toBe(false);
-      expect(result.error).toContain('Failed to read image dimensions');
-    });
-
-    it('handles HEIC format', async () => {
-      const file = new File(['content'], 'test.heic', { type: 'image/heic' });
-
-      vi.stubGlobal('Image', class {
-        constructor() {
-          this.width = 100;
-          this.height = 100;
-          this.onload = null;
-          this.onerror = null;
-          this._src = '';
-        }
-        set src(value) { this._src = value; setTimeout(() => this.onload?.call(this), 0); }
-        get src() { return this._src; }
-      });
-
-      const result = await validateImage(file);
-
-      expect(result.valid).toBe(true);
-    });
-  });
-
-  describe('getImageAcceptAttribute', () => {
-    it('returns accept string with all allowed types', () => {
-      const accept = getImageAcceptAttribute();
-
-      expect(accept).toContain('image/png');
-      expect(accept).toContain('image/jpeg');
-      expect(accept).toContain('image/webp');
-      expect(accept).toContain('image/heic');
-      expect(accept).toContain('image/heif');
-    });
-
-    it('returns comma-separated values', () => {
-      const accept = getImageAcceptAttribute();
-      expect(accept.split(',').length).toBeGreaterThan(1);
-    });
-  });
-
-  describe('getValidationMessages', () => {
-    it('returns formats message', () => {
-      const messages = getValidationMessages();
-      expect(messages.formats).toBe('PNG, JPG, WebP, HEIC');
-    });
-
-    it('returns maxSize message', () => {
-      const messages = getValidationMessages();
-      expect(messages.maxSize).toBe('20MB');
-    });
-
-    it('returns maxDimension message', () => {
-      const messages = getValidationMessages();
-      expect(messages.maxDimension).toBe('8000px');
-    });
-
-    it('returns aspectRatio message', () => {
-      const messages = getValidationMessages();
-      expect(messages.aspectRatio).toBe('Any');
-    });
-  });
-});
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import {
+  validateImage,
+  getImageAcceptAttribute,
+  getValidationMessages,
+  MAX_FILE_SIZE,
+  MAX_DIMENSION,
+  ALLOWED_IMAGE_TYPES,
+} from './imageValidation';
+
+describe('imageValidation', () => {
+  beforeEach(() => {
+    // Mock URL.createObjectURL and URL.revokeObjectURL
+    global.URL.createObjectURL = vi.fn(() => 'mock-object-url');
+    global.URL.revokeObjectURL = vi.fn();
+  });
+
+  describe('constants', () => {
+    it('MAX_FILE_SIZE is 20MB', () => {
+      expect(MAX_FILE_SIZE).toBe(20 * 1024 * 1024);
+    });
+
+    it('MAX_DIMENSION is 8000', () => {
+      expect(MAX_DIMENSION).toBe(8000);
+    });
+
+    it('ALLOWED_IMAGE_TYPES includes common formats', () => {
+      expect(ALLOWED_IMAGE_TYPES).toContain('image/jpeg');
+      expect(ALLOWED_IMAGE_TYPES).toContain('image/png');
+      expect(ALLOWED_IMAGE_TYPES).toContain('image/webp');
+      expect(ALLOWED_IMAGE_TYPES).toContain('image/heic');
+      expect(ALLOWED_IMAGE_TYPES).toContain('image/heif');
+    });
+  });
+
+  describe('validateImage', () => {
+    it('rejects invalid file type', async () => {
+      const file = new File(['content'], 'test.gif', { type: 'image/gif' });
+      const result = await validateImage(file);
+
+      expect(result.valid).toBe(false);
+      expect(result.error).toContain('Invalid file format');
+    });
+
+    it('rejects file that is too large', async () => {
+      // Create a mock file larger than 20MB
+      const largeContent = new ArrayBuffer(21 * 1024 * 1024);
+      const file = new File([largeContent], 'large.jpg', { type: 'image/jpeg' });
+
+      const result = await validateImage(file);
+
+      expect(result.valid).toBe(false);
+      expect(result.error).toContain('File too large');
+      expect(result.error).toContain('20MB');
+    });
+
+    it('accepts valid JPEG file', async () => {
+      const file = new File(['content'], 'test.jpg', { type: 'image/jpeg' });
+
+      // Mock Image loading using class
+      vi.stubGlobal('Image', class {
+        constructor() {
+          this.width = 100;
+          this.height = 100;
+          this.onload = null;
+          this.onerror = null;
+          this._src = '';
+        }
+        set src(value) {
+          this._src = value;
+          setTimeout(() => this.onload?.call(this), 0);
+        }
+        get src() { return this._src; }
+      });
+
+      const result = await validateImage(file);
+
+      expect(result.valid).toBe(true);
+      expect(result.error).toBe(null);
+      expect(result.dimensions).toEqual({ width: 100, height: 100 });
+    });
+
+    it('accepts valid PNG file', async () => {
+      const file = new File(['content'], 'test.png', { type: 'image/png' });
+
+      vi.stubGlobal('Image', class {
+        constructor() {
+          this.width = 500;
+          this.height = 500;
+          this.onload = null;
+          this.onerror = null;
+          this._src = '';
+        }
+        set src(value) { this._src = value; setTimeout(() => this.onload?.call(this), 0); }
+        get src() { return this._src; }
+      });
+
+      const result = await validateImage(file);
+
+      expect(result.valid).toBe(true);
+    });
+
+    it('accepts valid WebP file', async () => {
+      const file = new File(['content'], 'test.webp', { type: 'image/webp' });
+
+      vi.stubGlobal('Image', class {
+        constructor() {
+          this.width = 200;
+          this.height = 200;
+          this.onload = null;
+          this.onerror = null;
+          this._src = '';
+        }
+        set src(value) { this._src = value; setTimeout(() => this.onload?.call(this), 0); }
+        get src() { return this._src; }
+      });
+
+      const result = await validateImage(file);
+
+      expect(result.valid).toBe(true);
+    });
+
+    it('rejects image with dimensions too large', async () => {
+      const file = new File(['content'], 'test.jpg', { type: 'image/jpeg' });
+
+      vi.stubGlobal('Image', class {
+        constructor() {
+          this.width = 9000;
+          this.height = 9000;
+          this.onload = null;
+          this.onerror = null;
+          this._src = '';
+        }
+        set src(value) { this._src = value; setTimeout(() => this.onload?.call(this), 0); }
+        get src() { return this._src; }
+      });
+
+      const result = await validateImage(file);
+
+      expect(result.valid).toBe(false);
+      expect(result.error).toContain('dimensions too large');
+      expect(result.dimensions).toEqual({ width: 9000, height: 9000 });
+    });
+
+    it('handles image load error', async () => {
+      const file = new File(['content'], 'test.jpg', { type: 'image/jpeg' });
+
+      vi.stubGlobal('Image', class {
+        constructor() {
+          this.onload = null;
+          this.onerror = null;
+          this._src = '';
+        }
+        set src(value) { this._src = value; setTimeout(() => this.onerror?.(), 0); }
+        get src() { return this._src; }
+      });
+
+      const result = await validateImage(file);
+
+      expect(result.valid).toBe(false);
+      expect(result.error).toContain('Failed to read image dimensions');
+    });
+
+    it('handles HEIC format', async () => {
+      const file = new File(['content'], 'test.heic', { type: 'image/heic' });
+
+      vi.stubGlobal('Image', class {
+        constructor() {
+          this.width = 100;
+          this.height = 100;
+          this.onload = null;
+          this.onerror = null;
+          this._src = '';
+        }
+        set src(value) { this._src = value; setTimeout(() => this.onload?.call(this), 0); }
+        get src() { return this._src; }
+      });
+
+      const result = await validateImage(file);
+
+      expect(result.valid).toBe(true);
+    });
+  });
+
+  describe('getImageAcceptAttribute', () => {
+    it('returns accept string with all allowed types', () => {
+      const accept = getImageAcceptAttribute();
+
+      expect(accept).toContain('image/png');
+      expect(accept).toContain('image/jpeg');
+      expect(accept).toContain('image/webp');
+      expect(accept).toContain('image/heic');
+      expect(accept).toContain('image/heif');
+    });
+
+    it('returns comma-separated values', () => {
+      const accept = getImageAcceptAttribute();
+      expect(accept.split(',').length).toBeGreaterThan(1);
+    });
+  });
+
+  describe('getValidationMessages', () => {
+    it('returns formats message', () => {
+      const messages = getValidationMessages();
+      expect(messages.formats).toBe('PNG, JPG, WebP, HEIC');
+    });
+
+    it('returns maxSize message', () => {
+      const messages = getValidationMessages();
+      expect(messages.maxSize).toBe('20MB');
+    });
+
+    it('returns maxDimension message', () => {
+      const messages = getValidationMessages();
+      expect(messages.maxDimension).toBe('8000px');
+    });
+
+    it('returns aspectRatio message', () => {
+      const messages = getValidationMessages();
+      expect(messages.aspectRatio).toBe('Any');
+    });
+  });
+});

package/dist/utils/logger.d.ts

@@ -1,13 +1,37 @@
 /**
  * Centralized logger utility for MicDrop applications
  * Can be disabled in production or configured for different log levels
+ *
+ * Usage (factory — recommended for consuming apps):
+ *   import { createLogger } from '@getmicdrop/svelte-components/utils/logger';
+ *   const log = createLogger('MF');
+ *   log.info('booting');  // → [MF] [INFO] booting
+ *
+ * Usage (singleton — legacy, still works):
+ *   import { logger, configureLogger } from '@getmicdrop/svelte-components/utils/logger';
+ *   configureLogger({ prefix: '[MF]' });
+ *   logger.info('booting');
  */
 export type LogLevel = 'debug' | 'info' | 'warn' | 'error';
-interface LoggerConfig {
+export interface LoggerConfig {
     enabled: boolean;
     level: LogLevel;
     prefix: string;
 }
+export interface Logger {
+    debug: (message: string, ...args: unknown[]) => void;
+    info: (message: string, ...args: unknown[]) => void;
+    warn: (message: string, ...args: unknown[]) => void;
+    error: (message: string, ...args: unknown[]) => void;
+    configure: (options: Partial<LoggerConfig>) => void;
+}
+/**
+ * Create an independent logger instance with its own config.
+ *
+ * @param prefix - Tag shown in log output, e.g. 'MF' produces `[MF]`
+ * @param options - Optional overrides for enabled/level
+ */
+export declare function createLogger(prefix: string, options?: Partial<Omit<LoggerConfig, 'prefix'>>): Logger;
 export declare function configureLogger(options: Partial<LoggerConfig>): void;
 export declare const logger: {
     debug: (message: string, ...args: unknown[]) => void;

package/dist/utils/logger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"logger.d.ts","sourceRoot":"","sources":["../../src/lib/utils/logger.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;AAE3D,UAAU,YAAY;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,QAAQ,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;CAChB;AAeD,wBAAgB,eAAe,CAAC,OAAO,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,IAAI,CAEpE;AAUD,eAAO,MAAM,MAAM;qBACA,MAAM,WAAW,OAAO,EAAE,KAAG,IAAI;oBAMlC,MAAM,WAAW,OAAO,EAAE,KAAG,IAAI;oBAMjC,MAAM,WAAW,OAAO,EAAE,KAAG,IAAI;qBAMhC,MAAM,WAAW,OAAO,EAAE,KAAG,IAAI;CAKnD,CAAC;AAEF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"logger.d.ts","sourceRoot":"","sources":["../../src/lib/utils/logger.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAEH,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;AAE3D,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,QAAQ,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,CAAC;IACrD,IAAI,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,CAAC;IACpD,IAAI,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,CAAC;IACpD,KAAK,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,CAAC;IACrD,SAAS,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC;CACrD;AAYD;;;;;GAKG;AACH,wBAAgB,YAAY,CAC1B,MAAM,EAAE,MAAM,EACd,OAAO,GAAE,OAAO,CAAC,IAAI,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAM,GAClD,MAAM,CA4CR;AAYD,wBAAgB,eAAe,CAAC,OAAO,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,IAAI,CAEpE;AAUD,eAAO,MAAM,MAAM;qBACA,MAAM,WAAW,OAAO,EAAE,KAAG,IAAI;oBAMlC,MAAM,WAAW,OAAO,EAAE,KAAG,IAAI;oBAMjC,MAAM,WAAW,OAAO,EAAE,KAAG,IAAI;qBAMhC,MAAM,WAAW,OAAO,EAAE,KAAG,IAAI;CAKnD,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/utils/logger.js

@@ -1,6 +1,16 @@
 /**
  * Centralized logger utility for MicDrop applications
  * Can be disabled in production or configured for different log levels
+ *
+ * Usage (factory — recommended for consuming apps):
+ *   import { createLogger } from '@getmicdrop/svelte-components/utils/logger';
+ *   const log = createLogger('MF');
+ *   log.info('booting');  // → [MF] [INFO] booting
+ *
+ * Usage (singleton — legacy, still works):
+ *   import { logger, configureLogger } from '@getmicdrop/svelte-components/utils/logger';
+ *   configureLogger({ prefix: '[MF]' });
+ *   logger.info('booting');
  */
 const LOG_LEVELS = {
     debug: 0,
@@ -8,8 +18,56 @@ const LOG_LEVELS = {
     warn: 2,
     error: 3,
 };
+const isEnabled = () => typeof window !== 'undefined' && import.meta.env?.DEV !== false;
+/**
+ * Create an independent logger instance with its own config.
+ *
+ * @param prefix - Tag shown in log output, e.g. 'MF' produces `[MF]`
+ * @param options - Optional overrides for enabled/level
+ */
+export function createLogger(prefix, options = {}) {
+    let config = {
+        enabled: options.enabled ?? isEnabled(),
+        level: options.level ?? 'debug',
+        prefix: prefix.startsWith('[') ? prefix : `[${prefix}]`,
+    };
+    function shouldLog(level) {
+        return config.enabled && LOG_LEVELS[level] >= LOG_LEVELS[config.level];
+    }
+    function formatMessage(level, message) {
+        return `${config.prefix} [${level.toUpperCase()}] ${message}`;
+    }
+    return {
+        debug(message, ...args) {
+            if (shouldLog('debug')) {
+                console.log(formatMessage('debug', message), ...args);
+            }
+        },
+        info(message, ...args) {
+            if (shouldLog('info')) {
+                console.info(formatMessage('info', message), ...args);
+            }
+        },
+        warn(message, ...args) {
+            if (shouldLog('warn')) {
+                console.warn(formatMessage('warn', message), ...args);
+            }
+        },
+        error(message, ...args) {
+            if (shouldLog('error')) {
+                console.error(formatMessage('error', message), ...args);
+            }
+        },
+        configure(opts) {
+            config = { ...config, ...opts };
+        },
+    };
+}
+// ---------------------------------------------------------------------------
+// Singleton (backward-compatible) — uses the factory internally
+// ---------------------------------------------------------------------------
 let config = {
-    enabled: typeof window !== 'undefined' && import.meta.env?.DEV !== false,
+    enabled: isEnabled(),
     level: 'debug',
     prefix: '[MicDrop]',
 };