@eccenca/gui-elements 22.0.0-rc.6 → 22.1.0-rc.0

package/dist/types/cmem/react-flow/configuration/workflow.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import colors from "./_colors-workflow.module.scss";
+declare const edgeTypes: {
+    default: import("react").MemoExoticComponent<(edge: import("./../../../extensions/react-flow/edges/EdgeStep").EdgeStepProps) => JSX.Element>;
+    success: import("react").MemoExoticComponent<(edge: import("./../../../extensions/react-flow/edges/EdgeStep").EdgeStepProps) => JSX.Element>;
+    warning: import("react").MemoExoticComponent<(edge: import("./../../../extensions/react-flow/edges/EdgeStep").EdgeStepProps) => JSX.Element>;
+    danger: import("react").MemoExoticComponent<(edge: import("./../../../extensions/react-flow/edges/EdgeStep").EdgeStepProps) => JSX.Element>;
+};
+declare const nodeTypes: {
+    default: import("react").MemoExoticComponent<(node: import("./../../../extensions/react-flow/nodes/NodeDefault").NodeProps<any, any>) => JSX.Element>;
+    dataset: import("react").MemoExoticComponent<(node: import("./../../../extensions/react-flow/nodes/NodeDefault").NodeProps<any, any>) => JSX.Element>;
+    linking: import("react").MemoExoticComponent<(node: import("./../../../extensions/react-flow/nodes/NodeDefault").NodeProps<any, any>) => JSX.Element>;
+    transform: import("react").MemoExoticComponent<(node: import("./../../../extensions/react-flow/nodes/NodeDefault").NodeProps<any, any>) => JSX.Element>;
+    task: import("react").MemoExoticComponent<(node: import("./../../../extensions/react-flow/nodes/NodeDefault").NodeProps<any, any>) => JSX.Element>;
+    workflow: import("react").MemoExoticComponent<(node: import("./../../../extensions/react-flow/nodes/NodeDefault").NodeProps<any, any>) => JSX.Element>;
+};
+export { edgeTypes, nodeTypes, colors, };

package/dist/types/components/AutoSuggestion/AutoSuggestion.d.ts

@@ -0,0 +1,67 @@
+/// <reference types="react" />
+export declare enum OVERWRITTEN_KEYS {
+    ArrowUp = "ArrowUp",
+    ArrowDown = "ArrowDown",
+    Enter = "Enter",
+    Tab = "Tab"
+}
+export declare type OverwrittenKeyTypes = typeof OVERWRITTEN_KEYS[keyof typeof OVERWRITTEN_KEYS];
+/** A single suggestion. */
+export interface ISuggestionBase {
+    value: string;
+    label?: string;
+    description?: string;
+}
+/** Same as ISuggestionBase, but with the query that was used to fetch this suggestion. */
+export interface ISuggestionWithReplacementInfo extends ISuggestionBase {
+    query: string;
+    from: number;
+    length: number;
+}
+/** The suggestions for a specific substring of the given input string. */
+export interface IReplacementResult {
+    replacementInterval: {
+        from: number;
+        length: number;
+    };
+    extractedQuery: string;
+    replacements: ISuggestionBase[];
+}
+export interface IPartialAutoCompleteResult {
+    inputString: string;
+    cursorPosition: number;
+    replacementResults: IReplacementResult[];
+}
+/** Validation result */
+export interface IValidationResult {
+    valid: boolean;
+    parseError?: {
+        message: string;
+        start: number;
+        end: number;
+    };
+}
+export interface IProps {
+    label?: string;
+    initialValue: string;
+    onChange: (currentValue: string) => any;
+    fetchSuggestions: (inputString: string, cursorPosition: number) => (IPartialAutoCompleteResult | undefined) | Promise<IPartialAutoCompleteResult | undefined>;
+    checkInput?: (inputString: string) => IValidationResult | Promise<IValidationResult | undefined>;
+    onInputChecked?: (validInput: boolean) => any;
+    validationErrorText?: string;
+    clearIconText?: string;
+    onFocusChange?: (hasFocus: boolean) => any;
+    id?: string;
+    useTabForCompletions?: boolean;
+    /** An additional element that is put to the left side of the input field */
+    leftElement?: JSX.Element | null;
+    rightElement?: JSX.Element | null;
+    /** Placeholder tobe shown when no text has been entered, yet. */
+    placeholder?: string;
+    /** If the horizontal scrollbars should be shown. */
+    showScrollBar?: boolean;
+}
+/** Input component that allows partial, fine-grained auto-completion, i.e. of sub-strings of the input string.
+ * This is comparable to a one line code editor. */
+declare const AutoSuggestion: ({ label, initialValue, onChange, fetchSuggestions, checkInput, validationErrorText, clearIconText, onFocusChange, id, onInputChecked, leftElement, rightElement, useTabForCompletions, placeholder, showScrollBar }: IProps) => JSX.Element;
+export default AutoSuggestion;

