Shiny中sortable包如何实现bucket_list横竖混合布局

sortable包的bucket_list组件原生orientation参数仅支持全局设置单方向，无需修改组件源码，通过同组嵌套bucket_list+少量自定义CSS即可实现混合布局，所有拖拽交互、输入返回值逻辑和原生用法完全一致，不需要调整server端代码。
核心实现逻辑：

• 外层使用orientation = "horizontal"的bucket_list作为左右分栏的基础容器，设置统一的group_name
• 外层容器第一个元素直接放置左侧Part1的rank_list
• 外层容器第二个元素嵌套一个orientation = "vertical"的bucket_list，将Part2、Part3的rank_list放在这个嵌套容器内，嵌套容器的group_name和外层完全一致，保证跨列表拖拽完全打通
• 追加少量自定义CSS，移除嵌套bucket_list默认的边框、内边距、多余header占位，让整体视觉和单个bucket_list效果统一

library(shiny)
library(sortable)

ui <- fluidPage(
  # 自定义CSS调整嵌套容器样式，消除重复边框和多余间距
  tags$style(HTML("
    .nested-bucket {
      border: none !important;
      padding: 0 !important;
      margin: 0 !important;
      background: transparent !important;
    }
    .nested-bucket .rank-list-container {
      margin-bottom: 10px;
    }
  ")),
  
  bucket_list(
    header = "Drag the items in any desired bucket",
    group_name = "bucket_list_group", # 全局统一分组名，保证拖拽打通
    orientation = "horizontal",
    
    # 左侧单独的Part1列表
    add_rank_list(
      text = "Part1",
      labels = list("one", "two", "three"),
      input_id = "part1"
    ),
    
    # 右侧嵌套垂直方向的bucket_list，放置Part2、Part3
    bucket_list(
      group_name = "bucket_list_group", # 和外层分组名完全一致
      orientation = "vertical",
      header = NULL, # 去掉嵌套容器的头部
      class = "nested-bucket", # 追加自定义类应用样式覆盖
      
      add_rank_list(
        text = "Part2",
        labels = list("1", "2", "3"),
        input_id = "part2"
      ),
      add_rank_list(
        text = "Part3",
        labels = list("A", "B", "C"),
        input_id = "part3"
      )
    )
  ),
  verbatimTextOutput("bucket_list_res")
)

server <- function(input, output, session){
  # 服务端逻辑完全不需要修改，和原生用法一致
  output$bucket_list_res <- renderPrint(input$bucket_list_group)
}

shinyApp(ui, server)

• 布局完全符合需求：左侧单独展示Part1，右侧上下堆叠Part2、Part3
• 三个列表间拖拽完全自由，和单个bucket_list的交互没有差异
• 服务端通过input$bucket_list_group获取的排序结果结构和原写法完全一致，不需要做额外数据处理
• 如果需要调整间距、尺寸，直接修改上述CSS对应数值即可

内容的提问来源于stack exchange，提问作者szaki