@getmicdrop/svelte-components 5.5.4 → 5.6.0

package/dist/primitives/Icons/WarningIcon.svelte

@@ -11,14 +11,14 @@
     fill="none"
     xmlns="http://www.w3.org/2000/svg"
 >
-    <path
-        fill-rule="evenodd"
-        clip-rule="evenodd"
-        d="m10.461 1.705 4.918 8.941a3 3 0 0 1 .371 1.446v.658a3 3 0 0 1-3 3h-9.5a3 3 0 0 1-3-3v-.658a3 3 0 0 1 .371-1.446l4.918-8.94a2.809 2.809 0 0 1 4.922 0ZM12.75 14.25h-9.5a1.5 1.5 0 0 1-1.5-1.5v-.658a1.5 1.5 0 0 1 .186-.723l4.917-8.941a1.309 1.309 0 0 1 2.294 0l4.917 8.941a1.5 1.5 0 0 1 .186.723v.658a1.5 1.5 0 0 1-1.5 1.5Z"
+    <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="m10.461 1.705 4.918 8.941a3 3 0 0 1 .371 1.446v.658a3 3 0 0 1-3 3h-9.5a3 3 0 0 1-3-3v-.658a3 3 0 0 1 .371-1.446l4.918-8.94a2.809 2.809 0 0 1 4.922 0ZM12.75 14.25h-9.5a1.5 1.5 0 0 1-1.5-1.5v-.658a1.5 1.5 0 0 1 .186-.723l4.917-8.941a1.309 1.309 0 0 1 2.294 0l4.917 8.941a1.5 1.5 0 0 1 .186.723v.658a1.5 1.5 0 0 1-1.5 1.5Z"
         fill={color}
     ></path>
     <path
         d="M9.25 11.5a1.25 1.25 0 1 1-2.5 0 1.25 1.25 0 0 1 2.5 0ZM7 5.499c-.029-.543.456-.999 1-.999s1.029.456 1 .999L8.79 8.5a.79.79 0 0 1-1.58 0L7 5.5Z"
         fill={color}
     ></path>
-</svg>
+</svg>

package/dist/primitives/Icons/iconTestUtils.spec.d.ts

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

package/dist/primitives/Icons/iconTestUtils.spec.d.ts.map

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

package/dist/primitives/Icons/iconTestUtils.spec.js

