svelte-ux
Version:
A large collection of Svelte components, actions, stores and utils to simplify creating highly interactive and visual applications. Built using Tailwind with extensibility and customization in mind.
222 lines (221 loc) • 8.98 kB
TypeScript
import { SvelteComponentTyped } from "svelte";
import { type ComponentProps } from 'svelte';
import type { Placement } from '@floating-ui/dom';
import TextField from './TextField.svelte';
declare class __sveltets_Render<TValue> {
props(): {
[x: string]: any;
options: import("..").MenuOption<TValue>[];
value: TValue[] | undefined;
mode?: "actions" | "immediate" | undefined;
maintainOrder?: boolean | undefined;
indeterminateSelected?: TValue[] | undefined;
max?: number | undefined | undefined;
placement?: Placement | undefined;
infiniteScroll?: boolean | undefined;
optionProps?: Partial<{
[x: string]: any;
checked: boolean;
indeterminate?: boolean | undefined;
disabled?: boolean | undefined;
variant?: "checkbox" | "checkmark" | "fill" | undefined;
classes?: {
root?: string;
checkbox?: ComponentProps<import("./Checkbox.svelte").default>["classes"];
container?: string;
} | undefined;
}> | undefined;
label?: string | undefined;
placeholder?: string | undefined;
loading?: boolean | undefined;
disabled?: boolean | undefined;
icon?: string | null | undefined;
clearable?: boolean | undefined;
base?: boolean | undefined;
rounded?: boolean | undefined;
dense?: boolean | undefined;
formatSelected?: ((ctx: {
value: TValue[] | undefined;
options: import("..").MenuOption<TValue>[];
}) => string) | undefined;
classes?: {
root?: string;
multiSelectMenu?: {
root?: string;
menu?: string;
multiSelect?: {
root?: string;
search?: string;
options?: string;
actions?: string;
} | undefined;
} | undefined;
field?: string | ComponentProps<TextField>["classes"];
actions?: string;
} | undefined;
menuProps?: Omit<{
[x: string]: any;
options: import("..").MenuOption<TValue>[];
value: TValue[] | undefined;
mode?: "actions" | "immediate" | undefined;
maintainOrder?: boolean | undefined;
indeterminateSelected?: TValue[] | undefined;
open?: boolean | undefined;
duration?: number | undefined;
placement?: Placement | undefined;
autoPlacement?: boolean | undefined;
search?: boolean | ((text: string, options: import("..").MenuOption<TValue>[]) => Promise<import("..").MenuOption<TValue>[]>) | undefined;
autoFocusSearch?: boolean | undefined;
placeholder?: string | undefined | undefined;
infiniteScroll?: boolean | undefined;
searchText?: string | undefined;
max?: number | undefined | undefined;
optionProps?: Partial<{
[x: string]: any;
checked: boolean;
indeterminate?: boolean | undefined;
disabled?: boolean | undefined;
variant?: "checkbox" | "checkmark" | "fill" | undefined;
classes?: {
root?: string;
checkbox?: ComponentProps<import("./Checkbox.svelte").default>["classes"];
container?: string;
} | undefined;
}> | undefined;
classes?: {
root?: string;
menu?: string;
multiSelect?: {
root?: string;
search?: string;
options?: string;
actions?: string;
} | undefined;
} | undefined;
menuItemsEl?: HTMLMenuElement | undefined;
onApply?: ((ctx: {
value: TValue[];
selection: {
selected: {} | unknown[] | null;
setSelected: (values: unknown[]) => void;
toggleSelected: (value: unknown) => void;
isSelected: (value: unknown) => boolean;
isDisabled: (value: unknown) => boolean;
toggleAll: () => void;
isAllSelected: () => boolean;
isAnySelected: () => boolean;
isMaxSelected: () => boolean;
clear: () => void;
reset: () => void;
all: import("svelte/store").Writable<unknown[]>;
};
indeterminate: Set<TValue>;
original: {
selected: import("..").MenuOption<TValue>[];
unselected: import("..").MenuOption<TValue>[];
};
}) => Promise<void>) | undefined;
}, "options"> | undefined;
onApply?: ((ctx: {
value: TValue[];
selection: {
selected: {} | unknown[] | null;
setSelected: (values: unknown[]) => void;
toggleSelected: (value: unknown) => void;
isSelected: (value: unknown) => boolean;
isDisabled: (value: unknown) => boolean;
toggleAll: () => void;
isAllSelected: () => boolean;
isAnySelected: () => boolean;
isMaxSelected: () => boolean;
clear: () => void;
reset: () => void;
all: import("svelte/store").Writable<unknown[]>;
};
indeterminate: Set<TValue>;
original: {
selected: import("..").MenuOption<TValue>[];
unselected: import("..").MenuOption<TValue>[];
};
}) => Promise<void>) | undefined;
};
events(): {
change: CustomEvent<{
value: TValue[] | undefined;
}>;
} & {
[evt: string]: CustomEvent<any>;
};
slots(): {
prepend: {
slot: string;
};
append: {};
beforeOptions: {
slot: string;
selection: {
selected: {} | unknown[] | null;
setSelected: (values: unknown[]) => void;
toggleSelected: (value: unknown) => void;
isSelected: (value: unknown) => boolean;
isDisabled: (value: unknown) => boolean;
toggleAll: () => void;
isAllSelected: () => boolean;
isAnySelected: () => boolean;
isMaxSelected: () => boolean;
clear: () => void;
reset: () => void;
all: import("svelte/store").Writable<unknown[]>;
};
};
afterOptions: {
slot: string;
selection: {
selected: {} | unknown[] | null;
setSelected: (values: unknown[]) => void;
toggleSelected: (value: unknown) => void;
isSelected: (value: unknown) => boolean;
isDisabled: (value: unknown) => boolean;
toggleAll: () => void;
isAllSelected: () => boolean;
isAnySelected: () => boolean;
isMaxSelected: () => boolean;
clear: () => void;
reset: () => void;
all: import("svelte/store").Writable<unknown[]>;
};
};
option: {
option: unknown;
label: any;
value: unknown[];
checked: any;
indeterminate: any;
disabled: any;
onChange: () => void;
};
actions: {
slot: string;
selection: {
selected: {} | unknown[] | null;
setSelected: (values: unknown[]) => void;
toggleSelected: (value: unknown) => void;
isSelected: (value: unknown) => boolean;
isDisabled: (value: unknown) => boolean;
toggleAll: () => void;
isAllSelected: () => boolean;
isAnySelected: () => boolean;
isMaxSelected: () => boolean;
clear: () => void;
reset: () => void;
all: import("svelte/store").Writable<unknown[]>;
};
};
};
}
export type MultiSelectFieldProps<TValue> = ReturnType<__sveltets_Render<TValue>['props']>;
export type MultiSelectFieldEvents<TValue> = ReturnType<__sveltets_Render<TValue>['events']>;
export type MultiSelectFieldSlots<TValue> = ReturnType<__sveltets_Render<TValue>['slots']>;
export default class MultiSelectField<TValue> extends SvelteComponentTyped<MultiSelectFieldProps<TValue>, MultiSelectFieldEvents<TValue>, MultiSelectFieldSlots<TValue>> {
}
export {};