@sveltia/ui 0.15.16 → 0.17.0

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

@@ -1,36 +1,46 @@
-/** @typedef {typeof __propDef.props}  TableProps */
-/** @typedef {typeof __propDef.events}  TableEvents */
-/** @typedef {typeof __propDef.slots}  TableSlots */
+export default Table;
+type Table = SvelteComponent<Props & Record<string, any>, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: "" | undefined;
+};
 /**
  * The equivalent of the HTML `<table>` element.
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table
  * @see https://w3c.github.io/aria/#table
  */
-export default class Table extends SvelteComponent<{
-    [x: string]: any;
+declare const Table: $$__sveltets_2_IsomorphicComponent<{
+    /**
+     * - The `class` attribute on the wrapper element.
+     */
     class?: string | undefined;
-}, {
+    /**
+     * - Primary slot content.
+     */
+    children?: import("svelte").Snippet<[]> | undefined;
+} & Record<string, any>, {
     [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}> {
-}
-export type TableProps = typeof __propDef.props;
-export type TableEvents = typeof __propDef.events;
-export type TableSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        [x: string]: any;
-        class?: string | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-    exports?: undefined;
-    bindings?: undefined;
+}, {}, {}, "">;
+type Props = {
+    /**
+     * - The `class` attribute on the wrapper element.
+     */
+    class?: string | undefined;
+    /**
+     * - Primary slot content.
+     */
+    children?: import("svelte").Snippet<[]> | undefined;
 };
-export {};
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}

package/package/components/tabs/tab-box.svelte

@@ -5,21 +5,28 @@
 -->
 <script>
   /**
-   * The `class` attribute on the wrapper element.
-   * @type {string}
+   * @typedef {object} Props
+   * @property {string} [class] - The `class` attribute on the wrapper element.
+   * @property {'horizontal' | 'vertical'} [orientation] - Orientation of the widget. This is
+   * typically contrary to `<TabList>`’s `orientation`.
+   * @property {import('svelte').Snippet} [children] - Primary slot content.
    */
-  let className = '';
-  export { className as class };
 
   /**
-   * Orientation of the widget. This is typically contrary to `<TabList>`’s `orientation`.
-   * @type {'horizontal' | 'vertical'}
+   * @type {Props & Record<string, any>}
    */
-  export let orientation = 'vertical';
+  let {
+    /* eslint-disable prefer-const */
+    class: className,
+    orientation = 'vertical',
+    children,
+    ...restProps
+    /* eslint-enable prefer-const */
+  } = $props();
 </script>
 
-<div role="none" class="sui tab-box {orientation} {className}">
-  <slot />
+<div {...restProps} role="none" class="sui tab-box {orientation} {className}">
+  {@render children?.()}
 </div>
 
 <style>.tab-box {

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

@@ -1,35 +1,55 @@
-/** @typedef {typeof __propDef.props}  TabBoxProps */
-/** @typedef {typeof __propDef.events}  TabBoxEvents */
-/** @typedef {typeof __propDef.slots}  TabBoxSlots */
+export default TabBox;
+type TabBox = SvelteComponent<Props & Record<string, any>, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: "" | undefined;
+};
 /**
  * The container of `<TabList>` and `<TabPanels>`. The component name derives from XUL. This can be
  * omitted if not using vertical tabs.
  */
-export default class TabBox extends SvelteComponent<{
+declare const TabBox: $$__sveltets_2_IsomorphicComponent<{
+    /**
+     * - The `class` attribute on the wrapper element.
+     */
     class?: string | undefined;
+    /**
+     * - Orientation of the widget. This is
+     * typically contrary to `<TabList>`’s `orientation`.
+     */
     orientation?: "vertical" | "horizontal" | undefined;
-}, {
+    /**
+     * - Primary slot content.
+     */
+    children?: import("svelte").Snippet<[]> | undefined;
+} & Record<string, any>, {
     [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}> {
-}
-export type TabBoxProps = typeof __propDef.props;
-export type TabBoxEvents = typeof __propDef.events;
-export type TabBoxSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        class?: string | undefined;
-        orientation?: "vertical" | "horizontal" | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-    exports?: undefined;
-    bindings?: undefined;
+}, {}, {}, "">;
+type Props = {
+    /**
+     * - The `class` attribute on the wrapper element.
+     */
+    class?: string | undefined;
+    /**
+     * - Orientation of the widget. This is
+     * typically contrary to `<TabList>`’s `orientation`.
+     */
+    orientation?: "vertical" | "horizontal" | undefined;
+    /**
+     * - Primary slot content.
+     */
+    children?: import("svelte").Snippet<[]> | undefined;
 };
-export {};
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}

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

