Skip to main content

fast-switch

An implementation of a switch as a form-connected web-component.

Setup#

Basic setup#

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

Customizing the Indicator#

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

Usage#

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

Create your own design#

import {    Switch,    SwitchOptions,    switchTemplate as template,} from "@microsoft/fast-foundation";import { switchStyles as styles } from "./my-switch.styles";
export const mySwitch = Switch.compose<SwitchOptions>({    baseName: "switch",    template,    styles,    switch: `...default switch indicator...`,});

Additional resources#