```jsx
const { Button } = require('../Button');

initialState = {
  bubbles: [],
  bubbleName: '',
  lastId: 1,
};

function generatebubble() {
  const bubble = { id: state.lastId, title: state.bubbleName };

  setState({
    bubbleName: '',
    bubbles: [...state.bubbles, bubble],
    lastId: state.lastId + 1,
  });
}

function handleRemove(bubble) {
  setState({ bubbles: state.bubbles.filter((b) => b.id !== bubble.id) });
}

<>
  <Button
    size="small"
    onClick={generatebubble}
    disabled={state.bubbleName.length === 0}
  >
    Add bubble
  </Button>
  <hr />

  <ListInput
    bubbles={state.bubbles}
    value={state.bubbleName}
    onChange={(value) => setState({ bubbleName: value })}
    onRemove={handleRemove}
  />
</>;
```