Bake the Tailwind class base into the shared Selmer component partials so the partials own their markup and callers pass only data + a small variant (width / size / color). Applies across all four modals that share them (bulk-code, invoices, sales-summaries, transaction-edit). - typeahead / select / location-select / money-input / validated-field / button / a-button / a-icon-button: the class base, the validated-field has-error toggle, and the button color ladders now live in the .html. The sc/*-ctx fns pass width / variant / extra / color plus the non-class attrs (computed exactly as before, so every non-class attribute is unchanged). - bulk-code templates updated to the new partial contracts; account-row pulls money-input and a-icon-button in via includes. Verified: every component's class SET is identical to before across all variants (14/14 oracle match -- buttons reorder/dedupe classes, CSS is order-independent); bulk-code full render is DOM-equivalent to the pre-sweep baseline (class-set + attr-order normalized) for empty / populated / error; browser QA of bulk-code (full flow) and transaction-edit (open + render) clean, no JS errors; invoices + sales-summaries compile and render through the same sc/* fns. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
23 lines
1.3 KiB
HTML
23 lines
1.3 KiB
HTML
{# Expense-account grid -- fully template-driven. A single for-loop over the per-row
|
|
view-models (bulk-code/account-row-vm), each delegating to account-row.html. The
|
|
trailing "New account" button (a-button partial) posts the whole #bulk-code-form
|
|
(op=new-account). #}
|
|
<div class="shrink overflow-y-scroll">
|
|
<table class="w-full text-sm text-left text-gray-500 dark:text-gray-400 shrink">
|
|
<thead class="text-xs text-gray-800 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400 group-[.raw]:sticky group-[.raw]:z-10 group-[.raw]:top-0">
|
|
<tr>
|
|
<th class="px-4 py-3" scope="col">Account</th>
|
|
<th class="px-4 py-3 w-32" scope="col">Location</th>
|
|
<th class="px-4 py-3 w-16" scope="col">%</th>
|
|
<th class="px-4 py-3 w-16" scope="col"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for row in accounts.rows %}{% include "templates/transaction-bulk-code/account-row.html" %}{% endfor %}
|
|
<tr class="new-row border-b dark:border-gray-600 group hover:bg-gray-100 dark:hover:bg-gray-700">
|
|
<td class="px-4 py-2" colspan="4">{% with color=accounts.new_account.color extra=accounts.new_account.extra attrs=accounts.new_account.attrs indicator=accounts.new_account.indicator body=accounts.new_account.body %}{% include "templates/components/a-button.html" %}{% endwith %}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|