@pnp/spfx-property-controls/lib-commonjs/propertyFields/choiceGroupWithCallout/PropertyFieldChoiceGroupWithCallout.js

Reusable property pane controls for SharePoint Framework solutions

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.PropertyFieldChoiceGroupWithCallout = PropertyFieldChoiceGroupWithCallout;
const tslib_1 = require("tslib");
/* eslint-disable @typescript-eslint/no-explicit-any */
const React = tslib_1.__importStar(require("react"));
const ReactDOM = tslib_1.__importStar(require("react-dom"));
const omit_1 = tslib_1.__importDefault(require("lodash/omit"));
const sp_property_pane_1 = require("@microsoft/sp-property-pane");
const PropertyFieldChoiceGroupWithCalloutHost_1 = tslib_1.__importDefault(require("./PropertyFieldChoiceGroupWithCalloutHost"));
class PropertyFieldChoiceGroupWithCalloutBuilder {
    constructor(_targetProperty, _properties) {
        this.type = sp_property_pane_1.PropertyPaneFieldType.Custom;
        this.targetProperty = _targetProperty;
        this.properties = _properties;
        this.properties.onRender = this._render.bind(this);
        this.properties.onDispose = this._dispose.bind(this);
    }
    _render(elem, context, changeCallback) {
        // eslint-disable-line @typescript-eslint/no-explicit-any
        // IPropertyPaneChoiceGroupOption should be manually converted to IChoiceGroupOption
        const options = [];
        let selectedKey = undefined;
        this.properties.options.forEach((o) => {
            options.push(Object.assign(Object.assign({}, (0, omit_1.default)(o, ['key', 'iconProps'])), { iconProps: o.iconProps && {
                    iconName: o.iconProps.officeFabricIconFontName,
                }, key: o.key.toString() }));
            if (o.checked) {
                selectedKey = o.key;
            }
        });
        const props = this.properties;
        const element = React.createElement(PropertyFieldChoiceGroupWithCalloutHost_1.default, Object.assign(Object.assign({}, (0, omit_1.default)(props, ['options'])), { options: options, onChange: this._onChanged.bind(this), selectedKey: selectedKey }));
        ReactDOM.render(element, elem);
        if (changeCallback) {
            this._onChangeCallback = changeCallback;
        }
    }
    _dispose(elem) {
        ReactDOM.unmountComponentAtNode(elem);
    }
    _onChanged(ev, option) {
        if (this._onChangeCallback && option) {
            this._onChangeCallback(this.targetProperty, option.key);
        }
    }
}
function PropertyFieldChoiceGroupWithCallout(targetProperty, properties) {
    return new PropertyFieldChoiceGroupWithCalloutBuilder(targetProperty, Object.assign(Object.assign({}, properties), { onRender: null, onDispose: null }));
}
//# sourceMappingURL=PropertyFieldChoiceGroupWithCallout.js.map