Как сделать всплывающую подсказку Bulma видимой, если она переполняется на родительском контейнере xa, у которого есть прокрутка на y

Question

В приведенном ниже фрагменте подсказка документа частично обрезана (вам может потребоваться изменить размер окна, чтобы его увидеть), как если бы у меня было overflow-x: hidden , и хотя у меня есть overflow-x: visible он создает прокрутку по x.

Я хочу, чтобы всплывающая подсказка была полностью видна без необходимости прокрутки по x, в то время как стиль может прокручиваться по y.

Примечания :

1 - есть похожие вопросы, но нет верного ответа.

2 - Вы можете увидеть этот JsFiddle вместо фрагмент.

<link href="https://cdn.jsdelivr.net/npm/bulma-tooltip@3.0.2/dist/css/bulma-tooltip.min.css" rel="stylesheet"/>
<link href="https://cdn.jsdelivr.net/npm/bulma@0.8.2/css/bulma.min.css" rel="stylesheet"/>
<div class="columns" style="height: 370px">

  <div class="column is-one-third">
    <nav class="panel position-relative w-100 h-100">
    
      <div class="panel-heading">
        <p>Documents</p>
      </div>
      
       <div class="panel-block is-block" style="height: 140px; overflow-x: visible; overflow-y: scroll">
         <a class="panel-block is-block">
           <span data-tooltip="This is the document number 1" class="has-tooltip-right">Document 1</span>
         </a>
         <a class="panel-block is-block">
           <span data-tooltip="This is the document number 2" class="has-tooltip-right">Document 2</span>
         </a>
         <a class="panel-block is-block">
           <span data-tooltip="This is the document number 3" class="has-tooltip-right">Document 3</span>
         </a>
         <a class="panel-block is-block">
           <span data-tooltip="This is the document number 4" class="has-tooltip-right">Document 4</span>
         </a>
         <a class="panel-block is-block">
           <span data-tooltip="This is the document number 5" class="has-tooltip-right">Document 5</span>
         </a>
       </div>
       
       <div class="panel-block is-block position-absolute fixed-bottom border-top">
         <input type="file">
       </div>
    </nav>
  </div>
  
  <div class="column is-two-thirds h-100">
    PDF viewer
  </div>
</div>