UNPKG

@uifabric/experiments

Version:

Experimental React components for building experiences for Office 365.

36 lines 1.62 kB
import * as tslib_1 from "tslib"; import * as React from 'react'; import { Toggle } from '../index'; var tokens1 = { pillHoveredBackground: 'black', textColor: 'red' }; var tokens2 = { pillBackground: 'orange', pillJustifyContent: 'center', textColor: 'purple', thumbBackground: 'green' }; var tokens3 = { pillBackground: 'dimgrey', pillBorderColor: 'brown', textColor: 'darkred' }; var ToggleTokensObjectExample = /** @class */ (function (_super) { tslib_1.__extends(ToggleTokensObjectExample, _super); function ToggleTokensObjectExample() { return _super !== null && _super.apply(this, arguments) || this; } ToggleTokensObjectExample.prototype.render = function () { return (React.createElement("div", null, React.createElement(Toggle, { defaultChecked: true, label: "Example 1", onText: "On", offText: "Off", onChange: this._onChange, tokens: tokens1 }), React.createElement(Toggle, { defaultChecked: false, label: "Example 2", onText: "On", offText: "Off", onChange: this._onChange, tokens: tokens2 }), React.createElement(Toggle, { defaultChecked: true, disabled: true, label: "Example 3", onText: "On - Disabled", offText: "Off", tokens: tokens3 }))); }; ToggleTokensObjectExample.prototype._onChange = function (ev, checked) { console.log('toggle is ' + (checked ? 'checked' : 'not checked')); }; return ToggleTokensObjectExample; }(React.Component)); export { ToggleTokensObjectExample }; //# sourceMappingURL=Toggle.Tokens.Object.Example.js.map