office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
73 lines • 8.63 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var React = require("react");
var example_app_base_1 = require("@uifabric/example-app-base");
var ComponentStatus_1 = require("../../demo/ComponentStatus/ComponentStatus");
var TextField_Basic_Example_1 = require("./examples/TextField.Basic.Example");
var TextField_Borderless_Example_1 = require("./examples/TextField.Borderless.Example");
var TextField_CustomRender_Example_1 = require("./examples/TextField.CustomRender.Example");
var TextField_ErrorMessage_Example_1 = require("./examples/TextField.ErrorMessage.Example");
var TextField_Icon_Example_1 = require("./examples/TextField.Icon.Example");
var TextField_Multiline_Example_1 = require("./examples/TextField.Multiline.Example");
var TextField_Placeholder_Example_1 = require("./examples/TextField.Placeholder.Example");
var TextField_Prefix_Example_1 = require("./examples/TextField.Prefix.Example");
var TextField_PrefixAndSuffix_Example_1 = require("./examples/TextField.PrefixAndSuffix.Example");
var TextField_checklist_1 = require("./TextField.checklist");
var TextField_Suffix_Example_1 = require("./examples/TextField.Suffix.Example");
var TextField_Underlined_Example_1 = require("./examples/TextField.Underlined.Example");
var TextField_AutoComplete_Example_1 = require("./examples/TextField.AutoComplete.Example");
var TextField_OnRenderDescription_Example_1 = require("./examples/TextField.OnRenderDescription.Example");
var TextFieldBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx');
var TextFieldBorderlessExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx');
var TextFieldCustomRenderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx');
var TextFieldErrorMessageExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx');
var TextFieldIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx');
var TextFieldMultilineExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx');
var TextFieldPlaceholderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx');
var TextFieldPrefixExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Prefix.Example.tsx');
var TextFieldPrefixAndSuffixExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.PrefixAndSuffix.Example.tsx');
var TextFieldSuffixExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Suffix.Example.tsx');
var TextFieldUnderlinedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx');
var TextFieldAutoCompleteExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.AutoComplete.Example.tsx');
var TextFieldOnRenderDescriptionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.OnRenderDescription.Example.tsx');
var TextFieldPage = /** @class */ (function (_super) {
tslib_1.__extends(TextFieldPage, _super);
function TextFieldPage() {
return _super !== null && _super.apply(this, arguments) || this;
}
TextFieldPage.prototype.render = function () {
return (React.createElement(example_app_base_1.ComponentPage, { title: 'TextField', componentName: 'TextFieldExample', componentUrl: 'https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/office-ui-fabric-react/src/components/TextField', exampleCards: React.createElement("div", null,
React.createElement(example_app_base_1.ExampleCard, { title: 'Default TextField with Label', code: TextFieldBasicExampleCode },
React.createElement(TextField_Basic_Example_1.TextFieldBasicExample, null)),
React.createElement(example_app_base_1.ExampleCard, { title: 'TextField with Placeholder', code: TextFieldPlaceholderExampleCode },
React.createElement(TextField_Placeholder_Example_1.TextFieldPlaceholderExample, null)),
React.createElement(example_app_base_1.ExampleCard, { title: 'Multiline TextField', code: TextFieldMultilineExampleCode },
React.createElement(TextField_Multiline_Example_1.TextFieldMultilineExample, null)),
React.createElement(example_app_base_1.ExampleCard, { title: 'Underlined TextField', code: TextFieldUnderlinedExampleCode },
React.createElement(TextField_Underlined_Example_1.TextFieldUnderlinedExample, null)),
React.createElement(example_app_base_1.ExampleCard, { title: 'Borderless TextField', code: TextFieldBorderlessExampleCode },
React.createElement(TextField_Borderless_Example_1.TextFieldBorderlessExample, null)),
React.createElement(example_app_base_1.ExampleCard, { title: 'TextField with browser AutoComplete', code: TextFieldAutoCompleteExampleCode },
React.createElement(TextField_AutoComplete_Example_1.TextFieldAutoCompleteExample, null))), implementationExampleCards: React.createElement("div", null,
React.createElement(example_app_base_1.ExampleCard, { title: 'Textfield with a prefix', code: TextFieldPrefixExampleCode },
React.createElement(TextField_Prefix_Example_1.TextFieldPrefixExample, null)),
React.createElement(example_app_base_1.ExampleCard, { title: 'Textfield with a suffix', code: TextFieldSuffixExampleCode },
React.createElement(TextField_Suffix_Example_1.TextFieldSuffixExample, null)),
React.createElement(example_app_base_1.ExampleCard, { title: 'Textfield with a prefix and a suffix', code: TextFieldPrefixAndSuffixExampleCode },
React.createElement(TextField_PrefixAndSuffix_Example_1.TextFieldPrefixAndSuffixExample, null)),
React.createElement(example_app_base_1.ExampleCard, { title: 'TextField with an icon', code: TextFieldIconExampleCode },
React.createElement(TextField_Icon_Example_1.TextFieldIconExample, null)),
React.createElement(example_app_base_1.ExampleCard, { title: 'TextField with custom Label', code: TextFieldCustomRenderExampleCode },
React.createElement(TextField_CustomRender_Example_1.TextFieldCustomRenderExample, null)),
React.createElement(example_app_base_1.ExampleCard, { title: 'TextField with custom description', code: TextFieldOnRenderDescriptionExampleCode },
React.createElement(TextField_OnRenderDescription_Example_1.TextFieldOnRenderDescriptionExample, null)),
React.createElement(example_app_base_1.ExampleCard, { title: 'TextField error message variations', code: TextFieldErrorMessageExampleCode },
React.createElement(TextField_ErrorMessage_Example_1.TextFieldErrorMessageExample, null))), allowNativeProps: true, nativePropsElement: ['input', 'textarea'], propertiesTables: React.createElement(example_app_base_1.PropertiesTableSet, { sources: [
require('!raw-loader!office-ui-fabric-react/src/components/TextField/TextField.types.ts')
] }), overview: React.createElement(example_app_base_1.PageMarkdown, null, require('!raw-loader!office-ui-fabric-react/src/components/TextField/docs/TextFieldOverview.md')), bestPractices: React.createElement("div", null), dos: React.createElement(example_app_base_1.PageMarkdown, null, require('!raw-loader!office-ui-fabric-react/src/components/TextField/docs/TextFieldDos.md')), donts: React.createElement(example_app_base_1.PageMarkdown, null, require('!raw-loader!office-ui-fabric-react/src/components/TextField/docs/TextFieldDonts.md')), isHeaderVisible: this.props.isHeaderVisible, componentStatus: React.createElement(ComponentStatus_1.ComponentStatus, tslib_1.__assign({}, TextField_checklist_1.TextFieldStatus)) }));
};
return TextFieldPage;
}(React.Component));
exports.TextFieldPage = TextFieldPage;
//# sourceMappingURL=TextFieldPage.js.map