@spectral_labs/ui 1.1.2 → 1.2.1

package/dist/components/sheet/components/sheet-overlay.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SheetOverlayProps } from '../types.js'
   import { PresenceLayerState } from '../../../internal/presence-layer/index.js'
   import { getSheetContext } from '../sheet.svelte.js'
@@ -7,14 +7,15 @@
   const ctx = getSheetContext()
 
   const presence = new PresenceLayerState({
-    get present() { return ctx.open },
+    get present() {
+      return ctx.open
+    },
   })
 
   let overlayEl: HTMLElement | undefined = $state()
 
   $effect(() => {
-    if (overlayEl)
-      presence.setElement(overlayEl)
+    if (overlayEl) presence.setElement(overlayEl)
   })
 </script>
 
@@ -24,7 +25,7 @@
     class="sp-sheet-overlay {className ?? ''}"
     data-state={ctx.open ? 'open' : 'closed'}
     onclick={() => ctx.close()}
-    aria-hidden='true'
+    aria-hidden="true"
   ></div>
 {/if}
 
@@ -35,7 +36,8 @@
     z-index: 50;
     background-color: var(--sp-comp-sheet-overlay-color, var(--sp-sys-color-scrim));
     opacity: var(--sp-comp-sheet-overlay-opacity, 0.32);
-    transition: opacity var(--sp-sys-motion-duration-medium2, 300ms) var(--sp-sys-motion-easing-effects, ease);
+    transition: opacity var(--sp-sys-motion-duration-medium2, 300ms)
+      var(--sp-sys-motion-easing-effects, ease);
   }
 
   .sp-sheet-overlay[data-state='closed'] {

package/dist/components/sheet/components/sheet-overlay.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sheet-overlay.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sheet/components/sheet-overlay.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAA;AAgCpD,QAAA,MAAM,YAAY,uDAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}
+{"version":3,"file":"sheet-overlay.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sheet/components/sheet-overlay.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAA;AAiCpD,QAAA,MAAM,YAAY,uDAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}

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

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SheetProps } from '../types.js'
   import { createSheetIds, setSheetContext } from '../sheet.svelte.js'
 
