import { MaybeRef } from '@vueuse/core'; import { Ref } from 'vue'; import { aspectRatios } from '../constants'; import { FontAwesomeType } from './font-awesome.types'; import { CollectionPlayer as CollectionPlayerProps } from '../../collection-player/types/collection-player.type'; import { FileModel } from '../../../components/CFileViewer/CFileViewer.types'; import { GetFavoritesParams } from '../../../main.lib'; import { EmbedLocation, EmbeddedLocationProperties } from '../../../types/app'; import { BackgroundSize } from '../../../types/background'; import { Call } from '../../../types/call'; import { CanvasActions } from '../../../types/canvasActions'; import { CanvasThemeAsset, CanvasThemeRetrieve, CanvasTypographyPreset } from '../../../types/canvasTheme'; import { CanvasMetadataRetrieve } from '../../../types/canvases'; import { PaginatedData } from '../../../types/paginatedData'; import { QueryOperator } from '../../../types/query-builder.types'; import { RecentFile } from '../../../types/recentFiles.types'; import { CanvasRetrieve, Favorite, File, FileContentTypeEnum, FileRetrieve, Folder, FolderRetrieve, MetadataTemplate, PatchedCanvasUpdateRequest, SharedLink, User } from '../../../../types/openapi'; import { UiSelectCollectionPlayerRequest, UiSelectCollectionPlayerResponse } from '../../../sdk/api/modules/ui/types.ui'; import { OpenExternalUrlRequestPayload, PitcherEnv } from '../../../sdk/main'; import { OpenRequestPayload } from '../../../sdk/payload.types'; type AvailableAspectRatio = (typeof aspectRatios)[number]; export declare enum HtmlLayoutTypes { PREVIEW = "preview", EDIT = "edit" } export declare enum ContentGridLayoutTypes { CAROUSEL = "carousel", GRID = "grid", LIST = "list" } export declare enum GridLayoutTypes { ONE = "one", TWO_EQUAL = "two-equal", TWO_LEFT = "two-left", TWO_RIGHT = "two-right", THREE_EQUAL = "three-equal", FOUR_EQUAL = "four-equal" } export declare enum LinkAnchorTypes { CANVAS_ANCHOR = "canvas-anchor", FILE = "file", WEB = "web" } export declare enum LinkAlignmentTypes { LEFT = "left", CENTER = "center", RIGHT = "right" } export declare enum LinkPreviewTypes { SOLID_BUTTON = "solid-button", OUTLINE_BUTTON = "outline-button", TEXT_LINK = "text-link" } export interface EmbeddableProps { type: 'app'; app_name: string; src: string | null; height?: string; width?: string; full_screen_mode?: boolean; embed_locations?: EmbedLocation[]; headless_locations?: EmbedLocation[]; properties_by_embed_location?: Partial>; file: ContentGridFileProps | null; settings?: Record; } export interface DynamicDatatableProperty { key: string; display_name?: string; sort: { direction?: 'asc' | 'desc'; default?: boolean; enabled: boolean; }; group?: boolean; printable?: boolean; format?: { type?: 'currency' | 'number' | 'percentage' | 'date'; currency?: string; decimals?: number; thousandsSeparator?: boolean; dateFormat?: string; }; } export interface DynamicDatatableFilter { property: string; operator: QueryOperator; value: string; } export interface DynamicDataTableProps { filters?: DynamicDatatableFilter[]; layout: 'column' | 'row'; page_size?: number; path: string; properties: DynamicDatatableProperty[]; theme?: { background_color?: string | null; group_header_color?: string | null; font_family?: string; }; break_groups_on_new_page?: boolean; enable_row_striping?: boolean; striping_color?: string | null; striping_start_from_first?: boolean; } export interface CustomDataTableHierarchyLevel { type: 'group' | 'data'; path: string; group_by_key?: string; } export interface CustomDataTableProps { hierarchy: CustomDataTableHierarchyLevel[]; columns: DynamicDatatableProperty[]; header_path?: string; footer_path?: string; filters?: DynamicDatatableFilter[]; theme?: { background_color?: string | null; group_header_color?: string | null; font_family?: string; }; enable_row_striping?: boolean; striping_color?: string | null; striping_start_from_first?: boolean; } export interface TextProps { content?: string; } export interface BlockOverrides { [key: ComponentNode['id']]: { node_data: ComponentNode['data']; }; } export interface BlockProps { id: CanvasRetrieve['id']; overrides?: BlockOverrides; } export interface CarouselProps { images?: { url: string; is_uploaded_asset?: boolean; }[]; placeholder_height?: string; include_all_images_in_pdf?: boolean; } export interface CanvasFile { readonly name: FileModel['name']; readonly file_id: FileModel['id']; readonly content_extension: FileModel['content_extension']; readonly content_type: FileModel['content_type']; readonly content_url: FileModel['content_url']; readonly thumbnail_url: FileModel['thumbnail_url']; readonly content_length: FileModel['content_length']; readonly content_thumbnails: FileModel['content_thumbnails']; readonly pspdfkit_server_url?: FileModel['pspdfkit_server_url']; readonly pspdfkit_auth_payload?: FileModel['pspdfkit_auth_payload']; } declare const MULTIMEDIA_IMG_TYPE: { readonly external: "external"; readonly pitcher_asset: "pitcher_asset"; }; export declare enum MultimediaHorizontalAlignmentOptions { LEFT = "left", CENTER = "center", RIGHT = "right" } export type ExternalMultimediaAssetType = { asset_type: typeof MULTIMEDIA_IMG_TYPE.external; external_url: string; type: 'image' | 'video'; horizontal_alignment?: MultimediaHorizontalAlignmentOptions; from?: 'custom' | 'pexels' | 'unsplash' | 'ai'; poster_url?: string; poster_background_size?: BackgroundSize; }; export type PitcherMultimediaAssetType = { asset_type: typeof MULTIMEDIA_IMG_TYPE.pitcher_asset; file: { id: File['id']; name: File['name']; content_url?: File['content_url']; }; type: 'image' | 'video'; horizontal_alignment?: MultimediaHorizontalAlignmentOptions; poster_url?: string; poster_background_size?: BackgroundSize; }; export type MultimediaProps = ExternalMultimediaAssetType | PitcherMultimediaAssetType; export type ContentGridCommonFileProps = { id: FileRetrieve['id']; snapshot_id?: FileRetrieve['id']; name: FileRetrieve['name']; is_deleted?: boolean; expires_at?: FileRetrieve['expires_at']; content_url?: FileRetrieve['content_url']; content_type?: FileContentTypeEnum | null; content_extension?: FileRetrieve['content_extension']; permissions?: FileRetrieve['permissions']; tags?: FileRetrieve['tags']; }; export type ContentGridFileProps = ContentGridCommonFileProps & { thumbnail_url?: FileRetrieve['thumbnail_url']; content_url: FileRetrieve['content_url']; content_type: FileContentTypeEnum | null; content_extension: FileRetrieve['content_extension']; readonly content_length?: FileRetrieve['content_length']; content_thumbnails?: FileRetrieve['content_thumbnails'] | null; readonly pspdfkit_server_url?: FileModel['pspdfkit_server_url']; readonly pspdfkit_auth_payload?: FileModel['pspdfkit_auth_payload']; }; export type ContentGridItemFileProps = { file: ContentGridFileProps; type: 'file'; }; export type ContentGridItemSlideProps = { file: ContentGridCommonFileProps; slide: { index: number; url?: FileRetrieve['content_thumbnails'][number]; }; type: 'slide'; }; export interface ContentGridProps { items: (ContentGridItemSlideProps | ContentGridItemFileProps)[]; size?: 'medium'; layout_type?: ContentGridLayoutTypes; data_accessor?: string; } export interface SectionListSection { id: string; style?: Record; aspect_ratio?: AvailableAspectRatio; background_video_url?: string; } export interface SectionListProps { sections: SectionListSection[]; animation_in?: string; selection_strategy?: 'free' | 'single' | 'at-least-one' | 'app'; selection_app_name?: string; is_restricted_to_preselections?: boolean; } export interface GridItemTooltipProps { content?: string; content_style?: Record; trigger?: string; trigger_style?: Record; } export interface GridItemProps { span: number; tooltips?: GridItemTooltipProps[]; } export interface GridProps { layout_type: GridLayoutTypes; columns: number; } export interface HtmlProps { html: string; } export interface IFrameProps { src: string | null; height?: string; width?: string; full_screen_mode?: boolean; add_session_context?: boolean; } export type CollectionFileEntity = Pick; export interface LinkProps { alignment?: LinkAlignmentTypes; background_color?: string; canvas_anchor?: string; color?: string; display_text?: string; file?: (Partial & { page_index?: number; }) | null; font_family?: string; font_size?: number; link_type?: LinkAnchorTypes; page_index?: number; preview_type?: LinkPreviewTypes; target?: '_self' | '_blank'; url?: string; } export interface ScribbleProps { content_background?: { file_id?: string; page_index?: number; page_id?: string; is_deleted?: boolean; }; asset_background?: { asset_id?: string; is_deleted?: boolean; }; } export interface PageBreakProps { } export interface PageProps { aspect_ratio?: AvailableAspectRatio; background_video_url?: string; } export interface TimelineEvent { top_hint?: string; top_hint_style?: Record; title?: string; title_style?: Record; description?: string; description_style?: Record; image_url?: string; image_style?: Record; icon?: string; icon_style?: Record; card_style?: Record; } export interface TimelineProps { events: TimelineEvent[]; layout: 'vertical' | 'horizontal'; } type AvailableComponentProps = GridProps | GridItemProps | TextProps | CarouselProps | MultimediaProps | EmbeddableProps | ContentGridProps | SectionListProps | HtmlProps | IFrameProps | LinkProps | PageBreakProps | PageProps | TimelineProps | CollectionPlayerProps | DynamicDataTableProps | CustomDataTableProps; export interface ComponentNodeVisible { edit_mode: boolean; presentation_mode: boolean; pdf: boolean; web: boolean; } export interface ComponentNodeGenericThemeMeta { bg_color_palette_index?: number; } export interface ComponentNodeDynamicDataTableThemeMeta extends ComponentNodeGenericThemeMeta { dt_header_bg_palette_index?: number; dt_group_header_bg_palette_index?: number; } export interface ComponentNodeMultimediaThemeMeta extends ComponentNodeGenericThemeMeta { is_theme_logo?: boolean; theme_asset_index?: number; } export type ComponentNodeThemeMeta = ComponentNodeGenericThemeMeta | ComponentNodeDynamicDataTableThemeMeta | ComponentNodeMultimediaThemeMeta; export interface ComponentNodeLinkable { linkable_in_templates: boolean; } export interface ComponentNodePrint { scale_to_fit_page?: boolean; } export interface ComponentNode { id: string; type: ComponentTypes; tracking_id: string; visible?: ComponentNodeVisible; linkable?: ComponentNodeLinkable; print?: ComponentNodePrint; allow_admins_to_overwrite?: boolean; autofill?: 'off' | 'ai' | 'matching_metadata' | 'matching_tags' | 'matching_metadata_or_tags'; autofill_content_types?: FileContentTypeEnum[] | null; data?: T; children?: ComponentNode[]; when_used_in_section?: { is_editable: boolean; is_removable: boolean; }; style?: Record; tags?: string[]; theme_meta?: ComponentNodeThemeMeta; height?: string; } export interface HomePageConfig { component_id: string; section_id?: string | null; } export interface CanvasContent { data?: ComponentNode[]; overrides?: SectionComponentOverrides; home_page?: HomePageConfig; hidden?: { dsr: { sections: HiddenElementsInCanvas; components: HiddenElementsInCanvas; }; dsr_print: { sections: HiddenElementsInCanvas; components: HiddenElementsInCanvas; }; }; } export interface HiddenElementsInCanvas { [elementId: string]: true; } export type SectionComponentOverride = { node?: ComponentNode; after_sibling_id?: ComponentNode['id']; is_removed?: true; }; export type SectionOverrides = { [componentId: ComponentNode['id'] | 'root']: SectionComponentOverride; } & { modified_by?: { id: User['id']; }; modified_at?: string; }; export type SectionComponentOverrides = { [sectionId: CanvasRetrieve['id']]: SectionOverrides; }; export interface ComponentMeta { allowedChildren: ComponentTypes[]; defaultChildren: Partial[]; defaultData: AvailableComponentProps; singleton?: boolean; defaultPrintable: boolean; } export declare enum ComponentTypes { Block = "Block", Carousel = "Carousel", CollectionPlayer = "CollectionPlayer", ContentGrid = "ContentGrid", CustomDataTable = "CustomDataTable", DataCharts = "DataCharts", DynamicDataTable = "DynamicDataTable", Embeddable = "Embeddable", Grid = "Grid", GridItem = "GridItem", Html = "Html", IFrame = "IFrame", Link = "Link", Multimedia = "Multimedia", Page = "Page", PageBreak = "PageBreak", Root = "Root", Scribble = "Scribble", SectionList = "SectionList", Text = "Text", Timeline = "Timeline" } export declare const ComponentIcon: { readonly AR: "cube"; readonly Block: "objects-column"; readonly Carousel: "gallery-thumbnails"; readonly Collection: "rectangle-history-circle-plus"; readonly CollectionPlayer: "regular-rectangle-history-circle-play"; readonly ContentGrid: "files"; readonly CustomDataTable: "table-tree"; readonly DataCharts: "chart-line"; readonly DynamicDataTable: "regular-table-circle-bolt"; readonly Embeddable: "browser"; readonly File: "file-circle-plus"; readonly Grid: "table"; readonly GridItem: "objects-column"; readonly GridParent: "angle-down"; readonly Html: "code"; readonly IFrame: "window"; readonly Link: "hand-pointer"; readonly Multimedia: "image"; readonly Page: "pager"; readonly PageBreak: "arrows-from-line"; readonly Scribble: "pen-swirl"; readonly SectionList: "bring-forward"; readonly Text: "text-size"; readonly Timeline: "timeline-arrow"; readonly Video: "video"; }; export declare const componentIconType: Record; export interface CanvasPdfDimensions { preset?: 'A4' | 'A3' | 'A5' | 'B3' | 'B4' | 'B5' | 'US Legal' | 'US Letter' | 'Custom'; width?: string; height?: string; } export type CanvasTheme = { background_video_url?: string; canvas_bg_color?: string; global_component_spacing?: number; font?: { name: string; url: string; }; fluid?: boolean; palette?: string[]; style?: Record; typography?: Record; aspect_ratio?: AvailableAspectRatio; maintain_section_theme?: boolean; inherit_theme_from_parent?: boolean; logo?: CanvasThemeAsset | null; assets?: CanvasThemeAsset[]; pdf_dimensions?: CanvasPdfDimensions; }; export declare enum CanvasBuilderMode { ADMIN = "admin", IMPACT = "impact", SHARING = "sharing", HOME = "home" } export interface ComponentTrackingParams { trackable: boolean; } export declare enum CanvasHistoryAction { ADD = "add", REMOVE = "remove", REORDER = "reorder", OPEN = "open", SAVE = "save" } export interface CanvasHistoryItem { active?: boolean; action: CanvasHistoryAction; componentType: ComponentTypes; icon?: string; id: string; snapshot: ComponentNode[]; timestamp: string; } export interface FileProps { file_id: FileRetrieve['id']; source_file_id?: FileRetrieve['id']; name: FileRetrieve['name']; thumbnail_url?: FileRetrieve['thumbnail_url']; content_url: FileRetrieve['content_url']; content_type: FileRetrieve['content_type']; content_extension: FileRetrieve['content_extension']; content_length: FileRetrieve['content_length']; content_thumbnails: FileRetrieve['content_thumbnails'] | null; is_deleted?: boolean; readonly pspdfkit_server_url?: FileModel['pspdfkit_server_url']; readonly pspdfkit_auth_payload?: FileModel['pspdfkit_auth_payload']; } export type FileOpenParams = (FileProps & { page_index?: number; newTab?: boolean; files?: OpenRequestPayload['files']; used_in_section_id?: CanvasRetrieve['id']; }) | { file_id: File['id']; name?: File['name']; page_index?: number; newTab?: boolean; files?: OpenRequestPayload['files']; used_in_section_id?: CanvasRetrieve['id']; }; type NoCRMBuilderProps = { isCRM: false; onSfdcAccountSearch?: never; }; export type NodeInfo = { id?: string; type: ComponentTypes; }; export type SharingBuilderProps = NoCRMBuilderProps & { selectCollectionPlayerContent?: never; isFullscreen?: boolean; displayMode?: 'default' | 'print'; startPage?: number; endPage?: number; isRedirectEvent?: never; mode: CanvasBuilderMode.SHARING; metadata: { baseStackingContext?: number; }; activeCanvas: CanvasRetrieve; onExit: () => void; onSave?: never; onEnter?: () => void; onPageEnter?: (data: ComponentNode[], pageIndex: number) => void; onPageExit?: (data: ComponentNode[], pageIndex: number) => void; onWizardEnter?: never; onWizardExit?: never; onFileEnter?: (node: NodeInfo, file: CollectionFileEntity) => void; onFileExit?: (node: NodeInfo, file: CollectionFileEntity) => void; onFilePageEnter?: (node: NodeInfo, file: CollectionFileEntity, pageIndex: number) => void; onFilePageExit?: (node: NodeInfo, file: CollectionFileEntity, pageIndex: number) => void; onCollectionPlayerContentChange?: never; onComponentEnter?: (data: ComponentNode | CanvasRetrieve, params: ComponentTrackingParams) => void; onComponentExit?: (data: ComponentNode | CanvasRetrieve, params: ComponentTrackingParams) => void; onAppEnter?: (data: { src: string; }) => void; onAppExit?: (data: { src: string; }) => void; onFileOpen: (file: FileOpenParams) => void; onOpenExternalUrl: (payload: OpenExternalUrlRequestPayload) => Promise; deleteFile?: never; listFiles?: never; listRecommendedFiles?: never; listCanvases?: never; fetchFolder?: never; fetchFile?: never; fetchFavorites?: never; fetchRecentFiles?: never; fetchInstanceMetadataTemplate?: never; fetchCanvas?: (canvasId: CanvasRetrieve['id'], params?: Record) => Promise; renderPageAsImageUrl: (payload: { fileId: File['id']; documentId?: File['id']; pageIndex: number; params: { width: number; } | { height: number; }; }) => Promise; getEnv: () => Promise; onTrackShare?: never; share?: never; onEditMode: never; inCall?: never; myUserId?: never; onDownloadFile?: (file: File | ContentGridFileProps | ContentGridCommonFileProps) => Promise; onDownloadCanvas?: (canvas: CanvasRetrieve, fileFormat?: 'pdf' | 'pptx') => Promise; theme: CanvasThemeRetrieve | null; isAnyTypeOfAdmin: boolean; canvasMetadata: CanvasMetadataRetrieve | null; }; export interface CRMBuilderProps { isCRM: true; onSfdcAccountSearch: (searchTerm?: MaybeRef) => { accountsLoading: Ref; accounts: Ref<{ label: string; value: string; }[]>; }; } type AdminImpactCommonBuilderProps = { selectCollectionPlayerContent: (payload?: UiSelectCollectionPlayerRequest) => Promise; openOnStart?: { component?: string; section?: string; }; isFullscreen?: boolean; displayMode?: 'default' | 'print'; startPage?: number; endPage?: number; metadata: { baseStackingContext?: number; startInMode?: CanvasActions.Present | CanvasActions.Edit; }; activeCanvas: CanvasRetrieve; onExit: () => void; onEnter?: () => void; onComponentEnter?: (data: ComponentNode | CanvasRetrieve, params: ComponentTrackingParams) => void; onComponentExit?: (data: ComponentNode | CanvasRetrieve, params: ComponentTrackingParams) => void; onAppEnter?: (data: { src: string; }) => void; onAppExit?: (data: { src: string; }) => void; onWizardEnter?: () => void; onWizardExit?: () => void; onPageEnter?: (data: ComponentNode[], pageIndex: number) => void; onPageExit?: (data: ComponentNode[], pageIndex: number) => void; onFileEnter?: (node: NodeInfo, file: CollectionFileEntity) => void; onFileExit?: (node: NodeInfo, file: CollectionFileEntity) => void; onFilePageEnter?: (node: NodeInfo, file: CollectionFileEntity, pageIndex: number) => void; onFilePageExit?: (node: NodeInfo, file: CollectionFileEntity, pageIndex: number) => void; onCollectionPlayerContentChange?: (payload: { componentId: string; uniqueFilesCount: number; groupsCount: number; slidesCount: number; }) => void; onSave: (canvasId: CanvasRetrieve['id'], canvas: PatchedCanvasUpdateRequest & { fields?: string; include_expired_files?: boolean; }, showToast?: boolean) => Promise; onFileOpen: (file: FileOpenParams) => void; deleteFile: (fileId: FileRetrieve['id']) => Promise; listFiles: (params?: any) => Promise; listCanvases: (params?: any) => Promise>; fetchFolder: (folderId: Folder['id'] | undefined) => Promise; fetchFile: (fileId: FileRetrieve['id']) => Promise; fetchFavorites: (payload?: GetFavoritesParams) => Promise>; fetchRecentFiles: () => Promise; fetchCanvas: (canvasId: CanvasRetrieve['id'], params?: Record) => Promise; fetchInstanceMetadataTemplate: () => Promise; renderPageAsImageUrl: (payload: { fileId: File['id']; documentId?: File['id']; pageIndex: number; params: { width: number; } | { height: number; }; }) => Promise; getEnv?: () => Promise; onEditMode?: (isEditMode: boolean) => void; onTrackShare?: (canvasId: CanvasRetrieve['id']) => Promise; onOpenExternalUrl: (payload: OpenExternalUrlRequestPayload) => Promise; share?: (canvasId: CanvasRetrieve['id']) => Promise; isCRM: boolean; onDownloadFile?: (file: File | ContentGridFileProps | ContentGridCommonFileProps) => Promise; onDownloadCanvas?: (canvas: CanvasRetrieve, fileFormat?: 'pdf' | 'pptx') => Promise; theme: CanvasThemeRetrieve | null; isAnyTypeOfAdmin: boolean; canvasMetadata: CanvasMetadataRetrieve | null; hideEdit?: boolean; }; type AdminBuilderProps = AdminImpactCommonBuilderProps & (CRMBuilderProps | NoCRMBuilderProps) & { isRedirectEvent?: never; mode: CanvasBuilderMode.ADMIN; inCall?: never; myUserId?: never; listRecommendedFiles?: never; }; type ImpactBuilderProps = AdminImpactCommonBuilderProps & (CRMBuilderProps | NoCRMBuilderProps) & { isRedirectEvent?: boolean; mode: CanvasBuilderMode.IMPACT; inCall?: boolean; call?: Call; myUserId?: User['id']; listRecommendedFiles: (params: { sectionId: CanvasRetrieve['id']; matchingStrategy: ('tags' | 'metadata')[]; }) => Promise; }; type HomeBuilderProps = AdminImpactCommonBuilderProps & (CRMBuilderProps | NoCRMBuilderProps) & { isRedirectEvent?: boolean; mode: CanvasBuilderMode.HOME; inCall?: boolean; call?: Call; myUserId?: User['id']; listRecommendedFiles: (params: { sectionId: CanvasRetrieve['id']; matchingStrategy: ('tags' | 'metadata')[]; }) => Promise; }; export type CanvasBuilderProps = AdminBuilderProps | ImpactBuilderProps | SharingBuilderProps | HomeBuilderProps; export {};