rails-active-ui 0.2.2 → 0.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 872e5a2ab490f5e51dfbd8e9dcd8ade657ddb2b9ede18f47519ca1761974eede
-  data.tar.gz: c3c221fd3708d5cdde7475696d5919a261a0e3f711f69a59cde430e13ea0b916
+  metadata.gz: b4d757cb8e531748c2dcde875e3cb392d48761d9ed189c27529b0f22aa6b4b14
+  data.tar.gz: dc1cb8fe68aa62b5043b8ac05c9a854d0e39109276b81dedaa6eb6b4066811d6
 SHA512:
-  metadata.gz: afd7bbad781f178f14db5a5367da062c317bd24d72e265ca899bf6e916cc86f80624f43b3ffbac0d7d5e46f352ea75ff83b79fdbce246b39d3e8017573d1e531
-  data.tar.gz: faaa7bbea4d8eaa2802f39cafaada5df565aeed7fe4708c2c251f105455caf0acdbf4701b49b73303a8b405a74fc86c517d673d0eb0368a5fccca359dc956c31
+  metadata.gz: 7b5b180f6047444c680f25dc58c0f8a576e7072b3314715595a3e71065ce45d1be09a5bbdb90daf15d362d6d6623c0856cfc2864bbde54f5340d6891666d18ae
+  data.tar.gz: 69c369de011b93a25e57ec58a0531026de888b9b393f15c56e5dac7b87eeacef1ae09bed57b2862ef420abfe54310de76f801d2c69298aacd6a111e9e3166bcb

data/app/assets/datatables.css

