OXIESEC PANEL

Name	Size	Modified	Perms
📁 ..	-	02/20/2020 06:40:30 AM	rwxr-xr-x
📄 AlignSelect.ts	2.7 KB	02/20/2020 06:40:33 AM	rw-r--r--
📄 BespokeSelect.ts	6.28 KB	02/20/2020 06:40:33 AM	rw-r--r--
📄 FontSelect.ts	5.13 KB	02/20/2020 06:40:34 AM	rw-r--r--
📄 FontsizeSelect.ts	3.12 KB	02/20/2020 06:40:34 AM	rw-r--r--
📄 FormatSelect.ts	2.63 KB	02/20/2020 06:40:35 AM	rw-r--r--
📄 SelectDatasets.ts	1.7 KB	02/20/2020 06:40:35 AM	rw-r--r--
📄 StyleFormat.ts	5.07 KB	02/20/2020 06:40:36 AM	rw-r--r--
📄 StyleSelect.ts	2.79 KB	02/20/2020 06:40:36 AM	rw-r--r--
📁 utils	-	02/20/2020 06:42:40 AM	rwxr-xr-x

Editing: StyleSelect.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 { AlloyTriggers } from '@ephox/alloy';
import { Arr, Option } from '@ephox/katamari';
import Editor from 'tinymce/core/api/Editor';
import { getStyleFormats } from 'tinymce/themes/silver/ui/core/complex/StyleFormat';
import { updateMenuText } from '../../dropdown/CommonDropdown';
import { onActionToggleFormat } from './utils/Utils';
import { createMenuItems, createSelectButton, SelectSpec } from './BespokeSelect';
import { findNearest } from './utils/FormatDetection';

const getSpec = (editor): SelectSpec => {
  const isSelectedFor = (format) => {
    return () => {
      return editor.formatter.match(format);
    };
  };

const getPreviewFor = (format) => () => {
    const fmt = editor.formatter.get(format);
    return fmt !== undefined ? Option.some({
      tag: fmt.length > 0 ? fmt[0].inline || fmt[0].block || 'div' : 'div',
      styleAttr: editor.formatter.getCssText(format)
    }) : Option.none();
  };

const flatten = (fmt): string[] => {
    const subs = fmt.items;
    return subs !== undefined && subs.length > 0 ? Arr.bind(subs, flatten) : [ fmt.format ];
  };

return {
    tooltip: 'Formats',
    icon: Option.none(),
    isSelectedFor,
    getPreviewFor,
    onAction: onActionToggleFormat(editor),
    nodeChangeHandler,
    shouldHide: editor.getParam('style_formats_autohide', false, 'boolean'),
    isInvalid: (item) => !editor.formatter.canApply(item.format)
  } as SelectSpec;
};

const createStyleSelect = (editor: Editor, backstage) => {
  // FIX: Not right.
  const data = backstage.styleselect;
  return createSelectButton(editor, backstage, data, getSpec(editor));
};

const styleSelectMenu = (editor: Editor, backstage) => {
  const data = backstage.styleselect;
  const menuItems = createMenuItems(editor, backstage, data, getSpec(editor));
  editor.ui.registry.addNestedMenuItem('formats', {
    text: 'Formats',
    getSubmenuItems: () => menuItems.items.validateItems(menuItems.getStyleItems())
  });
};

export { createStyleSelect, styleSelectMenu };