package/dist/types/components/AutoSuggestion/AutoSuggestionList.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { ISuggestionWithReplacementInfo } from "./AutoSuggestion";
+export interface IDropdownProps {
+    options: Array<ISuggestionWithReplacementInfo>;
+    onItemSelectionChange: (item: ISuggestionWithReplacementInfo) => any;
+    isOpen: boolean;
+    loading?: boolean;
+    left?: number;
+    currentlyFocusedIndex: number;
+    itemToHighlight: (item: ISuggestionWithReplacementInfo | undefined) => any;
+}
+/** A drop-down-like list that can be used in combination with other components to show and select items. */
+export declare const AutoSuggestionList: ({ isOpen, options, loading, onItemSelectionChange, left, currentlyFocusedIndex, itemToHighlight, }: IDropdownProps) => JSX.Element | null;

package/dist/types/components/AutoSuggestion/SingleLineCodeEditor.d.ts

@@ -0,0 +1,25 @@
+/// <reference types="react" />
+import "codemirror/addon/display/placeholder";
+import "codemirror/mode/sparql/sparql.js";
+import { Editor as CodeMirrorEditor } from "codemirror";
+export interface IEditorProps {
+    setEditorInstance: (editor: CodeMirrorEditor) => any;
+    onChange: (value: string) => any;
+    onCursorChange: (pos: any, coords: any) => any;
+    mode?: string;
+    initialValue: string;
+    onFocusChange: (focused: boolean) => any;
+    onKeyDown: (event: KeyboardEvent) => any;
+    onSelection: (ranges: IRange[]) => any;
+    enableTab?: boolean;
+    /** Placeholder tobe shown when no text has been entered, yet. */
+    placeholder?: string;
+    showScrollBar?: boolean;
+}
+export interface IRange {
+    from: number;
+    to: number;
+}
+/** A single-line code editor. */
+declare const SingleLineCodeEditor: ({ setEditorInstance, onChange, onCursorChange, mode, initialValue, onFocusChange, onKeyDown, onSelection, enableTab, placeholder, showScrollBar }: IEditorProps) => JSX.Element;
+export default SingleLineCodeEditor;

package/dist/types/components/AutocompleteField/AutoCompleteField.d.ts

