@spectral_labs/ui 1.6.1 → 1.8.0-next.0

package/dist/components/sortable-list/__tests__/sortable-list.test.svelte.js

@@ -1,175 +0,0 @@
-/**
- * SortableList test suite — T-C-P2-4
- *
- * Coverage strategy:
- * - Smoke, ARIA, orientation, disabled, reorder, group: fully testable in jsdom.
- * - DnD code paths (dragstart, drag, drop, pointer events, DropDelegate spatial logic,
- *   AutoScroll): require a real browser — intentionally NOT covered here.
- *   These code paths live in:
- *     - src/lib/internal/drag-drop/drag-session.svelte.ts
- *     - src/lib/internal/drag-drop/drag-source.svelte.ts
- *     - src/lib/internal/drag-drop/drop-target.svelte.ts
- *     - src/lib/internal/drag-drop/drop-delegate.svelte.ts
- *     - src/lib/internal/drag-drop/auto-scroll.svelte.ts
- *   Use Playwright (test:e2e) for those code paths.
- * - sortable-list-indicator.svelte is DnD-only (only visible during an active drag session)
- *   and therefore has near-zero jsdom coverage — acceptable.
- */
-import { flushSync, mount, unmount } from 'svelte';
-import { afterEach, describe, expect, it, vi } from 'vitest';
-import SortableListTest from './SortableListTest.svelte';
-// Polyfill browser event types absent from jsdom
-if (typeof PointerEvent === 'undefined') {
-    ;
-    globalThis.PointerEvent = class PointerEvent extends (MouseEvent) {
-        constructor(type, init = {}) {
-            super(type, init);
-        }
-    };
-}
-if (typeof DragEvent === 'undefined') {
-    ;
-    globalThis.DragEvent = class DragEvent extends (MouseEvent) {
-        dataTransfer;
-        constructor(type, init = {}) {
-            super(type, init);
-            this.dataTransfer = init.dataTransfer ?? null;
-        }
-    };
-}
-const DEFAULT_ITEMS = [
-    { id: 'a', label: 'A' },
-    { id: 'b', label: 'B' },
-    { id: 'c', label: 'C' },
-];
-describe('sortableList', () => {
-    let target;
-    let instance;
-    function setup(props = {}) {
-        target = document.createElement('div');
-        document.body.appendChild(target);
-        instance = mount(SortableListTest, { target, props });
-        flushSync();
-    }
-    afterEach(() => {
-        if (instance) {
-            unmount(instance);
-        }
-        instance = undefined;
-        target?.remove();
-    });
-    // ── Smoke (5) ───────────────────────────────────────────────────────────
-    it('renders the list container', () => {
-        setup();
-        expect(target.querySelector('[role="listbox"]')).toBeTruthy();
-    });
-    it('renders all three items', () => {
-        setup();
-        expect(target.querySelectorAll('[role="option"]').length).toBe(3);
-    });
-    it('each item has data-dnd-key matching its id', () => {
-        setup();
-        expect(target.querySelector('[data-dnd-key="a"]')).toBeTruthy();
-        expect(target.querySelector('[data-dnd-key="b"]')).toBeTruthy();
-        expect(target.querySelector('[data-dnd-key="c"]')).toBeTruthy();
-    });
-    it('renders a drag handle per item (3 handles)', () => {
-        setup();
-        expect(target.querySelectorAll('[data-dnd-handle]').length).toBe(3);
-    });
-    it('renders with expected sp-sortable-list class', () => {
-        setup();
-        expect(target.querySelector('.sp-sortable-list')).toBeTruthy();
-    });
-    // ── ARIA (3) ─────────────────────────────────────────────────────────────
-    it('aria-label is propagated to the container', () => {
-        setup();
-        const list = target.querySelector('[role="listbox"]');
-        expect(list?.getAttribute('aria-label')).toBe('Sortable test');
-    });
-    it('aria-orientation reflects the orientation prop', () => {
-        setup({ orientation: 'horizontal' });
-        const list = target.querySelector('[role="listbox"]');
-        expect(list?.getAttribute('aria-orientation')).toBe('horizontal');
-    });
-    it('items have role="option"', () => {
-        setup();
-        const items = target.querySelectorAll('[data-dnd-key]');
-        for (const item of items) {
-            expect(item.getAttribute('role')).toBe('option');
-        }
-    });
-    // ── Orientation (2) ──────────────────────────────────────────────────────
-    it('vertical orientation adds vertical CSS class', () => {
-        setup();
-        expect(target.querySelector('.sp-sortable-list.vertical')).toBeTruthy();
-    });
-    it('horizontal orientation adds horizontal CSS class', () => {
-        setup({ orientation: 'horizontal' });
-        expect(target.querySelector('.sp-sortable-list.horizontal')).toBeTruthy();
-    });
-    // ── Disabled (2) ─────────────────────────────────────────────────────────
-    it('disabled list still renders all items', () => {
-        setup({ disabled: true });
-        expect(target.querySelectorAll('[role="option"]').length).toBe(3);
-    });
-    it('items get aria-disabled when list is disabled', () => {
-        setup({ disabled: true });
-        const items = target.querySelectorAll('[data-dnd-key]');
-        expect(items.length).toBe(3);
-        for (const item of items) {
-            expect(item.getAttribute('aria-disabled')).toBe('true');
-        }
-    });
-    // ── Items prop / reorder (2) ──────────────────────────────────────────────
-    it('renders items in the order provided', () => {
-        setup({ items: [...DEFAULT_ITEMS] });
-        const keys = Array.from(target.querySelectorAll('[data-dnd-key]')).map((el) => el.getAttribute('data-dnd-key'));
-        expect(keys).toEqual(['a', 'b', 'c']);
-    });
-    it('re-mounting with different item order reflects new DOM order', () => {
-        setup({
-            items: [
-                { id: 'c', label: 'C' },
-                { id: 'a', label: 'A' },
-                { id: 'b', label: 'B' },
-            ],
-        });
-        const keys = Array.from(target.querySelectorAll('[data-dnd-key]')).map((el) => el.getAttribute('data-dnd-key'));
-        expect(keys).toEqual(['c', 'a', 'b']);
-    });
-    // ── Group (1) ────────────────────────────────────────────────────────────
-    it('group prop does not throw and container still has data-dnd-target', () => {
-        // Group is consumed internally for cross-list DnD context — not reflected as a DOM data-attr.
-        // The container always carries data-dnd-target.
-        expect(() => setup({ group: 'team-a' })).not.toThrow();
-        const list = target.querySelector('[role="listbox"]');
-        expect(list?.hasAttribute('data-dnd-target')).toBe(true);
-    });
-    // ── Empty state (1) ──────────────────────────────────────────────────────
-    it('renders no items when items array is empty', () => {
-        setup({ items: [] });
-        expect(target.querySelectorAll('[data-dnd-key]').length).toBe(0);
-        expect(target.querySelector('[role="listbox"]')).toBeTruthy();
-    });
-    // ── Handles (1) ──────────────────────────────────────────────────────────
-    it('handles have aria-hidden="true"', () => {
-        setup();
-        const handles = target.querySelectorAll('[data-dnd-handle]');
-        for (const handle of handles) {
-            expect(handle.getAttribute('aria-hidden')).toBe('true');
-        }
-    });
-    // ── Callbacks (1) ────────────────────────────────────────────────────────
-    it('onReorder callback prop is accepted without error', () => {
-        const onReorder = vi.fn();
-        expect(() => setup({ onReorder })).not.toThrow();
-        expect(target.querySelector('[role="listbox"]')).toBeTruthy();
-    });
-    // ── data-state (1) ───────────────────────────────────────────────────────
-    it('container starts with data-state="idle"', () => {
-        setup();
-        const list = target.querySelector('[role="listbox"]');
-        expect(list?.getAttribute('data-state')).toBe('idle');
-    });
-});

