@getmicdrop/svelte-components 5.20.1 → 5.20.2

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/portal.d.ts

@@ -1,12 +1,12 @@
-/**
- * Svelte action that portals an element to a target container (default: document.body)
- * This moves the element outside of any stacking contexts, solving iOS z-index issues.
- *
- * Usage: <div use:portal>...</div>
- * Or: <div use:portal={document.getElementById('modal-root')}>...</div>
- */
-export function portal(node: any, target?: HTMLElement): {
-    update(newTarget: any): void;
-    destroy(): void;
-};
+/**
+ * Svelte action that portals an element to a target container (default: document.body)
+ * This moves the element outside of any stacking contexts, solving iOS z-index issues.
+ *
+ * Usage: <div use:portal>...</div>
+ * Or: <div use:portal={document.getElementById('modal-root')}>...</div>
+ */
+export function portal(node: any, target?: HTMLElement): {
+    update(newTarget: any): void;
+    destroy(): void;
+};
 //# sourceMappingURL=portal.d.ts.map

package/dist/utils/portal.js

@@ -1,25 +1,25 @@
-/**
- * Svelte action that portals an element to a target container (default: document.body)
- * This moves the element outside of any stacking contexts, solving iOS z-index issues.
- *
- * Usage: <div use:portal>...</div>
- * Or: <div use:portal={document.getElementById('modal-root')}>...</div>
- */
-export function portal(node, target = document.body) {
-  // Move the node to the target
-  target.appendChild(node);
-
-  return {
-    update(newTarget) {
-      // If target changes, move to new target
-      newTarget = newTarget || document.body;
-      newTarget.appendChild(node);
-    },
-    destroy() {
-      // Clean up - remove the node when component is destroyed
-      if (node.parentNode) {
-        node.parentNode.removeChild(node);
-      }
-    }
-  };
-}
+/**
+ * Svelte action that portals an element to a target container (default: document.body)
+ * This moves the element outside of any stacking contexts, solving iOS z-index issues.
+ *
+ * Usage: <div use:portal>...</div>
+ * Or: <div use:portal={document.getElementById('modal-root')}>...</div>
+ */
+export function portal(node, target = document.body) {
+  // Move the node to the target
+  target.appendChild(node);
+
+  return {
+    update(newTarget) {
+      // If target changes, move to new target
+      newTarget = newTarget || document.body;
+      newTarget.appendChild(node);
+    },
+    destroy() {
+      // Clean up - remove the node when component is destroyed
+      if (node.parentNode) {
+        node.parentNode.removeChild(node);
+      }
+    }
+  };
+}