@@ -0,0 +1,111 @@
+import React from "react";
+import { HTMLInputProps, IInputGroupProps, IPopoverProps } from "@blueprintjs/core";
+declare type SearchFunction<T extends any> = (value: string) => T[];
+declare type AsyncSearchFunction<T extends any> = (value: string) => Promise<T[]>;
+export interface IRenderModifiers {
+    active: boolean;
+    disabled?: boolean;
+    styleWidth: IElementWidth;
+    highlightingEnabled: boolean;
+}
+/**
+ * Parameters for the auto-complete field parameterized by T and U.
+ * @param T is the input data structure/type of the items that can be selected.
+ * @param UPDATE_VALUE The value type that will be pushed into the onChange callback.
+ */
+export interface IAutoCompleteFieldProps<T extends any, UPDATE_VALUE extends any> {
+    /**
+     * Fired when text is typed into the input field. Returns a list of items of type T.
+     */
+    onSearch: SearchFunction<T> | AsyncSearchFunction<T>;
+    /**
+     * Fired when value selected from input
+     * @param value The value that has been converted with itemValueSelector.
+     * @param e     The event
+     */
+    onChange?(value: UPDATE_VALUE, e?: React.SyntheticEvent<HTMLElement>): any;
+    /**
+     * The initial value for the auto-complete input field
+     */
+    initialValue?: T;
+    /**
+     * Returns the UI representation of the selectable items.
+     * If the return value is a string, a default render component will be displayed with search highlighting.
+     *
+     * @param item  The item that should be displayed as an option in the select list.
+     * @param query The current search query
+     * @param modifiers Modifiers for rendered elements, e.g. active, disabled.
+     * @param handleClick The function that needs to be called when the rendered item gets clicked. Else a selection
+     *                    via mouse is not possible. This only needs to be used when returning a JSX.Element.
+     */
+    itemRenderer(item: T, query: string, modifiers: IRenderModifiers, handleClick: () => any): string | JSX.Element;
+    /** Renders the string that should be displayed in the input field after the item has been selected.
+     */
+    itemValueRenderer(item: T): string;
+    /**
+     * Selects the part from the auto-completion item that is called with the onChange callback.
+     * @param item The selected item that should be converted to the value that onChange is called with.
+     */
+    itemValueSelector(item: T): UPDATE_VALUE;
+    /** The string representation of the actual value, i.e. without meta data etc. This will be used to compare if values are equal. */
+    itemValueString(item: T): string;
+    /** The text that should be displayed when no search result has been found and no custom entry can be created. */
+    noResultText: string;
+    /**
+     * Props to spread to the underlying input field. This is BlueprintJs specific. To control this input, use
+     * `query` and `onQueryChange` instead of `inputProps.value` and
+     * `inputProps.onChange`.
+     */
+    inputProps?: IInputGroupProps & HTMLInputProps;
+    /**
+     * Optional props of the BlueprintJs specific popover element.
+     */
+    popoverProps?: Partial<IPopoverProps>;
+    /** Defines if a value can be reset, i.e. a reset icon is shown and the value is set to a specific value.
+     *  When undefined, a value cannot be reset.
+     */
+    reset?: {
+        /** Returns true if the currently set value can be reset, i.e. set to the resetValue. The reset icon is only
+         *  shown if true is returned. */
+        resettableValue(value: T): boolean;
+        /** The value onChange is called with when a reset action is triggered. */
+        resetValue: UPDATE_VALUE;
+        /** The reset button text that is shown on hovering over the reset icon. */
+        resetButtonText: string;
+    };
+    /** If enabled the auto completion component will auto focus. */
+    autoFocus?: boolean;
+    /** Contains methods for new item creation. If undefined no new, custom items can be created. */
+    createNewItem?: {
+        /** Creates a new item from the query. */
+        itemFromQuery: (query: string) => T;
+        /** Renders how the option to newly create an item should look like in the selection list. */
+        itemRenderer: (query: string, modifiers: IRenderModifiers, handleClick: React.MouseEventHandler<HTMLElement>) => JSX.Element | undefined;
+        /** If the new item option will always be shown as the first entry in the suggestion list, else it will be the last entry.
+         * @default false
+         */
+        showNewItemOptionFirst?: boolean;
+    };
+    /** If true the input field will be disabled. */
+    disabled?: boolean;
+    /** The value to which the search query should be reset after the popover closes.
+     *  By default the query is reset to the result of itemValueRenderer(selectedValue).
+     *
+     * @param selectedValue The currently selected value.
+     */
+    resetQueryToValue?(selectedValue: T): string;
+}
+/** Style object to be used in menu option items. */
+export interface IElementWidth {
+    width: string;
+    maxWidth: string;
+}
+/** Auto-complete input widget. */
+export declare function AutoCompleteField<T extends any, UPDATE_VALUE extends any>(props: IAutoCompleteFieldProps<T, UPDATE_VALUE>): JSX.Element;
+export declare namespace AutoCompleteField {
+    var defaultProps: {
+        autoFocus: boolean;
+        disabled: boolean;
+    };
+}
+export {};

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

