@disy/cadenza.js 1.1.0 → 1.3.0

package/apidoc/types/WorksheetSource.html

@@ -20,7 +20,7 @@
 </div>
 <div class="tsd-comment tsd-typography"></div><aside class="tsd-sources">
 <ul>
-<li>Defined in <a href="https://github.com/DisyInformationssysteme/cadenza.js/blob/b4c918b/src/cadenza.js#L54">src/cadenza.js:54</a></li></ul></aside></div>
+<li>Defined in <a href="https://github.com/DisyInformationssysteme/cadenza.js/blob/23b23d8/src/cadenza.js#L54">src/cadenza.js:54</a></li></ul></aside></div>
 <div class="col-sidebar">
 <div class="page-menu">
 <div class="tsd-navigation settings">
@@ -45,6 +45,7 @@
 <li><a href="../interfaces/CadenzaEvent.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><g id="icon-256"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)"></path></g></svg><span>Cadenza<wbr/>Event</span></a></li>
 <li><a href="../interfaces/ExternalLinkKey.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-256"></use></svg><span>External<wbr/>Link<wbr/>Key</span></a></li>
 <li><a href="../interfaces/Geometry.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-256"></use></svg><span>Geometry</span></a></li>
+<li><a href="../interfaces/PageSource.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-256"></use></svg><span>Page<wbr/>Source</span></a></li>
 <li><a href="../interfaces/WorkbookKey.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-256"></use></svg><span>Workbook<wbr/>Key</span></a></li>
 <li><a href="../interfaces/WorkbookViewKey.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-256"></use></svg><span>Workbook<wbr/>View<wbr/>Key</span></a></li>
 <li><a href="../interfaces/WorksheetKey.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-256"></use></svg><span>Worksheet<wbr/>Key</span></a></li>
@@ -55,6 +56,8 @@
 <li><a href="GlobalId.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-4194304"></use></svg><span>Global<wbr/>Id</span></a></li>
 <li><a href="MediaType.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-4194304"></use></svg><span>Media<wbr/>Type</span></a></li>
 <li><a href="OperationMode.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-4194304"></use></svg><span>Operation<wbr/>Mode</span></a></li>
+<li><a href="PageType.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-4194304"></use></svg><span>Page<wbr/>Type</span></a></li>
+<li><a href="TablePart.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-4194304"></use></svg><span>Table<wbr/>Part</span></a></li>
 <li><a href="UiFeature.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-4194304"></use></svg><span>Ui<wbr/>Feature</span></a></li>
 <li><a href="WorkbookSource.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-4194304"></use></svg><span>Workbook<wbr/>Source</span></a></li>
 <li><a href="WorkbookViewSource.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="#icon-4194304"></use></svg><span>Workbook<wbr/>View<wbr/>Source</span></a></li>

package/cadenza.d.ts

