@14ch/svelte-ui 0.0.10 → 0.0.12

package/README.md

@@ -19,7 +19,7 @@ A Svelte component library with TypeScript support and Material Design-inspired
 ```bash
 npm install @14ch/svelte-ui
 # or
-pnpm add @14ch/svelte-ui
+pnpm install @14ch/svelte-ui
 # or
 yarn add @14ch/svelte-ui
 ```

package/dist/components/Button.svelte

@@ -4,6 +4,13 @@
 	import type { Snippet } from 'svelte';
 	import type { HTMLButtonAttributes } from 'svelte/elements';
 	import type { IconVariant, IconWeight, IconGrade, IconOpticalSize } from '../types/icon';
+	import type {
+		FocusHandler,
+		KeyboardHandler,
+		MouseHandler,
+		TouchHandler,
+		PointerHandler
+	} from '../types/eventHandlers';
 	import Icon from './Icon.svelte';
 	import LoadingSpinner from './LoadingSpinner.svelte';
 	import { getStyleFromNumber } from '../utils/style';
@@ -121,37 +128,37 @@
 		reducedMotion?: boolean;
 
 		// フォーカスイベント
-		onfocus?: Function; // No params for type inference
-		onblur?: Function; // No params for type inference
+		onfocus?: FocusHandler;
+		onblur?: FocusHandler;
 
 		// キーボードイベント
-		onkeydown?: Function; // No params for type inference
-		onkeyup?: Function; // No params for type inference
+		onkeydown?: KeyboardHandler;
+		onkeyup?: KeyboardHandler;
 
 		// マウスイベント
-		onclick?: Function; // No params for type inference
-		onmousedown?: Function; // No params for type inference
-		onmouseup?: Function; // No params for type inference
-		onmouseenter?: Function; // No params for type inference
-		onmouseleave?: Function; // No params for type inference
-		onmouseover?: Function; // No params for type inference
-		onmouseout?: Function; // No params for type inference
-		oncontextmenu?: Function; // No params for type inference
-		onauxclick?: Function; // No params for type inference
+		onclick?: MouseHandler;
+		onmousedown?: MouseHandler;
+		onmouseup?: MouseHandler;
+		onmouseenter?: MouseHandler;
+		onmouseleave?: MouseHandler;
+		onmouseover?: MouseHandler;
+		onmouseout?: MouseHandler;
+		oncontextmenu?: MouseHandler;
+		onauxclick?: MouseHandler;
 
 		// タッチイベント
-		ontouchstart?: Function; // No params for type inference
-		ontouchend?: Function; // No params for type inference
-		ontouchmove?: Function; // No params for type inference
-		ontouchcancel?: Function; // No params for type inference
+		ontouchstart?: TouchHandler;
+		ontouchend?: TouchHandler;
+		ontouchmove?: TouchHandler;
+		ontouchcancel?: TouchHandler;
 
 		// ポインターイベント
-		onpointerdown?: Function; // No params for type inference
-		onpointerup?: Function; // No params for type inference
-		onpointerenter?: Function; // No params for type inference
-		onpointerleave?: Function; // No params for type inference
-		onpointermove?: Function; // No params for type inference
-		onpointercancel?: Function; // No params for type inference
+		onpointerdown?: PointerHandler;
+		onpointerup?: PointerHandler;
+		onpointerenter?: PointerHandler;
+		onpointerleave?: PointerHandler;
+		onpointermove?: PointerHandler;
+		onpointercancel?: PointerHandler;
 
 		// その他
 		[key: string]: any;

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

@@ -1,6 +1,7 @@
 import type { Snippet } from 'svelte';
 import type { HTMLButtonAttributes } from 'svelte/elements';
 import type { IconVariant, IconWeight, IconGrade, IconOpticalSize } from '../types/icon';