@@ -0,0 +1,59 @@
+import React from "react";
+import { ButtonProps as BlueprintButtonProps, AnchorButtonProps as BlueprintAnchorButtonProps } from "@blueprintjs/core";
+import { TooltipProps } from "./../Tooltip/Tooltip";
+import { ValidIconName } from "../Icon/canonicalIconNames";
+export declare type AnchorOrButtonProps = Omit<BlueprintButtonProps, "elementRef" | "icon" | "rightIcon"> | Omit<BlueprintAnchorButtonProps, "elementRef" | "icon" | "rightIcon">;
+export interface ButtonProps extends React.HTMLAttributes<HTMLElement> {
+    /**
+    * Always use this when the button triggers an affirmative action, e.g. confirm a process.
+    * The button is displayed with primary color scheme.
+    */
+    affirmative?: boolean;
+    /**
+    * Always use this when the button triggers an disruptive action, e.g. delete or remove.
+    * The button is displayed with primary color scheme.
+    */
+    disruptive?: boolean;
+    /**
+    * Use this when a button is important enough to highlight it in a set of other buttons.
+    * The button is displayed with primary color scheme.
+    */
+    elevated?: boolean;
+    /**
+    * The button is displayed with primary color scheme.
+    */
+    hasStatePrimary?: boolean;
+    /**
+    * The button is displayed with success (some type of green) color scheme.
+    */
+    hasStateSuccess?: boolean;
+    /**
+    * The button is displayed with warning (some type of orange) color scheme.
+    */
+    hasStateWarning?: boolean;
+    /**
+    * The button is displayed with danger (some type of red) color scheme.
+    */
+    hasStateDanger?: boolean;
+    /**
+    * takes in either a string of text or a react element to display as a tooltip when the button is hovered.
+    */
+    tooltip?: string | JSX.Element | null;
+    /**
+    * Object with additional properties for the tooltip.
+    */
+    tooltipProperties?: Partial<Omit<TooltipProps, "content" | "children">>;
+    /**
+    * If an URL is set then the button is included as HTML anchor element instead of a button form element.
+    */
+    href?: string;
+    icon?: ValidIconName | JSX.Element;
+    rightIcon?: ValidIconName | JSX.Element;
+    target?: string;
+}
+/**
+ * Display a button element to enable user interaction.
+ * It normally should trigger action when clicked.
+ */
+declare function Button({ children, className, affirmative, disruptive, elevated, hasStatePrimary, hasStateSuccess, hasStateWarning, hasStateDanger, icon, rightIcon, tooltip, tooltipProperties, ...restProps }: ButtonProps & AnchorOrButtonProps): JSX.Element;
+export default Button;

package/dist/types/components/ContextOverlay/ContextMenu.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { ValidIconName } from "../Icon/canonicalIconNames";
+interface ContextMenuProps {
+    togglerElement?: ValidIconName | JSX.Element;
+    [key: string]: any;
+}
+declare function ContextMenu({ children, className, togglerElement, togglerText, togglerLarge, tooltipAsTitle, ...restProps }: ContextMenuProps): JSX.Element;
+export default ContextMenu;

package/dist/types/components/Dialog/Modal.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import { OverlayProps, IOverlayState } from "@blueprintjs/core";
+export interface ModalProps extends OverlayProps, IOverlayState {
+    children: React.ReactNode | React.ReactNode[];
+    /**
+     * A space-delimited list of class names to pass along to the BlueprintJS `Overlay` element that is used to create the modal.
+     */
+    overlayClassName?: string;
+    /**
+     * Size of the modal.
+     */
+    size?: "tiny" | "small" | "regular" | "large" | "fullscreen";
+    /**
+     * Prevents that a backdrop area is displayed behind the modal elements.
+     */
+    preventBackdrop?: boolean;
+    /** Optional props for the wrapper div element inside the modal overlay. */
+    wrapperDivProps?: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
+}
+/**
+ * Displays contents on top of other elements, used to create dialogs.
+ * This element can be used to create own modal elements and edge cases for modal dialogs.
+ * For most situations the usage of `SimpleDialog` and `AlertDialog` should be sufficent.
+ */
+declare function Modal({ children, className, overlayClassName, size, canOutsideClickClose, canEscapeKeyClose, preventBackdrop, wrapperDivProps, ...otherProps }: ModalProps): JSX.Element;
+export default Modal;

package/dist/types/components/Dialog/SimpleDialog.d.ts

@@ -0,0 +1,43 @@
+import React from "react";
+import { IntentTypes } from "../../common/Intent";
+import { ModalProps } from "./Modal";
+import { TestableComponent } from "../interfaces";
+export interface SimpleDialogProps extends ModalProps, TestableComponent {
+    /**
+     * The title of the dialog.
+     */
+    title?: string;
+    /**
+     * Parts of the dialog are separated by a horizontal ruler.
+     */
+    hasBorder?: boolean;
+    /**
+     * Include elements to the action footer, e.g. buttons.
+     */
+    actions?: React.ReactNode | React.ReactNode[];
+    /**
+     * If populated with elements, then a second contant area is included before the action footer.
+     * Mainly provided to include `Notification` elements.
+     */
+    notifications?: React.ReactNode | React.ReactNode[];
+    /**
+     * Can contain elements actionable/non-actionable elements display right-aligned to the dialog title.
+     */
+    headerOptions?: null | JSX.Element | JSX.Element[];
+    /**
+     * If enabled neither closing via `esc` key or clicking outside of the component will work, except explicitly specified.
+     */
+    preventSimpleClosing?: boolean;
+    /**
+     * Define purpose of the dialog, e.g. if it is a warning.
+     */
+    intent?: IntentTypes;
+    /** Optional props for the wrapper div element inside the modal. */
+    wrapperDivProps?: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
+}
+/**
+ * Simplifies the dialog display by providing a direct `Card` template for the `Modal` element.
+ * Inherits all properties from `Modal`.
+ */
+declare function SimpleDialog({ children, canOutsideClickClose, canEscapeKeyClose, title, actions, notifications, hasBorder, preventSimpleClosing, intent, headerOptions, ...otherProps }: SimpleDialogProps): JSX.Element;
+export default SimpleDialog;