@@ -5,47 +5,48 @@
   @see https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
 -->
 <script>
-  import { createEventDispatcher, onMount } from 'svelte';
-  import { activateGroup } from '../../services/group';
+  import { onMount } from 'svelte';
+  import { activateGroup } from '../../services/group.svelte';
 
   /**
-   * The `class` attribute on the wrapper element.
-   * @type {string}
+   * @typedef {object} Props
+   * @property {string} [class] - The `class` attribute on the wrapper element.
+   * @property {boolean} [hidden] - Whether to hide the widget.
+   * @property {boolean} [disabled] - Whether to disable the widget. An alias of the `aria-disabled`
+   * attribute.
+   * @property {'horizontal' | 'vertical'} [orientation] - Orientation of the widget. An alias of
+   * the `aria-orientation` attribute.
+   * @property {string | undefined} [name] - The `data-name` attribute on the wrapper element.
+   * @property {import('svelte').Snippet} [children] - Primary slot content.
+   * @property {(event: CustomEvent) => void} [onChange] - Custom `Change` event handler.
    */
-  let className = '';
-  export { className as class };
-  /**
-   * Whether to hide the widget. An alias of the `aria-hidden` attribute.
-   * @type {boolean | undefined}
-   */
-  export let hidden = undefined;
-  /**
-   * Whether to disable the widget. An alias of the `aria-disabled` attribute.
-   * @type {boolean}
-   */
-  export let disabled = false;
-  /**
-   * Orientation of the widget. An alias of the `aria-orientation` attribute.
-   * @type {'horizontal' | 'vertical'}
-   */
-  export let orientation = 'horizontal';
+
   /**
-   * The `data-name` attribute on the wrapper element.
-   * @type {string | undefined}
+   * @type {Props & Record<string, any>}
    */
-  export let name = undefined;
+  let {
+    /* eslint-disable prefer-const */
+    class: className,
+    hidden = false,
+    disabled = false,
+    orientation = 'horizontal',
+    name = undefined,
+    children,
+    onChange,
+    ...restProps
+    /* eslint-enable prefer-const */
+  } = $props();
 
-  const dispatch = createEventDispatcher();
   /**
    * A reference to the wrapper element.
    * @type {HTMLElement | undefined}
    */
-  let wrapper = undefined;
+  let wrapper = $state();
   /**
    * The indicator’s CSS style.
    * @type {string | undefined}
    */
-  let indicatorStyle = undefined;
+  let indicatorStyle = $state();
 
   /**
    * Update the indicator position.
@@ -87,26 +88,26 @@
 </script>
 
 <div
+  bind:this={wrapper}
+  {...restProps}
   role="tablist"
   class="sui tab-list {className}"
-  hidden={hidden || undefined}
+  {hidden}
   aria-hidden={hidden}
   aria-disabled={disabled}
   aria-orientation={orientation}
   data-name={name || undefined}
-  {...$$restProps}
-  bind:this={wrapper}
-  use:activateGroup
-  on:initialized={() => {
+  onInitialized={() => {
     updateIndicator();
   }}
-  on:change={(/** @type {CustomEvent} */ event) => {
-    dispatch('change', event.detail);
+  onChange={(/** @type {CustomEvent} */ event) => {
     updateIndicator();
+    onChange?.(event);
   }}
+  use:activateGroup
 >
   <div role="none" class="inner" inert={disabled}>
-    <slot />
+    {@render children?.()}
   </div>
   <div role="none" class="indicator" style={indicatorStyle}></div>
 </div>

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

@@ -1,48 +1,90 @@
-/** @typedef {typeof __propDef.props}  TabListProps */
-/** @typedef {typeof __propDef.events}  TabListEvents */
-/** @typedef {typeof __propDef.slots}  TabListSlots */
+export default TabList;
+type TabList = SvelteComponent<Props & Record<string, any>, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: "" | undefined;
+};
 /**
  * A tab list widget.
  * @see https://w3c.github.io/aria/#tablist
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
  */
