UNPKG

@uifabric/experiments

Version:

Experimental React components for building experiences for Office 365.

44 lines 2.86 kB
"use strict"; var _this = this; Object.defineProperty(exports, "__esModule", { value: true }); var tslib_1 = require("tslib"); var React = require("react"); var experiments_1 = require("@uifabric/experiments"); var office_ui_fabric_react_1 = require("office-ui-fabric-react"); var SlotExampleUtils_1 = require("./SlotExampleUtils"); var AsComponent = /** @class */ (function (_super) { tslib_1.__extends(AsComponent, _super); function AsComponent() { return _super !== null && _super.apply(this, arguments) || this; } AsComponent.prototype.render = function () { return React.createElement("div", tslib_1.__assign({}, this.props)); }; return AsComponent; }(React.Component)); var AsComponentSFC = function (props) { return React.createElement("div", tslib_1.__assign({}, _this.props)); }; // tslint:disable:jsx-no-lambda // tslint:disable:jsx-key var SlotsStackExample = /** @class */ (function (_super) { tslib_1.__extends(SlotsStackExample, _super); function SlotsStackExample() { return _super !== null && _super.apply(this, arguments) || this; } SlotsStackExample.prototype.render = function () { return (React.createElement(office_ui_fabric_react_1.Stack, tslib_1.__assign({}, SlotExampleUtils_1.stackProps), React.createElement(experiments_1.Button, { icon: "share", content: "Stack: Props, as: 'AsComponent'", stack: { as: AsComponent } }), React.createElement(experiments_1.Button, { icon: "share", content: "Stack: Props, as: 'AsComponentSFC'", stack: { as: AsComponentSFC } }), React.createElement(experiments_1.Button, { icon: "share", content: "Stack: Props, as: 'div'", stack: { as: 'div' } }), React.createElement(experiments_1.Button, { icon: "share", content: "Stack: Props, as: 'span'", stack: { as: 'span' } }), React.createElement(experiments_1.Button, { icon: "share", stack: { horizontalAlign: 'start' }, content: "Stack: Object, horizontalAlign: left" }), React.createElement(experiments_1.Button, { icon: "share", stack: function (render) { return render(function (StackType, props) { return React.createElement(StackType, tslib_1.__assign({}, props)); }); }, content: "Stack: Function" }), React.createElement(experiments_1.Button, { icon: "share", content: "Stack: Function, VerticalStack", // Have to override component's default horizontal prop value stack: function (render) { return render(function (StackType, props) { return React.createElement(office_ui_fabric_react_1.Stack, tslib_1.__assign({}, props, { horizontal: false })); }); } }))); }; return SlotsStackExample; }(React.Component)); exports.SlotsStackExample = SlotsStackExample; //# sourceMappingURL=Slots.Stack.Example.js.map