@spaethtech/svelte-ui 0.20.1-dev.103.a762c22 → 0.20.1-dev.99.8654270

package/dist/components/ContextMenu/ContextMenu.svelte

@@ -7,7 +7,6 @@
 -->
 <script lang="ts">
   import type { Snippet } from "svelte";
-  import type { HTMLAttributes } from "svelte/elements";
   import Menu from "../Menu.svelte";
   import type { MenuItem } from "../../data/table/types.js";
   import type { Variant } from "../../types/variants.js";
@@ -21,7 +20,6 @@
     disabled = false,
     class: cls = "",
     children,
-    ...rest
   }: {
     items: MenuItem[];
     size?: Responsive<Size>;
@@ -29,7 +27,7 @@
     disabled?: boolean;
     class?: string;
     children: Snippet;
-  } & Omit<HTMLAttributes<HTMLDivElement>, "class"> = $props();
+  } = $props();
 
   let open = $state(false);
   let anchorEl = $state<HTMLElement>();
@@ -46,7 +44,7 @@
 </script>
 
 <!-- svelte-ignore a11y_no_static_element_interactions -->
-<div {...rest} class="contents {cls}" oncontextmenu={onContextMenu}>
+<div class="contents {cls}" oncontextmenu={onContextMenu}>
   {@render children()}
 </div>
 

package/dist/components/ContextMenu/ContextMenu.svelte.d.ts

@@ -1,5 +1,4 @@
 import type { Snippet } from "svelte";
-import type { HTMLAttributes } from "svelte/elements";
 import type { MenuItem } from "../../data/table/types.js";
 import type { Variant } from "../../types/variants.js";
 import type { Size } from "../../types/sizes.js";
@@ -11,7 +10,7 @@ type $$ComponentProps = {
     disabled?: boolean;
     class?: string;
     children: Snippet;
-} & Omit<HTMLAttributes<HTMLDivElement>, "class">;
+};
 declare const ContextMenu: import("svelte").Component<$$ComponentProps, {}, "">;
 type ContextMenu = ReturnType<typeof ContextMenu>;
 export default ContextMenu;

package/dist/components/DataTable.svelte

@@ -13,7 +13,6 @@
   import { uiI18n } from "../i18n.js";
   const i18n = uiI18n();
   import type { Snippet } from "svelte";
-  import type { HTMLAttributes } from "svelte/elements";
   import IconDots from "~icons/mdi/dots-vertical";
   import IconBulk from "~icons/mdi/format-list-checks";
   import IconSortAsc from "~icons/mdi/sort-ascending";
@@ -51,7 +50,6 @@
     truncate = true,
     borderless = false,
     variant,
-    ...rest
   }: {
     grid: DataGrid<T>;
     selectable?: boolean;
@@ -99,7 +97,7 @@
      *  `ghost` additionally drops ALL section fills (bands + body) for a bare,
      *  see-through table. Omit for the default grey tint. */
     variant?: Variant;
-  } & Omit<HTMLAttributes<HTMLDivElement>, "class" | "style"> = $props();
+  } = $props();
 
   /** When a variant is set, override --ui-accent so the shared interactive
    *  tints re-mix from that colour (the `.ui-accent` class on the root does
@@ -230,7 +228,6 @@
 </script>
 
 <div
-  {...rest}
   role="table"
   class="ui-accent relative [color:var(--ui-color-text)]"
   style="font-size: {textVar}; {accentVar}"

package/dist/components/DataTable.svelte.d.ts

@@ -1,5 +1,4 @@
 import type { Snippet } from "svelte";
-import type { HTMLAttributes } from "svelte/elements";
 import type { MenuItem, DataGrid } from "../data/table/index.js";
 import type { Size } from "../types/sizes.js";
 import { type Responsive } from "../types/responsive.js";
@@ -52,7 +51,7 @@ declare function $$render<T>(): {
          *  `ghost` additionally drops ALL section fills (bands + body) for a bare,
          *  see-through table. Omit for the default grey tint. */
         variant?: Variant;