package/dist/components/splitter/__tests__/splitter.test.svelte.js

@@ -1,26 +0,0 @@
-import { mount, unmount } from 'svelte';
-import { afterEach, describe, expect, it } from 'vitest';
-import Splitter from '../splitter.svelte';
-describe('splitter', () => {
-    let target;
-    let instance;
-    function setup(props = {}) {
-        target = document.createElement('div');
-        document.body.appendChild(target);
-        instance = mount(Splitter, { target, props });
-        return target;
-    }
-    afterEach(() => {
-        if (instance)
-            unmount(instance);
-        target?.remove();
-    });
-    it('renders container', () => {
-        setup();
-        expect(target.querySelector('.sp-splitter')).toBeTruthy();
-    });
-    it('has separator role', () => {
-        setup();
-        expect(target.querySelector('[role="separator"]')).toBeTruthy();
-    });
-});

package/dist/components/switch/__tests__/switch.test.svelte.js

@@ -1,44 +0,0 @@
-import { mount, unmount } from 'svelte';
-import { afterEach, describe, expect, it } from 'vitest';
-import Switch from '../switch.svelte';
-describe('switch', () => {
-    let target;
-    let instance;
-    function setup(props = {}) {
-        target = document.createElement('div');
-        document.body.appendChild(target);
-        instance = mount(Switch, { target, props });
-        return target;
-    }
-    afterEach(() => {
-        if (instance)
-            unmount(instance);
-        target?.remove();
-    });
-    it('renders with role="switch"', () => {
-        setup();
-        expect(target.querySelector('[role="switch"]')).toBeTruthy();
-    });
-    it('has aria-checked="false" by default', () => {
-        setup();
-        expect(target.querySelector('[role="switch"]')?.getAttribute('aria-checked')).toBe('false');
-    });
-    it('has data-state="unchecked" by default', () => {
-        setup();
-        expect(target.querySelector('[role="switch"]')?.getAttribute('data-state')).toBe('unchecked');
-    });
-    it('renders disabled', () => {
-        setup({ disabled: true });
-        expect(target.querySelector('[role="switch"]')?.hasAttribute('disabled')).toBe(true);
-    });
-    it('applies aria-label for icon-only usage', () => {
-        setup({ ariaLabel: 'Toggle dark mode' });
-        expect(target.querySelector('[role="switch"]')?.getAttribute('aria-label')).toBe('Toggle dark mode');
-    });
-    it('generates hidden input when name is provided', () => {
-        setup({ name: 'darkmode', checked: true });
-        const hidden = target.querySelector('input[type="hidden"]');
-        expect(hidden).toBeTruthy();
-        expect(hidden.name).toBe('darkmode');
-    });
-});

