office-ui-fabric-react/lib-commonjs/components/Stack/Stack.doc.js

Reusable React components for building experiences for Office 365.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
// Vertical Stack Examples
var Stack_Vertical_Basic_Example_1 = require("./examples/Stack.Vertical.Basic.Example");
var VerticalStackBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Basic.Example.tsx');
var VerticalStackBasicExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Basic.Example.tsx');
var Stack_Vertical_Reversed_Example_1 = require("./examples/Stack.Vertical.Reversed.Example");
var VerticalStackReversedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Reversed.Example.tsx');
var VerticalStackReversedExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Reversed.Example.tsx');
var Stack_Vertical_Spacing_Example_1 = require("./examples/Stack.Vertical.Spacing.Example");
var VerticalStackSpacingExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Spacing.Example.tsx');
var VerticalStackSpacingExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Spacing.Example.tsx');
var Stack_Vertical_Grow_Example_1 = require("./examples/Stack.Vertical.Grow.Example");
var VerticalStackGrowExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Grow.Example.tsx');
var VerticalStackGrowExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Grow.Example.tsx');
var Stack_Vertical_Shrink_Example_1 = require("./examples/Stack.Vertical.Shrink.Example");
var VerticalStackShrinkExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Shrink.Example.tsx');
var VerticalStackShrinkExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Shrink.Example.tsx');
var Stack_Vertical_Wrap_Example_1 = require("./examples/Stack.Vertical.Wrap.Example");
var VerticalStackWrapExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Wrap.Example.tsx');
var VerticalStackWrapExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Wrap.Example.tsx');
var Stack_Vertical_WrapAdvanced_Example_1 = require("./examples/Stack.Vertical.WrapAdvanced.Example");
var VerticalStackWrapAdvancedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.WrapAdvanced.Example.tsx');
var VerticalStackWrapAdvancedExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.WrapAdvanced.Example.tsx');
var Stack_Vertical_WrapNested_Example_1 = require("./examples/Stack.Vertical.WrapNested.Example");
var VerticalStackWrapNestedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.WrapNested.Example.tsx');
var VerticalStackWrapNestedExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.WrapNested.Example.tsx');
var Stack_Vertical_VerticalAlign_Example_1 = require("./examples/Stack.Vertical.VerticalAlign.Example");
var VerticalStackVerticalAlignExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.VerticalAlign.Example.tsx');
var VerticalStackVerticalAlignExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.VerticalAlign.Example.tsx');
var Stack_Vertical_HorizontalAlign_Example_1 = require("./examples/Stack.Vertical.HorizontalAlign.Example");
var VerticalStackHorizontalAlignExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.HorizontalAlign.Example.tsx');
var VerticalStackHorizontalAlignExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.HorizontalAlign.Example.tsx');
var Stack_Vertical_Configure_Example_1 = require("./examples/Stack.Vertical.Configure.Example");
var VerticalStackConfigureExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Configure.Example.tsx');
var VerticalStackConfigureExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Vertical.Configure.Example.tsx');
// Horizontal Stack Examples
var Stack_Horizontal_Basic_Example_1 = require("./examples/Stack.Horizontal.Basic.Example");
var HorizontalStackBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Basic.Example.tsx');
var HorizontalStackBasicExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Basic.Example.tsx');
var Stack_Horizontal_Reversed_Example_1 = require("./examples/Stack.Horizontal.Reversed.Example");
var HorizontalStackReversedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Reversed.Example.tsx');
var HorizontalStackReversedExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Reversed.Example.tsx');
var Stack_Horizontal_Spacing_Example_1 = require("./examples/Stack.Horizontal.Spacing.Example");
var HorizontalStackSpacingExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Spacing.Example.tsx');
var HorizontalStackSpacingExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Spacing.Example.tsx');
var Stack_Horizontal_Grow_Example_1 = require("./examples/Stack.Horizontal.Grow.Example");
var HorizontalStackGrowExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Grow.Example.tsx');
var HorizontalStackGrowExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Grow.Example.tsx');
var Stack_Horizontal_Shrink_Example_1 = require("./examples/Stack.Horizontal.Shrink.Example");
var HorizontalStackShrinkExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Shrink.Example.tsx');
var HorizontalStackShrinkExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Shrink.Example.tsx');
var Stack_Horizontal_Wrap_Example_1 = require("./examples/Stack.Horizontal.Wrap.Example");
var HorizontalStackWrapExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Wrap.Example.tsx');
var HorizontalStackWrapExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Wrap.Example.tsx');
var Stack_Horizontal_WrapAdvanced_Example_1 = require("./examples/Stack.Horizontal.WrapAdvanced.Example");
var HorizontalStackWrapAdvancedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.WrapAdvanced.Example.tsx');
var HorizontalStackWrapAdvancedExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.WrapAdvanced.Example.tsx');
var Stack_Horizontal_WrapNested_Example_1 = require("./examples/Stack.Horizontal.WrapNested.Example");
var HorizontalStackWrapNestedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.WrapNested.Example.tsx');
var HorizontalStackWrapNestedExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.WrapNested.Example.tsx');
var Stack_Horizontal_HorizontalAlign_Example_1 = require("./examples/Stack.Horizontal.HorizontalAlign.Example");
var HorizontalStackHorizontalAlignExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.HorizontalAlign.Example.tsx');
var HorizontalStackHorizontalAlignExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.HorizontalAlign.Example.tsx');
var Stack_Horizontal_VerticalAlign_Example_1 = require("./examples/Stack.Horizontal.VerticalAlign.Example");
var HorizontalStackVerticalAlignExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.VerticalAlign.Example.tsx');
var HorizontalStackVerticalAlignExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.VerticalAlign.Example.tsx');
var Stack_Horizontal_Configure_Example_1 = require("./examples/Stack.Horizontal.Configure.Example");
var HorizontalStackConfigureExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Configure.Example.tsx');
var HorizontalStackConfigureExampleCodepen = require('!@uifabric/codepen-loader!office-ui-fabric-react/src/components/Stack/examples/Stack.Horizontal.Configure.Example.tsx');
exports.StackPageProps = {
    title: 'Stack',
    componentName: 'Stack',
    componentUrl: 'https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/office-ui-fabric-react/src/components/Stack',
    examples: [
        {
            title: 'Basic Vertical Stack',
            code: VerticalStackBasicExampleCode,
            view: React.createElement(Stack_Vertical_Basic_Example_1.VerticalStackBasicExample, null),
            codepenJS: VerticalStackBasicExampleCodepen
        },
        {
            title: 'Reversed Basic Vertical Stack',
            code: VerticalStackReversedExampleCode,
            view: React.createElement(Stack_Vertical_Reversed_Example_1.VerticalStackReversedExample, null),
            codepenJS: VerticalStackReversedExampleCodepen
        },
        {
            title: 'Vertical Stack - Gap and Padding Sizes',
            code: VerticalStackSpacingExampleCode,
            view: React.createElement(Stack_Vertical_Spacing_Example_1.VerticalStackSpacingExample, null),
            codepenJS: VerticalStackSpacingExampleCodepen
        },
        {
            title: 'Vertical Stack - Growing Items',
            code: VerticalStackGrowExampleCode,
            view: React.createElement(Stack_Vertical_Grow_Example_1.VerticalStackGrowExample, null),
            codepenJS: VerticalStackGrowExampleCodepen
        },
        {
            title: 'Vertical Stack - Shrinking Items',
            code: VerticalStackShrinkExampleCode,
            view: React.createElement(Stack_Vertical_Shrink_Example_1.VerticalStackShrinkExample, null),
            codepenJS: VerticalStackShrinkExampleCodepen
        },
        {
            title: 'Vertical Stack - Wrapping - Basic',
            code: VerticalStackWrapExampleCode,
            view: React.createElement(Stack_Vertical_Wrap_Example_1.VerticalStackWrapExample, null),
            codepenJS: VerticalStackWrapExampleCodepen
        },
        {
            title: 'Vertical Stack - Wrapping - Advanced',
            code: VerticalStackWrapAdvancedExampleCode,
            view: React.createElement(Stack_Vertical_WrapAdvanced_Example_1.VerticalStackWrapAdvancedExample, null),
            codepenJS: VerticalStackWrapAdvancedExampleCodepen
        },
        {
            title: 'Vertical Stack - Wrapping - Nested',
            code: VerticalStackWrapNestedExampleCode,
            view: React.createElement(Stack_Vertical_WrapNested_Example_1.VerticalStackWrapNestedExample, null),
            codepenJS: VerticalStackWrapNestedExampleCodepen
        },
        {
            title: 'Vertical Stack - Vertical Alignments',
            code: VerticalStackVerticalAlignExampleCode,
            view: React.createElement(Stack_Vertical_VerticalAlign_Example_1.VerticalStackVerticalAlignExample, null),
            codepenJS: VerticalStackVerticalAlignExampleCodepen
        },
        {
            title: 'Vertical Stack - Horizontal Alignments',
            code: VerticalStackHorizontalAlignExampleCode,
            view: React.createElement(Stack_Vertical_HorizontalAlign_Example_1.VerticalStackHorizontalAlignExample, null),
            codepenJS: VerticalStackHorizontalAlignExampleCodepen
        },
        {
            title: 'Vertical Stack - Configure Properties',
            code: VerticalStackConfigureExampleCode,
            view: React.createElement(Stack_Vertical_Configure_Example_1.VerticalStackConfigureExample, null),
            codepenJS: VerticalStackConfigureExampleCodepen
        },
        {
            title: 'Basic Horizontal Stack',
            code: HorizontalStackBasicExampleCode,
            view: React.createElement(Stack_Horizontal_Basic_Example_1.HorizontalStackBasicExample, null),
            codepenJS: HorizontalStackBasicExampleCodepen
        },
        {
            title: 'Reversed Basic Horizontal Stack',
            code: HorizontalStackReversedExampleCode,
            view: React.createElement(Stack_Horizontal_Reversed_Example_1.HorizontalStackReversedExample, null),
            codepenJS: HorizontalStackReversedExampleCodepen
        },
        {
            title: 'Horizontal Stack - Gap and Padding Sizes',
            code: HorizontalStackSpacingExampleCode,
            view: React.createElement(Stack_Horizontal_Spacing_Example_1.HorizontalStackSpacingExample, null),
            codepenJS: HorizontalStackSpacingExampleCodepen
        },
        {
            title: 'Horizontal Stack - Growing Items',
            code: HorizontalStackGrowExampleCode,
            view: React.createElement(Stack_Horizontal_Grow_Example_1.HorizontalStackGrowExample, null),
            codepenJS: HorizontalStackGrowExampleCodepen
        },
        {
            title: 'Horizontal Stack - Shrinking Items',
            code: HorizontalStackShrinkExampleCode,
            view: React.createElement(Stack_Horizontal_Shrink_Example_1.HorizontalStackShrinkExample, null),
            codepenJS: HorizontalStackShrinkExampleCodepen
        },
        {
            title: 'Horizontal Stack - Wrapping - Basic',
            code: HorizontalStackWrapExampleCode,
            view: React.createElement(Stack_Horizontal_Wrap_Example_1.HorizontalStackWrapExample, null),
            codepenJS: HorizontalStackWrapExampleCodepen
        },
        {
            title: 'Horizontal Stack - Wrapping - Advanced',
            code: HorizontalStackWrapAdvancedExampleCode,
            view: React.createElement(Stack_Horizontal_WrapAdvanced_Example_1.HorizontalStackWrapAdvancedExample, null),
            codepenJS: HorizontalStackWrapAdvancedExampleCodepen
        },
        {
            title: 'Horizontal Stack - Wrapping - Nested',
            code: HorizontalStackWrapNestedExampleCode,
            view: React.createElement(Stack_Horizontal_WrapNested_Example_1.HorizontalStackWrapNestedExample, null),
            codepenJS: HorizontalStackWrapNestedExampleCodepen
        },
        {
            title: 'Horizontal Stack - Horizontal Alignments',
            code: HorizontalStackHorizontalAlignExampleCode,
            view: React.createElement(Stack_Horizontal_HorizontalAlign_Example_1.HorizontalStackHorizontalAlignExample, null),
            codepenJS: HorizontalStackHorizontalAlignExampleCodepen
        },
        {
            title: 'Horizontal Stack - Vertical Alignments',
            code: HorizontalStackVerticalAlignExampleCode,
            view: React.createElement(Stack_Horizontal_VerticalAlign_Example_1.HorizontalStackVerticalAlignExample, null),
            codepenJS: HorizontalStackVerticalAlignExampleCodepen
        },
        {
            title: 'Horizontal Stack - Configure Properties',
            code: HorizontalStackConfigureExampleCode,
            view: React.createElement(Stack_Horizontal_Configure_Example_1.HorizontalStackConfigureExample, null),
            codepenJS: HorizontalStackConfigureExampleCodepen
        }
    ],
    overview: require('!raw-loader!office-ui-fabric-react/src/components/Stack/docs/StackOverview.md'),
    bestPractices: '',
    dos: require('!raw-loader!office-ui-fabric-react/src/components/Stack/docs/StackDos.md'),
    donts: require('!raw-loader!office-ui-fabric-react/src/components/Stack/docs/StackDonts.md'),
    isHeaderVisible: true,
    isFeedbackVisible: true,
    allowNativeProps: true
};
//# sourceMappingURL=Stack.doc.js.map