-    } & Omit<HTMLAttributes<HTMLDivElement>, "class" | "style">;
+    };
     exports: {};
     bindings: "";
     slots: {};

package/dist/components/DatePicker.svelte

@@ -15,7 +15,6 @@
 <script lang="ts">
   import { uiI18n } from "../i18n.js";
   const i18n = uiI18n();
-  import type { HTMLAttributes } from "svelte/elements";
   import type { Size } from "../types/sizes.js";
   import { responsiveClasses, type Responsive } from "../types/responsive.js";
   import { variantToken, type Variant } from "../types/variants.js";
@@ -28,7 +27,7 @@
   import IconClose from "~icons/mdi/close";
 
   type RangeValue = { start: string | null; end: string | null };
-  interface Props extends Omit<HTMLAttributes<HTMLDivElement>, "class"> {
+  interface Props {
     value?: string | RangeValue | null;
     range?: boolean;
     time?: boolean;
@@ -67,7 +66,6 @@
     variant = "primary",
     class: cls = "",
     name,
-    ...rest
   }: Props = $props();
 
   const accent = $derived(`var(${variantToken[variant]})`);
@@ -180,7 +178,7 @@
   }
 </script>
 
-<div {...rest} bind:this={anchorEl} class="w-full {cls}">
+<div bind:this={anchorEl} class="w-full {cls}">
   <Input
     value={label}
     readonly

package/dist/components/DatePicker.svelte.d.ts

@@ -1,4 +1,3 @@
-import type { HTMLAttributes } from "svelte/elements";
 import type { Size } from "../types/sizes.js";
 import { type Responsive } from "../types/responsive.js";
 import { type Variant } from "../types/variants.js";
@@ -7,7 +6,7 @@ type RangeValue = {
     start: string | null;
     end: string | null;
 };
-interface Props extends Omit<HTMLAttributes<HTMLDivElement>, "class"> {
+interface Props {
     value?: string | RangeValue | null;
     range?: boolean;
     time?: boolean;

package/dist/components/Divider/Divider.svelte

@@ -7,7 +7,6 @@
 -->
 <script lang="ts">
   import type { Snippet } from "svelte";
-  import type { HTMLAttributes } from "svelte/elements";
 
   let {
     orientation = "horizontal",
@@ -15,14 +14,13 @@
     labelAlign = "center",
     class: cls = "",
     children,
-    ...rest
   }: {
     orientation?: "horizontal" | "vertical";
     label?: string;
     labelAlign?: "start" | "center" | "end";
     class?: string;
     children?: Snippet;
-  } & Omit<HTMLAttributes<HTMLElement>, "class"> = $props();
+  } = $props();
 
   const hasLabel = $derived(orientation === "horizontal" && (!!label || !!children));
 </script>
@@ -32,10 +30,9 @@
     role="separator"
     aria-orientation="vertical"
     class="inline-block w-px self-stretch [background-color:var(--ui-border-color)] {cls}"
-    {...rest}
   ></div>
 {:else if hasLabel}
-  <div role="separator" aria-orientation="horizontal" class="flex items-center gap-3 {cls}" {...rest}>
+  <div role="separator" aria-orientation="horizontal" class="flex items-center gap-3 {cls}">
     {#if labelAlign !== "start"}
       <div class="h-px flex-1 [background-color:var(--ui-border-color)]"></div>
     {/if}
@@ -47,5 +44,5 @@
     {/if}
   </div>
 {:else}
-  <hr class="w-full border-0 h-px [background-color:var(--ui-border-color)] {cls}" {...rest} />
+  <hr class="w-full border-0 h-px [background-color:var(--ui-border-color)] {cls}" />
 {/if}

package/dist/components/Divider/Divider.svelte.d.ts

@@ -1,12 +1,11 @@
 import type { Snippet } from "svelte";
-import type { HTMLAttributes } from "svelte/elements";
 type $$ComponentProps = {
     orientation?: "horizontal" | "vertical";
     label?: string;
     labelAlign?: "start" | "center" | "end";
     class?: string;
     children?: Snippet;
-} & Omit<HTMLAttributes<HTMLElement>, "class">;
+};
 declare const Divider: import("svelte").Component<$$ComponentProps, {}, "">;
 type Divider = ReturnType<typeof Divider>;
 export default Divider;

package/dist/components/Drawer/Drawer.svelte

@@ -8,7 +8,6 @@
 -->
 <script lang="ts">
   import type { Snippet } from "svelte";
-  import type { HTMLAttributes } from "svelte/elements";
   import { cubicOut } from "svelte/easing";
   import type { TransitionConfig } from "svelte/transition";
   import { fade } from "svelte/transition";
@@ -33,7 +32,6 @@
     ariaLabel,
     class: cls = "",
     children,
-    ...rest
   }: {
     open?: boolean;
     side?: "left" | "right" | "top" | "bottom";
@@ -46,7 +44,7 @@
     ariaLabel?: string;
     class?: string;
     children?: Snippet;
-  } & Omit<HTMLAttributes<HTMLDivElement>, "class" | "style"> = $props();
+  } = $props();
 
   const FOCUSABLE =
     'a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])';