+import type { FocusHandler, KeyboardHandler, MouseHandler, TouchHandler, PointerHandler } from '../types/eventHandlers';
 type $$ComponentProps = {
     children: Snippet;
     buttonAttributes?: HTMLButtonAttributes | undefined;
@@ -26,29 +27,29 @@ type $$ComponentProps = {
     ariaDescribedby?: string;
     ariaExpanded?: boolean;
     reducedMotion?: boolean;
-    onfocus?: Function;
-    onblur?: Function;
-    onkeydown?: Function;
-    onkeyup?: Function;
-    onclick?: Function;
-    onmousedown?: Function;
-    onmouseup?: Function;
-    onmouseenter?: Function;
-    onmouseleave?: Function;
-    onmouseover?: Function;
-    onmouseout?: Function;
-    oncontextmenu?: Function;
-    onauxclick?: Function;
-    ontouchstart?: Function;
-    ontouchend?: Function;
-    ontouchmove?: Function;
-    ontouchcancel?: Function;
-    onpointerdown?: Function;
-    onpointerup?: Function;
-    onpointerenter?: Function;
-    onpointerleave?: Function;
-    onpointermove?: Function;
-    onpointercancel?: Function;
+    onfocus?: FocusHandler;
+    onblur?: FocusHandler;
+    onkeydown?: KeyboardHandler;
+    onkeyup?: KeyboardHandler;
+    onclick?: MouseHandler;
+    onmousedown?: MouseHandler;
+    onmouseup?: MouseHandler;
+    onmouseenter?: MouseHandler;
+    onmouseleave?: MouseHandler;
+    onmouseover?: MouseHandler;
+    onmouseout?: MouseHandler;
+    oncontextmenu?: MouseHandler;
+    onauxclick?: MouseHandler;
+    ontouchstart?: TouchHandler;
+    ontouchend?: TouchHandler;
+    ontouchmove?: TouchHandler;
+    ontouchcancel?: TouchHandler;
+    onpointerdown?: PointerHandler;
+    onpointerup?: PointerHandler;
+    onpointerenter?: PointerHandler;
+    onpointerleave?: PointerHandler;
+    onpointermove?: PointerHandler;
+    onpointercancel?: PointerHandler;
     [key: string]: any;
 };
 declare const Button: import("svelte").Component<$$ComponentProps, {}, "">;

package/dist/components/Checkbox.svelte

@@ -3,6 +3,14 @@
 <script lang="ts">
 	import { type Snippet } from 'svelte';
 	import type { HTMLInputAttributes } from 'svelte/elements';
+	import type {
+		FocusHandler,
+		KeyboardHandler,
+		MouseHandler,
+		TouchHandler,
+		PointerHandler,
+		BivariantValueHandler
+	} from '../types/eventHandlers';
 
 	// =========================================================================
 	// Props, States & Constants
@@ -92,40 +100,40 @@
 		reducedMotion?: boolean;
 
 		// 入力イベント
-		onchange?: (value: boolean) => void;
+		onchange?: BivariantValueHandler<boolean>;
 
 		// フォーカスイベント
-		onfocus?: Function; // No params for type inference
-		onblur?: Function; // No params for type inference
+		onfocus?: FocusHandler;
+		onblur?: FocusHandler;
 
 		// キーボードイベント
-		onkeydown?: Function; // No params for type inference
-		onkeyup?: Function; // No params for type inference
+		onkeydown?: KeyboardHandler;
+		onkeyup?: KeyboardHandler;
 
 		// マウスイベント
-		onclick?: Function; // No params for type inference
-		onmousedown?: Function; // No params for type inference
-		onmouseup?: Function; // No params for type inference
-		onmouseenter?: Function; // No params for type inference
-		onmouseleave?: Function; // No params for type inference
-		onmouseover?: Function; // No params for type inference
-		onmouseout?: Function; // No params for type inference
-		oncontextmenu?: Function; // No params for type inference
-		onauxclick?: Function; // No params for type inference
+		onclick?: MouseHandler;
+		onmousedown?: MouseHandler;
+		onmouseup?: MouseHandler;
+		onmouseenter?: MouseHandler;
+		onmouseleave?: MouseHandler;
+		onmouseover?: MouseHandler;
+		onmouseout?: MouseHandler;
+		oncontextmenu?: MouseHandler;
+		onauxclick?: MouseHandler;
 
 		// タッチイベント
-		ontouchstart?: Function; // No params for type inference
-		ontouchend?: Function; // No params for type inference
-		ontouchmove?: Function; // No params for type inference
-		ontouchcancel?: Function; // No params for type inference
+		ontouchstart?: TouchHandler;
+		ontouchend?: TouchHandler;
+		ontouchmove?: TouchHandler;
+		ontouchcancel?: TouchHandler;
 
 		// ポインターイベント
-		onpointerdown?: Function; // No params for type inference
-		onpointerup?: Function; // No params for type inference
-		onpointerenter?: Function; // No params for type inference
-		onpointerleave?: Function; // No params for type inference
-		onpointermove?: Function; // No params for type inference
-		onpointercancel?: Function; // No params for type inference
+		onpointerdown?: PointerHandler;
+		onpointerup?: PointerHandler;
+		onpointerenter?: PointerHandler;
+		onpointerleave?: PointerHandler;
+		onpointermove?: PointerHandler;
+		onpointercancel?: PointerHandler;
 
 		// その他
 		[key: string]: any;

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

@@ -1,5 +1,6 @@
 import { type Snippet } from 'svelte';
 import type { HTMLInputAttributes } from 'svelte/elements';
+import type { FocusHandler, KeyboardHandler, MouseHandler, TouchHandler, PointerHandler, BivariantValueHandler } from '../types/eventHandlers';
 type $$ComponentProps = {
     children?: Snippet;
     name?: string;
@@ -11,30 +12,30 @@ type $$ComponentProps = {
     disabled?: boolean;
     required?: boolean;
     reducedMotion?: boolean;
-    onchange?: (value: boolean) => void;
-    onfocus?: Function;
-    onblur?: Function;
-    onkeydown?: Function;
-    onkeyup?: Function;
-    onclick?: Function;
-    onmousedown?: Function;
-    onmouseup?: Function;
-    onmouseenter?: Function;
-    onmouseleave?: Function;
-    onmouseover?: Function;
-    onmouseout?: Function;
-    oncontextmenu?: Function;
-    onauxclick?: Function;
-    ontouchstart?: Function;
-    ontouchend?: Function;
-    ontouchmove?: Function;
-    ontouchcancel?: Function;
-    onpointerdown?: Function;
-    onpointerup?: Function;
-    onpointerenter?: Function;
-    onpointerleave?: Function;
-    onpointermove?: Function;
-    onpointercancel?: Function;
+    onchange?: BivariantValueHandler<boolean>;
+    onfocus?: FocusHandler;
+    onblur?: FocusHandler;
+    onkeydown?: KeyboardHandler;
+    onkeyup?: KeyboardHandler;
+    onclick?: MouseHandler;
+    onmousedown?: MouseHandler;
+    onmouseup?: MouseHandler;
+    onmouseenter?: MouseHandler;
+    onmouseleave?: MouseHandler;
+    onmouseover?: MouseHandler;
+    onmouseout?: MouseHandler;
+    oncontextmenu?: MouseHandler;
+    onauxclick?: MouseHandler;
+    ontouchstart?: TouchHandler;
+    ontouchend?: TouchHandler;
+    ontouchmove?: TouchHandler;
+    ontouchcancel?: TouchHandler;
+    onpointerdown?: PointerHandler;
+    onpointerup?: PointerHandler;
+    onpointerenter?: PointerHandler;
+    onpointerleave?: PointerHandler;
+    onpointermove?: PointerHandler;
+    onpointercancel?: PointerHandler;
     [key: string]: any;
 };
 declare const Checkbox: import("svelte").Component<$$ComponentProps, {}, "value" | "indeterminate">;

package/dist/components/CheckboxGroup.svelte

@@ -3,6 +3,7 @@
 	import Checkbox from './Checkbox.svelte';
 	import { onMount } from 'svelte';
 	import { getStyleFromNumber } from '../utils/style';
+	import type { BivariantValueHandler } from '../types/eventHandlers';
 
 	let {
 		// 基本プロパティ
@@ -45,7 +46,7 @@
 		reducedMotion?: boolean;
 
 		// 入力イベント
-		onchange?: (value: OptionValue[]) => void;
+		onchange?: BivariantValueHandler<OptionValue[]>;
 	} = $props();
 	let localValues: Record<string, boolean> = $state({});
 

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

@@ -1,4 +1,5 @@
 import type { Option, OptionValue } from '../types/options';
+import type { BivariantValueHandler } from '../types/eventHandlers';
 type $$ComponentProps = {
     options: Option[];
     value: OptionValue[];
@@ -10,7 +11,7 @@ type $$ComponentProps = {
     disabled?: boolean;
     required?: boolean;
     reducedMotion?: boolean;
-    onchange?: (value: OptionValue[]) => void;
+    onchange?: BivariantValueHandler<OptionValue[]>;
 };
 declare const CheckboxGroup: import("svelte").Component<$$ComponentProps, {}, "value">;
 type CheckboxGroup = ReturnType<typeof CheckboxGroup>;

package/dist/components/ColorPicker.svelte

@@ -6,6 +6,14 @@
 	import { t } from '../i18n';
 	import type { HTMLInputAttributes } from 'svelte/elements';
 	import type { IconVariant } from '../types/icon';
+	import type {
+		FocusHandler,
+		KeyboardHandler,
+		MouseHandler,
+		TouchHandler,
+		PointerHandler,
+		BivariantValueHandler
+	} from '../types/eventHandlers';
 
 	// =========================================================================
 	// Props, States & Constants
@@ -92,41 +100,41 @@
 		iconVariant?: IconVariant;
 
 		// 入力イベント
-		onchange?: (value: string) => void;
-		oninput?: (value: string) => void;
+		onchange?: BivariantValueHandler<string>;
+		oninput?: BivariantValueHandler<string>;
 
 		// フォーカスイベント
-		onfocus?: Function; // No params for type inference
-		onblur?: Function; // No params for type inference
+		onfocus?: FocusHandler;
+		onblur?: FocusHandler;
 
 		// キーボードイベント
-		onkeydown?: Function; // No params for type inference
-		onkeyup?: Function; // No params for type inference
+		onkeydown?: KeyboardHandler;
+		onkeyup?: KeyboardHandler;
 
 		// マウスイベント
-		onclick?: Function; // No params for type inference
-		onmousedown?: Function; // No params for type inference
-		onmouseup?: Function; // No params for type inference
-		onmouseenter?: Function; // No params for type inference
-		onmouseleave?: Function; // No params for type inference
-		onmouseover?: Function; // No params for type inference
-		onmouseout?: Function; // No params for type inference
-		oncontextmenu?: Function; // No params for type inference
-		onauxclick?: Function; // No params for type inference
+		onclick?: MouseHandler;
+		onmousedown?: MouseHandler;
+		onmouseup?: MouseHandler;
+		onmouseenter?: MouseHandler;
+		onmouseleave?: MouseHandler;
+		onmouseover?: MouseHandler;
+		onmouseout?: MouseHandler;
+		oncontextmenu?: MouseHandler;
+		onauxclick?: MouseHandler;
 
 		// タッチイベント
-		ontouchstart?: Function; // No params for type inference
-		ontouchend?: Function; // No params for type inference
-		ontouchmove?: Function; // No params for type inference
-		ontouchcancel?: Function; // No params for type inference
+		ontouchstart?: TouchHandler;
+		ontouchend?: TouchHandler;
+		ontouchmove?: TouchHandler;
+		ontouchcancel?: TouchHandler;
 
 		// ポインターイベント
-		onpointerdown?: Function; // No params for type inference
-		onpointerup?: Function; // No params for type inference
-		onpointerenter?: Function; // No params for type inference
-		onpointerleave?: Function; // No params for type inference
-		onpointermove?: Function; // No params for type inference
-		onpointercancel?: Function; // No params for type inference
+		onpointerdown?: PointerHandler;
+		onpointerup?: PointerHandler;
+		onpointerenter?: PointerHandler;
+		onpointerleave?: PointerHandler;
+		onpointermove?: PointerHandler;
+		onpointercancel?: PointerHandler;
 
 		// その他
 		[key: string]: any;

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

@@ -1,5 +1,6 @@
 import type { HTMLInputAttributes } from 'svelte/elements';
 import type { IconVariant } from '../types/icon';
+import type { FocusHandler, KeyboardHandler, MouseHandler, TouchHandler, PointerHandler, BivariantValueHandler } from '../types/eventHandlers';
 type $$ComponentProps = {
     value: string;
     id?: string;
@@ -13,31 +14,31 @@ type $$ComponentProps = {
     clearable?: boolean;
     clearButtonAriaLabel?: string;
     iconVariant?: IconVariant;
-    onchange?: (value: string) => void;
-    oninput?: (value: string) => void;
-    onfocus?: Function;
-    onblur?: Function;
-    onkeydown?: Function;
-    onkeyup?: Function;
-    onclick?: Function;
-    onmousedown?: Function;
-    onmouseup?: Function;
-    onmouseenter?: Function;
-    onmouseleave?: Function;
-    onmouseover?: Function;
-    onmouseout?: Function;
-    oncontextmenu?: Function;
-    onauxclick?: Function;
-    ontouchstart?: Function;
-    ontouchend?: Function;
-    ontouchmove?: Function;
-    ontouchcancel?: Function;
-    onpointerdown?: Function;
-    onpointerup?: Function;
-    onpointerenter?: Function;
-    onpointerleave?: Function;
-    onpointermove?: Function;
-    onpointercancel?: Function;
+    onchange?: BivariantValueHandler<string>;
+    oninput?: BivariantValueHandler<string>;
+    onfocus?: FocusHandler;
+    onblur?: FocusHandler;
+    onkeydown?: KeyboardHandler;
+    onkeyup?: KeyboardHandler;
+    onclick?: MouseHandler;
+    onmousedown?: MouseHandler;
+    onmouseup?: MouseHandler;
+    onmouseenter?: MouseHandler;
+    onmouseleave?: MouseHandler;
+    onmouseover?: MouseHandler;
+    onmouseout?: MouseHandler;
+    oncontextmenu?: MouseHandler;
+    onauxclick?: MouseHandler;
+    ontouchstart?: TouchHandler;
+    ontouchend?: TouchHandler;
+    ontouchmove?: TouchHandler;
+    ontouchcancel?: TouchHandler;
+    onpointerdown?: PointerHandler;
+    onpointerup?: PointerHandler;
+    onpointerenter?: PointerHandler;
+    onpointerleave?: PointerHandler;
+    onpointermove?: PointerHandler;
+    onpointercancel?: PointerHandler;
     [key: string]: any;
 };
 declare const ColorPicker: import("svelte").Component<$$ComponentProps, {}, "value">;

package/dist/components/Combobox.svelte

@@ -6,6 +6,14 @@
 	import Popup from './Popup.svelte';
 	import { announceSelection } from '../utils/accessibility';
 	import { t } from '../i18n';
+	import type {
+		FocusHandler,
+		KeyboardHandler,
+		MouseHandler,
+		TouchHandler,
+		PointerHandler,
+		BivariantValueHandler
+	} from '../types/eventHandlers';
 
 	// =========================================================================
 	// Props, States & Constants
@@ -108,41 +116,41 @@
 		clearable?: boolean;
 
 		// 入力イベント
-		onchange?: (value: string | number | null | undefined) => void;
-		oninput?: (value: string | number | null | undefined) => void;
+		onchange?: BivariantValueHandler<string | number | null | undefined>;
+		oninput?: BivariantValueHandler<string | number | null | undefined>;
 
 		// フォーカスイベント
-		onfocus?: Function; // No params for type inference
-		onblur?: Function; // No params for type inference
+		onfocus?: FocusHandler;
+		onblur?: FocusHandler;
 
 		// キーボードイベント
-		onkeydown?: Function; // No params for type inference
-		onkeyup?: Function; // No params for type inference
+		onkeydown?: KeyboardHandler;
+		onkeyup?: KeyboardHandler;
 
 		// マウスイベント
-		onclick?: Function; // No params for type inference
-		onmousedown?: Function; // No params for type inference
-		onmouseup?: Function; // No params for type inference
-		onmouseenter?: Function; // No params for type inference
-		onmouseleave?: Function; // No params for type inference
-		onmouseover?: Function; // No params for type inference
-		onmouseout?: Function; // No params for type inference
-		oncontextmenu?: Function; // No params for type inference
-		onauxclick?: Function; // No params for type inference
+		onclick?: MouseHandler;
+		onmousedown?: MouseHandler;
+		onmouseup?: MouseHandler;
+		onmouseenter?: MouseHandler;
+		onmouseleave?: MouseHandler;
+		onmouseover?: MouseHandler;
+		onmouseout?: MouseHandler;
+		oncontextmenu?: MouseHandler;
+		onauxclick?: MouseHandler;
 
 		// タッチイベント
-		ontouchstart?: Function; // No params for type inference
-		ontouchend?: Function; // No params for type inference
-		ontouchmove?: Function; // No params for type inference
-		ontouchcancel?: Function; // No params for type inference
+		ontouchstart?: TouchHandler;
+		ontouchend?: TouchHandler;
+		ontouchmove?: TouchHandler;
+		ontouchcancel?: TouchHandler;
 
 		// ポインターイベント
-		onpointerdown?: Function; // No params for type inference
-		onpointerup?: Function; // No params for type inference
-		onpointerenter?: Function; // No params for type inference
-		onpointerleave?: Function; // No params for type inference
-		onpointermove?: Function; // No params for type inference
-		onpointercancel?: Function; // No params for type inference
+		onpointerdown?: PointerHandler;
+		onpointerup?: PointerHandler;
+		onpointerenter?: PointerHandler;
+		onpointerleave?: PointerHandler;
+		onpointermove?: PointerHandler;
+		onpointercancel?: PointerHandler;
 
 		// その他
 		[key: string]: any;

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

@@ -1,4 +1,5 @@
 import type { HTMLInputAttributes } from 'svelte/elements';
+import type { FocusHandler, KeyboardHandler, MouseHandler, TouchHandler, PointerHandler, BivariantValueHandler } from '../types/eventHandlers';
 type $$ComponentProps = {
     name?: string;
     value: string | number | null | undefined;
@@ -20,31 +21,31 @@ type $$ComponentProps = {
     required?: boolean;
     filterable?: boolean;
     clearable?: boolean;
-    onchange?: (value: string | number | null | undefined) => void;
-    oninput?: (value: string | number | null | undefined) => void;
-    onfocus?: Function;
-    onblur?: Function;
-    onkeydown?: Function;
-    onkeyup?: Function;
-    onclick?: Function;
-    onmousedown?: Function;
-    onmouseup?: Function;
-    onmouseenter?: Function;
-    onmouseleave?: Function;
-    onmouseover?: Function;
-    onmouseout?: Function;
-    oncontextmenu?: Function;
-    onauxclick?: Function;
-    ontouchstart?: Function;
-    ontouchend?: Function;
-    ontouchmove?: Function;
-    ontouchcancel?: Function;
-    onpointerdown?: Function;
-    onpointerup?: Function;
-    onpointerenter?: Function;
-    onpointerleave?: Function;
-    onpointermove?: Function;
-    onpointercancel?: Function;
+    onchange?: BivariantValueHandler<string | number | null | undefined>;
+    oninput?: BivariantValueHandler<string | number | null | undefined>;
+    onfocus?: FocusHandler;
+    onblur?: FocusHandler;
+    onkeydown?: KeyboardHandler;
+    onkeyup?: KeyboardHandler;
+    onclick?: MouseHandler;
+    onmousedown?: MouseHandler;
+    onmouseup?: MouseHandler;
+    onmouseenter?: MouseHandler;
+    onmouseleave?: MouseHandler;
+    onmouseover?: MouseHandler;
+    onmouseout?: MouseHandler;
+    oncontextmenu?: MouseHandler;
+    onauxclick?: MouseHandler;
+    ontouchstart?: TouchHandler;
+    ontouchend?: TouchHandler;
+    ontouchmove?: TouchHandler;
+    ontouchcancel?: TouchHandler;
+    onpointerdown?: PointerHandler;
+    onpointerup?: PointerHandler;
+    onpointerenter?: PointerHandler;
+    onpointerleave?: PointerHandler;
+    onpointermove?: PointerHandler;
+    onpointercancel?: PointerHandler;
     [key: string]: any;
 };
 declare const Combobox: import("svelte").Component<$$ComponentProps, {}, "value">;