const getFromExpandingItem = function (item) {
  const newItem = Merger.deepMerge(
    Objects.exclude(item, [ 'items' ]),
    {
      menu: true
    }
  );

  const rest = expand(item.items);

  const newMenus = Merger.deepMerge(
    rest.menus,
    Objects.wrap(
      item.title,
      rest.items
    )
  );
  const newExpansions = Merger.deepMerge(
    rest.expansions,
    Objects.wrap(item.title, item.title)
  );

  return {
    item: newItem,
    menus: newMenus,
    expansions: newExpansions
  };
};

const renderCommonSpec = (spec, actionOpt, extraBehaviours = [], dom, components) => {
  const action = actionOpt.fold(() => {
    return {};
  }, (action) => {
    return {
      action
    };
  });

  const common = {
    buttonBehaviours: Behaviour.derive([
      DisablingConfigs.button(spec.disabled),
      Tabstopping.config({}),
      AddEventsBehaviour.config('button press', [
        AlloyEvents.preventDefault('click'),
        AlloyEvents.preventDefault('mousedown')
      ])
    ].concat(extraBehaviours)),
    eventOrder: {
      click: ['button press', 'alloy.base.behaviour'],
      mousedown: ['button press', 'alloy.base.behaviour']
    },
    ...action
  };
  const domFinal = Merger.deepMerge(common, { dom });
  return Merger.deepMerge(domFinal, { components });
};

 return Arr.foldr(realItems, (acc, item) => {
   const itemWithValue = generateValueIfRequired(item);
   const newData = getFromItem(itemWithValue, menuItems);
   return {
     menus: Merger.deepMerge(acc.menus, newData.menus),
     items: [ newData.item ].concat(acc.items),
     expansions: Merger.deepMerge(acc.expansions, newData.expansions)
   };
 }, {

const applyDataToElement = (editor: Editor, tableElm, data: TableData) => {
  const dom = editor.dom;
  const attrs: any = {};
  const styles: any = {};

  attrs.class = data.class;

  styles.height = Util.addSizeSuffix(data.height);

  if (dom.getAttrib(tableElm, 'width') && !shouldStyleWithCss(editor)) {
    attrs.width = Util.removePxSuffix(data.width);
  } else {
    styles.width = Util.addSizeSuffix(data.width);
  }

  if (shouldStyleWithCss(editor)) {
    styles['border-width'] = Util.addSizeSuffix(data.border);
    styles['border-spacing'] = Util.addSizeSuffix(data.cellspacing);
  } else {
    attrs.border = data.border;
    attrs.cellpadding = data.cellpadding;
    attrs.cellspacing = data.cellspacing;
  }

  // TODO: this has to be reworked somehow, for example by introducing dedicated option, which
  // will control whether child TD/THs should be processed or not
  if (shouldStyleWithCss(editor) && tableElm.children) {
    for (let i = 0; i < tableElm.children.length; i++) {
      styleTDTH(dom, tableElm.children[i], {
        'border-width': Util.addSizeSuffix(data.border),
        'padding': Util.addSizeSuffix(data.cellpadding),
      });
      if (hasAdvancedTableTab(editor)) {
        styleTDTH(dom, tableElm.children[i], {
          'border-color': data.bordercolor,
        });
      }
    }
  }

  if (hasAdvancedTableTab(editor)) {
    styles['background-color'] = data.backgroundcolor;
    styles['border-color'] = data.bordercolor;
    styles['border-style'] = data.borderstyle;
  }

  attrs.style = dom.serializeStyle(Merger.merge(getDefaultStyles(editor), styles));
  dom.setAttribs(tableElm, Merger.merge(getDefaultAttributes(editor), attrs));
};

const convert = function (formats, memMenuThunk) {
  const mainMenu = makeMenu('Styles', [
  ].concat(
    Arr.map(formats.items, function (k) {
      return makeItem(getValue(k), k.title, k.isSelected(), k.getPreview(), Objects.hasKey(formats.expansions, getValue(k)));
    })
  ), memMenuThunk, false);

  const submenus = Obj.map(formats.menus, function (menuItems, menuName) {
    const items = Arr.map(menuItems, function (item) {
      return makeItem(
        getValue(item),
        item.title,
        item.isSelected !== undefined ? item.isSelected() : false,
        item.getPreview !== undefined ? item.getPreview() : '',
        Objects.hasKey(formats.expansions, getValue(item))
      );
    });
    return makeMenu(menuName, items, memMenuThunk, true);
  });

  const menus = Merger.deepMerge(submenus, Objects.wrap('styles', mainMenu));

  const tmenu = TieredMenu.tieredData('styles', menus, formats.expansions);

  return {
    tmenu
  };
};

 withRoot((_) => {
   const prevData = instanceApi.getData();
   const mergedData = Merger.merge(prevData, newData);
   const newInternalData = validateData(access, mergedData);
   const form = access.getFormWrapper();
   Representing.setValue(form, newInternalData);
 });

 const serialize = function (node, parserArgs?) {
   const args = Merger.merge({ format: 'html' }, parserArgs ? parserArgs : {});
   const targetNode = DomSerializerPreProcess.process(editor, node, args);
   const html = getHtmlFromNode(dom, targetNode, args);
   const rootNode = parseHtml(htmlParser, html, args);
   return args.format === 'tree' ? rootNode : toHtml(editor, settings, schema, rootNode, args);
 };

const renderNormalItemStructure = (info: NormalItemSpec, icon: Option<string>, renderIcons: boolean, textRender: (text: string) => AlloySpec, rtlClass: boolean): ItemStructure => {
  // checkmark has priority, otherwise render icon if we have one, otherwise empty icon for spacing
  const leftIcon = renderIcons ? info.checkMark.orThunk(() => icon.or(Option.some('')).map(renderIcon)) : Option.none();
  const domTitle = info.ariaLabel.map((label): {attributes?: {title: string}} => {
    return {
      attributes: {
        // TODO: AP-213 change this temporary solution to use tooltips, ensure its aria readable still.
        // for icon only implementations we need either a title or aria label to satisfy aria requirements.
        title: I18n.translate(label)
      }
    };
  }).getOr({});

  const dom = Merger.merge({
    tag: 'div',
    classes: [ ItemClasses.navClass, ItemClasses.selectableClass ].concat(rtlClass ? [ ItemClasses.iconClassRtl ] : []),
  }, domTitle);

  const menuItem = {
    dom,
    optComponents: [
      leftIcon,
      info.textContent.map(textRender),
      info.shortcutContent.map(renderShortcut),
      info.caret
    ]
  };
  return menuItem;
};

 const updateDataWithForm = (form: AlloyComponent): void => {
   const formData = Representing.getValue(form);
   const validData = toValidValues(formData).getOr({ });
   const currentData = storedValue.get();
   const newData = Merger.deepMerge(currentData, validData);
   storedValue.set(newData);
 };