-export default class TabList extends SvelteComponent<{
-    [x: string]: any;
+declare const TabList: $$__sveltets_2_IsomorphicComponent<{
+    /**
+     * - The `class` attribute on the wrapper element.
+     */
     class?: string | undefined;
-    name?: string | undefined;
-    disabled?: boolean | undefined;
+    /**
+     * - Whether to hide the widget.
+     */
     hidden?: boolean | undefined;
+    /**
+     * - Whether to disable the widget. An alias of the `aria-disabled`
+     * attribute.
+     */
+    disabled?: boolean | undefined;
+    /**
+     * - Orientation of the widget. An alias of
+     * the `aria-orientation` attribute.
+     */
     orientation?: "vertical" | "horizontal" | undefined;
-}, {
-    change: CustomEvent<any>;
-} & {
+    /**
+     * - The `data-name` attribute on the wrapper element.
+     */
+    name?: string | undefined;
+    /**
+     * - Primary slot content.
+     */
+    children?: import("svelte").Snippet<[]> | undefined;
+    /**
+     * - Custom `Change` event handler.
+     */
+    onChange?: ((event: CustomEvent) => void) | undefined;
+} & Record<string, any>, {
     [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}> {
-}
-export type TabListProps = typeof __propDef.props;
-export type TabListEvents = typeof __propDef.events;
-export type TabListSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        [x: string]: any;
-        class?: string | undefined;
-        name?: string | undefined;
-        disabled?: boolean | undefined;
-        hidden?: boolean | undefined;
-        orientation?: "vertical" | "horizontal" | undefined;
-    };
-    events: {
-        change: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-    exports?: undefined;
-    bindings?: undefined;
+}, {}, {}, "">;
+type Props = {
+    /**
+     * - The `class` attribute on the wrapper element.
+     */
+    class?: string | undefined;
+    /**
+     * - Whether to hide the widget.
+     */
+    hidden?: boolean | undefined;
+    /**
+     * - Whether to disable the widget. An alias of the `aria-disabled`
+     * attribute.
+     */
+    disabled?: boolean | undefined;
+    /**
+     * - Orientation of the widget. An alias of
+     * the `aria-orientation` attribute.
+     */
+    orientation?: "vertical" | "horizontal" | undefined;
+    /**
+     * - The `data-name` attribute on the wrapper element.
+     */
+    name?: string | undefined;
+    /**
+     * - Primary slot content.
+     */
+    children?: import("svelte").Snippet<[]> | undefined;
+    /**
+     * - Custom `Change` event handler.
+     */
+    onChange?: ((event: CustomEvent) => void) | undefined;
 };
-export {};
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}

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

@@ -6,15 +6,25 @@
 -->
 <script>
   /**
-   * The `class` attribute on the wrapper element.
-   * @type {string}
+   * @typedef {object} Props
+   * @property {string} [class] - The `class` attribute on the wrapper element.
+   * @property {import('svelte').Snippet} [children] - Primary slot content.
    */
-  let className = '';
-  export { className as class };
+
+  /**
+   * @type {Props & Record<string, any>}
+   */
+  let {
+    /* eslint-disable prefer-const */
+    class: className,
+    children,
+    ...restProps
+    /* eslint-enable prefer-const */
+  } = $props();
 </script>
 
