@getmicdrop/svelte-components 5.17.1 → 5.17.4

package/dist/utils/haptic.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"haptic.spec.d.ts","sourceRoot":"","sources":["../../src/lib/utils/haptic.spec.ts"],"names":[],"mappings":""}

package/dist/utils/haptic.spec.js

@@ -0,0 +1,153 @@
+import { describe, it, expect, vi, afterEach } from 'vitest';
+import { triggerHaptic, isHapticAvailable, getHapticForButtonVariant } from './haptic';
+describe('haptic', () => {
+    const originalWindow = globalThis.window;
+    afterEach(() => {
+        vi.restoreAllMocks();
+        // Clean up any added properties
+        // @ts-expect-error cleanup
+        delete window.webkit;
+        // @ts-expect-error cleanup
+        delete window.TapticEngine;
+    });
+    describe('triggerHaptic', () => {
+        it('returns early in non-browser environment', () => {
+            const windowSpy = vi.spyOn(globalThis, 'window', 'get');
+            // @ts-expect-error simulating server
+            windowSpy.mockReturnValue(undefined);
+            expect(() => triggerHaptic('light')).not.toThrow();
+            windowSpy.mockRestore();
+        });
+        it('uses iOS WebKit messageHandlers when available', () => {
+            const postMessage = vi.fn();
+            // @ts-expect-error mock iOS WebKit
+            window.webkit = { messageHandlers: { haptic: { postMessage } } };
+            triggerHaptic('success');
+            expect(postMessage).toHaveBeenCalledWith('success');
+        });
+        it('uses TapticEngine when available', () => {
+            const impact = vi.fn();
+            // @ts-expect-error mock TapticEngine
+            window.TapticEngine = { impact };
+            triggerHaptic('light');
+            expect(impact).toHaveBeenCalledWith({ style: 'light' });
+        });
+        it('maps success/warning/error/selection to medium for TapticEngine', () => {
+            const impact = vi.fn();
+            // @ts-expect-error mock TapticEngine
+            window.TapticEngine = { impact };
+            triggerHaptic('success');
+            expect(impact).toHaveBeenCalledWith({ style: 'medium' });
+            triggerHaptic('warning');
+            expect(impact).toHaveBeenCalledWith({ style: 'medium' });
+            triggerHaptic('error');
+            expect(impact).toHaveBeenCalledWith({ style: 'medium' });
+            triggerHaptic('selection');
+            expect(impact).toHaveBeenCalledWith({ style: 'medium' });
+        });
+        it('passes through light/medium/heavy to TapticEngine', () => {
+            const impact = vi.fn();
+            // @ts-expect-error mock TapticEngine
+            window.TapticEngine = { impact };
+            triggerHaptic('heavy');
+            expect(impact).toHaveBeenCalledWith({ style: 'heavy' });
+            triggerHaptic('medium');
+            expect(impact).toHaveBeenCalledWith({ style: 'medium' });
+        });
+        it('falls back to Vibration API', () => {
+            const vibrate = vi.fn();
+            Object.defineProperty(navigator, 'vibrate', { value: vibrate, writable: true, configurable: true });
+            triggerHaptic('light');
+            expect(vibrate).toHaveBeenCalledWith(10);
+            triggerHaptic('medium');
+            expect(vibrate).toHaveBeenCalledWith(20);
+            triggerHaptic('heavy');
+            expect(vibrate).toHaveBeenCalledWith(30);
+            triggerHaptic('success');
+            expect(vibrate).toHaveBeenCalledWith([10, 50, 20]);
+            triggerHaptic('warning');
+            expect(vibrate).toHaveBeenCalledWith([20, 40, 20]);
+            triggerHaptic('error');
+            expect(vibrate).toHaveBeenCalledWith([30, 50, 30, 50, 30]);
+            triggerHaptic('selection');
+            expect(vibrate).toHaveBeenCalledWith(8);
+            // cleanup
+            Object.defineProperty(navigator, 'vibrate', { value: undefined, writable: true, configurable: true });
+        });
+        it('defaults to light when no style specified', () => {
+            const vibrate = vi.fn();
+            Object.defineProperty(navigator, 'vibrate', { value: vibrate, writable: true, configurable: true });
+            triggerHaptic();
+            expect(vibrate).toHaveBeenCalledWith(10);
+            Object.defineProperty(navigator, 'vibrate', { value: undefined, writable: true, configurable: true });
+        });
+        it('does nothing when no haptic API available', () => {
+            // No webkit, no TapticEngine, no vibrate
+            Object.defineProperty(navigator, 'vibrate', { value: undefined, writable: true, configurable: true });
+            expect(() => triggerHaptic('light')).not.toThrow();
+        });
+    });
+    describe('isHapticAvailable', () => {
+        it('returns false in non-browser environment', () => {
+            const windowSpy = vi.spyOn(globalThis, 'window', 'get');
+            // @ts-expect-error simulating server
+            windowSpy.mockReturnValue(undefined);
+            expect(isHapticAvailable()).toBe(false);
+            windowSpy.mockRestore();
+        });
+        it('returns true when webkit haptic handler exists', () => {
+            // @ts-expect-error mock
+            window.webkit = { messageHandlers: { haptic: { postMessage: vi.fn() } } };
+            expect(isHapticAvailable()).toBe(true);
+        });
+        it('returns true when TapticEngine exists', () => {
+            // @ts-expect-error mock
+            window.TapticEngine = { impact: vi.fn() };
+            expect(isHapticAvailable()).toBe(true);
+        });
+        it('returns true when vibrate exists', () => {
+            Object.defineProperty(navigator, 'vibrate', { value: vi.fn(), writable: true, configurable: true });
+            expect(isHapticAvailable()).toBe(true);
+            Object.defineProperty(navigator, 'vibrate', { value: undefined, writable: true, configurable: true });
+        });
+        it('returns false when no haptic API available', () => {
+            Object.defineProperty(navigator, 'vibrate', { value: undefined, writable: true, configurable: true });
+            expect(isHapticAvailable()).toBe(false);
+        });
+    });
+    describe('getHapticForButtonVariant', () => {
+        it('returns success when isSuccess is true regardless of variant', () => {
+            expect(getHapticForButtonVariant('default', true)).toBe('success');
+            expect(getHapticForButtonVariant('ghost', true)).toBe('success');
+        });
+        it('returns heavy for destructive variants', () => {
+            expect(getHapticForButtonVariant('red')).toBe('heavy');
+            expect(getHapticForButtonVariant('red-outline')).toBe('heavy');
+            expect(getHapticForButtonVariant('ghost-red')).toBe('heavy');
+            expect(getHapticForButtonVariant('menu-item-danger')).toBe('heavy');
+        });
+        it('returns medium for primary action variants', () => {
+            expect(getHapticForButtonVariant('default')).toBe('medium');
+            expect(getHapticForButtonVariant('outline')).toBe('medium');
+            expect(getHapticForButtonVariant('landing')).toBe('medium');
+        });
+        it('returns light for secondary action variants', () => {
+            expect(getHapticForButtonVariant('alternative')).toBe('light');
+            expect(getHapticForButtonVariant('ghost')).toBe('light');
+            expect(getHapticForButtonVariant('landing-secondary')).toBe('light');
+        });
+        it('returns selection for toggle/nav variants', () => {
+            expect(getHapticForButtonVariant('toggle')).toBe('selection');
+            expect(getHapticForButtonVariant('nav')).toBe('selection');
+        });
+        it('returns null for variants that should not have haptic', () => {
+            expect(getHapticForButtonVariant('icon')).toBeNull();
+            expect(getHapticForButtonVariant('menu-item')).toBeNull();
+            expect(getHapticForButtonVariant('search-result')).toBeNull();
+            expect(getHapticForButtonVariant('link')).toBeNull();
+        });
+        it('returns light for unknown variants', () => {
+            expect(getHapticForButtonVariant('unknown-variant')).toBe('light');
+        });
+    });
+});