@@ -7,7 +7,9 @@
   const ids = createSheetIds()
 
   setSheetContext({
-    get open() { return open },
+    get open() {
+      return open
+    },
     ...ids,
     toggle() {
       open = !open

package/dist/components/sheet/components/sheet-root.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sheet-root.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sheet/components/sheet-root.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AA+B7C,QAAA,MAAM,SAAS,oDAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}
+{"version":3,"file":"sheet-root.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sheet/components/sheet-root.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAiC7C,QAAA,MAAM,SAAS,oDAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}

package/dist/components/sheet/components/sheet-title.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SheetTitleProps } from '../types.js'
   import { getSheetContext } from '../sheet.svelte.js'
 
@@ -6,7 +6,11 @@
   const ctx = getSheetContext()
 </script>
 
-<svelte:element this={`h${level}` as const} class="sp-sheet-title {className ?? ''}" id={ctx.titleId}>
+<svelte:element
+  this={`h${level}` as const}
+  class="sp-sheet-title {className ?? ''}"
+  id={ctx.titleId}
+>
   {#if children}{@render children()}{/if}
 </svelte:element>
 
@@ -17,10 +21,7 @@
       --sp-comp-sheet-title-font,
       var(--sp-sys-typescale-headline-small-font, inherit)
     );
-    font-size: var(
-      --sp-comp-sheet-title-size,
-      var(--sp-sys-typescale-headline-small-size, 1.5rem)
-    );
+    font-size: var(--sp-comp-sheet-title-size, var(--sp-sys-typescale-headline-small-size, 1.5rem));
     font-weight: var(--sp-sys-typescale-headline-small-weight, 400);
     line-height: var(--sp-sys-typescale-headline-small-line-height, 2rem);
     color: var(--sp-comp-sheet-title-color, var(--sp-sys-color-on-surface));

package/dist/components/sheet/components/sheet-trigger.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SheetTriggerProps } from '../types.js'
   import { getSheetContext } from '../sheet.svelte.js'
 
@@ -8,8 +8,8 @@
 
 <button
   class="sp-sheet-trigger {className ?? ''}"
-  type='button'
-  aria-haspopup='dialog'
+  type="button"
+  aria-haspopup="dialog"
   aria-expanded={ctx.open}
   aria-controls={ctx.contentId}
   onclick={() => ctx.toggle()}

package/dist/components/side-sheet/__tests__/side-sheet.test.svelte.js

@@ -5,13 +5,15 @@ import SideSheet from '../side-sheet.svelte';
 // pointerdown events (the dismissible layer listens to these).
 beforeAll(() => {
     if (typeof globalThis.PointerEvent === 'undefined') {
+        ;
         globalThis.PointerEvent = class PointerEvent extends MouseEvent {
             pointerId;
             pointerType;
             constructor(type, init = {}) {
                 super(type, init);
                 this.pointerId = init.pointerId ?? 0;
-                this.pointerType = init.pointerType ?? 'mouse';
+                this.pointerType =
+                    init.pointerType ?? 'mouse';
             }
         };
     }

package/dist/components/side-sheet/side-sheet.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SideSheetProps } from './types.js'
   import { DismissibleLayerState } from '../../internal/dismissible-layer/index.js'
   import { EscapeLayerState } from '../../internal/escape-layer/index.js'
@@ -69,8 +69,8 @@
 {#if open}
   {#if mode === 'modal'}
     <div
-      class='sp-side-sheet-overlay'
-      aria-hidden='true'
+      class="sp-side-sheet-overlay"
+      aria-hidden="true"
       onclick={() => {
         open = false
         onOpenChange?.(false)
@@ -80,10 +80,10 @@
   <div
     bind:this={contentEl}
     class="sp-side-sheet {placement} {mode} {className ?? ''}"
-    role='dialog'
+    role="dialog"
     aria-modal={mode === 'modal' || undefined}
     tabindex={mode === 'modal' ? -1 : undefined}
-    data-state='open'
+    data-state="open"
     data-placement={placement}
     data-mode={mode}
   >

package/dist/components/sidebar/__tests__/SidebarFullTest.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import * as Sidebar from '../index.js'
 
   let {
@@ -16,7 +16,7 @@
 <Sidebar.Provider bind:open>
   <Sidebar.Root {collapsible}>
     <Sidebar.Header>
-      <h2 data-testid='sidebar-header'>App</h2>
+      <h2 data-testid="sidebar-header">App</h2>
     </Sidebar.Header>
     <Sidebar.Content>
       <Sidebar.Group>
@@ -24,10 +24,10 @@
         <Sidebar.GroupContent>
           <Sidebar.Menu>
             <Sidebar.MenuItem>
-              <Sidebar.MenuButton data-testid='menu-home'>Home</Sidebar.MenuButton>
+              <Sidebar.MenuButton data-testid="menu-home">Home</Sidebar.MenuButton>
             </Sidebar.MenuItem>
             <Sidebar.MenuItem>
-              <Sidebar.MenuButton data-testid='menu-settings'>Settings</Sidebar.MenuButton>
+              <Sidebar.MenuButton data-testid="menu-settings">Settings</Sidebar.MenuButton>
             </Sidebar.MenuItem>
           </Sidebar.Menu>
         </Sidebar.GroupContent>
@@ -35,11 +35,11 @@
       <Sidebar.Separator />
     </Sidebar.Content>
     <Sidebar.Footer>
-      <span data-testid='sidebar-footer'>Footer</span>
+      <span data-testid="sidebar-footer">Footer</span>
     </Sidebar.Footer>
   </Sidebar.Root>
-  <Sidebar.Trigger data-testid='sidebar-trigger'>Toggle</Sidebar.Trigger>
+  <Sidebar.Trigger data-testid="sidebar-trigger">Toggle</Sidebar.Trigger>
   <Sidebar.Inset>
-    <main data-testid='inset-content'>Page content</main>
+    <main data-testid="inset-content">Page content</main>
   </Sidebar.Inset>
 </Sidebar.Provider>

package/dist/components/sidebar/__tests__/SidebarTest.svelte

@@ -1,9 +1,9 @@
-<script lang='ts'>
+<script lang="ts">
   import SidebarProvider from '../components/sidebar-provider.svelte'
 
   let { open = $bindable(true) } = $props()
 </script>
 
 <SidebarProvider bind:open>
-  <div data-testid='child'>content</div>
+  <div data-testid="child">content</div>
 </SidebarProvider>

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

@@ -22,7 +22,7 @@ function setupMatchMedia() {
             listenerRegistry.get(type)?.delete(handler);
         }),
         dispatchEvent: vi.fn((event) => {
-            listenerRegistry.get(event.type)?.forEach(h => h(event));
+            listenerRegistry.get(event.type)?.forEach((h) => h(event));
             return true;
         }),
     };
@@ -55,10 +55,12 @@ describe('sidebar', () => {
         target = document.createElement('div');
         document.body.appendChild(target);
         instance = mount(SidebarTest, { target });
-        const addCallsBefore = matchMediaStub.mql.addEventListener.mock.calls.length;
+        const addCallsBefore = matchMediaStub.mql.addEventListener.mock
+            .calls.length;
         unmount(instance);
         instance = undefined;
-        const removeCalls = matchMediaStub.mql.removeEventListener.mock.calls.length;
+        const removeCalls = matchMediaStub.mql.removeEventListener.mock
+            .calls.length;
         expect(removeCalls).toBeGreaterThanOrEqual(addCallsBefore);
     });
 });
@@ -172,11 +174,13 @@ describe('sidebar full', () => {
     });
     it('cleans up MediaQueryList listeners on unmount (P0 regression check)', () => {
         setup();
-        const addedBefore = matchMediaStub.mql.addEventListener.mock.calls.length;
+        const addedBefore = matchMediaStub.mql.addEventListener.mock.calls
+            .length;
         if (instance)
             unmount(instance);
         instance = undefined;
-        const removeCalls = matchMediaStub.mql.removeEventListener.mock.calls.length;
+        const removeCalls = matchMediaStub.mql.removeEventListener.mock
+            .calls.length;
         expect(removeCalls).toBeGreaterThanOrEqual(addedBefore);
     });
 });

package/dist/components/sidebar/components/sidebar-content.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarContentProps } from '../types.js'
 
   const { class: className, children }: SidebarContentProps = $props()