@@ -171,7 +169,6 @@
       ></div>
     {/if}
     <div
-      {...rest}
       bind:this={panelEl}
       class="fixed {sideClass} overflow-auto z-[10000] shadow-xl [background-color:var(--ui-color-background)] [border-color:var(--ui-border-color)] {cls}"
       style={panelStyle}

package/dist/components/Drawer/Drawer.svelte.d.ts

@@ -1,5 +1,4 @@
 import type { Snippet } from "svelte";
-import type { HTMLAttributes } from "svelte/elements";
 interface DrawerShowContext {
     panel: HTMLElement;
     autoFocus: string | HTMLElement | false;
@@ -19,7 +18,7 @@ type $$ComponentProps = {
     ariaLabel?: string;
     class?: string;
     children?: Snippet;
-} & Omit<HTMLAttributes<HTMLDivElement>, "class" | "style">;
+};
 declare const Drawer: import("svelte").Component<$$ComponentProps, {}, "open">;
 type Drawer = ReturnType<typeof Drawer>;
 export default Drawer;

package/dist/components/EmailInput.svelte

@@ -5,9 +5,8 @@
   import type { Size } from "../types/sizes.js";
   import type { Responsive } from "../types/responsive.js";
   import type { Variant } from "../types/variants.js";
-  import type { FieldChromeProps } from "./field-chrome.js";
 
