@pnp/spfx-property-controls
Version:
Reusable property pane controls for SharePoint Framework solutions
45 lines • 2.51 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const react_components_1 = require("@fluentui/react-components");
const Grid_1 = require("./grid/Grid");
class PropertyFieldButtonControl extends React.Component {
constructor(props) {
super(props);
this.state = Object.assign(Object.assign({}, props), { selectedItems: this.props.defaultSelectedItems });
}
///
componentDidUpdate(prevProps, prevState) {
if (prevProps.isVisible !== this.props.isVisible ||
prevProps.items !== this.props.items ||
prevProps.className !== this.props.className ||
prevProps.styles !== this.props.styles ||
prevProps.label !== this.props.label ||
prevProps.defaultSelectedItems !== this.props.defaultSelectedItems ||
prevProps.key !== this.props.key ||
prevProps.maxHeight !== this.props.maxHeight ||
prevProps.multiSelect !== this.props.multiSelect) {
this.setState({
items: this.props.items,
defaultSelectedItems: this.props.defaultSelectedItems,
});
}
}
render() {
var _a;
if (this.props.isVisible === false) {
return null;
}
const containerStyles = Object.assign({ display: "flex", flexDirection: "column", gap: 15, maxHeight: (_a = this.props.maxHeight) !== null && _a !== void 0 ? _a : 400, height: "100%", overflowY: "auto", marginTop: 20, marginBottom: 20 }, this.props.styles);
return (React.createElement(react_components_1.IdPrefixProvider, { value: "gridItems-pnp_pcontrol-" },
React.createElement(react_components_1.FluentProvider, { theme: react_components_1.teamsLightTheme },
React.createElement("div", { className: this.props.className, style: containerStyles },
React.createElement(react_components_1.Subtitle2, null,
" ",
this.props.label),
React.createElement(Grid_1.Grid, { items: this.state.items, onSelected: this.props.onSelected, defaultSelectedItems: this.props.defaultSelectedItems, multiSelect: this.props.multiSelect, column2Label: this.props.column2Label, column1Label: this.props.column1Label })))));
}
}
exports.default = PropertyFieldButtonControl;
//# sourceMappingURL=PropertyFieldGridControl.js.map