@@ -0,0 +1,15 @@
+/*
+ * This combined file was created by the DataTables downloader builder:
+ *   https://datatables.net/download
+ *
+ * To rebuild or modify this file with the latest versions of the included
+ * software please visit:
+ *   https://datatables.net/download/#se/jq-3.7.0/dt-2.3.7
+ *
+ * Included libraries:
+ *  jQuery 3.7.0, DataTables 2.3.7
+ */
+
+:root{--dt-row-selected: 224, 224, 224;--dt-row-selected-text: 0, 0, 0;--dt-row-selected-link: 228, 228, 228;--dt-row-stripe: 0, 0, 0;--dt-row-hover: 0, 0, 0;--dt-column-ordering: 0, 0, 0;--dt-header-align-items: center;--dt-header-vertical-align: middle;--dt-html-background: white}:root.dark{--dt-html-background: rgb(33, 37, 41)}table.dataTable tbody td.dt-control{text-align:center;cursor:pointer}table.dataTable tbody td.dt-control:before{display:inline-block;box-sizing:border-box;content:"";border-top:5px solid transparent;border-left:10px solid rgba(0, 0, 0, 0.5);border-bottom:5px solid transparent;border-right:0px solid transparent}table.dataTable tbody tr.dt-hasChild td.dt-control:before{border-top:10px solid rgba(0, 0, 0, 0.5);border-left:5px solid transparent;border-bottom:0px solid transparent;border-right:5px solid transparent}table.dataTable tfoot:empty{display:none}html.dark table.dataTable td.dt-control:before,:root[data-bs-theme=dark] table.dataTable td.dt-control:before,:root[data-theme=dark] table.dataTable td.dt-control:before{border-left-color:rgba(255, 255, 255, 0.5)}html.dark table.dataTable tr.dt-hasChild td.dt-control:before,:root[data-bs-theme=dark] table.dataTable tr.dt-hasChild td.dt-control:before,:root[data-theme=dark] table.dataTable tr.dt-hasChild td.dt-control:before{border-top-color:rgba(255, 255, 255, 0.5);border-left-color:transparent}div.dt-scroll{width:100%}div.dt-scroll-body thead tr,div.dt-scroll-body tfoot tr{height:0}div.dt-scroll-body thead tr th,div.dt-scroll-body thead tr td,div.dt-scroll-body tfoot tr th,div.dt-scroll-body tfoot tr td{height:0 !important;padding-top:0px !important;padding-bottom:0px !important;border-top-width:0px !important;border-bottom-width:0px !important}div.dt-scroll-body thead tr th div.dt-scroll-sizing,div.dt-scroll-body thead tr td div.dt-scroll-sizing,div.dt-scroll-body tfoot tr th div.dt-scroll-sizing,div.dt-scroll-body tfoot tr td div.dt-scroll-sizing{height:0 !important;overflow:hidden !important}table.dataTable thead>tr>th:active,table.dataTable thead>tr>td:active{outline:none}table.dataTable thead>tr>th.dt-orderable-asc .dt-column-order:before,table.dataTable thead>tr>th.dt-ordering-asc .dt-column-order:before,table.dataTable thead>tr>td.dt-orderable-asc .dt-column-order:before,table.dataTable thead>tr>td.dt-ordering-asc .dt-column-order:before{position:absolute;display:block;bottom:50%;content:"▲";content:"▲"/""}table.dataTable thead>tr>th.dt-orderable-desc .dt-column-order:after,table.dataTable thead>tr>th.dt-ordering-desc .dt-column-order:after,table.dataTable thead>tr>td.dt-orderable-desc .dt-column-order:after,table.dataTable thead>tr>td.dt-ordering-desc .dt-column-order:after{position:absolute;display:block;top:50%;content:"▼";content:"▼"/""}table.dataTable thead>tr>th.dt-orderable-asc .dt-column-order,table.dataTable thead>tr>th.dt-orderable-desc .dt-column-order,table.dataTable thead>tr>th.dt-ordering-asc .dt-column-order,table.dataTable thead>tr>th.dt-ordering-desc .dt-column-order,table.dataTable thead>tr>td.dt-orderable-asc .dt-column-order,table.dataTable thead>tr>td.dt-orderable-desc .dt-column-order,table.dataTable thead>tr>td.dt-ordering-asc .dt-column-order,table.dataTable thead>tr>td.dt-ordering-desc .dt-column-order{position:relative;width:12px;height:20px}table.dataTable thead>tr>th.dt-orderable-asc .dt-column-order:before,table.dataTable thead>tr>th.dt-orderable-asc .dt-column-order:after,table.dataTable thead>tr>th.dt-orderable-desc .dt-column-order:before,table.dataTable thead>tr>th.dt-orderable-desc .dt-column-order:after,table.dataTable thead>tr>th.dt-ordering-asc .dt-column-order:before,table.dataTable thead>tr>th.dt-ordering-asc .dt-column-order:after,table.dataTable thead>tr>th.dt-ordering-desc .dt-column-order:before,table.dataTable thead>tr>th.dt-ordering-desc .dt-column-order:after,table.dataTable thead>tr>td.dt-orderable-asc .dt-column-order:before,table.dataTable thead>tr>td.dt-orderable-asc .dt-column-order:after,table.dataTable thead>tr>td.dt-orderable-desc .dt-column-order:before,table.dataTable thead>tr>td.dt-orderable-desc .dt-column-order:after,table.dataTable thead>tr>td.dt-ordering-asc .dt-column-order:before,table.dataTable thead>tr>td.dt-ordering-asc .dt-column-order:after,table.dataTable thead>tr>td.dt-ordering-desc .dt-column-order:before,table.dataTable thead>tr>td.dt-ordering-desc .dt-column-order:after{left:0;opacity:.125;line-height:9px;font-size:.8em}table.dataTable thead>tr>th.dt-orderable-asc,table.dataTable thead>tr>th.dt-orderable-desc,table.dataTable thead>tr>td.dt-orderable-asc,table.dataTable thead>tr>td.dt-orderable-desc{cursor:pointer}table.dataTable thead>tr>th.dt-orderable-asc:hover,table.dataTable thead>tr>th.dt-orderable-desc:hover,table.dataTable thead>tr>td.dt-orderable-asc:hover,table.dataTable thead>tr>td.dt-orderable-desc:hover{outline:2px solid rgba(0, 0, 0, 0.05);outline-offset:-2px}table.dataTable thead>tr>th.dt-ordering-asc .dt-column-order:before,table.dataTable thead>tr>th.dt-ordering-desc .dt-column-order:after,table.dataTable thead>tr>td.dt-ordering-asc .dt-column-order:before,table.dataTable thead>tr>td.dt-ordering-desc .dt-column-order:after{opacity:.6}table.dataTable thead>tr>th.dt-orderable-none:not(.dt-ordering-asc,.dt-ordering-desc) .dt-column-order:empty,table.dataTable thead>tr>th.sorting_desc_disabled .dt-column-order:after,table.dataTable thead>tr>th.sorting_asc_disabled .dt-column-order:before,table.dataTable thead>tr>td.dt-orderable-none:not(.dt-ordering-asc,.dt-ordering-desc) .dt-column-order:empty,table.dataTable thead>tr>td.sorting_desc_disabled .dt-column-order:after,table.dataTable thead>tr>td.sorting_asc_disabled .dt-column-order:before{display:none}table.dataTable thead>tr>th:active,table.dataTable thead>tr>td:active{outline:none}table.dataTable thead>tr>th div.dt-column-header,table.dataTable thead>tr>th div.dt-column-footer,table.dataTable thead>tr>td div.dt-column-header,table.dataTable thead>tr>td div.dt-column-footer,table.dataTable tfoot>tr>th div.dt-column-header,table.dataTable tfoot>tr>th div.dt-column-footer,table.dataTable tfoot>tr>td div.dt-column-header,table.dataTable tfoot>tr>td div.dt-column-footer{display:flex;justify-content:space-between;align-items:var(--dt-header-align-items);gap:4px}table.dataTable thead>tr>th div.dt-column-header .dt-column-title,table.dataTable thead>tr>th div.dt-column-footer .dt-column-title,table.dataTable thead>tr>td div.dt-column-header .dt-column-title,table.dataTable thead>tr>td div.dt-column-footer .dt-column-title,table.dataTable tfoot>tr>th div.dt-column-header .dt-column-title,table.dataTable tfoot>tr>th div.dt-column-footer .dt-column-title,table.dataTable tfoot>tr>td div.dt-column-header .dt-column-title,table.dataTable tfoot>tr>td div.dt-column-footer .dt-column-title{flex-grow:1}table.dataTable thead>tr>th div.dt-column-header .dt-column-title:empty,table.dataTable thead>tr>th div.dt-column-footer .dt-column-title:empty,table.dataTable thead>tr>td div.dt-column-header .dt-column-title:empty,table.dataTable thead>tr>td div.dt-column-footer .dt-column-title:empty,table.dataTable tfoot>tr>th div.dt-column-header .dt-column-title:empty,table.dataTable tfoot>tr>th div.dt-column-footer .dt-column-title:empty,table.dataTable tfoot>tr>td div.dt-column-header .dt-column-title:empty,table.dataTable tfoot>tr>td div.dt-column-footer .dt-column-title:empty{display:none}div.dt-scroll-body>table.dataTable>thead>tr>th,div.dt-scroll-body>table.dataTable>thead>tr>td{overflow:hidden}:root.dark table.dataTable thead>tr>th.dt-orderable-asc:hover,:root.dark table.dataTable thead>tr>th.dt-orderable-desc:hover,:root.dark table.dataTable thead>tr>td.dt-orderable-asc:hover,:root.dark table.dataTable thead>tr>td.dt-orderable-desc:hover,:root[data-bs-theme=dark] table.dataTable thead>tr>th.dt-orderable-asc:hover,:root[data-bs-theme=dark] table.dataTable thead>tr>th.dt-orderable-desc:hover,:root[data-bs-theme=dark] table.dataTable thead>tr>td.dt-orderable-asc:hover,:root[data-bs-theme=dark] table.dataTable thead>tr>td.dt-orderable-desc:hover{outline:2px solid rgba(255, 255, 255, 0.05)}div.dt-processing{position:absolute;top:50%;left:50%;width:200px;margin-left:-100px;margin-top:-22px;text-align:center;padding:2px;z-index:10}div.dt-processing>div:last-child{position:relative;width:80px;height:15px;margin:1em auto}div.dt-processing>div:last-child>div{position:absolute;top:0;width:13px;height:13px;border-radius:50%;background:rgb(224, 224, 224);background:rgb(var(--dt-row-selected));animation-timing-function:cubic-bezier(0, 1, 1, 0)}div.dt-processing>div:last-child>div:nth-child(1){left:8px;animation:datatables-loader-1 .6s infinite}div.dt-processing>div:last-child>div:nth-child(2){left:8px;animation:datatables-loader-2 .6s infinite}div.dt-processing>div:last-child>div:nth-child(3){left:32px;animation:datatables-loader-2 .6s infinite}div.dt-processing>div:last-child>div:nth-child(4){left:56px;animation:datatables-loader-3 .6s infinite}@keyframes datatables-loader-1{0%{transform:scale(0)}100%{transform:scale(1)}}@keyframes datatables-loader-3{0%{transform:scale(1)}100%{transform:scale(0)}}@keyframes datatables-loader-2{0%{transform:translate(0, 0)}100%{transform:translate(24px, 0)}}table.dataTable.ui.table.nowrap th,table.dataTable.ui.table.nowrap td{white-space:nowrap}table.dataTable.ui.table th,table.dataTable.ui.table td{box-sizing:border-box}table.dataTable.ui.table th.dt-type-numeric,table.dataTable.ui.table th.dt-type-date,table.dataTable.ui.table td.dt-type-numeric,table.dataTable.ui.table td.dt-type-date{text-align:right}table.dataTable.ui.table th.dt-type-numeric div.dt-column-header,table.dataTable.ui.table th.dt-type-numeric div.dt-column-footer,table.dataTable.ui.table th.dt-type-date div.dt-column-header,table.dataTable.ui.table th.dt-type-date div.dt-column-footer,table.dataTable.ui.table td.dt-type-numeric div.dt-column-header,table.dataTable.ui.table td.dt-type-numeric div.dt-column-footer,table.dataTable.ui.table td.dt-type-date div.dt-column-header,table.dataTable.ui.table td.dt-type-date div.dt-column-footer{flex-direction:row-reverse}table.dataTable.ui.table th.dt-left,table.dataTable.ui.table td.dt-left{text-align:left}table.dataTable.ui.table th.dt-left div.dt-column-header,table.dataTable.ui.table th.dt-left div.dt-column-footer,table.dataTable.ui.table td.dt-left div.dt-column-header,table.dataTable.ui.table td.dt-left div.dt-column-footer{flex-direction:row}table.dataTable.ui.table th.dt-center,table.dataTable.ui.table td.dt-center{text-align:center}table.dataTable.ui.table th.dt-right,table.dataTable.ui.table td.dt-right{text-align:right}table.dataTable.ui.table th.dt-right div.dt-column-header,table.dataTable.ui.table th.dt-right div.dt-column-footer,table.dataTable.ui.table td.dt-right div.dt-column-header,table.dataTable.ui.table td.dt-right div.dt-column-footer{flex-direction:row-reverse}table.dataTable.ui.table th.dt-justify,table.dataTable.ui.table td.dt-justify{text-align:justify}table.dataTable.ui.table th.dt-justify div.dt-column-header,table.dataTable.ui.table th.dt-justify div.dt-column-footer,table.dataTable.ui.table td.dt-justify div.dt-column-header,table.dataTable.ui.table td.dt-justify div.dt-column-footer{flex-direction:row}table.dataTable.ui.table th.dt-nowrap,table.dataTable.ui.table td.dt-nowrap{white-space:nowrap}table.dataTable.ui.table th.dt-empty,table.dataTable.ui.table td.dt-empty{text-align:center;vertical-align:top}table.dataTable.ui.table thead th,table.dataTable.ui.table thead td,table.dataTable.ui.table tfoot th,table.dataTable.ui.table tfoot td{text-align:left;vertical-align:var(--dt-header-vertical-align)}table.dataTable.ui.table thead th.dt-head-left,table.dataTable.ui.table thead td.dt-head-left,table.dataTable.ui.table tfoot th.dt-head-left,table.dataTable.ui.table tfoot td.dt-head-left{text-align:left}table.dataTable.ui.table thead th.dt-head-left div.dt-column-header,table.dataTable.ui.table thead th.dt-head-left div.dt-column-footer,table.dataTable.ui.table thead td.dt-head-left div.dt-column-header,table.dataTable.ui.table thead td.dt-head-left div.dt-column-footer,table.dataTable.ui.table tfoot th.dt-head-left div.dt-column-header,table.dataTable.ui.table tfoot th.dt-head-left div.dt-column-footer,table.dataTable.ui.table tfoot td.dt-head-left div.dt-column-header,table.dataTable.ui.table tfoot td.dt-head-left div.dt-column-footer{flex-direction:row}table.dataTable.ui.table thead th.dt-head-center,table.dataTable.ui.table thead td.dt-head-center,table.dataTable.ui.table tfoot th.dt-head-center,table.dataTable.ui.table tfoot td.dt-head-center{text-align:center}table.dataTable.ui.table thead th.dt-head-right,table.dataTable.ui.table thead td.dt-head-right,table.dataTable.ui.table tfoot th.dt-head-right,table.dataTable.ui.table tfoot td.dt-head-right{text-align:right}table.dataTable.ui.table thead th.dt-head-right div.dt-column-header,table.dataTable.ui.table thead th.dt-head-right div.dt-column-footer,table.dataTable.ui.table thead td.dt-head-right div.dt-column-header,table.dataTable.ui.table thead td.dt-head-right div.dt-column-footer,table.dataTable.ui.table tfoot th.dt-head-right div.dt-column-header,table.dataTable.ui.table tfoot th.dt-head-right div.dt-column-footer,table.dataTable.ui.table tfoot td.dt-head-right div.dt-column-header,table.dataTable.ui.table tfoot td.dt-head-right div.dt-column-footer{flex-direction:row-reverse}table.dataTable.ui.table thead th.dt-head-justify,table.dataTable.ui.table thead td.dt-head-justify,table.dataTable.ui.table tfoot th.dt-head-justify,table.dataTable.ui.table tfoot td.dt-head-justify{text-align:justify}table.dataTable.ui.table thead th.dt-head-justify div.dt-column-header,table.dataTable.ui.table thead th.dt-head-justify div.dt-column-footer,table.dataTable.ui.table thead td.dt-head-justify div.dt-column-header,table.dataTable.ui.table thead td.dt-head-justify div.dt-column-footer,table.dataTable.ui.table tfoot th.dt-head-justify div.dt-column-header,table.dataTable.ui.table tfoot th.dt-head-justify div.dt-column-footer,table.dataTable.ui.table tfoot td.dt-head-justify div.dt-column-header,table.dataTable.ui.table tfoot td.dt-head-justify div.dt-column-footer{flex-direction:row}table.dataTable.ui.table thead th.dt-head-nowrap,table.dataTable.ui.table thead td.dt-head-nowrap,table.dataTable.ui.table tfoot th.dt-head-nowrap,table.dataTable.ui.table tfoot td.dt-head-nowrap{white-space:nowrap}table.dataTable.ui.table tbody th.dt-body-left,table.dataTable.ui.table tbody td.dt-body-left{text-align:left}table.dataTable.ui.table tbody th.dt-body-center,table.dataTable.ui.table tbody td.dt-body-center{text-align:center}table.dataTable.ui.table tbody th.dt-body-right,table.dataTable.ui.table tbody td.dt-body-right{text-align:right}table.dataTable.ui.table tbody th.dt-body-justify,table.dataTable.ui.table tbody td.dt-body-justify{text-align:justify}table.dataTable.ui.table tbody th.dt-body-nowrap,table.dataTable.ui.table tbody td.dt-body-nowrap{white-space:nowrap}table.dataTable.table{margin:0}table.dataTable.table.ui.striped>tbody>tr:nth-child(2n){background-color:transparent}table.dataTable.table>tbody>tr{background-color:transparent}table.dataTable.table>tbody>tr.selected>*{box-shadow:inset 0 0 0 9999px rgb(224, 224, 224);box-shadow:inset 0 0 0 9999px rgb(var(--dt-row-selected));color:rgb(0, 0, 0);color:rgb(var(--dt-row-selected-text))}table.dataTable.table>tbody>tr.selected a{color:rgb(228, 228, 228);color:rgb(var(--dt-row-selected-link))}table.dataTable.table.striped>tbody>tr:nth-child(2n)>*{box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-stripe), 0.02)}table.dataTable.table.striped>tbody>tr:nth-child(2n).selected>*{box-shadow:inset 0 0 0 9999px rgba(224, 224, 224, 0.92);box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.92)}table.dataTable.table.hover>tbody>tr:hover>*{box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.05)}table.dataTable.table.hover>tbody>tr.selected:hover>*{box-shadow:inset 0 0 0 9999px rgba(224, 224, 224, 0.95);box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.95)}table.dataTable.table>thead>tr>td{text-align:inherit;color:rgba(0, 0, 0, 0.87);padding:.5em .78571429em;vertical-align:inherit;font-style:none;text-transform:none;border-bottom:1px solid rgba(34, 36, 38, 0.1)}table.dataTable.table.celled>thead>tr>td:not(:first-child){border-left:1px solid rgba(34, 36, 38, 0.1)}:root{--dt-row-selected: 224, 224, 224;--dt-row-selected-text: 0, 0, 0;--dt-row-selected-link: 228, 228, 228;--dt-row-stripe: 0, 0, 0;--dt-row-hover: 0, 0, 0;--dt-column-ordering: 0, 0, 0;--dt-header-align-items: center;--dt-header-vertical-align: middle;--dt-html-background: white}:root.dark{--dt-html-background: rgb(33, 37, 41)}table.dataTable tbody td.dt-control{text-align:center;cursor:pointer}table.dataTable tbody td.dt-control:before{display:inline-block;box-sizing:border-box;content:"";border-top:5px solid transparent;border-left:10px solid rgba(0, 0, 0, 0.5);border-bottom:5px solid transparent;border-right:0px solid transparent}table.dataTable tbody tr.dt-hasChild td.dt-control:before{border-top:10px solid rgba(0, 0, 0, 0.5);border-left:5px solid transparent;border-bottom:0px solid transparent;border-right:5px solid transparent}table.dataTable tfoot:empty{display:none}html.dark table.dataTable td.dt-control:before,:root[data-bs-theme=dark] table.dataTable td.dt-control:before,:root[data-theme=dark] table.dataTable td.dt-control:before{border-left-color:rgba(255, 255, 255, 0.5)}html.dark table.dataTable tr.dt-hasChild td.dt-control:before,:root[data-bs-theme=dark] table.dataTable tr.dt-hasChild td.dt-control:before,:root[data-theme=dark] table.dataTable tr.dt-hasChild td.dt-control:before{border-top-color:rgba(255, 255, 255, 0.5);border-left-color:transparent}div.dt-scroll{width:100%}div.dt-scroll-body thead tr,div.dt-scroll-body tfoot tr{height:0}div.dt-scroll-body thead tr th,div.dt-scroll-body thead tr td,div.dt-scroll-body tfoot tr th,div.dt-scroll-body tfoot tr td{height:0 !important;padding-top:0px !important;padding-bottom:0px !important;border-top-width:0px !important;border-bottom-width:0px !important}div.dt-scroll-body thead tr th div.dt-scroll-sizing,div.dt-scroll-body thead tr td div.dt-scroll-sizing,div.dt-scroll-body tfoot tr th div.dt-scroll-sizing,div.dt-scroll-body tfoot tr td div.dt-scroll-sizing{height:0 !important;overflow:hidden !important}table.dataTable thead>tr>th:active,table.dataTable thead>tr>td:active{outline:none}table.dataTable thead>tr>th.dt-orderable-asc .dt-column-order:before,table.dataTable thead>tr>th.dt-ordering-asc .dt-column-order:before,table.dataTable thead>tr>td.dt-orderable-asc .dt-column-order:before,table.dataTable thead>tr>td.dt-ordering-asc .dt-column-order:before{position:absolute;display:block;bottom:50%;content:"▲";content:"▲"/""}table.dataTable thead>tr>th.dt-orderable-desc .dt-column-order:after,table.dataTable thead>tr>th.dt-ordering-desc .dt-column-order:after,table.dataTable thead>tr>td.dt-orderable-desc .dt-column-order:after,table.dataTable thead>tr>td.dt-ordering-desc .dt-column-order:after{position:absolute;display:block;top:50%;content:"▼";content:"▼"/""}table.dataTable thead>tr>th.dt-orderable-asc .dt-column-order,table.dataTable thead>tr>th.dt-orderable-desc .dt-column-order,table.dataTable thead>tr>th.dt-ordering-asc .dt-column-order,table.dataTable thead>tr>th.dt-ordering-desc .dt-column-order,table.dataTable thead>tr>td.dt-orderable-asc .dt-column-order,table.dataTable thead>tr>td.dt-orderable-desc .dt-column-order,table.dataTable thead>tr>td.dt-ordering-asc .dt-column-order,table.dataTable thead>tr>td.dt-ordering-desc .dt-column-order{position:relative;width:12px;height:20px}table.dataTable thead>tr>th.dt-orderable-asc .dt-column-order:before,table.dataTable thead>tr>th.dt-orderable-asc .dt-column-order:after,table.dataTable thead>tr>th.dt-orderable-desc .dt-column-order:before,table.dataTable thead>tr>th.dt-orderable-desc .dt-column-order:after,table.dataTable thead>tr>th.dt-ordering-asc .dt-column-order:before,table.dataTable thead>tr>th.dt-ordering-asc .dt-column-order:after,table.dataTable thead>tr>th.dt-ordering-desc .dt-column-order:before,table.dataTable thead>tr>th.dt-ordering-desc .dt-column-order:after,table.dataTable thead>tr>td.dt-orderable-asc .dt-column-order:before,table.dataTable thead>tr>td.dt-orderable-asc .dt-column-order:after,table.dataTable thead>tr>td.dt-orderable-desc .dt-column-order:before,table.dataTable thead>tr>td.dt-orderable-desc .dt-column-order:after,table.dataTable thead>tr>td.dt-ordering-asc .dt-column-order:before,table.dataTable thead>tr>td.dt-ordering-asc .dt-column-order:after,table.dataTable thead>tr>td.dt-ordering-desc .dt-column-order:before,table.dataTable thead>tr>td.dt-ordering-desc .dt-column-order:after{left:0;opacity:.125;line-height:9px;font-size:.8em}table.dataTable thead>tr>th.dt-orderable-asc,table.dataTable thead>tr>th.dt-orderable-desc,table.dataTable thead>tr>td.dt-orderable-asc,table.dataTable thead>tr>td.dt-orderable-desc{cursor:pointer}table.dataTable thead>tr>th.dt-orderable-asc:hover,table.dataTable thead>tr>th.dt-orderable-desc:hover,table.dataTable thead>tr>td.dt-orderable-asc:hover,table.dataTable thead>tr>td.dt-orderable-desc:hover{outline:2px solid rgba(0, 0, 0, 0.05);outline-offset:-2px}table.dataTable thead>tr>th.dt-ordering-asc .dt-column-order:before,table.dataTable thead>tr>th.dt-ordering-desc .dt-column-order:after,table.dataTable thead>tr>td.dt-ordering-asc .dt-column-order:before,table.dataTable thead>tr>td.dt-ordering-desc .dt-column-order:after{opacity:.6}table.dataTable thead>tr>th.dt-orderable-none:not(.dt-ordering-asc,.dt-ordering-desc) .dt-column-order:empty,table.dataTable thead>tr>th.sorting_desc_disabled .dt-column-order:after,table.dataTable thead>tr>th.sorting_asc_disabled .dt-column-order:before,table.dataTable thead>tr>td.dt-orderable-none:not(.dt-ordering-asc,.dt-ordering-desc) .dt-column-order:empty,table.dataTable thead>tr>td.sorting_desc_disabled .dt-column-order:after,table.dataTable thead>tr>td.sorting_asc_disabled .dt-column-order:before{display:none}table.dataTable thead>tr>th:active,table.dataTable thead>tr>td:active{outline:none}table.dataTable thead>tr>th div.dt-column-header,table.dataTable thead>tr>th div.dt-column-footer,table.dataTable thead>tr>td div.dt-column-header,table.dataTable thead>tr>td div.dt-column-footer,table.dataTable tfoot>tr>th div.dt-column-header,table.dataTable tfoot>tr>th div.dt-column-footer,table.dataTable tfoot>tr>td div.dt-column-header,table.dataTable tfoot>tr>td div.dt-column-footer{display:flex;justify-content:space-between;align-items:var(--dt-header-align-items);gap:4px}table.dataTable thead>tr>th div.dt-column-header .dt-column-title,table.dataTable thead>tr>th div.dt-column-footer .dt-column-title,table.dataTable thead>tr>td div.dt-column-header .dt-column-title,table.dataTable thead>tr>td div.dt-column-footer .dt-column-title,table.dataTable tfoot>tr>th div.dt-column-header .dt-column-title,table.dataTable tfoot>tr>th div.dt-column-footer .dt-column-title,table.dataTable tfoot>tr>td div.dt-column-header .dt-column-title,table.dataTable tfoot>tr>td div.dt-column-footer .dt-column-title{flex-grow:1}table.dataTable thead>tr>th div.dt-column-header .dt-column-title:empty,table.dataTable thead>tr>th div.dt-column-footer .dt-column-title:empty,table.dataTable thead>tr>td div.dt-column-header .dt-column-title:empty,table.dataTable thead>tr>td div.dt-column-footer .dt-column-title:empty,table.dataTable tfoot>tr>th div.dt-column-header .dt-column-title:empty,table.dataTable tfoot>tr>th div.dt-column-footer .dt-column-title:empty,table.dataTable tfoot>tr>td div.dt-column-header .dt-column-title:empty,table.dataTable tfoot>tr>td div.dt-column-footer .dt-column-title:empty{display:none}div.dt-scroll-body>table.dataTable>thead>tr>th,div.dt-scroll-body>table.dataTable>thead>tr>td{overflow:hidden}:root.dark table.dataTable thead>tr>th.dt-orderable-asc:hover,:root.dark table.dataTable thead>tr>th.dt-orderable-desc:hover,:root.dark table.dataTable thead>tr>td.dt-orderable-asc:hover,:root.dark table.dataTable thead>tr>td.dt-orderable-desc:hover,:root[data-bs-theme=dark] table.dataTable thead>tr>th.dt-orderable-asc:hover,:root[data-bs-theme=dark] table.dataTable thead>tr>th.dt-orderable-desc:hover,:root[data-bs-theme=dark] table.dataTable thead>tr>td.dt-orderable-asc:hover,:root[data-bs-theme=dark] table.dataTable thead>tr>td.dt-orderable-desc:hover{outline:2px solid rgba(255, 255, 255, 0.05)}div.dt-container div.dt-layout-row{display:flex;justify-content:space-between;align-items:center;width:100%;margin:.75em 0}div.dt-container div.dt-layout-row div.dt-layout-cell{display:flex;justify-content:space-between;align-items:center}div.dt-container div.dt-layout-row div.dt-layout-cell.dt-layout-start{justify-content:flex-start;margin-right:auto}div.dt-container div.dt-layout-row div.dt-layout-cell.dt-layout-end{justify-content:flex-end;margin-left:auto}div.dt-container div.dt-layout-row div.dt-layout-cell:empty{display:none}@media screen and (max-width: 767px){div.dt-container div.dt-layout-row:not(.dt-layout-table){display:block}div.dt-container div.dt-layout-row:not(.dt-layout-table) div.dt-layout-cell{display:block;text-align:center}div.dt-container div.dt-layout-row:not(.dt-layout-table) div.dt-layout-cell>*{margin:.5em 0}div.dt-container div.dt-layout-row:not(.dt-layout-table) div.dt-layout-cell.dt-layout-start{margin-right:0}div.dt-container div.dt-layout-row:not(.dt-layout-table) div.dt-layout-cell.dt-layout-end{margin-left:0}}div.dt-container div.dt-layout-start>*:not(:last-child){margin-right:1em}div.dt-container div.dt-layout-end>*:not(:first-child){margin-left:1em}div.dt-container div.dt-layout-full{width:100%}div.dt-container div.dt-layout-full>*:only-child{margin-left:auto;margin-right:auto}div.dt-container div.dt-layout-table>div{display:block !important}@media screen and (max-width: 767px){div.dt-container div.dt-layout-start>*:not(:last-child){margin-right:0}div.dt-container div.dt-layout-end>*:not(:first-child){margin-left:0}}div.dt-container.dt-semanticUI{position:relative}div.dt-container.dt-semanticUI>div.row{display:flex;padding-top:.5rem;padding-bottom:.5rem}div.dt-container.dt-semanticUI>div.row:first-child{padding-top:1rem}div.dt-container.dt-semanticUI>div.row:last-child{padding-bottom:1rem}div.dt-container.dt-semanticUI div.dt-length select{vertical-align:middle;min-height:2.7142em}div.dt-container.dt-semanticUI div.dt-length .ui.selection.dropdown{min-width:0}div.dt-container.dt-semanticUI div.dt-search span.input{margin-left:.5em}div.dt-container.dt-semanticUI div.dt-info{white-space:nowrap}div.dt-container.dt-semanticUI div.dt-processing{position:absolute;top:50%;left:50%;width:200px;margin-left:-100px;text-align:center}div.dt-container.dt-semanticUI div.dt-scroll{width:100%;padding:0}div.dt-container.dt-semanticUI div.dt-scroll-head table.dataTable{border-bottom-right-radius:0;border-bottom-left-radius:0;border-bottom:none}div.dt-container.dt-semanticUI div.dt-scroll-body thead .dt-orderable-asc:before,div.dt-container.dt-semanticUI div.dt-scroll-body thead .dt-orderable-desc:after{display:none}div.dt-container.dt-semanticUI div.dt-scroll-body table.dataTable{border-radius:0;border-top:none;border-bottom-width:0}div.dt-container.dt-semanticUI div.dt-scroll-body table.dataTable.no-footer{border-bottom-width:1px}div.dt-container.dt-semanticUI div.dt-scroll-foot table.dataTable{border-top-right-radius:0;border-top-left-radius:0;border-top:none}@media screen and (max-width: 767px){div.dt-container div.left,div.dt-container div.right{text-align:center !important}}
+
+

