import * as React from 'react'; import type { IPropertyPaneConsumer } from '../propertyPaneConsumer/IPropertyPaneConsumer'; import type { PropertyPaneAction } from '../propertyPaneDefinitions/PropertyPaneAction'; import type { IInternalConfigurableOptionsController } from '../configurableOptionsController/IInternalConfigurableOptionsController'; /** * Copilot pane key. */ export declare const COPILOT_KEY: string; /** * Class which manages all the interactions between property pane and the property pane consumers, such as web parts. * * @internal */ export default class PropertyPaneController implements IInternalConfigurableOptionsController { private _propertyPaneContainerId; /** * Property pane data of the consumer currently being configured. */ private _currentPropertyPaneData; private _logSource; /** * Indicating whether the property pane is open or not. */ private _isOpen; /** * Id of the consumer being configured. */ private _currentlyConfiguredConsumerId; /** * If true, the property pane was rendered by a web part and not by host(for example - Canvas) or any other source. */ private _isPaneRenderedByWebPart; /** * Page content DOM element, which is the sibling of the property pane container element. If available, this element * will be animated in and out as the property pane opens and closes. */ private _pageContentElement; /** * Property pane container DOM element on the host page. */ private _propertyPaneContainer; /** * The root DOM element (div) of the property pane component. */ private _propertyPaneElement; /** * Configuration completion timeout */ private _configurationCompletionTimeout; /** * todo: This should be removed once the task (SPPPLAT VSO#222337) is completed. */ private _workbenchCommandBarElement; /** * Dictionary of all the registered property pane consumers. */ private _consumers; /** * Override title value for property panes loaded from this controller */ private _title; /** * Control data used in the top of the property pane only for app pages */ private _topControl; /** * Control data used for rendering width of property pane * Narrow width example: Outlook * Broad width example: Copilot */ private _paneWidthMode; private _propertyPaneChangeListeners; private _resizeHandler; /** * Instantiates the PropertyPaneController object. * * NOTE: [TODO] When the killswitch 'ConsumePropertyPaneControllerFromServiceScope' * is graduated remove this constructor and make the _constructor as the constructor * and still keep it as private. */ constructor(); /** * Adds a specified callback for property pane field changed events. * @param instanceId - the specified instanceId * @param callback - the specified callback function * @returns returns a function to unregister the callback function */ registerOnPropertyPaneFieldChangedListener(instanceId: string, callback: () => void): () => void; /** * Registers a property pane consumer with the property pane controller. * * @param instanceId - Instance id of the consumer. * @param consumer - Property pane consume to be registered. */ registerConsumer(instanceId: string, consumer: IPropertyPaneConsumer): void; /** * Returns true if the passed in instance Id, is a registered consumer. * @param instanceId - Instance id of the consumer. */ isConsumerRegistered(instanceId: string): boolean; /** * Get the currently configured consumer's instance Id */ get currentlyConfiguredConsumerId(): string | undefined; /** * API to request an action to be performed on the property pane. This helps in configuring a SharePoint component. * The inbuilt property pane is used for the configuration, with the below conditions: * * - propertyPaneAction is Open and then open the property pane. * - propertyPaneAction is Close and then close the property pane. * - propertyPaneAction is Toggle and the property pane is closed: in this case we open the property pane and * start the configuration process. * Example - This happens when web part configure button is clicked. * - propertyPaneAction is Toggle and the property pane is open: in this case, if the incoming consumer id * is different than the one being currently configured, we keep the property pane open * and change the active consumer being configured. * - propertyPaneAction is Default and the property pane is closed: do nothing * - propertyPaneAction is Default and the property pane is opened: change the property pane to display the * settings of the newly selected consumer. * Example - This happens when the user navigates between property pane consumers (ex: web parts). * * @param toBeConfiguredConsumerId - instance id of the consumer. * @param propertyPaneAction - indicates in what state the property pane should be. * @param renderedByWebPart - is the property pane rendered by a web part and not by Canvas or any other source. * @param context - additional data passed by the consumer, to be sent back to the same webpart */ requestAction(toBeConfiguredConsumerId: string, propertyPaneAction?: PropertyPaneAction, renderedByWebPart?: boolean, context?: any): void; forceClose(): void; /** * Returns true if the property pane is rendered by a consumer,example web part, RTE etc., * and not by the host, example canvas. * A component becomes consumer if it implements IPropertyPaneConsumer. */ isRenderedByConsumer(): boolean; /** * Returns true if the property pane is open. */ isOpen(): boolean; /** * Empty out the property pane when the web part being configured is deleted from the page. * * @param id - Instance id of the consumer. */ onConsumerDelete(id: string): void; /** * Allows the property panes title to be overridden. * * @param topControl - React element to be rendered at the top of the property pane. * @param title - Title of the property pane. * * @internal */ _setAppPagePropertyPaneTopData(topControl: React.ReactElement, title: string): void; /** * Causes the property pane to be rendered narrowly (320px vs 340px). * * @internal */ _setPropertyPaneToNarrowRender(narrow: boolean): void; /** * Instantiates the PropertyPaneController object. * * The constructor is private since this service should always be constructed * via the ServiceScope key. * * NOTE: When the killswitch 'ConsumePropertyPaneControllerFromServiceScope' * is graduated, this method will become the actual constructor. */ private _constructor; /** * Executes the request action on the property pane if appropriate. * * @param toBeConfiguredConsumer - component to be configured. * @param toBeConfiguredConsumerInstanceId - Instance id of the component to be configured. * @param propertyPaneAction - Action to be executed on the property pane. */ private _executeAction; /** * A private method to show the property pane. * * This method will also set the value of the '_isOpen' value appropriately. * Modifying the width of property pane requires updating the FAB right offset accordingly. */ private _showPropertyPane; private _removeAllPropertyPaneContainerClasses; /** * A private method to hide the property pane. * * This method will also set the value of the '_isOpen' value appropriately. */ private _hidePropertyPane; /** * Renders the property pane. * * @param currentConsumer - Current component for which the property pane is to be displayed. * @param recreatePropertyPane - Indicates whether property pane should be recreated or not. * @param reset - Indicating whether property pane state should be reset or not. * @param isDetails - Indicating whether this is rendered in openDetails scenario * @param context - additional data passed by the consumer, to be sent back to the same webpart */ private _renderPropertyPane; /** * Builds the data required to load the property pane and then loads the property pane component. * * @param propertyPaneData - property pane data for currently active consumer. * @param reset - Indicating whether property pane state should be reset or not. */ private _buildAndLoadPropertyPane; /** * Method to load the property pane component into the propertypanecontainer element using the * currentPropertyPaneData. * * @param recreatePropertyPane - Indicating whether property pane should be recreated or not. */ private _loadPropertyPaneComponent; /** * Allow the property pane to re-render itself. Used when navigating pages. */ private _reRender; /** * Property pane field change event handler. * * @param propertyName - Name of the property pane field changed. * @param newValue - New value. * This value could be undefined/empty in the case of custom field. */ private _onPropertyPaneFieldChanged; /** * Callback to handle the configuration events that originate in the property pane. * * @example * PropertyPaneClosed, PropertyPaneApplyClicked etc., */ private _onConfigurationEvent; /** * Method to fire the configuration events post toggling the property pane. * If toggling opened the property pane then fire both the 'PropertyPaneOpened' and 'PropertyPaneConfigurationStart' * events after the ANIMATION_TIMEOUT is elapsed. * Else if the toggling resulted in closing the property pane then fire 'PropertyPaneConfigurationComplete' event * and then after ANIMATION_TIMEOUT is elapsed fire 'PropertyPaneClosed' event. */ private _firePostToggleConfigurationEvents; /** * Method to fire the configuration events when the property pane did not toggle. * Fire the 'ConfigurationComplete' event on the current consumer and * then 'ConfigurationStart' for the new consumer. * * @param id - Id of the consumer to be configured. */ private _fireNoToggleConfigurationEvents; /** * Method to fire the configuration event to the host and the consumer. * * @param componentId - Id of the consumer to which the event needs to be sent. * @param configurationEvent - Kind of configuration event to fire. */ private _fireConfigurationEvent; /** * Private method to set the property pane related DOM elements, which are used in slide in slide out effect. */ private _setPropertyPaneDOMElements; /** * Removes all the children of the property pane container. */ private _clearPropertyPaneContainer; /** * Reset configuration completion timeout. */ private _resetConfigurationCompleteTimeout; /** * Clear configuration completion timeout. */ private _clearConfigurationCompleteTimeout; /** * Method to check whether the currently configured property pane is reactive or not. */ private _isCurrentlyConfiguredPropertyPaneReactive; /** * Method to get a consumer instance. */ private _tryGetConsumer; /** * Returns the property pane data which has only 'onClose' defined. This is used when we have to display * empty property pane, when there is nothing to configure. */ private _getEmptyPropertyPaneData; private _isPropertyPaneExpanded; private _isPropertyPaneExpandedClassActive; } //# sourceMappingURL=PropertyPaneController.d.ts.map