.ppp-associate-item {
border: 1px solid hsl(var(--border));
border-radius: var(--radius-control);
background: hsl(var(--background));
overflow: hidden;
transition: border-color 140ms, box-shadow 140ms, transform 140ms;
}
.ppp-associate-head {
grid-template-columns: 22px 28px minmax(190px, 1fr) auto auto auto;
}.ppp-associate-item {
border: 1px solid hsl(var(--border));
border-radius: var(--radius-control);
background: hsl(var(--background));
overflow: hidden;
content-visibility: auto;
contain-intrinsic-size: 132px;
transition: border-color 140ms, box-shadow 140ms;
}
.ppp-associate-head {
grid-template-columns: 22px 28px minmax(190px, 1fr) minmax(170px, auto) minmax(180px, auto) minmax(180px, auto);
min-width: 0;
}.ppp-associate-detail {
display: none;
padding: 0 14px 14px 64px;
border-top: 1px solid hsl(var(--border));
background: hsl(var(--muted) / 0.14);
}.ppp-associate-detail {
display: none;
padding: 0 14px 14px 64px;
border-top: 1px solid hsl(var(--border));
background: hsl(var(--muted) / 0.14);
contain: layout paint;
content-visibility: auto;
contain-intrinsic-size: 180px;
}let refreshToken = 0;
const pageSize = 25;let refreshToken = 0;
let detailRenderFrame = 0;
const pageSize = 12;<div class="ppp-associate-detail">
${renderGroupDetails(group)}
</div><div class="ppp-associate-detail" id="associate-detail-${globalIndex}" data-group-detail="${globalIndex}" aria-live="polite"></div>
// Details are hydrated after the list paints, or when a row is expanded.
hydrateVisibleGroupDetails(slice, start);<button class="ppp-associate-toggle" type="button" data-toggle-group="${globalIndex}" aria-label="Show exceptions for ${esc(group.associateName)}"><button class="ppp-associate-toggle" type="button" data-toggle-group="${globalIndex}" aria-expanded="false" aria-controls="associate-detail-${globalIndex}" aria-label="Show exceptions for ${esc(group.associateName)}">