data/app/assets/stylesheets.css

@@ -73552,4 +73552,8 @@ body.pushable > .pusher {
   100% {
     background-color: #fcfcfd;
   }
-}
+}
+
+.padding {
+  padding: 1rem;
+}

data/app/blocks/resource_list_block.rb

@@ -0,0 +1,153 @@
+# frozen_string_literal: true
+
+# ResourceListBlock — a searchable, scrollable list panel for any resource.
+#
+# Composes Header, Input, Button, and turbo-framed partial iteration into
+# a single reusable block. Designed for sidebar/master-list patterns where
+# a Ransack search filters a collection rendered via a per-item partial.
+#
+# Usage:
+#   ResourceListBlock(
+#     heading:          "Notes",
+#     search_url:       notes_path,
+#     search_query:     @q,
+#     search_predicate: "title_cont",
+#     resources:        @notes,
+#     item_partial:     "notes/note_card",
+#     item_local:       "note",
+#     new_path:         new_note_path,
+#     turbo_frame:      "notes-list",
+#     id:               "item-list-panel"
+#   )
+#
+# The search section is omitted when search_query is nil.
+# The "new" button is omitted when new_path is nil.
+# The list is wrapped in a turbo frame when turbo_frame is provided.
+#
+# For auto-submit / live-search behaviour, pass Stimulus wiring via
+# search_form_data:
+#
+#   ResourceListBlock(
+#     ...,
+#     search_form_data: {
+#       controller:  "auto-submit",
+#       action:      "input->auto-submit#submit",
+#       turbo_frame: "notes-list"
+#     }
+#   )
+#
+# HTML structure (all sections wrapped for predictable styling):
+#
+#   div.resource-list-block
+#     div.resource-list-header
+#       [HStack with heading + button]
+#     div.resource-list-search
+#       [search_form_for with Input]
+#     turbo-frame (optional)
+#       div.resource-list-items
+#         [rendered partials]
+
+class ResourceListBlock < Component
+  attribute :heading,            :string,  default: nil
+  attribute :search_url,                   default: nil
+  attribute :search_query,                 default: nil
+  attribute :search_predicate,   :string,  default: "title_cont"
+  attribute :search_placeholder, :string,  default: "Search\u2026"
+  attribute :search_form_data,             default: nil
+  attribute :new_path,           :string,  default: nil
+  attribute :resources,                    default: nil
+  attribute :item_partial,       :string,  default: nil
+  attribute :item_local,         :string,  default: "resource"
+  attribute :turbo_frame,        :string,  default: nil
+
+  def to_s
+    tag.div(**merge_html_options(class: "resource-list-block")) {
+      safe_join([
+        render_header,
+        render_search,
+        render_list,
+        @content
+      ])
+    }
+  end
+
+  private
+
+  # ── Header ──────────────────────────────────────────────────────────
+  # Heading text on the left, optional "new" button on the right.
+
+  def render_header
+    return if heading.nil? && new_path.nil?
+
+    heading_html = heading ? render_component(HeaderComponent, size: :h3) { heading } : nil
+    button_html = new_path ? render_component(ButtonComponent, href: new_path, size: :mini, icon: "plus", variant: :primary) : nil
+
+    tag.div(class: "resource-list-header") {
+      render_component(HStackComponent, spacing: 8, justify: "between", align: "center") {
+        safe_join([ heading_html, button_html ])
+      }
+    }
+  end
+
+  # ── Search ──────────────────────────────────────────────────────────
+  # Ransack search_form_for wrapping an Input. Omitted when search_query
+  # is nil. The form targets the turbo frame so only the list refreshes.
+
+  def render_search
+    return if search_query.nil?
+
+    form_html_opts = { class: "ui form" }
+    form_data = build_search_form_data
+    form_html_opts[:data] = form_data if form_data.present?
+
+    search_value = search_query.try(search_predicate)
+
+    tag.div(class: "resource-list-search") {
+      @view_context.search_form_for(search_query, url: search_url, html: form_html_opts) {
+        InputComponent.new(
+          fluid:       true,
+          icon:        "search",
+          placeholder: search_placeholder,
+          name:        "q[#{search_predicate}]",
+          value:       search_value
+        ).render_in(@view_context)
+      }
+    }
+  end
+
+  # ── List ────────────────────────────────────────────────────────────
+  # Iterates resources and renders the item partial for each one.
+  # Optionally wrapped in a turbo frame for scoped replacement.
+
+  def render_list
+    items = tag.div(class: "resource-list-items") {
+      safe_join(
+        Array(resources).map { |resource|
+          @view_context.render(partial: item_partial, locals: { item_local.to_sym => resource })
+        }
+      )
+    }
+
+    if turbo_frame
+      @view_context.turbo_frame_tag(turbo_frame) { items }
+    else
+      items
+    end
+  end
+
+  # ── Helpers ─────────────────────────────────────────────────────────
+
+  def render_component(klass, **kwargs, &block)
+    klass.new(**kwargs).render_in(@view_context, &block)
+  end
+
+  def build_search_form_data
+    data = (search_form_data || {}).dup
+    # When a turbo frame is configured and the consumer hasn't explicitly
+    # set a turbo_frame on the form, default to targeting the list frame.
+    if turbo_frame && !data.key?(:turbo_frame)
+      data[:turbo_frame] = turbo_frame
+    end
+    data
+  end
+end

