How to use the rc-util/lib/Children/toArray function in rc-util

syncEllipsis() {
    const { ellipsisText, isEllipsis, expanded } = this.state;
    const { rows } = this.getEllipsis();
    const { children } = this.props;
    if (!rows || rows < 0 || !this.content || expanded) return;

    // Do not measure if css already support ellipsis
    if (this.canUseCSSEllipsis()) return;

    warning(
      toArray(children).every((child: React.ReactNode) => typeof child === 'string'),
      'Typography',
      '`ellipsis` should use string as children only.',
    );

    const { content, text, ellipsis } = measure(
      findDOMNode(this.content),
      rows,
      children,
      this.renderOperations(true),
      ELLIPSIS_STR,
    );
    if (ellipsisText !== text || isEllipsis !== ellipsis) {
      this.setState({ ellipsisText: text, ellipsisContent: content, isEllipsis: ellipsis });
    }
  }

warning(
      !labelInValue ||
        values.every(val => typeof val === 'object' && ('key' in val || 'value' in val)),
      '`value` should in shape of `{ value: string | number, label?: ReactNode }` when you set `labelInValue` to `true`',
    );

    warning(
      !multiple || Array.isArray(value),
      '`value` should be array when `mode` is `multiple` or `tags`',
    );
  }

  // Syntactic sugar should use correct children type
  if (children) {
    let invalidateChildType = null;
    toNodeArray(children).some((node: React.ReactNode) => {
      if (!React.isValidElement(node) || !node.type) {
        return false;
      }

      const { type } = node as { type: { isSelectOption?: boolean; isSelectOptGroup?: boolean } };

      if (type.isSelectOption) {
        return false;
      }
      if (type.isSelectOptGroup) {
        const allChildrenValid = toNodeArray(node.props.children).every(
          (subNode: React.ReactElement) => {
            if (
              !React.isValidElement(subNode) ||
              !node.type ||
              (subNode.type as { isSelectOption?: boolean }).isSelectOption

ellipsisContainer.setAttribute('style', originCSS);
  ellipsisContainer.style.position = 'fixed';
  ellipsisContainer.style.left = '0';
  ellipsisContainer.style.height = 'auto';
  ellipsisContainer.style.minHeight = 'auto';
  ellipsisContainer.style.maxHeight = 'auto';
  ellipsisContainer.style.top = '-999999px';
  ellipsisContainer.style.zIndex = '-1000';

  // clean up css overflow
  ellipsisContainer.style.textOverflow = 'clip';
  ellipsisContainer.style.whiteSpace = 'normal';
  (ellipsisContainer.style as any).webkitLineClamp = 'none';

  // Render in the fake container
  const contentList: React.ReactNode[] = mergeChildren(toArray(content));
  render(
    <div style="{wrapperStyle}">
      <span style="{wrapperStyle}">{contentList}</span>
      <span style="{wrapperStyle}">{fixedContent}</span>
    </div>,
    ellipsisContainer,
  ); // wrap in an div for old version react

  // Check if ellipsis in measure div is height enough for content
  function inRange() {
    return ellipsisContainer.offsetHeight &lt; maxHeight;
  }

  // Skip ellipsis if already match
  if (inRange()) {
    unmountComponentAtNode(ellipsisContainer);

clonedMenuItems = menuItems.map((item: any) => {
          if (item.type.isMenuItemGroup) {
            const children = toArray(item.props.children).map(clone);
            return React.cloneElement(item, {}, children);
          }
          return clone(item);
        });
      } else {

function filterFragment(children: any) {
  return toArray(children).map((element: any) => {
    if (React.isValidElement(element) && element.type === React.Fragment) {
      const props: any = element.props;
      return props.children;
    }
    return element;
  });
}

function flattenChildren(children: React.ReactNode): JSX.Element[] {
  if (!children) {
    return [];
  }
  return toArray(children).reduce((flatChildren: JSX.Element[], child: JSX.Element) => {
    if (child && child.type === React.Fragment) {
      return flatChildren.concat(flattenChildren(child.props.children));
    }
    flatChildren.push(child);
    return flatChildren;
  }, []);
}

function convertChildrenToColumns(children: React.ReactNode): ColumnsType {
  return toArray(children)
    .filter(node => React.isValidElement(node))
    .map(({ key, props }: React.ReactElement) => {
      const { children: nodeChildren, ...restProps } = props;
      const column = {
        key,
        ...restProps,
      };

      if (nodeChildren) {
        column.children = convertChildrenToColumns(nodeChildren);
      }

      return column;
    });
}

toNodeArray(children).some((node: React.ReactNode) => {
      if (!React.isValidElement(node) || !node.type) {
        return false;
      }

      const { type } = node as { type: { isSelectOption?: boolean; isSelectOptGroup?: boolean } };

      if (type.isSelectOption) {
        return false;
      }
      if (type.isSelectOptGroup) {
        const allChildrenValid = toNodeArray(node.props.children).every(
          (subNode: React.ReactElement) => {
            if (
              !React.isValidElement(subNode) ||
              !node.type ||
              (subNode.type as { isSelectOption?: boolean }).isSelectOption
            ) {
              return true;
            }
            invalidateChildType = subNode.type;
            return false;
          },
        );

        if (allChildrenValid) {
          return false;
        }