package/dist/types/components/Icon/Icon.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+import { IconProps as CarbonIconProps } from "carbon-components-react";
+import { IntentTypes } from "../../common/Intent";
+import { TooltipProps } from "./../Tooltip/Tooltip";
+import { ValidIconName } from "./canonicalIconNames";
+export interface IconProps extends Omit<CarbonIconProps, "icon" | "description" | "name"> {
+    className?: string;
+    name: ValidIconName | string[];
+    description?: string;
+    large?: boolean;
+    small?: boolean;
+    tooltipText?: string;
+    tooltipOpenDelay?: number;
+    tooltipProperties?: Partial<Omit<TooltipProps, "content" | "children">>;
+    intent?: IntentTypes;
+}
+/** Returns the first icon name that exists or the fallback icon name. */
+export declare const findExistingIconName: (iconNames: string[], fallbackIconName?: ValidIconName) => ValidIconName;
+declare function Icon({ className, name, large, small, tooltipText, tooltipOpenDelay, tooltipProperties, intent, ...restProps }: IconProps): JSX.Element;
+export default Icon;

package/dist/types/components/Icon/IconButton.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { ButtonProps, AnchorOrButtonProps } from "../Button/Button";
+import { ValidIconName } from "./canonicalIconNames";
+interface IconButtonProps extends ButtonProps {
+    name: ValidIconName | string[];
+    className?: string;
+    text?: string;
+    tooltipOpenDelay?: number;
+    large?: boolean;
+    small?: boolean;
+    tooltipAsTitle?: boolean;
+    href?: string;
+    description?: string;
+}
+/** A button with an icon instead of text. */
+declare function IconButton({ className, name, text, tooltipProperties, description, tooltipOpenDelay, tooltipAsTitle, ...restProps }: IconButtonProps & AnchorOrButtonProps): JSX.Element;
+export default IconButton;

package/dist/types/components/Icon/canonicalIconNames.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+/** Valid icon names. */
+export declare type ValidIconName = "application-dataintegration" | "application-homepage" | "application-useraccount" | "application-warning" | "application-mapping" | "application-explore" | "application-vocabularies" | "application-queries" | "application-legacygui" | "application-activities" | "module-timetracker" | "module-accesscontrol" | "module-annotation" | "module-dashboard" | "module-search" | "module-visualization" | "module-reports" | "module-thesauri" | "module-linkedrules" | "module-integrations" | "module-gdprsearch" | "toggler-showmore" | "toggler-showless" | "toggler-moveright" | "toggler-moveleft" | "toggler-maximize" | "toggler-minimize" | "toggler-tree" | "navigation-back" | "navigation-forth" | "navigation-close" | "navigation-jump" | "navigation-last" | "navigation-previous" | "navigation-next" | "navigation-first" | "item-moremenu" | "item-vertmenu" | "item-viewdetails" | "item-clone" | "item-edit" | "item-evaluation" | "item-execution" | "item-info" | "item-remove" | "item-add-artefact" | "item-launch" | "item-download" | "item-question" | "item-copy" | "item-save" | "item-start" | "item-stop" | "item-reload" | "item-shuffle" | "item-draggable" | "operation-search" | "operation-clear" | "operation-undo" | "operation-redo" | "operation-logout" | "operation-filter" | "operation-filteredit" | "operation-comparison" | "operation-transform" | "operation-aggregation" | "data-sourcepath" | "data-targetpath" | "list-sort" | "list-sortasc" | "list-sortdesc" | "state-info" | "state-success" | "state-warning" | "state-danger" | "state-unchecked" | "state-checked" | "state-partlychecked" | "artefact-project" | "artefact-workflow" | "artefact-dataset" | "artefact-dataset-csv" | "artefact-dataset-multicsv" | "artefact-dataset-sparkview" | "artefact-dataset-sqlendpoint" | "artefact-dataset-jdbc" | "artefact-dataset-xml" | "artefact-dataset-json" | "artefact-dataset-excel" | "artefact-dataset-file" | "artefact-dataset-eccencadataplatform" | "artefact-dataset-sparqlendpoint" | "artefact-dataset-neo4j" | "artefact-transform" | "artefact-linking" | "artefact-task" | "artefact-customtask" | "artefact-file" | "artefact-embedded" | "artefact-remote" | "artefact-deprecated" | "artefact-uncategorized" | "artefact-rawdata" | "artefact-report" | "activity-error-report" | "select-caret" | "linked-item" | "operation-auto-graph-layout" | "unlinked-item" | "write-protected" | "undefined" | "Undefined";
+export interface IconSized {
+    small: (props: any) => JSX.Element | null;
+    normal: (props: any) => JSX.Element | null;
+    large: (props: any) => JSX.Element | null;
+}
+declare const canonicalIconNames: Record<ValidIconName, IconSized>;
+export default canonicalIconNames;

