TypeScript SelectorFind.ancestor方法代碼示例

const updateTabviewHeight = (dialogBody: Element, tabview: Element, maxTabHeight: Cell<Option<number>>) => {
  SelectorFind.ancestor(dialogBody, '[role="dialog"]').each((dialog) => {
    maxTabHeight.get().map((height) => {
      // Set the tab view height to 0, so we can calculate the max tabview height, without worrying about overflows
      Css.set(tabview, 'height', '0');
      return Math.min(height, getMaxTabviewHeight(dialog, dialogBody));
    }).each((height) => {
      Css.set(tabview, 'height', height + 'px');
    });
  });
};

const getMaxTabviewHeight = (dialog: Element, dialogBody: Element) => {
  const rootElm = SelectorFind.ancestor(dialog, '.tox-dialog-wrap').getOr(dialog);
  const isFixed = Css.get(rootElm, 'position') === 'fixed';
  // Get the document or window/viewport height
  let maxHeight;
  if (isFixed) {
    maxHeight = Math.max(document.documentElement.clientHeight, window.innerHeight);
  } else {
    maxHeight = Math.max(document.documentElement.offsetHeight, document.documentElement.scrollHeight);
  }
  // Determine the max dialog body height
  const dialogChrome = dialog.dom().getBoundingClientRect().height - dialogBody.dom().getBoundingClientRect().height;
  return maxHeight - dialogChrome;
};

const getClosestTable = (cell, isRoot) => {
  return SelectorFind.ancestor(cell, 'table', isRoot);
};

const getParentTable = function (rootElm, cell) {
  return SelectorFind.ancestor(cell, 'table', Fun.curry(Compare.eq, rootElm));
};

const sketch = function (settings) {
  const dataset = convert(settings.formats, function () {
    return memMenu;
  });
  // Turn settings into a tiered menu data.

  const memMenu = Memento.record(TieredMenu.sketch({
    dom: {
      tag: 'div',
      classes: [ Styles.resolve('styles-menu') ]
    },
    components: [ ],

    // Focus causes issues when the things being focused are offscreen.
    fakeFocus: true,
    // For animations, need things to stay around in the DOM (at least until animation is done)
    stayInDom: true,

    onExecute (tmenu, item) {
      const v = Representing.getValue(item);
      settings.handle(item, v.value);
    },
    onEscape () {
    },
    onOpenMenu (container, menu) {
      const w = Width.get(container.element());
      Width.set(menu.element(), w);
      Transitioning.jumpTo(menu, 'current');
    },
    onOpenSubmenu (container, item, submenu) {
      const w = Width.get(container.element());
      const menu = SelectorFind.ancestor(item.element(), '[role="menu"]').getOrDie('hacky');
      const menuComp = container.getSystem().getByDom(menu).getOrDie();

      Width.set(submenu.element(), w);

      Transitioning.progressTo(menuComp, 'before');
      Transitioning.jumpTo(submenu, 'after');
      Transitioning.progressTo(submenu, 'current');
    },

    onCollapseMenu (container, item, menu) {
      const submenu = SelectorFind.ancestor(item.element(), '[role="menu"]').getOrDie('hacky');
      const submenuComp = container.getSystem().getByDom(submenu).getOrDie();
      Transitioning.progressTo(submenuComp, 'after');
      Transitioning.progressTo(menu, 'current');
    },

    navigateOnHover: false,

    openImmediately: true,
    data: dataset.tmenu,

    markers: {
      backgroundMenu: Styles.resolve('styles-background-menu'),
      menu: Styles.resolve('styles-menu'),
      selectedMenu: Styles.resolve('styles-selected-menu'),
      item: Styles.resolve('styles-item'),
      selectedItem: Styles.resolve('styles-selected-item')
    }
  }));

  return memMenu.asSpec();
};

const getClosestTable = function (cell, isRoot) {
  return SelectorFind.ancestor(cell, 'table', isRoot);
};