<turbo-stream action="update" target="modal">
  <template>
    
<turbo-frame data-js-modal>
  <sdoc-backdrop>
      <sdoc-modal context="move-node">
        <sdoc-modal-header data-testid="modal-header">Move &quot;Initial low-level requirement&quot;
</sdoc-modal-header>
        <sdoc-modal-container>
  <sdoc-modal-content>
    




<div
  class="move_node_tree"
  data-js-move-node-tree
  data-testid="move-node-tree"
  data-js-move-node-tree-moved-node-mid="49989bce41cd495da6f582c6721e10e2"
  data-js-move-node-tree-context-document-mid="def599776fa24fd3a31c791f15dd2f71"
  data-js-move-node-tree-endpoint="/actions/document/move_node_across_documents"
>
  <p class="move_node_tree__instructions" id="move-node-tree-instructions">
    Point to a node to choose before or after. Composite nodes and documents
    also accept the node inside them.
  </p>
  <div
    class="move_node_tree__status"
    data-js-move-node-tree-status
    role="status"
    aria-live="polite"
  ></div>
  <div
    class="move_node_tree__confirmation"
    data-js-move-node-tree-confirmation
    data-testid="move-node-confirmation"
    role="dialog"
    aria-modal="true"
    aria-labelledby="move-node-confirmation-title"
    hidden
  >
    <div class="move_node_tree__confirmation_dialog">
      <div
        class="move_node_tree__confirmation_title"
        id="move-node-confirmation-title"
      >
        Confirm move
      </div>
      <sdoc-modal-message
        class="move_node_modal_confirmation_message"
        data-js-move-node-tree-confirmation-message
        data-testid="move-node-confirmation-message"
      >
        <div
  class="move_node_confirmation_target_document"
>
  <span
    class="move_node_confirmation_message_label"
    data-js-move-node-tree-confirm-message-label
    data-testid="move-node-confirm-message-label"
  ></span>
  <span class="move_node_tree__document_icon" aria-hidden="true"><svg
  class="svg_icon"
  viewBox="0 0 16 16"
  fill="none"
  stroke="currentColor"
  stroke-width="1.5"
  stroke-linecap="round"
  stroke-linejoin="round"
>
  <path d=" M13,13 L13,8 C13,7.5 12.6,7 12,7 L9,7 C8.5,7 8,6.5 8,6 L8,3 C8,2.5 7.5,2 7,2 L4,2 C3.5,2 3,2.5 3,3 L3,13 C3,13.5 3.5,14 4,14 L12,14 C12.6,14 13,13.5 13,13 Z M13,9 L13,8 C13,7.5 13,7 12.5,6.5 L8.5,2.5 C8,2 7.5,2 7,2 L6,2"></path>
</svg></span>
  <span
    class="move_node_tree__title"
    data-js-move-node-tree-confirm-target-document-title
    data-testid="move-node-confirm-target-document-title"
    title=""
  ></span>
</div>

<div
  class="move_node_confirmation_target_node"
  data-js-move-node-tree-confirm-target-node-info
>
  <span
    class="move_node_confirmation_placement_label"
    data-js-move-node-tree-confirm-placement-label
    data-testid="move-node-confirm-placement-label"
  ></span>
  <span
    data-js-move-node-tree-confirm-target-node-type
    data-testid="move-node-confirm-target-node-type"
  >
    
      <span class="badge" text="→"></span>
    
  </span>
  <span
    class="move_node_confirmation_target_node_title"
    data-js-move-node-tree-confirm-target-node-title
    data-testid="move-node-confirm-target-node-title"
  ></span>
</div>
      </sdoc-modal-message>
      <div class="move_node_tree__confirmation_actions">
        <button
          type="button"
          class="action_button"
          data-action-type="confirm_move"
          data-js-move-node-tree-confirm
          data-testid="move-node-confirm"
        >Yes</button>
        <button
          type="button"
          class="action_button"
          data-action-type="cancel"
          data-js-move-node-tree-cancel
          data-testid="move-node-cancel"
        >Cancel</button>
      </div>
    </div>
  </div>
  <ul class="move_node_tree__list" aria-describedby="move-node-tree-instructions"><li
    class="move_node_tree__item move_node_tree__item--document"
    data-js-move-node-tree-item
    data-js-move-node-tree-node-mid="d116f5855be1454c8df559e88be18df0"
    data-js-move-node-tree-label="High-Level Requirements"
    
    data-js-move-node-tree-document
    
    
    
    
    
      data-testid="move-node-document"
    
  >
    <div
      class="move_node_tree__row"
      
        data-js-move-node-tree-target
        data-js-move-node-tree-target-mid="d116f5855be1454c8df559e88be18df0"
        data-js-move-node-tree-target-placements="child"
      
    >
      
        <button
          type="button"
          class="move_node_tree__collapse"
          data-js-move-node-tree-collapse
          aria-expanded="false"
          aria-label="Expand High-Level Requirements"
        ></button>
      

      
        <span class="move_node_tree__document_icon" aria-hidden="true"><svg
  class="svg_icon"
  viewBox="0 0 16 16"
  fill="none"
  stroke="currentColor"
  stroke-width="1.5"
  stroke-linecap="round"
  stroke-linejoin="round"