-  interface Props extends Omit<HTMLInputAttributes, "type" | "size">, FieldChromeProps {
+  interface Props extends Omit<HTMLInputAttributes, "type" | "size"> {
     value: string;
     class?: string;
     inputClass?: string;

package/dist/components/EmailInput.svelte.d.ts

@@ -2,8 +2,7 @@ import type { HTMLInputAttributes } from "svelte/elements";
 import type { Size } from "../types/sizes.js";
 import type { Responsive } from "../types/responsive.js";
 import type { Variant } from "../types/variants.js";
-import type { FieldChromeProps } from "./field-chrome.js";
-interface Props extends Omit<HTMLInputAttributes, "type" | "size">, FieldChromeProps {
+interface Props extends Omit<HTMLInputAttributes, "type" | "size"> {
     value: string;
     class?: string;
     inputClass?: string;

package/dist/components/EmptyState/EmptyState.svelte

@@ -6,7 +6,6 @@
 -->
 <script lang="ts">
   import type { Snippet } from "svelte";
-  import type { HTMLAttributes } from "svelte/elements";
   import IconInbox from "~icons/mdi/inbox-outline";
   import type { Variant } from "../../types/variants.js";
   import { variantToken } from "../../types/variants.js";
@@ -22,7 +21,6 @@
     size = "md",
     class: cls = "",
     children,
-    ...rest
   }: {
     title?: string;
     description?: string;
@@ -34,7 +32,7 @@
     size?: Responsive<Size>;
     class?: string;
     children?: Snippet;
-  } & Omit<HTMLAttributes<HTMLDivElement>, "class"> = $props();
+  } = $props();
 
   const token = $derived(variantToken[variant]);
   const iconBox: Record<Size, string> = {
@@ -46,7 +44,7 @@
   const padSize: Record<Size, string> = { sm: "py-6 gap-2", md: "py-10 gap-3", lg: "py-16 gap-4" };
 </script>
 
-<div class="flex flex-col items-center text-center {responsiveClasses(size, padSize)} {cls}" {...rest}>
+<div class="flex flex-col items-center text-center {responsiveClasses(size, padSize)} {cls}">
   <div
     class="inline-flex items-center justify-center rounded-full {responsiveClasses(size, iconBox)}"
     style="background-color: color-mix(in srgb, var({token}) 14%, transparent); color: color-mix(in srgb, var({token}) var(--ui-tint-strong), var(--ui-color-text));"

package/dist/components/EmptyState/EmptyState.svelte.d.ts

@@ -1,5 +1,4 @@
 import type { Snippet } from "svelte";
-import type { HTMLAttributes } from "svelte/elements";
 import type { Variant } from "../../types/variants.js";
 import type { Size } from "../../types/sizes.js";
 import { type Responsive } from "../../types/responsive.js";
@@ -14,7 +13,7 @@ type $$ComponentProps = {
     size?: Responsive<Size>;
     class?: string;
     children?: Snippet;
-} & Omit<HTMLAttributes<HTMLDivElement>, "class">;
+};
 declare const EmptyState: import("svelte").Component<$$ComponentProps, {}, "">;
 type EmptyState = ReturnType<typeof EmptyState>;
 export default EmptyState;

package/dist/components/FileUpload/FileUpload.svelte

@@ -11,7 +11,6 @@
   const i18n = uiI18n();
   import { onDestroy, untrack } from "svelte";
   import type { Snippet } from "svelte";
-  import type { HTMLAttributes } from "svelte/elements";
   import FieldChrome, { nextFieldId } from "../FieldChrome.svelte";
   import Button from "../Button.svelte";
   import Progress from "../Progress/Progress.svelte";
@@ -40,7 +39,6 @@
     id,
     required = false,
     class: cls = "",
-    ...rest
   }: {
     files?: File[];
     accept?: string;
@@ -58,7 +56,7 @@
     id?: string;
     required?: boolean;
     class?: string;
-  } & Omit<HTMLAttributes<HTMLDivElement>, "class"> = $props();
+  } = $props();
 
   const controlId = id ?? nextFieldId();
   let inputEl = $state<HTMLInputElement>();
@@ -120,7 +118,7 @@
 
 <FieldChrome {label} {aside} error={error ?? (reject || null)} {description} {required} {controlId} {size} class={cls}>
   {#snippet control({ describedBy })}
-    <div {...rest} class="flex flex-col gap-2">
+    <div class="flex flex-col gap-2">
       <!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
       <div
         role="button"

package/dist/components/FileUpload/FileUpload.svelte.d.ts

@@ -1,5 +1,4 @@
 import type { Snippet } from "svelte";
-import type { HTMLAttributes } from "svelte/elements";
 import type { Variant } from "../../types/variants.js";
 import type { Size } from "../../types/sizes.js";
 import { type Responsive } from "../../types/responsive.js";
@@ -20,7 +19,7 @@ type $$ComponentProps = {
     id?: string;
     required?: boolean;
     class?: string;
-} & Omit<HTMLAttributes<HTMLDivElement>, "class">;
+};
 declare const FileUpload: import("svelte").Component<$$ComponentProps, {}, "files">;
 type FileUpload = ReturnType<typeof FileUpload>;
 export default FileUpload;

package/dist/components/Grid.svelte