data/app/components/back_button_component.rb

@@ -0,0 +1,34 @@
+# frozen_string_literal: true
+
+# BackButton - link that restores Turbo history when possible.
+#
+# Usage:
+#   BackButton(href: "/dashboard")
+#   BackButton(href: "/notes", icon: "arrow left")
+
+class BackButtonComponent < Component
+  attribute :href,         :string, default: "#"
+  attribute :label,        :string, default: "Back"
+  attribute :icon,         :string, default: nil
+  attribute :css_class,    :string, default: "item"
+  attribute :controller,   :string, default: "navigation"
+  attribute :action,       :string, default: "navigation#back"
+  attribute :turbo_action, :string, default: "replace"
+
+  def to_s
+    icon_el = icon ? tag.i(class: "#{icon} icon") : nil
+    content = @content.presence || ERB::Util.html_escape(label)
+
+    tag.a(
+      **merge_html_options(
+        href: href,
+        class: css_class,
+        data: {
+          controller: controller,
+          action: action,
+          turbo_action: turbo_action
+        }
+      )
+    ) { safe_join([ icon_el, content ]) }
+  end
+end

data/app/components/button_component.rb

@@ -40,10 +40,12 @@ class ButtonComponent < Component
     icon_el = icon ? tag.i(class: "#{icon} icon") : nil
     content = safe_join([ icon_el, @content ])
 
