Bryce
f16c52d70b
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>
28 lines
2.0 KiB
HTML
28 lines
2.0 KiB
HTML
{# One expense-account row, read from a loop-bound `row` view-model (account-row-vm). The
|
|
account typeahead, location select, and remove button all reuse the shared component
|
|
partials (typeahead.html / location-select.html / a-icon-button via its ctx); only the
|
|
table layout is inline. The location cell (#account-location-N) swaps just itself on
|
|
account change; the remove button swaps the whole #bulk-code-form. #}
|
|
<tr class="{{ row.tr_classes }}"{{ row.tr_attrs|safe }}>
|
|
<input type="hidden" name="{{ row.db_id_name }}"{% if row.db_id_value %} value="{{ row.db_id_value }}"{% endif %}>
|
|
<td class="px-4 py-2">
|
|
<div class="{{ row.account_field_classes }}">
|
|
<div class="flex flex-col">{% with width=row.account.width x_data=row.account.x_data x_model=row.account.x_model key=row.account.key disabled=row.account.disabled a_xinit=row.account.a_xinit placeholder=row.account.placeholder hidden_attrs=row.account.hidden_attrs %}{% include "templates/components/typeahead.html" %}{% endwith %}</div>
|
|
<p class="mt-2 text-xs text-red-600 dark:text-red-500 h-4">{{ row.account_error }}</p>
|
|
</div>
|
|
</td>
|
|
<td class="px-4 py-2" id="{{ row.location_cell_id }}">
|
|
<div class="{{ row.location_field_classes }}"{{ row.location_field_attrs|safe }}>
|
|
{% with name=row.location.name variant=row.location.variant options=row.location.options %}{% include "templates/components/location-select.html" %}{% endwith %}
|
|
<p class="mt-2 text-xs text-red-600 dark:text-red-500 h-4">{{ row.location_error }}</p>
|
|
</div>
|
|
</td>
|
|
<td class="px-4 py-2">
|
|
<div class="{{ row.pct_field_classes }}">
|
|
{% with variant=row.pct.variant attrs=row.pct.attrs %}{% include "templates/components/money-input.html" %}{% endwith %}
|
|
<p class="mt-2 text-xs text-red-600 dark:text-red-500 h-4">{{ row.pct_error }}</p>
|
|
</div>
|
|
</td>
|
|
<td class="px-4 py-2 align-top">{% with extra=row.remove.extra attrs=row.remove.attrs body=row.remove.body %}{% include "templates/components/a-icon-button.html" %}{% endwith %}</td>
|
|
</tr>
|