@pnp/spfx-property-controls
Version:
Reusable property pane controls for SharePoint Framework solutions
96 lines • 6.2 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const react_1 = require("@fluentui/react");
const strings = tslib_1.__importStar(require("PropertyControlStrings"));
const filePickerControls_1 = require("./filePickerControls");
const PropertyFieldFilePickerHost_module_scss_1 = tslib_1.__importDefault(require("./PropertyFieldFilePickerHost.module.scss"));
const GeneralHelper_1 = require("../../helpers/GeneralHelper");
const telemetry = tslib_1.__importStar(require("../../common/telemetry"));
/**
* Renders the control for PropertyFieldFilePicker component
*/
class PropertyFieldFilePickerHost extends React.Component {
constructor(props) {
super(props);
this.handleFileSave = (filePickerResult) => tslib_1.__awaiter(this, void 0, void 0, function* () {
this.props.onSave(filePickerResult);
(0, GeneralHelper_1.setPropertyValue)(this.props.properties, this.props.targetProperty, filePickerResult);
this.props.onPropertyChange(this.props.targetProperty, this.props.filePickerResult, filePickerResult);
if (typeof this.props.onChange !== 'undefined' &&
this.props.onChange !== null) {
this.props.onChange(this.props.targetProperty, filePickerResult);
}
});
this.handleFileChange = (filePickerResult) => tslib_1.__awaiter(this, void 0, void 0, function* () {
this.props.onChanged(filePickerResult);
if (typeof this.props.onChange !== 'undefined' &&
this.props.onChange !== null) {
this.props.onChange(this.props.targetProperty, filePickerResult);
}
});
this.handleCancel = () => {
if (this.props.onCancel) {
this.props.onCancel();
}
};
telemetry.track('PropertyFieldFilePicker', {
disabled: props.disabled,
});
}
render() {
return (React.createElement("div", null,
this.props.filePickerResult &&
this.props.filePickerResult.fileAbsoluteUrl && (React.createElement("div", { className: PropertyFieldFilePickerHost_module_scss_1.default.filePreview },
GeneralHelper_1.GeneralHelper.isImage(this.props.filePickerResult.fileName) && (React.createElement("img", { className: PropertyFieldFilePickerHost_module_scss_1.default.filePreviewImage, src: this.props.filePickerResult.fileAbsoluteUrl, alt: this.props.filePickerResult.fileName })),
React.createElement("div", { className: PropertyFieldFilePickerHost_module_scss_1.default.filePreviewDelete },
React.createElement(react_1.IconButton, { iconProps: { iconName: 'Delete' }, title: strings.DeleteSelectedFileButtonLabel, ariaLabel: strings.DeleteSelectedFileButtonLabel, onClick: () => {
this.handleFileSave(null)
.then(() => {
/* no-op; */
})
.catch(() => {
/* no-op; */
});
}, disabled: this.props.disabled }),
this.props.filePickerResult.fileName))),
React.createElement(filePickerControls_1.FilePicker, { required: this.props.required, disabled: this.props.disabled, bingAPIKey: this.props.bingAPIKey, accepts: this.props.accepts ? this.props.accepts : [], buttonIcon: this.props.buttonIcon ? this.props.buttonIcon : 'FileImage', onSave: (filePickerResult) => {
this.handleFileSave(filePickerResult)
.then(() => {
/* no-op; */
})
.catch(() => {
/* no-op; */
});
}, onChanged: (filePickerResult) => {
this.handleFileChange(filePickerResult)
.then(() => {
/* no-op; */
})
.catch(() => {
/* no-op; */
});
}, onCancel: this.handleCancel, context: this.props.context, filePickerResult: this.props.filePickerResult, buttonClassName: this.props.buttonClassName, buttonLabel: this.props.buttonLabel, label: this.props.label, key: this.props.key, itemsCountQueryLimit: this.props.itemsCountQueryLimit !== undefined
? this.props.itemsCountQueryLimit
: 100, hideWebSearchTab: this.props.hideWebSearchTab !== undefined
? this.props.hideWebSearchTab
: true, hideRecentTab: this.props.hideRecentTab !== undefined
? this.props.hideRecentTab
: false, hideSiteFilesTab: this.props.hideSiteFilesTab !== undefined
? this.props.hideSiteFilesTab
: false, hideLocalUploadTab: this.props.hideLocalUploadTab !== undefined
? this.props.hideLocalUploadTab
: false, hideLinkUploadTab: this.props.hideLinkUploadTab !== undefined
? this.props.hideLinkUploadTab
: false, hideOneDriveTab: this.props.hideOneDriveTab !== undefined
? this.props.hideOneDriveTab
: false, hideOrganisationalAssetTab: this.props.hideOrganisationalAssetTab !== undefined
? this.props.hideOrganisationalAssetTab
: false, hideStockImages: this.props.hideStockImages !== undefined
? this.props.hideStockImages
: false, panelClassName: this.props.panelClassName, storeLastActiveTab: this.props.storeLastActiveTab, defaultSelectedTab: this.props.defaultSelectedTab, allowExternalLinks: this.props.allowExternalLinks, checkIfFileExists: this.props.checkIfFileExists, includePageLibraries: this.props.includePageLibraries })));
}
}
exports.default = PropertyFieldFilePickerHost;
//# sourceMappingURL=PropertyFieldFilePickerHost.js.map