+    opts = merge_html_options(class: classes)
+
     if href
-      tag.a(class: classes, href: href) { content }
+      tag.a(**opts, href: href) { content }
     else
-      tag.button(class: classes, type: type) { content }
+      tag.button(**opts, type: type) { content }
     end
   end
 end

data/app/components/button_to_component.rb

@@ -31,13 +31,12 @@ class ButtonToComponent < Component
       "button"
     )
 
-    form_opts = { method: method.to_sym }
-    form_opts[:data] = { turbo_confirm: confirm } if confirm
+    html_opts = { method: method.to_sym }
+    html_opts[:form] = { data: { turbo_confirm: confirm } } if confirm
 
     @view_context.button_to(
       url,
-      form: form_opts,
-      class: classes
+      html_opts.merge(class: classes)
     ) { @content }
   end
 end

data/app/components/column_component.rb

@@ -40,7 +40,7 @@ class ColumnComponent < Component
       "column"
     ].compact.join(" ")
 
-    tag.div(class: classes) { @content }
+    tag.div(**merge_html_options(class: classes)) { @content }
   end
 
   private

data/app/components/container_component.rb

@@ -18,6 +18,6 @@ class ContainerComponent < Component
       "container"
     )
 
-    tag.div(class: classes) { @content }
+    tag.div(**merge_html_options(class: classes)) { @content }
   end
 end

