obsidian-dev-utils
Version:
This is the collection of useful functions that you can use for your Obsidian plugin development
83 lines (82 loc) • 2.77 kB
text/typescript
/**
* @packageDocumentation
*
* Contains a component that displays and edits a multi-select dropdown.
*/
import type { Promisable } from 'type-fest';
import { ValueComponent } from 'obsidian';
import type { ValidatorElement } from '../../../HTMLElement.cjs';
import type { ValidatorComponent } from './ValidatorComponent.cjs';
import type { ValueComponentWithChangeTracking } from './ValueComponentWithChangeTracking.cjs';
/**
* A multi-select dropdown component.
*
* You can add this component using {@link SettingEx.addMultipleDropdown}.
*
* In order to add the styles for the component, use {@link initPluginContext} in your plugin's `onload()` function.
*
* Alternatively, you can copy styles from {@link https://github.com/mnaoumov/obsidian-dev-utils/releases/latest/download/styles.css}.
*/
export declare class MultipleDropdownComponent extends ValueComponent<readonly string[]> implements ValidatorComponent, ValueComponentWithChangeTracking<readonly string[]> {
/**
* A select element of the component.
*
* @returns The select element.
*/
get selectEl(): HTMLSelectElement;
/**
* A validator element of the component.
*
* @returns The validator element.
*/
get validatorEl(): ValidatorElement;
private readonly dropdownComponent;
/**
* Creates a new multiple dropdown component.
*
* @param containerEl - The container element of the component.
*/
constructor(containerEl: HTMLElement);
/**
* Adds an option to the dropdown.
*
* @param value - The value of the option.
* @param display - The display text of the option.
* @returns The component.
*/
addOption(value: string, display: string): this;
/**
* Adds multiple options to the dropdown.
*
* @param options - The options to add.
* @returns The component.
*/
addOptions(options: Record<string, string>): this;
/**
* Gets the value of the component.
*
* @returns The value of the component.
*/
getValue(): readonly string[];
/**
* Sets the callback function to be called when the component is changed.
*
* @param callback - The callback function to be called when the component is changed.
* @returns The component.
*/
onChange(callback: (value: readonly string[]) => Promisable<void>): this;
/**
* Sets the disabled state of the component.
*
* @param disabled - The disabled state to set.
* @returns The component.
*/
setDisabled(disabled: boolean): this;
/**
* Sets the value of the component.
*
* @param value - The value to set.
* @returns The component.
*/
setValue(value: readonly string[]): this;
}