package/dist/components/table/__tests__/table.test.svelte.js

@@ -1,22 +0,0 @@
-import { mount, unmount } from 'svelte';
-import { afterEach, describe, expect, it } from 'vitest';
-import TableRoot from '../components/table-root.svelte';
-describe('table', () => {
-    let target;
-    let instance;
-    function setup(props = {}) {
-        target = document.createElement('div');
-        document.body.appendChild(target);
-        instance = mount(TableRoot, { target, props });
-        return target;
-    }
-    afterEach(() => {
-        if (instance)
-            unmount(instance);
-        target?.remove();
-    });
-    it('renders with role=grid', () => {
-        setup();
-        expect(target.querySelector('[role="grid"]')).toBeTruthy();
-    });
-});

package/dist/components/tabs/__tests__/TabsTest.svelte

@@ -1,32 +0,0 @@
-<script lang="ts">
-  import type { TabsActivationMode, TabsListOverflow } from '../types.js'
-  import TabsContent from '../components/tabs-content.svelte'
-  import TabsList from '../components/tabs-list.svelte'
-  import TabsRoot from '../components/tabs-root.svelte'
-  import TabsTrigger from '../components/tabs-trigger.svelte'
-
-  let {
-    value = $bindable('tab1'),
-    activationMode = 'automatic' as TabsActivationMode,
-    orientation = 'horizontal' as 'horizontal' | 'vertical',
-    loop = true,
-    overflow,
-  }: {
-    value?: string
-    activationMode?: TabsActivationMode
-    orientation?: 'horizontal' | 'vertical'
-    loop?: boolean
-    overflow?: TabsListOverflow
-  } = $props()
-</script>
-
-<TabsRoot bind:value {activationMode} {orientation} {loop}>
-  <TabsList {overflow}>
-    <TabsTrigger value="tab1">Tab 1</TabsTrigger>
-    <TabsTrigger value="tab2">Tab 2</TabsTrigger>
-    <TabsTrigger value="tab3" disabled>Tab 3</TabsTrigger>
-  </TabsList>
-  <TabsContent value="tab1">Content 1</TabsContent>
-  <TabsContent value="tab2">Content 2</TabsContent>
-  <TabsContent value="tab3">Content 3</TabsContent>
-</TabsRoot>

package/dist/components/tabs/__tests__/tabs.test.svelte.js

