On Tabs removal or tabs addition the tabs component are wrapping without showing 'show more' icon

@maslianok @dcworldwide I still face the same issue even on the latest code. Please help resolve it. I am using the Tabs Removal example. But still face this issue of tabs wrapping to new line below instead of showing the ‘…’ .

onRemoveTab = (key, evt) => {
    evt.stopPropagation();

    // current tabs
    const { items } = this.state;

    // find index to remove
    const indexToRemove = items.findIndex((tab) => tab.key === key);

    // create a new array without [indexToRemove] item
    const newTabs = [
      ...items.slice(0, indexToRemove),
      ...items.slice(indexToRemove + 1),
    ];

    const nextSelectedIndex = newTabs[indexToRemove]
      ? indexToRemove
      : indexToRemove - 1;

    if (!newTabs[nextSelectedIndex]) {
      alert("You can not delete the last tab!");
      return;
    }

      this.setState({
        items: newTabs,
        selectedTabKey: newTabs[nextSelectedIndex].key,
      });
  };

getTabs = () => {
    return dummyData.map((president, index) => ({
      key: index,
      title: president.name,
      getContent: () => president.biography,
      tabClassName: "tab-wrapper",
      tabClassName: "tab",
      panelClassName: "panel",
    }));
  };

<div className="itemRemoval__wrapper" style={{ marginTop: 120 }}>
        <Tabs
          items={this.state.items}
          selectedTabKey={this.state.selectedTabKey}
          allowRemove
          removeActiveOnly
          onRemove={this.onRemoveTab}
          transform={false}
          showMore={true}
          uid={uniqueId()}
        />
 </div>

What changes need to be done or any workaround for this issue?

I am using react: “^17.0.1” react-responsive-tabs: “^4.4.0” react-resize-detector: “^6.6.5”

I am testing on MacBook Chrome browser.

[maslianok]

@thanmaic fixed in v4.4.1

[maslianok]

There is no simple answer. You’re trying to use the library in a way it was not designed to be used. And I have no manual on what you should do to directly inject it into your codebase.