@pitcher/js-api 1.24.0-beta.3 → 1.25.0-beta.0

package/lib/apps/browser/stores/api.d.ts

@@ -14,6 +14,7 @@ type FolderUpdater = (payload: FolderUpdateRequest & {
     id: Folder['id'];
 }) => Promise<FolderRetrieve>;
 type FolderDeleter = (payload: Folder['id']) => Promise<void>;
+type FolderFetcher = (payload: Folder['id']) => Promise<FolderRetrieve>;
 type FoldersDeleter = (payload: BulkDeleteRequest) => Promise<BulkDeleteResponse>;
 type FileCreator = (payload: Omit<AllFileCreateRequest, 'instance_id'>) => Promise<FileRetrieve>;
 type FileUpdater = (payload: FileUpdateRequest & {
@@ -37,7 +38,7 @@ type FavoritesFetcher = (payload?: GetFavoritesParams) => Promise<PaginatedData<
 type FavoritesSetter = (favorites: Favorite[]) => void;
 type RecentFilesFetcher = () => Promise<RecentFile[]>;
 type SelectDeviceFile = () => Promise<DeviceFile>;
-type CompactFile = Pick<File, 'id' | 'name' | 'thumbnail_url' | 'tags' | 'created_by' | 'modified_at' | 'status' | 'content_type'>;
+type CompactFile = Pick<File, 'id' | 'name' | 'thumbnail_url' | 'tags' | 'created_by' | 'modified_at' | 'status' | 'content_type' | 'permissions'>;
 type ItemsMoverItem = {
     id: File['id'] | Folder['id'];
     type: 'file' | 'folder';
@@ -49,6 +50,7 @@ declare function setCurrentFolder(folderId?: FolderRetrieve['id'], folderName?:
 declare function setSearchQuery(searchQuery: string): void;
 declare function setIsFetchingListFiles(value: boolean): void;
 declare function setSearchMetadataFilters(filters: Record<string, any>): void;
+declare function onUpsertFolder(name: string, initialName?: string): Promise<void>;
 declare function clearTimeouts(): void;
 declare function init({ onFolderFetch, onFolderCreate, onFolderUpdate, onFolderDelete, onFoldersDelete, onFileCreate, onFileUpdate, onFileOpen, onFileDelete, onFilesDelete, onFileFetch, onFilesList, onItemsMove, onFavoriteCreate, onFavoriteDelete, onFavoritesDelete, onFavoritesFetch, onRecentFilesFetch, onSelectDeviceFile, onMetadataTemplateFetch, }: {
     onFolderFetch: FolderItemsFetcher;
@@ -82,6 +84,7 @@ declare const _default: () => {
         readonly folderCreator: FolderCreator | null;
         readonly folderUpdater: FolderUpdater | null;
         readonly folderDeleter: FolderDeleter | null;
+        readonly folderFetcher: FolderFetcher | null;
         readonly foldersDeleter: FoldersDeleter | null;
         readonly fileCreator: FileCreator | null;
         readonly fileUpdater: FileUpdater | null;
@@ -129,9 +132,13 @@ declare const _default: () => {
         readonly files: readonly {
             readonly id: string;
             readonly name?: string | undefined;
+            readonly tags?: readonly string[] | undefined;
             readonly thumbnail_url: string | null;
+            readonly permissions?: {
+                readonly can_download?: boolean | undefined;
+                readonly can_share?: boolean | undefined;
+            } | undefined;
             readonly content_type: import('../../../../types/openapi').FileContentTypeEnum;
-            readonly tags?: readonly string[] | undefined;
             readonly status: FileStatusEnum;
             readonly created_by: {
                 readonly id: number;
@@ -145,9 +152,10 @@ declare const _default: () => {
             readonly name?: string | undefined;
             readonly content_type: import('../../../../types/openapi').FileContentTypeEnum;
             readonly instance_id: string;
-            readonly tags?: Readonly<File["tags"]>;
-            readonly thumbnail_url?: (string | null) | undefined;
+            readonly tags?: Readonly<string[] | undefined>;
+            readonly thumbnail_url?: string | null | undefined;
             readonly page_index?: number | undefined;
+            readonly status?: FileStatusEnum | undefined;
         }[];
         readonly selectedFile: {
             readonly id: string;
@@ -167,6 +175,7 @@ declare const _default: () => {
             readonly content_url: string | null;
             readonly content_thumbnails: readonly string[];
             readonly original_extension: string | null;
+            readonly original_url: string | null;
             readonly thumbnail_url: string | null;
             readonly download_type?: import('../../../../types/openapi').DownloadTypeEnum | undefined;
             readonly zip_size: number | null;
@@ -190,7 +199,7 @@ declare const _default: () => {
             } | undefined;
             readonly tags?: readonly string[] | undefined;
             readonly published_at: string | null;
-            readonly expires_at?: (string | null) | undefined;
+            readonly expires_at?: string | null | undefined;
             readonly instance_id: string;
             readonly folder_id?: string | undefined;
             readonly folder: {
@@ -199,10 +208,8 @@ declare const _default: () => {
             };
             readonly shared_link: {
                 readonly url: string;
-                readonly short_url?: (string | null) | undefined;
+                readonly short_url?: string | null | undefined;
             };
-            readonly search_rank: string;
-            readonly search_headline: string;
             readonly owned_by: {
                 readonly id: number;
                 readonly name: string;
@@ -263,6 +270,8 @@ declare const _default: () => {
                 readonly status: FileStatusEnum;
                 readonly content_type: import('../../../../types/openapi').FileContentTypeEnum;
                 readonly thumbnail_url: string;
+                readonly original_url: string | null;
+                readonly original_extension: string | null;
                 readonly tags: readonly string[];
                 readonly permissions?: {
                     readonly can_download?: boolean | undefined;
@@ -282,11 +291,12 @@ declare const _default: () => {
                     readonly email?: string | undefined;
                 };
                 readonly modified_at: string;
+                readonly expires_at: string | null;
             }[];
             readonly canvases: readonly {
                 readonly id: string;
                 readonly name: string;
-                readonly thumbnail_url?: (string | null) | undefined;
+                readonly thumbnail_url?: string | null | undefined;
                 readonly tags: readonly string[];
                 readonly created_by: {
                     readonly id: number;
@@ -323,6 +333,7 @@ declare const _default: () => {
                     readonly name: string;
                     readonly content_type: string | null;
                     readonly tags: readonly string[];
+                    readonly expires_at?: string | null | undefined;
                 } | null;
                 readonly page: {
                     readonly id: string;
@@ -378,6 +389,8 @@ declare const _default: () => {
             readonly status: FileStatusEnum;
             readonly content_type: import('../../../../types/openapi').FileContentTypeEnum;
             readonly thumbnail_url: string;
+            readonly original_url: string | null;
+            readonly original_extension: string | null;
             readonly tags: readonly string[];
             readonly permissions?: {
                 readonly can_download?: boolean | undefined;
@@ -397,6 +410,7 @@ declare const _default: () => {
                 readonly email?: string | undefined;
             };
             readonly modified_at: string;
+            readonly expires_at: string | null;
             readonly folder_id?: string | undefined;
             readonly folder: {
                 readonly id: string;
@@ -408,9 +422,13 @@ declare const _default: () => {
         readonly sortedFiles: readonly {
             readonly id: string;
             readonly name?: string | undefined;
+            readonly tags?: readonly string[] | undefined;
             readonly thumbnail_url: string | null;
+            readonly permissions?: {
+                readonly can_download?: boolean | undefined;
+                readonly can_share?: boolean | undefined;
+            } | undefined;
             readonly content_type: import('../../../../types/openapi').FileContentTypeEnum;
-            readonly tags?: readonly string[] | undefined;
             readonly status: FileStatusEnum;
             readonly created_by: {
                 readonly id: number;
@@ -430,6 +448,7 @@ declare const _default: () => {
             folderCreator: null;
             folderUpdater: null;
             folderDeleter: null;
+            folderFetcher: null;
             foldersDeleter: null;
             fileCreator: null;
             fileUpdater: null;
@@ -475,6 +494,7 @@ declare const _default: () => {
         setSearchQuery: typeof setSearchQuery;
         setIsFetchingListFiles: typeof setIsFetchingListFiles;
         setSearchMetadataFilters: typeof setSearchMetadataFilters;
+        onUpsertFolder: typeof onUpsertFolder;
         onUploadFilesRefetchFolder: import('lodash').DebouncedFunc<() => Promise<void>>;
         clearTimeouts: typeof clearTimeouts;
         reset: () => {
@@ -485,6 +505,7 @@ declare const _default: () => {
             folderCreator: FolderCreator | null;
             folderUpdater: FolderUpdater | null;
             folderDeleter: FolderDeleter | null;
+            folderFetcher: FolderFetcher | null;
             foldersDeleter: FoldersDeleter | null;
             fileCreator: FileCreator | null;
             fileUpdater: FileUpdater | null;
@@ -532,9 +553,13 @@ declare const _default: () => {
             files: {
                 readonly id: string;
                 name?: string | undefined;
+                tags?: Array<string> | undefined;
                 readonly thumbnail_url: string | null;
+                permissions?: {
+                    can_download?: boolean | undefined;
+                    can_share?: boolean | undefined;
+                } | undefined;
                 readonly content_type: import('../../../../types/openapi').FileContentTypeEnum;
-                tags?: Array<string> | undefined;
                 readonly status: FileStatusEnum;
                 readonly created_by: {
                     readonly id: number;
@@ -548,9 +573,10 @@ declare const _default: () => {
                 name?: string | undefined;
                 readonly content_type: import('../../../../types/openapi').FileContentTypeEnum;
                 readonly instance_id: string;
-                tags?: Readonly<File["tags"]>;
-                thumbnail_url?: (string | null) | undefined;
+                tags?: Readonly<string[] | undefined>;
+                thumbnail_url?: string | null | undefined;
                 page_index?: number | undefined;
+                status?: FileStatusEnum | undefined;
             }[];
             selectedFile: {
                 readonly id: string;
@@ -570,6 +596,7 @@ declare const _default: () => {
                 readonly content_url: string | null;
                 readonly content_thumbnails: Array<string>;
                 readonly original_extension: string | null;
+                readonly original_url: string | null;
                 readonly thumbnail_url: string | null;
                 download_type?: import('../../../../types/openapi').DownloadTypeEnum | undefined;
                 readonly zip_size: number | null;
@@ -587,7 +614,7 @@ declare const _default: () => {
                 app_metadata?: Record<string, any> | undefined;
                 tags?: Array<string> | undefined;
                 readonly published_at: string | null;
-                expires_at?: (string | null) | undefined;
+                expires_at?: string | null | undefined;
                 readonly instance_id: string;
                 folder_id?: string | undefined;
                 readonly folder: {
@@ -596,10 +623,8 @@ declare const _default: () => {
                 };
                 readonly shared_link: {
                     readonly url: string;
-                    short_url?: (string | null) | undefined;
+                    short_url?: string | null | undefined;
                 };
-                readonly search_rank: string;
-                readonly search_headline: string;
                 readonly owned_by: {
                     readonly id: number;
                     readonly name: string;
@@ -660,6 +685,8 @@ declare const _default: () => {
                     readonly status: FileStatusEnum;
                     readonly content_type: import('../../../../types/openapi').FileContentTypeEnum;
                     readonly thumbnail_url: string;
+                    readonly original_url: string | null;
+                    readonly original_extension: string | null;
                     readonly tags: Array<string>;
                     permissions?: {
                         can_download?: boolean | undefined;
@@ -677,11 +704,12 @@ declare const _default: () => {
                         email?: string | undefined;
                     };
                     readonly modified_at: string;
+                    readonly expires_at: string | null;
                 }[];
                 readonly canvases: {
                     readonly id: string;
                     name: string;
-                    thumbnail_url?: (string | null) | undefined;
+                    thumbnail_url?: string | null | undefined;
                     readonly tags: Array<string>;
                     readonly created_by: {
                         readonly id: number;
@@ -730,6 +758,8 @@ declare const _default: () => {
                 readonly status: FileStatusEnum;
                 readonly content_type: import('../../../../types/openapi').FileContentTypeEnum;
                 readonly thumbnail_url: string;
+                readonly original_url: string | null;
+                readonly original_extension: string | null;
                 readonly tags: Array<string>;
                 permissions?: {
                     can_download?: boolean | undefined;
@@ -747,6 +777,7 @@ declare const _default: () => {
                     email?: string | undefined;
                 };
                 readonly modified_at: string;
+                readonly expires_at: string | null;
                 folder_id?: string | undefined;
                 folder: {
                     id: string;
@@ -761,6 +792,7 @@ declare const _default: () => {
             folderCreator: null;
             folderUpdater: null;
             folderDeleter: null;
+            folderFetcher: null;
             foldersDeleter: null;
             fileCreator: null;
             fileUpdater: null;

package/lib/apps/browser/stores/app.d.ts

@@ -17,6 +17,12 @@ type View = 'grid' | 'table';
 type RecentFileWithFavoriteId = RecentFile & {
     favoriteId: string;
 };
+type FavoriteExtended = Favorite & {
+    favoriteId: string;
+    tags?: string[];
+    content_type?: string | null | undefined;
+    type?: 'file' | 'folder';
+};
 export default function (): {
     setAppName(appName: AppName): void;
     resetSelectedItems(): void;
@@ -49,9 +55,8 @@ export default function (): {
     displayedFolders: ComputedRef<ViewCompactFolder[]>;
     displayedFilesFolders: ComputedRef<ViewCompactFileFolder[]>;
     sortedFavorites: ComputedRef<Favorite[]>;
-    displayedFavorites: ComputedRef<(Favorite & {
-        favoriteId: string;
-    })[]>;
+    displayedFavorites: ComputedRef<FavoriteExtended[]>;
+    filteredRecentFiles: ComputedRef<RecentFileWithFavoriteId[]>;
     displayedRecentFiles: ComputedRef<RecentFileWithFavoriteId[]>;
     isSidebarOpen: Ref<boolean>;
     isContentPanelOpen: Ref<boolean>;
@@ -64,5 +69,8 @@ export default function (): {
         prop: "name" | "tags";
     } | null>;
     showFilteredResults: ComputedRef<boolean>;
+    isAdmin: ComputedRef<boolean>;
+    enabledFavorites: Ref<boolean>;
+    enabledRecents: Ref<boolean>;
 };
 export {};

package/lib/apps/browser/stores/fileSmartFolderStore.d.ts

@@ -0,0 +1,95 @@
+import { ComputedRef } from 'vue';
+export interface SmartFolderProperty {
+    name: string;
+    display_name?: string;
+    accessor: string;
+    type: string;
+    description?: string;
+    display_names_by_value?: Record<string, string>;
+}
+export interface FileById {
+    id: string;
+    name: string;
+    created_at: string;
+    modified_at: string;
+    thumbnail_url: string;
+    favorite_id?: string;
+    metadata?: Record<string, any>;
+}
+interface PathSegment {
+    value: string;
+    property: SmartFolderProperty;
+}
+interface SmartFolderConfig {
+    enabledProperties: SmartFolderProperty[];
+}
+export default function useFileSmartFolderStore(): {
+    state: {
+        readonly hierarchyLevels: readonly {
+            readonly name: string;
+            readonly display_name?: string | undefined;
+            readonly accessor: string;
+            readonly type: string;
+            readonly description?: string | undefined;
+            readonly display_names_by_value?: {
+                readonly [x: string]: string;
+            } | undefined;
+        }[];
+        readonly currentPath: readonly {
+            readonly value: string;
+            readonly property: {
+                readonly name: string;
+                readonly display_name?: string | undefined;
+                readonly accessor: string;
+                readonly type: string;
+                readonly description?: string | undefined;
+                readonly display_names_by_value?: {
+                    readonly [x: string]: string;
+                } | undefined;
+            };
+        }[];
+        readonly availableValues: readonly {
+            readonly value: string;
+            readonly count: number;
+        }[];
+        readonly matchingFiles: readonly {
+            readonly id: string;
+            readonly name: string;
+            readonly created_at: string;
+            readonly modified_at: string;
+            readonly thumbnail_url: string;
+            readonly favorite_id?: string | undefined;
+            readonly metadata?: {
+                readonly [x: string]: any;
+            } | undefined;
+        }[];
+        readonly isLoading: boolean;
+        readonly isSavingConfig: boolean;
+        readonly viewMode: "folders" | "files";
+        readonly totalCount: number;
+        readonly page: number;
+        readonly pageSize: number;
+    };
+    isSmartFoldersView: import('@vueuse/shared').RemovableRef<boolean>;
+    defaultProperties: SmartFolderProperty[];
+    allSmartFolderProperties: ComputedRef<({
+        name: string;
+        type: "string" | "boolean" | "number" | "date" | "array";
+        accessor: string;
+        display_name: string;
+    } | SmartFolderProperty)[]>;
+    actions: {
+        fetchData: () => Promise<void>;
+        loadConfiguration: () => Promise<void>;
+        saveConfiguration: (config: SmartFolderConfig) => Promise<void>;
+        navigateToLevel: (index: number) => void;
+        setCurrentPath: (value: PathSegment[]) => void;
+        selectValue: (value: string, { skipFetchData }?: {
+            skipFetchData?: boolean;
+        }) => void;
+        toggleViewMode: () => void;
+        reset: () => void;
+        setMatchingFiles: (files: FileById[]) => void;
+    };
+};
+export {};

package/lib/apps/browser/stores/upload.d.ts

@@ -21,23 +21,25 @@ export default function (): {
             metadata?: Record<string, any> | undefined;
             name?: string | undefined;
             type?: import('../../../../types/openapi').FileTypeEnum | undefined;
+            tags?: Array<string> | undefined;
             permissions?: {
                 can_download?: boolean | undefined;
                 can_share?: boolean | undefined;
             } | undefined;
-            tags?: Array<string> | undefined;
             download_type?: import('../../../../types/openapi').DownloadTypeEnum | undefined;
             access_type?: AccessTypeEnum | undefined;
             app_metadata?: Record<string, any> | undefined;
-            expires_at?: (string | null) | undefined;
+            expires_at?: string | null | undefined;
             folder_id?: string | undefined;
-            owned_by_id?: (number | null) | undefined;
+            url?: string | undefined;
+            owned_by_id?: number | null | undefined;
             is_asset?: boolean | undefined;
             content_upload_id?: string | undefined;
             thumbnail?: {
                 readonly size: number;
                 readonly type: string;
                 arrayBuffer: () => Promise<ArrayBuffer>;
+                bytes: () => Promise<Uint8Array>;
                 slice: (start?: number, end?: number, contentType?: string) => Blob;
                 stream: () => ReadableStream<Uint8Array>;
                 text: () => Promise<string>;
@@ -55,6 +57,7 @@ export default function (): {
                 readonly size: number;
                 readonly type: string;
                 arrayBuffer: () => Promise<ArrayBuffer>;
+                bytes: () => Promise<Uint8Array>;
                 slice: (start?: number, end?: number, contentType?: string) => Blob;
                 stream: () => ReadableStream<Uint8Array>;
                 text: () => Promise<string>;
@@ -62,23 +65,25 @@ export default function (): {
             metadata?: Record<string, any> | undefined;
             name?: string | undefined;
             type?: import('../../../../types/openapi').FileTypeEnum | undefined;
+            tags?: Array<string> | undefined;
             permissions?: {
                 can_download?: boolean | undefined;
                 can_share?: boolean | undefined;
             } | undefined;
-            tags?: Array<string> | undefined;
             download_type?: import('../../../../types/openapi').DownloadTypeEnum | undefined;
             access_type?: AccessTypeEnum | undefined;
             app_metadata?: Record<string, any> | undefined;
-            expires_at?: (string | null) | undefined;
+            expires_at?: string | null | undefined;
             folder_id?: string | undefined;
-            owned_by_id?: (number | null) | undefined;
+            url?: string | undefined;
+            owned_by_id?: number | null | undefined;
             is_asset?: boolean | undefined;
             content_upload_id?: string | undefined;
             thumbnail?: {
                 readonly size: number;
                 readonly type: string;
                 arrayBuffer: () => Promise<ArrayBuffer>;
+                bytes: () => Promise<Uint8Array>;
                 slice: (start?: number, end?: number, contentType?: string) => Blob;
                 stream: () => ReadableStream<Uint8Array>;
                 text: () => Promise<string>;
@@ -102,23 +107,25 @@ export default function (): {
             metadata?: Record<string, any> | undefined;
             name?: string | undefined;
             type?: import('../../../../types/openapi').FileTypeEnum | undefined;
+            tags?: Array<string> | undefined;
             permissions?: {
                 can_download?: boolean | undefined;
                 can_share?: boolean | undefined;
             } | undefined;
-            tags?: Array<string> | undefined;
             download_type?: import('../../../../types/openapi').DownloadTypeEnum | undefined;
             access_type?: AccessTypeEnum | undefined;
             app_metadata?: Record<string, any> | undefined;
-            expires_at?: (string | null) | undefined;
+            expires_at?: string | null | undefined;
             folder_id?: string | undefined;
-            owned_by_id?: (number | null) | undefined;
+            url?: string | undefined;
+            owned_by_id?: number | null | undefined;
             is_asset?: boolean | undefined;
             content_upload_id?: string | undefined;
             thumbnail?: {
                 readonly size: number;
                 readonly type: string;
                 arrayBuffer: () => Promise<ArrayBuffer>;
+                bytes: () => Promise<Uint8Array>;
                 slice: (start?: number, end?: number, contentType?: string) => Blob;
                 stream: () => ReadableStream<Uint8Array>;
                 text: () => Promise<string>;
@@ -136,6 +143,7 @@ export default function (): {
                 readonly size: number;
                 readonly type: string;
                 arrayBuffer: () => Promise<ArrayBuffer>;
+                bytes: () => Promise<Uint8Array>;
                 slice: (start?: number, end?: number, contentType?: string) => Blob;
                 stream: () => ReadableStream<Uint8Array>;
                 text: () => Promise<string>;
@@ -143,23 +151,25 @@ export default function (): {
             metadata?: Record<string, any> | undefined;
             name?: string | undefined;
             type?: import('../../../../types/openapi').FileTypeEnum | undefined;
+            tags?: Array<string> | undefined;
             permissions?: {
                 can_download?: boolean | undefined;
                 can_share?: boolean | undefined;
             } | undefined;
-            tags?: Array<string> | undefined;
             download_type?: import('../../../../types/openapi').DownloadTypeEnum | undefined;
             access_type?: AccessTypeEnum | undefined;
             app_metadata?: Record<string, any> | undefined;
-            expires_at?: (string | null) | undefined;
+            expires_at?: string | null | undefined;
             folder_id?: string | undefined;
-            owned_by_id?: (number | null) | undefined;
+            url?: string | undefined;
+            owned_by_id?: number | null | undefined;
             is_asset?: boolean | undefined;
             content_upload_id?: string | undefined;
             thumbnail?: {
                 readonly size: number;
                 readonly type: string;
                 arrayBuffer: () => Promise<ArrayBuffer>;
+                bytes: () => Promise<Uint8Array>;
                 slice: (start?: number, end?: number, contentType?: string) => Blob;
                 stream: () => ReadableStream<Uint8Array>;
                 text: () => Promise<string>;
@@ -174,6 +184,7 @@ export default function (): {
             readonly size: number;
             readonly type: string;
             arrayBuffer: () => Promise<ArrayBuffer>;
+            bytes: () => Promise<Uint8Array>;
             slice: (start?: number, end?: number, contentType?: string) => Blob;
             stream: () => ReadableStream<Uint8Array>;
             text: () => Promise<string>;
@@ -189,6 +200,7 @@ export default function (): {
             readonly size: number;
             readonly type: string;
             arrayBuffer: () => Promise<ArrayBuffer>;
+            bytes: () => Promise<Uint8Array>;
             slice: (start?: number, end?: number, contentType?: string) => Blob;
             stream: () => ReadableStream<Uint8Array>;
             text: () => Promise<string>;

package/lib/apps/browser/util/file.d.ts

@@ -1,2 +1,3 @@
 import { RenderableFile } from '../../../types/files';
 export declare function openItem(item: RenderableFile, e: MouseEvent): void;
+export declare function openFolder(folderId: string): void;

package/lib/apps/canvas-builder/App.helpers.d.ts

@@ -1,6 +1,11 @@
 import { UnwrapRef } from 'vue';
-import { ComponentNode } from './types/canvas';
+import { ComponentNode, HomePageConfig } from './types/canvas';
 import { SectionComponentNodesBySectionId, ComponentNodesById } from './composables/useCanvas';
+export declare function navigateToHome({ homePageConfig, canvasContent, componentNodesById, }: {
+    homePageConfig?: HomePageConfig;
+    canvasContent: ComponentNode[];
+    componentNodesById?: UnwrapRef<ComponentNodesById>;
+}): Promise<boolean>;
 export declare function navigateToEmbeddableForPages({ appName, canvasPages, componentNodesById, sectionComponentNodesBySectionId, isEditMode, canvasContentElement, }: {
     appName: string;
     canvasPages: ComponentNode[][];