UNPKG

@pnp/spfx-controls-react

Version:

Reusable React controls for SharePoint Framework solutions

42 lines 2.22 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.Accordion = void 0; var tslib_1 = require("tslib"); var React = tslib_1.__importStar(require("react")); var Accordion_module_scss_1 = tslib_1.__importDefault(require("./Accordion.module.scss")); var css_1 = require("@uifabric/utilities/lib/css"); var Button_1 = require("@fluentui/react/lib/Button"); var telemetry = tslib_1.__importStar(require("../../common/telemetry")); /** * Icon styles. Feel free to change them */ var collapsedIcon = { iconName: 'ChevronRight', className: Accordion_module_scss_1.default.accordionChevron }; var expandedIcon = { iconName: 'ChevronDown', className: Accordion_module_scss_1.default.accordionChevron }; var Accordion = /** @class */ (function (_super) { tslib_1.__extends(Accordion, _super); function Accordion(props) { var _this = _super.call(this, props) || this; _this._drawerDiv = undefined; _this.state = { expanded: !props.defaultCollapsed }; collapsedIcon.iconName = props.collapsedIcon || 'CheveronRight'; expandedIcon.iconName = props.expandedIcon || 'CheveronDown'; telemetry.track('ReactAccordion', {}); return _this; } Accordion.prototype.render = function () { var _this = this; return (React.createElement("div", { className: (0, css_1.css)(Accordion_module_scss_1.default.accordion, this.props.className) }, React.createElement(Button_1.DefaultButton, { toggled: true, checked: this.state.expanded, text: this.props.title, iconProps: this.state.expanded ? expandedIcon : collapsedIcon, onClick: function () { _this.setState({ expanded: !_this.state.expanded }); }, "aria-expanded": this.state.expanded, "aria-controls": this._drawerDiv && this._drawerDiv.id }), this.state.expanded && React.createElement("div", { className: Accordion_module_scss_1.default.drawer, ref: function (el) { _this._drawerDiv = el; } }, this.props.children))); }; return Accordion; }(React.Component)); exports.Accordion = Accordion; //# sourceMappingURL=Accordion.js.map