TypeScript sugar.Css类代码示例

        SelectorFind.descendant(comp.element(), '[role="tabpanel"]').each((tabview) => {
          Css.set(tabview, 'visibility', 'hidden');

          // Determine the maximum heights of each tab
          comp.getSystem().getByDom(tabview).toOption().each((tabviewComp) => {
            const heights = measureHeights(allTabs, tabview, tabviewComp);

            // Calculate the maximum tab height and store it
            const maxTabHeightOpt = getMaxHeight(heights);
            maxTabHeight.set(maxTabHeightOpt);
          });

          // Set an initial height, based on the current size
          updateTabviewHeight(comp.element(), tabview, maxTabHeight);

          // Show the tabs
          Css.remove(tabview, 'visibility');
          showTab(allTabs, comp);

          // Use a delay here and recalculate the height, as we need all the components attached
          // to be able to properly calculate the max height
          Delay.requestAnimationFrame(() => {
            updateTabviewHeight(comp.element(), tabview, maxTabHeight);
          });
        });

  const setEditorSize = (elm) => {
    // Set height and width if they were given, though height only applies to iframe mode
    const DOM = DOMUtils.DOM;

    const baseWidth = editor.getParam('width', DOM.getStyle(elm, 'width'));
    const baseHeight = getHeightSetting(editor);
    const minWidth = getMinWidthSetting(editor);
    const minHeight = getMinHeightSetting(editor);

    const parsedWidth = Utils.parseToInt(baseWidth).bind((w) => {
      return Utils.numToPx(minWidth.map((mw) => Math.max(w, mw)));
    }).getOr(Utils.numToPx(baseWidth));

    const parsedHeight = Utils.parseToInt(baseHeight).bind((h) => {
      return minHeight.map((mh) => Math.max(h, mh));
    }).getOr(baseHeight);

    const stringWidth = Utils.numToPx(parsedWidth);
    if (Css.isValidValue('div', 'width', stringWidth)) {
      Css.set(outerContainer.element(), 'width', stringWidth);
    }

    if (!editor.inline) {
      const stringHeight = Utils.numToPx(parsedHeight);
      if (Css.isValidValue('div', 'height', stringHeight)) {
        Css.set(outerContainer.element(), 'height', stringHeight);
      } else {
        Css.set(outerContainer.element(), 'height', '200px');
      }
    }

    return parsedHeight;
  };

 return SelectorFind.descendant(Util.getBody(editor), 'table[data-mce-id="__mce"]').map((table) => {
   if (isPixelsForced(editor)) {
     Css.set(table, 'width', Css.get(table, 'width'));
   }
   Attr.remove(table, 'data-mce-id');
   fireEvents(editor, table);
   selectFirstCellInTable(editor, table);
   return table.dom();
 }).getOr(null);

  const refresh = function () {
    if (isActive) {
      const newToolbarHeight = Height.get(toolbar);
      const dropupHeight = Height.get(dropup);
      const newHeight = deriveViewportHeight(viewport, newToolbarHeight, dropupHeight);
      Attr.set(viewport, yFixedData, newToolbarHeight + 'px');
      Css.set(viewport, 'height', newHeight + 'px');

      Css.set(dropup, 'bottom', -(newToolbarHeight + newHeight + dropupHeight) + 'px');
      DeviceZones.updatePadding(contentBody, viewport, dropup);
    }
  };

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');
  }
};

 lastAnchor.get().each((anchor) => {
   const elem = lastElement.get().getOr(editor.selection.getNode());
   const nodeBounds = elem.getBoundingClientRect();
   const contentAreaBounds = editor.contentAreaContainer.getBoundingClientRect();
   const aboveEditor = nodeBounds.bottom < 0;
   const belowEditor = nodeBounds.top > contentAreaBounds.height;
   if (aboveEditor || belowEditor) {
     Css.set(contextbar.element(), 'display', 'none');
   } else {
     Css.remove(contextbar.element(), 'display');
     Positioning.positionWithin(sink, anchor, contextbar, getBoxElement());
   }
 });

const extractAdvancedStyles = (dom, elm) => {
  const rgbToHex = (value: string) => Strings.startsWith(value, 'rgb') ? dom.toHex(value) : value;

  const borderStyle = Css.getRaw(Element.fromDom(elm), 'border-style').getOr('');
  const borderColor = Css.getRaw(Element.fromDom(elm), 'border-color').map(rgbToHex).getOr('');
  const bgColor = Css.getRaw(Element.fromDom(elm), 'background-color').map(rgbToHex).getOr('');

  return {
    borderstyle: borderStyle,
    bordercolor: borderColor,
    backgroundcolor: bgColor
  };
};

 AlloyEvents.runOnSource<SugarEvent>(NativeEvents.transitionend(), (comp, se) => {
   InlineView.getContent(comp).each((c) => {
     // Css.remove(c.element(), 'opacity');
   });
   Class.remove(comp.element(), resizingClass);
   Css.remove(comp.element(), 'width');
 }),

const updateScrollingFixed = function (element, winY, offsetY) {
  const destTop = winY + offsetY;
  const oldProp = Css.getRaw(element, 'top').getOr(offsetY);
  // While we are changing top, aim to scroll by the same amount to keep the cursor in the same location.
  const delta = destTop - parseInt(oldProp, 10);
  const destScroll = element.dom().scrollTop + delta;
  return IosScrolling.moveScrollAndTop(element, destScroll, destTop);
};