@@ -48,6 +48,12 @@ export function cadenza(baseUrl: string, options?: {
  * * 'workbook-design' - The workbook designer
  * * 'workbook-view-management' - Add/Edit/Remove workbook views (Is included in 'workbook-design'.)
  * */
+/**
+ * @typedef PageSource - A well-known Cadenza page
+ * @property {PageType} page - The name of the page
+ *
+ * @typedef {'welcome'} PageType - A Cadenza well-known page name
+ */
 /**
  * @typedef Geometry - A [GeoJSON](https://geojson.org/) geometry object
  * @property {GeometryType} type - The type of the geometry
@@ -85,23 +91,25 @@ export class CadenzaClient {
     /** The iframe this client is using for embedding Cadenza. */
     get iframe(): HTMLIFrameElement | undefined;
     /**
-     * Show a workbook, worksheet or workbook view in an iframe.
+     * Show a page, workbook, worksheet or workbook view in an iframe.
      *
-     * @param {WorkbookSource | WorksheetSource | WorkbookViewSource} source - The source to show
+     * @param {PageSource | WorkbookSource | WorksheetSource | WorkbookViewSource} source - The source to show
      * @param {object} [options]
      * @param {UiFeature[]} [options.disabledUiFeatures] - Cadenza UI features to disable
+     * @param {boolean} [options.expandNavigator] - Indicates if the navigator should be expanded.
      * @param {boolean} [options.hideMainHeaderAndFooter] - Whether to hide the main Cadenza header and footer
      * @param {boolean} [options.hideWorkbookToolBar] - Whether to hide the workbook toolbar
      * @param {GlobalId} [options.highlightGlobalId] - The ID of an item to highlight / expand in the navigator
-     * @param {string} [options.mediaType] - Set to 'application/pdf' for views of type "JasperReports report"
+     * @param {MediaType} [options.mediaType] - Set to 'application/pdf' for views of type "JasperReports report"
      *     to show the report PDF directly, without any Cadenza headers or footers.
      * @param {OperationMode} [options.operationMode] - The mode in which a workbook should be operated
      * @param {AbortSignal} [options.signal] - A signal to abort the iframe loading
      * @return {Promise<void>} A Promise for when the iframe is loaded
      * @throws For invalid arguments
      */
-    show(source: WorkbookSource | WorksheetSource | WorkbookViewSource, { disabledUiFeatures, hideMainHeaderAndFooter, hideWorkbookToolBar, highlightGlobalId, mediaType, operationMode, signal, }?: {
+    show(source: PageSource | WorkbookSource | WorksheetSource | WorkbookViewSource, { disabledUiFeatures, expandNavigator, hideMainHeaderAndFooter, hideWorkbookToolBar, highlightGlobalId, mediaType, operationMode, signal, }?: {
         disabledUiFeatures?: UiFeature[] | undefined;
+        expandNavigator?: boolean | undefined;
         hideMainHeaderAndFooter?: boolean | undefined;
         hideWorkbookToolBar?: boolean | undefined;
         highlightGlobalId?: string | undefined;
@@ -115,6 +123,7 @@ export class CadenzaClient {
      * @param {WorkbookViewSource} mapView - The workbook map view to show
      * @param {object} [options] - Options
      * @param {UiFeature[]} [options.disabledUiFeatures] - Cadenza UI features to disable
+     * @param {boolean} [options.expandNavigator] - Indicates if the navigator should be expanded.
      * @param {Geometry} [options.geometry] - A geometry to show on the map
      * @param {boolean} [options.hideMainHeaderAndFooter] - Whether to hide the main Cadenza header and footer
      * @param {boolean} [options.hideWorkbookToolBar] - Whether to hide the workbook toolbar
@@ -127,8 +136,9 @@ export class CadenzaClient {
      * @return {Promise<void>} A Promise for when the iframe is loaded
      * @throws For invalid arguments
      */
-    showMap(mapView: WorkbookViewSource, { disabledUiFeatures, geometry, hideMainHeaderAndFooter, hideWorkbookToolBar, highlightGlobalId, locationFinder, mapExtent, operationMode, useMapSrs, signal, }?: {
+    showMap(mapView: WorkbookViewSource, { disabledUiFeatures, expandNavigator, geometry, hideMainHeaderAndFooter, hideWorkbookToolBar, highlightGlobalId, locationFinder, mapExtent, operationMode, useMapSrs, signal, }?: {
         disabledUiFeatures?: UiFeature[] | undefined;
+        expandNavigator?: boolean | undefined;
         geometry?: Geometry | undefined;
         hideMainHeaderAndFooter?: boolean | undefined;
         hideWorkbookToolBar?: boolean | undefined;
@@ -139,6 +149,12 @@ export class CadenzaClient {
         useMapSrs?: boolean | undefined;
         signal?: AbortSignal | undefined;
     } | undefined): Promise<void>;
+    /**
+     * Expand/collapse the navigator tree.
+     *
+     * @param {boolean} expandNavigator - The expansion state of the navigator.
+     */
+    expandNavigator(expandNavigator: boolean): void;
     /**
      * Create a geometry.
      *
@@ -209,11 +225,13 @@ export class CadenzaClient {
      * * 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' (Excel)
      * * 'text/csv'
      * @param {object} options - Options
+     * @param {TablePart[]} [options.parts] - An optional array of table parts to export. If not specified, all parts are exported.
      * @param {AbortSignal} [options.signal] - A signal to abort the data fetching
      * @return {Promise<Response>} A Promise for the fetch response
      * @throws For invalid arguments
      */
-    fetchData(source: WorkbookViewSource, mediaType: MediaType, { signal }?: {
+    fetchData(source: WorkbookViewSource, mediaType: MediaType, { parts, signal }?: {
+        parts?: TablePart[] | undefined;
         signal?: AbortSignal | undefined;
     }): Promise<Response>;
     /**
@@ -229,10 +247,12 @@ export class CadenzaClient {
      * * 'text/csv'
      * @param {object} options - Options
      * @param {string} [options.fileName] - The file name to use; The file extension is appended by Cadenza.
+     * @param {TablePart[]} [options.parts] - An optional array of table parts to export. If not specified, all parts are exported.
      * @throws For invalid arguments
      */
-    downloadData(source: WorkbookViewSource, mediaType: MediaType, { fileName }: {
+    downloadData(source: WorkbookViewSource, mediaType: MediaType, { fileName, parts }: {
         fileName?: string | undefined;
+        parts?: TablePart[] | undefined;
     }): void;
     #private;
 }
@@ -260,6 +280,10 @@ export class CadenzaError extends Error {
     get type(): string;
     #private;
 }
+/**
+ * - A part of a table to export.
+ */
+export type TablePart = 'columns' | 'values' | 'totals';
 /**
  * - The ID of an embedding target
  */
@@ -352,6 +376,19 @@ export type OperationMode = 'normal' | 'simplified';
  * * 'workbook-view-management' - Add/Edit/Remove workbook views (Is included in 'workbook-design'.)
  */
 export type UiFeature = 'workbook-design' | 'workbook-view-management';
+/**
+ * - A well-known Cadenza page
+ */
+export type PageSource = {
+    /**
+     * - The name of the page
+     */
+    page: PageType;
+};
+/**
+ * - A Cadenza well-known page name
+ */
+export type PageType = 'welcome';
 /**
  * - A [GeoJSON](https://geojson.org/) geometry object
  */

package/cadenza.js

@@ -54,6 +54,12 @@ globalThis.cadenza = Object.assign((/** @type Parameters<cadenza> */ ...args) =>
  * * 'workbook-design' - The workbook designer
  * * 'workbook-view-management' - Add/Edit/Remove workbook views (Is included in 'workbook-design'.)
  * */
+/**
+ * @typedef PageSource - A well-known Cadenza page
+ * @property {PageType} page - The name of the page
+ *
+ * @typedef {'welcome'} PageType - A Cadenza well-known page name
+ */
 /**
  * @typedef Geometry - A [GeoJSON](https://geojson.org/) geometry object
  * @property {GeometryType} type - The type of the geometry
@@ -133,28 +139,30 @@ export class CadenzaClient {
         return /** @type {HTMLIFrameElement} */ (iframe);
     }
     /**
-     * Show a workbook, worksheet or workbook view in an iframe.
+     * Show a page, workbook, worksheet or workbook view in an iframe.
      *
-     * @param {WorkbookSource | WorksheetSource | WorkbookViewSource} source - The source to show
+     * @param {PageSource | WorkbookSource | WorksheetSource | WorkbookViewSource} source - The source to show
      * @param {object} [options]
      * @param {UiFeature[]} [options.disabledUiFeatures] - Cadenza UI features to disable
+     * @param {boolean} [options.expandNavigator] - Indicates if the navigator should be expanded.
      * @param {boolean} [options.hideMainHeaderAndFooter] - Whether to hide the main Cadenza header and footer
      * @param {boolean} [options.hideWorkbookToolBar] - Whether to hide the workbook toolbar
      * @param {GlobalId} [options.highlightGlobalId] - The ID of an item to highlight / expand in the navigator
-     * @param {string} [options.mediaType] - Set to 'application/pdf' for views of type "JasperReports report"
+     * @param {MediaType} [options.mediaType] - Set to 'application/pdf' for views of type "JasperReports report"
      *     to show the report PDF directly, without any Cadenza headers or footers.
      * @param {OperationMode} [options.operationMode] - The mode in which a workbook should be operated
      * @param {AbortSignal} [options.signal] - A signal to abort the iframe loading
      * @return {Promise<void>} A Promise for when the iframe is loaded
      * @throws For invalid arguments
      */
-    show(source, { disabledUiFeatures, hideMainHeaderAndFooter, hideWorkbookToolBar, highlightGlobalId, mediaType, operationMode, signal, } = {}) {
+    show(source, { disabledUiFeatures, expandNavigator, hideMainHeaderAndFooter, hideWorkbookToolBar, highlightGlobalId, mediaType, operationMode, signal, } = {}) {
         this.#log('CadenzaClient#show', source);
         if (mediaType) {
             assertSupportedMediaType(mediaType, [MediaType.PDF]);
         }
         const params = createParams({
             disabledUiFeatures,
+            expandNavigator,
             hideMainHeaderAndFooter,
             hideWorkbookToolBar,
             highlightGlobalId,
@@ -170,6 +178,7 @@ export class CadenzaClient {
      * @param {WorkbookViewSource} mapView - The workbook map view to show
      * @param {object} [options] - Options
      * @param {UiFeature[]} [options.disabledUiFeatures] - Cadenza UI features to disable
+     * @param {boolean} [options.expandNavigator] - Indicates if the navigator should be expanded.
      * @param {Geometry} [options.geometry] - A geometry to show on the map
      * @param {boolean} [options.hideMainHeaderAndFooter] - Whether to hide the main Cadenza header and footer
      * @param {boolean} [options.hideWorkbookToolBar] - Whether to hide the workbook toolbar
@@ -182,13 +191,14 @@ export class CadenzaClient {
      * @return {Promise<void>} A Promise for when the iframe is loaded
      * @throws For invalid arguments
      */
-    async showMap(mapView, { disabledUiFeatures, geometry, hideMainHeaderAndFooter, hideWorkbookToolBar, highlightGlobalId, locationFinder, mapExtent, operationMode, useMapSrs, signal, } = {}) {
+    async showMap(mapView, { disabledUiFeatures, expandNavigator, geometry, hideMainHeaderAndFooter, hideWorkbookToolBar, highlightGlobalId, locationFinder, mapExtent, operationMode, useMapSrs, signal, } = {}) {
         this.#log('CadenzaClient#showMap', mapView, geometry);
         if (geometry) {
             assertValidGeometryType(geometry.type);
         }
         const params = createParams({
             disabledUiFeatures,
+            expandNavigator,
             hideMainHeaderAndFooter,
             hideWorkbookToolBar,
             highlightGlobalId,
@@ -201,6 +211,15 @@ export class CadenzaClient {
         await this.#show(resolvePath(mapView), params, signal);
         this.#postEvent('setGeometry', { geometry });
     }
+    /**
+     * Expand/collapse the navigator tree.
+     *
+     * @param {boolean} expandNavigator - The expansion state of the navigator.
+     */
+    expandNavigator(expandNavigator) {
+        this.#log('CadenzaClient#expandNavigator', expandNavigator);
+        this.#postEvent('expandNavigator', { expandNavigator: !!expandNavigator });
+    }
     /**
      * Create a geometry.
      *
@@ -366,14 +385,16 @@ export class CadenzaClient {
      * * 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' (Excel)
      * * 'text/csv'
      * @param {object} options - Options
+     * @param {TablePart[]} [options.parts] - An optional array of table parts to export. If not specified, all parts are exported.
      * @param {AbortSignal} [options.signal] - A signal to abort the data fetching
      * @return {Promise<Response>} A Promise for the fetch response
      * @throws For invalid arguments
      */
-    fetchData(source, mediaType, { signal } = {}) {
+    fetchData(source, mediaType, { parts, signal } = {}) {
         this.#log('CadenzaClient#fetchData', source, mediaType);
         assertSupportedMediaType(mediaType);
-        const params = createParams({ mediaType });
+        assertValidTableParts(parts);
+        const params = createParams({ mediaType, parts });
         return this.#fetch(resolvePath(source), params, signal);
     }
     async #fetch(
@@ -406,12 +427,14 @@ export class CadenzaClient {
      * * 'text/csv'
      * @param {object} options - Options
      * @param {string} [options.fileName] - The file name to use; The file extension is appended by Cadenza.
+     * @param {TablePart[]} [options.parts] - An optional array of table parts to export. If not specified, all parts are exported.
      * @throws For invalid arguments
      */
-    downloadData(source, mediaType, { fileName }) {
+    downloadData(source, mediaType, { fileName, parts }) {
         this.#log('CadenzaClient#downloadData', source, mediaType);
         assertSupportedMediaType(mediaType);
-        const params = createParams({ fileName, mediaType });
+        assertValidTableParts(parts);
+        const params = createParams({ fileName, mediaType, parts });
         this.#download(resolvePath(source), params);
     }
     #download(/** @type string */ path, /** @type URLSearchParams */ params) {
@@ -441,11 +464,16 @@ export class CadenzaClient {
     }
 }
 function resolvePath(
-/** @type WorkbookSource | WorksheetSource | WorkbookViewSource */ source) {
+/** @type PageSource | WorkbookSource | WorksheetSource | WorkbookViewSource */ source) {
     if (typeof source === 'string') {
         assert(validEmbeddingTargetId(source), `Invalid embedding target ID: ${source}`);
         return `/w/${source}`;
     }
+    else if ('page' in source) {
+        const page = source.page;
+        assert(validPageName(page), `Invalid page name: ${page}`);
+        return `/public/pages/${page}`;
+    }
     else {
         const { repositoryName, workbookId } = source;
         assert(validRepositoryName(repositoryName), `Invalid repository name: ${repositoryName}`);
@@ -478,6 +506,9 @@ function validUrl(/** @type string */ value) {
         return false;
     }
 }
+function validPageName(/** @type string */ value) {
+    return ['welcome'].includes(value);
+}
 function validEmbeddingTargetId(/** @type string */ value) {
     return /^[a-z0-9]+(?:-[a-z0-9]+)*$/.test(value);
 }
@@ -512,6 +543,19 @@ function validGeometryType(/** @type string */ value) {
         'MultiPolygon',
     ].includes(value);
 }
+/** @typedef {'columns' | 'values' | 'totals'} TablePart - A part of a table to export. */
+function validTablePart(/** @type TablePart */ value) {
+    return ['columns', 'values', 'totals'].includes(value);
+}
+function assertValidTablePart(/** @type TablePart */ value) {
+    assert(validTablePart(value));
+}
+function assertValidTableParts(/** @type TablePart[] | undefined */ parts) {
+    if (parts) {
+        assert(Array.isArray(parts), `'parts' argument must be an array`);
+        parts.forEach(assertValidTablePart);
+    }
+}
 function validOperationMode(/** @type string */ value) {
     return ['normal', 'simplified'].includes(value);
 }
@@ -532,12 +576,13 @@ const MediaType = /** @type {Record<string, MediaType>} */ {
 function assertSupportedMediaType(
 /** @type MediaType */ type, 
 /** @type MediaType[] */ supportedTypes = Object.values(MediaType)) {
-    return assert(supportedTypes.includes(type), `Invalid media type: ${type}`);
+    assert(supportedTypes.includes(type), `Invalid media type: ${type}`);
 }
 /**
  * @param {object} params - Options
  * @param {string} [params.action]
  * @param {UiFeature[]} [params.disabledUiFeatures]
+ * @param {boolean} [params.expandNavigator]
  * @param {string} [params.fileName]
  * @param {GeometryType} [params.geometryType]
  * @param {boolean} [params.hideMainHeaderAndFooter]
@@ -545,14 +590,15 @@ function assertSupportedMediaType(
  * @param {GlobalId} [params.highlightGlobalId]
  * @param {string} [params.locationFinder]
  * @param {Extent} [params.mapExtent]
- * @param {string} [params.mediaType]
+ * @param {MediaType} [params.mediaType]
  * @param {number} [params.minScale]
  * @param {OperationMode} [params.operationMode]
+ * @param {TablePart[]} [params.parts]
  * @param {boolean} [params.useMapSrs]
  * @param {ExternalLinkKey} [params.webApplication]
  * @return {URLSearchParams}
  */
-function createParams({ action, fileName, geometryType, hideMainHeaderAndFooter, hideWorkbookToolBar, highlightGlobalId, locationFinder, mapExtent, mediaType, minScale, useMapSrs, webApplication, operationMode, disabledUiFeatures, }) {
+function createParams({ action, expandNavigator, fileName, geometryType, hideMainHeaderAndFooter, hideWorkbookToolBar, highlightGlobalId, locationFinder, mapExtent, mediaType, minScale, parts, useMapSrs, webApplication, operationMode, disabledUiFeatures, }) {
     if (disabledUiFeatures) {
         disabledUiFeatures.forEach((feature) => assert(validUiFeature(feature), `Invalid UI feature: ${feature}`));
     }
@@ -567,6 +613,7 @@ function createParams({ action, fileName, geometryType, hideMainHeaderAndFooter,
         ...(disabledUiFeatures && {
             disabledUiFeatures: disabledUiFeatures.join(),
         }),
+        ...(expandNavigator && { expandNavigator: 'true' }),
         ...(fileName && { fileName }),
         ...(geometryType && { geometryType }),
         ...(hideMainHeaderAndFooter && { hideMainHeaderAndFooter: 'true' }),
@@ -577,6 +624,7 @@ function createParams({ action, fileName, geometryType, hideMainHeaderAndFooter,
         ...(mediaType && { mediaType }),
         ...(minScale && { minScale: String(minScale) }),
         ...(operationMode && { operationMode }),
+        ...(parts && { parts: parts.join() }),
         ...(useMapSrs && { useMapSrs: 'true' }),
         ...(webApplication && {
             webApplicationLink: webApplication.externalLinkId,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@disy/cadenza.js",
-  "version": "1.1.0",
+  "version": "1.3.0",
   "license": "Apache-2.0",
   "repository": "github:DisyInformationssysteme/cadenza.js",
   "type": "module",
@@ -11,6 +11,7 @@
     "cadenza.js",
     "cadenza.d.ts",
     "CHANGELOG.md",
+    "sandbox.cjs",
     "sandbox.html"
   ],
   "scripts": {

package/sandbox.cjs

@@ -0,0 +1,7 @@
+const { execSync } = require('child_process');
+const { URL } = require('url');
+
+const DEFAULT_CADENZA_URL = 'http://localhost:8080/cadenza';
+const cadenzaUrl = new URL((process.argv[2] === '--cadenza-url' && process.argv[3]) || process.env.CADENZA_URL || DEFAULT_CADENZA_URL);
+
+execSync(`npx http-server -a localhost -c-1 -d false --proxy ${cadenzaUrl.origin} --proxy-options.headers.Origin ${cadenzaUrl.origin} -o /sandbox.html${cadenzaUrl.pathname !== '/' ? `?contextPath=${cadenzaUrl.pathname}` : ''}`, { stdio: 'inherit' });

package/sandbox.html

@@ -41,7 +41,7 @@
     label {
       font-weight: 600;
     }
-    select, input:is(:not([type], [type=text])), textarea {
+    select, input:is(:not([type]), [type=text], [type=number]), textarea {
       display: block;
       width: 100%
     }
@@ -71,8 +71,9 @@
     const contextPath = new URLSearchParams(location.search).get('contextPath') ?? '';
     const cadenzaClient = cadenza(location.origin + contextPath, { iframe: 'iframe', debug: true });
     const actionHandlers = {
-      show ({ embeddingTargetId, hideMainHeaderAndFooter, hideWorkbookToolBar, jasperReportAsPdf, highlightGlobalId, operationMode, disabledUiFeatures }) {
+      show ({ embeddingTargetId, expandNavigator, hideMainHeaderAndFooter, hideWorkbookToolBar, jasperReportAsPdf, highlightGlobalId, operationMode, disabledUiFeatures }) {
         cadenzaClient.show(embeddingTargetId, {
+          expandNavigator: (expandNavigator === 'on'),
           hideMainHeaderAndFooter: (hideMainHeaderAndFooter === 'on'),
           hideWorkbookToolBar: (hideWorkbookToolBar === 'on'),
           highlightGlobalId,
@@ -81,6 +82,15 @@
           disabledUiFeatures: disabledUiFeatures && disabledUiFeatures.split(',')
         });
       },
+      showPage ({ page, expandNavigator, highlightGlobalId }) {
+        cadenzaClient.show({ page: page }, {
+          expandNavigator: (expandNavigator === 'on'),
+          highlightGlobalId
+        });
+      },
+      expandNavigator ({ expandNavigator }) {
+        cadenzaClient.expandNavigator(expandNavigator === 'on');
+      },
       showMap ({ embeddingTargetId, useMapSrs, geometry, mapExtent, locationFinder, highlightGlobalId }) {
         cadenzaClient.showMap(embeddingTargetId, {
           useMapSrs: useMapSrs === 'on',
@@ -106,13 +116,16 @@
           locationFinder
         });
       },
-      fetchData ({ embeddingTargetId, mediaType }) {
+      fetchData ({ embeddingTargetId, mediaType, parts }) {
         console.log('Inspect the fetchData() request in the devtools.');
-        cadenzaClient.fetchData(embeddingTargetId, mediaType);
+        cadenzaClient.fetchData(embeddingTargetId, mediaType, {
+          parts: parts && parts.split(',')
+        });
       },
-      downloadData ({ embeddingTargetId, mediaType, fileName }) {
+      downloadData ({ embeddingTargetId, mediaType, fileName, parts }) {
         cadenzaClient.downloadData(embeddingTargetId, mediaType, {
-          fileName
+          fileName,
+          parts: parts && parts.split(',')
         });
       }
     };
@@ -150,6 +163,8 @@
       <label for="action">Action</label>
       <select name="action" id="action">
         <option value="show">Show</option>
+        <option value="showPage">Show Page</option>
+        <option value="expandNavigator">Expand Navigator</option>
         <option value="showMap">Show Map</option>
         <option value="createGeometry">Create Geometry</option>
         <option value="editGeometry">Edit Geometry</option>
@@ -180,6 +195,12 @@
       Show Jasper Report as PDF
     </label>
   </div>
+  <div>
+    <label>
+      <input type="checkbox" name="expandNavigator">
+      Expand navigator tree
+    </label>
+  </div>
   <div>
     <label>
       <input type="checkbox" name="hideMainHeaderAndFooter">
@@ -208,6 +229,35 @@
   </div>
 </template>
 
+<template data-action="showPage">
+  <div>
+    <label for="page">Page *</label>
+    <select name="page" id="page" required>
+      <option>welcome</option>
+      <option>an-invalid-page-name</option>
+    </select>
+  </div>
+  <div>
+    <label>
+      <input type="checkbox" name="expandNavigator">
+      Expand navigator tree
+    </label>
+  </div>
+  <div>
+    <label for="highlightGlobalId">Highlighted Global ID</label>
+    <input name="highlightGlobalId" id="highlightGlobalId">
+  </div>
+</template>
+
+<template data-action="expandNavigator">
+  <div>
+    <label>
+      <input type="checkbox" name="expandNavigator">
+      Expand navigator tree
+    </label>
+  </div>
+</template>
+
 <template data-action="showMap">
   <div>
     <label for="embeddingTargetId">Embedding target ID of the map view *</label>
@@ -223,10 +273,6 @@
     <label for="geometry">Geometry (GeoJSON)</label>
     <textarea name="geometry" id="geometry" rows="5"></textarea>
   </div>
-  <div>
-    <label for="useMapSrs">Use map SRS</label>
-    <input type="checkbox" name="useMapSrs" id="useMapSrs" />
-  </div>
   <div>
     <label for="mapExtent">Map extent coordinates</label>
     <input name="mapExtent" id="mapExtent" placeholder="minX,minY,maxX,maxY">
@@ -246,6 +292,12 @@
     <label for="embeddingTargetId">Embedding target ID of the map view *</label>
     <input name="embeddingTargetId" id="embeddingTargetId" required>
   </div>
+  <div>
+    <label>
+      <input type="checkbox" name="useMapSrs">
+      Use map SRS
+    </label>
+  </div>
   <div>
     <label for="geometryType">Geometry type</label>
     <select name="geometryType" id="geometryType">
@@ -261,10 +313,6 @@
     <label for="minScale">Minimum Scale</label>
     <input type="number" name="minScale" id="minScale">
   </div>
-  <div>
-    <label for="useMapSrs">Use map SRS</label>
-    <input type="checkbox" name="useMapSrs" id="useMapSrs" />
-  </div>
   <div>
     <label for="mapExtent">Map extent coordinates</label>
     <input name="mapExtent" id="mapExtent" placeholder="minX,minY,maxX,maxY">
@@ -280,6 +328,12 @@
     <label for="embeddingTargetId">Embedding target ID of the map view *</label>
     <input name="embeddingTargetId" id="embeddingTargetId" required>
   </div>
+  <div>
+    <label>
+      <input type="checkbox" name="useMapSrs">
+      Use map SRS
+    </label>
+  </div>
   <div>
     <label for="geometry">Geometry (GeoJSON) *</label>
     <textarea name="geometry" id="geometry" rows="5" required></textarea>
@@ -288,10 +342,6 @@
     <label for="minScale">Minimum Scale</label>
     <input type="number" name="minScale" id="minScale">
   </div>
-  <div>
-    <label for="useMapSrs">Use map SRS</label>
-    <input type="checkbox" name="useMapSrs" id="useMapSrs" />
-  </div>
   <div>
     <label for="mapExtent">Map extent coordinates</label>
     <input name="mapExtent" id="mapExtent" placeholder="minX,minY,maxX,maxY">
@@ -307,6 +357,10 @@
     <label for="embeddingTargetId">Embedding target ID *</label>
     <input name="embeddingTargetId" id="embeddingTargetId" required>
   </div>
+  <div>
+    <label for="parts">Parts</label>
+    <input name="parts" id="parts" placeholder="columns,values,totals">
+  </div>
   <div>
     <label for="mediaType">Media type *</label>
     <select name="mediaType" id="mediaType" required>
@@ -327,6 +381,10 @@
     <label for="embeddingTargetId">Embedding target ID *</label>
     <input name="embeddingTargetId" id="embeddingTargetId" required>
   </div>
+  <div>
+    <label for="parts">Parts</label>
+    <input name="parts" id="parts" placeholder="columns,values,totals">
+  </div>
   <div>
     <label for="mediaType">Media type *</label>
     <select name="mediaType" id="mediaType" required>