package/dist/types/components/MultiSelect/MultiSelect.d.ts

@@ -0,0 +1,79 @@
+/// <reference types="react" />
+import { MultiSelectProps } from "@blueprintjs/select";
+interface SelectedParamsType<T> {
+    newlySelected: T;
+    selectedItems: T[];
+    createdItems: Partial<T>[];
+}
+interface IProps<T> extends Pick<MultiSelectProps<T>, "items" | "placeholder" | "openOnKeyDown"> {
+    /**
+     * field in an item, that differentiates on item from the other.
+     */
+    equalityProp: string;
+    /**
+     * field in the item object that would be used to describe the item.
+     * this would be used in the item selection list as well as the multi-select input
+     */
+    labelProp: string;
+    /**
+     * if new items that are not in the original item list can be created and appended
+     */
+    canCreateNewItem?: boolean;
+    /**
+     * When set to true will set the multi-select value with all the items provided
+     */
+    prePopulateWithItems?: boolean;
+    /**
+     *  function handler that would be called anytime an item is selected/deselected or an item is created/removed
+     */
+    onSelection?: (params: SelectedParamsType<T>) => void;
+    /**
+     * Props to spread to `Popover`. Note that `content` cannot be changed.
+     */
+    popoverProps?: MultiSelectProps<T>["popoverProps"];
+    /**
+     * Props to spread to `TagInput`. Use `query` and `onQueryChange` to control the input.
+     */
+    tagInputProps?: MultiSelectProps<T>["tagInputProps"];
+    /**
+     * prop to listen for query changes, when text is entered in the multi-select input
+     */
+    runOnQueryChange?: (query: string) => Promise<T[] | undefined>;
+    /**
+     * Whether the component should take up the full width of its container.
+     * This overrides `popoverProps.fill` and `tagInputProps.fill`.
+     */
+    fullWidth?: boolean;
+    /**
+     * text content to render when filtering items returns zero results.
+     * If omitted, "No results." will be rendered in this case.
+     */
+    noResultText?: string;
+    /**
+     * text content to render when a new item non-existing in filtered items is about to be created .
+     * If omitted, "No results." will be rendered in this case.
+     */
+    newItemCreationText?: string;
+    /**
+     * The input element is displayed with primary color scheme.
+     */
+    hasStatePrimary?: boolean;
+    /**
+     * The input element is displayed with success (some type of green) color scheme.
+     */
+    hasStateSuccess?: boolean;
+    /**
+     * The input element is displayed with success (some type of orange) color scheme.
+     */
+    hasStateWarning?: boolean;
+    /**
+     * The input element is displayed with success (some type of red) color scheme.
+     */
+    hasStateDanger?: boolean;
+    /**
+     * Disables the input element
+     */
+    disabled?: boolean;
+}
+declare function MultiSelect<T>({ items, prePopulateWithItems, equalityProp, labelProp, onSelection, canCreateNewItem, popoverProps, tagInputProps, runOnQueryChange, fullWidth, noResultText, newItemCreationText, hasStatePrimary, hasStateDanger, hasStateSuccess, hasStateWarning, disabled, ...otherProps }: IProps<T>): JSX.Element;
+export default MultiSelect;