Class: Designer

ReportDesigner.Designer

Represents the report designer component.

remarks Use this class to initialize the designer and interact with reports and UI APIs.

example

const designer = new Designer('#designer-host');

Table of contents

Constructors

• constructor

Accessors

• documentChanged

Methods

• createReport
• destroy
• focus
• getEditorAPI
• getNotificationsAPI
• getPanelsAPI
• getReport
• getReportPartsLibraries
• processCommand
• resetUserPreferences
• setActionHandlers
• setDataSourceTemplates
• setMasterReport
• setReport
• setReportPartsLibraries
• setResourceProvider

Constructors

constructor

• new Designer(element, config?)

Initializes a new instance of the Designer class within the specified container.

example

const designer = new Designer('#designer-host', { language: 'en' });

Parameters

Name	Type	Description
element	string | object | Element	The host element for the designer. This can be a CSS selector string, a DOM element, or a jQuery object.
config?	DesignerConfig	The designer configuration settings.

Accessors

documentChanged

• get documentChanged(): Event<DocumentChangedEventArgs>

Gets the event raised when the document changes.

Returns

Event<DocumentChangedEventArgs>

Methods

createReport

▸ createReport(reportInfo, whenDirty?): Promise<void>

Creates a new report in the designer.

example

await designer.createReport({ reportType: 'CPL' });

Parameters

Name	Type	Description
reportInfo	NewReportInfo	The report information used to create the report.
whenDirty?	WhenDirty	The behavior when there are unsaved changes.

Returns

Promise<void>

A promise that resolves when the report is created.

---

destroy

▸ destroy(): Promise<void>

Destroys the designer instance and releases resources.

example

await designer.destroy();

Returns

Promise<void>

---

focus

▸ focus(): void

Moves focus to the designer.

example

designer.focus();

Returns

void

---

getEditorAPI

▸ getEditorAPI(): Promise<EditorAPI>

Gets the editor API for manipulating the report.

example

const editorApi = await designer.getEditorAPI();
editorApi.copy();

Returns

Promise<EditorAPI>

A promise that resolves to the editor API.

---

getNotificationsAPI

▸ getNotificationsAPI(): Promise<NotificationsAPI>

Gets the notifications API.

example

const notifications = await designer.getNotificationsAPI();
notifications.info('Report saved');

Returns

Promise<NotificationsAPI>

A promise that resolves to the notifications API.

---

getPanelsAPI

▸ getPanelsAPI(): Promise<PanelsAPI>

Gets the panels API for the menu and sidebar.

example

const panels = await designer.getPanelsAPI();
panels.menu.open('file');

Returns

Promise<PanelsAPI>

A promise that resolves to the panels API.

---

getReport

▸ getReport(): Promise<ReportInfo>

Gets the current report information.

example

const info = await designer.getReport();

Returns

Promise<ReportInfo>

A promise that resolves to the report information.

---

getReportPartsLibraries

▸ getReportPartsLibraries(): Promise<ReportPartsLibrary[]>

Gets the list of available Report Parts libraries.

example

const libraries = await designer.getReportPartsLibraries();

Returns

Promise<ReportPartsLibrary[]>

A promise that resolves to the list of libraries.

---

processCommand

▸ processCommand(cmd): Promise<void>

Processes a designer command.

example

await designer.processCommand('save');

Parameters

Name	Type	Description
cmd	DesignerCommand	The command to process.

Returns

Promise<void>

A promise that resolves when the command is processed.

---

resetUserPreferences

▸ resetUserPreferences(config?): Promise<void>

Resets stored user preferences to designer defaults.

example

await designer.resetUserPreferences({ units: 'cm' });

Parameters

Name	Type	Description
config?	Partial<DesignerConfig>	Optional configuration values to apply while resetting preferences.

Returns

Promise<void>

---

setActionHandlers

▸ setActionHandlers(actionHandlers): Promise<void>

Sets the action handlers for designer commands.

example

await designer.setActionHandlers({
	onSave: async (info) => ({ displayName: info.displayName }),
});

Parameters

Name	Type	Description
actionHandlers	ActionHandlers	The action handlers to apply.

Returns

Promise<void>

A promise that resolves when the handlers are set.

---

setDataSourceTemplates

▸ setDataSourceTemplates(templates): Promise<void>

Sets the data source templates used by the data panel.

example

await designer.setDataSourceTemplates([]);

Parameters

Name	Type	Description
templates	DataSourceTemplate[]	The data source templates.

Returns

Promise<void>

A promise that resolves when the templates are set.

---

setMasterReport

▸ setMasterReport(masterReportId): Promise<void>

Sets the master report by identifier.

example

await designer.setMasterReport('master-1');

Parameters

Name	Type	Description
masterReportId	string	The master report identifier.

Returns

Promise<void>

A promise that resolves when the master report is set.

---

setReport

▸ setReport(report, whenDirty?, isDirtyInitial?): Promise<void>

Sets the current report in the designer.

example

await designer.setReport({ id: 'report-1', displayName: 'Sales Report' });

Parameters

Name	Type	Description
report	Report	The report to load.
whenDirty?	WhenDirty	The behavior when there are unsaved changes.
isDirtyInitial?	boolean	The initial value for the dirty state after load.

Returns

Promise<void>

A promise that resolves when the report is loaded.

---

setReportPartsLibraries

▸ setReportPartsLibraries(libraries): Promise<void>

Sets the list of available Report Parts libraries.

example

await designer.setReportPartsLibraries([]);

Parameters

Name	Type	Description
libraries	ReportPartsLibrary[]	The libraries to set.

Returns

Promise<void>

A promise that resolves when the libraries are set.

---

setResourceProvider

▸ setResourceProvider(resourceProvider): Promise<void>

Sets the resource provider used to resolve external resources.

example

await designer.setResourceProvider({
	getReportsList: async () => [],
});

Parameters

Name	Type	Description
resourceProvider	Partial<ResourceProvider>	The resource provider implementation.

Returns

Promise<void>

A promise that resolves when the provider is set.