@@ -10,7 +10,6 @@
 -->
 <script lang="ts">
   import type { Snippet } from "svelte";
-  import type { HTMLAttributes } from "svelte/elements";
   import { gridColsClass, gapClass, type Columns, type Gap } from "./field-group.js";
 
   let {
@@ -18,7 +17,6 @@
     gap = 4,
     class: cls = "",
     children,
-    ...rest
   }: {
     /** Track count — a number (1–6) or a responsive map like `{ base: 1, md: 3 }`. Default 1. */
     columns?: Columns;
@@ -26,11 +24,11 @@
     gap?: Gap;
     class?: string;
     children: Snippet;
-  } & Omit<HTMLAttributes<HTMLDivElement>, "class"> = $props();
+  } = $props();
 
   const gridClass = $derived(`grid ${gridColsClass(columns)} ${gapClass(gap, 4)}`);
 </script>
 
-<div class="{gridClass} {cls}" {...rest}>
+<div class="{gridClass} {cls}">
   {@render children()}
 </div>

package/dist/components/Grid.svelte.d.ts

@@ -1,5 +1,4 @@
 import type { Snippet } from "svelte";
-import type { HTMLAttributes } from "svelte/elements";
 import { type Columns, type Gap } from "./field-group.js";
 type $$ComponentProps = {
     /** Track count — a number (1–6) or a responsive map like `{ base: 1, md: 3 }`. Default 1. */
@@ -8,7 +7,7 @@ type $$ComponentProps = {
     gap?: Gap;
     class?: string;
     children: Snippet;
-} & Omit<HTMLAttributes<HTMLDivElement>, "class">;
+};
 declare const Grid: import("svelte").Component<$$ComponentProps, {}, "">;
 type Grid = ReturnType<typeof Grid>;
 export default Grid;

package/dist/components/Kbd/Kbd.svelte

@@ -6,7 +6,6 @@
 -->
 <script lang="ts">
   import type { Snippet } from "svelte";
-  import type { HTMLAttributes } from "svelte/elements";
   import type { Size } from "../../types/sizes.js";
   import { responsiveClasses, type Responsive } from "../../types/responsive.js";
 
@@ -16,7 +15,6 @@
     size = "md",
     class: cls = "",
     children,
-    ...rest
   }: {
     /** A combo — each string is rendered as its own keycap, joined with "+". */
     keys?: string[];
@@ -25,7 +23,7 @@
     size?: Responsive<Size>;
     class?: string;
     children?: Snippet;
-  } & Omit<HTMLAttributes<HTMLElement>, "class"> = $props();
+  } = $props();
 
   const list = $derived(keys ?? null);
 