data/app/components/dropdown_component.rb

@@ -26,6 +26,7 @@ class DropdownComponent < Component
   attribute :labeled,       :boolean, default: false
   attribute :loading,       :boolean, default: false
   attribute :disabled,      :boolean, default: false
+  attribute :action,        :string,  default: nil
 
   def to_s
     classes = class_names(
@@ -41,13 +42,18 @@ class DropdownComponent < Component
 
     data = { controller: "fui-dropdown" }
     data[:fui_dropdown_clearable_value] = "true" if clearable
-    data[:fui_dropdown_placeholder_value] = placeholder if placeholder
+    data[:fui_dropdown_placeholder_value] = placeholder if placeholder && !inline
+    data[:fui_dropdown_action_value] = action if action
 
     hidden_opts = { type: "hidden", value: default_value || "" }
     hidden_opts[:name] = name if name
 
     search_el = search ? tag.input(class: "search") : nil
-    text_el = tag.div(class: "default text") { placeholder || "" }
+    text_el = if inline
+      tag.div(class: "text") { tag.h2(class: "ui header") { placeholder || "" } }
+    else
+      tag.div(class: "text") { placeholder || "" }
+    end
     menu_el = tag.div(class: "menu") { @content }
 
     tag.div(class: classes, data: data) {

data/app/components/grid_component.rb

@@ -45,13 +45,14 @@ class GridComponent < Component
       "grid"
     )
 
-    tag.div(class: classes) { @content }
+    tag.div(**merge_html_options(class: classes)) { @content }
   end
 
   private
 
   def divided_class
     case divided
+    when "t", "1" then "divided"
     when "vertically" then "vertically divided"
     when "true", true then "divided"
     when String then "#{divided} divided"
@@ -60,6 +61,7 @@ class GridComponent < Component
 
   def celled_class
     case celled
+    when "t", "1" then "celled"
     when "internally" then "internally celled"
     when "true", true then "celled"
     when String then "#{celled} celled"
@@ -68,6 +70,7 @@ class GridComponent < Component
 
   def padded_class
     case padded
+    when "t", "1" then "padded"
     when "vertically" then "vertically padded"
     when "horizontally" then "horizontally padded"
     when "true", true then "padded"
@@ -77,6 +80,7 @@ class GridComponent < Component
 
   def relaxed_class
     case relaxed
+    when "t", "1" then "relaxed"
     when "very" then "very relaxed"
     when "true", true then "relaxed"
     when String then "#{relaxed} relaxed"

data/app/components/link_to_component.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+# LinkTo - anchor element.
+#
+# Usage:
+#   LinkTo(href: "/about") { text "About Us" }
+#   LinkTo(href: "/help", target: "_blank") { text "Help" }
+
+class LinkToComponent < Component
+  attribute :href,      :string, default: "#"
+  attribute :target,    :string, default: nil
+  attribute :rel,       :string, default: nil
+  attribute :css_class, :string, default: nil
+
+  def to_s
+    opts = { href: href }
+    opts[:class] = css_class if css_class
+    opts[:target] = target if target
+    opts[:rel] = rel if rel
+
+    tag.a(**merge_html_options(**opts)) { @content }
+  end
+end

data/app/components/menu_item_component.rb

@@ -23,6 +23,8 @@ class MenuItemComponent < Component
   attribute :color,    :string,  default: nil
   attribute :dropdown, :boolean, default: false
   attribute :value,    :string,  default: nil
+  attribute :target,   :string,  default: nil
+  attribute :rel,      :string,  default: nil
 
   def to_s
     classes = class_names(
@@ -41,8 +43,10 @@ class MenuItemComponent < Component
     icon_el = icon ? tag.i(class: "#{icon} icon") : nil
     inner = icon_el ? safe_join([ icon_el, @content ]) : @content
 
-    opts = { class: classes }
+    opts = merge_html_options(class: classes)
     opts["data-value"] = value if value
+    opts[:target] = target if target
+    opts[:rel] = rel if rel
 
     if href
       tag.a(**opts, href: href) { inner }

data/app/components/message_component.rb

@@ -47,7 +47,9 @@ class MessageComponent < Component
     content_parts = safe_join([ header_el, @content.presence ])
     content_wrapper = icon ? tag.div(class: "content") { content_parts } : content_parts
 
-    tag.div(class: classes) {
+    opts = merge_html_options(class: classes)
+
+    tag.div(**opts) {
       safe_join([ close_el, icon_el, content_wrapper ])
     }
   end

data/app/components/modal_component.rb

@@ -16,6 +16,10 @@
 #     c.header { text "Targeted Modal" }
 #     c.content { text "This modal can be targeted by DOM id." }
 #   }
+#
+#   # Turbo-powered modal: drop in layout once, target from any link/button
+#   # with data: { turbo_frame: "modal" }
+#   Modal(turbo: true, blurring: true)
 
 class ModalComponent < Component
   attribute :id,       :string,  default: nil
@@ -26,6 +30,7 @@ class ModalComponent < Component
   attribute :longer,     :boolean, default: false
   attribute :fullscreen, :boolean, default: false
   attribute :scrolling,  :boolean, default: false
+  attribute :turbo,      :boolean, default: false
 
   slot :header
   slot :content
@@ -41,17 +46,32 @@ class ModalComponent < Component
       "modal"
     )
 
-    data = { controller: "fui-modal" }
+    controllers = "fui-modal"
+    controllers = "fui-modal turbo-modal" if turbo
+
+    data = { controller: controllers }
     data[:fui_modal_closable_value] = "false" unless closable
     data[:fui_modal_blurring_value] = "true" if blurring
 
+    if turbo
+      data[:action] = "turbo:frame-load->turbo-modal#open turbo:submit-end->turbo-modal#closeOnSuccess"
+    end
+
     close_el = closable ? tag.i(class: "close icon") : nil
     header_el = @slots[:header] ? tag.div(class: "header") { @slots[:header] } : nil
     content_cls = scrolling ? "scrolling content" : "content"
-    content_el = @slots[:content] ? tag.div(class: content_cls) { @slots[:content] } : nil
+
+    if turbo
+      frame_el = @view_context.turbo_frame_tag("modal")
+      inner = @slots[:content] ? safe_join([ @slots[:content], frame_el ]) : frame_el
+      content_el = tag.div(class: content_cls) { inner }
+    else
+      content_el = @slots[:content] ? tag.div(class: content_cls) { @slots[:content] } : nil
+    end
+
     actions_el = @slots[:actions] ? tag.div(class: "actions") { @slots[:actions] } : nil
 
-    opts = { class: classes, data: data }
+    opts = merge_html_options(class: classes, data: data)
     opts[:id] = id if id
 
     tag.div(**opts) {

data/app/components/paragraph_component.rb

@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+# Paragraph — a plain <p> element.
+#
+# Usage:
+#   Paragraph { text "Some text content" }
+#   Paragraph(id: "intro") { text "Introduction" }
+
+class ParagraphComponent < Component
+  def to_s
+    tag.p(**merge_html_options) { @content }
+  end
+end

data/app/components/row_component.rb

@@ -34,6 +34,6 @@ class RowComponent < Component
       "row"
     )
 
-    tag.div(class: classes) { @content }
+    tag.div(**merge_html_options(class: classes)) { @content }
   end
 end

data/app/components/table_row_component.rb

@@ -34,10 +34,8 @@ class TableRowComponent < Component
       ("disabled" if disabled)
     ].compact
 
-    if classes.any?
-      tag.tr(class: classes.join(" ")) { @content }
-    else
-      tag.tr { @content }
-    end
+    opts = {}
+    opts[:class] = classes.join(" ") if classes.any?
+    tag.tr(**merge_html_options(**opts)) { @content }
   end
 end

data/app/components/template_component.rb

@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+# Template - a plain <template> element.
+#
+# Usage:
+#   Template { text "content" }
+#   Template(data: { nested_form_target: "template" }) { text "..." }
+
+class TemplateComponent < Component
+  def to_s
+    tag.template(**merge_html_options) { @content }
+  end
+end