@forgeroute/ui 0.4.65 → 0.4.67

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -13544,7 +13544,7 @@ var DataTableComponent = class DataTableComponent {
13544
13544
  @if (tc.starFn?.(item); as starTip) {
13545
13545
  <ui-star class="dt-cell-star" [tooltip]="starTip" />
13546
13546
  }
13547
- {{ tc.render ? tc.render(item) : (item[tc.key] ?? '—') }}
13547
+ {{ tc.render ? tc.render(item) : cardCellText(tc, item) }}
13548
13548
  </span>
13549
13549
  }
13550
13550
  }
@@ -13688,7 +13688,7 @@ var DataTableComponent = class DataTableComponent {
13688
13688
  </div>
13689
13689
  `,
13690
13690
  isInline: true,
13691
- styles: [":host{display:flex;flex-direction:column;flex:1;min-height:0}.dt-host{display:flex;flex-direction:column;height:100%;min-height:0}.dt-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap;justify-content:space-between;position:relative;z-index:10}.dt-header-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex:1;min-width:0}.dt-header-right{display:flex;align-items:center;gap:8px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}.dt-title{margin:0;font-size:.8125rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b;overflow-wrap:anywhere}.dt-sk-shimmer{position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-shimmer:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}@keyframes dt-shimmer{to{transform:translate(200%)}}.dt-sk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.dt-sk-toolbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.dt-sk-toolbar-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.dt-sk-search{display:flex;align-items:center;gap:10px;width:380px;height:36px;padding:0 12px;border:1px solid #e2e8f0;border-radius:6px;background:#f8fafc;box-sizing:border-box}.dt-sk-search-icon{width:16px;height:16px;border-radius:50%;flex-shrink:0}.dt-sk-search-text{flex:1;height:11px;border-radius:4px}.dt-sk-tab-strip{display:flex;gap:2px;padding:3px;background:#f1f5f9;border-radius:8px}.dt-sk-tab{height:28px;width:70px;border-radius:6px}.dt-sk-icon-btn{width:32px;height:32px;border-radius:6px}.dt-skeleton{border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}.dt-sk-header{display:flex;gap:24px;padding:12px 16px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.dt-sk-row{display:flex;gap:24px;padding:13px 16px;border-bottom:1px solid #f1f5f9}.dt-sk-row:last-child{border-bottom:none}.dt-sk-cell{flex:1;height:13px;border-radius:4px;position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-cell:first-child{max-width:100px}.dt-sk-cell:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}.dt-sk-head{height:10px}.dt-table-wrap{flex:1;min-height:0;overflow:auto;border:1px solid #e2e8f0;border-radius:10px 10px 0 0}.dt-sk-reload-row td{padding:10px 14px;border-bottom:1px solid #f1f5f9}table{width:100%;border-collapse:collapse;font-size:.875rem}thead tr{background:#f8fafc;border-bottom:1px solid #e2e8f0}thead{position:sticky;top:0;z-index:2}th{padding:10px 14px;font-size:.75rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;border-right:1px solid #e2e8f0;text-align:center;background:#f8fafc}th:last-child{border-right:none}th.dt-th-sorted{background:#f1f5f9}th.dt-th-actions{width:48px}.dt-th-inner{display:flex;align-items:center;justify-content:center;gap:4px}.dt-sort-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;padding:0;text-transform:inherit;letter-spacing:inherit}.dt-sort-btn:hover{color:#1e293b}.dt-sort-btn:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:2px}@media(pointer:coarse){.dt-sort-btn{position:relative}.dt-sort-btn:after{content:\"\";position:absolute;left:-4px;right:-4px;top:50%;height:44px;transform:translateY(-50%)}}.dt-sort-icon{transition:transform .15s}.dt-sort-desc{transform:rotate(180deg)}.dt-sort-inactive{opacity:.4}tbody tr{border-bottom:1px solid #f1f5f9;background:#fff;transition:background .1s}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:#f8fafc}.dt-row-clickable{cursor:pointer}.dt-row-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}td{padding:10px 14px;color:#334155;vertical-align:middle;white-space:nowrap;border-right:1px solid #f1f5f9}td:last-child{border-right:none}.dt-td-actions{text-align:center;padding:6px 8px}.dt-sticky-actions th.dt-th-actions,.dt-sticky-actions td.dt-td-actions{position:sticky;right:0;box-shadow:-1px 0 #e2e8f0}.dt-sticky-actions th.dt-th-actions{z-index:3;background:#f8fafc}.dt-sticky-actions td.dt-td-actions{z-index:1;background:#fff}.dt-sticky-actions td.dt-td-actions:focus-within,.dt-sticky-actions td.dt-td-actions:has(.mm-dropdown){z-index:2}.dt-sticky-actions tbody tr:hover td.dt-td-actions{background:#f8fafc}.dt-sticky-actions tbody tr.dt-row-selected td.dt-td-actions{background:#eff6ff}.dt-sticky-actions tbody tr.dt-row-selected:hover td.dt-td-actions{background:#dbeafe}.dt-td-width{overflow:hidden;text-overflow:ellipsis}.dt-img{display:inline-block;vertical-align:middle;object-fit:cover;border:1px solid #e2e8f0;background:#f1f5f9;flex-shrink:0}.dt-img-ph{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;color:#94a3b8;background:#f1f5f9;border:1px solid #e2e8f0;flex-shrink:0}.dt-img-ph svg{width:55%;height:55%}.dt-img-circle-md{width:40px;height:40px;border-radius:50%}.dt-img-circle-sm{width:28px;height:28px;border-radius:50%}.dt-img-rounded-md{width:48px;height:32px;border-radius:6px}.dt-img-rounded-sm{width:36px;height:24px;border-radius:5px}.dt-avatar-name{display:flex;align-items:center;gap:8px}.dt-name-text{color:#1e293b}.dt-overdue{color:#dc2626;font-weight:500}.dt-none{color:#94a3b8}.dt-link{position:relative;display:inline-block;max-width:100%;padding:1px 2px;vertical-align:bottom;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#2563eb;text-decoration:none;border-radius:3px;cursor:pointer}.dt-link:hover{text-decoration:underline;color:#1d4ed8}.dt-link:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px;text-decoration:underline}.dt-card-detail-value .dt-link,.dt-card-name .dt-link{white-space:normal;overflow-wrap:anywhere}.dt-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.dt-tags{display:flex;align-items:center;gap:4px}.dt-tags-more{font-size:.75rem;font-weight:600;color:#475569;background:#f1f5f9;border-radius:999px;padding:2px 7px;cursor:default;-webkit-user-select:none;user-select:none;border:1px solid #e2e8f0}.dt-tags-more:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:999px}.dt-tag-tooltip{position:fixed;z-index:9999;pointer-events:none;background:#1e293b;border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:5px;box-shadow:0 4px 6px #0000000f,0 10px 24px #00000024;transform:translate(-50%) translateY(-100%);animation:dt-tip-in .12s ease;max-width:220px}@keyframes dt-tip-in{0%{opacity:0;transform:translate(-50%) translateY(calc(-100% + 4px))}to{opacity:1;transform:translate(-50%) translateY(-100%)}}.dt-cell-star{margin-right:6px}.dt-actions-cell{display:flex;align-items:center;justify-content:center}.dt-bulk-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;align-self:flex-start;padding:10px 14px;margin-bottom:8px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px}.dt-bulk-count{font-size:.875rem;font-weight:600;color:#1e40af;white-space:nowrap;flex-shrink:0}.dt-bulk-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1;min-width:0}.dt-bulk-actions ui-select{max-width:180px;min-width:120px}.dt-bulk-hint{font-size:.8125rem;line-height:1.35;color:#475569}.dt-card-cb{display:flex;align-items:center;padding:0 0 6px}.dt-card-selected{background:#eff6ff!important;border-color:#bfdbfe!important}.dt-th-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-th-grip{width:36px;padding:0!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-grip{width:36px;padding:0!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-grip{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;color:#64748b;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none}.dt-grip:hover{background:#f1f5f9;color:#334155}.dt-grip:active{cursor:grabbing}.dt-grip:focus-visible{outline:2px solid #3b82f6;outline-offset:1px}.dt-grip-off{color:#cbd5e1;cursor:not-allowed}.dt-grip-off:hover{background:none;color:#cbd5e1}.dt-row-move{display:none}@media(pointer:coarse){.dt-grip{display:none}.dt-row-move{display:inline-flex;flex-direction:column;align-items:center}.dt-th-grip,.dt-td-grip{width:56px}}.dt-row-dragging{opacity:.45}.dt-row-over-before>td{box-shadow:inset 0 2px #3b82f6}.dt-row-over-after>td{box-shadow:inset 0 -2px #3b82f6}.dt-card-move{display:inline-flex;align-items:center;gap:2px;flex-shrink:0}@media(forced-colors:active){.dt-row-over-before>td{box-shadow:inset 0 2px 0 Highlight}.dt-row-over-after>td{box-shadow:inset 0 -2px 0 Highlight}.dt-grip:focus-visible{outline-color:Highlight}}.dt-row-selected{background:#eff6ff!important}.dt-row-selected:hover{background:#dbeafe!important}.dt-state-cell{padding:0!important;border:none!important;background:#fff!important}@media(max-width:1024px){th{padding:10px 12px}td{padding:11px 12px}.dt-sort-btn{padding:4px 0}.dt-td-actions{padding:6px}.dt-bulk-bar{align-self:stretch}}@media(max-width:820px){.dt-header-left{flex-basis:100%}.dt-header-right{flex-basis:100%;justify-content:flex-start}}@media(max-width:768px){th{padding:9px 10px;font-size:.8125rem}td{padding:10px;font-size:.8125rem}.dt-sk-search{width:100%}}@media(max-width:640px){.dt-header{flex-direction:column;flex-wrap:nowrap;flex-shrink:0;align-items:stretch}.dt-header-left,.dt-header-right{width:100%}.dt-table-wrap{display:none}.dt-sk-search{width:100%}.dt-sk-toolbar{flex-direction:column;align-items:stretch;gap:8px}.dt-sk-toolbar-right{align-self:flex-end}.dt-bulk-bar{align-self:stretch;padding:10px 12px;row-gap:8px}.dt-bulk-count{flex:1 1 100%}.dt-bulk-actions{flex:1 1 auto;width:auto}.dt-bulk-hint{flex-basis:100%}.dt-bulk-actions ui-select{max-width:100%;flex:1}}.dt-confirm-msg{margin:0;font-size:.9375rem;color:#334155;line-height:1.5;overflow-wrap:anywhere;word-break:break-word;white-space:pre-line}.dt-confirm-details{margin:10px 0 0;padding-left:20px;font-size:.875rem;color:#64748b;line-height:1.5;overflow-wrap:anywhere;word-break:break-word}.dt-confirm-details li+li{margin-top:4px}ui-pagination{flex-shrink:0;--ui-pagination-bg: #f8fafc}.dt-phone-controls{display:flex;flex-direction:column;gap:8px;margin-bottom:8px;flex-shrink:0}.dt-phone-sort{display:flex;align-items:center;gap:8px}.dt-phone-sort-label{font-size:.8125rem;font-weight:600;color:#64748b;flex-shrink:0}.dt-phone-sort-select{flex:1;min-width:0;min-height:44px;box-sizing:border-box;padding:0 36px 0 12px;font-family:inherit;font-size:1rem;color:#1e293b;border:1px solid #7c8ba1;border-radius:8px;-webkit-appearance:none;appearance:none;background:#fff url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E\") no-repeat right 12px center}.dt-phone-filters{display:flex;flex-wrap:wrap;gap:8px}.dt-card-list{display:none;flex-direction:column;gap:8px;flex:1;min-height:0;overflow-y:auto}@media(max-width:640px){.dt-card-list{display:flex;padding-bottom:8px}}.dt-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;contain:layout style;padding:14px 16px;display:flex;flex-direction:column;gap:10px;transition:background .1s}.dt-card:has(.mm-dropdown){position:relative;z-index:1}.dt-card-clickable{cursor:pointer}.dt-card-clickable:active{background:#f8fafc}.dt-card-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.dt-card-header{display:flex;align-items:center;gap:10px}.dt-card-title{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.dt-card-name{min-width:0;font-weight:600;color:#1e293b;font-size:.9375rem;overflow:hidden;text-overflow:ellipsis;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3}.dt-card-name-plain{flex:1}.dt-card-actions{margin-left:auto;flex-shrink:0}.dt-card-badges{display:flex;flex-wrap:wrap;gap:6px}.dt-card-tags{display:flex;flex-wrap:wrap;gap:4px}.dt-card-details{display:flex;flex-direction:column;gap:5px}.dt-card-detail-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:.8125rem}.dt-card-detail-label{color:#64748b;flex-shrink:0}.dt-card-detail-value{color:#334155;font-weight:500;text-align:right;min-width:0;overflow-wrap:anywhere;word-break:break-word}.dt-card-sk{gap:12px}.dt-card-sk-header{display:flex;align-items:center;gap:10px}.dt-card-sk-badges{display:flex;gap:6px}.dt-card-sk-rows{display:flex;flex-direction:column;gap:8px}@media(prefers-reduced-motion:reduce){.dt-sk-shimmer:after,.dt-sk-cell:after{animation:none;transform:none;opacity:0}.dt-tag-tooltip{animation:none}.dt-sort-icon{transition:none}}\n"],
13691
+ styles: [":host{display:flex;flex-direction:column;flex:1;min-height:0}.dt-host{display:flex;flex-direction:column;height:100%;min-height:0}.dt-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap;justify-content:space-between;position:relative;z-index:10}.dt-header-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex:1;min-width:0}.dt-header-right{display:flex;align-items:center;gap:8px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}.dt-title{margin:0;font-size:.8125rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b;overflow-wrap:anywhere}.dt-sk-shimmer{position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-shimmer:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}@keyframes dt-shimmer{to{transform:translate(200%)}}.dt-sk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.dt-sk-toolbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.dt-sk-toolbar-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.dt-sk-search{display:flex;align-items:center;gap:10px;width:380px;height:36px;padding:0 12px;border:1px solid #e2e8f0;border-radius:6px;background:#f8fafc;box-sizing:border-box}.dt-sk-search-icon{width:16px;height:16px;border-radius:50%;flex-shrink:0}.dt-sk-search-text{flex:1;height:11px;border-radius:4px}.dt-sk-tab-strip{display:flex;gap:2px;padding:3px;background:#f1f5f9;border-radius:8px}.dt-sk-tab{height:28px;width:70px;border-radius:6px}.dt-sk-icon-btn{width:32px;height:32px;border-radius:6px}.dt-skeleton{border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}.dt-sk-header{display:flex;gap:24px;padding:12px 16px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.dt-sk-row{display:flex;gap:24px;padding:13px 16px;border-bottom:1px solid #f1f5f9}.dt-sk-row:last-child{border-bottom:none}.dt-sk-cell{flex:1;height:13px;border-radius:4px;position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-cell:first-child{max-width:100px}.dt-sk-cell:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}.dt-sk-head{height:10px}.dt-table-wrap{flex:1;min-height:0;overflow:auto;border:1px solid #e2e8f0;border-radius:10px 10px 0 0}.dt-sk-reload-row td{padding:10px 14px;border-bottom:1px solid #f1f5f9}table{width:100%;border-collapse:collapse;font-size:.875rem}thead tr{background:#f8fafc;border-bottom:1px solid #e2e8f0}thead{position:sticky;top:0;z-index:2}th{padding:10px 14px;font-size:.75rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;border-right:1px solid #e2e8f0;text-align:center;background:#f8fafc}th:last-child{border-right:none}th.dt-th-sorted{background:#f1f5f9}th.dt-th-actions{width:48px}.dt-th-inner{display:flex;align-items:center;justify-content:center;gap:4px}.dt-sort-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;padding:0;text-transform:inherit;letter-spacing:inherit}.dt-sort-btn:hover{color:#1e293b}.dt-sort-btn:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:2px}@media(pointer:coarse){.dt-sort-btn{position:relative}.dt-sort-btn:after{content:\"\";position:absolute;left:-4px;right:-4px;top:50%;height:44px;transform:translateY(-50%)}}.dt-sort-icon{transition:transform .15s}.dt-sort-desc{transform:rotate(180deg)}.dt-sort-inactive{opacity:.4}tbody tr{border-bottom:1px solid #f1f5f9;background:#fff;transition:background .1s}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:#f8fafc}.dt-row-clickable{cursor:pointer}.dt-row-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}td{padding:10px 14px;color:#334155;vertical-align:middle;white-space:nowrap;border-right:1px solid #f1f5f9}td:last-child{border-right:none}.dt-td-actions{text-align:center;padding:6px 8px}.dt-sticky-actions th.dt-th-actions,.dt-sticky-actions td.dt-td-actions{position:sticky;right:0;box-shadow:-1px 0 #e2e8f0}.dt-sticky-actions th.dt-th-actions{z-index:3;background:#f8fafc}.dt-sticky-actions td.dt-td-actions{z-index:1;background:#fff}.dt-sticky-actions td.dt-td-actions:focus-within,.dt-sticky-actions td.dt-td-actions:has(.mm-dropdown){z-index:2}.dt-sticky-actions tbody tr:hover td.dt-td-actions{background:#f8fafc}.dt-sticky-actions tbody tr.dt-row-selected td.dt-td-actions{background:#eff6ff}.dt-sticky-actions tbody tr.dt-row-selected:hover td.dt-td-actions{background:#dbeafe}.dt-td-width{overflow:hidden;text-overflow:ellipsis}.dt-img{display:inline-block;vertical-align:middle;object-fit:cover;border:1px solid #e2e8f0;background:#f1f5f9;flex-shrink:0}.dt-img-ph{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;color:#94a3b8;background:#f1f5f9;border:1px solid #e2e8f0;flex-shrink:0}.dt-img-ph svg{width:55%;height:55%}.dt-img-circle-md{width:40px;height:40px;border-radius:50%}.dt-img-circle-sm{width:28px;height:28px;border-radius:50%}.dt-img-rounded-md{width:48px;height:32px;border-radius:6px}.dt-img-rounded-sm{width:36px;height:24px;border-radius:5px}.dt-avatar-name{display:flex;align-items:center;gap:8px}.dt-name-text{color:#1e293b}.dt-overdue{color:#dc2626;font-weight:500}.dt-none{color:#94a3b8}.dt-link{position:relative;display:inline-block;max-width:100%;padding:1px 2px;vertical-align:bottom;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#2563eb;text-decoration:none;border-radius:3px;cursor:pointer}.dt-link:hover{text-decoration:underline;color:#1d4ed8}.dt-link:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px;text-decoration:underline}.dt-card-detail-value .dt-link,.dt-card-name .dt-link{white-space:normal;overflow-wrap:anywhere}.dt-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.dt-tags{display:flex;align-items:center;gap:4px}.dt-tags-more{font-size:.75rem;font-weight:600;color:#475569;background:#f1f5f9;border-radius:999px;padding:2px 7px;cursor:default;-webkit-user-select:none;user-select:none;border:1px solid #e2e8f0}.dt-tags-more:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:999px}.dt-tag-tooltip{position:fixed;z-index:9999;pointer-events:none;background:#1e293b;border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:5px;box-shadow:0 4px 6px #0000000f,0 10px 24px #00000024;transform:translate(-50%) translateY(-100%);animation:dt-tip-in .12s ease;max-width:220px}@keyframes dt-tip-in{0%{opacity:0;transform:translate(-50%) translateY(calc(-100% + 4px))}to{opacity:1;transform:translate(-50%) translateY(-100%)}}.dt-cell-star{margin-right:6px}.dt-actions-cell{display:flex;align-items:center;justify-content:center}.dt-bulk-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;align-self:flex-start;padding:10px 14px;margin-bottom:8px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px}.dt-bulk-count{font-size:.875rem;font-weight:600;color:#1e40af;white-space:nowrap;flex-shrink:0}.dt-bulk-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1;min-width:0}.dt-bulk-actions ui-select{max-width:180px;min-width:120px}.dt-bulk-hint{font-size:.8125rem;line-height:1.35;color:#475569}.dt-card-cb{display:flex;align-items:center;padding:0 0 6px}.dt-card-selected{background:#eff6ff!important;border-color:#bfdbfe!important}.dt-th-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-th-grip{width:36px;padding:0!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-grip{width:36px;padding:0!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-grip{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;color:#64748b;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none}.dt-grip:hover{background:#f1f5f9;color:#334155}.dt-grip:active{cursor:grabbing}.dt-grip:focus-visible{outline:2px solid #3b82f6;outline-offset:1px}.dt-grip-off{color:#cbd5e1;cursor:not-allowed}.dt-grip-off:hover{background:none;color:#cbd5e1}.dt-row-move{display:none}@media(pointer:coarse){.dt-grip{display:none}.dt-row-move{display:inline-flex;flex-direction:column;align-items:center}.dt-th-grip,.dt-td-grip{width:56px}}.dt-row-dragging{opacity:.45}.dt-row-over-before>td{box-shadow:inset 0 2px #3b82f6}.dt-row-over-after>td{box-shadow:inset 0 -2px #3b82f6}.dt-card-move{display:inline-flex;align-items:center;gap:2px;flex-shrink:0}@media(forced-colors:active){.dt-row-over-before>td{box-shadow:inset 0 2px 0 Highlight}.dt-row-over-after>td{box-shadow:inset 0 -2px 0 Highlight}.dt-grip:focus-visible{outline-color:Highlight}}.dt-row-selected{background:#eff6ff!important}.dt-row-selected:hover{background:#dbeafe!important}.dt-state-cell{padding:0!important;border:none!important;background:#fff!important}@media(max-width:1024px){th{padding:10px 12px}td{padding:11px 12px}.dt-sort-btn{padding:4px 0}.dt-td-actions{padding:6px}.dt-bulk-bar{align-self:stretch}}@media(max-width:820px){.dt-header-left{flex-basis:100%}.dt-header-right{flex-basis:100%;justify-content:flex-start}}@media(max-width:768px){th{padding:9px 10px;font-size:.8125rem}td{padding:10px;font-size:.8125rem}.dt-sk-search{width:100%}}@media(max-width:640px){.dt-header{flex-direction:column;flex-wrap:nowrap;flex-shrink:0;align-items:stretch}.dt-header-left,.dt-header-right{width:100%;flex-basis:auto}.dt-table-wrap{display:none}.dt-sk-search{width:100%}.dt-sk-toolbar{flex-direction:column;align-items:stretch;gap:8px}.dt-sk-toolbar-right{align-self:flex-end}.dt-bulk-bar{align-self:stretch;padding:10px 12px;row-gap:8px}.dt-bulk-count{flex:1 1 100%}.dt-bulk-actions{flex:1 1 auto;width:auto}.dt-bulk-hint{flex-basis:100%}.dt-bulk-actions ui-select{max-width:100%;flex:1}}.dt-confirm-msg{margin:0;font-size:.9375rem;color:#334155;line-height:1.5;overflow-wrap:anywhere;word-break:break-word;white-space:pre-line}.dt-confirm-details{margin:10px 0 0;padding-left:20px;font-size:.875rem;color:#64748b;line-height:1.5;overflow-wrap:anywhere;word-break:break-word}.dt-confirm-details li+li{margin-top:4px}ui-pagination{flex-shrink:0;--ui-pagination-bg: #f8fafc}.dt-phone-controls{display:flex;flex-direction:column;gap:8px;margin-bottom:8px;flex-shrink:0}.dt-phone-sort{display:flex;align-items:center;gap:8px}.dt-phone-sort-label{font-size:.8125rem;font-weight:600;color:#64748b;flex-shrink:0}.dt-phone-sort-select{flex:1;min-width:0;min-height:44px;box-sizing:border-box;padding:0 36px 0 12px;font-family:inherit;font-size:1rem;color:#1e293b;border:1px solid #7c8ba1;border-radius:8px;-webkit-appearance:none;appearance:none;background:#fff url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E\") no-repeat right 12px center}.dt-phone-filters{display:flex;flex-wrap:wrap;gap:8px}.dt-card-list{display:none;flex-direction:column;gap:8px;flex:1;min-height:0;overflow-y:auto}@media(max-width:640px){.dt-card-list{display:flex;padding-bottom:8px}}.dt-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;contain:layout style;padding:14px 16px;display:flex;flex-direction:column;gap:10px;transition:background .1s}.dt-card:has(.mm-dropdown){position:relative;z-index:1}.dt-card-clickable{cursor:pointer}.dt-card-clickable:active{background:#f8fafc}.dt-card-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.dt-card-header{display:flex;align-items:center;gap:10px}.dt-card-title{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.dt-card-name{min-width:0;font-weight:600;color:#1e293b;font-size:.9375rem;overflow:hidden;text-overflow:ellipsis;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3}.dt-card-name-plain{flex:1}.dt-card-actions{margin-left:auto;flex-shrink:0}.dt-card-badges{display:flex;flex-wrap:wrap;gap:6px}.dt-card-tags{display:flex;flex-wrap:wrap;gap:4px}.dt-card-details{display:flex;flex-direction:column;gap:5px}.dt-card-detail-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:.8125rem}.dt-card-detail-label{color:#64748b;flex-shrink:0}.dt-card-detail-value{color:#334155;font-weight:500;text-align:right;min-width:0;overflow-wrap:anywhere;word-break:break-word}.dt-card-sk{gap:12px}.dt-card-sk-header{display:flex;align-items:center;gap:10px}.dt-card-sk-badges{display:flex;gap:6px}.dt-card-sk-rows{display:flex;flex-direction:column;gap:8px}@media(prefers-reduced-motion:reduce){.dt-sk-shimmer:after,.dt-sk-cell:after{animation:none;transform:none;opacity:0}.dt-tag-tooltip{animation:none}.dt-sort-icon{transition:none}}\n"],
13692
13692
  dependencies: [
13693
13693
  {
13694
13694
  kind: "directive",
@@ -14617,7 +14617,7 @@ i0.ɵɵngDeclareClassMetadata({
14617
14617
  @if (tc.starFn?.(item); as starTip) {
14618
14618
  <ui-star class="dt-cell-star" [tooltip]="starTip" />
14619
14619
  }
14620
- {{ tc.render ? tc.render(item) : (item[tc.key] ?? '—') }}
14620
+ {{ tc.render ? tc.render(item) : cardCellText(tc, item) }}
14621
14621
  </span>
14622
14622
  }
14623
14623
  }
@@ -14760,7 +14760,7 @@ i0.ɵɵngDeclareClassMetadata({
14760
14760
  }
14761
14761
  </div>
14762
14762
  `,
14763
- styles: [":host{display:flex;flex-direction:column;flex:1;min-height:0}.dt-host{display:flex;flex-direction:column;height:100%;min-height:0}.dt-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap;justify-content:space-between;position:relative;z-index:10}.dt-header-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex:1;min-width:0}.dt-header-right{display:flex;align-items:center;gap:8px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}.dt-title{margin:0;font-size:.8125rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b;overflow-wrap:anywhere}.dt-sk-shimmer{position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-shimmer:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}@keyframes dt-shimmer{to{transform:translate(200%)}}.dt-sk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.dt-sk-toolbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.dt-sk-toolbar-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.dt-sk-search{display:flex;align-items:center;gap:10px;width:380px;height:36px;padding:0 12px;border:1px solid #e2e8f0;border-radius:6px;background:#f8fafc;box-sizing:border-box}.dt-sk-search-icon{width:16px;height:16px;border-radius:50%;flex-shrink:0}.dt-sk-search-text{flex:1;height:11px;border-radius:4px}.dt-sk-tab-strip{display:flex;gap:2px;padding:3px;background:#f1f5f9;border-radius:8px}.dt-sk-tab{height:28px;width:70px;border-radius:6px}.dt-sk-icon-btn{width:32px;height:32px;border-radius:6px}.dt-skeleton{border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}.dt-sk-header{display:flex;gap:24px;padding:12px 16px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.dt-sk-row{display:flex;gap:24px;padding:13px 16px;border-bottom:1px solid #f1f5f9}.dt-sk-row:last-child{border-bottom:none}.dt-sk-cell{flex:1;height:13px;border-radius:4px;position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-cell:first-child{max-width:100px}.dt-sk-cell:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}.dt-sk-head{height:10px}.dt-table-wrap{flex:1;min-height:0;overflow:auto;border:1px solid #e2e8f0;border-radius:10px 10px 0 0}.dt-sk-reload-row td{padding:10px 14px;border-bottom:1px solid #f1f5f9}table{width:100%;border-collapse:collapse;font-size:.875rem}thead tr{background:#f8fafc;border-bottom:1px solid #e2e8f0}thead{position:sticky;top:0;z-index:2}th{padding:10px 14px;font-size:.75rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;border-right:1px solid #e2e8f0;text-align:center;background:#f8fafc}th:last-child{border-right:none}th.dt-th-sorted{background:#f1f5f9}th.dt-th-actions{width:48px}.dt-th-inner{display:flex;align-items:center;justify-content:center;gap:4px}.dt-sort-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;padding:0;text-transform:inherit;letter-spacing:inherit}.dt-sort-btn:hover{color:#1e293b}.dt-sort-btn:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:2px}@media(pointer:coarse){.dt-sort-btn{position:relative}.dt-sort-btn:after{content:\"\";position:absolute;left:-4px;right:-4px;top:50%;height:44px;transform:translateY(-50%)}}.dt-sort-icon{transition:transform .15s}.dt-sort-desc{transform:rotate(180deg)}.dt-sort-inactive{opacity:.4}tbody tr{border-bottom:1px solid #f1f5f9;background:#fff;transition:background .1s}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:#f8fafc}.dt-row-clickable{cursor:pointer}.dt-row-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}td{padding:10px 14px;color:#334155;vertical-align:middle;white-space:nowrap;border-right:1px solid #f1f5f9}td:last-child{border-right:none}.dt-td-actions{text-align:center;padding:6px 8px}.dt-sticky-actions th.dt-th-actions,.dt-sticky-actions td.dt-td-actions{position:sticky;right:0;box-shadow:-1px 0 #e2e8f0}.dt-sticky-actions th.dt-th-actions{z-index:3;background:#f8fafc}.dt-sticky-actions td.dt-td-actions{z-index:1;background:#fff}.dt-sticky-actions td.dt-td-actions:focus-within,.dt-sticky-actions td.dt-td-actions:has(.mm-dropdown){z-index:2}.dt-sticky-actions tbody tr:hover td.dt-td-actions{background:#f8fafc}.dt-sticky-actions tbody tr.dt-row-selected td.dt-td-actions{background:#eff6ff}.dt-sticky-actions tbody tr.dt-row-selected:hover td.dt-td-actions{background:#dbeafe}.dt-td-width{overflow:hidden;text-overflow:ellipsis}.dt-img{display:inline-block;vertical-align:middle;object-fit:cover;border:1px solid #e2e8f0;background:#f1f5f9;flex-shrink:0}.dt-img-ph{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;color:#94a3b8;background:#f1f5f9;border:1px solid #e2e8f0;flex-shrink:0}.dt-img-ph svg{width:55%;height:55%}.dt-img-circle-md{width:40px;height:40px;border-radius:50%}.dt-img-circle-sm{width:28px;height:28px;border-radius:50%}.dt-img-rounded-md{width:48px;height:32px;border-radius:6px}.dt-img-rounded-sm{width:36px;height:24px;border-radius:5px}.dt-avatar-name{display:flex;align-items:center;gap:8px}.dt-name-text{color:#1e293b}.dt-overdue{color:#dc2626;font-weight:500}.dt-none{color:#94a3b8}.dt-link{position:relative;display:inline-block;max-width:100%;padding:1px 2px;vertical-align:bottom;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#2563eb;text-decoration:none;border-radius:3px;cursor:pointer}.dt-link:hover{text-decoration:underline;color:#1d4ed8}.dt-link:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px;text-decoration:underline}.dt-card-detail-value .dt-link,.dt-card-name .dt-link{white-space:normal;overflow-wrap:anywhere}.dt-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.dt-tags{display:flex;align-items:center;gap:4px}.dt-tags-more{font-size:.75rem;font-weight:600;color:#475569;background:#f1f5f9;border-radius:999px;padding:2px 7px;cursor:default;-webkit-user-select:none;user-select:none;border:1px solid #e2e8f0}.dt-tags-more:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:999px}.dt-tag-tooltip{position:fixed;z-index:9999;pointer-events:none;background:#1e293b;border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:5px;box-shadow:0 4px 6px #0000000f,0 10px 24px #00000024;transform:translate(-50%) translateY(-100%);animation:dt-tip-in .12s ease;max-width:220px}@keyframes dt-tip-in{0%{opacity:0;transform:translate(-50%) translateY(calc(-100% + 4px))}to{opacity:1;transform:translate(-50%) translateY(-100%)}}.dt-cell-star{margin-right:6px}.dt-actions-cell{display:flex;align-items:center;justify-content:center}.dt-bulk-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;align-self:flex-start;padding:10px 14px;margin-bottom:8px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px}.dt-bulk-count{font-size:.875rem;font-weight:600;color:#1e40af;white-space:nowrap;flex-shrink:0}.dt-bulk-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1;min-width:0}.dt-bulk-actions ui-select{max-width:180px;min-width:120px}.dt-bulk-hint{font-size:.8125rem;line-height:1.35;color:#475569}.dt-card-cb{display:flex;align-items:center;padding:0 0 6px}.dt-card-selected{background:#eff6ff!important;border-color:#bfdbfe!important}.dt-th-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-th-grip{width:36px;padding:0!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-grip{width:36px;padding:0!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-grip{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;color:#64748b;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none}.dt-grip:hover{background:#f1f5f9;color:#334155}.dt-grip:active{cursor:grabbing}.dt-grip:focus-visible{outline:2px solid #3b82f6;outline-offset:1px}.dt-grip-off{color:#cbd5e1;cursor:not-allowed}.dt-grip-off:hover{background:none;color:#cbd5e1}.dt-row-move{display:none}@media(pointer:coarse){.dt-grip{display:none}.dt-row-move{display:inline-flex;flex-direction:column;align-items:center}.dt-th-grip,.dt-td-grip{width:56px}}.dt-row-dragging{opacity:.45}.dt-row-over-before>td{box-shadow:inset 0 2px #3b82f6}.dt-row-over-after>td{box-shadow:inset 0 -2px #3b82f6}.dt-card-move{display:inline-flex;align-items:center;gap:2px;flex-shrink:0}@media(forced-colors:active){.dt-row-over-before>td{box-shadow:inset 0 2px 0 Highlight}.dt-row-over-after>td{box-shadow:inset 0 -2px 0 Highlight}.dt-grip:focus-visible{outline-color:Highlight}}.dt-row-selected{background:#eff6ff!important}.dt-row-selected:hover{background:#dbeafe!important}.dt-state-cell{padding:0!important;border:none!important;background:#fff!important}@media(max-width:1024px){th{padding:10px 12px}td{padding:11px 12px}.dt-sort-btn{padding:4px 0}.dt-td-actions{padding:6px}.dt-bulk-bar{align-self:stretch}}@media(max-width:820px){.dt-header-left{flex-basis:100%}.dt-header-right{flex-basis:100%;justify-content:flex-start}}@media(max-width:768px){th{padding:9px 10px;font-size:.8125rem}td{padding:10px;font-size:.8125rem}.dt-sk-search{width:100%}}@media(max-width:640px){.dt-header{flex-direction:column;flex-wrap:nowrap;flex-shrink:0;align-items:stretch}.dt-header-left,.dt-header-right{width:100%}.dt-table-wrap{display:none}.dt-sk-search{width:100%}.dt-sk-toolbar{flex-direction:column;align-items:stretch;gap:8px}.dt-sk-toolbar-right{align-self:flex-end}.dt-bulk-bar{align-self:stretch;padding:10px 12px;row-gap:8px}.dt-bulk-count{flex:1 1 100%}.dt-bulk-actions{flex:1 1 auto;width:auto}.dt-bulk-hint{flex-basis:100%}.dt-bulk-actions ui-select{max-width:100%;flex:1}}.dt-confirm-msg{margin:0;font-size:.9375rem;color:#334155;line-height:1.5;overflow-wrap:anywhere;word-break:break-word;white-space:pre-line}.dt-confirm-details{margin:10px 0 0;padding-left:20px;font-size:.875rem;color:#64748b;line-height:1.5;overflow-wrap:anywhere;word-break:break-word}.dt-confirm-details li+li{margin-top:4px}ui-pagination{flex-shrink:0;--ui-pagination-bg: #f8fafc}.dt-phone-controls{display:flex;flex-direction:column;gap:8px;margin-bottom:8px;flex-shrink:0}.dt-phone-sort{display:flex;align-items:center;gap:8px}.dt-phone-sort-label{font-size:.8125rem;font-weight:600;color:#64748b;flex-shrink:0}.dt-phone-sort-select{flex:1;min-width:0;min-height:44px;box-sizing:border-box;padding:0 36px 0 12px;font-family:inherit;font-size:1rem;color:#1e293b;border:1px solid #7c8ba1;border-radius:8px;-webkit-appearance:none;appearance:none;background:#fff url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E\") no-repeat right 12px center}.dt-phone-filters{display:flex;flex-wrap:wrap;gap:8px}.dt-card-list{display:none;flex-direction:column;gap:8px;flex:1;min-height:0;overflow-y:auto}@media(max-width:640px){.dt-card-list{display:flex;padding-bottom:8px}}.dt-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;contain:layout style;padding:14px 16px;display:flex;flex-direction:column;gap:10px;transition:background .1s}.dt-card:has(.mm-dropdown){position:relative;z-index:1}.dt-card-clickable{cursor:pointer}.dt-card-clickable:active{background:#f8fafc}.dt-card-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.dt-card-header{display:flex;align-items:center;gap:10px}.dt-card-title{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.dt-card-name{min-width:0;font-weight:600;color:#1e293b;font-size:.9375rem;overflow:hidden;text-overflow:ellipsis;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3}.dt-card-name-plain{flex:1}.dt-card-actions{margin-left:auto;flex-shrink:0}.dt-card-badges{display:flex;flex-wrap:wrap;gap:6px}.dt-card-tags{display:flex;flex-wrap:wrap;gap:4px}.dt-card-details{display:flex;flex-direction:column;gap:5px}.dt-card-detail-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:.8125rem}.dt-card-detail-label{color:#64748b;flex-shrink:0}.dt-card-detail-value{color:#334155;font-weight:500;text-align:right;min-width:0;overflow-wrap:anywhere;word-break:break-word}.dt-card-sk{gap:12px}.dt-card-sk-header{display:flex;align-items:center;gap:10px}.dt-card-sk-badges{display:flex;gap:6px}.dt-card-sk-rows{display:flex;flex-direction:column;gap:8px}@media(prefers-reduced-motion:reduce){.dt-sk-shimmer:after,.dt-sk-cell:after{animation:none;transform:none;opacity:0}.dt-tag-tooltip{animation:none}.dt-sort-icon{transition:none}}\n"]
14763
+ styles: [":host{display:flex;flex-direction:column;flex:1;min-height:0}.dt-host{display:flex;flex-direction:column;height:100%;min-height:0}.dt-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap;justify-content:space-between;position:relative;z-index:10}.dt-header-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex:1;min-width:0}.dt-header-right{display:flex;align-items:center;gap:8px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}.dt-title{margin:0;font-size:.8125rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b;overflow-wrap:anywhere}.dt-sk-shimmer{position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-shimmer:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}@keyframes dt-shimmer{to{transform:translate(200%)}}.dt-sk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.dt-sk-toolbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.dt-sk-toolbar-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.dt-sk-search{display:flex;align-items:center;gap:10px;width:380px;height:36px;padding:0 12px;border:1px solid #e2e8f0;border-radius:6px;background:#f8fafc;box-sizing:border-box}.dt-sk-search-icon{width:16px;height:16px;border-radius:50%;flex-shrink:0}.dt-sk-search-text{flex:1;height:11px;border-radius:4px}.dt-sk-tab-strip{display:flex;gap:2px;padding:3px;background:#f1f5f9;border-radius:8px}.dt-sk-tab{height:28px;width:70px;border-radius:6px}.dt-sk-icon-btn{width:32px;height:32px;border-radius:6px}.dt-skeleton{border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}.dt-sk-header{display:flex;gap:24px;padding:12px 16px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.dt-sk-row{display:flex;gap:24px;padding:13px 16px;border-bottom:1px solid #f1f5f9}.dt-sk-row:last-child{border-bottom:none}.dt-sk-cell{flex:1;height:13px;border-radius:4px;position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-cell:first-child{max-width:100px}.dt-sk-cell:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}.dt-sk-head{height:10px}.dt-table-wrap{flex:1;min-height:0;overflow:auto;border:1px solid #e2e8f0;border-radius:10px 10px 0 0}.dt-sk-reload-row td{padding:10px 14px;border-bottom:1px solid #f1f5f9}table{width:100%;border-collapse:collapse;font-size:.875rem}thead tr{background:#f8fafc;border-bottom:1px solid #e2e8f0}thead{position:sticky;top:0;z-index:2}th{padding:10px 14px;font-size:.75rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;border-right:1px solid #e2e8f0;text-align:center;background:#f8fafc}th:last-child{border-right:none}th.dt-th-sorted{background:#f1f5f9}th.dt-th-actions{width:48px}.dt-th-inner{display:flex;align-items:center;justify-content:center;gap:4px}.dt-sort-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;padding:0;text-transform:inherit;letter-spacing:inherit}.dt-sort-btn:hover{color:#1e293b}.dt-sort-btn:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:2px}@media(pointer:coarse){.dt-sort-btn{position:relative}.dt-sort-btn:after{content:\"\";position:absolute;left:-4px;right:-4px;top:50%;height:44px;transform:translateY(-50%)}}.dt-sort-icon{transition:transform .15s}.dt-sort-desc{transform:rotate(180deg)}.dt-sort-inactive{opacity:.4}tbody tr{border-bottom:1px solid #f1f5f9;background:#fff;transition:background .1s}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:#f8fafc}.dt-row-clickable{cursor:pointer}.dt-row-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}td{padding:10px 14px;color:#334155;vertical-align:middle;white-space:nowrap;border-right:1px solid #f1f5f9}td:last-child{border-right:none}.dt-td-actions{text-align:center;padding:6px 8px}.dt-sticky-actions th.dt-th-actions,.dt-sticky-actions td.dt-td-actions{position:sticky;right:0;box-shadow:-1px 0 #e2e8f0}.dt-sticky-actions th.dt-th-actions{z-index:3;background:#f8fafc}.dt-sticky-actions td.dt-td-actions{z-index:1;background:#fff}.dt-sticky-actions td.dt-td-actions:focus-within,.dt-sticky-actions td.dt-td-actions:has(.mm-dropdown){z-index:2}.dt-sticky-actions tbody tr:hover td.dt-td-actions{background:#f8fafc}.dt-sticky-actions tbody tr.dt-row-selected td.dt-td-actions{background:#eff6ff}.dt-sticky-actions tbody tr.dt-row-selected:hover td.dt-td-actions{background:#dbeafe}.dt-td-width{overflow:hidden;text-overflow:ellipsis}.dt-img{display:inline-block;vertical-align:middle;object-fit:cover;border:1px solid #e2e8f0;background:#f1f5f9;flex-shrink:0}.dt-img-ph{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;color:#94a3b8;background:#f1f5f9;border:1px solid #e2e8f0;flex-shrink:0}.dt-img-ph svg{width:55%;height:55%}.dt-img-circle-md{width:40px;height:40px;border-radius:50%}.dt-img-circle-sm{width:28px;height:28px;border-radius:50%}.dt-img-rounded-md{width:48px;height:32px;border-radius:6px}.dt-img-rounded-sm{width:36px;height:24px;border-radius:5px}.dt-avatar-name{display:flex;align-items:center;gap:8px}.dt-name-text{color:#1e293b}.dt-overdue{color:#dc2626;font-weight:500}.dt-none{color:#94a3b8}.dt-link{position:relative;display:inline-block;max-width:100%;padding:1px 2px;vertical-align:bottom;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#2563eb;text-decoration:none;border-radius:3px;cursor:pointer}.dt-link:hover{text-decoration:underline;color:#1d4ed8}.dt-link:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px;text-decoration:underline}.dt-card-detail-value .dt-link,.dt-card-name .dt-link{white-space:normal;overflow-wrap:anywhere}.dt-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.dt-tags{display:flex;align-items:center;gap:4px}.dt-tags-more{font-size:.75rem;font-weight:600;color:#475569;background:#f1f5f9;border-radius:999px;padding:2px 7px;cursor:default;-webkit-user-select:none;user-select:none;border:1px solid #e2e8f0}.dt-tags-more:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:999px}.dt-tag-tooltip{position:fixed;z-index:9999;pointer-events:none;background:#1e293b;border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:5px;box-shadow:0 4px 6px #0000000f,0 10px 24px #00000024;transform:translate(-50%) translateY(-100%);animation:dt-tip-in .12s ease;max-width:220px}@keyframes dt-tip-in{0%{opacity:0;transform:translate(-50%) translateY(calc(-100% + 4px))}to{opacity:1;transform:translate(-50%) translateY(-100%)}}.dt-cell-star{margin-right:6px}.dt-actions-cell{display:flex;align-items:center;justify-content:center}.dt-bulk-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;align-self:flex-start;padding:10px 14px;margin-bottom:8px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px}.dt-bulk-count{font-size:.875rem;font-weight:600;color:#1e40af;white-space:nowrap;flex-shrink:0}.dt-bulk-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1;min-width:0}.dt-bulk-actions ui-select{max-width:180px;min-width:120px}.dt-bulk-hint{font-size:.8125rem;line-height:1.35;color:#475569}.dt-card-cb{display:flex;align-items:center;padding:0 0 6px}.dt-card-selected{background:#eff6ff!important;border-color:#bfdbfe!important}.dt-th-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-th-grip{width:36px;padding:0!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-grip{width:36px;padding:0!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-grip{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;color:#64748b;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none}.dt-grip:hover{background:#f1f5f9;color:#334155}.dt-grip:active{cursor:grabbing}.dt-grip:focus-visible{outline:2px solid #3b82f6;outline-offset:1px}.dt-grip-off{color:#cbd5e1;cursor:not-allowed}.dt-grip-off:hover{background:none;color:#cbd5e1}.dt-row-move{display:none}@media(pointer:coarse){.dt-grip{display:none}.dt-row-move{display:inline-flex;flex-direction:column;align-items:center}.dt-th-grip,.dt-td-grip{width:56px}}.dt-row-dragging{opacity:.45}.dt-row-over-before>td{box-shadow:inset 0 2px #3b82f6}.dt-row-over-after>td{box-shadow:inset 0 -2px #3b82f6}.dt-card-move{display:inline-flex;align-items:center;gap:2px;flex-shrink:0}@media(forced-colors:active){.dt-row-over-before>td{box-shadow:inset 0 2px 0 Highlight}.dt-row-over-after>td{box-shadow:inset 0 -2px 0 Highlight}.dt-grip:focus-visible{outline-color:Highlight}}.dt-row-selected{background:#eff6ff!important}.dt-row-selected:hover{background:#dbeafe!important}.dt-state-cell{padding:0!important;border:none!important;background:#fff!important}@media(max-width:1024px){th{padding:10px 12px}td{padding:11px 12px}.dt-sort-btn{padding:4px 0}.dt-td-actions{padding:6px}.dt-bulk-bar{align-self:stretch}}@media(max-width:820px){.dt-header-left{flex-basis:100%}.dt-header-right{flex-basis:100%;justify-content:flex-start}}@media(max-width:768px){th{padding:9px 10px;font-size:.8125rem}td{padding:10px;font-size:.8125rem}.dt-sk-search{width:100%}}@media(max-width:640px){.dt-header{flex-direction:column;flex-wrap:nowrap;flex-shrink:0;align-items:stretch}.dt-header-left,.dt-header-right{width:100%;flex-basis:auto}.dt-table-wrap{display:none}.dt-sk-search{width:100%}.dt-sk-toolbar{flex-direction:column;align-items:stretch;gap:8px}.dt-sk-toolbar-right{align-self:flex-end}.dt-bulk-bar{align-self:stretch;padding:10px 12px;row-gap:8px}.dt-bulk-count{flex:1 1 100%}.dt-bulk-actions{flex:1 1 auto;width:auto}.dt-bulk-hint{flex-basis:100%}.dt-bulk-actions ui-select{max-width:100%;flex:1}}.dt-confirm-msg{margin:0;font-size:.9375rem;color:#334155;line-height:1.5;overflow-wrap:anywhere;word-break:break-word;white-space:pre-line}.dt-confirm-details{margin:10px 0 0;padding-left:20px;font-size:.875rem;color:#64748b;line-height:1.5;overflow-wrap:anywhere;word-break:break-word}.dt-confirm-details li+li{margin-top:4px}ui-pagination{flex-shrink:0;--ui-pagination-bg: #f8fafc}.dt-phone-controls{display:flex;flex-direction:column;gap:8px;margin-bottom:8px;flex-shrink:0}.dt-phone-sort{display:flex;align-items:center;gap:8px}.dt-phone-sort-label{font-size:.8125rem;font-weight:600;color:#64748b;flex-shrink:0}.dt-phone-sort-select{flex:1;min-width:0;min-height:44px;box-sizing:border-box;padding:0 36px 0 12px;font-family:inherit;font-size:1rem;color:#1e293b;border:1px solid #7c8ba1;border-radius:8px;-webkit-appearance:none;appearance:none;background:#fff url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E\") no-repeat right 12px center}.dt-phone-filters{display:flex;flex-wrap:wrap;gap:8px}.dt-card-list{display:none;flex-direction:column;gap:8px;flex:1;min-height:0;overflow-y:auto}@media(max-width:640px){.dt-card-list{display:flex;padding-bottom:8px}}.dt-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;contain:layout style;padding:14px 16px;display:flex;flex-direction:column;gap:10px;transition:background .1s}.dt-card:has(.mm-dropdown){position:relative;z-index:1}.dt-card-clickable{cursor:pointer}.dt-card-clickable:active{background:#f8fafc}.dt-card-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.dt-card-header{display:flex;align-items:center;gap:10px}.dt-card-title{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.dt-card-name{min-width:0;font-weight:600;color:#1e293b;font-size:.9375rem;overflow:hidden;text-overflow:ellipsis;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3}.dt-card-name-plain{flex:1}.dt-card-actions{margin-left:auto;flex-shrink:0}.dt-card-badges{display:flex;flex-wrap:wrap;gap:6px}.dt-card-tags{display:flex;flex-wrap:wrap;gap:4px}.dt-card-details{display:flex;flex-direction:column;gap:5px}.dt-card-detail-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:.8125rem}.dt-card-detail-label{color:#64748b;flex-shrink:0}.dt-card-detail-value{color:#334155;font-weight:500;text-align:right;min-width:0;overflow-wrap:anywhere;word-break:break-word}.dt-card-sk{gap:12px}.dt-card-sk-header{display:flex;align-items:center;gap:10px}.dt-card-sk-badges{display:flex;gap:6px}.dt-card-sk-rows{display:flex;flex-direction:column;gap:8px}@media(prefers-reduced-motion:reduce){.dt-sk-shimmer:after,.dt-sk-cell:after{animation:none;transform:none;opacity:0}.dt-tag-tooltip{animation:none}.dt-sort-icon{transition:none}}\n"]
14764
14764
  }]
