• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

TypeScript alloy.Replacing类代码示例

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

本文整理汇总了TypeScript中@ephox/alloy.Replacing的典型用法代码示例。如果您正苦于以下问题:TypeScript Replacing类的具体用法?TypeScript Replacing怎么用?TypeScript Replacing使用的例子?那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。



在下文中一共展示了Replacing类的10个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: renderSpinner

const toggleThrobber = (comp: AlloyComponent, state: boolean, providerBackstage: UiFactoryBackstageProviders) => {
  const element = comp.element();
  if (state === true) {
    Replacing.set(comp, [ renderSpinner(providerBackstage) ]);
    Css.remove(element, 'display');
    Attr.remove(element, 'aria-hidden');
  } else {
    Replacing.set(comp, [ ]);
    Css.set(element, 'display', 'none');
    Attr.set(element, 'aria-hidden', 'true');
  }
};
开发者ID:tinymce,项目名称:tinymce,代码行数:12,代码来源:Throbber.ts


示例2: zoomFit

      return memContainer.getOpt(anyInSystem).map((panel) => {
        const aImg = GuiFactory.external({
          element: img
        });

        Replacing.replaceAt(panel, 1, Option.some(aImg));

        const lastViewRect = viewRectState.get();
        const viewRect = {
          x: 0,
          y: 0,
          w: img.dom().naturalWidth,
          h: img.dom().naturalHeight
        };
        viewRectState.set(viewRect);
        const rect = Rect.inflate(viewRect, -20, -20);
        rectState.set(rect);

        if (lastViewRect.w !== viewRect.w || lastViewRect.h !== viewRect.h) {
          zoomFit(panel, img);
        }

        repaintImg(panel, img);
        return img;
      });
开发者ID:tinymce,项目名称:tinymce,代码行数:25,代码来源:ImagePanel.ts


示例3:

export const renderLabel = (spec: Types.Label.Label, backstageShared: UiFactoryBackstageShared): SimpleSpec => {
  const label = {
    dom: {
      tag: 'label',
      innerHtml: backstageShared.providers.translate(spec.label),
      classes: ['tox-label']
    }
  } as AlloySpec;
  const comps = Arr.map(spec.items, backstageShared.interpreter);
  return {
    dom: {
      tag: 'div',
      classes: ['tox-form__group']
    },
    components: [
      label
    ].concat(comps),
    behaviours: Behaviour.derive([
      ComposingConfigs.self(),
      Replacing.config({}),
      RepresentingConfigs.domHtml(Option.none()),
      Keying.config({
        mode: 'acyclic'
      }),
    ])
  };
};
开发者ID:tinymce,项目名称:tinymce,代码行数:27,代码来源:Label.ts


示例4: onControlAttached

          Step.sync(() => {

            Replacing.set(component, [
              {
                dom: {
                  tag: 'div',
                  classes: [ 'child-1' ]
                },
                behaviours: SimpleBehaviours.unnamedEvents([
                  onControlAttached(infoWithDestroy, cellWithDestroy),
                  onControlDetached(infoWithDestroy, cellWithDestroy)
                ])
              },
              {
                dom: {
                  tag: 'div',
                  classes: [ 'child-2' ]
                },
                behaviours: SimpleBehaviours.unnamedEvents([
                  onControlAttached(infoWithoutDestroy, cellWithoutDestroy),
                  onControlDetached(infoWithoutDestroy, cellWithoutDestroy)
                ])
              }
            ]);
          }),
开发者ID:tinymce,项目名称:tinymce,代码行数:25,代码来源:ControlOnSetupTest.ts


示例5: renderIcon

const renderReplacableIconFromPack = (iconName: string, iconsProvider: IconProvider): SimpleOrSketchSpec => {
  return renderIcon(getIcon(iconName, iconsProvider), {
    behaviours: Behaviour.derive([
      Replacing.config({ })
    ])
  });
};
开发者ID:tinymce,项目名称:tinymce,代码行数:7,代码来源:ButtonSlices.ts


