@sveltia/ui 0.3.2 → 0.5.0

package/package/components/menu/menu-item-group.svelte.d.ts

@@ -2,10 +2,10 @@
 /** @typedef {typeof __propDef.events}  MenuItemGroupEvents */
 /** @typedef {typeof __propDef.slots}  MenuItemGroupSlots */
 /** A menu item group. */
-export default class MenuItemGroup extends SvelteComponentTyped<{
+export default class MenuItemGroup extends SvelteComponent<{
     [x: string]: any;
-    title?: string;
     class?: string;
+    title?: string;
     ariaLabel?: string;
 }, {
     [evt: string]: CustomEvent<any>;
@@ -16,12 +16,12 @@ export default class MenuItemGroup extends SvelteComponentTyped<{
 export type MenuItemGroupProps = typeof __propDef.props;
 export type MenuItemGroupEvents = typeof __propDef.events;
 export type MenuItemGroupSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        title?: string;
         class?: string;
+        title?: string;
         ariaLabel?: string;
     };
     events: {

package/package/components/menu/menu-item-radio.svelte.d.ts

@@ -6,7 +6,7 @@
  * `<MenuItemGroup>` component.
  * @see https://w3c.github.io/aria/#menuitemradio
  */
-export default class MenuItemRadio extends SvelteComponentTyped<{
+export default class MenuItemRadio extends SvelteComponent<{
     [x: string]: any;
     class?: string;
 }, {
@@ -20,7 +20,7 @@ export default class MenuItemRadio extends SvelteComponentTyped<{
 export type MenuItemRadioProps = typeof __propDef.props;
 export type MenuItemRadioEvents = typeof __propDef.events;
 export type MenuItemRadioSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;

package/package/components/menu/menu-item.svelte.d.ts

@@ -5,10 +5,10 @@
  * A menu item widget.
  * @see https://w3c.github.io/aria/#menuitem
  */
-export default class MenuItem extends SvelteComponentTyped<{
+export default class MenuItem extends SvelteComponent<{
     [x: string]: any;
-    label?: string;
     class?: string;
+    label?: string;
     role?: "menuitem" | "menuitemcheckbox" | "menuitemradio";
     checked?: boolean;
     iconName?: string;
@@ -24,12 +24,12 @@ export default class MenuItem extends SvelteComponentTyped<{
 export type MenuItemProps = typeof __propDef.props;
 export type MenuItemEvents = typeof __propDef.events;
 export type MenuItemSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        label?: string;
         class?: string;
+        label?: string;
         role?: ('menuitem' | 'menuitemcheckbox' | 'menuitemradio');
         checked?: boolean;
         iconName?: string;

package/package/components/menu/menu.svelte.d.ts

@@ -6,7 +6,7 @@
  * @see https://w3c.github.io/aria/#menu
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/menubar/
  */
-export default class Menu extends SvelteComponentTyped<{
+export default class Menu extends SvelteComponent<{
     [x: string]: any;
     class?: string;
     element?: HTMLElement;
@@ -25,7 +25,7 @@ export default class Menu extends SvelteComponentTyped<{
 export type MenuProps = typeof __propDef.props;
 export type MenuEvents = typeof __propDef.events;
 export type MenuSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;

package/package/components/radio/radio-group.svelte

@@ -27,6 +27,7 @@
   tabindex="-1"
   role="radiogroup"
   aria-orientation={orientation}
+  {...$$restProps}
   bind:this={element}
   on:select
   use:activateGroup

package/package/components/radio/radio-group.svelte.d.ts

@@ -6,7 +6,8 @@
  * @see https://w3c.github.io/aria/#radiogroup
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/radio/
  */
-export default class RadioGroup extends SvelteComponentTyped<{
+export default class RadioGroup extends SvelteComponent<{
+    [x: string]: any;
     class?: string;
     element?: HTMLElement;
     orientation?: "vertical" | "horizontal";
@@ -21,9 +22,10 @@ export default class RadioGroup extends SvelteComponentTyped<{
 export type RadioGroupProps = typeof __propDef.props;
 export type RadioGroupEvents = typeof __propDef.events;
 export type RadioGroupSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
+        [x: string]: any;
         class?: string;
         element?: HTMLElement | null;
         orientation?: ('horizontal' | 'vertical');

package/package/components/radio/radio.svelte

@@ -42,9 +42,10 @@
   <input type="hidden" {name} {value} />
 {/if}
 
-<!-- svelte-ignore a11y-click-events-have-key-events -->
 <span
   class="sui radio {className}"
+  role="none"
+  {...$$restProps}
   on:click={(event) => {
     if (!(/** @type {HTMLElement} */ (event.target).matches('button'))) {
       buttonComponent.element.click();

package/package/components/radio/radio.svelte.d.ts

@@ -7,12 +7,13 @@
  * @see https://w3c.github.io/aria/#radio
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/radio/
  */
-export default class Radio extends SvelteComponentTyped<{
+export default class Radio extends SvelteComponent<{
+    [x: string]: any;
+    class?: string;
+    name?: string;
     label?: string;
     disabled?: boolean;
-    name?: string;
     value?: string;
-    class?: string;
     selected?: boolean;
 }, {
     [evt: string]: CustomEvent<any>;
@@ -23,14 +24,15 @@ export default class Radio extends SvelteComponentTyped<{
 export type RadioProps = typeof __propDef.props;
 export type RadioEvents = typeof __propDef.events;
 export type RadioSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
+        [x: string]: any;
+        class?: string;
+        name?: string;
         label?: string | null;
         disabled?: boolean;
-        name?: string;
         value?: string | null;
-        class?: string;
         selected?: boolean;
     };
     events: {

package/package/components/select/combobox.svelte

@@ -54,7 +54,7 @@
   let isPopupOpen = writable(false);
 </script>
 
-<div class="sui combobox {className}">
+<div class="sui combobox {className}" {...$$restProps}>
   {#if readOnly}
     <div
       class:selected={value !== undefined}

package/package/components/select/combobox.svelte.d.ts

@@ -6,13 +6,13 @@
  * @see https://w3c.github.io/aria/#combobox
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/combobox/
  */
-export default class Combobox extends SvelteComponentTyped<{
+export default class Combobox extends SvelteComponent<{
     [x: string]: any;
+    class?: string;
     label?: string;
     position?: PopupPosition;
     disabled?: boolean;
     value?: string | number;
-    class?: string;
     readOnly?: boolean;
 }, {
     change: CustomEvent<any>;
@@ -25,15 +25,18 @@ export default class Combobox extends SvelteComponentTyped<{
 export type ComboboxProps = typeof __propDef.props;
 export type ComboboxEvents = typeof __propDef.events;
 export type ComboboxSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
-    props: {
+    /**
+       * Where to show the dropdown menu.
+       * @type {PopupPosition}
+       */ props: {
         [x: string]: any;
+        class?: string;
         label?: string;
         position?: PopupPosition;
         disabled?: boolean;
         value?: (string | number | undefined);
-        class?: string;
         readOnly?: boolean;
     };
     events: {

package/package/components/select/select.svelte.d.ts

@@ -6,11 +6,11 @@
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select
  * @see https://w3c.github.io/aria/#combobox
  */
-export default class Select extends SvelteComponentTyped<{
+export default class Select extends SvelteComponent<{
     [x: string]: any;
+    class?: string;
     label?: string;
     value?: string;
-    class?: string;
 }, {
     change: CustomEvent<any>;
 } & {
@@ -22,13 +22,13 @@ export default class Select extends SvelteComponentTyped<{
 export type SelectProps = typeof __propDef.props;
 export type SelectEvents = typeof __propDef.events;
 export type SelectSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
+        class?: string;
         label?: string;
         value?: string | null;
-        class?: string;
     };
     events: {
         change: CustomEvent<any>;

package/package/components/slider/slider.svelte

@@ -215,11 +215,15 @@
   }}
 />
 
-<!-- svelte-ignore a11y-click-events-have-key-events -->
-<div class="sui slider {className}" on:click|preventDefault|stopPropagation>
-  <!-- svelte-ignore a11y-click-events-have-key-events -->
+<div
+  class="sui slider {className}"
+  role="none"
+  {...$$restProps}
+  on:click|preventDefault|stopPropagation
+>
   <div
     class="base"
+    role="none"
     bind:this={base}
     on:click|preventDefault|stopPropagation={(event) => {
       onClick(event);

package/package/components/slider/slider.svelte.d.ts

@@ -9,9 +9,10 @@
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/slider/
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/slider-multithumb/
  */
-export default class Slider extends SvelteComponentTyped<{
-    value?: number;
+export default class Slider extends SvelteComponent<{
+    [x: string]: any;
     class?: string;
+    value?: number;
     sliderLabel?: string;
     values?: [number, number];
     sliderLabels?: [string, string];
@@ -29,11 +30,12 @@ export default class Slider extends SvelteComponentTyped<{
 export type SliderProps = typeof __propDef.props;
 export type SliderEvents = typeof __propDef.events;
 export type SliderSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
-        value?: number;
+        [x: string]: any;
         class?: string;
+        value?: number;
         sliderLabel?: string;
         values?: [number, number];
         sliderLabels?: [string, string];

package/package/components/switch/switch.svelte

@@ -26,6 +26,7 @@
   role="switch"
   aria-disabled={disabled}
   aria-checked={checked}
+  {...$$restProps}
   on:click={() => {
     checked = !checked;
   }}

package/package/components/switch/switch.svelte.d.ts

@@ -6,10 +6,11 @@
  * @see https://w3c.github.io/aria/#switch
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/switch/
  */
-export default class Switch extends SvelteComponentTyped<{
+export default class Switch extends SvelteComponent<{
+    [x: string]: any;
+    class?: string;
     label?: string;
     disabled?: boolean;
-    class?: string;
     checked?: boolean;
 }, {
     [evt: string]: CustomEvent<any>;
@@ -20,12 +21,13 @@ export default class Switch extends SvelteComponentTyped<{
 export type SwitchProps = typeof __propDef.props;
 export type SwitchEvents = typeof __propDef.events;
 export type SwitchSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
+        [x: string]: any;
+        class?: string;
         label?: string;
         disabled?: boolean;
-        class?: string;
         checked?: boolean;
     };
     events: {

package/package/components/table/table-body.svelte.d.ts

@@ -6,7 +6,7 @@
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/tbody
  * @see https://w3c.github.io/aria/#rowgroup
  */
-export default class TableBody extends SvelteComponentTyped<{
+export default class TableBody extends SvelteComponent<{
     [x: string]: any;
     class?: string;
 }, {
@@ -18,7 +18,7 @@ export default class TableBody extends SvelteComponentTyped<{
 export type TableBodyProps = typeof __propDef.props;
 export type TableBodyEvents = typeof __propDef.events;
 export type TableBodySlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;

package/package/components/table/table-cell.svelte.d.ts

@@ -6,7 +6,7 @@
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/td
  * @see https://w3c.github.io/aria/#gridcell
  */
-export default class TableCell extends SvelteComponentTyped<{
+export default class TableCell extends SvelteComponent<{
     [x: string]: any;
     class?: string;
 }, {
@@ -18,7 +18,7 @@ export default class TableCell extends SvelteComponentTyped<{
 export type TableCellProps = typeof __propDef.props;
 export type TableCellEvents = typeof __propDef.events;
 export type TableCellSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;

package/package/components/table/table-col-header.svelte.d.ts

@@ -6,7 +6,7 @@
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th
  * @see https://w3c.github.io/aria/#columnheader
  */
-export default class TableColHeader extends SvelteComponentTyped<{
+export default class TableColHeader extends SvelteComponent<{
     [x: string]: any;
     class?: string;
 }, {
@@ -18,7 +18,7 @@ export default class TableColHeader extends SvelteComponentTyped<{
 export type TableColHeaderProps = typeof __propDef.props;
 export type TableColHeaderEvents = typeof __propDef.events;
 export type TableColHeaderSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;

package/package/components/table/table-foot.svelte.d.ts

@@ -6,7 +6,7 @@
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/tfoot
  * @see https://w3c.github.io/aria/#rowgroup
  */
-export default class TableFoot extends SvelteComponentTyped<{
+export default class TableFoot extends SvelteComponent<{
     [x: string]: any;
     class?: string;
 }, {
@@ -18,7 +18,7 @@ export default class TableFoot extends SvelteComponentTyped<{
 export type TableFootProps = typeof __propDef.props;
 export type TableFootEvents = typeof __propDef.events;
 export type TableFootSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;

package/package/components/table/table-head.svelte.d.ts

@@ -6,7 +6,7 @@
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/thead
  * @see https://w3c.github.io/aria/#rowgroup
  */
-export default class TableHead extends SvelteComponentTyped<{
+export default class TableHead extends SvelteComponent<{
     [x: string]: any;
     class?: string;
 }, {
@@ -18,7 +18,7 @@ export default class TableHead extends SvelteComponentTyped<{
 export type TableHeadProps = typeof __propDef.props;
 export type TableHeadEvents = typeof __propDef.events;
 export type TableHeadSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;

package/package/components/table/table-row-header.svelte.d.ts

@@ -6,7 +6,7 @@
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th
  * @see https://w3c.github.io/aria/#rowheader
  */
-export default class TableRowHeader extends SvelteComponentTyped<{
+export default class TableRowHeader extends SvelteComponent<{
     [x: string]: any;
     class?: string;
 }, {
@@ -18,7 +18,7 @@ export default class TableRowHeader extends SvelteComponentTyped<{
 export type TableRowHeaderProps = typeof __propDef.props;
 export type TableRowHeaderEvents = typeof __propDef.events;
 export type TableRowHeaderSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;

package/package/components/table/table-row.svelte.d.ts

@@ -6,7 +6,7 @@
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/tr
  * @see https://w3c.github.io/aria/#row
  */
-export default class TableRow extends SvelteComponentTyped<{
+export default class TableRow extends SvelteComponent<{
     [x: string]: any;
     class?: string;
 }, {
@@ -20,7 +20,7 @@ export default class TableRow extends SvelteComponentTyped<{
 export type TableRowProps = typeof __propDef.props;
 export type TableRowEvents = typeof __propDef.events;
 export type TableRowSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;

package/package/components/table/table.svelte.d.ts

@@ -6,7 +6,7 @@
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table
  * @see https://w3c.github.io/aria/#grid
  */
-export default class Table extends SvelteComponentTyped<{
+export default class Table extends SvelteComponent<{
     [x: string]: any;
     class?: string;
     element?: HTMLElement;
@@ -19,7 +19,7 @@ export default class Table extends SvelteComponentTyped<{
 export type TableProps = typeof __propDef.props;
 export type TableEvents = typeof __propDef.events;
 export type TableSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;

package/package/components/tabs/tab-list.svelte.d.ts

@@ -6,10 +6,10 @@
  * @see https://w3c.github.io/aria/#tablist
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
  */
-export default class TabList extends SvelteComponentTyped<{
+export default class TabList extends SvelteComponent<{
     [x: string]: any;
-    name?: string;
     class?: string;
+    name?: string;
     element?: HTMLElement;
     orientation?: "vertical" | "horizontal";
 }, {
@@ -35,12 +35,12 @@ export default class TabList extends SvelteComponentTyped<{
 export type TabListProps = typeof __propDef.props;
 export type TabListEvents = typeof __propDef.events;
 export type TabListSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        name?: string;
         class?: string;
+        name?: string;
         element?: HTMLElement | null;
         orientation?: ('horizontal' | 'vertical');
     };

package/package/components/tabs/tab-panel.svelte.d.ts

@@ -6,7 +6,7 @@
  * @see https://w3c.github.io/aria/#tabpanel
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
  */
-export default class TabPanel extends SvelteComponentTyped<{
+export default class TabPanel extends SvelteComponent<{
     [x: string]: any;
     class?: string;
 }, {
@@ -18,7 +18,7 @@ export default class TabPanel extends SvelteComponentTyped<{
 export type TabPanelProps = typeof __propDef.props;
 export type TabPanelEvents = typeof __propDef.events;
 export type TabPanelSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;

package/package/components/tabs/tab.svelte.d.ts

@@ -6,7 +6,7 @@
  * @see https://w3c.github.io/aria/#tab
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
  */
-export default class Tab extends SvelteComponentTyped<{
+export default class Tab extends SvelteComponent<{
     [x: string]: any;
     class?: string;
 }, {
@@ -24,7 +24,7 @@ export default class Tab extends SvelteComponentTyped<{
 export type TabProps = typeof __propDef.props;
 export type TabEvents = typeof __propDef.events;
 export type TabSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;

package/package/components/text-field/markdown-editor.svelte.d.ts

@@ -2,7 +2,7 @@
 /** @typedef {typeof __propDef.events}  MarkdownEditorEvents */
 /** @typedef {typeof __propDef.slots}  MarkdownEditorSlots */
 /** A Markdown text editor. */
-export default class MarkdownEditor extends SvelteComponentTyped<{
+export default class MarkdownEditor extends SvelteComponent<{
     disabled?: boolean;
     value?: string;
 }, {
@@ -12,7 +12,7 @@ export default class MarkdownEditor extends SvelteComponentTyped<{
 export type MarkdownEditorProps = typeof __propDef.props;
 export type MarkdownEditorEvents = typeof __propDef.events;
 export type MarkdownEditorSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         disabled?: boolean;

package/package/components/text-field/number-input.svelte.d.ts

@@ -6,11 +6,11 @@
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number
  * @see https://w3c.github.io/aria/#textbox
  */
-export default class NumberInput extends SvelteComponentTyped<{
+export default class NumberInput extends SvelteComponent<{
     [x: string]: any;
+    class?: string;
     disabled?: boolean;
     value?: string;
-    class?: string;
     min?: any;
     max?: any;
     step?: number;
@@ -24,13 +24,13 @@ export default class NumberInput extends SvelteComponentTyped<{
 export type NumberInputProps = typeof __propDef.props;
 export type NumberInputEvents = typeof __propDef.events;
 export type NumberInputSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
+        class?: string;
         disabled?: boolean;
         value?: string | null;
-        class?: string;
         min?: any;
         max?: any;
         step?: number;

package/package/components/text-field/password-input.svelte.d.ts

@@ -7,10 +7,10 @@
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/password
  * @see https://w3c.github.io/aria/#textbox
  */
-export default class PasswordInput extends SvelteComponentTyped<{
+export default class PasswordInput extends SvelteComponent<{
     [x: string]: any;
-    value?: string;
     class?: string;
+    value?: string;
 }, {
     input: Event;
     keypress: KeyboardEvent;
@@ -22,12 +22,12 @@ export default class PasswordInput extends SvelteComponentTyped<{
 export type PasswordInputProps = typeof __propDef.props;
 export type PasswordInputEvents = typeof __propDef.events;
 export type PasswordInputSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        value?: string | null;
         class?: string;
+        value?: string | null;
     };
     events: {
         input: Event;