14765
14765
  }],
14766
14766
  ctorParameters: () => [],
@@ -22376,6 +22376,7 @@ var KeypadComponent = class KeypadComponent {
22376
22376
  this.required = input(false, ...ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []);
22377
22377
  this.error = input("", ...ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []);
22378
22378
  this.disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
22379
+ this.submitted = output();
22379
22380
  this._labelId = `ui-keypad-label-${KeypadComponent._next++}`;
22380
22381
  this._keys = KEYS;
22381
22382
  this._dots = computed(() => Array.from({ length: this.maxLength() }), ...ngDevMode ? [{ debugName: "_dots" }] : /* istanbul ignore next */ []);
@@ -22398,7 +22399,10 @@ var KeypadComponent = class KeypadComponent {
22398
22399
  }
22399
22400
  onKeydown(e) {
22400
22401
  if (e.ctrlKey || e.metaKey || e.altKey) return;
22401
- if (/^\d$/.test(e.key)) {
22402
+ if (e.key === "Enter") {
22403
+ e.preventDefault();
22404
+ if (!this._isDisabled()) this.submitted.emit();
22405
+ } else if (/^\d$/.test(e.key)) {
22402
22406
  e.preventDefault();
22403
22407
  this.press(e.key);
22404
22408
  } else if (e.key === "Backspace") {
@@ -22479,7 +22483,10 @@ var KeypadComponent = class KeypadComponent {
22479
22483
  transformFunction: null
22480
22484
  }
22481
22485
  },
22482
- outputs: { value: "valueChange" },
22486
+ outputs: {
22487
+ value: "valueChange",
22488
+ submitted: "submitted"
22489
+ },
22483
22490
  providers: [{
22484
22491
  provide: NG_VALUE_ACCESSOR,
22485
22492
  useExisting: forwardRef(() => KeypadComponent),
@@ -22610,6 +22617,10 @@ i0.ɵɵngDeclareClassMetadata({
22610
22617
  alias: "disabled",
22611
22618
  required: false
22612
22619
  }]
22620
+ }],
22621
+ submitted: [{
22622
+ type: i0.Output,
22623
+ args: ["submitted"]
22613
22624
  }]
22614
22625
  }
22615
22626
  });