@@ -0,0 +1,235 @@
+import { describe, it, expect, vi } from 'vitest';
+import { testIconProps, createIconTestSuite, batchTestIcons } from './iconTestUtils';
+import ChevronUpOutline from './ChevronUpOutline.svelte';
+import ChevronDownOutline from './ChevronDownOutline.svelte';
+
+describe('iconTestUtils', () => {
+  describe('testIconProps', () => {
+    it('returns an object with test methods', () => {
+      const tests = testIconProps(ChevronUpOutline);
+
+      expect(typeof tests.rendersAsSvg).toBe('function');
+      expect(typeof tests.hasDefaultSize).toBe('function');
+      expect(typeof tests.acceptsCustomSize).toBe('function');
+      expect(typeof tests.hasDefaultColor).toBe('function');
+      expect(typeof tests.acceptsCustomColor).toBe('function');
+      expect(typeof tests.acceptsCustomClass).toBe('function');
+      expect(typeof tests.hasAriaHidden).toBe('function');
+      expect(typeof tests.hasViewBox).toBe('function');
+      expect(typeof tests.runAllTests).toBe('function');
+    });
+
+    describe('rendersAsSvg', () => {
+      it('verifies SVG element exists', () => {
+        const tests = testIconProps(ChevronUpOutline);
+        const svg = tests.rendersAsSvg();
+        expect(svg).toBeTruthy();
+        expect(svg?.tagName).toBe('svg');
+      });
+    });
+
+    describe('hasDefaultSize', () => {
+      it('verifies default size attribute', () => {
+        const tests = testIconProps(ChevronUpOutline);
+        // Should not throw
+        expect(() => tests.hasDefaultSize()).not.toThrow();
+      });
+
+      it('accepts custom default size', () => {
+        const tests = testIconProps(ChevronUpOutline, { defaultSize: '16' });
+        // This will fail if the icon doesn't have size 16 by default
+        // But the function should run without throwing
+        expect(typeof tests.hasDefaultSize).toBe('function');
+      });
+    });
+
+    describe('acceptsCustomSize', () => {
+      it('verifies custom size is applied', () => {
+        const tests = testIconProps(ChevronUpOutline);
+        expect(() => tests.acceptsCustomSize('48')).not.toThrow();
+      });
+
+      it('uses default custom size of 32', () => {
+        const tests = testIconProps(ChevronUpOutline);
+        expect(() => tests.acceptsCustomSize()).not.toThrow();
+      });
+    });
+
+    describe('hasDefaultColor', () => {
+      it('checks for currentColor stroke', () => {
+        const tests = testIconProps(ChevronUpOutline, { usesStroke: true });
+        expect(() => tests.hasDefaultColor()).not.toThrow();
+      });
+
+      it('checks for currentColor fill when usesFill is true', () => {
+        const tests = testIconProps(ChevronUpOutline, { usesFill: true });
+        expect(() => tests.hasDefaultColor()).not.toThrow();
+      });
+
+      it('handles icons with no stroke', () => {
+        const tests = testIconProps(ChevronUpOutline, { usesStroke: false });
+        expect(() => tests.hasDefaultColor()).not.toThrow();
+      });
+    });
+
+    describe('acceptsCustomColor', () => {
+      it('verifies custom color is applied', () => {
+        const tests = testIconProps(ChevronUpOutline);
+        expect(() => tests.acceptsCustomColor('blue')).not.toThrow();
+      });
+
+      it('uses default custom color of red', () => {
+        const tests = testIconProps(ChevronUpOutline);
+        expect(() => tests.acceptsCustomColor()).not.toThrow();
+      });
+
+      it('handles fill-based icons', () => {
+        const tests = testIconProps(ChevronUpOutline, { usesFill: true });
+        expect(() => tests.acceptsCustomColor('green')).not.toThrow();
+      });
+    });
+
+    describe('acceptsCustomClass', () => {
+      it('verifies custom class is applied', () => {
+        const tests = testIconProps(ChevronUpOutline);
+        expect(() => tests.acceptsCustomClass('my-icon-class')).not.toThrow();
+      });
+
+      it('uses default custom class', () => {
+        const tests = testIconProps(ChevronUpOutline);
+        expect(() => tests.acceptsCustomClass()).not.toThrow();
+      });
+    });
+
+    describe('hasAriaHidden', () => {
+      it('verifies aria-hidden attribute', () => {
+        const tests = testIconProps(ChevronUpOutline);
+        expect(() => tests.hasAriaHidden()).not.toThrow();
+      });
+    });
+
+    describe('hasViewBox', () => {
+      it('verifies viewBox attribute exists', () => {
+        const tests = testIconProps(ChevronUpOutline);
+        expect(() => tests.hasViewBox()).not.toThrow();
+      });
+
+      it('verifies specific viewBox value', () => {
+        const tests = testIconProps(ChevronUpOutline);
+        // Pass expected viewBox to test specific value
+        expect(typeof tests.hasViewBox).toBe('function');
+      });
+    });
+
+    describe('runAllTests', () => {
+      it('runs all test methods', () => {
+        const tests = testIconProps(ChevronUpOutline);
+        expect(() => tests.runAllTests()).not.toThrow();
+      });
+    });
+  });
+
+  describe('createIconTestSuite', () => {
+    it('returns an object with tests and getTestCases', () => {
+      const suite = createIconTestSuite('ChevronUpOutline', ChevronUpOutline);
+
+      expect(suite).toHaveProperty('tests');
+      expect(suite).toHaveProperty('getTestCases');
+      expect(typeof suite.getTestCases).toBe('function');
+    });
+
+    it('getTestCases returns an array of test tuples', () => {
+      const suite = createIconTestSuite('ChevronUpOutline', ChevronUpOutline);
+      const testCases = suite.getTestCases();
+
+      expect(Array.isArray(testCases)).toBe(true);
+      expect(testCases.length).toBe(8);
+
+      // Each test case is a tuple of [name, testFn]
+      testCases.forEach(([name, testFn]) => {
+        expect(typeof name).toBe('string');
+        expect(typeof testFn).toBe('function');
+      });
+    });
+
+    it('test cases have expected names', () => {
+      const suite = createIconTestSuite('ChevronUpOutline', ChevronUpOutline);
+      const testCases = suite.getTestCases();
+      const testNames = testCases.map(([name]) => name);
+
+      expect(testNames).toContain('renders an SVG element');
+      expect(testNames).toContain('has default size');
+      expect(testNames).toContain('accepts custom size');
+      expect(testNames).toContain('has default color (currentColor)');
+      expect(testNames).toContain('accepts custom color');
+      expect(testNames).toContain('accepts custom class');
+      expect(testNames).toContain('has aria-hidden attribute');
+      expect(testNames).toContain('has viewBox attribute');
+    });
+
+    it('accepts custom options', () => {
+      const suite = createIconTestSuite('ChevronUpOutline', ChevronUpOutline, {
+        defaultSize: '16',
+        usesStroke: true,
+        usesFill: false,
+      });
+
+      expect(suite.tests).toBeDefined();
+    });
+  });
+
+  describe('batchTestIcons', () => {
+    it('returns an array of icon test suites', () => {
+      const icons = [
+        { name: 'ChevronUpOutline', component: ChevronUpOutline },
+        { name: 'ChevronDownOutline', component: ChevronDownOutline },
+      ];
+
+      const result = batchTestIcons(icons);
+
+      expect(Array.isArray(result)).toBe(true);
+      expect(result.length).toBe(2);
+    });
+
+    it('each result has name, component, and suite', () => {
+      const icons = [
+        { name: 'ChevronUpOutline', component: ChevronUpOutline },
+      ];
+
+      const result = batchTestIcons(icons);
+
+      expect(result[0]).toHaveProperty('name', 'ChevronUpOutline');
+      expect(result[0]).toHaveProperty('component');
+      expect(result[0]).toHaveProperty('suite');
+    });
+
+    it('supports custom options per icon', () => {
+      const icons = [
+        {
+          name: 'ChevronUpOutline',
+          component: ChevronUpOutline,
+          options: { defaultSize: '20' }
+        },
+      ];
+
+      const result = batchTestIcons(icons);
+
+      expect(result[0].suite).toBeDefined();
+      expect(result[0].suite.tests).toBeDefined();
+    });
+
+    it('handles empty array', () => {
+      const result = batchTestIcons([]);
+      expect(result).toEqual([]);
+    });
+
+    it('handles icons without options', () => {
+      const icons = [
+        { name: 'ChevronUpOutline', component: ChevronUpOutline },
+      ];
+
+      const result = batchTestIcons(icons);
+      expect(result[0].suite).toBeDefined();
+    });
+  });
+});