import { FieldSchema, StructureSchema } from '@ephox/boulder'; import { Fun, type Result } from '@ephox/katamari'; import * as FooterButton from './DialogFooterButton'; import * as Panel from './Panel'; import * as TabPanel from './TabPanel'; export type DialogDataItem = any; export type DialogData = Record; export interface DialogInstanceApi { getData: () => T; setData: (data: Partial) => void; setEnabled: (name: string, state: boolean) => void; focus: (name: string) => void; showTab: (name: string) => void; redial: (nu: DialogSpec) => void; block: (msg: string) => void; unblock: () => void; toggleFullscreen: () => void; close: () => void; } export interface DialogActionDetails { name: string; value?: any; } export interface DialogChangeDetails { name: keyof T; } export interface DialogTabChangeDetails { newTabName: string; oldTabName: string; } export type DialogActionHandler = (api: DialogInstanceApi, details: DialogActionDetails) => void; export type DialogChangeHandler = (api: DialogInstanceApi, details: DialogChangeDetails) => void; export type DialogSubmitHandler = (api: DialogInstanceApi) => void; export type DialogCloseHandler = () => void; export type DialogCancelHandler = (api: DialogInstanceApi) => void; export type DialogTabChangeHandler = (api: DialogInstanceApi, details: DialogTabChangeDetails) => void; export type DialogSize = 'normal' | 'medium' | 'large'; export interface DialogSpec { title: string; size?: DialogSize; body: TabPanel.TabPanelSpec | Panel.PanelSpec; buttons?: FooterButton.DialogFooterButtonSpec[]; initialData?: Partial; // Gets fired when a component within the dialog has an action used by some components onAction?: DialogActionHandler; // Gets fired when a value is changed while the dialog is open onChange?: DialogChangeHandler; // Gets fired when the dialog form has valid data and submit/enter is pressed onSubmit?: DialogSubmitHandler; // Gets fired when the dialog is closed for any reason onClose?: DialogCloseHandler; // Gets fired when the dialog is manually closed using Esc key or cancel/X button onCancel?: DialogCancelHandler; // Gets fired the dialog changes tab onTabChange?: DialogTabChangeHandler; } export interface Dialog { title: string; size: DialogSize; body: TabPanel.TabPanel | Panel.Panel; buttons: FooterButton.DialogFooterButton[]; initialData: T; onAction: DialogActionHandler; onChange: DialogChangeHandler; onSubmit: DialogSubmitHandler; onClose: DialogCloseHandler; onCancel: DialogCancelHandler; onTabChange: DialogTabChangeHandler; } export const dialogButtonFields = FooterButton.dialogFooterButtonFields; export const dialogButtonSchema = FooterButton.dialogFooterButtonSchema; export const dialogSchema = StructureSchema.objOf([ FieldSchema.requiredString('title'), FieldSchema.requiredOf('body', StructureSchema.chooseProcessor('type', { panel: Panel.panelSchema, tabpanel: TabPanel.tabPanelSchema })), FieldSchema.defaultedString('size', 'normal'), FieldSchema.defaultedArrayOf('buttons', [], dialogButtonSchema), FieldSchema.defaulted('initialData', {}), FieldSchema.defaultedFunction('onAction', Fun.noop), FieldSchema.defaultedFunction('onChange', Fun.noop), FieldSchema.defaultedFunction('onSubmit', Fun.noop), FieldSchema.defaultedFunction('onClose', Fun.noop), FieldSchema.defaultedFunction('onCancel', Fun.noop), FieldSchema.defaultedFunction('onTabChange', Fun.noop) ]); export const createDialog = (spec: DialogSpec): Result, StructureSchema.SchemaError> => StructureSchema.asRaw('dialog', dialogSchema, spec);