@@ -26777,6 +26788,7 @@ var DropdownComponent = class DropdownComponent {
26777
26788
  this.active = input(false, ...ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []);
26778
26789
  this.activeValue = input("", ...ngDevMode ? [{ debugName: "activeValue" }] : /* istanbul ignore next */ []);
26779
26790
  this.variant = input("button", ...ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []);
26791
+ this.size = input("sm", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
26780
26792
  this.menuWidth = input("200px", ...ngDevMode ? [{ debugName: "menuWidth" }] : /* istanbul ignore next */ []);
26781
26793
  this.width = input("", ...ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []);
26782
26794
  this.ariaLabel = input("", ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
@@ -26796,6 +26808,7 @@ var DropdownComponent = class DropdownComponent {
26796
26808
  this._typeahead = "";
26797
26809
  this._typeaheadTimer = null;
26798
26810
  this._destroyed = false;
26811
+ this._loadToken = 0;
26799
26812
  this.triggerId = `ui-dd-trigger-${this._id}`;
26800
26813
  this.menuId = `ui-dd-menu-${this._id}`;
26801
26814
  this._ariaLabel = computed(() => this.ariaLabel().trim() || null, ...ngDevMode ? [{ debugName: "_ariaLabel" }] : /* istanbul ignore next */ []);
@@ -26803,29 +26816,39 @@ var DropdownComponent = class DropdownComponent {
26803
26816
  inject(DestroyRef).onDestroy(() => {
26804
26817
  this._destroyed = true;
26805
26818
  if (this._typeaheadTimer) clearTimeout(this._typeaheadTimer);
26819
+ if (_activeDropdownId() === this._id) _activeDropdownId.set("");
26806
26820
  });
26807
26821
  effect(() => {
26808
- if (_activeDropdownId() !== this._id) untracked(() => {
26809
- if (this.open()) this.open.set(false);
26810
- });
26822
+ if (_activeDropdownId() !== this._id) untracked(() => this.close());
26811
26823
  });
26812
26824
  effect(() => {
26813
26825
  const isOpen = this.open();
26814
26826
  const loader = this.loader();
26815
26827
  if (!loader) return;
26816
26828
  if (isOpen && untracked(() => this._loaded()) === null) {
26829
+ const token = ++this._loadToken;
26817
26830
  this.loading.set(true);
26818
- loader().then((items) => {
26831
+ const done = (items) => {
26832
+ if (this._destroyed || token !== this._loadToken) return;
26819
26833
  this._loaded.set(items);
26820
26834
  this.loading.set(false);
26821
- if (!this._destroyed && this._pendingFocus && this.open()) this._focusPending();
26822
- });
26823
- } else if (!isOpen) this._loaded.set(null);
26835
+ if (this.open()) {
26836
+ afterNextRender(() => this._place(), { injector: this._injector });
26837
+ if (this._pendingFocus) this._focusPending();
26838
+ }
26839
+ };
26840
+ new Promise((resolve) => resolve(loader())).then(done, () => done([]));
26841
+ } else if (!isOpen) {
26842
+ this._loadToken++;
26843
+ this.loading.set(false);
26844
+ this._loaded.set(null);
26845
+ }
26824
26846
  });
26825
26847
  }
26826
26848
  toggle(event) {
26827
26849
  event.stopPropagation();
26828
26850
  this._setOpen(!this.open());
26851
+ this._focusTrigger();
26829
26852
  }
26830
26853
  select(item) {
26831
26854
  if (item.disabled) return;
@@ -27041,6 +27064,13 @@ var DropdownComponent = class DropdownComponent {
27041
27064
  isRequired: false,
27042
27065
  transformFunction: null
27043
27066
  },
27067
+ size: {
27068
+ classPropertyName: "size",
27069
+ publicName: "size",
27070
+ isSignal: true,
27071
+ isRequired: false,
27072
+ transformFunction: null
27073
+ },
27044
27074
  menuWidth: {
27045
27075
  classPropertyName: "menuWidth",
27046
27076
  publicName: "menuWidth",
@@ -27085,18 +27115,18 @@ var DropdownComponent = class DropdownComponent {
27085
27115
  template: `
27086
27116
  <div class="dd-wrapper">
27087
27117
  @if (variant() === 'badge') {
27088
- <button class="dd-trigger dd-trigger-badge" [class.dd-active]="active()" [class.dd-open]="open()" [attr.id]="triggerId" [attr.aria-label]="_ariaLabel()" [attr.aria-expanded]="open()" aria-haspopup="menu" [attr.aria-controls]="open() ? menuId : null" (click)="toggle($event)" (keydown)="onTriggerKeydown($event)" (keyup)="onTriggerKeyup($event)">
27118
+ <button type="button" class="dd-trigger dd-trigger-badge" [class.dd-active]="active()" [class.dd-open]="open()" [attr.id]="triggerId" [attr.aria-label]="_ariaLabel()" [attr.aria-expanded]="open()" aria-haspopup="menu" [attr.aria-controls]="open() ? menuId : null" (click)="toggle($event)" (keydown)="onTriggerKeydown($event)" (keyup)="onTriggerKeyup($event)">
27089
27119
  <span class="dd-text">{{ label() }}</span>
27090
27120
  <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="6 9 12 15 18 9"/></svg>
27091
27121
  </button>
27092
27122
  } @else {
27093
- <button class="dd-trigger dd-trigger-btn" [class.dd-active]="active()" [class.dd-open]="open()" [attr.id]="triggerId" [attr.aria-label]="_ariaLabel()" [attr.aria-expanded]="open()" aria-haspopup="menu" [attr.aria-controls]="open() ? menuId : null" (click)="toggle($event)" (keydown)="onTriggerKeydown($event)" (keyup)="onTriggerKeyup($event)">
27123
+ <button type="button" class="dd-trigger dd-trigger-btn" [class.dd-trigger-md]="size() === 'md'" [class.dd-active]="active()" [class.dd-open]="open()" [attr.id]="triggerId" [attr.aria-label]="_ariaLabel()" [attr.aria-expanded]="open()" aria-haspopup="menu" [attr.aria-controls]="open() ? menuId : null" (click)="toggle($event)" (keydown)="onTriggerKeydown($event)" (keyup)="onTriggerKeyup($event)">
27094
27124
  <span class="dd-text">{{ label() }}</span>
27095
27125
  <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="6 9 12 15 18 9"/></svg>
27096
27126
  </button>
27097
27127
  }
27098
27128
  @if (open()) {
27099
- <div class="dd-menu" role="menu" [attr.id]="menuId" [attr.aria-label]="_ariaLabel()" [attr.aria-labelledby]="_ariaLabel() ? null : triggerId" [style.min-width]="menuWidth()" [class.dd-menu-end]="alignEnd()" [class.dd-menu-up]="openUp()" [style.max-height.px]="menuMaxHeight()" (click)="$event.stopPropagation()" (keydown)="onMenuKeydown($event)">
27129
+ <div class="dd-menu" role="menu" [attr.id]="menuId" [attr.aria-label]="_ariaLabel()" [attr.aria-labelledby]="_ariaLabel() ? null : triggerId" [style.min-width]="menuWidth()" [class.dd-menu-end]="alignEnd()" [class.dd-menu-up]="openUp()" [style.max-height.px]="menuMaxHeight()" [attr.aria-busy]="loading() ? 'true' : null" (click)="$event.stopPropagation()" (keydown)="onMenuKeydown($event)">
27100
27130
  @if (loading()) {
27101
27131
  <div class="dd-loading">
27102
27132
  <span class="dd-spinner"></span>
@@ -27104,7 +27134,7 @@ var DropdownComponent = class DropdownComponent {
27104
27134
  </div>
27105
27135
  } @else {
27106
27136
  @for (item of displayItems(); track item.value) {
27107
- <button type="button" class="dd-item" role="menuitem" tabindex="-1" [disabled]="item.disabled === true" [class.dd-item-active]="activeValue() === item.value" (click)="select(item)">
27137
+ <button type="button" class="dd-item" role="menuitem" tabindex="-1" [disabled]="item.disabled === true" [class.dd-item-active]="activeValue() === item.value" [attr.aria-current]="activeValue() === item.value ? 'true' : null" (click)="select(item)">
27108
27138
  @if (item.icon) {
27109
27139
  <svg class="dd-icon" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path [attr.d]="item.icon" /></svg>
27110
27140
  }
@@ -27120,7 +27150,7 @@ var DropdownComponent = class DropdownComponent {
27120
27150
  </div>
27121
27151
  `,
27122
27152
  isInline: true,
27123
- styles: [":host{display:inline-flex}.dd-wrapper{position:relative;display:inline-flex}:host(.dd-fixed){display:flex;max-width:100%}:host(.dd-fixed) .dd-wrapper{display:flex;flex:1 1 auto;min-width:0}:host(.dd-fixed) .dd-trigger{width:100%;min-width:0;justify-content:space-between}:host(.dd-fixed) .dd-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dd-trigger svg{flex-shrink:0}.dd-trigger{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-family:inherit;transition:all .15s ease}.dd-trigger:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}.dd-trigger-badge{padding:6px 14px;border-radius:999px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#64748b}.dd-trigger-badge:hover{background:#f8fafc;border-color:#94a3b8}.dd-trigger-badge.dd-active{background:#1e293b;color:#fff;border-color:#1e293b}.dd-trigger-btn{padding:6px 10px;border-radius:6px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#334155;transition:background .1s,border-color .1s}.dd-trigger-btn:hover{background:#f8fafc}.dd-trigger-btn.dd-open{border-color:#1e293b;background:#f8fafc}.dd-trigger-btn.dd-active{background:#1e293b;color:#fff;border-color:#1e293b}.dd-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:9999;background:#fff;border:1px solid #e2e8f0;border-radius:10px;box-shadow:0 4px 6px #0000000a,0 12px 28px #0000001a;max-height:70vh;overflow-y:auto;overflow-x:hidden;padding:0;max-width:calc(100vw - 32px);box-sizing:border-box}.dd-menu.dd-menu-end{left:auto;right:0}.dd-menu.dd-menu-up{top:auto;bottom:calc(100% + 6px)}.dd-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 14px;border:none;background:none;font-size:.875rem;font-weight:400;color:#1e293b;cursor:pointer;font-family:inherit;text-align:left;transition:background .1s;border-bottom:1px solid #f1f5f9;box-sizing:border-box}.dd-item:last-child{border-bottom:none}.dd-item:hover{background:#f8fafc}.dd-item:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}.dd-item.dd-item-active{background:#eff6ff;color:#2563eb}.dd-item:disabled{opacity:.5;cursor:not-allowed;background:none}.dd-icon{flex-shrink:0;color:#64748b}.dd-label{min-width:0}.dd-count{font-size:.6875rem;font-weight:700;margin-left:auto;background:#f1f5f9;color:#64748b;padding:1px 7px;border-radius:999px;flex-shrink:0}.dd-loading{display:flex;align-items:center;gap:8px;padding:12px;color:#64748b;font-size:.8125rem}.dd-spinner{width:14px;height:14px;border-radius:50%;flex-shrink:0;border:2px solid #e2e8f0;border-top-color:#64748b;animation:dd-spin .6s linear infinite}@keyframes dd-spin{to{transform:rotate(360deg)}}@media(pointer:coarse),(max-width:768px){.dd-trigger-badge,.dd-trigger-btn,.dd-item{min-height:44px}}@media(prefers-reduced-motion:reduce){.dd-spinner{animation-duration:2s}}\n"],
27153
+ styles: [":host{display:inline-flex}.dd-wrapper{position:relative;display:inline-flex}:host(.dd-fixed){display:flex;max-width:100%}:host(.dd-fixed) .dd-wrapper{display:flex;flex:1 1 auto;min-width:0}:host(.dd-fixed) .dd-trigger{width:100%;min-width:0;justify-content:space-between}:host(.dd-fixed) .dd-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dd-trigger svg{flex-shrink:0}.dd-trigger{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-family:inherit;transition:all .15s ease}.dd-trigger:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}.dd-trigger-badge{padding:6px 14px;border-radius:999px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#64748b}.dd-trigger-badge:hover{background:#f8fafc;border-color:#94a3b8}.dd-trigger-badge.dd-active{background:#1e293b;color:#fff;border-color:#1e293b}.dd-trigger-btn{padding:6px 10px;border-radius:6px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#334155;transition:background .1s,border-color .1s}.dd-trigger-btn:hover{background:#f8fafc}.dd-trigger-btn.dd-open{border-color:#1e293b;background:#f8fafc}.dd-trigger-btn.dd-active{background:#1e293b;color:#fff;border-color:#1e293b}.dd-trigger-btn.dd-trigger-md{padding:10px 16px;font-size:.875rem;border-radius:8px}.dd-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:9999;background:#fff;border:1px solid #e2e8f0;border-radius:10px;box-shadow:0 4px 6px #0000000a,0 12px 28px #0000001a;max-height:70vh;overflow-y:auto;overflow-x:hidden;padding:0;max-width:calc(100vw - 32px);box-sizing:border-box}.dd-menu.dd-menu-end{left:auto;right:0}.dd-menu.dd-menu-up{top:auto;bottom:calc(100% + 6px)}.dd-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 14px;border:none;background:none;font-size:.875rem;font-weight:400;color:#1e293b;cursor:pointer;font-family:inherit;text-align:left;transition:background .1s;border-bottom:1px solid #f1f5f9;box-sizing:border-box}.dd-item:last-child{border-bottom:none}.dd-item:hover{background:#f8fafc}.dd-item:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}.dd-item.dd-item-active{background:#eff6ff;color:#2563eb}.dd-item:disabled{opacity:.5;cursor:not-allowed;background:none}.dd-icon{flex-shrink:0;color:#64748b}.dd-label{min-width:0}.dd-count{font-size:.6875rem;font-weight:700;margin-left:auto;background:#f1f5f9;color:#64748b;padding:1px 7px;border-radius:999px;flex-shrink:0}.dd-loading{display:flex;align-items:center;gap:8px;padding:12px;color:#64748b;font-size:.8125rem}.dd-spinner{width:14px;height:14px;border-radius:50%;flex-shrink:0;border:2px solid #e2e8f0;border-top-color:#64748b;animation:dd-spin .6s linear infinite}@keyframes dd-spin{to{transform:rotate(360deg)}}@media(pointer:coarse),(max-width:768px){.dd-trigger-badge,.dd-trigger-btn,.dd-item{min-height:44px}}@media(prefers-reduced-motion:reduce){.dd-spinner{animation-duration:2s}}\n"],
27124
27154
  changeDetection: i0.ChangeDetectionStrategy.OnPush
27125
27155
  });
27126
27156
  }
@@ -27145,18 +27175,18 @@ i0.ɵɵngDeclareClassMetadata({
27145
27175
  template: `
27146
27176
  <div class="dd-wrapper">
27147
27177
  @if (variant() === 'badge') {
27148
- <button class="dd-trigger dd-trigger-badge" [class.dd-active]="active()" [class.dd-open]="open()" [attr.id]="triggerId" [attr.aria-label]="_ariaLabel()" [attr.aria-expanded]="open()" aria-haspopup="menu" [attr.aria-controls]="open() ? menuId : null" (click)="toggle($event)" (keydown)="onTriggerKeydown($event)" (keyup)="onTriggerKeyup($event)">
27178
+ <button type="button" class="dd-trigger dd-trigger-badge" [class.dd-active]="active()" [class.dd-open]="open()" [attr.id]="triggerId" [attr.aria-label]="_ariaLabel()" [attr.aria-expanded]="open()" aria-haspopup="menu" [attr.aria-controls]="open() ? menuId : null" (click)="toggle($event)" (keydown)="onTriggerKeydown($event)" (keyup)="onTriggerKeyup($event)">
27149
27179
  <span class="dd-text">{{ label() }}</span>
27150
27180
  <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="6 9 12 15 18 9"/></svg>
27151
27181
  </button>
27152
27182
  } @else {
27153
- <button class="dd-trigger dd-trigger-btn" [class.dd-active]="active()" [class.dd-open]="open()" [attr.id]="triggerId" [attr.aria-label]="_ariaLabel()" [attr.aria-expanded]="open()" aria-haspopup="menu" [attr.aria-controls]="open() ? menuId : null" (click)="toggle($event)" (keydown)="onTriggerKeydown($event)" (keyup)="onTriggerKeyup($event)">
27183
+ <button type="button" class="dd-trigger dd-trigger-btn" [class.dd-trigger-md]="size() === 'md'" [class.dd-active]="active()" [class.dd-open]="open()" [attr.id]="triggerId" [attr.aria-label]="_ariaLabel()" [attr.aria-expanded]="open()" aria-haspopup="menu" [attr.aria-controls]="open() ? menuId : null" (click)="toggle($event)" (keydown)="onTriggerKeydown($event)" (keyup)="onTriggerKeyup($event)">
27154
27184
  <span class="dd-text">{{ label() }}</span>
27155
27185
  <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="6 9 12 15 18 9"/></svg>
27156
27186
  </button>
27157
27187
  }
27158
27188
  @if (open()) {
27159
- <div class="dd-menu" role="menu" [attr.id]="menuId" [attr.aria-label]="_ariaLabel()" [attr.aria-labelledby]="_ariaLabel() ? null : triggerId" [style.min-width]="menuWidth()" [class.dd-menu-end]="alignEnd()" [class.dd-menu-up]="openUp()" [style.max-height.px]="menuMaxHeight()" (click)="$event.stopPropagation()" (keydown)="onMenuKeydown($event)">
27189
+ <div class="dd-menu" role="menu" [attr.id]="menuId" [attr.aria-label]="_ariaLabel()" [attr.aria-labelledby]="_ariaLabel() ? null : triggerId" [style.min-width]="menuWidth()" [class.dd-menu-end]="alignEnd()" [class.dd-menu-up]="openUp()" [style.max-height.px]="menuMaxHeight()" [attr.aria-busy]="loading() ? 'true' : null" (click)="$event.stopPropagation()" (keydown)="onMenuKeydown($event)">
27160
27190
  @if (loading()) {
27161
27191
  <div class="dd-loading">
27162
27192
  <span class="dd-spinner"></span>
@@ -27164,7 +27194,7 @@ i0.ɵɵngDeclareClassMetadata({
27164
27194
  </div>
27165
27195
  } @else {
27166
27196
  @for (item of displayItems(); track item.value) {
27167
- <button type="button" class="dd-item" role="menuitem" tabindex="-1" [disabled]="item.disabled === true" [class.dd-item-active]="activeValue() === item.value" (click)="select(item)">
27197
+ <button type="button" class="dd-item" role="menuitem" tabindex="-1" [disabled]="item.disabled === true" [class.dd-item-active]="activeValue() === item.value" [attr.aria-current]="activeValue() === item.value ? 'true' : null" (click)="select(item)">
27168
27198
  @if (item.icon) {
27169
27199
  <svg class="dd-icon" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path [attr.d]="item.icon" /></svg>
27170
27200
  }
@@ -27179,7 +27209,7 @@ i0.ɵɵngDeclareClassMetadata({
27179
27209
  }
27180
27210
  </div>
27181
27211
  `,
27182
- styles: [":host{display:inline-flex}.dd-wrapper{position:relative;display:inline-flex}:host(.dd-fixed){display:flex;max-width:100%}:host(.dd-fixed) .dd-wrapper{display:flex;flex:1 1 auto;min-width:0}:host(.dd-fixed) .dd-trigger{width:100%;min-width:0;justify-content:space-between}:host(.dd-fixed) .dd-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dd-trigger svg{flex-shrink:0}.dd-trigger{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-family:inherit;transition:all .15s ease}.dd-trigger:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}.dd-trigger-badge{padding:6px 14px;border-radius:999px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#64748b}.dd-trigger-badge:hover{background:#f8fafc;border-color:#94a3b8}.dd-trigger-badge.dd-active{background:#1e293b;color:#fff;border-color:#1e293b}.dd-trigger-btn{padding:6px 10px;border-radius:6px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#334155;transition:background .1s,border-color .1s}.dd-trigger-btn:hover{background:#f8fafc}.dd-trigger-btn.dd-open{border-color:#1e293b;background:#f8fafc}.dd-trigger-btn.dd-active{background:#1e293b;color:#fff;border-color:#1e293b}.dd-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:9999;background:#fff;border:1px solid #e2e8f0;border-radius:10px;box-shadow:0 4px 6px #0000000a,0 12px 28px #0000001a;max-height:70vh;overflow-y:auto;overflow-x:hidden;padding:0;max-width:calc(100vw - 32px);box-sizing:border-box}.dd-menu.dd-menu-end{left:auto;right:0}.dd-menu.dd-menu-up{top:auto;bottom:calc(100% + 6px)}.dd-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 14px;border:none;background:none;font-size:.875rem;font-weight:400;color:#1e293b;cursor:pointer;font-family:inherit;text-align:left;transition:background .1s;border-bottom:1px solid #f1f5f9;box-sizing:border-box}.dd-item:last-child{border-bottom:none}.dd-item:hover{background:#f8fafc}.dd-item:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}.dd-item.dd-item-active{background:#eff6ff;color:#2563eb}.dd-item:disabled{opacity:.5;cursor:not-allowed;background:none}.dd-icon{flex-shrink:0;color:#64748b}.dd-label{min-width:0}.dd-count{font-size:.6875rem;font-weight:700;margin-left:auto;background:#f1f5f9;color:#64748b;padding:1px 7px;border-radius:999px;flex-shrink:0}.dd-loading{display:flex;align-items:center;gap:8px;padding:12px;color:#64748b;font-size:.8125rem}.dd-spinner{width:14px;height:14px;border-radius:50%;flex-shrink:0;border:2px solid #e2e8f0;border-top-color:#64748b;animation:dd-spin .6s linear infinite}@keyframes dd-spin{to{transform:rotate(360deg)}}@media(pointer:coarse),(max-width:768px){.dd-trigger-badge,.dd-trigger-btn,.dd-item{min-height:44px}}@media(prefers-reduced-motion:reduce){.dd-spinner{animation-duration:2s}}\n"]
27212
+ styles: [":host{display:inline-flex}.dd-wrapper{position:relative;display:inline-flex}:host(.dd-fixed){display:flex;max-width:100%}:host(.dd-fixed) .dd-wrapper{display:flex;flex:1 1 auto;min-width:0}:host(.dd-fixed) .dd-trigger{width:100%;min-width:0;justify-content:space-between}:host(.dd-fixed) .dd-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dd-trigger svg{flex-shrink:0}.dd-trigger{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-family:inherit;transition:all .15s ease}.dd-trigger:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}.dd-trigger-badge{padding:6px 14px;border-radius:999px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#64748b}.dd-trigger-badge:hover{background:#f8fafc;border-color:#94a3b8}.dd-trigger-badge.dd-active{background:#1e293b;color:#fff;border-color:#1e293b}.dd-trigger-btn{padding:6px 10px;border-radius:6px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#334155;transition:background .1s,border-color .1s}.dd-trigger-btn:hover{background:#f8fafc}.dd-trigger-btn.dd-open{border-color:#1e293b;background:#f8fafc}.dd-trigger-btn.dd-active{background:#1e293b;color:#fff;border-color:#1e293b}.dd-trigger-btn.dd-trigger-md{padding:10px 16px;font-size:.875rem;border-radius:8px}.dd-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:9999;background:#fff;border:1px solid #e2e8f0;border-radius:10px;box-shadow:0 4px 6px #0000000a,0 12px 28px #0000001a;max-height:70vh;overflow-y:auto;overflow-x:hidden;padding:0;max-width:calc(100vw - 32px);box-sizing:border-box}.dd-menu.dd-menu-end{left:auto;right:0}.dd-menu.dd-menu-up{top:auto;bottom:calc(100% + 6px)}.dd-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 14px;border:none;background:none;font-size:.875rem;font-weight:400;color:#1e293b;cursor:pointer;font-family:inherit;text-align:left;transition:background .1s;border-bottom:1px solid #f1f5f9;box-sizing:border-box}.dd-item:last-child{border-bottom:none}.dd-item:hover{background:#f8fafc}.dd-item:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}.dd-item.dd-item-active{background:#eff6ff;color:#2563eb}.dd-item:disabled{opacity:.5;cursor:not-allowed;background:none}.dd-icon{flex-shrink:0;color:#64748b}.dd-label{min-width:0}.dd-count{font-size:.6875rem;font-weight:700;margin-left:auto;background:#f1f5f9;color:#64748b;padding:1px 7px;border-radius:999px;flex-shrink:0}.dd-loading{display:flex;align-items:center;gap:8px;padding:12px;color:#64748b;font-size:.8125rem}.dd-spinner{width:14px;height:14px;border-radius:50%;flex-shrink:0;border:2px solid #e2e8f0;border-top-color:#64748b;animation:dd-spin .6s linear infinite}@keyframes dd-spin{to{transform:rotate(360deg)}}@media(pointer:coarse),(max-width:768px){.dd-trigger-badge,.dd-trigger-btn,.dd-item{min-height:44px}}@media(prefers-reduced-motion:reduce){.dd-spinner{animation-duration:2s}}\n"]
27183
27213
  }]
27184
27214
  }],
27185
27215
  ctorParameters: () => [],
@@ -27232,6 +27262,14 @@ i0.ɵɵngDeclareClassMetadata({
27232
27262
  required: false
27233
27263
  }]
27234
27264
  }],