package/dist/components/sidebar/components/sidebar-footer.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarFooterProps } from '../types.js'
 
   const { class: className, children }: SidebarFooterProps = $props()

package/dist/components/sidebar/components/sidebar-group-content.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarGroupContentProps } from '../types.js'
 
   const { class: className, children }: SidebarGroupContentProps = $props()

package/dist/components/sidebar/components/sidebar-group-label.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarGroupLabelProps } from '../types.js'
 
   const { class: className, children }: SidebarGroupLabelProps = $props()

package/dist/components/sidebar/components/sidebar-group.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarGroupProps } from '../types.js'
 
   const { class: className, children }: SidebarGroupProps = $props()

package/dist/components/sidebar/components/sidebar-header.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarHeaderProps } from '../types.js'
 
   const { class: className, children }: SidebarHeaderProps = $props()

package/dist/components/sidebar/components/sidebar-inset.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarInsetProps } from '../types.js'
 
   const { class: className, children }: SidebarInsetProps = $props()

package/dist/components/sidebar/components/sidebar-menu-action.svelte

@@ -1,11 +1,16 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarMenuActionProps } from '../types.js'
 
-  const { showOnHover = false, class: className, children, ...restProps }: SidebarMenuActionProps = $props()
+  const {
+    showOnHover = false,
+    class: className,
+    children,
+    ...restProps
+  }: SidebarMenuActionProps = $props()
 </script>
 
 <button
