@pnp/spfx-controls-react
Version:
Reusable React controls for SharePoint Framework solutions
59 lines • 3.17 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.ControlToggles = void 0;
var tslib_1 = require("tslib");
var React = tslib_1.__importStar(require("react"));
var react_1 = require("@fluentui/react");
var ControlToggles = /** @class */ (function (_super) {
tslib_1.__extends(ControlToggles, _super);
function ControlToggles(props, state) {
return _super.call(this, props) || this;
}
ControlToggles.prototype.render = function () {
var _this = this;
return (React.createElement("div", null,
React.createElement(react_1.TextField, { label: "Search", placeholder: "Search Controls", onChange: function (e, newValue) {
_this.setState({ filter: newValue });
} }),
this.getValidControls().map(function (control) {
if (_this.state && _this.state.filter && _this.state.filter.length > 0 && control.toLowerCase().indexOf(_this.state.filter.toLowerCase()) === -1) {
return null;
}
return (React.createElement(react_1.Toggle, { key: control, label: _this.getProperCase(control), checked: _this.props.controlVisibility && _this.props.controlVisibility[control] || false, onChange: function (e, checked) {
_this.props.onChange(control, checked);
} }));
})));
};
ControlToggles.prototype.getValidControls = function () {
var validControls = [
"all",
"AccessibleAccordion", "AdaptiveCardDesignerHost", "AdaptiveCardHost",
"AnimatedDialog", "Carousel", "ChartControl",
"ComboBoxListItemPicker", "ContentTypePicker", "Dashboard", "DateTimePicker",
"DragDropFiles", "DynamicForm", "EnhancedThemeProvider",
"FieldCollectionData", "FieldPicker", "FilePicker",
"FileTypeIcon", "FilterBar", "FolderExplorer", "FolderPicker",
"GroupPicker", "GridLayout", "HoverReactionsBar", "IconPicker", "IFrameDialog",
"IFramePanel", "ListItemPicker",
"ImagePicker", "ListItemAttachments", "ListItemComments",
"ListPicker", "ListView", "LivePersona",
"LocationPicker", "Map", "ModernAudio", "MonacoEditor",
"ModernTaxonomyPicker", "Pagination", "PeoplePicker",
"Placeholder", "Progress", "ProgressStepsIndicator", "RichText",
"ShareDialog", "SecurityTrimmedControl", "SiteBreadcrumb", "SitePicker",
"TaxonomyPicker", "TaxonomyTree", "Teams", "TermSetNavigation",
"TestControl", "Toolbar", "TreeView",
"UploadFiles", "UserPicker", "VariantThemeProvider",
"ViewPicker", "WebPartTitle", "Calendar"
];
return validControls;
};
ControlToggles.prototype.getProperCase = function (name) {
name = name.replace(/([A-Z])/g, ' $1');
name = name.replace(/^([a-z])/, function (match, p1) { return p1.toUpperCase(); });
return name;
};
return ControlToggles;
}(React.Component));
exports.ControlToggles = ControlToggles;
//# sourceMappingURL=ControlToggles.js.map