@spectral_labs/ui 1.2.0 → 1.3.0

package/dist/components/hover-card/components/hover-card-trigger.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hover-card-trigger.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/hover-card/components/hover-card-trigger.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,aAAa,CAAA;AAyBxD,QAAA,MAAM,gBAAgB,2DAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"hover-card-trigger.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/hover-card/components/hover-card-trigger.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,aAAa,CAAA;AAwBxD,QAAA,MAAM,gBAAgB,2DAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}

package/dist/components/indicator/indicator.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { IndicatorProps } from './types.js'
 
   const { status = 'neutral', label, class: className, children }: IndicatorProps = $props()
@@ -6,14 +6,14 @@
 
 <span
   class="sp-indicator {status} {className ?? ''}"
-  role='status'
-  aria-live='polite'
+  role="status"
+  aria-live="polite"
   aria-label={label}
   data-status={status}
 >
-  <span class='sp-indicator-dot'></span>
+  <span class="sp-indicator-dot"></span>
   {#if children}
-    <span class='sp-indicator-label'>{@render children()}</span>
+    <span class="sp-indicator-label">{@render children()}</span>
   {/if}
 </span>
 

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

@@ -1,6 +1,10 @@
+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 Input from '../input.svelte';
+const componentSource = readFileSync(resolve(dirname(fileURLToPath(import.meta.url)), '../input.svelte'), 'utf8');
 describe('input', () => {
     let target;
     let instance;
@@ -35,4 +39,29 @@ describe('input', () => {
         setup({ placeholder: 'Enter email' });
         expect(target.querySelector('input')?.getAttribute('placeholder')).toBe('Enter email');
     });
+    // ── 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-input\.sm\s*\{[^}]*font-size:\s*var\(--sp-sys-typescale-body-medium-size[^}]*\}/);
+        });
+        it('clamps the sm input to at least 1rem on coarse pointers', () => {
+            expect(componentSource).toMatch(/@media\s*\(pointer:\s*coarse\)\s*\{[\s\S]*?\.sp-input\.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-input.sm` and only `.sp-input.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-input.sm');
+            expect(coarseRules[0][0]).not.toContain('.sp-input.md');
+            expect(coarseRules[0][0]).not.toContain('.sp-input.lg');
+        });
+    });
 });

package/dist/components/input/input.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { InputProps } from './types.js'
 
   let {
@@ -26,7 +26,8 @@
   .sp-input {
     display: block;
     width: 100%;
-    border: var(--sp-comp-input-outline-width, 1px) solid var(--sp-comp-input-outline-color, var(--sp-sys-color-outline));
+    border: var(--sp-comp-input-outline-width, 1px) solid
+      var(--sp-comp-input-outline-color, var(--sp-sys-color-outline));
     background-color: var(--sp-comp-input-container-color, transparent);
     color: var(--sp-comp-input-text-color, var(--sp-sys-color-on-surface));
     caret-color: var(--sp-comp-input-caret-color, currentColor);
@@ -48,6 +49,19 @@
     font-size: var(--sp-sys-typescale-body-medium-size, 0.875rem);
   }
 
+  /* iOS Safari focus zoom : WebKit auto-zooms the viewport when a focused
+     form control's computed font-size is < 16px. The `sm` size renders
+     at `body-medium` (14px by default), which crosses that threshold.
+     Clamp to at least 1rem on coarse pointers (touch / iOS) so dense
+     forms on mobile stay usable; `max()` preserves any theme that may
+     override `--sp-sys-typescale-body-medium-size` upward. Other sizes
+     inherit the base 1rem and are already iOS-safe. */
+  @media (pointer: coarse) {
+    .sp-input.sm {
+      font-size: max(1rem, var(--sp-sys-typescale-body-medium-size, 0.875rem));
+    }
+  }
+
   .sp-input.md {
     height: calc(48px + var(--sp-sys-density-offset, 0px));
   }
@@ -65,19 +79,22 @@
     /* Compensate for the extra border pixels so the element doesn't shift.
        Works out to `1rem - 1px` by default; 0 when outline tokens are equal (e.g. both 0). */
     padding-inline: calc(
-      1rem - (var(--sp-comp-input-focus-outline-width, 2px) - var(--sp-comp-input-outline-width, 1px))
+      1rem -
+        (var(--sp-comp-input-focus-outline-width, 2px) - var(--sp-comp-input-outline-width, 1px))
     );
   }
 
   .sp-input.sm:focus {
     padding-inline: calc(
-      0.75rem - (var(--sp-comp-input-focus-outline-width, 2px) - var(--sp-comp-input-outline-width, 1px))
+      0.75rem -
+        (var(--sp-comp-input-focus-outline-width, 2px) - var(--sp-comp-input-outline-width, 1px))
     );
   }
 
   .sp-input.lg:focus {
     padding-inline: calc(
-      1.25rem - (var(--sp-comp-input-focus-outline-width, 2px) - var(--sp-comp-input-outline-width, 1px))
+      1.25rem -
+        (var(--sp-comp-input-focus-outline-width, 2px) - var(--sp-comp-input-outline-width, 1px))
     );
   }
 