package/dist/utils/imageOptimizer.spec.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=imageOptimizer.spec.d.ts.map

package/dist/utils/imageOptimizer.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"imageOptimizer.spec.d.ts","sourceRoot":"","sources":["../../src/lib/utils/imageOptimizer.spec.ts"],"names":[],"mappings":""}

package/dist/utils/imageOptimizer.spec.js

@@ -0,0 +1,201 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import { createImage, supportsWebP, optimizeImage } from './imageOptimizer';
+describe('imageOptimizer', () => {
+    describe('createImage', () => {
+        it('creates an HTMLImageElement', () => {
+            // In jsdom, Image load events don't fire for data URLs reliably,
+            // so we test the function creates the right structure
+            const promise = createImage('https://example.com/test.png');
+            // The promise is pending, but we can verify it returns a promise
+            expect(promise).toBeInstanceOf(Promise);
+        });
+        it('does not set crossOrigin for blob URLs', () => {
+            const blob = new Blob([''], { type: 'image/png' });
+            const blobUrl = URL.createObjectURL(blob);
+            // Verify the logic by manually checking: blob URLs should not get crossOrigin
+            expect(blobUrl.startsWith('blob:')).toBe(true);
+            URL.revokeObjectURL(blobUrl);
+        });
+    });
+    describe('supportsWebP', () => {
+        it('returns true when canvas supports webp', () => {
+            const toDataURL = vi.fn().mockReturnValue('data:image/webp;base64,abc');
+            vi.spyOn(document, 'createElement').mockReturnValue({
+                width: 0,
+                height: 0,
+                toDataURL,
+            });
+            expect(supportsWebP()).toBe(true);
+            expect(toDataURL).toHaveBeenCalledWith('image/webp');
+            vi.restoreAllMocks();
+        });
+        it('returns false when canvas does not support webp', () => {
+            const toDataURL = vi.fn().mockReturnValue('data:image/png;base64,abc');
+            vi.spyOn(document, 'createElement').mockReturnValue({
+                width: 0,
+                height: 0,
+                toDataURL,
+            });
+            expect(supportsWebP()).toBe(false);
+            vi.restoreAllMocks();
+        });
+    });
+    describe('optimizeImage', () => {
+        let mockCanvas;
+        let mockCtx;
+        let originalImage;
+        beforeEach(() => {
+            mockCtx = {
+                imageSmoothingEnabled: false,
+                imageSmoothingQuality: '',
+                drawImage: vi.fn(),
+            };
+            mockCanvas = {
+                width: 0,
+                height: 0,
+                getContext: vi.fn().mockReturnValue(mockCtx),
+                toBlob: vi.fn(),
+                toDataURL: vi.fn().mockReturnValue('data:image/png;base64,abc'),
+            };
+            let callCount = 0;
+            vi.spyOn(document, 'createElement').mockImplementation((tag) => {
+                if (tag === 'canvas') {
+                    callCount++;
+                    // First canvas call is for optimizeImage, second is for supportsWebP
+                    if (callCount === 1) {
+                        return mockCanvas;
+                    }
+                    return {
+                        width: 0,
+                        height: 0,
+                        toDataURL: vi.fn().mockReturnValue('data:image/png;base64,abc'),
+                    };
+                }
+                return Object.getPrototypeOf(document).createElement.call(document, tag);
+            });
+            vi.spyOn(URL, 'createObjectURL').mockReturnValue('blob:test');
+            vi.spyOn(URL, 'revokeObjectURL').mockImplementation(() => { });
+            originalImage = globalThis.Image;
+        });
+        afterEach(() => {
+            vi.restoreAllMocks();
+            globalThis.Image = originalImage;
+        });
+        function mockImageConstructor(width, height, shouldFail = false) {
+            // @ts-expect-error mock constructor
+            globalThis.Image = class MockImage {
+                constructor() {
+                    this.width = width;
+                    this.height = height;
+                    this.crossOrigin = '';
+                    this.src = '';
+                    this.listeners = {};
+                }
+                addEventListener(event, handler) {
+                    if (!this.listeners[event])
+                        this.listeners[event] = [];
+                    this.listeners[event].push(handler);
+                    if (event === 'load' && !shouldFail) {
+                        setTimeout(() => handler(), 0);
+                    }
+                    if (event === 'error' && shouldFail) {
+                        setTimeout(() => handler(new Error('load failed')), 0);
+                    }
+                }
+                setAttribute(name, value) {
+                    if (name === 'crossOrigin')
+                        this.crossOrigin = value;
+                }
+            };
+        }
+        it('optimizes a landscape image with default options', async () => {
+            mockImageConstructor(2000, 1000);
+            mockCanvas.toBlob.mockImplementation((cb) => {
+                cb(new Blob(['optimized'], { type: 'image/jpeg' }));
+            });
+            const file = new File(['test'], 'photo.jpg', { type: 'image/jpeg' });
+            const result = await optimizeImage(file);
+            expect(result).toBeInstanceOf(File);
+            expect(result.name).toMatch(/photo\.(jpg|webp)$/);
+            expect(URL.revokeObjectURL).toHaveBeenCalledWith('blob:test');
+            expect(mockCanvas.width).toBe(1000);
+            expect(mockCanvas.height).toBe(500);
+        });
+        it('optimizes a portrait image', async () => {
+            mockImageConstructor(500, 2000);
+            mockCanvas.toBlob.mockImplementation((cb) => {
+                cb(new Blob(['optimized'], { type: 'image/jpeg' }));
+            });
+            const file = new File(['test'], 'photo.png', { type: 'image/png' });
+            const result = await optimizeImage(file);
+            expect(result).toBeInstanceOf(File);
+            expect(mockCanvas.height).toBe(1000);
+            expect(mockCanvas.width).toBe(250);
+        });
+        it('does not upscale small images', async () => {
+            mockImageConstructor(200, 150);
+            mockCanvas.toBlob.mockImplementation((cb) => {
+                cb(new Blob(['optimized'], { type: 'image/jpeg' }));
+            });
+            const file = new File(['test'], 'small.jpg', { type: 'image/jpeg' });
+            await optimizeImage(file);
+            expect(mockCanvas.width).toBe(200);
+            expect(mockCanvas.height).toBe(150);
+        });
+        it('handles forceSquare option', async () => {
+            mockImageConstructor(800, 600);
+            mockCanvas.toBlob.mockImplementation((cb) => {
+                cb(new Blob(['optimized'], { type: 'image/jpeg' }));
+            });
+            const file = new File(['test'], 'photo.jpg', { type: 'image/jpeg' });
+            await optimizeImage(file, { forceSquare: true, maxSize: 500 });
+            expect(mockCanvas.width).toBe(500);
+            expect(mockCanvas.height).toBe(500);
+            expect(mockCtx.drawImage).toHaveBeenCalledWith(expect.anything(), 100, 0, 600, 600, 0, 0, 500, 500);
+        });
+        it('uses custom quality when provided', async () => {
+            mockImageConstructor(2000, 1000);
+            mockCanvas.toBlob.mockImplementation((cb) => {
+                cb(new Blob(['optimized'], { type: 'image/jpeg' }));
+            });
+            const file = new File(['test'], 'photo.jpg', { type: 'image/jpeg' });
+            await optimizeImage(file, { quality: 0.5 });
+            expect(mockCanvas.toBlob).toHaveBeenCalledWith(expect.any(Function), expect.any(String), 0.5);
+        });
+        it('uses custom maxSize', async () => {
+            mockImageConstructor(2000, 1000);
+            mockCanvas.toBlob.mockImplementation((cb) => {
+                cb(new Blob(['optimized'], { type: 'image/jpeg' }));
+            });
+            const file = new File(['test'], 'photo.jpg', { type: 'image/jpeg' });
+            await optimizeImage(file, { maxSize: 500 });
+            expect(mockCanvas.width).toBe(500);
+            expect(mockCanvas.height).toBe(250);
+        });
+        it('revokes blob URL even on error', async () => {
+            mockImageConstructor(0, 0, true);
+            const file = new File(['test'], 'bad.jpg', { type: 'image/jpeg' });
+            await expect(optimizeImage(file)).rejects.toBeDefined();
+            expect(URL.revokeObjectURL).toHaveBeenCalledWith('blob:test');
+        });
+        it('replaces file extension in output filename', async () => {
+            mockImageConstructor(200, 100);
+            mockCanvas.toBlob.mockImplementation((cb) => {
+                cb(new Blob(['optimized'], { type: 'image/jpeg' }));
+            });
+            const file = new File(['test'], 'my-photo.png', { type: 'image/png' });
+            const result = await optimizeImage(file);
+            expect(result.name).toMatch(/my-photo\.(jpg|webp)$/);
+        });
+        it('sets imageSmoothingEnabled and quality', async () => {
+            mockImageConstructor(200, 100);
+            mockCanvas.toBlob.mockImplementation((cb) => {
+                cb(new Blob(['optimized'], { type: 'image/jpeg' }));
+            });
+            const file = new File(['test'], 'photo.jpg', { type: 'image/jpeg' });
+            await optimizeImage(file);
+            expect(mockCtx.imageSmoothingEnabled).toBe(true);
+            expect(mockCtx.imageSmoothingQuality).toBe('high');
+        });
+    });
+});

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

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=logger.spec.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"logger.spec.d.ts","sourceRoot":"","sources":["../../src/lib/utils/logger.spec.ts"],"names":[],"mappings":""}