示例6: renderInsertTableMenuItem

export function renderInsertTableMenuItem(spec: Menu.FancyMenuItem): ItemTypes.WidgetItemSpec {
  const numRows = 10;
  const numColumns = 10;
  const sizeLabelId = Id.generate('size-label');
  const cells = makeCells(sizeLabelId, numRows, numColumns);

  const memLabel = Memento.record({
    dom: {
      tag: 'span',
      classes: ['tox-insert-table-picker__label'],
      attributes: {
        id: sizeLabelId
      }
    },
    components: [GuiFactory.text('0x0')],
    behaviours: Behaviour.derive([
      Replacing.config({})
    ])
  });

  return {
    type: 'widget',
    data: { value: Id.generate('widget-id')},
    dom: {
      tag: 'div',
      classes: ['tox-fancymenuitem'],
    },
    autofocus: true,
    components: [ItemWidget.parts().widget({
      dom: {
        tag: 'div',
        classes: ['tox-insert-table-picker']
      },
      components: makeComponents(cells).concat(memLabel.asSpec()),
      behaviours: Behaviour.derive([
        AddEventsBehaviour.config('insert-table-picker', [
          AlloyEvents.runWithTarget<CellEvent>(cellOverEvent, (c, t, e) => {
            const row = e.event().row();
            const col = e.event().col();
            selectCells(cells, row, col, numRows, numColumns);
            Replacing.set(memLabel.get(c), [makeLabelText(row, col)]);
          }),
          AlloyEvents.runWithTarget<CellEvent>(cellExecuteEvent, (c, _, e) => {
            spec.onAction({numRows: e.event().row() + 1, numColumns: e.event().col() + 1});
            AlloyTriggers.emit(c, SystemEvents.sandboxClose());
          })
        ]),
        Keying.config({
          initSize: {
            numRows,
            numColumns
          },
          mode: 'flatgrid',
          selector: '[role="button"]'
        })
      ])
    })]
  };
}
开发者ID:tinymce,项目名称:tinymce,代码行数:59,代码来源:InsertTableMenuItem.ts


示例7:

 const updateText: NotificationSketchApis['updateText'] = (comp, text) => {
   if (comp.getSystem().isConnected()) {
     const banner = memBannerText.get(comp);
     Replacing.set(banner, [
       GuiFactory.text(text)
     ]);
   }
 };
开发者ID:tinymce,项目名称:tinymce,代码行数:8,代码来源:Notification.ts


示例8:

const renderLabel = (text: TranslateIfNeeded, prefix: string, providersBackstage: UiFactoryBackstageProviders) => ({
  dom: {
    tag: 'span',
    innerHtml: providersBackstage.translate(text),
    classes: [ `${prefix}__select-label` ]
  },
  behaviours: Behaviour.derive([
    Replacing.config({ })
  ])
});
开发者ID:tinymce,项目名称:tinymce,代码行数:10,代码来源:ButtonSlices.ts


示例9:

 (store, doc, body) => {
   return GuiFactory.build({
     dom: {
       tag: 'div',
       classes: [ 'test-container' ]
     },
     behaviours: Behaviour.derive([
       Replacing.config({ })
     ])
   });
 },
开发者ID:tinymce,项目名称:tinymce,代码行数:11,代码来源:ControlOnSetupTest.ts


示例10: function

const makeSocket = function () {
  return GuiFactory.build(
    Container.sketch({
      dom: UiDomFactory.dom('<div class="${prefix}-editor-socket"></div>'),
      components: [ ],
      containerBehaviours: Behaviour.derive([
        Replacing.config({ })
      ])
    })
  );
};
开发者ID:tinymce,项目名称:tinymce,代码行数:11,代码来源:CommonRealm.ts



注:本文中的@ephox/alloy.Replacing类示例由纯净天空整理自Github/MSDocs等源码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript alloy.Representing类代码示例发布时间:2022-05-28
下一篇:
TypeScript alloy.Reflecting类代码示例发布时间:2022-05-28
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap