TypeScript Menu.sketch方法代碼示例

本文整理匯總了TypeScript中@ephox/alloy.Menu.sketch方法的典型用法代碼示例。如果您正苦於以下問題：TypeScript Menu.sketch方法的具體用法？TypeScript Menu.sketch怎麽用？TypeScript Menu.sketch使用的例子？那麽, 這裏精選的方法代碼示例或許可以為您提供幫助。您也可以進一步了解該方法所在類@ephox/alloy.Menu的用法示例。

在下文中一共展示了Menu.sketch方法的2個代碼示例，這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚，您的評價將有助於係統推薦出更棒的TypeScript代碼示例。

示例1: renderColorSwatchItem

export function renderColorSwatchItem(spec: Menu.FancyMenuItem, backstage: UiFactoryBackstage): ItemTypes.WidgetItemSpec {
  const items = ColorSwatch.getColors(backstage.colorinput.getColors(), backstage.colorinput.hasCustomColors());
  const columns = backstage.colorinput.getColorCols();
  const presets = 'color';

  const menuSpec = createPartialChoiceMenu(
    Id.generate('menu-value'),
    items,
    (value) => {
      spec.onAction({ value });
    },
    columns,
    presets,
    ItemResponse.CLOSE_ON_EXECUTE,
    () => false,
    backstage.shared.providers
  );

  const widgetSpec = Merger.deepMerge({
    ...menuSpec,
    markers: MenuParts.markers(presets),
    movement: deriveMenuMovement(columns, presets)
  });

  return {
    type: 'widget',
    data: { value: Id.generate('widget-id')},
    dom: {
      tag: 'div',
      classes: [ 'tox-fancymenuitem' ],
    },
    autofocus: true,
    components: [
      ItemWidget.parts().widget(AlloyMenu.sketch(widgetSpec))
    ]
  };
}

開發者ID:tinymce，項目名稱:tinymce，代碼行數:37，代碼來源:ColorSwatchItem.ts

示例2: getCombinedItems

        lookupInfo.lookupData.then((lookupData) => {
          const combinedItems = getCombinedItems(lookupInfo.triggerChar, lookupData);

          // Only open the autocompleter if there are items to show
          if (combinedItems.length > 0) {
            const columns: Types.ColumnTypes = Options.findMap(lookupData, (ld) => Option.from(ld.columns)).getOr(1);
            InlineView.showAt(
              autocompleter,
              {
                anchor: 'selection',
                root: Element.fromDom(editor.getBody()),
                getSelection: () => {
                  return Option.some({
                    start: () => Element.fromDom(lookupInfo.range.startContainer),
                    soffset: () => lookupInfo.range.startOffset,
                    finish: () => Element.fromDom(lookupInfo.range.endContainer),
                    foffset: () => lookupInfo.range.endOffset
                  });
                }
              },
              Menu.sketch(
                createMenuFrom(
                  createPartialMenuWithAlloyItems('autocompleter-value', true, combinedItems, columns, 'normal'),
                  columns,
                  FocusMode.ContentFocus,
                  // Use the constant.
                  'normal'
                )
              )
            );

            InlineView.getContent(autocompleter).each(Highlighting.highlightFirst);
          } else {
            closeIfNecessary();
          }
        });

開發者ID:tinymce，項目名稱:tinymce，代碼行數:36，代碼來源:Autocompleter.ts

注：本文中的@ephox/alloy.Menu.sketch方法示例由純淨天空整理自Github/MSDocs等開源代碼及文檔管理平台，相關代碼片段篩選自各路編程大神貢獻的開源項目，源碼版權歸原作者所有，傳播和使用請參考對應項目的License；未經允許，請勿轉載。