Skip to main content

fast-select

An implementation of an HTML select element as a form-connected web-component.

Setup#

Basic Setup#

import {    provideFASTDesignSystem,    fastSelect,    fastOption,} from "@microsoft/fast-components";
provideFASTDesignSystem().register(fastSelect(), fastOption());

Customizing the Indicator#

import {    provideFASTDesignSystem,    fastSelect,    fastOption,} from "@microsoft/fast-components";
provideFASTDesignSystem().register(    fastSelect({        indicator: `...your indicator...`,    }),    fastOption());

Usage#

Live Editor
Result
SyntaxError: Unexpected token (1:8)
1 : return ()
            ^

Create your own design#

Select#

import {    Select,    SelectOptions,    selectTemplate as template,} from "@microsoft/fast-foundation";import { selectStyles as styles } from "./my-select.styles";
export const mySelect = Select.compose<SelectOptions>({    baseName: "select",    template,    styles,    indicator: `...default indicator...`,});

Option#

See listbox-option for more information.

Additional resources#