package/dist/components/label/label.svelte

@@ -1,11 +1,10 @@
-<script lang='ts'>
+<script lang="ts">
   import type { LabelProps } from './types.js'
 
   const { class: className, children, ...restProps }: LabelProps = $props()
 
   function onmousedown(event: MouseEvent) {
-    if (event.detail > 1)
-      event.preventDefault()
+    if (event.detail > 1) event.preventDefault()
   }
 </script>
 

package/dist/components/label/label.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"label.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/label/label.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAqB7C,QAAA,MAAM,KAAK,gDAAwC,CAAC;AACpD,KAAK,KAAK,GAAG,UAAU,CAAC,OAAO,KAAK,CAAC,CAAC;AACtC,eAAe,KAAK,CAAC"}
+{"version":3,"file":"label.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/label/label.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAoB7C,QAAA,MAAM,KAAK,gDAAwC,CAAC;AACpD,KAAK,KAAK,GAAG,UAAU,CAAC,OAAO,KAAK,CAAC,CAAC;AACtC,eAAe,KAAK,CAAC"}

package/dist/components/language-select/__tests__/languages.test.js

@@ -1,12 +1,12 @@
 import { describe, expect, it } from 'vitest';
-import { getLanguage, getLanguages, LANGUAGES, } from '../../../internal/i18n/languages.js';
+import { getLanguage, getLanguages, LANGUAGES } from '../../../internal/i18n/languages.js';
 describe('i18n/languages', () => {
     describe('languages list', () => {
         it('contains the 16 curated languages', () => {
             expect(LANGUAGES).toHaveLength(16);
         });
         it('exposes valid BCP 47 codes', () => {
-            const codes = LANGUAGES.map(l => l.code);
+            const codes = LANGUAGES.map((l) => l.code);
             expect(codes).toEqual([
                 'en',
                 'fr',
@@ -27,9 +27,9 @@ describe('i18n/languages', () => {
             ]);
         });
         it('marks ar and ur as rtl and the rest as ltr', () => {
-            const rtl = LANGUAGES.filter(l => l.dir === 'rtl').map(l => l.code);
+            const rtl = LANGUAGES.filter((l) => l.dir === 'rtl').map((l) => l.code);
             expect(rtl).toEqual(['ar', 'ur']);
-            const ltr = LANGUAGES.filter(l => l.dir === 'ltr').map(l => l.code);
+            const ltr = LANGUAGES.filter((l) => l.dir === 'ltr').map((l) => l.code);
             expect(ltr).toHaveLength(14);
         });
         it('has a non-empty nativeName and englishName for each entry', () => {
@@ -42,22 +42,22 @@ describe('i18n/languages', () => {
             expect(Object.isFrozen(LANGUAGES)).toBe(true);
         });
         it('has no duplicate codes', () => {
-            const codes = LANGUAGES.map(l => l.code);
+            const codes = LANGUAGES.map((l) => l.code);
             expect(new Set(codes).size).toBe(codes.length);
         });
     });
     describe('getLanguages', () => {
         it('returns the requested subset in the requested order', () => {
             const result = getLanguages(['fr', 'en', 'de']);
-            expect(result.map(l => l.code)).toEqual(['fr', 'en', 'de']);
+            expect(result.map((l) => l.code)).toEqual(['fr', 'en', 'de']);
         });
         it('preserves user-specified order even when reversed vs LANGUAGES', () => {
             const result = getLanguages(['de', 'en', 'fr']);
-            expect(result.map(l => l.code)).toEqual(['de', 'en', 'fr']);
+            expect(result.map((l) => l.code)).toEqual(['de', 'en', 'fr']);
         });
         it('silently drops unknown codes', () => {
             const result = getLanguages(['fr', 'xx', 'en']);
-            expect(result.map(l => l.code)).toEqual(['fr', 'en']);
+            expect(result.map((l) => l.code)).toEqual(['fr', 'en']);
         });
         it('returns [] for an empty input', () => {
             expect(getLanguages([])).toEqual([]);

package/dist/components/language-select/language-select.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { LanguageOption } from '../../internal/i18n/languages.js'
   import type { LanguageSelectProps } from './types.js'
   import { LANGUAGES } from '../../internal/i18n/languages.js'
@@ -23,9 +23,8 @@
   // ── Shared helpers ────────────────────────────────────────────────────────
 
   function nativeNameFor(code: string | undefined): string {
-    if (!code)
-      return ''
-    return items.find(l => l.code === code)?.nativeName ?? ''
+    if (!code) return ''
+    return items.find((l) => l.code === code)?.nativeName ?? ''
   }
 
   // ── Combobox variant — composite value trick ─────────────────────────────
@@ -48,9 +47,8 @@
   }
 
   function compositeFor(code: string | undefined): string {
-    if (!code)
-      return ''
-    const item = items.find(l => l.code === code)
+    if (!code) return ''
+    const item = items.find((l) => l.code === code)
     return item ? toComposite(item) : ''
   }
 
@@ -72,44 +70,36 @@
   // External `value` → internal state, only when value genuinely changed
   // from outside (i.e. differs from the last code we synced).
   $effect(() => {
-    if (value === lastExternalCode)
-      return
+    if (value === lastExternalCode) return
     lastExternalCode = value
     if (variant === 'select') {
       const v = value ?? ''
-      if (selectValue !== v)
-        selectValue = v
-    }
-    else {
+      if (selectValue !== v) selectValue = v
+    } else {
       const expected = compositeFor(value)
-      if (compositeValue !== expected)
-        compositeValue = expected
+      if (compositeValue !== expected) compositeValue = expected
       searchQuery = nativeNameFor(value)
     }
   })
 
   // Internal state → external `value`, only when user interaction moved it.
   $effect(() => {
-    if (variant !== 'select')
-      return
+    if (variant !== 'select') return
     const code: string | undefined = selectValue || undefined
     if (code !== lastExternalCode) {
       lastExternalCode = code
       value = code
-      if (code !== undefined)
-        onValueChange?.(code)
+      if (code !== undefined) onValueChange?.(code)
     }
   })
 
   $effect(() => {
-    if (variant !== 'combobox')
-      return
+    if (variant !== 'combobox') return
     const code: string | undefined = codeOf(compositeValue) || undefined
     if (code !== lastExternalCode) {
       lastExternalCode = code
       value = code
-      if (code !== undefined)
-        onValueChange?.(code)
+      if (code !== undefined) onValueChange?.(code)
     }
   })
 
@@ -118,8 +108,7 @@
     // the input reflects the current selection even though search is empty.
     if (open) {
       searchQuery = ''
-    }
-    else {
+    } else {
       const code = codeOf(compositeValue)
       searchQuery = nativeNameFor(code)
     }
@@ -128,25 +117,24 @@
 
 <div class="sp-language-select {className ?? ''}">
   {#if label}
-    <span class='sp-language-select-label'>{label}</span>
+    <span class="sp-language-select-label">{label}</span>
   {/if}
 
   {#if variant === 'select'}
     <Select.Root bind:value={selectValue} {disabled} {name}>
-      <Select.Trigger
-        placeholder={placeholder || 'Select a language'}
-        aria-label={label}
-      >
+      <Select.Trigger placeholder={placeholder || 'Select a language'} aria-label={label}>
         {#if value && nativeNameFor(value)}
-          <span class='sp-language-select-native sp-select-value' dir='auto'>{nativeNameFor(value)}</span>
+          <span class="sp-language-select-native sp-select-value" dir="auto"
+            >{nativeNameFor(value)}</span
+          >
         {:else}
-          <span class='sp-select-value placeholder'>{placeholder || 'Select a language'}</span>
+          <span class="sp-select-value placeholder">{placeholder || 'Select a language'}</span>
         {/if}
       </Select.Trigger>
       <Select.Content {side} {sideOffset} {align}>
         {#each items as item (item.code)}
           <Select.Item value={item.code} label={item.nativeName}>
-            <span class='sp-language-select-native' dir='auto'>{item.nativeName}</span>
+            <span class="sp-language-select-native" dir="auto">{item.nativeName}</span>
           </Select.Item>
         {/each}
       </Select.Content>
@@ -165,14 +153,14 @@
       <Combobox.Content {side} {sideOffset} {align}>
         {#each items as item (item.code)}
           <Combobox.Item value={toComposite(item)}>
-            <span class='sp-language-select-native' dir='auto'>{item.nativeName}</span>
+            <span class="sp-language-select-native" dir="auto">{item.nativeName}</span>
           </Combobox.Item>
         {/each}
       </Combobox.Content>
     </Combobox.Root>
 
     {#if name && value}
-      <input type='hidden' {name} {value} />
+      <input type="hidden" {name} {value} />
     {/if}
   {/if}
 </div>

package/dist/components/language-select/language-select.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"language-select.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/language-select/language-select.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAA;AAiLrD,QAAA,MAAM,cAAc,8DAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}
+{"version":3,"file":"language-select.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/language-select/language-select.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAA;AAsKrD,QAAA,MAAM,cAAc,8DAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}

package/dist/components/link-preview/__tests__/LinkPreviewTest.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import LinkPreviewContent from '../components/link-preview-content.svelte'
   import LinkPreviewRoot from '../components/link-preview-root.svelte'
   import LinkPreviewTrigger from '../components/link-preview-trigger.svelte'
@@ -29,7 +29,7 @@
 
 <div bind:this={rootEl}>
   <LinkPreviewRoot {openDelay} {closeDelay}>
-    <LinkPreviewTrigger href='https://example.com'>Example Link</LinkPreviewTrigger>
+    <LinkPreviewTrigger href="https://example.com">Example Link</LinkPreviewTrigger>
     <LinkPreviewContent {disablePortal} class={contentClass}>
       <p>Preview of example.com</p>
     </LinkPreviewContent>

package/dist/components/link-preview/__tests__/link-preview.a11y.test.js

@@ -5,7 +5,11 @@ import * as matchers from 'vitest-axe/matchers';
 import LinkPreviewTest from './LinkPreviewTest.svelte';
 expect.extend(matchers);
 const axe = configureAxe({
-    rules: { 'region': { enabled: false }, 'page-has-heading-one': { enabled: false }, 'landmark-one-main': { enabled: false } },
+    rules: {
+        region: { enabled: false },
+        'page-has-heading-one': { enabled: false },
+        'landmark-one-main': { enabled: false },
+    },
 });
 describe('link-preview a11y', () => {
     let cleanup;

package/dist/components/link-preview/__tests__/link-preview.test.svelte.js

@@ -191,7 +191,10 @@ describe('link-preview', () => {
         vi.useFakeTimers();
         const localTarget = document.createElement('div');
         document.body.appendChild(localTarget);
-        const localInstance = mount(LinkPreviewTest, { target: localTarget, props: { openDelay: 0, closeDelay: 0 } });
+        const localInstance = mount(LinkPreviewTest, {
+            target: localTarget,
+            props: { openDelay: 0, closeDelay: 0 },
+        });
         flushSync();
         try {
             const trigger = localTarget.querySelector('.sp-link-preview-trigger');

package/dist/components/link-preview/components/link-preview-content.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { LinkPreviewContentProps } from '../types.js'
   import { EscapeLayerState } from '../../../internal/escape-layer/index.js'
   import { FloatingLayerState } from '../../../internal/floating-layer/index.js'
@@ -20,7 +20,9 @@
   let contentEl: HTMLElement | undefined = $state()
 
   const presence = new PresenceLayerState({
-    get present() { return ctx.open },
+    get present() {
+      return ctx.open
+    },
   })
 
   const escapeLayer = new EscapeLayerState({
@@ -33,9 +35,15 @@
   const floating = new FloatingLayerState({
     reference: null,
     floating: null,
-    get side() { return side },
-    get sideOffset() { return sideOffset },
-    get align() { return align },
+    get side() {
+      return side
+    },
+    get sideOffset() {
+      return sideOffset
+    },
+    get align() {
+      return align
+    },
     avoidCollisions: true,
   })
 
@@ -67,7 +75,7 @@
       bind:this={contentEl}
       class="sp-link-preview-content {className ?? ''}"
       id={ctx.contentId}
-      role='dialog'
+      role="dialog"
       tabindex={-1}
       data-state={ctx.open ? 'open' : 'closed'}
       data-side={side}
@@ -92,7 +100,8 @@
     pointer-events: auto;
     transition:
       opacity var(--sp-sys-motion-duration-medium1, 250ms) var(--sp-sys-motion-easing-effects, ease),
-      transform var(--sp-sys-motion-duration-medium1, 250ms) var(--sp-sys-motion-easing-emphasized, ease);
+      transform var(--sp-sys-motion-duration-medium1, 250ms)
+        var(--sp-sys-motion-easing-emphasized, ease);
   }
 
   .sp-link-preview-content[data-state='closed'] {

package/dist/components/link-preview/components/link-preview-content.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"link-preview-content.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/link-preview/components/link-preview-content.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAA;AAmF1D,QAAA,MAAM,kBAAkB,6DAAwC,CAAC;AACjE,KAAK,kBAAkB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAChE,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"link-preview-content.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/link-preview/components/link-preview-content.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAA;AA2F1D,QAAA,MAAM,kBAAkB,6DAAwC,CAAC;AACjE,KAAK,kBAAkB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAChE,eAAe,kBAAkB,CAAC"}

package/dist/components/link-preview/components/link-preview-root.svelte

@@ -1,8 +1,13 @@
-<script lang='ts'>
+<script lang="ts">
   import type { LinkPreviewProps } from '../types.js'
   import { createLinkPreviewIds, setLinkPreviewContext } from '../link-preview.svelte.js'
 
-  const { openDelay = 700, closeDelay = 300, class: className, children }: LinkPreviewProps = $props()
+  const {
+    openDelay = 700,
+    closeDelay = 300,
+    class: className,
+    children,
+  }: LinkPreviewProps = $props()
 
   const ids = createLinkPreviewIds()
   let open = $state(false)

package/dist/components/link-preview/components/link-preview-root.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"link-preview-root.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/link-preview/components/link-preview-root.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AA4DnD,QAAA,MAAM,eAAe,sDAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}
+{"version":3,"file":"link-preview-root.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/link-preview/components/link-preview-root.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAiEnD,QAAA,MAAM,eAAe,sDAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/components/link-preview/components/link-preview-trigger.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { LinkPreviewTriggerProps } from '../types.js'
   import { GraceAreaState } from '../../../internal/grace-area/index.js'
   import { isBrowser } from '../../../internal/helpers/index.js'
@@ -10,9 +10,15 @@
   let el: HTMLElement | undefined = $state()
 
   const graceArea = new GraceAreaState({
-    get triggerElement() { return el ?? null },
-    get contentElement() { return ctx.contentEl },
-    get enabled() { return ctx.open },
+    get triggerElement() {
+      return el ?? null
+    },
+    get contentElement() {
+      return ctx.contentEl
+    },
+    get enabled() {
+      return ctx.open
+    },
   })
 
   let graceAreaListener: (() => void) | null = null
@@ -24,8 +30,7 @@
       cleanupGraceListener()
       const handler = (e: MouseEvent) => {
         const point = { x: e.clientX, y: e.clientY }
-        if (graceArea.isPointInGraceArea(point))
-          return
+        if (graceArea.isPointInGraceArea(point)) return
         cleanupGraceListener()
         ctx.hide()
       }
@@ -38,8 +43,7 @@
           ctx.hide()
         }
       }, 500)
-    }
-    else {
+    } else {
       ctx.hide()
     }
   }
@@ -53,13 +57,11 @@
   }
 
   $effect(() => {
-    if (el)
-      ctx.setTriggerEl(el)
+    if (el) ctx.setTriggerEl(el)
   })
 
   $effect(() => {
-    if (!ctx.open)
-      cleanupGraceListener()
+    if (!ctx.open) cleanupGraceListener()
   })
 </script>
 
@@ -67,7 +69,7 @@
   bind:this={el}
   class="sp-link-preview-trigger {className ?? ''}"
   {href}
-  aria-haspopup='dialog'
+  aria-haspopup="dialog"
   aria-expanded={ctx.open}
   aria-controls={ctx.open ? ctx.contentId : undefined}
   onmouseenter={() => {

package/dist/components/link-preview/components/link-preview-trigger.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"link-preview-trigger.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/link-preview/components/link-preview-trigger.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAA;AA+E1D,QAAA,MAAM,kBAAkB,6DAAwC,CAAC;AACjE,KAAK,kBAAkB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAChE,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"link-preview-trigger.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/link-preview/components/link-preview-trigger.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAA;AAiF1D,QAAA,MAAM,kBAAkB,6DAAwC,CAAC;AACjE,KAAK,kBAAkB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAChE,eAAe,kBAAkB,CAAC"}

package/dist/components/link-preview/index.d.ts

@@ -1,5 +1,5 @@
 export { default as Content } from './components/link-preview-content.svelte';
 export { default as Root } from './components/link-preview-root.svelte';
 export { default as Trigger } from './components/link-preview-trigger.svelte';
-export type { LinkPreviewContentProps, LinkPreviewProps, LinkPreviewTriggerProps, } from './types.js';
+export type { LinkPreviewContentProps, LinkPreviewProps, LinkPreviewTriggerProps } from './types.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/link-preview/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/components/link-preview/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,0CAA0C,CAAA;AAC7E,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,uCAAuC,CAAA;AACvE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,0CAA0C,CAAA;AAC7E,YAAY,EACV,uBAAuB,EACvB,gBAAgB,EAChB,uBAAuB,GACxB,MAAM,YAAY,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/components/link-preview/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,0CAA0C,CAAA;AAC7E,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,uCAAuC,CAAA;AACvE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,0CAA0C,CAAA;AAC7E,YAAY,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAA"}

package/dist/components/list/components/list-item.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { ListItemProps } from '../types.js'
 
   const {
@@ -25,13 +25,13 @@
   data-state={active ? 'active' : undefined}
 >
   {#if leading}
-    <span class='sp-list-item-leading'>{@render leading()}</span>
+    <span class="sp-list-item-leading">{@render leading()}</span>
   {/if}
-  <span class='sp-list-item-content'>
+  <span class="sp-list-item-content">
     {#if children}{@render children()}{/if}
   </span>
   {#if trailing}
-    <span class='sp-list-item-trailing'>{@render trailing()}</span>
+    <span class="sp-list-item-trailing">{@render trailing()}</span>
   {/if}
 </li>
 

package/dist/components/list/components/list-root.svelte

@@ -1,10 +1,10 @@
-<script lang='ts'>
+<script lang="ts">
   import type { ListProps } from '../types.js'
 
   const { density = 'standard', class: className, children }: ListProps = $props()
 </script>
 
-<ul class="sp-list {density} {className ?? ''}" role='list' data-density={density}>
+<ul class="sp-list {density} {className ?? ''}" role="list" data-density={density}>
   {#if children}{@render children()}{/if}
 </ul>
 

package/dist/components/menubar/__tests__/MenubarTest.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import DropdownMenuItem from '../../dropdown-menu/components/dropdown-menu-item.svelte'
   import DropdownMenuSeparator from '../../dropdown-menu/components/dropdown-menu-separator.svelte'
   import MenubarContent from '../components/menubar-content.svelte'
@@ -6,11 +6,11 @@
   import MenubarRoot from '../components/menubar-root.svelte'
   import MenubarTrigger from '../components/menubar-trigger.svelte'
 
-  const { loop = true, portalTo }: { loop?: boolean, portalTo?: HTMLElement | string } = $props()
+  const { loop = true, portalTo }: { loop?: boolean; portalTo?: HTMLElement | string } = $props()
 </script>
 
 <MenubarRoot {loop}>
-  <MenubarMenu value='file'>
+  <MenubarMenu value="file">
     <MenubarTrigger>File</MenubarTrigger>
     <MenubarContent {portalTo}>
       <DropdownMenuItem>New</DropdownMenuItem>
@@ -19,14 +19,14 @@
       <DropdownMenuItem>Save</DropdownMenuItem>
     </MenubarContent>
   </MenubarMenu>
-  <MenubarMenu value='edit'>
+  <MenubarMenu value="edit">
     <MenubarTrigger>Edit</MenubarTrigger>
     <MenubarContent {portalTo}>
       <DropdownMenuItem>Undo</DropdownMenuItem>
       <DropdownMenuItem>Redo</DropdownMenuItem>
     </MenubarContent>
   </MenubarMenu>
-  <MenubarMenu value='view'>
+  <MenubarMenu value="view">
     <MenubarTrigger>View</MenubarTrigger>
     <MenubarContent {portalTo}>
       <DropdownMenuItem>Zoom In</DropdownMenuItem>