-<div role="tabpanel" class="sui tab-panel {className}" {...$$restProps}>
-  <slot />
+<div {...restProps} role="tabpanel" class="sui tab-panel {className}">
+  {@render children?.()}
 </div>
 
 <style>.tab-panel {

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

@@ -1,36 +1,46 @@
-/** @typedef {typeof __propDef.props}  TabPanelProps */
-/** @typedef {typeof __propDef.events}  TabPanelEvents */
-/** @typedef {typeof __propDef.slots}  TabPanelSlots */
+export default TabPanel;
+type TabPanel = SvelteComponent<Props & Record<string, any>, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: "" | undefined;
+};
 /**
  * A tab content panel.
  * @see https://w3c.github.io/aria/#tabpanel
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
  */
-export default class TabPanel extends SvelteComponent<{
-    [x: string]: any;
+declare const TabPanel: $$__sveltets_2_IsomorphicComponent<{
+    /**
+     * - The `class` attribute on the wrapper element.
+     */
     class?: string | undefined;
-}, {
+    /**
+     * - Primary slot content.
+     */
+    children?: import("svelte").Snippet<[]> | undefined;
+} & Record<string, any>, {
     [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}> {
-}
-export type TabPanelProps = typeof __propDef.props;
-export type TabPanelEvents = typeof __propDef.events;
-export type TabPanelSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        [x: string]: any;
-        class?: string | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-    exports?: undefined;
-    bindings?: undefined;
+}, {}, {}, "">;
+type Props = {
+    /**
+     * - The `class` attribute on the wrapper element.
+     */
+    class?: string | undefined;
+    /**
+     * - Primary slot content.
+     */
+    children?: import("svelte").Snippet<[]> | undefined;
 };
-export {};
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}

package/package/components/tabs/tab-panels.svelte

@@ -5,15 +5,25 @@
 -->
 <script>
   /**
-   * The `class` attribute on the wrapper element.
-   * @type {string}
+   * @typedef {object} Props
+   * @property {string} [class] - The `class` attribute on the wrapper element.
+   * @property {import('svelte').Snippet} [children] - Primary slot content.
    */
-  let className = '';
-  export { className as class };
+
+  /**
+   * @type {Props & Record<string, any>}
+   */
+  let {
+    /* eslint-disable prefer-const */
+    class: className,
+    children,
+    ...restProps
+    /* eslint-enable prefer-const */
+  } = $props();
 </script>
 
-<div role="none" class="sui tab-panels {className}">
-  <slot />
+<div {...restProps} role="none" class="sui tab-panels {className}">
+  {@render children?.()}
 </div>
 
 <style>.tab-panels {

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

@@ -1,33 +1,45 @@
-/** @typedef {typeof __propDef.props}  TabPanelsProps */
-/** @typedef {typeof __propDef.events}  TabPanelsEvents */
-/** @typedef {typeof __propDef.slots}  TabPanelsSlots */
+export default TabPanels;
+type TabPanels = SvelteComponent<Props & Record<string, any>, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: "" | undefined;
+};
 /**
  * The container of `<TabPanel>`s. The component name derives from XUL. This can be omitted if the
  * child tab panels don’t need a sliding animation.
  */
-export default class TabPanels extends SvelteComponent<{
+declare const TabPanels: $$__sveltets_2_IsomorphicComponent<{
+    /**
+     * - The `class` attribute on the wrapper element.
+     */
     class?: string | undefined;
-}, {
+    /**
+     * - Primary slot content.
+     */
+    children?: import("svelte").Snippet<[]> | undefined;
+} & Record<string, any>, {
     [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}> {
-}
-export type TabPanelsProps = typeof __propDef.props;
-export type TabPanelsEvents = typeof __propDef.events;
-export type TabPanelsSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        class?: string | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-    exports?: undefined;
-    bindings?: undefined;
+}, {}, {}, "">;
+type Props = {
+    /**
+     * - The `class` attribute on the wrapper element.
+     */
+    class?: string | undefined;
+    /**
+     * - Primary slot content.
+     */
+    children?: import("svelte").Snippet<[]> | undefined;
 };
-export {};
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}