-  type='button'
+  type="button"
   class="sp-sidebar-menu-action {className ?? ''}"
   class:show-on-hover={showOnHover}
   {...restProps}
@@ -25,7 +30,9 @@
     padding: 0.25rem;
     border-radius: var(--sp-sys-shape-corner-xs, 4px);
     flex-shrink: 0;
-    transition: color 0.1s, background 0.1s;
+    transition:
+      color 0.1s,
+      background 0.1s;
   }
 
   .sp-sidebar-menu-action:hover {

package/dist/components/sidebar/components/sidebar-menu-action.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar-menu-action.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/components/sidebar-menu-action.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAgB1D,QAAA,MAAM,iBAAiB,4DAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"sidebar-menu-action.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/components/sidebar-menu-action.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAqB1D,QAAA,MAAM,iBAAiB,4DAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}

package/dist/components/sidebar/components/sidebar-menu-button.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarMenuButtonProps } from '../types.js'
   import { getSidebarContext } from '../sidebar.svelte.js'
 
@@ -15,7 +15,7 @@
 </script>
 
 <button
-  type='button'
+  type="button"
   class="sp-sidebar-menu-button {size} {className ?? ''}"
   data-active={isActive || undefined}
   data-sidebar-state={ctx.state}
@@ -83,8 +83,12 @@
     padding: 0.375rem;
   }
 
-  :global(.sp-sidebar[data-collapsible='icon'][data-state='collapsed']) .sp-sidebar-menu-button :global(span),
-  :global(.sp-sidebar[data-collapsible='icon'][data-state='collapsed']) .sp-sidebar-menu-button :global(.sp-sidebar-menu-button-text) {
+  :global(.sp-sidebar[data-collapsible='icon'][data-state='collapsed'])
+    .sp-sidebar-menu-button
+    :global(span),
+  :global(.sp-sidebar[data-collapsible='icon'][data-state='collapsed'])
+    .sp-sidebar-menu-button
+    :global(.sp-sidebar-menu-button-text) {
     display: none;
   }
 

package/dist/components/sidebar/components/sidebar-menu-item.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarMenuItemProps } from '../types.js'
 
   const { class: className, children, ...restProps }: SidebarMenuItemProps = $props()

package/dist/components/sidebar/components/sidebar-menu-sub-button.svelte

@@ -1,11 +1,11 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarMenuSubButtonProps } from '../types.js'
 
   const { isActive = false, class: className, children }: SidebarMenuSubButtonProps = $props()
 </script>
 
 <button
-  type='button'
+  type="button"
   class="sp-sidebar-menu-sub-button {className ?? ''}"
   data-active={isActive || undefined}
 >
@@ -31,7 +31,9 @@
     text-overflow: ellipsis;
     text-align: start;
     text-decoration: none;
-    transition: background-color 0.1s, color 0.1s;
+    transition:
+      background-color 0.1s,
+      color 0.1s;
   }
 
   .sp-sidebar-menu-sub-button:hover {

package/dist/components/sidebar/components/sidebar-menu-sub-item.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarMenuSubItemProps } from '../types.js'
 
   const { class: className, children }: SidebarMenuSubItemProps = $props()

package/dist/components/sidebar/components/sidebar-menu-sub.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarMenuSubProps } from '../types.js'
 
   const { class: className, children }: SidebarMenuSubProps = $props()

package/dist/components/sidebar/components/sidebar-menu.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarMenuProps } from '../types.js'
 
   const { class: className, children }: SidebarMenuProps = $props()

package/dist/components/sidebar/components/sidebar-provider.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarProviderProps } from '../types.js'
   import { createSidebar, setSidebarContext } from '../sidebar.svelte.js'
 