@@ -1,227 +0,0 @@
-import { flushSync, mount, unmount } from 'svelte';
-import { afterEach, describe, expect, it, vi } from 'vitest';
-import TabsRoot from '../components/tabs-root.svelte';
-import TabsTest from './TabsTest.svelte';
-describe('tabs', () => {
-    let target;
-    let instance;
-    function setup(props = {}) {
-        target = document.createElement('div');
-        document.body.appendChild(target);
-        instance = mount(TabsTest, { target, props });
-        return target;
-    }
-    function setupRoot(props = {}) {
-        target = document.createElement('div');
-        document.body.appendChild(target);
-        instance = mount(TabsRoot, { target, props });
-        return target;
-    }
-    afterEach(() => {
-        if (instance)
-            unmount(instance);
-        target?.remove();
-    });
-    // --- Basic rendering ---
-    it('renders container', () => {
-        setupRoot();
-        expect(target.querySelector('.sp-tabs')).toBeTruthy();
-    });
-    it('renders tab list with role="tablist"', () => {
-        setup();
-        const tablist = target.querySelector('[role="tablist"]');
-        expect(tablist).toBeTruthy();
-    });
-    it('renders tab triggers with role="tab"', () => {
-        setup();
-        const tabs = target.querySelectorAll('[role="tab"]');
-        expect(tabs.length).toBe(3);
-    });
-    it('renders active content with role="tabpanel"', () => {
-        setup({ value: 'tab1' });
-        const panel = target.querySelector('[role="tabpanel"]');
-        expect(panel).toBeTruthy();
-    });
-    // --- ARIA attributes ---
-    it('tablist has aria-orientation', () => {
-        setup();
-        const tablist = target.querySelector('[role="tablist"]');
-        expect(tablist?.getAttribute('aria-orientation')).toBe('horizontal');
-    });
-    it('tablist reflects vertical orientation', () => {
-        setup({ orientation: 'vertical' });
-        const tablist = target.querySelector('[role="tablist"]');
-        expect(tablist?.getAttribute('aria-orientation')).toBe('vertical');
-    });
-    it('active tab has aria-selected="true"', () => {
-        setup({ value: 'tab1' });
-        const tabs = target.querySelectorAll('[role="tab"]');
-        expect(tabs[0]?.getAttribute('aria-selected')).toBe('true');
-        expect(tabs[1]?.getAttribute('aria-selected')).toBe('false');
-    });
-    it('active tab has tabindex=0, others have tabindex=-1', () => {
-        setup({ value: 'tab1' });
-        const tabs = target.querySelectorAll('[role="tab"]');
-        expect(tabs[0]?.getAttribute('tabindex')).toBe('0');
-        expect(tabs[1]?.getAttribute('tabindex')).toBe('-1');
-    });
-    it('disabled tab has disabled attribute', () => {
-        setup();
-        const tabs = target.querySelectorAll('[role="tab"]');
-        expect(tabs[2].disabled).toBe(true);
-    });
-    it('disabled tab has data-disabled', () => {
-        setup();
-        const tabs = target.querySelectorAll('[role="tab"]');
-        expect(tabs[2]?.hasAttribute('data-disabled')).toBe(true);
-    });
-    // --- Tab state ---
-    it('data-state="active" on selected trigger', () => {
-        setup({ value: 'tab1' });
-        const tabs = target.querySelectorAll('[role="tab"]');
-        expect(tabs[0]?.getAttribute('data-state')).toBe('active');
-        expect(tabs[1]?.getAttribute('data-state')).toBe('inactive');
-    });
-    // --- Click activation ---
-    it('clicking a tab activates it', () => {
-        setup({ value: 'tab1' });
-        const tabs = target.querySelectorAll('[role="tab"]');
-        tabs[1].click();
-        flushSync();
-        expect(tabs[1]?.getAttribute('aria-selected')).toBe('true');
-        expect(tabs[0]?.getAttribute('aria-selected')).toBe('false');
-    });
-    it('clicking a tab shows its content panel', () => {
-        setup({ value: 'tab1' });
-        const tabs = target.querySelectorAll('[role="tab"]');
-        tabs[1].click();
-        flushSync();
-        const panel = target.querySelector('[role="tabpanel"]');
-        expect(panel?.textContent).toContain('Content 2');
-    });
-    // --- Only active panel is rendered ---
-    it('only the active panel is in the DOM', () => {
-        setup({ value: 'tab1' });
-        const panels = target.querySelectorAll('[role="tabpanel"]');
-        expect(panels.length).toBe(1);
-        expect(panels[0]?.textContent).toContain('Content 1');
-    });
-    // --- Keyboard navigation (automatic mode) ---
-    it('automatic mode: arrow key changes focus and activates tab', () => {
-        setup({ value: 'tab1', activationMode: 'automatic' });
-        const tablist = target.querySelector('[role="tablist"]');
-        const tabs = target.querySelectorAll('[role="tab"]');
-        // Focus the first tab
-        tabs[0].focus();
-        flushSync();
-        // Press ArrowRight
-        tablist.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight', bubbles: true }));
-        flushSync();
-        // Tab 2 should be active (automatic mode activates on focus)
-        expect(tabs[1]?.getAttribute('aria-selected')).toBe('true');
-    });
-    // --- Manual activation mode ---
-    it('manual mode: arrow key moves focus without activating', () => {
-        setup({ value: 'tab1', activationMode: 'manual' });
-        const tablist = target.querySelector('[role="tablist"]');
-        const tabs = target.querySelectorAll('[role="tab"]');
-        // Focus the first tab
-        tabs[0].focus();
-        flushSync();
-        // Press ArrowRight — focus moves but tab1 stays active
-        tablist.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight', bubbles: true }));
-        flushSync();
-        // Tab 1 should still be selected (manual mode: focus != activation)
-        expect(tabs[0]?.getAttribute('aria-selected')).toBe('true');
-        // But focus has moved to tab2
-        expect(document.activeElement).toBe(tabs[1]);
-    });
-    // --- Orientation affects keyboard navigation direction ---
-    it('vertical orientation uses ArrowDown/ArrowUp for navigation', () => {
-        setup({ value: 'tab1', orientation: 'vertical', activationMode: 'automatic' });
-        const tablist = target.querySelector('[role="tablist"]');
-        const tabs = target.querySelectorAll('[role="tab"]');
-        tabs[0].focus();
-        flushSync();
-        // ArrowDown should navigate to next tab (vertical)
-        tablist.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown', bubbles: true }));
-        flushSync();
-        expect(tabs[1]?.getAttribute('aria-selected')).toBe('true');
-    });
-    // -------------------------------------------------------------------------
-    // overflow prop (mobile overflow strategy)
-    //
-    // Default is 'scroll' so long labels never silently truncate; consumers can
-    // opt into 'wrap' for multi-row pill layouts. When the active tab changes,
-    // the list scrolls it into view via `scrollIntoView` so the user is never
-    // looking at an out-of-viewport active tab.
-    // -------------------------------------------------------------------------
-    describe('overflow prop', () => {
-        it('default overflow="scroll" emits data-overflow="scroll" on tablist', () => {
-            setup();
-            const tablist = target.querySelector('[role="tablist"]');
-            expect(tablist.getAttribute('data-overflow')).toBe('scroll');
-        });
-        it('overflow="wrap" emits data-overflow="wrap" on tablist', () => {
-            setup({ overflow: 'wrap' });
-            const tablist = target.querySelector('[role="tablist"]');
-            expect(tablist.getAttribute('data-overflow')).toBe('wrap');
-        });
-        it('vertical + default overflow still emits data-overflow="scroll" alongside data-orientation', () => {
-            setup({ orientation: 'vertical' });
-            const tablist = target.querySelector('[role="tablist"]');
-            expect(tablist.getAttribute('data-overflow')).toBe('scroll');
-            expect(tablist.getAttribute('data-orientation')).toBe('vertical');
-        });
-        it('changing the active tab calls scrollIntoView on the newly active trigger when overflow="scroll"', () => {
-            // jsdom does not implement scrollIntoView — install a mock on the
-            // prototype so the component's call hits our spy instead of throwing.
-            const original = HTMLElement.prototype.scrollIntoView;
-            const spy = vi.fn();
-            HTMLElement.prototype.scrollIntoView = spy;
-            try {
-                setup({ value: 'tab1' });
-                const tabs = target.querySelectorAll('[role="tab"]');
-                spy.mockClear(); // ignore any call from the initial mount
-                tabs[1].click();
-                flushSync();
-                // The spy should have been called on the new active trigger with a
-                // sensible config that brings it into the viewport without scrolling
-                // the page vertically.
-                expect(spy).toHaveBeenCalled();
-                const lastCall = spy.mock.calls.at(-1);
-                const arg = lastCall?.[0];
-                expect(arg).toBeDefined();
-                expect(typeof arg).toBe('object');
-                expect(arg).toMatchObject({
-                    inline: expect.stringMatching(/^(nearest|center|start|end)$/),
-                    block: 'nearest',
-                });
-                // And the call target was the now-active trigger, not an arbitrary node.
-                const callTarget = spy.mock.contexts.at(-1);
-                expect(callTarget?.getAttribute('data-state')).toBe('active');
-            }
-            finally {
-                ;
-                HTMLElement.prototype.scrollIntoView = original;
-            }
-        });
-        it('overflow="wrap" does NOT call scrollIntoView on tab change (wrap layout shows all tabs)', () => {
-            const original = HTMLElement.prototype.scrollIntoView;
-            const spy = vi.fn();
-            HTMLElement.prototype.scrollIntoView = spy;
-            try {
-                setup({ value: 'tab1', overflow: 'wrap' });
-                const tabs = target.querySelectorAll('[role="tab"]');
-                spy.mockClear();
-                tabs[1].click();
-                flushSync();
-                expect(spy).not.toHaveBeenCalled();
-            }
-            finally {
-                ;
-                HTMLElement.prototype.scrollIntoView = original;
-            }
-        });
-    });
-});

