How to use the @ui5/webcomponents-react-base/lib/Event.Event.of function in @ui5/webcomponents-react-base

}, {});

    const eventMeta = getWebComponentMetadata().getEvents()[eventIdentifier] || {};

    payload = Object.keys(eventMeta).reduce((acc, val) => {
      if (val === 'detail' && e[val]) {
        return {
          ...acc,
          ...e[val]
        };
      }
      acc[val] = (e.detail && e.detail[val]) || e[val];
      return acc;
    }, payload);
    // TODO: Pass Web Component Ref in here?
    eventHandler(Event.of(null, e, payload));
  };

function onSelect(e) {
    const selectedKey = e.getParameter('selectedOption').getAttribute('data-key');
    const item = getItemByKey(selectedKey) || filterItems[0];
    onChange(Event.of(null, e.getOriginalEvent(), { selectedItem: item }));
  }

(e) => {
        if (!disabled && typeof onClick === 'function') {
          onClick(Event.of(null, e, { selectedKey: id }));
        }
      },
      [onClick, disabled, id]

(e) => {
      const selectedId = e.getParameter('item').dataset.key;
      const subSection = section.props.children
        .filter((item) => item.props && item.props.isSubSection)
        .find((item) => item.props.id === selectedId);
      if (subSection) {
        onSubSectionSelected(Event.of(null, e.getOriginalEvent(), { section, subSection, sectionIndex: index }));
      }
      closeModal();
    },
    [onSubSectionSelected, open]

(e) => {
        if (e.target.nodeName !== 'UI5-BUTTON' && e.target.nodeName !== 'UI5-ICON' && typeof onClick === 'function') {
          onClick(Event.of(null, e));
        }
      },
      [onClick]

(e) => {
      onClick(Event.of(null, e));
    },
    [onClick]

(e) => {
      const action = e.getHtmlSourceElement().dataset.action;
      onClose(Event.of(null, e, { action }));
    },
    [onClose]

rowProps.onClick = (e) => {
        if (row.isGrouped) {
          return;
        }

        row.toggleRowSelected();

        if (typeof onRowSelected === 'function') {
          onRowSelected(Event.of(null, e, { row, isSelected: !row.isSelected }));
        }

        if (selectionMode === TableSelectionMode.SINGLE_SELECT) {
          instance.selectedFlatRows.forEach(({ id }) => {
            instance.toggleRowSelected(id, false);
          });
        }
      };
      if (row.isSelected) {

(e) => {
        if (onHeaderPress) {
          onHeaderPress(Event.of(null, e));
        }
      },
      [onHeaderPress]

(event) => {
        const newSelectedKey = event.getParameter('item').dataset.key;
        const selectedItem = getItemByKey(newSelectedKey) || variantItems[0];
        setSelectedKey(newSelectedKey);
        onSelect(Event.of(null, event.getOriginalEvent(), { selectedItem }));
        if (closeOnItemSelect) {
          handleCancelButtonClick();
        }
      },
      [handleCancelButtonClick, closeOnItemSelect, selectedKey, variantItems, setSelectedKey]