@@ -10,7 +10,9 @@
   }: SidebarProviderProps = $props()
 
   const { context } = createSidebar({
-    get open() { return open },
+    get open() {
+      return open
+    },
     onOpenChange: (value) => {
       open = value
       onOpenChange?.(value)
@@ -23,7 +25,7 @@
 <div
   class="sp-sidebar-provider {className ?? ''}"
   data-sidebar-state={context.state}
-  style='--sidebar-width: 16rem; --sidebar-width-icon: 3rem;'
+  style="--sidebar-width: 16rem; --sidebar-width-icon: 3rem;"
 >
   {#if children}{@render children()}{/if}
 </div>

package/dist/components/sidebar/components/sidebar-provider.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar-provider.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/components/sidebar-provider.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAA;AAiCvD,QAAA,MAAM,eAAe,8DAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}
+{"version":3,"file":"sidebar-provider.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/components/sidebar-provider.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAA;AAmCvD,QAAA,MAAM,eAAe,8DAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

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

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarRootProps } from '../types.js'
   import { getSidebarContext } from '../sidebar.svelte.js'
 
@@ -23,7 +23,7 @@
     data-collapsible={collapsible}
     data-side={side}
   >
-    <div class='sp-sidebar-inner'>
+    <div class="sp-sidebar-inner">
       {#if children}{@render children()}{/if}
     </div>
   </aside>
@@ -39,7 +39,8 @@
     flex-shrink: 0;
     background: var(--sp-sidebar-bg);
     border-right: 1px solid var(--sp-sys-color-outline-variant);
-    transition: width var(--sp-sys-motion-duration-medium2, 300ms) var(--sp-sys-motion-easing-standard, ease);
+    transition: width var(--sp-sys-motion-duration-medium2, 300ms)
+      var(--sp-sys-motion-easing-standard, ease);
     overflow: hidden;
   }
 
@@ -74,7 +75,8 @@
       bottom: 0;
       z-index: 40;
       width: var(--sidebar-width, 16rem) !important;
-      transition: transform var(--sp-sys-motion-duration-medium2, 300ms) var(--sp-sys-motion-easing-standard, ease);
+      transition: transform var(--sp-sys-motion-duration-medium2, 300ms)
+        var(--sp-sys-motion-easing-standard, ease);
     }
 
     .sp-sidebar[data-side='left'] {

package/dist/components/sidebar/components/sidebar-separator.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarSeparatorProps } from '../types.js'
 
   const { class: className }: SidebarSeparatorProps = $props()

package/dist/components/sidebar/components/sidebar-trigger.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SidebarTriggerProps } from '../types.js'
   import { getSidebarContext } from '../sidebar.svelte.js'
 
@@ -7,7 +7,7 @@
 </script>
 
 <button
-  type='button'
+  type="button"
   class="sp-sidebar-trigger {className ?? ''}"
   aria-label={ctx.open ? 'Close sidebar' : 'Open sidebar'}
   onclick={() => ctx.toggle()}
@@ -15,9 +15,17 @@
   {#if children}
     {@render children()}
   {:else}
-    <svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' aria-hidden='true'>
-      <rect x='3' y='3' width='18' height='18' rx='2' />
-      <path d='M9 3v18' />
+    <svg
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      aria-hidden="true"
+    >
+      <rect x="3" y="3" width="18" height="18" rx="2" />
+      <path d="M9 3v18" />
     </svg>
   {/if}
 </button>

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

@@ -1 +1 @@
-{"version":3,"file":"sidebar.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/sidebar/sidebar.svelte.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAQ9C,MAAM,WAAW,cAAc;IAC7B,8CAA8C;IAC9C,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAA;IACtB,6BAA6B;IAC7B,QAAQ,CAAC,KAAK,EAAE,YAAY,CAAA;IAC5B,0CAA0C;IAC1C,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAA;IAC1B,kCAAkC;IAClC,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,+BAA+B;IAC/B,OAAO,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;CAClC;AAED,wBAAgB,iBAAiB,CAAC,GAAG,EAAE,cAAc,GAAG,IAAI,CAE3D;AAED,wBAAgB,iBAAiB,IAAI,cAAc,CAElD;AAED,oDAAoD;AACpD,wBAAgB,UAAU,IAAI,cAAc,CAE3C;AAID,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;CACvC;AAED,wBAAgB,aAAa,CAAC,IAAI,EAAE,oBAAoB;;;;EAqCvD"}
+{"version":3,"file":"sidebar.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/sidebar/sidebar.svelte.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAQ9C,MAAM,WAAW,cAAc;IAC7B,8CAA8C;IAC9C,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAA;IACtB,6BAA6B;IAC7B,QAAQ,CAAC,KAAK,EAAE,YAAY,CAAA;IAC5B,0CAA0C;IAC1C,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAA;IAC1B,kCAAkC;IAClC,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,+BAA+B;IAC/B,OAAO,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;CAClC;AAED,wBAAgB,iBAAiB,CAAC,GAAG,EAAE,cAAc,GAAG,IAAI,CAE3D;AAED,wBAAgB,iBAAiB,IAAI,cAAc,CAElD;AAED,oDAAoD;AACpD,wBAAgB,UAAU,IAAI,cAAc,CAE3C;AAID,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;CACvC;AAED,wBAAgB,aAAa,CAAC,IAAI,EAAE,oBAAoB;;;;EA0CvD"}

package/dist/components/sidebar/sidebar.svelte.js

@@ -38,9 +38,15 @@ export function createSidebar(opts) {
         };
     });
     const context = {
-        get open() { return opts.open; },
-        get state() { return opts.open ? 'expanded' : 'collapsed'; },
-        get isMobile() { return _isMobile; },
+        get open() {
+            return opts.open;
+        },
+        get state() {
+            return opts.open ? 'expanded' : 'collapsed';
+        },
+        get isMobile() {
+            return _isMobile;
+        },
         toggle() {
             opts.onOpenChange?.(!opts.open);
         },

package/dist/components/simple-dialog/__tests__/SimpleDialogTest.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import { SimpleDialog } from '../index.js'
 
   let {
@@ -20,10 +20,10 @@
   } = $props()
 </script>
 
-<div data-testid='harness'>
-  <button type='button' data-testid='toggle' onclick={() => (open = !open)}>Toggle</button>
+<div data-testid="harness">
+  <button type="button" data-testid="toggle" onclick={() => (open = !open)}>Toggle</button>
 
   <SimpleDialog {open} {title} {description} {confirmText} {cancelText} {onConfirm} {onCancel}>
-    <p data-testid='body'>dialog body content</p>
+    <p data-testid="body">dialog body content</p>
   </SimpleDialog>
 </div>

package/dist/components/simple-dialog/simple-dialog.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import type { SimpleDialogProps } from './types.js'
   import DialogContent from '../dialog/components/dialog-content.svelte'
   import DialogDescription from '../dialog/components/dialog-description.svelte'
@@ -38,14 +38,14 @@
       <DialogDescription>{description}</DialogDescription>
     {/if}
     {#if children}
-      <div class='sp-simple-dialog-body'>{@render children()}</div>
+      <div class="sp-simple-dialog-body">{@render children()}</div>
     {/if}
-    <div class='sp-simple-dialog-actions'>
-      <button class='sp-simple-dialog-btn cancel' type='button' onclick={cancel}
-      >{cancelText}</button
+    <div class="sp-simple-dialog-actions">
+      <button class="sp-simple-dialog-btn cancel" type="button" onclick={cancel}
+        >{cancelText}</button
       >
-      <button class='sp-simple-dialog-btn confirm' type='button' onclick={confirm}
-      >{confirmText}</button
+      <button class="sp-simple-dialog-btn confirm" type="button" onclick={confirm}
+        >{confirmText}</button
       >
     </div>
   </DialogContent>

package/dist/components/simple-tooltip/__tests__/SimpleTooltipTest.svelte

@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import { SimpleTooltip } from '../index.js'
 
   const {
@@ -15,5 +15,5 @@
 </script>
 
 <SimpleTooltip {text} {side} {openDelay} {closeDelay}>
-  <button type='button' data-testid='trigger'>hover me</button>
+  <button type="button" data-testid="trigger">hover me</button>
 </SimpleTooltip>