"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.LegendsPage = void 0;
var tslib_1 = require("tslib");
var React = require("react");
var react_docsite_components_1 = require("@fluentui/react-docsite-components");
var Legends_Overflow_Example_1 = require("./Legends.Overflow.Example");
var Legends_Basic_Example_1 = require("./Legends.Basic.Example");
var Legends_WrapLines_Example_1 = require("./Legends.WrapLines.Example");
var LegendsOverflowExampleCode = require('!raw-loader?esModule=false!@fluentui/react-examples/src/react-charting/Legends/Legends.Overflow.Example.tsx');
var LegendsWrapLinesExampleCode = require('!raw-loader?esModule=false!@fluentui/react-examples/src/react-charting/Legends/Legends.WrapLines.Example.tsx');
var LegendsBasicExampleCode = require('!raw-loader?esModule=false!@fluentui/react-examples/src/react-charting/Legends/Legends.Basic.Example.tsx');
var LegendsPage = /** @class */ (function (_super) {
    tslib_1.__extends(LegendsPage, _super);
    function LegendsPage() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    LegendsPage.prototype.render = function () {
        return (React.createElement(react_docsite_components_1.ComponentPage, { title: "Legends", componentName: "Legends", exampleCards: React.createElement("div", null,
                React.createElement(react_docsite_components_1.ExampleCard, { title: "Legends with overflow", code: LegendsOverflowExampleCode },
                    React.createElement(Legends_Overflow_Example_1.LegendOverflowExample, null)),
                React.createElement(react_docsite_components_1.ExampleCard, { title: "Legends with wrap lines", code: LegendsWrapLinesExampleCode },
                    React.createElement(Legends_WrapLines_Example_1.LegendWrapLinesExample, null)),
                React.createElement(react_docsite_components_1.ExampleCard, { title: "Legends with no overflow", code: LegendsBasicExampleCode },
                    React.createElement(Legends_Basic_Example_1.LegendBasicExample, null))), propertiesTables: React.createElement(react_docsite_components_1.PropertiesTableSet, { sources: [
                    require('!raw-loader?esModule=false!@fluentui/react-charting/src/components/Legends/Legends.types.ts'),
                ], renderOnly: ['ILegendsProps', 'ILegend', 'ILegendsStyles'] }), overview: React.createElement("div", null,
                React.createElement("p", null, "The legends wrap based upon the space available for them. If there is not enough space to show all legends on a single line, the legends fall into an overflow menu. Text appears indicating the number of legends in the overflow menu. The legends are selectable and action to be performed upon clicking a certain legend can be passed.")) }));
    };
    return LegendsPage;
}(React.Component));
exports.LegendsPage = LegendsPage;
//# sourceMappingURL=LegendsPage.js.map