OXIESEC PANEL

Name	Size	Modified	Perms
📁 ..	-	02/20/2020 06:40:48 AM	rwxr-xr-x
📄 AlertDialog.ts	1.7 KB	02/20/2020 06:38:15 AM	rw-r--r--
📄 Autocomplete.ts	1.78 KB	02/20/2020 06:38:15 AM	rw-r--r--
📄 Bar.ts	689 bytes	02/20/2020 06:38:16 AM	rw-r--r--
📄 BodyPanel.ts	2.11 KB	02/20/2020 06:38:16 AM	rw-r--r--
📄 Collection.ts	5.65 KB	02/20/2020 06:38:17 AM	rw-r--r--
📄 ColorInput.ts	5.81 KB	02/20/2020 06:38:17 AM	rw-r--r--
📄 ColorPicker.ts	4.06 KB	02/20/2020 06:38:19 AM	rw-r--r--
📄 ConfirmDialog.ts	2.13 KB	02/20/2020 06:38:19 AM	rw-r--r--
📄 CustomEditor.ts	2.04 KB	02/20/2020 06:38:20 AM	rw-r--r--
📄 Dialogs.ts	3.91 KB	02/20/2020 06:38:20 AM	rw-r--r--
📄 Dropzone.ts	4.89 KB	02/20/2020 06:38:21 AM	rw-r--r--
📄 Grid.ts	735 bytes	02/20/2020 06:38:21 AM	rw-r--r--
📄 IFrame.ts	3.3 KB	02/20/2020 06:38:22 AM	rw-r--r--
📄 Label.ts	1.29 KB	02/20/2020 06:38:22 AM	rw-r--r--
📄 SelectBox.ts	2.37 KB	02/20/2020 06:38:23 AM	rw-r--r--
📄 SizeInput.ts	4.96 KB	02/20/2020 06:38:23 AM	rw-r--r--
📄 TabPanel.ts	5.41 KB	02/20/2020 06:38:24 AM	rw-r--r--
📄 Table.ts	1.52 KB	02/20/2020 06:38:24 AM	rw-r--r--
📄 TextField.ts	4.24 KB	02/20/2020 06:38:25 AM	rw-r--r--
📄 TypeAheadInput.ts	1.31 KB	02/20/2020 06:38:26 AM	rw-r--r--
📄 UrlInput.ts	9.25 KB	02/20/2020 06:38:26 AM	rw-r--r--
📄 WindowManager.ts	6.3 KB	02/20/2020 06:38:27 AM	rw-r--r--
📁 imagetools	-	02/20/2020 06:42:42 AM	rwxr-xr-x

Editing: Dialogs.ts

/**
 * Copyright (c) Tiny Technologies, Inc. All rights reserved.
 * Licensed under the LGPL or a commercial license.
 * For LGPL see License.txt in the project root for license information.
 * For commercial licenses see https://www.tiny.cloud/
 */

import {
  AddEventsBehaviour,
  AlloyEvents,
  AlloySpec,
  Behaviour,
  Button,
  Container,
  DomFactory,
  ModalDialog,
  Tabstopping,
  AlloyComponent,
} from '@ephox/alloy';
import { Option, Result } from '@ephox/katamari';

import { UiFactoryBackstageProviders } from '../../backstage/Backstage';
import { FormCancelEvent, formCancelEvent, FormSubmitEvent, formSubmitEvent } from '../general/FormEvents';

const pClose = (onClose, providersBackstage: UiFactoryBackstageProviders) => ModalDialog.parts().close(
  // Need to find a way to make it clear in the docs whether parts can be sketches
  Button.sketch({
    dom: {
      tag: 'button',
      classes: [ 'tox-button', 'tox-button--icon', 'tox-button--naked' ],
      attributes: {
        'type': 'button',
        'aria-label': providersBackstage.translate('Close')
      }
    },
    action: onClose,
    buttonBehaviours: Behaviour.derive([
      Tabstopping.config({ })
    ])
  })
);

const pUntitled = () => ModalDialog.parts().title({
  dom: {
    tag: 'div',
    classes: [ 'tox-dialog__title' ],
    innerHtml: '',
    styles: {
      display: 'none'
    }
  }
});

const pBodyMessage = (message: string, providersBackstage: UiFactoryBackstageProviders) => ModalDialog.parts().body({
  dom: {
    tag: 'div',
    classes: [ 'tox-dialog__body', 'todo-tox-fit' ]
  },
  components: [
    {
      dom: DomFactory.fromHtml(`<p>${providersBackstage.translate(message)}</p>`)
    }
  ]
});

const pFooter = (buttons: AlloySpec[]) => ModalDialog.parts().footer({
  dom: {
    tag: 'div',
    classes: [ 'tox-dialog__footer' ]
  },
  components: buttons,
});

const pFooterGroup = (startButtons: AlloySpec[], endButtons: AlloySpec[]) => {
  return [
    Container.sketch({
      dom: {
        tag: 'div',
        classes: [ `tox-dialog__footer-start` ]
      },
      components: startButtons
    }),
    Container.sketch({
      dom: {
        tag: 'div',
        classes: [ `tox-dialog__footer-end` ]
      },
      components: endButtons
    })
  ];
};

export interface DialogFoo {
  lazySink: () => Result<AlloyComponent, any>;
  partSpecs: {
    title: AlloySpec,
    close: AlloySpec,
    body: AlloySpec,
    footer: AlloySpec
  };
  onCancel: () => void;
  onSubmit: () => void;
  extraClasses: string[];
}

export { pClose, pUntitled, pBodyMessage, pFooter, pFooterGroup, renderDialog };