package/dist/utils/logger.spec.js

@@ -0,0 +1,95 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import { logger, configureLogger } from './logger';
+describe('logger', () => {
+    beforeEach(() => {
+        vi.spyOn(console, 'log').mockImplementation(() => { });
+        vi.spyOn(console, 'info').mockImplementation(() => { });
+        vi.spyOn(console, 'warn').mockImplementation(() => { });
+        vi.spyOn(console, 'error').mockImplementation(() => { });
+        // Reset to default enabled state
+        configureLogger({ enabled: true, level: 'debug', prefix: '[MicDrop]' });
+    });
+    afterEach(() => {
+        vi.restoreAllMocks();
+    });
+    describe('log methods', () => {
+        it('debug logs with console.log', () => {
+            logger.debug('test message');
+            expect(console.log).toHaveBeenCalledWith('[MicDrop] [DEBUG] test message');
+        });
+        it('info logs with console.info', () => {
+            logger.info('test message');
+            expect(console.info).toHaveBeenCalledWith('[MicDrop] [INFO] test message');
+        });
+        it('warn logs with console.warn', () => {
+            logger.warn('test message');
+            expect(console.warn).toHaveBeenCalledWith('[MicDrop] [WARN] test message');
+        });
+        it('error logs with console.error', () => {
+            logger.error('test message');
+            expect(console.error).toHaveBeenCalledWith('[MicDrop] [ERROR] test message');
+        });
+        it('passes extra arguments through', () => {
+            const data = { foo: 'bar' };
+            logger.debug('message', data);
+            expect(console.log).toHaveBeenCalledWith('[MicDrop] [DEBUG] message', data);
+        });
+        it('passes multiple extra arguments', () => {
+            logger.info('msg', 1, 'two', { three: 3 });
+            expect(console.info).toHaveBeenCalledWith('[MicDrop] [INFO] msg', 1, 'two', { three: 3 });
+        });
+    });
+    describe('configureLogger', () => {
+        it('can disable logging', () => {
+            configureLogger({ enabled: false });
+            logger.debug('should not appear');
+            logger.info('should not appear');
+            logger.warn('should not appear');
+            logger.error('should not appear');
+            expect(console.log).not.toHaveBeenCalled();
+            expect(console.info).not.toHaveBeenCalled();
+            expect(console.warn).not.toHaveBeenCalled();
+            expect(console.error).not.toHaveBeenCalled();
+        });
+        it('can change prefix', () => {
+            configureLogger({ prefix: '[Custom]' });
+            logger.debug('test');
+            expect(console.log).toHaveBeenCalledWith('[Custom] [DEBUG] test');
+        });
+        it('can set log level to filter lower levels', () => {
+            configureLogger({ level: 'warn' });
+            logger.debug('debug msg');
+            logger.info('info msg');
+            logger.warn('warn msg');
+            logger.error('error msg');
+            expect(console.log).not.toHaveBeenCalled();
+            expect(console.info).not.toHaveBeenCalled();
+            expect(console.warn).toHaveBeenCalledTimes(1);
+            expect(console.error).toHaveBeenCalledTimes(1);
+        });
+        it('level info filters out debug', () => {
+            configureLogger({ level: 'info' });
+            logger.debug('debug msg');
+            logger.info('info msg');
+            expect(console.log).not.toHaveBeenCalled();
+            expect(console.info).toHaveBeenCalledTimes(1);
+        });
+        it('level error filters out everything except error', () => {
+            configureLogger({ level: 'error' });
+            logger.debug('d');
+            logger.info('i');
+            logger.warn('w');
+            logger.error('e');
+            expect(console.log).not.toHaveBeenCalled();
+            expect(console.info).not.toHaveBeenCalled();
+            expect(console.warn).not.toHaveBeenCalled();
+            expect(console.error).toHaveBeenCalledTimes(1);
+        });
+        it('partial config merges with existing', () => {
+            configureLogger({ prefix: '[Test]' });
+            configureLogger({ level: 'warn' });
+            logger.warn('test');
+            expect(console.warn).toHaveBeenCalledWith('[Test] [WARN] test');
+        });
+    });
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@getmicdrop/svelte-components",
-  "version": "5.17.1",
+  "version": "5.17.4",
   "description": "Shared component library for Micdrop applications",
   "type": "module",
   "main": "./dist/index.js",
@@ -248,7 +248,6 @@
     "@tailwindcss/vite": "^4.0.0",
     "@testing-library/jest-dom": "^6.4.6",
     "@testing-library/svelte": "^5.2.0",
-    "@types/cookie": "^1.0.0",
     "@types/node": "^20.14.12",
     "@typescript-eslint/parser": "^8.52.0",
     "@vitest/browser": "^4.0.17",