@pnp/spfx-property-controls
Version:
Reusable property pane controls for SharePoint Framework solutions
33 lines • 1.7 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.PalettePicker = void 0;
const tslib_1 = require("tslib");
const react_components_1 = require("@fluentui/react-components");
const React = tslib_1.__importStar(require("react"));
const SelectPalette_1 = require("./SelectPalette");
class PalettePicker extends React.Component {
constructor(props) {
super(props);
this.onPaletteChange = (palette) => {
this.setState({ selectedPalette: Object.keys(palette)[0] });
this.props.onPropertyChange(this.props.targetProperty, Object.keys(palette)[0]);
if (this.props.onSelectedPalette) {
this.props.onSelectedPalette(palette);
}
};
const availablePalettes = props.palettes || {};
const firstPaletteKey = Object.keys(availablePalettes)[0] || "";
this.state = {
selectedPalette: props.selectedPalette || firstPaletteKey,
};
}
render() {
return (React.createElement(React.Fragment, null,
React.createElement(react_components_1.IdPrefixProvider, { value: "color-selected-" },
React.createElement(react_components_1.FluentProvider, { theme: this.props.theme || react_components_1.webLightTheme, applyStylesToPortals: true },
React.createElement(react_components_1.Label, null, this.props.label),
React.createElement(SelectPalette_1.SelectPalette, { selectedPalette: this.state.selectedPalette, palettes: this.props.palettes, onPaletteChange: this.onPaletteChange })))));
}
}
exports.PalettePicker = PalettePicker;
//# sourceMappingURL=PalettePicker.js.map