@@ -40,7 +38,7 @@
 </script>
 
 {#if list}
-  <span class="inline-flex items-center gap-1 {cls}" {...rest}>
+  <span class="inline-flex items-center gap-1 {cls}">
     {#each list as k, i (i)}
       {#if i > 0}<span class="text-xs [color:color-mix(in_srgb,var(--ui-color-text)_50%,transparent)]"
           >+</span
@@ -49,7 +47,7 @@
     {/each}
   </span>
 {:else}
-  <kbd class="{cap} {responsiveClasses(size, capSize)} {cls}" {...rest}
+  <kbd class="{cap} {responsiveClasses(size, capSize)} {cls}"
     >{#if children}{@render children()}{:else}{text}{/if}</kbd
   >
 {/if}

package/dist/components/Kbd/Kbd.svelte.d.ts

@@ -1,5 +1,4 @@
 import type { Snippet } from "svelte";
-import type { HTMLAttributes } from "svelte/elements";
 import type { Size } from "../../types/sizes.js";
 import { type Responsive } from "../../types/responsive.js";
 type $$ComponentProps = {
@@ -10,7 +9,7 @@ type $$ComponentProps = {
     size?: Responsive<Size>;
     class?: string;
     children?: Snippet;
-} & Omit<HTMLAttributes<HTMLElement>, "class">;
+};
 declare const Kbd: import("svelte").Component<$$ComponentProps, {}, "">;
 type Kbd = ReturnType<typeof Kbd>;
 export default Kbd;

package/dist/components/List.svelte

@@ -3,7 +3,6 @@
   const i18n = uiI18n();
   import { untrack } from "svelte";
   import type { Snippet } from "svelte";
-  import type { HTMLAttributes } from "svelte/elements";
   import type { Size } from "../types/sizes.js";
   import { responsiveClasses, type Responsive } from "../types/responsive.js";
   import { variantToken, type Variant } from "../types/variants.js";
@@ -13,7 +12,7 @@
     label: string;
   };
 
-  interface Props extends Omit<HTMLAttributes<HTMLDivElement>, "class"> {
+  interface Props {
     options: Option[];
     value?: string | string[]; // Bindable selected value - string[] when multiSelect is true
     multiSelect?: boolean; // Enable multi-select mode
@@ -82,7 +81,6 @@
     onLoadStart,
     onLoadEnd,
     onSelection,
-    ...rest
   }: Props = $props();
 
   // Size axis (see types/sizes.ts): option text scales with the trigger (forwarded by Select).
@@ -501,7 +499,7 @@
   });
 </script>
 
-<div class="relative {className}" {...rest}>
+<div class="relative {className}">
   <div class="relative">
     <div
       bind:this={listElement}

package/dist/components/List.svelte.d.ts

@@ -1,5 +1,4 @@
 import type { Snippet } from "svelte";
-import type { HTMLAttributes } from "svelte/elements";
 import type { Size } from "../types/sizes.js";
 import { type Responsive } from "../types/responsive.js";
 import { type Variant } from "../types/variants.js";
@@ -7,7 +6,7 @@ type Option = Record<string, any> & {
     value: string;
     label: string;
 };
-interface Props extends Omit<HTMLAttributes<HTMLDivElement>, "class"> {
+interface Props {
     options: Option[];
     value?: string | string[];
     multiSelect?: boolean;

package/dist/components/Menu.svelte

@@ -8,7 +8,6 @@
  */
 -->
 <script lang="ts">
-  import type { HTMLAttributes } from "svelte/elements";
   import Popup from "./Popup.svelte";
   import type { Side, Align, Boundary } from "../positioning/anchored.js";
   import type { MenuItem, MenuAction, MenuSeparator } from "../data/table/types.js";
@@ -25,7 +24,6 @@
     boundary = "viewport",
     size = "md",
     variant,
-    ...rest
   }: {
     anchor: HTMLElement | undefined;
     open?: boolean;
@@ -37,7 +35,7 @@
     /** Tints the highlighted item with a semantic colour (via `.ui-accent` / `--ui-accent`) instead
      *  of neutral grey. Omit for the default. */
     variant?: Variant;
-  } & Omit<HTMLAttributes<HTMLElement>, "class" | "style"> = $props();
+  } = $props();
 
   let active = $state(-1);
   const isSeparator = (i: MenuItem): i is MenuSeparator => "divider" in i;
@@ -89,7 +87,6 @@
 <Popup {anchor} bind:open {side} {align} {boundary}>
   <!-- svelte-ignore a11y_no_noninteractive_tabindex -->
   <ul
-    {...rest}
     role="menu"
     tabindex="0"
     {onkeydown}

package/dist/components/Menu.svelte.d.ts

@@ -1,4 +1,3 @@
-import type { HTMLAttributes } from "svelte/elements";
 import type { Side, Align, Boundary } from "../positioning/anchored.js";
 import type { MenuItem } from "../data/table/types.js";
 import type { Size } from "../types/sizes.js";
@@ -15,7 +14,7 @@ type $$ComponentProps = {
     /** Tints the highlighted item with a semantic colour (via `.ui-accent` / `--ui-accent`) instead
      *  of neutral grey. Omit for the default. */
     variant?: Variant;
-} & Omit<HTMLAttributes<HTMLElement>, "class" | "style">;
+};
 declare const Menu: import("svelte").Component<$$ComponentProps, {}, "open">;
 type Menu = ReturnType<typeof Menu>;
 export default Menu;

package/dist/components/NumberInput.svelte

@@ -11,9 +11,8 @@
   import type { Size } from "../types/sizes.js";
   import type { Responsive } from "../types/responsive.js";
   import type { Variant } from "../types/variants.js";
-  import type { FieldChromeProps } from "./field-chrome.js";
 
-  interface Props extends Omit<HTMLInputAttributes, "type" | "value" | "size">, FieldChromeProps {
+  interface Props extends Omit<HTMLInputAttributes, "type" | "value" | "size"> {
     value: number | null;
     class?: string;
     inputClass?: string;

package/dist/components/NumberInput.svelte.d.ts

@@ -2,8 +2,7 @@ import type { HTMLInputAttributes } from "svelte/elements";
 import type { Size } from "../types/sizes.js";
 import type { Responsive } from "../types/responsive.js";
 import type { Variant } from "../types/variants.js";
-import type { FieldChromeProps } from "./field-chrome.js";
-interface Props extends Omit<HTMLInputAttributes, "type" | "value" | "size">, FieldChromeProps {
+interface Props extends Omit<HTMLInputAttributes, "type" | "value" | "size"> {
     value: number | null;
     class?: string;
     inputClass?: string;

package/dist/components/Pagination/Pagination.svelte

@@ -10,7 +10,6 @@
 <script lang="ts">
   import { uiI18n } from "../../i18n.js";
   const i18n = uiI18n();
-  import type { HTMLAttributes } from "svelte/elements";
   import Button from "../Button.svelte";
   import Select from "../Select.svelte";
   import NumberInput from "../NumberInput.svelte";
@@ -35,7 +34,6 @@
     borderless = false,
     disabled = false,
     class: cls = "",
-    ...rest
   }: {
     page?: number;
     total: number;
@@ -54,7 +52,7 @@
     borderless?: boolean;
     disabled?: boolean;
     class?: string;
-  } & Omit<HTMLAttributes<HTMLElement>, "class" | "style"> = $props();
+  } = $props();
 
   const pageCount = $derived(Math.max(1, Math.ceil((total || 0) / (perPage || 1))));
   // Keep `page` in range as total/perPage change.
@@ -108,7 +106,6 @@
 
 <nav
   aria-label={i18n.messages.pagination}
-  {...rest}
   class="ui-accent flex flex-wrap items-center justify-between gap-3 border rounded-[var(--ui-border-radius)] {bandPad} {cls}"
   style="border-color: {bandBorder}; background-color: {bandBg}; {accentVar}"
 >

package/dist/components/Pagination/Pagination.svelte.d.ts

@@ -1,4 +1,3 @@
-import type { HTMLAttributes } from "svelte/elements";
 import type { Variant } from "../../types/variants.js";
 import type { Size } from "../../types/sizes.js";
 import { type Responsive } from "../../types/responsive.js";
@@ -20,7 +19,7 @@ type $$ComponentProps = {
     borderless?: boolean;
     disabled?: boolean;
     class?: string;
-} & Omit<HTMLAttributes<HTMLElement>, "class" | "style">;
+};
 declare const Pagination: import("svelte").Component<$$ComponentProps, {}, "perPage" | "page">;
 type Pagination = ReturnType<typeof Pagination>;
 export default Pagination;

package/dist/components/PasswordInput.svelte

@@ -6,9 +6,8 @@
   import type { Size } from "../types/sizes.js";
   import type { Responsive } from "../types/responsive.js";
   import type { Variant } from "../types/variants.js";
-  import type { FieldChromeProps } from "./field-chrome.js";
 
-  interface Props extends Omit<HTMLInputAttributes, "type" | "size">, FieldChromeProps {
+  interface Props extends Omit<HTMLInputAttributes, "type" | "size"> {
     value: string;
     class?: string;
     inputClass?: string;