27265
+ size: [{
27266
+ type: i0.Input,
27267
+ args: [{
27268
+ isSignal: true,
27269
+ alias: "size",
27270
+ required: false
27271
+ }]
27272
+ }],
27235
27273
  menuWidth: [{
27236
27274
  type: i0.Input,
27237
27275
  args: [{
@@ -31500,11 +31538,13 @@ var PanelInfoListComponent = class PanelInfoListComponent {
31500
31538
  this.displaySections = computed(() => this.showEmptyState() ? this.sections() : this.sections().filter((s) => s.items.some((i) => !i.hidden)), ...ngDevMode ? [{ debugName: "displaySections" }] : /* istanbul ignore next */ []);
31501
31539
  }
31502
31540
  hrefOf(item) {
31503
- let raw = item.href?.trim() ?? "";
31504
- if (!raw && item.email?.trim()) raw = "mailto:" + item.email.trim();
31541
+ let raw = item.href?.replace(/[\u0000-\u001F]/g, "").trim() ?? "";
31542
+ if (!raw && item.email?.trim()) raw = "mailto:" + item.email.trim().replace(/[?#&%\s<>"]/g, (c) => encodeURIComponent(c));
31505
31543
  if (!raw && item.phone?.trim()) {
31506
- const p = item.phone.trim();
31507
- raw = "tel:" + (p.startsWith("+") ? "+" : "") + p.replace(/\D/g, "");
31544
+ const m = /^(.*?)(?:\s*(?:ext\.?|x|#)\s*(\d+))?\s*$/i.exec(item.phone.trim());
31545
+ const num = m[1];
31546
+ const digits = num.replace(/\D/g, "");
31547
+ if (digits) raw = "tel:" + (num.trim().startsWith("+") ? "+" : "") + digits + (m[2] ? ";ext=" + m[2] : "");
31508
31548
  }
31509
31549
  if (!raw) return null;
31510
31550
  const scheme = /^([a-z][a-z0-9+.\-]*):/i.exec(raw.replace(/[\u0000-\u0020]/g, ""));
@@ -31521,6 +31561,12 @@ var PanelInfoListComponent = class PanelInfoListComponent {
31521
31561
  textOf(item) {
31522
31562
  return item.value || item.email || item.phone || item.href || "";
31523
31563
  }
31564
+ valueOf(item) {
31565
+ return item.value?.trim() ? item.value : "—";
31566
+ }
31567
+ runHeaderAction(ha) {
31568
+ if (!ha.disabled) ha.action();
31569
+ }
31524
31570
  visibleItems(section) {
31525
31571
  return section.items.filter((i) => !i.hidden);
31526
31572
  }
@@ -31574,16 +31620,16 @@ var PanelInfoListComponent = class PanelInfoListComponent {
31574
31620
  host: { properties: { "class.pil-fill": "fill()" } },
31575
31621
  ngImport: i0,
31576
31622
  template: `
31577
- @for (section of displaySections(); track section.title ?? $index) {
31623
+ @for (section of displaySections(); track $index) {
31578
31624
  <div class="pil-section">
31579
- @if (section.title || section.headerAction) {
31625
+ @if (section.title || section.headerAction || section.headerLink) {
31580
31626
  <div class="pil-section-label">
31581
31627
  <span>{{ section.title }}</span>
31582
31628
  @if (section.headerLink) {
31583
31629
  <a class="pil-header-link" [routerLink]="section.headerLink.url">{{ section.headerLink.label }}</a>
31584
31630
  }
31585
31631
  @if (section.headerAction; as ha) {
31586
- <ui-button class="pil-header-action" variant="secondary" size="xs" [disabled]="!!ha.disabled" [ariaLabel]="ha.ariaLabel ?? ha.label" (click)="ha.action()">
31632
+ <ui-button class="pil-header-action" variant="secondary" size="xs" [disabled]="!!ha.disabled" [ariaLabel]="ha.ariaLabel ?? ha.label" (click)="runHeaderAction(ha)">
31587
31633
  @if (ha.icon) {
31588
31634
  <svg class="pil-header-action-icon" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path [attr.d]="ha.icon"/></svg>
31589
31635
  }{{ ha.label }}</ui-button>
@@ -31594,62 +31640,69 @@ var PanelInfoListComponent = class PanelInfoListComponent {
31594
31640
  <ui-empty-state message="No information available." />
31595
31641
  } @else if (section.columns === 2) {
31596
31642
  <div class="pil-grid-2">
31597
- @for (item of visibleItems(section); track item.label) {
31643
+ @for (item of visibleItems(section); track $index) {
31598
31644
  <div class="pil-grid-cell" [class.pil-strong]="item.emphasis">
31599
31645
  <span class="pil-label">{{ item.label }}{{ labelColon() ? ':' : '' }}</span>{{ labelColon() ? ' ' : '' }}
31600
31646
  <span class="pil-value pil-value--block">
31601
- @if (item.badge) {
31602
- <ui-badge [label]="item.badge.label" [variant]="item.badge.variant" />
31603
- } @else if (hrefOf(item); as h) {
31604
- <a class="pil-link pil-link--href" [attr.href]="h" [attr.target]="isWeb(h) ? '_blank' : null" [attr.rel]="isWeb(h) ? 'noopener noreferrer' : null">{{ textOf(item) }}</a>
31605
- } @else {
31606
- <span [class.pil-muted]="item.muted" [class.pil-danger]="item.danger" [class.pil-multiline]="item.multiline">{{ item.value || '—' }}</span>
31607
- }
31647
+ <ng-container *ngTemplateOutlet="valueTpl; context: { $implicit: item }" />
31608
31648
  </span>
31609
31649
  </div>
31610
31650
  }
31611
31651
  </div>
31612
31652
  } @else {
31613
- @for (item of visibleItems(section); track item.label) {
31653
+ @for (item of visibleItems(section); track $index) {
31614
31654
  <div class="pil-row" [class.pil-row--inline]="labelColon()" [class.pil-strong]="item.emphasis">
31615
31655
  <span class="pil-label">{{ item.label }}{{ labelColon() ? ':' : '' }}</span>{{ labelColon() ? ' ' : '' }}
31616
31656
  <span class="pil-value">
31617
- @if (item.badges) {
31618
- <span class="pil-badges">
31619
- @for (b of item.badges; track b.label) {
31620
- <ui-badge [label]="b.label" [variant]="b.variant" />
31621
- }
31622
- </span>
31623
- } @else if (item.badge) {
31624
- <ui-badge [label]="item.badge.label" [variant]="item.badge.variant" />
31625
- } @else if (hrefOf(item); as h) {
31626
- <a class="pil-link pil-link--href" [attr.href]="h" [attr.target]="isWeb(h) ? '_blank' : null" [attr.rel]="isWeb(h) ? 'noopener noreferrer' : null">{{ textOf(item) }}</a>
31627
- } @else if (item.link && item.value && item.linkIcon) {
31628
- <a class="pil-link-icon" [routerLink]="item.link">
31629
- {{ item.value }}
31630
- <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg>
31631
- </a>
31632
- } @else if (item.link && item.value) {
31633
- <a class="pil-link" [routerLink]="item.link">{{ item.value }}</a>
31634
- } @else {
31635
- <span [class.pil-muted]="item.muted" [class.pil-danger]="item.danger" [class.pil-multiline]="item.multiline">{{ item.value || '—' }}</span>
31636
- }
31637
- @if (item.editAction) {
31638
- <ui-icon class="pil-edit-btn" name="edit" [size]="14" [tooltip]="item.editTooltip ?? 'Edit'" (iconClick)="item.editAction!()" />
31639
- }
31640
- @if (item.deleteAction) {
31641
- <ui-icon class="pil-edit-btn" name="delete" variant="danger" [size]="14" [tooltip]="item.deleteTooltip ?? 'Delete'" (iconClick)="item.deleteAction!()" />
31642
- }
31657
+ <ng-container *ngTemplateOutlet="valueTpl; context: { $implicit: item }" />
31643
31658
  </span>
31644
31659
  </div>
31645
31660
  }
31646
31661
  }
31647
31662
  </div>
31648
31663
  }
31664
+ <ng-template #valueTpl let-item>
31665
+ @if (item.badges) {
31666
+ <span class="pil-badges">
31667
+ @for (b of item.badges; track $index) {
31668
+ <ui-badge [label]="b.label" [variant]="b.variant" />
31669
+ }
31670
+ </span>
31671
+ } @else if (item.badge) {
31672
+ <ui-badge [label]="item.badge.label" [variant]="item.badge.variant" />
31673
+ } @else if (hrefOf(item); as h) {
31674
+ <a class="pil-link pil-link--href" [attr.href]="h" [attr.target]="isWeb(h) ? '_blank' : null" [attr.rel]="isWeb(h) ? 'noopener noreferrer' : null">{{ textOf(item) }}</a>
31675
+ } @else if (item.link && item.value && item.linkIcon) {
31676
+ <a class="pil-link-icon" [routerLink]="item.link">
31677
+ {{ item.value }}
31678
+ <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg>
31679
+ </a>
31680
+ } @else if (item.link && item.value) {
31681
+ <a class="pil-link" [routerLink]="item.link">{{ item.value }}</a>
31682
+ } @else {
31683
+ <span [class.pil-muted]="item.muted" [class.pil-danger]="item.danger" [class.pil-multiline]="item.multiline">{{ valueOf(item) }}</span>
31684
+ }
31685
+ @if (item.editAction) {
31686
+ <ui-icon class="pil-edit-btn" name="edit" [size]="14" [tooltip]="item.editTooltip ?? 'Edit'" (iconClick)="item.editAction()" />
31687
+ }
31688
+ @if (item.deleteAction) {
31689
+ <ui-icon class="pil-edit-btn" name="delete" variant="danger" [size]="14" [tooltip]="item.deleteTooltip ?? 'Delete'" (iconClick)="item.deleteAction()" />
31690
+ }
31691
+ </ng-template>
31649
31692
  `,
31650
31693
  isInline: true,
31651
- styles: [":host{display:flex;flex-direction:column;gap:12px}:host(.pil-fill){flex:1;min-height:0}:host(.pil-fill) .pil-section{flex:1}.pil-section{border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.pil-section-label{display:flex;justify-content:space-between;align-items:center;font-size:.6875rem;font-weight:700;letter-spacing:.07em;color:#94a3b8;text-transform:uppercase;padding:8px 14px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.pil-header-action{text-transform:none;letter-spacing:0;margin:-4px 0;flex-shrink:0}.pil-header-action-icon{margin-right:6px;vertical-align:-2px;flex-shrink:0}.pil-header-link{font-size:.75rem;font-weight:500;color:#2563eb;text-decoration:none;text-transform:none;letter-spacing:0}.pil-header-link:hover{text-decoration:underline}.pil-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 14px;border-bottom:1px solid #f1f5f9}.pil-row:last-child{border-bottom:none}.pil-row--inline{justify-content:flex-start}.pil-row--inline .pil-value{text-align:left;justify-content:flex-start;flex-wrap:wrap;min-width:0;overflow-wrap:anywhere;word-break:break-word}.pil-label{font-size:.8125rem;color:#64748b;flex-shrink:0}.pil-value{font-size:.875rem;font-weight:500;color:#1e293b;text-align:right;display:flex;align-items:center;justify-content:flex-end}.pil-multiline{white-space:pre-line;overflow-wrap:anywhere;word-break:break-word}.pil-strong .pil-label,.pil-strong .pil-value,.pil-strong .pil-muted{font-weight:700;color:#0f172a}.pil-badges{display:flex;align-items:center;gap:4px;flex-wrap:wrap;justify-content:flex-end}.pil-edit-btn{margin-left:4px;flex-shrink:0}ui-empty-state{padding:12px 0}.pil-muted{color:#1e293b;font-weight:400}.pil-danger{color:#ef4444;font-weight:600}.pil-link{font-size:.875rem;font-weight:500;color:#2563eb;text-decoration:none}.pil-link:hover{text-decoration:underline}.pil-link--href{overflow-wrap:anywhere;word-break:break-word}.pil-link:focus-visible,.pil-header-link:focus-visible{outline:2px solid #3b82f6;outline-offset:2px;border-radius:2px}.pil-link-icon{display:inline-flex;align-items:center;gap:5px;font-size:.875rem;font-weight:500;color:#1e293b;text-decoration:none}.pil-link-icon svg{color:#94a3b8;flex-shrink:0}.pil-grid-2{display:grid;grid-template-columns:1fr 1fr}.pil-grid-cell{display:flex;flex-direction:column;gap:3px;padding:10px 14px;border-right:1px solid #f1f5f9}.pil-grid-cell:last-child{border-right:none}.pil-value--block{text-align:left;justify-content:flex-start}\n"],
31694
+ styles: [":host{display:flex;flex-direction:column;gap:12px}:host(.pil-fill){flex:1;min-height:0}:host(.pil-fill) .pil-section{flex:1}.pil-section{border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.pil-section-label{display:flex;justify-content:space-between;align-items:center;font-size:.6875rem;font-weight:700;letter-spacing:.07em;color:#94a3b8;text-transform:uppercase;padding:8px 14px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.pil-header-action{text-transform:none;letter-spacing:0;margin:-4px 0;flex-shrink:0}.pil-header-action-icon{margin-right:6px;vertical-align:-2px;flex-shrink:0}.pil-header-link{font-size:.75rem;font-weight:500;color:#2563eb;text-decoration:none;text-transform:none;letter-spacing:0}.pil-header-link:hover{text-decoration:underline}.pil-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 14px;border-bottom:1px solid #f1f5f9}.pil-row:last-child{border-bottom:none}.pil-row--inline{justify-content:flex-start}.pil-row--inline .pil-value{text-align:left;justify-content:flex-start;flex-wrap:wrap;min-width:0;overflow-wrap:anywhere;word-break:break-word}.pil-label{font-size:.8125rem;color:#64748b;flex-shrink:0}.pil-value{font-size:.875rem;font-weight:500;color:#1e293b;text-align:right;display:flex;align-items:center;justify-content:flex-end;min-width:0;overflow-wrap:anywhere;word-break:break-word}.pil-multiline{white-space:pre-line;overflow-wrap:anywhere;word-break:break-word}.pil-strong .pil-label,.pil-strong .pil-value,.pil-strong .pil-muted{font-weight:700;color:#0f172a}.pil-badges{display:flex;align-items:center;gap:4px;flex-wrap:wrap;justify-content:flex-end}.pil-edit-btn{margin-left:4px;flex-shrink:0}ui-empty-state{padding:12px 0}.pil-muted{color:#1e293b;font-weight:400}.pil-danger{color:#ef4444;font-weight:600}.pil-link{font-size:.875rem;font-weight:500;color:#2563eb;text-decoration:none}.pil-link:hover{text-decoration:underline}.pil-link,.pil-link-icon,.pil-header-link{position:relative}@media(pointer:coarse),(max-width:480px){.pil-link:after,.pil-link-icon:after,.pil-header-link:after{content:\"\";position:absolute;inset:-14px -4px}}.pil-link--href{overflow-wrap:anywhere;word-break:break-word}.pil-link:focus-visible,.pil-link-icon:focus-visible,.pil-header-link:focus-visible{outline:2px solid #3b82f6;outline-offset:2px;border-radius:2px}.pil-link-icon{display:inline-flex;align-items:center;gap:5px;font-size:.875rem;font-weight:500;color:#1e293b;text-decoration:none}.pil-link-icon svg{color:#94a3b8;flex-shrink:0}.pil-grid-2{display:grid;grid-template-columns:1fr 1fr}.pil-grid-cell{display:flex;flex-direction:column;gap:3px;padding:10px 14px;min-width:0;border-right:1px solid #f1f5f9}.pil-grid-cell:last-child{border-right:none}.pil-grid-cell:nth-child(2n){border-right:none}@media(max-width:480px){.pil-grid-2{grid-template-columns:1fr}.pil-grid-cell{border-right:none;border-bottom:1px solid #f1f5f9}.pil-grid-cell:last-child{border-bottom:none}}.pil-value--block{text-align:left;justify-content:flex-start}\n"],
31652
31695
  dependencies: [
31696
+ {
31697
+ kind: "directive",
31698
+ type: NgTemplateOutlet,
31699
+ selector: "[ngTemplateOutlet]",
31700
+ inputs: [
31701
+ "ngTemplateOutletContext",
31702
+ "ngTemplateOutlet",
31703
+ "ngTemplateOutletInjector"
31704
+ ]
31705
+ },
31653
31706
  {
31654
31707
  kind: "component",
31655
31708
  type: BadgeComponent,
@@ -31748,6 +31801,7 @@ i0.ɵɵngDeclareClassMetadata({
31748
31801
  standalone: true,
31749
31802
  changeDetection: ChangeDetectionStrategy.OnPush,
31750
31803
  imports: [
31804
+ NgTemplateOutlet,
31751
31805
  BadgeComponent,
31752
31806
  ButtonComponent,
31753
31807
  RouterLink,
@@ -31756,16 +31810,16 @@ i0.ɵɵngDeclareClassMetadata({
31756
31810
  ],
31757
31811
  host: { "[class.pil-fill]": "fill()" },
31758
31812
  template: `
31759
- @for (section of displaySections(); track section.title ?? $index) {
31813
+ @for (section of displaySections(); track $index) {
31760
31814
  <div class="pil-section">
31761
- @if (section.title || section.headerAction) {
31815
+ @if (section.title || section.headerAction || section.headerLink) {
31762
31816
  <div class="pil-section-label">
31763
31817
  <span>{{ section.title }}</span>
31764
31818
  @if (section.headerLink) {
31765
31819
  <a class="pil-header-link" [routerLink]="section.headerLink.url">{{ section.headerLink.label }}</a>
31766
31820
  }
31767
31821
  @if (section.headerAction; as ha) {
31768
- <ui-button class="pil-header-action" variant="secondary" size="xs" [disabled]="!!ha.disabled" [ariaLabel]="ha.ariaLabel ?? ha.label" (click)="ha.action()">
31822
+ <ui-button class="pil-header-action" variant="secondary" size="xs" [disabled]="!!ha.disabled" [ariaLabel]="ha.ariaLabel ?? ha.label" (click)="runHeaderAction(ha)">
31769
31823
  @if (ha.icon) {
31770
31824
  <svg class="pil-header-action-icon" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path [attr.d]="ha.icon"/></svg>
31771
31825
  }{{ ha.label }}</ui-button>
@@ -31776,60 +31830,57 @@ i0.ɵɵngDeclareClassMetadata({
31776
31830
  <ui-empty-state message="No information available." />
31777
31831
  } @else if (section.columns === 2) {
31778
31832
  <div class="pil-grid-2">
31779
- @for (item of visibleItems(section); track item.label) {
31833
+ @for (item of visibleItems(section); track $index) {
31780
31834
  <div class="pil-grid-cell" [class.pil-strong]="item.emphasis">
31781
31835
  <span class="pil-label">{{ item.label }}{{ labelColon() ? ':' : '' }}</span>{{ labelColon() ? ' ' : '' }}
31782
31836
  <span class="pil-value pil-value--block">
31783
- @if (item.badge) {
31784
- <ui-badge [label]="item.badge.label" [variant]="item.badge.variant" />
31785
- } @else if (hrefOf(item); as h) {
31786
- <a class="pil-link pil-link--href" [attr.href]="h" [attr.target]="isWeb(h) ? '_blank' : null" [attr.rel]="isWeb(h) ? 'noopener noreferrer' : null">{{ textOf(item) }}</a>
31787
- } @else {
31788
- <span [class.pil-muted]="item.muted" [class.pil-danger]="item.danger" [class.pil-multiline]="item.multiline">{{ item.value || '—' }}</span>
31789
- }
31837
+ <ng-container *ngTemplateOutlet="valueTpl; context: { $implicit: item }" />
31790
31838
  </span>
31791
31839
  </div>
31792
31840
  }
31793
31841
  </div>
31794
31842
  } @else {
31795
- @for (item of visibleItems(section); track item.label) {
31843
+ @for (item of visibleItems(section); track $index) {
31796
31844
  <div class="pil-row" [class.pil-row--inline]="labelColon()" [class.pil-strong]="item.emphasis">
31797
31845
  <span class="pil-label">{{ item.label }}{{ labelColon() ? ':' : '' }}</span>{{ labelColon() ? ' ' : '' }}
31798
31846
  <span class="pil-value">
31799
- @if (item.badges) {
31800
- <span class="pil-badges">
31801
- @for (b of item.badges; track b.label) {
31802
- <ui-badge [label]="b.label" [variant]="b.variant" />
31803
- }
31804
- </span>
31805
- } @else if (item.badge) {
31806
- <ui-badge [label]="item.badge.label" [variant]="item.badge.variant" />
31807
- } @else if (hrefOf(item); as h) {
31808
- <a class="pil-link pil-link--href" [attr.href]="h" [attr.target]="isWeb(h) ? '_blank' : null" [attr.rel]="isWeb(h) ? 'noopener noreferrer' : null">{{ textOf(item) }}</a>
31809
- } @else if (item.link && item.value && item.linkIcon) {
31810
- <a class="pil-link-icon" [routerLink]="item.link">
31811
- {{ item.value }}
31812
- <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg>
31813
- </a>
31814
- } @else if (item.link && item.value) {
31815
- <a class="pil-link" [routerLink]="item.link">{{ item.value }}</a>
31816
- } @else {
31817
- <span [class.pil-muted]="item.muted" [class.pil-danger]="item.danger" [class.pil-multiline]="item.multiline">{{ item.value || '—' }}</span>
31818
- }
31819
- @if (item.editAction) {
31820
- <ui-icon class="pil-edit-btn" name="edit" [size]="14" [tooltip]="item.editTooltip ?? 'Edit'" (iconClick)="item.editAction!()" />
31821
- }
31822
- @if (item.deleteAction) {
31823
- <ui-icon class="pil-edit-btn" name="delete" variant="danger" [size]="14" [tooltip]="item.deleteTooltip ?? 'Delete'" (iconClick)="item.deleteAction!()" />
31824
- }
31847
+ <ng-container *ngTemplateOutlet="valueTpl; context: { $implicit: item }" />
31825
31848
  </span>
31826
31849
  </div>
31827
31850
  }
31828
31851
  }
31829
31852
  </div>
31830
31853
  }
31854
+ <ng-template #valueTpl let-item>
31855
+ @if (item.badges) {
31856
+ <span class="pil-badges">
31857
+ @for (b of item.badges; track $index) {
31858
+ <ui-badge [label]="b.label" [variant]="b.variant" />
31859
+ }
31860
+ </span>
31861
+ } @else if (item.badge) {
31862
+ <ui-badge [label]="item.badge.label" [variant]="item.badge.variant" />
31863
+ } @else if (hrefOf(item); as h) {
31864
+ <a class="pil-link pil-link--href" [attr.href]="h" [attr.target]="isWeb(h) ? '_blank' : null" [attr.rel]="isWeb(h) ? 'noopener noreferrer' : null">{{ textOf(item) }}</a>
31865
+ } @else if (item.link && item.value && item.linkIcon) {
31866
+ <a class="pil-link-icon" [routerLink]="item.link">
31867
+ {{ item.value }}
31868
+ <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg>
31869
+ </a>
31870
+ } @else if (item.link && item.value) {
31871
+ <a class="pil-link" [routerLink]="item.link">{{ item.value }}</a>
31872
+ } @else {
31873
+ <span [class.pil-muted]="item.muted" [class.pil-danger]="item.danger" [class.pil-multiline]="item.multiline">{{ valueOf(item) }}</span>
31874
+ }
31875
+ @if (item.editAction) {
31876
+ <ui-icon class="pil-edit-btn" name="edit" [size]="14" [tooltip]="item.editTooltip ?? 'Edit'" (iconClick)="item.editAction()" />
31877
+ }
31878
+ @if (item.deleteAction) {
31879
+ <ui-icon class="pil-edit-btn" name="delete" variant="danger" [size]="14" [tooltip]="item.deleteTooltip ?? 'Delete'" (iconClick)="item.deleteAction()" />
31880
+ }
31881
+ </ng-template>
31831
31882
  `,
31832
- styles: [":host{display:flex;flex-direction:column;gap:12px}:host(.pil-fill){flex:1;min-height:0}:host(.pil-fill) .pil-section{flex:1}.pil-section{border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.pil-section-label{display:flex;justify-content:space-between;align-items:center;font-size:.6875rem;font-weight:700;letter-spacing:.07em;color:#94a3b8;text-transform:uppercase;padding:8px 14px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.pil-header-action{text-transform:none;letter-spacing:0;margin:-4px 0;flex-shrink:0}.pil-header-action-icon{margin-right:6px;vertical-align:-2px;flex-shrink:0}.pil-header-link{font-size:.75rem;font-weight:500;color:#2563eb;text-decoration:none;text-transform:none;letter-spacing:0}.pil-header-link:hover{text-decoration:underline}.pil-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 14px;border-bottom:1px solid #f1f5f9}.pil-row:last-child{border-bottom:none}.pil-row--inline{justify-content:flex-start}.pil-row--inline .pil-value{text-align:left;justify-content:flex-start;flex-wrap:wrap;min-width:0;overflow-wrap:anywhere;word-break:break-word}.pil-label{font-size:.8125rem;color:#64748b;flex-shrink:0}.pil-value{font-size:.875rem;font-weight:500;color:#1e293b;text-align:right;display:flex;align-items:center;justify-content:flex-end}.pil-multiline{white-space:pre-line;overflow-wrap:anywhere;word-break:break-word}.pil-strong .pil-label,.pil-strong .pil-value,.pil-strong .pil-muted{font-weight:700;color:#0f172a}.pil-badges{display:flex;align-items:center;gap:4px;flex-wrap:wrap;justify-content:flex-end}.pil-edit-btn{margin-left:4px;flex-shrink:0}ui-empty-state{padding:12px 0}.pil-muted{color:#1e293b;font-weight:400}.pil-danger{color:#ef4444;font-weight:600}.pil-link{font-size:.875rem;font-weight:500;color:#2563eb;text-decoration:none}.pil-link:hover{text-decoration:underline}.pil-link--href{overflow-wrap:anywhere;word-break:break-word}.pil-link:focus-visible,.pil-header-link:focus-visible{outline:2px solid #3b82f6;outline-offset:2px;border-radius:2px}.pil-link-icon{display:inline-flex;align-items:center;gap:5px;font-size:.875rem;font-weight:500;color:#1e293b;text-decoration:none}.pil-link-icon svg{color:#94a3b8;flex-shrink:0}.pil-grid-2{display:grid;grid-template-columns:1fr 1fr}.pil-grid-cell{display:flex;flex-direction:column;gap:3px;padding:10px 14px;border-right:1px solid #f1f5f9}.pil-grid-cell:last-child{border-right:none}.pil-value--block{text-align:left;justify-content:flex-start}\n"]
31883
+ styles: [":host{display:flex;flex-direction:column;gap:12px}:host(.pil-fill){flex:1;min-height:0}:host(.pil-fill) .pil-section{flex:1}.pil-section{border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.pil-section-label{display:flex;justify-content:space-between;align-items:center;font-size:.6875rem;font-weight:700;letter-spacing:.07em;color:#94a3b8;text-transform:uppercase;padding:8px 14px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.pil-header-action{text-transform:none;letter-spacing:0;margin:-4px 0;flex-shrink:0}.pil-header-action-icon{margin-right:6px;vertical-align:-2px;flex-shrink:0}.pil-header-link{font-size:.75rem;font-weight:500;color:#2563eb;text-decoration:none;text-transform:none;letter-spacing:0}.pil-header-link:hover{text-decoration:underline}.pil-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 14px;border-bottom:1px solid #f1f5f9}.pil-row:last-child{border-bottom:none}.pil-row--inline{justify-content:flex-start}.pil-row--inline .pil-value{text-align:left;justify-content:flex-start;flex-wrap:wrap;min-width:0;overflow-wrap:anywhere;word-break:break-word}.pil-label{font-size:.8125rem;color:#64748b;flex-shrink:0}.pil-value{font-size:.875rem;font-weight:500;color:#1e293b;text-align:right;display:flex;align-items:center;justify-content:flex-end;min-width:0;overflow-wrap:anywhere;word-break:break-word}.pil-multiline{white-space:pre-line;overflow-wrap:anywhere;word-break:break-word}.pil-strong .pil-label,.pil-strong .pil-value,.pil-strong .pil-muted{font-weight:700;color:#0f172a}.pil-badges{display:flex;align-items:center;gap:4px;flex-wrap:wrap;justify-content:flex-end}.pil-edit-btn{margin-left:4px;flex-shrink:0}ui-empty-state{padding:12px 0}.pil-muted{color:#1e293b;font-weight:400}.pil-danger{color:#ef4444;font-weight:600}.pil-link{font-size:.875rem;font-weight:500;color:#2563eb;text-decoration:none}.pil-link:hover{text-decoration:underline}.pil-link,.pil-link-icon,.pil-header-link{position:relative}@media(pointer:coarse),(max-width:480px){.pil-link:after,.pil-link-icon:after,.pil-header-link:after{content:\"\";position:absolute;inset:-14px -4px}}.pil-link--href{overflow-wrap:anywhere;word-break:break-word}.pil-link:focus-visible,.pil-link-icon:focus-visible,.pil-header-link:focus-visible{outline:2px solid #3b82f6;outline-offset:2px;border-radius:2px}.pil-link-icon{display:inline-flex;align-items:center;gap:5px;font-size:.875rem;font-weight:500;color:#1e293b;text-decoration:none}.pil-link-icon svg{color:#94a3b8;flex-shrink:0}.pil-grid-2{display:grid;grid-template-columns:1fr 1fr}.pil-grid-cell{display:flex;flex-direction:column;gap:3px;padding:10px 14px;min-width:0;border-right:1px solid #f1f5f9}.pil-grid-cell:last-child{border-right:none}.pil-grid-cell:nth-child(2n){border-right:none}@media(max-width:480px){.pil-grid-2{grid-template-columns:1fr}.pil-grid-cell{border-right:none;border-bottom:1px solid #f1f5f9}.pil-grid-cell:last-child{border-bottom:none}}.pil-value--block{text-align:left;justify-content:flex-start}\n"]
31833
31884
  }]
31834
31885
  }],
31835
31886
  propDecorators: {
@@ -32263,7 +32314,8 @@ var AppShellComponent = class AppShellComponent {
32263
32314
  this.logoutClick = output();
32264
32315
  this._sidebarOpen = signal(false, ...ngDevMode ? [{ debugName: "_sidebarOpen" }] : /* istanbul ignore next */ []);
32265
32316
  this._collapsed = signal(AppShellComponent._loadCollapsed(), ...ngDevMode ? [{ debugName: "_collapsed" }] : /* istanbul ignore next */ []);
32266
- this._isRail = computed(() => this.collapsible() && this._collapsed(), ...ngDevMode ? [{ debugName: "_isRail" }] : /* istanbul ignore next */ []);
32317
+ this._drawerLayout = signal(false, ...ngDevMode ? [{ debugName: "_drawerLayout" }] : /* istanbul ignore next */ []);
32318
+ this._isRail = computed(() => this.collapsible() && this._collapsed() && !this._drawerLayout(), ...ngDevMode ? [{ debugName: "_isRail" }] : /* istanbul ignore next */ []);
32267
32319
  this._collapsedGroups = signal({}, ...ngDevMode ? [{ debugName: "_collapsedGroups" }] : /* istanbul ignore next */ []);
32268
32320
  this._visibleGroups = computed(() => this.navGroups().filter((g) => g.visible !== false), ...ngDevMode ? [{ debugName: "_visibleGroups" }] : /* istanbul ignore next */ []);
32269
32321
  this._userInitials = computed(() => {
@@ -32275,6 +32327,13 @@ var AppShellComponent = class AppShellComponent {
32275
32327
  return [u?.firstName, u?.lastName].filter(Boolean).join(" ");
32276
32328
  }, ...ngDevMode ? [{ debugName: "_userName" }] : /* istanbul ignore next */ []);
32277
32329
  this._iconCache = /* @__PURE__ */ new Map();
32330
+ this._host = inject(ElementRef);
32331
+ this._injector = inject(Injector);
32332
+ this._document = inject(DOCUMENT, { optional: true });
32333
+ this._onDrawerMqChange = (e) => {
32334
+ this._drawerLayout.set(e.matches);
32335
+ if (!e.matches) this._sidebarOpen.set(false);
32336
+ };
32278
32337
  }
32279
32338
  _safeIcon(svg) {
32280
32339
  let safe = this._iconCache.get(svg);
@@ -32287,8 +32346,11 @@ var AppShellComponent = class AppShellComponent {
32287
32346
  _visibleLinks(group) {
32288
32347
  return group.links.filter((l) => l.visible !== false);
32289
32348
  }
32349
+ _canCollapseGroups() {
32350
+ return this._visibleGroups().length > 1;
32351
+ }
32290
32352
  _isCollapsed(key) {
32291
- return !!this._collapsedGroups()[key];
32353
+ return this._canCollapseGroups() && !!this._collapsedGroups()[key];
32292
32354
  }
32293
32355
  toggleGroup(key) {
32294
32356
  const collapsed = !this._collapsedGroups()[key];
@@ -32337,11 +32399,83 @@ var AppShellComponent = class AppShellComponent {
32337
32399
  return false;
32338
32400
  }
32339
32401
  }
32402
+ static {
32403
+ this._DRAWER_MQ = "not all and (min-width: 1025px)";
32404
+ }
32405
+ static {
32406
+ this._FOCUSABLE = "a[href]:not([tabindex=\"-1\"]), button:not([disabled]):not([tabindex=\"-1\"]), input:not([disabled]):not([type=\"hidden\"]):not([tabindex=\"-1\"]), select:not([disabled]):not([tabindex=\"-1\"]), textarea:not([disabled]):not([tabindex=\"-1\"]), [tabindex]:not([tabindex=\"-1\"]), summary:not([tabindex=\"-1\"]), [contenteditable]:not([contenteditable=\"false\"]):not([tabindex=\"-1\"]), iframe:not([tabindex=\"-1\"]), audio[controls]:not([tabindex=\"-1\"]), video[controls]:not([tabindex=\"-1\"])";
32407
+ }
32408
+ _sidebarFocusables() {
32409
+ const aside = this._host.nativeElement.querySelector(".sidebar");
32410
+ return aside ? Array.from(aside.querySelectorAll(AppShellComponent._FOCUSABLE)).filter((el) => !el.hidden && el.getClientRects().length > 0) : [];
32411
+ }
32412
+ _hamburger() {
32413
+ return this._host.nativeElement.querySelector(".hamburger");
32414
+ }
32340
32415
  toggleSidebar() {
32341
- this._sidebarOpen.update((v) => !v);
32416
+ if (this._sidebarOpen()) this.closeSidebar(true);
32417
+ else this.openSidebar();
32418
+ }
32419
+ openSidebar() {
32420
+ if (!this._drawerLayout()) return;
32421
+ this._sidebarOpen.set(true);
32422
+ afterNextRender(() => this._sidebarFocusables()[0]?.focus(), { injector: this._injector });
32342
32423
  }
32343
- closeSidebar() {
32424
+ closeSidebar(returnFocus = false) {
32425
+ const wasOpen = this._sidebarOpen();
32344
32426
  this._sidebarOpen.set(false);
32427
+ if (!wasOpen) return;
32428
+ const active = this._document?.activeElement ?? null;
32429
+ const focusInSidebar = !!active && !!this._host.nativeElement.querySelector(".sidebar")?.contains(active);
32430
+ if (returnFocus) this._hamburger()?.focus();
32431
+ else if (focusInSidebar) this._host.nativeElement.querySelector("#main-content")?.focus();
32432
+ }
32433
+ onShellKeydown(e) {
32434
+ if (e.defaultPrevented || !this._sidebarOpen() || !this._drawerLayout()) return;
32435
+ if (e.key === "Escape") {
32436
+ e.preventDefault();
32437
+ this.closeSidebar(true);
32438
+ return;
32439
+ }
32440
+ if (e.key !== "Tab" || e.ctrlKey || e.altKey || e.metaKey) return;
32441
+ const items = this._sidebarFocusables();
32442
+ if (!items.length) return;
32443
+ const first = items[0];
32444
+ const last = items[items.length - 1];
32445
+ const active = this._document?.activeElement ?? null;
32446
+ const owner = active ? items.find((el) => el === active || el.contains(active)) : void 0;
32447
+ if (owner) {
32448
+ if (e.shiftKey && owner === first) {
32449
+ e.preventDefault();
32450
+ last.focus();
32451
+ } else if (!e.shiftKey && owner === last) {
32452
+ e.preventDefault();
32453
+ first.focus();
32454
+ }
32455
+ return;
32456
+ }
32457
+ const host = active && active.shadowRoot && this._host.nativeElement.querySelector(".sidebar")?.contains(active) ? active : null;
32458
+ if (host) {
32459
+ const inner = Array.from(host.shadowRoot.querySelectorAll(AppShellComponent._FOCUSABLE)).filter((el) => !el.hidden && el.getClientRects().length > 0);
32460
+ const innerActive = host.shadowRoot.activeElement;
32461
+ const atInnerEdge = !innerActive || !inner.length || innerActive === (e.shiftKey ? inner[0] : inner[inner.length - 1]);
32462
+ const afterAll = items.every((el) => !!(el.compareDocumentPosition(host) & Node.DOCUMENT_POSITION_FOLLOWING));
32463
+ const beforeAll = items.every((el) => !!(el.compareDocumentPosition(host) & Node.DOCUMENT_POSITION_PRECEDING));
32464
+ if (atInnerEdge && !e.shiftKey && afterAll) {
32465
+ e.preventDefault();
32466
+ first.focus();
32467
+ } else if (atInnerEdge && e.shiftKey && beforeAll) {
32468
+ e.preventDefault();
32469
+ last.focus();
32470
+ }
32471
+ return;
32472
+ }
32473
+ e.preventDefault();
32474
+ (e.shiftKey ? last : first).focus();
32475
+ }
32476
+ skipToContent(e) {
32477
+ e.preventDefault();
32478
+ this._host.nativeElement.querySelector("#main-content")?.focus();
32345
32479
  }
32346
32480
  ngOnInit() {
32347
32481
  const initial = {};
@@ -32353,13 +32487,19 @@ var AppShellComponent = class AppShellComponent {
32353
32487
  ...this._readSavedGroups()
32354
32488
  });
32355
32489
  this._routerSub = this.router.events.pipe(filter((e) => e instanceof NavigationEnd)).subscribe((e) => {
32356
- this._sidebarOpen.set(false);
32490
+ this.closeSidebar();
32357
32491
  this._expandActiveGroup(e.urlAfterRedirects);
32358
32492
  });
32493
+ if (typeof matchMedia === "function") {
32494
+ this._drawerMq = matchMedia(AppShellComponent._DRAWER_MQ);
32495
+ this._drawerLayout.set(!!this._drawerMq?.matches);
32496
+ this._drawerMq?.addEventListener?.("change", this._onDrawerMqChange);
32497
+ }
32359
32498
  this._expandActiveGroup(this.router.url);
32360
32499
  }
32361
32500
  ngOnDestroy() {
32362
32501
  this._routerSub?.unsubscribe();
32502
+ this._drawerMq?.removeEventListener?.("change", this._onDrawerMqChange);
32363
32503
  this._iconCache.clear();
32364
32504
  }
32365
32505
  _expandActiveGroup(url) {
@@ -32465,11 +32605,15 @@ var AppShellComponent = class AppShellComponent {
32465
32605
  class="shell"
32466
32606
  [class.sidebar-open]="_sidebarOpen()"
32467
32607
  [class.collapsed]="_isRail()"
32608
+ (keydown)="onShellKeydown($event)"
32468
32609
  [style.--shell-bg]="backgroundColor() || null"
32469
32610
  [style.--shell-text]="textColor() || null"
32470
32611
  >
32471
32612
  <ui-shell-projected-styles />
32472
32613
 
32614
+ <!-- Keyboard users jump past the navigation straight to the page content -->
32615
+ <a class="skip-link" href="#main-content" (click)="skipToContent($event)">Skip to main content</a>
32616
+
32473
32617
  <!-- Mobile backdrop -->
32474
32618
  <div
32475
32619
  class="sidebar-backdrop"
@@ -32516,6 +32660,7 @@ var AppShellComponent = class AppShellComponent {
32516
32660
  @for (group of _visibleGroups(); track group.key) {
32517
32661
  <div class="nav-group">
32518
32662
  @if (_isRail()) { <div class="rail-divider" aria-hidden="true"></div> }
32663
+ @if (_canCollapseGroups()) {
32519
32664
  <button
32520
32665
  class="nav-group-label"
32521
32666
  type="button"
@@ -32534,38 +32679,44 @@ var AppShellComponent = class AppShellComponent {
32534
32679
  </svg>
32535
32680
  {{ group.label }}
32536
32681
  </button>
32537
-
32538
- @if (_isRail() || !_isCollapsed(group.key)) {
32539
- <div [id]="'navg-' + group.key" role="list">
32540
- @for (link of _visibleLinks(group); track link.route) {
32541
- <a
32542
- role="listitem"
32543
- [routerLink]="link.route"
32544
- routerLinkActive="active"
32545
- [routerLinkActiveOptions]="{ exact: !!link.exact }"
32546
- #rla="routerLinkActive"
32547
- [attr.aria-current]="rla.isActive ? 'page' : null"
32548
- [attr.title]="_isRail() ? link.label : null"
32549
- [attr.aria-label]="_isRail() ? link.label : null"
32550
- >
32551
- @if (link.icon) {
32552
- <span
32553
- class="nav-icon"
32554
- [innerHTML]="_safeIcon(link.icon)"
32555
- aria-hidden="true"
32556
- ></span>
32557
- }
32558
- <span class="nav-label">{{ link.label }}</span>
32559
- @if (link.badge && link.badge > 0) {
32560
- <span
32561
- class="nav-badge"
32562
- [attr.aria-label]="link.badge + ' unread'"
32563
- >{{ link.badge }}</span>
32564
- }
32565
- </a>
32566
- }
32567
- </div>
32682
+ } @else {
32683
+ <!-- A single group can't be collapsed: hiding it would remove the whole navigation -->
32684
+ <div class="nav-group-label nav-group-label--static" [id]="'navg-label-' + group.key">{{ group.label }}</div>
32568
32685
  }
32686
+
32687
+ <!-- Always rendered so the toggle's aria-controls resolves; [hidden] (plus display:none in the CSS) removes the links of a collapsed group from view and from the tab order -->
32688
+ <div
32689
+ class="nav-group-links"
32690
+ [id]="'navg-' + group.key"
32691
+ [hidden]="!_isRail() && _isCollapsed(group.key)"
32692
+ >
32693
+ @for (link of _visibleLinks(group); track link.route) {
32694
+ <a
32695
+ [routerLink]="link.route"
32696
+ routerLinkActive="active"
32697
+ [routerLinkActiveOptions]="{ exact: !!link.exact }"
32698
+ #rla="routerLinkActive"
32699
+ [attr.aria-current]="rla.isActive ? 'page' : null"
32700
+ [attr.title]="_isRail() ? link.label : null"
32701
+ [attr.aria-label]="_isRail() ? link.label : null"
32702
+ >
32703
+ @if (link.icon) {
32704
+ <span
32705
+ class="nav-icon"
32706
+ [innerHTML]="_safeIcon(link.icon)"
32707
+ aria-hidden="true"
32708
+ ></span>
32709
+ }
32710
+ <span class="nav-label">{{ link.label }}</span>
32711
+ @if (link.badge && link.badge > 0) {
32712
+ <span
32713
+ class="nav-badge"
32714
+ [attr.aria-label]="link.badge + ' unread'"
32715
+ >{{ link.badge }}</span>
32716
+ }
32717
+ </a>
32718
+ }
32719
+ </div>
32569
32720
  </div>
32570
32721
  }
32571
32722
  </nav>
@@ -32657,7 +32808,7 @@ var AppShellComponent = class AppShellComponent {
32657
32808
  <ui-confirm-outlet />
32658
32809
  `,
32659
32810
  isInline: true,
32660
- styles: [":host{display:contents}.shell{display:flex;height:100vh;height:100dvh;overflow:hidden;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.sidebar-backdrop{display:none;position:fixed;inset:0;background:#00000080;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);z-index:199}.sidebar{width:256px;background:var(--shell-bg, linear-gradient(175deg, #0f172a 0%, #111827 100%));display:flex;flex-direction:column;flex-shrink:0;overflow:hidden}.sidebar-header{display:flex;align-items:center;padding:0 20px;min-height:64px;border-bottom:1px solid color-mix(in srgb,var(--shell-text, #fff) 6%,transparent);box-sizing:border-box}.brand-default{display:flex;align-items:center;gap:10px}.brand-text{font-size:1.125rem;font-weight:700;color:var(--shell-text, #fff);letter-spacing:-.01em}.sidebar-nav{padding:6px 0 8px;flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--shell-text, #fff) 8%,transparent) transparent}.sidebar-nav::-webkit-scrollbar{width:3px}.sidebar-nav::-webkit-scrollbar-track{background:transparent}.sidebar-nav::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--shell-text, #fff) 8%,transparent);border-radius:2px}.nav-group{margin-bottom:6px}.nav-group-label{display:flex;align-items:center;gap:6px;width:100%;padding:8px 16px;font-size:.6875rem;font-weight:700;color:color-mix(in srgb,var(--shell-text, #fff) 80%,transparent);text-transform:uppercase;letter-spacing:.12em;background:none;border:none;cursor:pointer;transition:color .15s;text-align:left;border-radius:6px;background:color-mix(in srgb,var(--shell-text, #fff) 10%,transparent);margin:6px 4px 4px;width:calc(100% - 8px);box-sizing:border-box}.nav-group-label:hover{color:color-mix(in srgb,var(--shell-text, #fff) 100%,transparent)}.nav-group-label:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:-1px}.chevron{flex-shrink:0;transition:transform .2s cubic-bezier(.4,0,.2,1);opacity:.85}.chevron.collapsed{transform:rotate(-90deg)}.sidebar-nav a{display:flex;align-items:center;gap:10px;padding:8px 12px 8px 32px;color:color-mix(in srgb,var(--shell-text, #fff) 95%,transparent);font-size:.9375rem;font-weight:500;text-decoration:none;border-left:2px solid transparent;border-radius:0 8px 8px 0;margin-right:10px;transition:color .15s,background .15s,border-color .15s}.sidebar-nav a:hover{color:color-mix(in srgb,var(--shell-text, #fff) 100%,transparent);background:color-mix(in srgb,var(--shell-text, #fff) 6%,transparent)}.sidebar-nav a.active{color:var(--shell-text, #fff);background:#60a5fa21;border-left-color:#60a5fa;font-weight:600}.sidebar-nav a:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:-2px}.nav-icon{display:flex;align-items:center;flex-shrink:0}.nav-label{flex:1}.nav-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#ef4444;color:#fff;font-size:.625rem;font-weight:700;margin-left:auto}.sidebar-footer{padding:10px 14px;border-top:1px solid color-mix(in srgb,var(--shell-text, #fff) 6%,transparent)}.user-info{display:flex;align-items:center;gap:10px}.user-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#60a5fa38,#60a5fa14);border:1px solid rgba(96,165,250,.18);color:color-mix(in srgb,var(--shell-text, #fff) 88%,transparent);font-size:.75rem;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0}.user-details{display:flex;flex-direction:column;min-width:0;flex:1}.user-name{font-size:.8125rem;font-weight:600;color:var(--shell-text, #fff);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-role{font-size:.6875rem;color:color-mix(in srgb,var(--shell-text, #fff) 80%,transparent);text-transform:uppercase;letter-spacing:.05em;font-weight:500}.btn-logout{background:none;border:none;cursor:pointer;color:color-mix(in srgb,var(--shell-text, #fff) 85%,transparent);padding:6px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:color .15s,background .15s}.btn-logout:hover{color:#f87171;background:#f871711a}.btn-logout:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:2px}.brand-full{display:flex;align-items:center;min-width:0;flex:1}.brand-mark{display:none}.shell.collapsed .brand-mark{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.125rem;color:var(--shell-text, #fff);background:color-mix(in srgb,var(--shell-text, #fff) 15%,transparent)}.rail-toggle{display:none;align-items:center;justify-content:center;width:32px;height:32px;margin-left:auto;flex-shrink:0;border:none;background:none;cursor:pointer;border-radius:8px;color:color-mix(in srgb,var(--shell-text, #fff) 85%,transparent);transition:background .15s,color .15s}.rail-toggle:hover{background:color-mix(in srgb,var(--shell-text, #fff) 12%,transparent);color:var(--shell-text, #fff)}.rail-toggle:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:2px}.rail-divider{display:none}@media(min-width:1025px){.rail-toggle{display:flex}.sidebar{transition:width .2s cubic-bezier(.4,0,.2,1)}.shell.collapsed .sidebar{width:68px}.shell.collapsed .sidebar-header{flex-direction:column;justify-content:center;gap:4px;padding:8px 0}.shell.collapsed .brand-full{flex:none;width:44px;height:44px;overflow:hidden;border-radius:10px;justify-content:center}.shell.collapsed .brand-text{display:none}.shell.collapsed .rail-toggle{margin-left:0}.shell.collapsed .nav-group-label{display:none}.shell.collapsed .rail-divider{display:block;height:1px;margin:8px 14px;background:color-mix(in srgb,var(--shell-text, #fff) 20%,transparent)}.shell.collapsed .nav-group:first-child .rail-divider{display:none}.shell.collapsed .sidebar-nav a{position:relative;justify-content:center;padding:10px 0;margin:0 8px 2px;border-left:none;border-radius:8px}.shell.collapsed .sidebar-nav a.active{box-shadow:inset 3px 0 #60a5fa}.shell.collapsed .nav-label{display:none}.shell.collapsed .nav-badge{position:absolute;top:2px;right:4px;min-width:16px;height:16px;padding:0 4px;font-size:.5625rem;margin:0}.shell.collapsed .sidebar-footer{padding:10px 8px}.shell.collapsed .user-info{flex-direction:column;gap:8px}.shell.collapsed .user-details{display:none}}.main-area{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}.top-header{display:flex;align-items:center;gap:8px;padding:0 24px;background:#fff;box-shadow:0 1px 3px #00000012,0 1px #0000000a;min-height:64px;box-sizing:border-box;position:relative;z-index:50}.hamburger{display:none;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:none;cursor:pointer;color:#374151;border-radius:8px;flex-shrink:0;transition:background .15s,color .15s}.hamburger:hover{background:#f3f4f6}.hamburger:focus-visible{outline:2px solid rgba(59,130,246,.5);outline-offset:2px}.page-title{font-size:1.25rem;font-weight:700;color:#111827;margin:0;letter-spacing:-.02em}.page-title:focus{outline:none}.read-only-badge{display:inline-flex;align-items:center;flex-shrink:0;padding:2px 8px;border-radius:9999px;font-size:.6875rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase;background:#fef9c3;color:#854d0e;border:1px solid #fde68a;white-space:nowrap}.header-start{display:flex;align-items:center;min-width:0;margin-left:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.header-start:empty{display:none}.header-start::-webkit-scrollbar{display:none}.header-end{display:flex;align-items:center;margin-left:auto}.content{--shell-content-padding: 24px;flex:1;overflow-y:auto;padding:var(--shell-content-padding);background:#f7f8f6;display:flex;flex-direction:column;box-sizing:border-box;min-height:0}.content>*{flex:1;min-height:0;display:flex;flex-direction:column}@media(max-width:1024px){.hamburger{display:flex}.sidebar{position:fixed;top:0;left:0;bottom:0;z-index:200;transform:translate(-100%);transition:transform .26s cubic-bezier(.4,0,.2,1),box-shadow .26s cubic-bezier(.4,0,.2,1);box-shadow:none}.shell.sidebar-open .sidebar{transform:translate(0);box-shadow:4px 0 32px #0000004d}.shell.sidebar-open .sidebar-backdrop{display:block}.main-area{width:100%}.top-header{padding:0 16px;gap:4px}.content{--shell-content-padding: 16px}}@media(max-width:480px){.page-title{font-size:1.0625rem}.content{--shell-content-padding: 12px}}@media(pointer:coarse),(max-width:480px){.sidebar-nav a,.nav-group-label{min-height:44px}.btn-logout,.hamburger,.rail-toggle{min-width:44px;min-height:44px}}@media(prefers-reduced-motion:reduce){.chevron,.sidebar-nav a,.sidebar{transition:none!important}}\n"],
32811
+ styles: [":host{display:contents}.shell{display:flex;height:100vh;height:100dvh;overflow:hidden;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.sidebar-backdrop{display:none;position:fixed;inset:0;background:#00000080;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);z-index:199}.sidebar{width:256px;background:var(--shell-bg, linear-gradient(175deg, #0f172a 0%, #111827 100%));display:flex;flex-direction:column;flex-shrink:0;overflow:hidden}.sidebar-header{display:flex;align-items:center;padding:0 20px;min-height:64px;border-bottom:1px solid color-mix(in srgb,var(--shell-text, #fff) 6%,transparent);box-sizing:border-box}.brand-default{display:flex;align-items:center;gap:10px}.brand-text{font-size:1.125rem;font-weight:700;color:var(--shell-text, #fff);letter-spacing:-.01em}.sidebar-nav{padding:6px 0 8px;flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--shell-text, #fff) 8%,transparent) transparent}.sidebar-nav::-webkit-scrollbar{width:3px}.sidebar-nav::-webkit-scrollbar-track{background:transparent}.sidebar-nav::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--shell-text, #fff) 8%,transparent);border-radius:2px}.nav-group{margin-bottom:6px}.nav-group-links[hidden]{display:none}.nav-group-label{display:flex;align-items:center;gap:6px;width:100%;padding:8px 16px;font-size:.6875rem;font-weight:700;color:color-mix(in srgb,var(--shell-text, #fff) 80%,transparent);text-transform:uppercase;letter-spacing:.12em;background:none;border:none;cursor:pointer;transition:color .15s;text-align:left;border-radius:6px;background:color-mix(in srgb,var(--shell-text, #fff) 10%,transparent);margin:6px 4px 4px;width:calc(100% - 8px);box-sizing:border-box}.nav-group-label:hover{color:color-mix(in srgb,var(--shell-text, #fff) 100%,transparent)}.nav-group-label:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:-1px}.chevron{flex-shrink:0;transition:transform .2s cubic-bezier(.4,0,.2,1);opacity:.85}.chevron.collapsed{transform:rotate(-90deg)}.sidebar-nav a{display:flex;align-items:center;gap:10px;padding:8px 12px 8px 32px;color:color-mix(in srgb,var(--shell-text, #fff) 95%,transparent);font-size:.9375rem;font-weight:500;text-decoration:none;border-left:2px solid transparent;border-radius:0 8px 8px 0;margin-right:10px;transition:color .15s,background .15s,border-color .15s}.sidebar-nav a:hover{color:color-mix(in srgb,var(--shell-text, #fff) 100%,transparent);background:color-mix(in srgb,var(--shell-text, #fff) 6%,transparent)}.sidebar-nav a.active{color:var(--shell-text, #fff);background:#60a5fa21;border-left-color:#60a5fa;font-weight:600}.sidebar-nav a:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:-2px}.nav-icon{display:flex;align-items:center;flex-shrink:0}.nav-label{flex:1}.nav-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#ef4444;color:#fff;font-size:.625rem;font-weight:700;margin-left:auto}.sidebar-footer{padding:10px 14px;border-top:1px solid color-mix(in srgb,var(--shell-text, #fff) 6%,transparent)}.user-info{display:flex;align-items:center;gap:10px}.user-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#60a5fa38,#60a5fa14);border:1px solid rgba(96,165,250,.18);color:color-mix(in srgb,var(--shell-text, #fff) 88%,transparent);font-size:.75rem;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0}.user-details{display:flex;flex-direction:column;min-width:0;flex:1}.user-name{font-size:.8125rem;font-weight:600;color:var(--shell-text, #fff);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-role{font-size:.6875rem;color:color-mix(in srgb,var(--shell-text, #fff) 80%,transparent);text-transform:uppercase;letter-spacing:.05em;font-weight:500}.btn-logout{background:none;border:none;cursor:pointer;color:color-mix(in srgb,var(--shell-text, #fff) 85%,transparent);padding:6px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:color .15s,background .15s}.btn-logout:hover{color:#f87171;background:#f871711a}.btn-logout:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:2px}.brand-full{display:flex;align-items:center;min-width:0;flex:1}.brand-mark{display:none}.shell.collapsed .brand-mark{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.125rem;color:var(--shell-text, #fff);background:color-mix(in srgb,var(--shell-text, #fff) 15%,transparent)}.rail-toggle{display:none;align-items:center;justify-content:center;width:32px;height:32px;margin-left:auto;flex-shrink:0;border:none;background:none;cursor:pointer;border-radius:8px;color:color-mix(in srgb,var(--shell-text, #fff) 85%,transparent);transition:background .15s,color .15s}.rail-toggle:hover{background:color-mix(in srgb,var(--shell-text, #fff) 12%,transparent);color:var(--shell-text, #fff)}.rail-toggle:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:2px}.rail-divider{display:none}@media(min-width:1025px){.rail-toggle{display:flex}.sidebar{transition:width .2s cubic-bezier(.4,0,.2,1)}.shell.collapsed .sidebar{width:68px}.shell.collapsed .sidebar-header{flex-direction:column;justify-content:center;gap:4px;padding:8px 0}.shell.collapsed .brand-full{flex:none;width:44px;height:44px;overflow:hidden;border-radius:10px;justify-content:center}.shell.collapsed .brand-text{display:none}.shell.collapsed .rail-toggle{margin-left:0}.shell.collapsed .nav-group-label{display:none}.shell.collapsed .rail-divider{display:block;height:1px;margin:8px 14px;background:color-mix(in srgb,var(--shell-text, #fff) 20%,transparent)}.shell.collapsed .nav-group:first-child .rail-divider{display:none}.shell.collapsed .sidebar-nav a{position:relative;justify-content:center;padding:10px 0;margin:0 8px 2px;border-left:none;border-radius:8px}.shell.collapsed .sidebar-nav a.active{box-shadow:inset 3px 0 #60a5fa}.shell.collapsed .nav-label{display:none}.shell.collapsed .nav-badge{position:absolute;top:2px;right:4px;min-width:16px;height:16px;padding:0 4px;font-size:.5625rem;margin:0}.shell.collapsed .sidebar-footer{padding:10px 8px}.shell.collapsed .user-info{flex-direction:column;gap:8px}.shell.collapsed .user-details{display:none}}.main-area{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}.top-header{display:flex;align-items:center;gap:8px;padding:0 24px;background:#fff;box-shadow:0 1px 3px #00000012,0 1px #0000000a;min-height:64px;box-sizing:border-box;position:relative;z-index:50}.hamburger{display:none;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:none;cursor:pointer;color:#374151;border-radius:8px;flex-shrink:0;transition:background .15s,color .15s}.hamburger:hover{background:#f3f4f6}.hamburger:focus-visible{outline:2px solid rgba(59,130,246,.5);outline-offset:2px}.page-title{font-size:1.25rem;font-weight:700;color:#111827;margin:0;letter-spacing:-.02em}.page-title:focus{outline:none}.read-only-badge{display:inline-flex;align-items:center;flex-shrink:0;padding:2px 8px;border-radius:9999px;font-size:.6875rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase;background:#fef9c3;color:#854d0e;border:1px solid #fde68a;white-space:nowrap}.header-start{display:flex;align-items:center;min-width:0;margin-left:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.header-start:empty{display:none}.header-start::-webkit-scrollbar{display:none}.header-end{display:flex;align-items:center;margin-left:auto}.content:focus{outline:none}.content{--shell-content-padding: 24px;flex:1;overflow-y:auto;padding:var(--shell-content-padding);background:#f7f8f6;display:flex;flex-direction:column;box-sizing:border-box;min-height:0}.content>*{flex:1;min-height:0;display:flex;flex-direction:column}.skip-link{position:absolute;top:-48px;left:8px;z-index:300;padding:8px 14px;border-radius:6px;background:#fff;color:#1d4ed8;font-size:.875rem;font-weight:600;text-decoration:none;box-shadow:0 2px 10px #00000040}.skip-link:focus{top:8px;outline:2px solid #1d4ed8;outline-offset:2px}.nav-group-label--static{cursor:default}@media(max-width:1024px){.hamburger{display:flex}.sidebar{position:fixed;top:0;left:0;bottom:0;z-index:200;transform:translate(-100%);transition:transform .26s cubic-bezier(.4,0,.2,1),box-shadow .26s cubic-bezier(.4,0,.2,1),visibility 0s linear .26s;visibility:hidden;box-shadow:none}.shell.sidebar-open .sidebar{transform:translate(0);box-shadow:4px 0 32px #0000004d;visibility:visible;transition-delay:0s}.shell.sidebar-open .sidebar-backdrop{display:block}.main-area{width:100%}.top-header{padding:0 16px;gap:4px}.content{--shell-content-padding: 16px}}@media(max-width:480px){.page-title{font-size:1.0625rem}.content{--shell-content-padding: 12px}}@media(pointer:coarse),(max-width:480px){.sidebar-nav a,.nav-group-label{min-height:44px}.btn-logout,.hamburger,.rail-toggle{min-width:44px;min-height:44px}}@media(prefers-reduced-motion:reduce){.chevron,.sidebar-nav a,.sidebar{transition:none!important}}\n"],
32661
32812
  dependencies: [
32662
32813
  {
32663
32814
  kind: "directive",
@@ -32727,11 +32878,15 @@ i0.ɵɵngDeclareClassMetadata({
32727
32878
  class="shell"
32728
32879
  [class.sidebar-open]="_sidebarOpen()"
32729
32880
  [class.collapsed]="_isRail()"
32881
+ (keydown)="onShellKeydown($event)"
32730
32882
  [style.--shell-bg]="backgroundColor() || null"
32731
32883
  [style.--shell-text]="textColor() || null"
32732
32884
  >
32733
32885
  <ui-shell-projected-styles />
32734
32886
 
32887
+ <!-- Keyboard users jump past the navigation straight to the page content -->
32888
+ <a class="skip-link" href="#main-content" (click)="skipToContent($event)">Skip to main content</a>
32889
+
32735
32890
  <!-- Mobile backdrop -->
32736
32891
  <div
32737
32892
  class="sidebar-backdrop"
@@ -32778,6 +32933,7 @@ i0.ɵɵngDeclareClassMetadata({
32778
32933
  @for (group of _visibleGroups(); track group.key) {
32779
32934
  <div class="nav-group">
32780
32935
  @if (_isRail()) { <div class="rail-divider" aria-hidden="true"></div> }
32936
+ @if (_canCollapseGroups()) {
32781
32937
  <button
32782
32938
  class="nav-group-label"
32783
32939
  type="button"
@@ -32796,38 +32952,44 @@ i0.ɵɵngDeclareClassMetadata({
32796
32952
  </svg>
32797
32953
  {{ group.label }}
32798
32954
  </button>
32799
-
32800
- @if (_isRail() || !_isCollapsed(group.key)) {
32801
- <div [id]="'navg-' + group.key" role="list">
32802
- @for (link of _visibleLinks(group); track link.route) {
32803
- <a
32804
- role="listitem"
32805
- [routerLink]="link.route"
32806
- routerLinkActive="active"
32807
- [routerLinkActiveOptions]="{ exact: !!link.exact }"
32808
- #rla="routerLinkActive"
32809
- [attr.aria-current]="rla.isActive ? 'page' : null"
32810
- [attr.title]="_isRail() ? link.label : null"
32811
- [attr.aria-label]="_isRail() ? link.label : null"
32812
- >
32813
- @if (link.icon) {
32814
- <span
32815
- class="nav-icon"
32816
- [innerHTML]="_safeIcon(link.icon)"
32817
- aria-hidden="true"
32818
- ></span>
32819
- }
32820
- <span class="nav-label">{{ link.label }}</span>
32821
- @if (link.badge && link.badge > 0) {
32822
- <span
32823
- class="nav-badge"
32824
- [attr.aria-label]="link.badge + ' unread'"
32825
- >{{ link.badge }}</span>
32826
- }
32827
- </a>
32828
- }
32829
- </div>
32955
+ } @else {
32956
+ <!-- A single group can't be collapsed: hiding it would remove the whole navigation -->
32957
+ <div class="nav-group-label nav-group-label--static" [id]="'navg-label-' + group.key">{{ group.label }}</div>
32830
32958
  }
32959
+
32960
+ <!-- Always rendered so the toggle's aria-controls resolves; [hidden] (plus display:none in the CSS) removes the links of a collapsed group from view and from the tab order -->
32961
+ <div
32962
+ class="nav-group-links"
32963
+ [id]="'navg-' + group.key"
32964
+ [hidden]="!_isRail() && _isCollapsed(group.key)"
32965
+ >
32966
+ @for (link of _visibleLinks(group); track link.route) {
32967
+ <a
32968
+ [routerLink]="link.route"
32969
+ routerLinkActive="active"
32970
+ [routerLinkActiveOptions]="{ exact: !!link.exact }"
32971
+ #rla="routerLinkActive"
32972
+ [attr.aria-current]="rla.isActive ? 'page' : null"
32973
+ [attr.title]="_isRail() ? link.label : null"
32974
+ [attr.aria-label]="_isRail() ? link.label : null"
32975
+ >
32976
+ @if (link.icon) {
32977
+ <span
32978
+ class="nav-icon"
32979
+ [innerHTML]="_safeIcon(link.icon)"
32980
+ aria-hidden="true"
32981
+ ></span>
32982
+ }
32983
+ <span class="nav-label">{{ link.label }}</span>
32984
+ @if (link.badge && link.badge > 0) {
32985
+ <span
32986
+ class="nav-badge"
32987
+ [attr.aria-label]="link.badge + ' unread'"
32988
+ >{{ link.badge }}</span>
32989
+ }
32990
+ </a>
32991
+ }
32992
+ </div>
32831
32993
  </div>
32832
32994
  }
32833
32995
  </nav>
@@ -32918,7 +33080,7 @@ i0.ɵɵngDeclareClassMetadata({
32918
33080
  <!-- Global confirm overlay — position:fixed so it overlays without affecting layout -->
32919
33081
  <ui-confirm-outlet />
32920
33082
  `,
32921
- styles: [":host{display:contents}.shell{display:flex;height:100vh;height:100dvh;overflow:hidden;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.sidebar-backdrop{display:none;position:fixed;inset:0;background:#00000080;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);z-index:199}.sidebar{width:256px;background:var(--shell-bg, linear-gradient(175deg, #0f172a 0%, #111827 100%));display:flex;flex-direction:column;flex-shrink:0;overflow:hidden}.sidebar-header{display:flex;align-items:center;padding:0 20px;min-height:64px;border-bottom:1px solid color-mix(in srgb,var(--shell-text, #fff) 6%,transparent);box-sizing:border-box}.brand-default{display:flex;align-items:center;gap:10px}.brand-text{font-size:1.125rem;font-weight:700;color:var(--shell-text, #fff);letter-spacing:-.01em}.sidebar-nav{padding:6px 0 8px;flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--shell-text, #fff) 8%,transparent) transparent}.sidebar-nav::-webkit-scrollbar{width:3px}.sidebar-nav::-webkit-scrollbar-track{background:transparent}.sidebar-nav::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--shell-text, #fff) 8%,transparent);border-radius:2px}.nav-group{margin-bottom:6px}.nav-group-label{display:flex;align-items:center;gap:6px;width:100%;padding:8px 16px;font-size:.6875rem;font-weight:700;color:color-mix(in srgb,var(--shell-text, #fff) 80%,transparent);text-transform:uppercase;letter-spacing:.12em;background:none;border:none;cursor:pointer;transition:color .15s;text-align:left;border-radius:6px;background:color-mix(in srgb,var(--shell-text, #fff) 10%,transparent);margin:6px 4px 4px;width:calc(100% - 8px);box-sizing:border-box}.nav-group-label:hover{color:color-mix(in srgb,var(--shell-text, #fff) 100%,transparent)}.nav-group-label:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:-1px}.chevron{flex-shrink:0;transition:transform .2s cubic-bezier(.4,0,.2,1);opacity:.85}.chevron.collapsed{transform:rotate(-90deg)}.sidebar-nav a{display:flex;align-items:center;gap:10px;padding:8px 12px 8px 32px;color:color-mix(in srgb,var(--shell-text, #fff) 95%,transparent);font-size:.9375rem;font-weight:500;text-decoration:none;border-left:2px solid transparent;border-radius:0 8px 8px 0;margin-right:10px;transition:color .15s,background .15s,border-color .15s}.sidebar-nav a:hover{color:color-mix(in srgb,var(--shell-text, #fff) 100%,transparent);background:color-mix(in srgb,var(--shell-text, #fff) 6%,transparent)}.sidebar-nav a.active{color:var(--shell-text, #fff);background:#60a5fa21;border-left-color:#60a5fa;font-weight:600}.sidebar-nav a:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:-2px}.nav-icon{display:flex;align-items:center;flex-shrink:0}.nav-label{flex:1}.nav-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#ef4444;color:#fff;font-size:.625rem;font-weight:700;margin-left:auto}.sidebar-footer{padding:10px 14px;border-top:1px solid color-mix(in srgb,var(--shell-text, #fff) 6%,transparent)}.user-info{display:flex;align-items:center;gap:10px}.user-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#60a5fa38,#60a5fa14);border:1px solid rgba(96,165,250,.18);color:color-mix(in srgb,var(--shell-text, #fff) 88%,transparent);font-size:.75rem;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0}.user-details{display:flex;flex-direction:column;min-width:0;flex:1}.user-name{font-size:.8125rem;font-weight:600;color:var(--shell-text, #fff);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-role{font-size:.6875rem;color:color-mix(in srgb,var(--shell-text, #fff) 80%,transparent);text-transform:uppercase;letter-spacing:.05em;font-weight:500}.btn-logout{background:none;border:none;cursor:pointer;color:color-mix(in srgb,var(--shell-text, #fff) 85%,transparent);padding:6px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:color .15s,background .15s}.btn-logout:hover{color:#f87171;background:#f871711a}.btn-logout:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:2px}.brand-full{display:flex;align-items:center;min-width:0;flex:1}.brand-mark{display:none}.shell.collapsed .brand-mark{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.125rem;color:var(--shell-text, #fff);background:color-mix(in srgb,var(--shell-text, #fff) 15%,transparent)}.rail-toggle{display:none;align-items:center;justify-content:center;width:32px;height:32px;margin-left:auto;flex-shrink:0;border:none;background:none;cursor:pointer;border-radius:8px;color:color-mix(in srgb,var(--shell-text, #fff) 85%,transparent);transition:background .15s,color .15s}.rail-toggle:hover{background:color-mix(in srgb,var(--shell-text, #fff) 12%,transparent);color:var(--shell-text, #fff)}.rail-toggle:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:2px}.rail-divider{display:none}@media(min-width:1025px){.rail-toggle{display:flex}.sidebar{transition:width .2s cubic-bezier(.4,0,.2,1)}.shell.collapsed .sidebar{width:68px}.shell.collapsed .sidebar-header{flex-direction:column;justify-content:center;gap:4px;padding:8px 0}.shell.collapsed .brand-full{flex:none;width:44px;height:44px;overflow:hidden;border-radius:10px;justify-content:center}.shell.collapsed .brand-text{display:none}.shell.collapsed .rail-toggle{margin-left:0}.shell.collapsed .nav-group-label{display:none}.shell.collapsed .rail-divider{display:block;height:1px;margin:8px 14px;background:color-mix(in srgb,var(--shell-text, #fff) 20%,transparent)}.shell.collapsed .nav-group:first-child .rail-divider{display:none}.shell.collapsed .sidebar-nav a{position:relative;justify-content:center;padding:10px 0;margin:0 8px 2px;border-left:none;border-radius:8px}.shell.collapsed .sidebar-nav a.active{box-shadow:inset 3px 0 #60a5fa}.shell.collapsed .nav-label{display:none}.shell.collapsed .nav-badge{position:absolute;top:2px;right:4px;min-width:16px;height:16px;padding:0 4px;font-size:.5625rem;margin:0}.shell.collapsed .sidebar-footer{padding:10px 8px}.shell.collapsed .user-info{flex-direction:column;gap:8px}.shell.collapsed .user-details{display:none}}.main-area{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}.top-header{display:flex;align-items:center;gap:8px;padding:0 24px;background:#fff;box-shadow:0 1px 3px #00000012,0 1px #0000000a;min-height:64px;box-sizing:border-box;position:relative;z-index:50}.hamburger{display:none;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:none;cursor:pointer;color:#374151;border-radius:8px;flex-shrink:0;transition:background .15s,color .15s}.hamburger:hover{background:#f3f4f6}.hamburger:focus-visible{outline:2px solid rgba(59,130,246,.5);outline-offset:2px}.page-title{font-size:1.25rem;font-weight:700;color:#111827;margin:0;letter-spacing:-.02em}.page-title:focus{outline:none}.read-only-badge{display:inline-flex;align-items:center;flex-shrink:0;padding:2px 8px;border-radius:9999px;font-size:.6875rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase;background:#fef9c3;color:#854d0e;border:1px solid #fde68a;white-space:nowrap}.header-start{display:flex;align-items:center;min-width:0;margin-left:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.header-start:empty{display:none}.header-start::-webkit-scrollbar{display:none}.header-end{display:flex;align-items:center;margin-left:auto}.content{--shell-content-padding: 24px;flex:1;overflow-y:auto;padding:var(--shell-content-padding);background:#f7f8f6;display:flex;flex-direction:column;box-sizing:border-box;min-height:0}.content>*{flex:1;min-height:0;display:flex;flex-direction:column}@media(max-width:1024px){.hamburger{display:flex}.sidebar{position:fixed;top:0;left:0;bottom:0;z-index:200;transform:translate(-100%);transition:transform .26s cubic-bezier(.4,0,.2,1),box-shadow .26s cubic-bezier(.4,0,.2,1);box-shadow:none}.shell.sidebar-open .sidebar{transform:translate(0);box-shadow:4px 0 32px #0000004d}.shell.sidebar-open .sidebar-backdrop{display:block}.main-area{width:100%}.top-header{padding:0 16px;gap:4px}.content{--shell-content-padding: 16px}}@media(max-width:480px){.page-title{font-size:1.0625rem}.content{--shell-content-padding: 12px}}@media(pointer:coarse),(max-width:480px){.sidebar-nav a,.nav-group-label{min-height:44px}.btn-logout,.hamburger,.rail-toggle{min-width:44px;min-height:44px}}@media(prefers-reduced-motion:reduce){.chevron,.sidebar-nav a,.sidebar{transition:none!important}}\n"]
33083
+ styles: [":host{display:contents}.shell{display:flex;height:100vh;height:100dvh;overflow:hidden;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.sidebar-backdrop{display:none;position:fixed;inset:0;background:#00000080;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);z-index:199}.sidebar{width:256px;background:var(--shell-bg, linear-gradient(175deg, #0f172a 0%, #111827 100%));display:flex;flex-direction:column;flex-shrink:0;overflow:hidden}.sidebar-header{display:flex;align-items:center;padding:0 20px;min-height:64px;border-bottom:1px solid color-mix(in srgb,var(--shell-text, #fff) 6%,transparent);box-sizing:border-box}.brand-default{display:flex;align-items:center;gap:10px}.brand-text{font-size:1.125rem;font-weight:700;color:var(--shell-text, #fff);letter-spacing:-.01em}.sidebar-nav{padding:6px 0 8px;flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--shell-text, #fff) 8%,transparent) transparent}.sidebar-nav::-webkit-scrollbar{width:3px}.sidebar-nav::-webkit-scrollbar-track{background:transparent}.sidebar-nav::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--shell-text, #fff) 8%,transparent);border-radius:2px}.nav-group{margin-bottom:6px}.nav-group-links[hidden]{display:none}.nav-group-label{display:flex;align-items:center;gap:6px;width:100%;padding:8px 16px;font-size:.6875rem;font-weight:700;color:color-mix(in srgb,var(--shell-text, #fff) 80%,transparent);text-transform:uppercase;letter-spacing:.12em;background:none;border:none;cursor:pointer;transition:color .15s;text-align:left;border-radius:6px;background:color-mix(in srgb,var(--shell-text, #fff) 10%,transparent);margin:6px 4px 4px;width:calc(100% - 8px);box-sizing:border-box}.nav-group-label:hover{color:color-mix(in srgb,var(--shell-text, #fff) 100%,transparent)}.nav-group-label:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:-1px}.chevron{flex-shrink:0;transition:transform .2s cubic-bezier(.4,0,.2,1);opacity:.85}.chevron.collapsed{transform:rotate(-90deg)}.sidebar-nav a{display:flex;align-items:center;gap:10px;padding:8px 12px 8px 32px;color:color-mix(in srgb,var(--shell-text, #fff) 95%,transparent);font-size:.9375rem;font-weight:500;text-decoration:none;border-left:2px solid transparent;border-radius:0 8px 8px 0;margin-right:10px;transition:color .15s,background .15s,border-color .15s}.sidebar-nav a:hover{color:color-mix(in srgb,var(--shell-text, #fff) 100%,transparent);background:color-mix(in srgb,var(--shell-text, #fff) 6%,transparent)}.sidebar-nav a.active{color:var(--shell-text, #fff);background:#60a5fa21;border-left-color:#60a5fa;font-weight:600}.sidebar-nav a:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:-2px}.nav-icon{display:flex;align-items:center;flex-shrink:0}.nav-label{flex:1}.nav-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#ef4444;color:#fff;font-size:.625rem;font-weight:700;margin-left:auto}.sidebar-footer{padding:10px 14px;border-top:1px solid color-mix(in srgb,var(--shell-text, #fff) 6%,transparent)}.user-info{display:flex;align-items:center;gap:10px}.user-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#60a5fa38,#60a5fa14);border:1px solid rgba(96,165,250,.18);color:color-mix(in srgb,var(--shell-text, #fff) 88%,transparent);font-size:.75rem;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0}.user-details{display:flex;flex-direction:column;min-width:0;flex:1}.user-name{font-size:.8125rem;font-weight:600;color:var(--shell-text, #fff);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-role{font-size:.6875rem;color:color-mix(in srgb,var(--shell-text, #fff) 80%,transparent);text-transform:uppercase;letter-spacing:.05em;font-weight:500}.btn-logout{background:none;border:none;cursor:pointer;color:color-mix(in srgb,var(--shell-text, #fff) 85%,transparent);padding:6px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:color .15s,background .15s}.btn-logout:hover{color:#f87171;background:#f871711a}.btn-logout:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:2px}.brand-full{display:flex;align-items:center;min-width:0;flex:1}.brand-mark{display:none}.shell.collapsed .brand-mark{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.125rem;color:var(--shell-text, #fff);background:color-mix(in srgb,var(--shell-text, #fff) 15%,transparent)}.rail-toggle{display:none;align-items:center;justify-content:center;width:32px;height:32px;margin-left:auto;flex-shrink:0;border:none;background:none;cursor:pointer;border-radius:8px;color:color-mix(in srgb,var(--shell-text, #fff) 85%,transparent);transition:background .15s,color .15s}.rail-toggle:hover{background:color-mix(in srgb,var(--shell-text, #fff) 12%,transparent);color:var(--shell-text, #fff)}.rail-toggle:focus-visible{outline:2px solid rgba(96,165,250,.5);outline-offset:2px}.rail-divider{display:none}@media(min-width:1025px){.rail-toggle{display:flex}.sidebar{transition:width .2s cubic-bezier(.4,0,.2,1)}.shell.collapsed .sidebar{width:68px}.shell.collapsed .sidebar-header{flex-direction:column;justify-content:center;gap:4px;padding:8px 0}.shell.collapsed .brand-full{flex:none;width:44px;height:44px;overflow:hidden;border-radius:10px;justify-content:center}.shell.collapsed .brand-text{display:none}.shell.collapsed .rail-toggle{margin-left:0}.shell.collapsed .nav-group-label{display:none}.shell.collapsed .rail-divider{display:block;height:1px;margin:8px 14px;background:color-mix(in srgb,var(--shell-text, #fff) 20%,transparent)}.shell.collapsed .nav-group:first-child .rail-divider{display:none}.shell.collapsed .sidebar-nav a{position:relative;justify-content:center;padding:10px 0;margin:0 8px 2px;border-left:none;border-radius:8px}.shell.collapsed .sidebar-nav a.active{box-shadow:inset 3px 0 #60a5fa}.shell.collapsed .nav-label{display:none}.shell.collapsed .nav-badge{position:absolute;top:2px;right:4px;min-width:16px;height:16px;padding:0 4px;font-size:.5625rem;margin:0}.shell.collapsed .sidebar-footer{padding:10px 8px}.shell.collapsed .user-info{flex-direction:column;gap:8px}.shell.collapsed .user-details{display:none}}.main-area{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}.top-header{display:flex;align-items:center;gap:8px;padding:0 24px;background:#fff;box-shadow:0 1px 3px #00000012,0 1px #0000000a;min-height:64px;box-sizing:border-box;position:relative;z-index:50}.hamburger{display:none;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:none;cursor:pointer;color:#374151;border-radius:8px;flex-shrink:0;transition:background .15s,color .15s}.hamburger:hover{background:#f3f4f6}.hamburger:focus-visible{outline:2px solid rgba(59,130,246,.5);outline-offset:2px}.page-title{font-size:1.25rem;font-weight:700;color:#111827;margin:0;letter-spacing:-.02em}.page-title:focus{outline:none}.read-only-badge{display:inline-flex;align-items:center;flex-shrink:0;padding:2px 8px;border-radius:9999px;font-size:.6875rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase;background:#fef9c3;color:#854d0e;border:1px solid #fde68a;white-space:nowrap}.header-start{display:flex;align-items:center;min-width:0;margin-left:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.header-start:empty{display:none}.header-start::-webkit-scrollbar{display:none}.header-end{display:flex;align-items:center;margin-left:auto}.content:focus{outline:none}.content{--shell-content-padding: 24px;flex:1;overflow-y:auto;padding:var(--shell-content-padding);background:#f7f8f6;display:flex;flex-direction:column;box-sizing:border-box;min-height:0}.content>*{flex:1;min-height:0;display:flex;flex-direction:column}.skip-link{position:absolute;top:-48px;left:8px;z-index:300;padding:8px 14px;border-radius:6px;background:#fff;color:#1d4ed8;font-size:.875rem;font-weight:600;text-decoration:none;box-shadow:0 2px 10px #00000040}.skip-link:focus{top:8px;outline:2px solid #1d4ed8;outline-offset:2px}.nav-group-label--static{cursor:default}@media(max-width:1024px){.hamburger{display:flex}.sidebar{position:fixed;top:0;left:0;bottom:0;z-index:200;transform:translate(-100%);transition:transform .26s cubic-bezier(.4,0,.2,1),box-shadow .26s cubic-bezier(.4,0,.2,1),visibility 0s linear .26s;visibility:hidden;box-shadow:none}.shell.sidebar-open .sidebar{transform:translate(0);box-shadow:4px 0 32px #0000004d;visibility:visible;transition-delay:0s}.shell.sidebar-open .sidebar-backdrop{display:block}.main-area{width:100%}.top-header{padding:0 16px;gap:4px}.content{--shell-content-padding: 16px}}@media(max-width:480px){.page-title{font-size:1.0625rem}.content{--shell-content-padding: 12px}}@media(pointer:coarse),(max-width:480px){.sidebar-nav a,.nav-group-label{min-height:44px}.btn-logout,.hamburger,.rail-toggle{min-width:44px;min-height:44px}}@media(prefers-reduced-motion:reduce){.chevron,.sidebar-nav a,.sidebar{transition:none!important}}\n"]
32922
33084
  }]
32923
33085
  }],
32924
33086
  propDecorators: {