Modal

Modal — UI component for opening a modal window in the Аспро.Cloud platform interface

import { Modal } from '@aspro-cloud/miniapp-jssdk'

Constructor

Creates a Modal instance with the given parameters

constructor(params: ModalParams)

Parameter	Type	Description
params	ModalParams	Modal window creation parameters

Properties

events

Object of type EventCallbacks<ModalEventName> with event handlers

get events(): EventCallbacks
set events(value: EventCallbacks)

options

Modal window display options of type ModalOptions

options: ModalOptions

title

Modal window title

title: string

url

URL of the page to open

url: string

Methods

destroy

Removes subscriptions and frees resources

destroy(): void

hide

Closes the modal window programmatically

async hide(): Promise<any>

show

Opens the modal window

async show(): Promise<any>

show() method events:

Event	Parameter	Type	Description
'onShow'			Modal window is shown
'onHide'			Modal window is hidden
'onClose'			Modal window is closed by user

Example

ESM

import { App, Modal } from '@aspro-cloud/miniapp-jssdk'

await App.initializeFrame()

const modal = new Modal({
  title: 'Acme Corp',
  url: '/_module/crm/view/account_view/2332?tab=account_info',
  options: {
    width: 'lg'
  },
  events: {
    onShow: () => console.log('Modal window shown'),
    onHide: () => console.log('Modal window hidden'),
    onClose: () => console.log('Modal window closed by user')
  }
})

await modal.show()

UMD

const App = window.ACloudMiniApp;

await App.initializeFrame();

const modal = new App.Frame.Modal({
  title: 'Acme Corp',
  url: '/_module/crm/view/account_view/2332?tab=account_info',
  options: {
    width: 'lg'
  },
  events: {
    onShow: () => console.log('Modal window shown'),
    onHide: () => console.log('Modal window hidden'),
    onClose: () => console.log('Modal window closed by user')
  }
});

await modal.show();