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>
30 lines
1.8 KiB
HTML
30 lines
1.8 KiB
HTML
{# Bulk-code modal body: vendor typeahead (a change repopulates the default account via a
|
|
whole-form swap), status select, and the expense-account grid. Each field inlines the
|
|
validated-field wrapper (label + error <p>) and pulls its control in from the shared
|
|
component partials; all data comes from the form view-model. #}
|
|
<div class="space-y-4 p-4">
|
|
<div class="grid grid-cols-2 gap-4">
|
|
<div {{ vendor.changed_attrs|safe }}>
|
|
<div class="{{ vendor.field_classes }}">
|
|
<label class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Vendor</label>
|
|
{% with width=vendor.ta.width x_data=vendor.ta.x_data x_model=vendor.ta.x_model key=vendor.ta.key disabled=vendor.ta.disabled a_xinit=vendor.ta.a_xinit placeholder=vendor.ta.placeholder hidden_attrs=vendor.ta.hidden_attrs %}{% include "templates/components/typeahead.html" %}{% endwith %}
|
|
<p class="mt-2 text-xs text-red-600 dark:text-red-500 h-4">{{ vendor.error }}</p>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="{{ status.field_classes }}">
|
|
<label class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Status</label>
|
|
{% with name=status.name variant=status.variant attrs=status.attrs options=status.options %}{% include "templates/components/select.html" %}{% endwith %}
|
|
<p class="mt-2 text-xs text-red-600 dark:text-red-500 h-4">{{ status.error }}</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-span-2 pt-4">
|
|
<h3 class="text-lg font-medium mb-3">Expense Accounts</h3>
|
|
<div class="{{ accounts.field_classes }}">
|
|
<div id="account-entries" class="space-y-3">{% include "templates/transaction-bulk-code/account-grid.html" %}</div>
|
|
<p class="mt-2 text-xs text-red-600 dark:text-red-500 h-4">{{ accounts.error }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|