>
  <path d=" M13,13 L13,8 C13,7.5 12.6,7 12,7 L9,7 C8.5,7 8,6.5 8,6 L8,3 C8,2.5 7.5,2 7,2 L4,2 C3.5,2 3,2.5 3,3 L3,13 C3,13.5 3.5,14 4,14 L12,14 C12.6,14 13,13.5 13,13 Z M13,9 L13,8 C13,7.5 13,7 12.5,6.5 L8.5,2.5 C8,2 7.5,2 7,2 L6,2"></path>
</svg></span>
      

      <span
        class="move_node_tree__title"
        data-js-move-node-tree-title
        data-testid="move-node-title"
      >High-Level Requirements</span>
    </div>

    
      <ul
        class="move_node_tree__children"
        data-js-move-node-tree-children
        hidden
      >
        
          
  <li
    class="move_node_tree__item"
    data-js-move-node-tree-item
    data-js-move-node-tree-node-mid="815be7c5c42b419ea650df3cb73ad725"
    data-js-move-node-tree-label="Initial high-level requirement"
    data-js-move-node-tree-node-type="REQUIREMENT"
    
    
    
    
    
    
      data-testid="move-node-row"
    
  >
    <div
      class="move_node_tree__row"
      
        data-js-move-node-tree-target
        data-js-move-node-tree-target-mid="815be7c5c42b419ea650df3cb73ad725"
        data-js-move-node-tree-target-placements="before after"
      
    >
      
        <span class="move_node_tree__collapse_spacer" aria-hidden="true"></span>
      

      
        <span data-testid="move-node-type">
          
            <span class="badge" text="REQUIREMENT"></span>
          
        </span>
      

      <span
        class="move_node_tree__title"
        data-js-move-node-tree-title
        data-testid="move-node-title"
      >Initial high-level requirement</span>
    </div>

    
  </li>


        
      </ul>
    
  </li>
<li
    class="move_node_tree__item move_node_tree__item--document"
    data-js-move-node-tree-item
    data-js-move-node-tree-node-mid="def599776fa24fd3a31c791f15dd2f71"
    data-js-move-node-tree-label="Low-Level Requirements"
    
    data-js-move-node-tree-document
    
    
    
    
    
      data-testid="move-node-document"
    
  >
    <div
      class="move_node_tree__row"
      
        data-js-move-node-tree-target
        data-js-move-node-tree-target-mid="def599776fa24fd3a31c791f15dd2f71"
        data-js-move-node-tree-target-placements="child"
      
    >
      
        <button
          type="button"
          class="move_node_tree__collapse"
          data-js-move-node-tree-collapse
          aria-expanded="true"
          aria-label="Collapse Low-Level Requirements"
        ></button>
      

      
        <span class="move_node_tree__document_icon" aria-hidden="true"><svg
  class="svg_icon"
  viewBox="0 0 16 16"
  fill="none"
  stroke="currentColor"
  stroke-width="1.5"
  stroke-linecap="round"
  stroke-linejoin="round"
>
  <path d=" M13,13 L13,8 C13,7.5 12.6,7 12,7 L9,7 C8.5,7 8,6.5 8,6 L8,3 C8,2.5 7.5,2 7,2 L4,2 C3.5,2 3,2.5 3,3 L3,13 C3,13.5 3.5,14 4,14 L12,14 C12.6,14 13,13.5 13,13 Z M13,9 L13,8 C13,7.5 13,7 12.5,6.5 L8.5,2.5 C8,2 7.5,2 7,2 L6,2"></path>
</svg></span>
      

      <span
        class="move_node_tree__title"
        data-js-move-node-tree-title
        data-testid="move-node-title"
      >Low-Level Requirements</span>
    </div>

    
      <ul
        class="move_node_tree__children"
        data-js-move-node-tree-children
        
      >
        
          
  <li
    class="move_node_tree__item move_node_tree__item--moved move_node_tree__item--moved_branch"
    data-js-move-node-tree-item
    data-js-move-node-tree-node-mid="49989bce41cd495da6f582c6721e10e2"
    data-js-move-node-tree-label="Initial low-level requirement"
    data-js-move-node-tree-node-type="REQUIREMENT"
    
    data-js-move-node-tree-moved
    data-js-move-node-tree-moved-branch
    
    
    
      data-testid="move-node-row"
    
  >
    <div
      class="move_node_tree__row"
      
    >
      
        <span class="move_node_tree__collapse_spacer" aria-hidden="true"></span>
      

      
        <span data-testid="move-node-type">
          
            <span class="badge" text="REQUIREMENT"></span>
          
        </span>
      

      <span
        class="move_node_tree__title"
        data-js-move-node-tree-title
        data-testid="move-node-title"
      >Initial low-level requirement</span>
    </div>

    
  </li>


        
      </ul>
    
  </li>

  </ul>
</div>
  </sdoc-modal-content>
</sdoc-modal-container>
        <sdoc-modal-footer><button
    data-js-modal-cancel-button
    type="button"
    class="action_button"
    data-action-type="cancel"
    data-testid="form-cancel-action"
  >Close</button></sdoc-modal-footer>
      </sdoc-modal>
  </sdoc-backdrop>
</turbo-frame>
  </template>
</turbo-stream>