package/dist/components/textarea/__tests__/textarea.test.svelte.js

@@ -1,55 +0,0 @@
-import { readFileSync } from 'node:fs';
-import { dirname, resolve } from 'node:path';
-import { fileURLToPath } from 'node:url';
-import { mount, unmount } from 'svelte';
-import { afterEach, describe, expect, it } from 'vitest';
-import Textarea from '../textarea.svelte';
-const componentSource = readFileSync(resolve(dirname(fileURLToPath(import.meta.url)), '../textarea.svelte'), 'utf8');
-describe('textarea', () => {
-    let target;
-    let instance;
-    function setup(props = {}) {
-        target = document.createElement('div');
-        document.body.appendChild(target);
-        instance = mount(Textarea, { target, props });
-        return target;
-    }
-    afterEach(() => {
-        if (instance)
-            unmount(instance);
-        target?.remove();
-    });
-    it('renders textarea element', () => {
-        setup();
-        expect(target.querySelector('textarea')).toBeTruthy();
-    });
-    it('sets aria-invalid', () => {
-        setup({ invalid: true });
-        expect(target.querySelector('textarea')?.getAttribute('aria-invalid')).toBe('true');
-    });
-    // ── iOS Safari focus-zoom contract ────────────────────────────────
-    // Real WebKit focus-zoom cannot be reproduced in jsdom. These tests
-    // lock the CSS contract that prevents the regression on `size="sm"` :
-    // the `sm` typography stays token-driven for desktop, and a clamp to
-    // >= 1rem is applied on coarse pointers (touch / iOS). Other sizes
-    // inherit the base 1rem and are already iOS-safe.
-    describe('iOS Safari focus-zoom contract (size="sm")', () => {
-        it('keeps fine-pointer typography on the body-medium token', () => {
-            expect(componentSource).toMatch(/\.sp-textarea\.sm\s*\{[^}]*font-size:\s*var\(--sp-sys-typescale-body-medium-size[^}]*\}/);
-        });
-        it('clamps the sm textarea to at least 1rem on coarse pointers', () => {
-            expect(componentSource).toMatch(/@media\s*\(pointer:\s*coarse\)\s*\{[\s\S]*?\.sp-textarea\.sm\s*\{[^}]*font-size:\s*max\(1rem,[^)]*\)[\s\S]*?\}/);
-        });
-        it('only the sm variant is targeted by the coarse-pointer clamp', () => {
-            // The clamp must target `.sp-textarea.sm` and only `.sp-textarea.sm`.
-            // Other sizes inherit the base 1rem and must not get an override.
-            const coarseRules = [
-                ...componentSource.matchAll(/@media\s*\(pointer:\s*coarse\)\s*\{[^}]*\{/g),
-            ];
-            expect(coarseRules.length).toBe(1);
-            expect(coarseRules[0][0]).toContain('.sp-textarea.sm');
-            expect(coarseRules[0][0]).not.toContain('.sp-textarea.md');
-            expect(coarseRules[0][0]).not.toContain('.sp-textarea.lg');
-        });
-    });
-});

package/dist/components/time-field/__tests__/TimeFieldTest.svelte

@@ -1,20 +0,0 @@
-<script lang="ts">
-  import type { TimeValue } from '../types.js'
-  import * as TimeField from '../index.js'
-
-  let {
-    value = $bindable<TimeValue | undefined>(undefined),
-    disabled = false,
-    readonly: isReadonly = false,
-    hourCycle = undefined as 12 | 24 | undefined,
-    granularity = 'minute' as 'hour' | 'minute' | 'second',
-  }: {
-    value?: TimeValue
-    disabled?: boolean
-    readonly?: boolean
-    hourCycle?: 12 | 24
-    granularity?: 'hour' | 'minute' | 'second'
-  } = $props()
-</script>
-
-<TimeField.Root bind:value {disabled} readonly={isReadonly} {hourCycle} {granularity} />