npm - @tekus/design-system - Versions diffs - 5.37.0 → 5.38.1 - Mend

@tekus/design-system 5.37.0 → 5.38.1

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.

Files changed (60) hide show

package/fesm2022/tekus-design-system-components-table.mjs CHANGED Viewed

@@ -451,7 +451,7 @@ class TableComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TableComponent, isStandalone: true, selector: "tk-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, columnFilters: { classPropertyName: "columnFilters", publicName: "columnFilters", isSignal: true, isRequired: false, transformFunction: null }, sortField: { classPropertyName: "sortField", publicName: "sortField", isSignal: true, isRequired: false, transformFunction: null }, sortOrder: { classPropertyName: "sortOrder", publicName: "sortOrder", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange", columnFilters: "columnFiltersChange", sortField: "sortFieldChange", sortOrder: "sortOrderChange" }, viewQueries: [{ propertyName: "tableRef", first: true, predicate: ["tableRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<p-table #tableRef [selection]=\"selection()\" (selectionChange)=\"updateSelection($any($event))\"\n  [selectionMode]=\"selectionMode()\" [dataKey]=\"dataKey()\" [value]=\"internalData()\" [customSort]=\"true\"\n  (sortFunction)=\"customSort($event)\" [tableStyle]=\"{ 'min-width': '60rem' }\" responsiveLayout=\"scroll\">\n  <!-- HEADER -->\n  <ng-template pTemplate=\"header\">\n    <tr>\n      @for (col of columns(); track col.header) {\n      <th [id]=\"col.field\" [style.width]=\"col.width\"\n        [pSortableColumn]=\"col.sortable ? col.field : undefined\"\n        [class.tk-table__header--active]=\"activeFilterColumn() === col.field || isColumnFiltered(col.field!)\">\n        <div class=\"tk-table__header-content\">\n          @if (col.type === 'selection' && selectionMode() === 'multiple') {\n          <div class=\"tk-table__actions hide-validation-messages\">\n            <tk-checkbox [binary]=\"true\" [model]=\"isAllSelected()\" [indeterminate]=\"isPartiallySelected()\"\n              (click)=\"$event.stopPropagation()\" (keypress)=\"$event.stopPropagation()\"\n              (modelChange)=\"toggleAll($event)\"></tk-checkbox>\n          </div>\n          } @else if (col.type !== 'selection') {\n          <span class=\"tk-table__header-label\">{{ col.header }}</span>\n          @if (col.sortable) {\n          <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n          }\n          @if (col.filterable && col.field) {\n          <button\n            class=\"tk-table__filter-trigger\"\n            [class.tk-table__filter-trigger--active]=\"isColumnFiltered(col.field)\"\n            (click)=\"toggleFilterOverlay(col.field, $event)\"\n            type=\"button\"\n            [attr.aria-label]=\"'Filter ' + col.header\">\n            <tk-icon icon=\"filter\" size=\"sm\"></tk-icon>\n          </button>\n          }\n          }\n        </div>\n      </th>\n      }\n    </tr>\n  </ng-template>\n\n  <!-- BODY -->\n  <ng-template pTemplate=\"body\" let-row>\n    <tr [pSelectableRow]=\"row\">\n      @for (col of columns(); track col.header) {\n      <!-- SELECTION -->\n      @if (col.type === 'selection') {\n      <td>\n        @if (selectionMode() === 'multiple') {\n        <tk-checkbox [model]=\"selection()\" [value]=\"row\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\" (modelChange)=\"updateSelection($any($event))\"></tk-checkbox>\n        }\n      </td>\n      }\n\n      <!-- CHECKBOX (Boolean field) -->\n      @if (col.type === 'checkbox') {\n      <td>\n        <tk-checkbox [binary]=\"true\" [(model)]=\"row[col.field!]\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\"></tk-checkbox>\n      </td>\n      }\n\n      <!-- TEXT (default) -->\n      @if (!col.type || col.type === 'text') {\n      <td>{{ row[col.field!] }}</td>\n      }\n\n      <!-- TAG -->\n      @if (col.type === 'tag') {\n      <td>\n        <tk-tag [value]=\"row[col.field!]\" [severity]=\"col.tagSeverity!(row)\" />\n      </td>\n      }\n\n      <!-- ACTIONS -->\n      @if (col.type === 'actions') {\n      <td>\n        <div class=\"tk-table__actions\">\n          @for (action of col.actions!; track action.icon) {\n          <tk-button [icon]=\"action.icon\" severity=\"secondary\" (click)=\"$event.stopPropagation()\"\n            (keypress)=\"$event.stopPropagation()\" (clicked)=\"action?.action(row)\"></tk-button>\n          }\n        </div>\n      </td>\n      }\n\n      <!-- ACTION GROUP -->\n      @if (col.type === 'action-group') {\n      <td>\n        <div class=\"tk-table__actions\">\n          <tk-action-group\n            [actions]=\"getActionGroup(col.actionGroup!, row)\"\n            [maxVisible]=\"col.actionGroupMaxVisible ?? 2\"\n            [disabled]=\"col.actionGroupDisabled ?? false\"\n            (click)=\"$event.stopPropagation()\"\n            (keypress)=\"$event.stopPropagation()\"\n          ></tk-action-group>\n        </div>\n      </td>\n      }\n\n      <!-- CONNECTION STATUS -->\n      @if (col.type === 'connection-status') {\n      <td>\n        <tk-time-ago\n          [dateTime]=\"row[col.field!]\"\n          [severity]=\"col.connectionStatusSeverity ? col.connectionStatusSeverity(row) : 'success'\"\n          [tooltipText]=\"col.connectionStatusTooltipText ? col.connectionStatusTooltipText(row) : undefined\" />\n      </td>\n      }\n\n      <!-- IMAGE -->\n      @if (col.type === 'image') {\n      <td>\n        <img\n          class=\"tk-table__cell-img\"\n          [class.tk-table__cell-img--clickable]=\"!!col.imageAction\"\n          [src]=\"row[col.field!]\"\n          [alt]=\"col.imageAlt ? col.imageAlt(row) : ''\"\n          [style.width]=\"col.imageWidth ?? '40px'\"\n          [style.height]=\"col.imageHeight ?? '40px'\"\n          [attr.tabindex]=\"col.imageAction ? 0 : null\"\n          [attr.role]=\"col.imageAction ? 'button' : null\"\n          (click)=\"handleImageClick($event, col, row)\"\n          (keydown.enter)=\"col.imageAction && col.imageAction(row)\"\n          (error)=\"onImageError($event, col.imageFallback)\"\n        />\n      </td>\n      }\n      }\n    </tr>\n  </ng-template>\n</p-table>\n\n<!-- Filter Overlay rendered outside the table to avoid overflow clipping -->\n@if (activeFilterColumn()) {\n<div class=\"tk-table__filter-backdrop\"\n  tabindex=\"-1\"\n  (click)=\"closeFilterOverlay()\"\n  (keydown.escape)=\"closeFilterOverlay()\"></div>\n<div\n  class=\"tk-table__filter-overlay\"\n  tabindex=\"-1\"\n  [style.top.px]=\"filterOverlayPosition().top\"\n  [style.left.px]=\"filterOverlayPosition().left\"\n  (click)=\"$event.stopPropagation()\"\n  (keydown.escape)=\"closeFilterOverlay()\">\n  <div class=\"tk-table__filter-list\">\n    @for (option of getUniqueColumnValues(activeFilterColumn()!); track option) {\n    <button\n      class=\"tk-table__filter-option\"\n      [class.tk-table__filter-option--selected]=\"getActiveFilterValue(activeFilterColumn()!) === option\"\n      type=\"button\"\n      [attr.aria-pressed]=\"getActiveFilterValue(activeFilterColumn()!) === option\"\n      (click)=\"selectFilterValue(activeFilterColumn()!, option)\">\n      {{ option }}\n    </button>\n    }\n  </div>\n  @if (isColumnFiltered(activeFilterColumn()!)) {\n  <div class=\"tk-table__filter-clear\">\n    <button\n      class=\"tk-table__filter-clear-btn\"\n      type=\"button\"\n      (click)=\"clearFilter(activeFilterColumn()!)\">\n      Clear filter\n    </button>\n  </div>\n  }\n</div>\n}\n", styles: [":host ::ng-deep .p-datatable-column-sorted{background-color:var(--tk-primary-100, #b7b0d2)!important;color:var(--tk-primary-700, #10004f)!important}:host ::ng-deep .p-datatable-column-sorted svg{color:var(--tk-primary-700, #10004f)!important}:host ::ng-deep .p-datatable-sortable-column{font-size:var(--tk-font-size-sm, .875rem);color:var(--tk-surface-950, #191a1b);padding:.625rem}:host ::ng-deep .p-datatable-sortable-column svg{color:var(--tk-surface-500, #424243)}:host ::ng-deep .p-button-secondary{background-color:var(--tk-surface-0, #ffffff);border:1px solid var(--tk-surface-0, #ffffff)}:host ::ng-deep .p-datatable-tbody td{color:var(--tk-surface-950, #191a1b);font-size:var(--tk-font-size-sm, .875rem);padding:.625rem}.tk-table__cell-img{display:block;object-fit:cover}.tk-table__cell-img--clickable{cursor:pointer}.tk-table__actions{display:flex;gap:var(--tk-spacing-gap-xs, .25rem)}.tk-table__header-content{display:flex;align-items:center;gap:.25rem;width:100%}.tk-table__header-label{white-space:nowrap}.tk-table__header--active{background-color:var(--tk-primary-100, #b7b0d2)!important}.tk-table__filter-trigger{display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border:none;background:transparent;border-radius:var(--tk-border-radius-xs, 4px);cursor:pointer;color:var(--tk-surface-500, #8a8a8b);transition:background-color .2s,color .2s;padding:0;margin-left:auto}.tk-table__filter-trigger:hover{background-color:var(--tk-surface-200, #e4e4e4);color:var(--tk-surface-700, #424243)}.tk-table__filter-trigger--active{color:var(--tk-primary-700, #10004f);background-color:var(--tk-primary-50, #e8e6f1)}.tk-table__filter-trigger--active:hover{background-color:var(--tk-primary-100, #b7b0d2);color:var(--tk-primary-700, #10004f)}.tk-table__filter-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;z-index:999;background:transparent}.tk-table__filter-overlay{position:fixed;z-index:1000;min-width:10rem;max-height:15rem;background-color:var(--tk-surface-0, #ffffff);border:1px solid var(--tk-surface-200, #e4e4e4);border-radius:var(--tk-border-radius-s, 8px);box-shadow:0 4px 16px #0000001f;overflow:hidden;display:flex;flex-direction:column;animation:tk-filter-fade-in .15s ease-out}.tk-table__filter-list{margin:0;padding:.25rem 0;overflow-y:auto;max-height:12rem;display:flex;flex-direction:column}.tk-table__filter-option{display:block;width:100%;padding:.5rem .75rem;font-size:.875rem;color:var(--tk-surface-950, #191a1b);cursor:pointer;transition:background-color .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;background:transparent;text-align:left}.tk-table__filter-option:hover{background-color:var(--tk-surface-100, #f2f1f1)}.tk-table__filter-option--selected{background-color:var(--tk-primary-50, #e8e6f1);color:var(--tk-primary-700, #10004f);font-weight:600}.tk-table__filter-option--selected:hover{background-color:var(--tk-primary-100, #b7b0d2)}.tk-table__filter-clear{border-top:1px solid var(--tk-surface-200, #e4e4e4);padding:.375rem .75rem;display:flex;justify-content:center}.tk-table__filter-clear-btn{background:transparent;border:none;color:var(--tk-primary-500, #16006f);font-size:.8125rem;font-weight:600;cursor:pointer;padding:.25rem .5rem;border-radius:var(--tk-border-radius-xs, 4px);transition:background-color .15s}.tk-table__filter-clear-btn:hover{background-color:var(--tk-primary-50, #e8e6f1)}:host ::ng-deep .p-datatable-thead>tr>th{position:relative}@keyframes tk-filter-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i1.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "component", type: i1.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "ngmodule", type: TagModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: TagComponent, selector: "tk-tag", inputs: ["value", "severity", "truncationLimit"] }, { kind: "component", type: ButtonComponent, selector: "tk-button", inputs: ["label", "disabled", "type", "severity", "variant", "link", "icon", "iconPosition", "tooltipText", "full", "ariaLabel", "size"], outputs: ["clicked"] }, { kind: "component", type: CheckboxComponent, selector: "tk-checkbox", inputs: ["model", "value", "label", "name", "inputId", "binary", "control", "errorMessage", "indeterminate", "disabled"], outputs: ["modelChange", "indeterminateChange", "disabledChange"] }, { kind: "component", type: ActionGroupComponent, selector: "tk-action-group", inputs: ["actions", "maxVisible", "disabled"] }, { kind: "component", type: IconComponent, selector: "tk-icon", inputs: ["icon", "styleIcon", "color", "size", "disabled"] }, { kind: "component", type: TimeAgoComponent, selector: "tk-time-ago", inputs: ["dateTime", "severity", "tooltipText", "tooltipFormat"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TableComponent, isStandalone: true, selector: "tk-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, columnFilters: { classPropertyName: "columnFilters", publicName: "columnFilters", isSignal: true, isRequired: false, transformFunction: null }, sortField: { classPropertyName: "sortField", publicName: "sortField", isSignal: true, isRequired: false, transformFunction: null }, sortOrder: { classPropertyName: "sortOrder", publicName: "sortOrder", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange", columnFilters: "columnFiltersChange", sortField: "sortFieldChange", sortOrder: "sortOrderChange" }, viewQueries: [{ propertyName: "tableRef", first: true, predicate: ["tableRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<p-table #tableRef [selection]=\"selection()\" (selectionChange)=\"updateSelection($any($event))\"\n  [selectionMode]=\"selectionMode()\" [dataKey]=\"dataKey()\" [value]=\"internalData()\" [customSort]=\"true\"\n  (sortFunction)=\"customSort($event)\" [tableStyle]=\"{ 'min-width': '60rem' }\" responsiveLayout=\"scroll\">\n  <!-- HEADER -->\n  <ng-template pTemplate=\"header\">\n    <tr>\n      @for (col of columns(); track col.header) {\n      <th [id]=\"col.field\" [style.width]=\"col.width\"\n        [pSortableColumn]=\"col.sortable ? col.field : undefined\"\n        [class.tk-table__header--active]=\"activeFilterColumn() === col.field || isColumnFiltered(col.field!)\">\n        <div class=\"tk-table__header-content\">\n          @if (col.type === 'selection' && selectionMode() === 'multiple') {\n          <div class=\"tk-table__actions hide-validation-messages\">\n            <tk-checkbox [binary]=\"true\" [model]=\"isAllSelected()\" [indeterminate]=\"isPartiallySelected()\"\n              (click)=\"$event.stopPropagation()\" (keypress)=\"$event.stopPropagation()\"\n              (modelChange)=\"toggleAll($event)\"></tk-checkbox>\n          </div>\n          } @else if (col.type !== 'selection') {\n          <span class=\"tk-table__header-label\">{{ col.header }}</span>\n          @if (col.sortable) {\n          <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n          }\n          @if (col.filterable && col.field) {\n          <button\n            class=\"tk-table__filter-trigger\"\n            [class.tk-table__filter-trigger--active]=\"isColumnFiltered(col.field)\"\n            (click)=\"toggleFilterOverlay(col.field, $event)\"\n            type=\"button\"\n            [attr.aria-label]=\"'Filter ' + col.header\">\n            <tk-icon icon=\"filter\" size=\"sm\"></tk-icon>\n          </button>\n          }\n          }\n        </div>\n      </th>\n      }\n    </tr>\n  </ng-template>\n\n  <!-- BODY -->\n  <ng-template pTemplate=\"body\" let-row>\n    <tr [pSelectableRow]=\"row\">\n      @for (col of columns(); track col.header) {\n      <!-- SELECTION -->\n      @if (col.type === 'selection') {\n      <td>\n        @if (selectionMode() === 'multiple') {\n        <tk-checkbox [model]=\"selection()\" [value]=\"row\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\" (modelChange)=\"updateSelection($any($event))\"></tk-checkbox>\n        }\n      </td>\n      }\n\n      <!-- CHECKBOX (Boolean field) -->\n      @if (col.type === 'checkbox') {\n      <td>\n        <tk-checkbox [binary]=\"true\" [(model)]=\"row[col.field!]\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\"></tk-checkbox>\n      </td>\n      }\n\n      <!-- TEXT (default) -->\n      @if (!col.type || col.type === 'text') {\n      <td>{{ row[col.field!] }}</td>\n      }\n\n      <!-- TAG -->\n      @if (col.type === 'tag') {\n      <td>\n        <tk-tag [value]=\"row[col.field!]\" [severity]=\"col.tagSeverity!(row)\" />\n      </td>\n      }\n\n      <!-- ACTIONS -->\n      @if (col.type === 'actions') {\n      <td>\n        <div class=\"tk-table__actions\">\n          @for (action of col.actions!; track action.icon) {\n          <tk-button [icon]=\"action.icon\" severity=\"secondary\" (click)=\"$event.stopPropagation()\"\n            (keypress)=\"$event.stopPropagation()\" (clicked)=\"action?.action(row)\"></tk-button>\n          }\n        </div>\n      </td>\n      }\n\n      <!-- ACTION GROUP -->\n      @if (col.type === 'action-group') {\n      <td>\n        <div class=\"tk-table__actions\">\n          <tk-action-group\n            [actions]=\"getActionGroup(col.actionGroup!, row)\"\n            [maxVisible]=\"col.actionGroupMaxVisible ?? 2\"\n            [disabled]=\"col.actionGroupDisabled ?? false\"\n            (click)=\"$event.stopPropagation()\"\n            (keypress)=\"$event.stopPropagation()\"\n          ></tk-action-group>\n        </div>\n      </td>\n      }\n\n      <!-- CONNECTION STATUS -->\n      @if (col.type === 'connection-status') {\n      <td>\n        <tk-time-ago\n          [dateTime]=\"row[col.field!]\"\n          [severity]=\"col.connectionStatusSeverity ? col.connectionStatusSeverity(row) : 'success'\"\n          [tooltipText]=\"col.connectionStatusTooltipText ? col.connectionStatusTooltipText(row) : undefined\" />\n      </td>\n      }\n\n      <!-- IMAGE -->\n      @if (col.type === 'image') {\n      <td>\n        <img\n          class=\"tk-table__cell-img\"\n          [class.tk-table__cell-img--clickable]=\"!!col.imageAction\"\n          [src]=\"row[col.field!]\"\n          [alt]=\"col.imageAlt ? col.imageAlt(row) : ''\"\n          [style.width]=\"col.imageWidth ?? '40px'\"\n          [style.height]=\"col.imageHeight ?? '40px'\"\n          [attr.tabindex]=\"col.imageAction ? 0 : null\"\n          [attr.role]=\"col.imageAction ? 'button' : null\"\n          (click)=\"handleImageClick($event, col, row)\"\n          (keydown.enter)=\"col.imageAction && col.imageAction(row)\"\n          (error)=\"onImageError($event, col.imageFallback)\"\n        />\n      </td>\n      }\n      }\n    </tr>\n  </ng-template>\n</p-table>\n\n<!-- Filter Overlay rendered outside the table to avoid overflow clipping -->\n@if (activeFilterColumn()) {\n<div class=\"tk-table__filter-backdrop\"\n  tabindex=\"-1\"\n  (click)=\"closeFilterOverlay()\"\n  (keydown.escape)=\"closeFilterOverlay()\"></div>\n<div\n  class=\"tk-table__filter-overlay\"\n  tabindex=\"-1\"\n  [style.top.px]=\"filterOverlayPosition().top\"\n  [style.left.px]=\"filterOverlayPosition().left\"\n  (click)=\"$event.stopPropagation()\"\n  (keydown.escape)=\"closeFilterOverlay()\">\n  <div class=\"tk-table__filter-list\">\n    @for (option of getUniqueColumnValues(activeFilterColumn()!); track option) {\n    <button\n      class=\"tk-table__filter-option\"\n      [class.tk-table__filter-option--selected]=\"getActiveFilterValue(activeFilterColumn()!) === option\"\n      type=\"button\"\n      [attr.aria-pressed]=\"getActiveFilterValue(activeFilterColumn()!) === option\"\n      (click)=\"selectFilterValue(activeFilterColumn()!, option)\">\n      {{ option }}\n    </button>\n    }\n  </div>\n  @if (isColumnFiltered(activeFilterColumn()!)) {\n  <div class=\"tk-table__filter-clear\">\n    <button\n      class=\"tk-table__filter-clear-btn\"\n      type=\"button\"\n      (click)=\"clearFilter(activeFilterColumn()!)\">\n      Clear filter\n    </button>\n  </div>\n  }\n</div>\n}\n", styles: [":host ::ng-deep .p-datatable-column-sorted{background-color:var(--tk-primary-100, #b7b0d2)!important;color:var(--tk-primary-700, #10004f)!important}:host ::ng-deep .p-datatable-column-sorted svg{color:var(--tk-primary-700, #10004f)!important}:host ::ng-deep .p-datatable-sortable-column{font-size:var(--tk-font-size-sm, .875rem);color:var(--tk-surface-950, #191a1b);padding:.625rem}:host ::ng-deep .p-datatable-sortable-column svg{color:var(--tk-surface-500, #424243)}:host ::ng-deep .p-button-secondary{background-color:var(--tk-surface-0, #ffffff);border:1px solid var(--tk-surface-0, #ffffff)}:host ::ng-deep .p-datatable-tbody td{color:var(--tk-surface-950, #191a1b);font-size:var(--tk-font-size-sm, .875rem);padding:.625rem}.tk-table__cell-img{display:block;object-fit:cover}.tk-table__cell-img--clickable{cursor:pointer}.tk-table__actions{display:flex;gap:var(--tk-spacing-gap-xs, .25rem)}.tk-table__header-content{display:flex;align-items:center;gap:.25rem;width:100%}.tk-table__header-label{white-space:nowrap}.tk-table__header--active{background-color:var(--tk-primary-100, #b7b0d2)!important}.tk-table__filter-trigger{display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border:none;background:transparent;border-radius:var(--tk-border-radius-xs, 4px);cursor:pointer;color:var(--tk-surface-500, #8a8a8b);transition:background-color .2s,color .2s;padding:0;margin-left:auto}.tk-table__filter-trigger:hover{background-color:var(--tk-surface-200, #e4e4e4);color:var(--tk-surface-700, #424243)}.tk-table__filter-trigger--active{color:var(--tk-primary-700, #10004f);background-color:var(--tk-primary-50, #e8e6f1)}.tk-table__filter-trigger--active:hover{background-color:var(--tk-primary-100, #b7b0d2);color:var(--tk-primary-700, #10004f)}.tk-table__filter-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;z-index:999;background:transparent}.tk-table__filter-overlay{position:fixed;z-index:1000;min-width:10rem;max-height:15rem;background-color:var(--tk-surface-0, #ffffff);border:1px solid var(--tk-surface-200, #e4e4e4);border-radius:var(--tk-border-radius-s, 8px);box-shadow:0 4px 16px #0000001f;overflow:hidden;display:flex;flex-direction:column;animation:tk-filter-fade-in .15s ease-out}.tk-table__filter-list{margin:0;padding:.25rem 0;overflow-y:auto;max-height:12rem;display:flex;flex-direction:column}.tk-table__filter-option{display:block;width:100%;padding:.5rem .75rem;font-size:.875rem;color:var(--tk-surface-950, #191a1b);cursor:pointer;transition:background-color .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;background:transparent;text-align:left}.tk-table__filter-option:hover{background-color:var(--tk-surface-100, #f2f1f1)}.tk-table__filter-option--selected{background-color:var(--tk-primary-50, #e8e6f1);color:var(--tk-primary-700, #10004f);font-weight:600}.tk-table__filter-option--selected:hover{background-color:var(--tk-primary-100, #b7b0d2)}.tk-table__filter-clear{border-top:1px solid var(--tk-surface-200, #e4e4e4);padding:.375rem .75rem;display:flex;justify-content:center}.tk-table__filter-clear-btn{background:transparent;border:none;color:var(--tk-primary-500, #16006f);font-size:.8125rem;font-weight:600;cursor:pointer;padding:.25rem .5rem;border-radius:var(--tk-border-radius-xs, 4px);transition:background-color .15s}.tk-table__filter-clear-btn:hover{background-color:var(--tk-primary-50, #e8e6f1)}:host ::ng-deep .p-datatable-thead>tr>th{position:relative}@keyframes tk-filter-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i1.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "component", type: i1.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "ngmodule", type: TagModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: TagComponent, selector: "tk-tag", inputs: ["value", "severity", "truncationLimit"] }, { kind: "component", type: ButtonComponent, selector: "tk-button", inputs: ["label", "disabled", "type", "severity", "variant", "link", "icon", "iconPosition", "tooltipText", "full", "ariaLabel", "size"], outputs: ["clicked"] }, { kind: "component", type: CheckboxComponent, selector: "tk-checkbox", inputs: ["model", "value", "label", "name", "inputId", "binary", "control", "errorMessage", "hint", "indeterminate", "disabled"], outputs: ["modelChange", "indeterminateChange", "disabledChange"] }, { kind: "component", type: ActionGroupComponent, selector: "tk-action-group", inputs: ["actions", "maxVisible", "disabled"] }, { kind: "component", type: IconComponent, selector: "tk-icon", inputs: ["icon", "styleIcon", "color", "size", "disabled"] }, { kind: "component", type: TimeAgoComponent, selector: "tk-time-ago", inputs: ["dateTime", "severity", "tooltipText", "tooltipFormat"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,

package/fesm2022/tekus-design-system-components-table.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tekus-design-system-components-table.mjs","sources":["../../../projects/design-system/components/table/src/table.component.ts","../../../projects/design-system/components/table/src/table.component.html","../../../projects/design-system/components/table/tekus-design-system-components-table.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n computed,\n effect,\n input,\n model,\n signal,\n viewChild,\n} from '@angular/core';\nimport { Table, TableModule } from 'primeng/table';\nimport { TagModule } from 'primeng/tag';\nimport { ButtonModule } from 'primeng/button';\nimport { TableColumn } from './table.interface';\nimport { TagComponent } from '@tekus/design-system/components/tag';\nimport { SortEvent } from 'primeng/api';\nimport { ButtonComponent } from '@tekus/design-system/components/button';\nimport { CheckboxComponent } from '@tekus/design-system/components/checkbox';\nimport {\n ActionGroupComponent,\n TkAction,\n} from '@tekus/design-system/components/action-group';\nimport { IconComponent } from '@tekus/design-system/components/icon';\nimport { TimeAgoComponent } from '@tekus/design-system/components/time-ago';\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'tk-table',\n imports: [\n TableModule,\n TagModule,\n ButtonModule,\n TagComponent,\n ButtonComponent,\n CheckboxComponent,\n ActionGroupComponent,\n IconComponent,\n TimeAgoComponent,\n ],\n templateUrl: './table.component.html',\n styleUrl: './table.component.scss',\n})\n/*\n @component TableComponent\n * @description\n * Generic table wrapper around PrimeNG Table component.\n * Displays tabular data with configurable columns and support for custom rendering via template.\n \n @usage\n * ```html\n * <tk-table [data]=\"items\" [columns]=\"columnConfig\"></tk-table>\n * ```\n /\nexport class TableComponent<T = unknown> {\n /\n @property {InputSignal<T[]>} data\n * @description\n * Array of data objects to display in the table rows.\n * Each object corresponds to one row; properties are mapped to columns via the `columns` input.\n \n @default []\n \n @example\n * [data]=\"[\n * { id: 1, name: 'John', status: 'active' },\n * { id: 2, name: 'Jane', status: 'inactive' }\n * ]\"\n /\n data = input<T[]>([]);\n\n /\n @property {viewChild} tableRef\n * @description\n * Reference to the PrimeNG Table component instance.\n * Used to access table methods and properties directly.\n /\n readonly tableRef = viewChild<Table>('tableRef');\n\n /\n @property {InputSignal<TableColumn<T>[]>} columns\n * @description\n * Array of column definitions that describe how to render each column.\n * Each column object specifies the field name, header label, and optional rendering behavior.\n \n @default []\n \n @example\n * [columns]=\"[\n * { field: 'id', header: 'ID' },\n * { field: 'name', header: 'Name' },\n * { field: 'status', header: 'Status', renderAs: 'tag' }\n * ]\"\n /\n columns = input<TableColumn<T>[]>([]);\n\n /\n @property {InputSignal<'single' \| 'multiple' \| undefined>} selectionMode\n * @description\n * Selection mode of the table.\n /\n selectionMode = input<'single' \| 'multiple' \| undefined>(undefined);\n\n /\n @property {ModelSignal<any[]>} selection\n * @description\n * Selected row(s) in the table.\n /\n selection = model<T[]>([]);\n\n /\n @property {InputSignal<string \| undefined>} dataKey\n * @description\n * Property name to uniquely identify a row.\n /\n dataKey = input<string \| undefined>(undefined);\n\n readonly initialData = signal<T[]>([]);\n readonly internalData = signal<T[]>([]);\n readonly isSorted = signal<boolean \| null>(null);\n\n /* Tracks which column's filter overlay is currently open /\n readonly activeFilterColumn = signal<string \| null>(null);\n\n /* Stores the selected filter value per column field (null = no filter) /\n readonly columnFilters = model<Record<string, string \| null>>({});\n\n /* Two-way bindable signal for the active sort field /\n readonly sortField = model<string \| null>(null);\n\n /* Two-way bindable signal for the active sort order (1 for asc, -1 for desc) /\n readonly sortOrder = model<1 \| -1 \| null>(null);\n\n /* Position of the filter overlay (fixed, relative to viewport) /\n readonly filterOverlayPosition = signal<{ top: number; left: number }>({\n top: 0,\n left: 0,\n });\n\n /\n @computed isAllSelected\n * @description\n * Returns true if all visible rows are selected.\n /\n isAllSelected = computed(() => {\n const data = this.internalData();\n const selected = this.selection();\n if (data.length === 0 \|\| selected.length === 0) return false;\n\n // We strictly use full objects for selection now.\n return data.every(row => selected.includes(row));\n });\n\n /\n @computed isPartiallySelected\n * @description\n * Returns true if some but not all rows are selected.\n /\n isPartiallySelected = computed(() => {\n const data = this.internalData();\n const selected = this.selection();\n if (data.length === 0 \|\| selected.length === 0) return false;\n\n const allSelected = this.isAllSelected();\n return !allSelected && selected.length > 0;\n });\n\n constructor() {\n /\n @effect data → initialData sync\n * @description\n * Whenever the data input changes, update initialData.\n /\n effect(() => {\n this.initialData.set([...this.data()]);\n });\n\n /\n @effect filters/data → internalData sync\n * @description\n * Re-apply all filters whenever the initial data or the column filters change.\n * Also applies sorting if there is an active sort.\n /\n effect(() => {\n const filtered = this.getFilteredData();\n const field = this.sortField();\n const order = this.sortOrder();\n\n if (field && order && filtered.length > 0) {\n const event: SortEvent = {\n data: filtered,\n field,\n order,\n };\n this.sortTableData(event);\n }\n this.internalData.set(filtered);\n });\n\n /\n @effect sortField/sortOrder → table sort sync\n * @description\n * Listen to external changes to the sortField and sortOrder models, and trigger PrimeNG Table's sort/reset.\n /\n effect(() => {\n const field = this.sortField();\n const order = this.sortOrder();\n const table = this.tableRef();\n if (!table) return;\n\n // Only apply sorting if it is different from the table's current internal state\n if (table.sortField !== field \|\| table.sortOrder !== order) {\n if (field && order) {\n table.sort({ field, order });\n } else if (!field && !order && (table.sortField \|\| table.sortOrder)) {\n table.reset();\n }\n }\n });\n }\n\n /\n @method toggleAll\n * @description\n * Toggles selection of all visible rows using full objects.\n * @param checked {unknown}\n /\n toggleAll(checked: unknown) {\n if (checked) {\n this.selection.set([...this.internalData()]);\n } else {\n this.selection.set([]);\n }\n }\n\n /\n @method updateSelection\n * @description\n * Updates row selection state from checkbox interaction.\n * @param value {any[]}\n /\n updateSelection(value: T[]) {\n this.selection.set([...value]);\n }\n\n private readonly actionGroupCache = new Map<\n unknown,\n Map<unknown, TkAction[]>\n >();\n\n getActionGroup(\n actions: NonNullable<TableColumn<T>['actionGroup']>,\n row: T\n ): TkAction[] {\n if (!actions) return [];\n if (!this.actionGroupCache.has(actions)) {\n this.actionGroupCache.set(actions, new Map());\n }\n const rowCache = this.actionGroupCache.get(actions)!;\n if (!rowCache.has(row)) {\n rowCache.set(\n row,\n actions.map(a => ({\n icon: a.icon,\n label: a.label,\n action: () => a.action(row),\n disabled: typeof a.disabled === 'function' ? a.disabled(row) : (a.disabled ?? false),\n }))\n );\n }\n return rowCache.get(row)!;\n }\n\n customSort(event: SortEvent) {\n const extField = this.sortField();\n const extOrder = this.sortOrder();\n\n // If this is triggered by the external model updates, apply it directly without cycling\n if (event.field === extField && event.order === extOrder) {\n if (extOrder === 1) {\n this.isSorted.set(true);\n this.sortTableData(event);\n } else if (extOrder === -1) {\n this.isSorted.set(false);\n this.sortTableData(event);\n } else {\n this.isSorted.set(null);\n this.internalData.set(this.getFilteredData());\n }\n return;\n }\n\n // Otherwise, it is a user click: run the cycling logic\n if (this.isSorted() === null \|\| this.isSorted() === undefined) {\n this.isSorted.set(true);\n this.sortField.set(event.field ?? null);\n this.sortOrder.set(1);\n this.sortTableData(event);\n } else if (this.isSorted()) {\n this.isSorted.set(false);\n this.sortField.set(event.field ?? null);\n this.sortOrder.set(-1);\n this.sortTableData(event);\n } else {\n this.isSorted.set(null);\n this.sortField.set(null);\n this.sortOrder.set(null);\n this.internalData.set(this.getFilteredData());\n this.tableRef()?.reset();\n }\n }\n\n sortTableData(event: SortEvent) {\n if (!event.data \|\| !event.field) return;\n\n event.data.sort((data1, data2) => {\n const value1 = data1[event.field!];\n const value2 = data2[event.field!];\n let result = null;\n if (value1 == null && value2 != null) result = -1;\n else if (value1 != null && value2 == null) result = 1;\n else if (value1 == null && value2 == null) result = 0;\n else if (typeof value1 === 'string' && typeof value2 === 'string')\n result = value1.localeCompare(value2);\n else if (value1 < value2) {\n result = -1;\n } else if (value1 > value2) {\n result = 1;\n } else {\n result = 0;\n }\n\n return (event.order ?? 1) result;\n });\n }\n\n // ─── Filter Methods ───────────────────────────────────────────────────────────\n\n /*\n @method toggleFilterOverlay\n * @description\n * Opens or closes the filter overlay for a given column.\n * Captures the trigger button position to render the overlay in fixed position.\n /\n toggleFilterOverlay(field: string, event: MouseEvent): void {\n event.stopPropagation();\n if (this.activeFilterColumn() === field) {\n this.activeFilterColumn.set(null);\n } else {\n const trigger = event.currentTarget as HTMLElement;\n const rect = trigger.getBoundingClientRect();\n this.filterOverlayPosition.set({\n top: rect.bottom + 4,\n left: rect.left,\n });\n this.activeFilterColumn.set(field);\n }\n }\n\n /\n @method closeFilterOverlay\n * @description\n * Closes the filter overlay.\n /\n closeFilterOverlay(): void {\n this.activeFilterColumn.set(null);\n }\n\n /\n @method getUniqueColumnValues\n * @description\n * Returns the unique values for a given column, considering active filters\n * on other columns. This ensures the list only shows values that exist\n * in the currently filtered dataset.\n /\n getUniqueColumnValues(field: string): string[] {\n const filters = this.columnFilters();\n let data = [...this.initialData()];\n\n // Apply all filters EXCEPT the one for the current field\n for (const filterField of Object.keys(filters)) {\n if (filterField === field) continue;\n const selectedValue = filters[filterField];\n if (selectedValue == null) continue;\n\n data = data.filter(row => {\n const cellValue = (row as Record<string, unknown>)[filterField];\n return (\n cellValue != null && this.cellToString(cellValue) === selectedValue\n );\n });\n }\n\n const values = data\n .map(row => (row as Record<string, unknown>)[field])\n .filter(\n (v): v is string \| number \| boolean =>\n v != null && typeof v !== 'object'\n )\n .map(String);\n\n return [...new Set(values)].sort((a, b) => a.localeCompare(b));\n }\n\n /\n @method selectFilterValue\n * @description\n * Selects a value from the filter list and applies the filter.\n /\n selectFilterValue(field: string, value: string): void {\n const filters = { ...this.columnFilters() };\n filters[field] = value;\n this.columnFilters.set(filters);\n this.applyAllFilters();\n this.activeFilterColumn.set(null);\n }\n\n /\n @method clearFilter\n * @description\n * Clears the filter for a specific column and re-applies remaining filters.\n /\n clearFilter(field: string): void {\n const filters = { ...this.columnFilters() };\n delete filters[field];\n this.columnFilters.set(filters);\n this.applyAllFilters();\n this.activeFilterColumn.set(null);\n }\n\n /\n @method isColumnFiltered\n * @description\n * Returns whether a column currently has an active filter.\n /\n isColumnFiltered(field: string): boolean {\n return this.columnFilters()[field] != null;\n }\n\n /\n @method getActiveFilterValue\n * @description\n * Returns the currently selected filter value for a column, or null.\n /\n getActiveFilterValue(field: string): string \| null {\n return this.columnFilters()[field] ?? null;\n }\n\n /\n @method applyAllFilters\n * @description\n * Applies all active column filters to the initial data set.\n /\n private applyAllFilters(): void {\n this.internalData.set(this.getFilteredData());\n }\n\n /\n @method getFilteredData\n * @description\n * Returns the initial data filtered by all active column filters.\n * Used by both applyAllFilters and customSort (reset) to ensure\n * sorting never discards active filters.\n /\n private getFilteredData(): T[] {\n const filters = this.columnFilters();\n let filtered = [...this.initialData()];\n\n for (const field of Object.keys(filters)) {\n const selectedValue = filters[field];\n if (selectedValue == null) continue;\n\n filtered = filtered.filter(row => {\n const cellValue = (row as Record<string, unknown>)[field];\n return (\n cellValue != null && this.cellToString(cellValue) === selectedValue\n );\n });\n }\n\n return filtered;\n }\n\n /\n @method cellToString\n * @description\n * Safely converts a cell value to its string representation.\n * Handles primitives directly and avoids [object Object] for complex types.\n /\n private cellToString(value: unknown): string {\n if (typeof value === 'string') return value;\n if (typeof value === 'number' \|\| typeof value === 'boolean')\n return `${value}`;\n return JSON.stringify(value);\n }\n\n /\n @method handleImageClick\n * @description\n * Handles click events on image-type cells.\n * Stops row selection propagation and invokes the column's imageAction callback when defined.\n * No-op when imageAction is not set, preserving default row-click behavior.\n * @param event {Event} - The native click event.\n * @param col {TableColumn<T>} - The column definition that may carry an imageAction.\n * @param row {T} - The data row associated with the clicked image.\n /\n handleImageClick(event: Event, col: TableColumn<T>, row: T): void {\n if (col.imageAction) {\n event.stopPropagation();\n col.imageAction(row);\n }\n }\n\n /\n @method onImageError\n * @description\n * Handles image load errors by replacing the broken src with a fallback URL.\n * Called from the template's (error) binding on image-type columns.\n * @param event {Event} - The native error event from the <img> element.\n * @param fallback {string \| undefined} - Optional URL to use as replacement src.\n /\n onImageError(event: Event, fallback?: string): void {\n if (fallback) {\n (event.target as HTMLImageElement).src = fallback;\n }\n }\n}\n","<p-table #tableRef [selection]=\"selection()\" (selectionChange)=\"updateSelection($any($event))\"\n [selectionMode]=\"selectionMode()\" [dataKey]=\"dataKey()\" [value]=\"internalData()\" [customSort]=\"true\"\n (sortFunction)=\"customSort($event)\" [tableStyle]=\"{ 'min-width': '60rem' }\" responsiveLayout=\"scroll\">\n <!-- HEADER -->\n <ng-template pTemplate=\"header\">\n <tr>\n @for (col of columns(); track col.header) {\n <th [id]=\"col.field\" [style.width]=\"col.width\"\n [pSortableColumn]=\"col.sortable ? col.field : undefined\"\n [class.tk-table__header--active]=\"activeFilterColumn() === col.field \|\| isColumnFiltered(col.field!)\">\n <div class=\"tk-table__header-content\">\n @if (col.type === 'selection' && selectionMode() === 'multiple') {\n <div class=\"tk-table__actions hide-validation-messages\">\n <tk-checkbox [binary]=\"true\" [model]=\"isAllSelected()\" [indeterminate]=\"isPartiallySelected()\"\n (click)=\"$event.stopPropagation()\" (keypress)=\"$event.stopPropagation()\"\n (modelChange)=\"toggleAll($event)\"></tk-checkbox>\n </div>\n } @else if (col.type !== 'selection') {\n <span class=\"tk-table__header-label\">{{ col.header }}</span>\n @if (col.sortable) {\n <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n }\n @if (col.filterable && col.field) {\n <button\n class=\"tk-table__filter-trigger\"\n [class.tk-table__filter-trigger--active]=\"isColumnFiltered(col.field)\"\n (click)=\"toggleFilterOverlay(col.field, $event)\"\n type=\"button\"\n [attr.aria-label]=\"'Filter ' + col.header\">\n <tk-icon icon=\"filter\" size=\"sm\"></tk-icon>\n </button>\n }\n }\n </div>\n </th>\n }\n </tr>\n </ng-template>\n\n <!-- BODY -->\n <ng-template pTemplate=\"body\" let-row>\n <tr [pSelectableRow]=\"row\">\n @for (col of columns(); track col.header) {\n <!-- SELECTION -->\n @if (col.type === 'selection') {\n <td>\n @if (selectionMode() === 'multiple') {\n <tk-checkbox [model]=\"selection()\" [value]=\"row\" (click)=\"$event.stopPropagation()\"\n (keypress)=\"$event.stopPropagation()\" (modelChange)=\"updateSelection($any($event))\"></tk-checkbox>\n }\n </td>\n }\n\n <!-- CHECKBOX (Boolean field) -->\n @if (col.type === 'checkbox') {\n <td>\n <tk-checkbox [binary]=\"true\" [(model)]=\"row[col.field!]\" (click)=\"$event.stopPropagation()\"\n (keypress)=\"$event.stopPropagation()\"></tk-checkbox>\n </td>\n }\n\n <!-- TEXT (default) -->\n @if (!col.type \|\| col.type === 'text') {\n <td>{{ row[col.field!] }}</td>\n }\n\n <!-- TAG -->\n @if (col.type === 'tag') {\n <td>\n <tk-tag [value]=\"row[col.field!]\" [severity]=\"col.tagSeverity!(row)\" />\n </td>\n }\n\n <!-- ACTIONS -->\n @if (col.type === 'actions') {\n <td>\n <div class=\"tk-table__actions\">\n @for (action of col.actions!; track action.icon) {\n <tk-button [icon]=\"action.icon\" severity=\"secondary\" (click)=\"$event.stopPropagation()\"\n (keypress)=\"$event.stopPropagation()\" (clicked)=\"action?.action(row)\"></tk-button>\n }\n </div>\n </td>\n }\n\n <!-- ACTION GROUP -->\n @if (col.type === 'action-group') {\n <td>\n <div class=\"tk-table__actions\">\n <tk-action-group\n [actions]=\"getActionGroup(col.actionGroup!, row)\"\n [maxVisible]=\"col.actionGroupMaxVisible ?? 2\"\n [disabled]=\"col.actionGroupDisabled ?? false\"\n (click)=\"$event.stopPropagation()\"\n (keypress)=\"$event.stopPropagation()\"\n ></tk-action-group>\n </div>\n </td>\n }\n\n <!-- CONNECTION STATUS -->\n @if (col.type === 'connection-status') {\n <td>\n <tk-time-ago\n [dateTime]=\"row[col.field!]\"\n [severity]=\"col.connectionStatusSeverity ? col.connectionStatusSeverity(row) : 'success'\"\n [tooltipText]=\"col.connectionStatusTooltipText ? col.connectionStatusTooltipText(row) : undefined\" />\n </td>\n }\n\n <!-- IMAGE -->\n @if (col.type === 'image') {\n <td>\n <img\n class=\"tk-table__cell-img\"\n [class.tk-table__cell-img--clickable]=\"!!col.imageAction\"\n [src]=\"row[col.field!]\"\n [alt]=\"col.imageAlt ? col.imageAlt(row) : ''\"\n [style.width]=\"col.imageWidth ?? '40px'\"\n [style.height]=\"col.imageHeight ?? '40px'\"\n [attr.tabindex]=\"col.imageAction ? 0 : null\"\n [attr.role]=\"col.imageAction ? 'button' : null\"\n (click)=\"handleImageClick($event, col, row)\"\n (keydown.enter)=\"col.imageAction && col.imageAction(row)\"\n (error)=\"onImageError($event, col.imageFallback)\"\n />\n </td>\n }\n }\n </tr>\n </ng-template>\n</p-table>\n\n<!-- Filter Overlay rendered outside the table to avoid overflow clipping -->\n@if (activeFilterColumn()) {\n<div class=\"tk-table__filter-backdrop\"\n tabindex=\"-1\"\n (click)=\"closeFilterOverlay()\"\n (keydown.escape)=\"closeFilterOverlay()\"></div>\n<div\n class=\"tk-table__filter-overlay\"\n tabindex=\"-1\"\n [style.top.px]=\"filterOverlayPosition().top\"\n [style.left.px]=\"filterOverlayPosition().left\"\n (click)=\"$event.stopPropagation()\"\n (keydown.escape)=\"closeFilterOverlay()\">\n <div class=\"tk-table__filter-list\">\n @for (option of getUniqueColumnValues(activeFilterColumn()!); track option) {\n <button\n class=\"tk-table__filter-option\"\n [class.tk-table__filter-option--selected]=\"getActiveFilterValue(activeFilterColumn()!) === option\"\n type=\"button\"\n [attr.aria-pressed]=\"getActiveFilterValue(activeFilterColumn()!) === option\"\n (click)=\"selectFilterValue(activeFilterColumn()!, option)\">\n {{ option }}\n </button>\n }\n </div>\n @if (isColumnFiltered(activeFilterColumn()!)) {\n <div class=\"tk-table__filter-clear\">\n <button\n class=\"tk-table__filter-clear-btn\"\n type=\"button\"\n (click)=\"clearFilter(activeFilterColumn()!)\">\n Clear filter\n </button>\n </div>\n }\n</div>\n}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"tekus-design-system-components-table.mjs","sources":["../../../projects/design-system/components/table/src/table.component.ts","../../../projects/design-system/components/table/src/table.component.html","../../../projects/design-system/components/table/tekus-design-system-components-table.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n computed,\n effect,\n input,\n model,\n signal,\n viewChild,\n} from '@angular/core';\nimport { Table, TableModule } from 'primeng/table';\nimport { TagModule } from 'primeng/tag';\nimport { ButtonModule } from 'primeng/button';\nimport { TableColumn } from './table.interface';\nimport { TagComponent } from '@tekus/design-system/components/tag';\nimport { SortEvent } from 'primeng/api';\nimport { ButtonComponent } from '@tekus/design-system/components/button';\nimport { CheckboxComponent } from '@tekus/design-system/components/checkbox';\nimport {\n ActionGroupComponent,\n TkAction,\n} from '@tekus/design-system/components/action-group';\nimport { IconComponent } from '@tekus/design-system/components/icon';\nimport { TimeAgoComponent } from '@tekus/design-system/components/time-ago';\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'tk-table',\n imports: [\n TableModule,\n TagModule,\n ButtonModule,\n TagComponent,\n ButtonComponent,\n CheckboxComponent,\n ActionGroupComponent,\n IconComponent,\n TimeAgoComponent,\n ],\n templateUrl: './table.component.html',\n styleUrl: './table.component.scss',\n})\n/*\n @component TableComponent\n * @description\n * Generic table wrapper around PrimeNG Table component.\n * Displays tabular data with configurable columns and support for custom rendering via template.\n \n @usage\n * ```html\n * <tk-table [data]=\"items\" [columns]=\"columnConfig\"></tk-table>\n * ```\n /\nexport class TableComponent<T = unknown> {\n /\n @property {InputSignal<T[]>} data\n * @description\n * Array of data objects to display in the table rows.\n * Each object corresponds to one row; properties are mapped to columns via the `columns` input.\n \n @default []\n \n @example\n * [data]=\"[\n * { id: 1, name: 'John', status: 'active' },\n * { id: 2, name: 'Jane', status: 'inactive' }\n * ]\"\n /\n data = input<T[]>([]);\n\n /\n @property {viewChild} tableRef\n * @description\n * Reference to the PrimeNG Table component instance.\n * Used to access table methods and properties directly.\n /\n readonly tableRef = viewChild<Table>('tableRef');\n\n /\n @property {InputSignal<TableColumn<T>[]>} columns\n * @description\n * Array of column definitions that describe how to render each column.\n * Each column object specifies the field name, header label, and optional rendering behavior.\n \n @default []\n \n @example\n * [columns]=\"[\n * { field: 'id', header: 'ID' },\n * { field: 'name', header: 'Name' },\n * { field: 'status', header: 'Status', renderAs: 'tag' }\n * ]\"\n /\n columns = input<TableColumn<T>[]>([]);\n\n /\n @property {InputSignal<'single' \| 'multiple' \| undefined>} selectionMode\n * @description\n * Selection mode of the table.\n /\n selectionMode = input<'single' \| 'multiple' \| undefined>(undefined);\n\n /\n @property {ModelSignal<any[]>} selection\n * @description\n * Selected row(s) in the table.\n /\n selection = model<T[]>([]);\n\n /\n @property {InputSignal<string \| undefined>} dataKey\n * @description\n * Property name to uniquely identify a row.\n /\n dataKey = input<string \| undefined>(undefined);\n\n readonly initialData = signal<T[]>([]);\n readonly internalData = signal<T[]>([]);\n readonly isSorted = signal<boolean \| null>(null);\n\n /* Tracks which column's filter overlay is currently open /\n readonly activeFilterColumn = signal<string \| null>(null);\n\n /* Stores the selected filter value per column field (null = no filter) /\n readonly columnFilters = model<Record<string, string \| null>>({});\n\n /* Two-way bindable signal for the active sort field /\n readonly sortField = model<string \| null>(null);\n\n /* Two-way bindable signal for the active sort order (1 for asc, -1 for desc) /\n readonly sortOrder = model<1 \| -1 \| null>(null);\n\n /* Position of the filter overlay (fixed, relative to viewport) /\n readonly filterOverlayPosition = signal<{ top: number; left: number }>({\n top: 0,\n left: 0,\n });\n\n /\n @computed isAllSelected\n * @description\n * Returns true if all visible rows are selected.\n /\n isAllSelected = computed(() => {\n const data = this.internalData();\n const selected = this.selection();\n if (data.length === 0 \|\| selected.length === 0) return false;\n\n // We strictly use full objects for selection now.\n return data.every(row => selected.includes(row));\n });\n\n /\n @computed isPartiallySelected\n * @description\n * Returns true if some but not all rows are selected.\n /\n isPartiallySelected = computed(() => {\n const data = this.internalData();\n const selected = this.selection();\n if (data.length === 0 \|\| selected.length === 0) return false;\n\n const allSelected = this.isAllSelected();\n return !allSelected && selected.length > 0;\n });\n\n constructor() {\n /\n @effect data → initialData sync\n * @description\n * Whenever the data input changes, update initialData.\n /\n effect(() => {\n this.initialData.set([...this.data()]);\n });\n\n /\n @effect filters/data → internalData sync\n * @description\n * Re-apply all filters whenever the initial data or the column filters change.\n * Also applies sorting if there is an active sort.\n /\n effect(() => {\n const filtered = this.getFilteredData();\n const field = this.sortField();\n const order = this.sortOrder();\n\n if (field && order && filtered.length > 0) {\n const event: SortEvent = {\n data: filtered,\n field,\n order,\n };\n this.sortTableData(event);\n }\n this.internalData.set(filtered);\n });\n\n /\n @effect sortField/sortOrder → table sort sync\n * @description\n * Listen to external changes to the sortField and sortOrder models, and trigger PrimeNG Table's sort/reset.\n /\n effect(() => {\n const field = this.sortField();\n const order = this.sortOrder();\n const table = this.tableRef();\n if (!table) return;\n\n // Only apply sorting if it is different from the table's current internal state\n if (table.sortField !== field \|\| table.sortOrder !== order) {\n if (field && order) {\n table.sort({ field, order });\n } else if (!field && !order && (table.sortField \|\| table.sortOrder)) {\n table.reset();\n }\n }\n });\n }\n\n /\n @method toggleAll\n * @description\n * Toggles selection of all visible rows using full objects.\n * @param checked {unknown}\n /\n toggleAll(checked: unknown) {\n if (checked) {\n this.selection.set([...this.internalData()]);\n } else {\n this.selection.set([]);\n }\n }\n\n /\n @method updateSelection\n * @description\n * Updates row selection state from checkbox interaction.\n * @param value {any[]}\n /\n updateSelection(value: T[]) {\n this.selection.set([...value]);\n }\n\n private readonly actionGroupCache = new Map<\n unknown,\n Map<unknown, TkAction[]>\n >();\n\n getActionGroup(\n actions: NonNullable<TableColumn<T>['actionGroup']>,\n row: T\n ): TkAction[] {\n if (!actions) return [];\n if (!this.actionGroupCache.has(actions)) {\n this.actionGroupCache.set(actions, new Map());\n }\n const rowCache = this.actionGroupCache.get(actions)!;\n if (!rowCache.has(row)) {\n rowCache.set(\n row,\n actions.map(a => ({\n icon: a.icon,\n label: a.label,\n action: () => a.action(row),\n disabled: typeof a.disabled === 'function' ? a.disabled(row) : (a.disabled ?? false),\n }))\n );\n }\n return rowCache.get(row)!;\n }\n\n customSort(event: SortEvent) {\n const extField = this.sortField();\n const extOrder = this.sortOrder();\n\n // If this is triggered by the external model updates, apply it directly without cycling\n if (event.field === extField && event.order === extOrder) {\n if (extOrder === 1) {\n this.isSorted.set(true);\n this.sortTableData(event);\n } else if (extOrder === -1) {\n this.isSorted.set(false);\n this.sortTableData(event);\n } else {\n this.isSorted.set(null);\n this.internalData.set(this.getFilteredData());\n }\n return;\n }\n\n // Otherwise, it is a user click: run the cycling logic\n if (this.isSorted() === null \|\| this.isSorted() === undefined) {\n this.isSorted.set(true);\n this.sortField.set(event.field ?? null);\n this.sortOrder.set(1);\n this.sortTableData(event);\n } else if (this.isSorted()) {\n this.isSorted.set(false);\n this.sortField.set(event.field ?? null);\n this.sortOrder.set(-1);\n this.sortTableData(event);\n } else {\n this.isSorted.set(null);\n this.sortField.set(null);\n this.sortOrder.set(null);\n this.internalData.set(this.getFilteredData());\n this.tableRef()?.reset();\n }\n }\n\n sortTableData(event: SortEvent) {\n if (!event.data \|\| !event.field) return;\n\n event.data.sort((data1, data2) => {\n const value1 = data1[event.field!];\n const value2 = data2[event.field!];\n let result = null;\n if (value1 == null && value2 != null) result = -1;\n else if (value1 != null && value2 == null) result = 1;\n else if (value1 == null && value2 == null) result = 0;\n else if (typeof value1 === 'string' && typeof value2 === 'string')\n result = value1.localeCompare(value2);\n else if (value1 < value2) {\n result = -1;\n } else if (value1 > value2) {\n result = 1;\n } else {\n result = 0;\n }\n\n return (event.order ?? 1) result;\n });\n }\n\n // ─── Filter Methods ───────────────────────────────────────────────────────────\n\n /*\n @method toggleFilterOverlay\n * @description\n * Opens or closes the filter overlay for a given column.\n * Captures the trigger button position to render the overlay in fixed position.\n /\n toggleFilterOverlay(field: string, event: MouseEvent): void {\n event.stopPropagation();\n if (this.activeFilterColumn() === field) {\n this.activeFilterColumn.set(null);\n } else {\n const trigger = event.currentTarget as HTMLElement;\n const rect = trigger.getBoundingClientRect();\n this.filterOverlayPosition.set({\n top: rect.bottom + 4,\n left: rect.left,\n });\n this.activeFilterColumn.set(field);\n }\n }\n\n /\n @method closeFilterOverlay\n * @description\n * Closes the filter overlay.\n /\n closeFilterOverlay(): void {\n this.activeFilterColumn.set(null);\n }\n\n /\n @method getUniqueColumnValues\n * @description\n * Returns the unique values for a given column, considering active filters\n * on other columns. This ensures the list only shows values that exist\n * in the currently filtered dataset.\n /\n getUniqueColumnValues(field: string): string[] {\n const filters = this.columnFilters();\n let data = [...this.initialData()];\n\n // Apply all filters EXCEPT the one for the current field\n for (const filterField of Object.keys(filters)) {\n if (filterField === field) continue;\n const selectedValue = filters[filterField];\n if (selectedValue == null) continue;\n\n data = data.filter(row => {\n const cellValue = (row as Record<string, unknown>)[filterField];\n return (\n cellValue != null && this.cellToString(cellValue) === selectedValue\n );\n });\n }\n\n const values = data\n .map(row => (row as Record<string, unknown>)[field])\n .filter(\n (v): v is string \| number \| boolean =>\n v != null && typeof v !== 'object'\n )\n .map(String);\n\n return [...new Set(values)].sort((a, b) => a.localeCompare(b));\n }\n\n /\n @method selectFilterValue\n * @description\n * Selects a value from the filter list and applies the filter.\n /\n selectFilterValue(field: string, value: string): void {\n const filters = { ...this.columnFilters() };\n filters[field] = value;\n this.columnFilters.set(filters);\n this.applyAllFilters();\n this.activeFilterColumn.set(null);\n }\n\n /\n @method clearFilter\n * @description\n * Clears the filter for a specific column and re-applies remaining filters.\n /\n clearFilter(field: string): void {\n const filters = { ...this.columnFilters() };\n delete filters[field];\n this.columnFilters.set(filters);\n this.applyAllFilters();\n this.activeFilterColumn.set(null);\n }\n\n /\n @method isColumnFiltered\n * @description\n * Returns whether a column currently has an active filter.\n /\n isColumnFiltered(field: string): boolean {\n return this.columnFilters()[field] != null;\n }\n\n /\n @method getActiveFilterValue\n * @description\n * Returns the currently selected filter value for a column, or null.\n /\n getActiveFilterValue(field: string): string \| null {\n return this.columnFilters()[field] ?? null;\n }\n\n /\n @method applyAllFilters\n * @description\n * Applies all active column filters to the initial data set.\n /\n private applyAllFilters(): void {\n this.internalData.set(this.getFilteredData());\n }\n\n /\n @method getFilteredData\n * @description\n * Returns the initial data filtered by all active column filters.\n * Used by both applyAllFilters and customSort (reset) to ensure\n * sorting never discards active filters.\n /\n private getFilteredData(): T[] {\n const filters = this.columnFilters();\n let filtered = [...this.initialData()];\n\n for (const field of Object.keys(filters)) {\n const selectedValue = filters[field];\n if (selectedValue == null) continue;\n\n filtered = filtered.filter(row => {\n const cellValue = (row as Record<string, unknown>)[field];\n return (\n cellValue != null && this.cellToString(cellValue) === selectedValue\n );\n });\n }\n\n return filtered;\n }\n\n /\n @method cellToString\n * @description\n * Safely converts a cell value to its string representation.\n * Handles primitives directly and avoids [object Object] for complex types.\n /\n private cellToString(value: unknown): string {\n if (typeof value === 'string') return value;\n if (typeof value === 'number' \|\| typeof value === 'boolean')\n return `${value}`;\n return JSON.stringify(value);\n }\n\n /\n @method handleImageClick\n * @description\n * Handles click events on image-type cells.\n * Stops row selection propagation and invokes the column's imageAction callback when defined.\n * No-op when imageAction is not set, preserving default row-click behavior.\n * @param event {Event} - The native click event.\n * @param col {TableColumn<T>} - The column definition that may carry an imageAction.\n * @param row {T} - The data row associated with the clicked image.\n /\n handleImageClick(event: Event, col: TableColumn<T>, row: T): void {\n if (col.imageAction) {\n event.stopPropagation();\n col.imageAction(row);\n }\n }\n\n /\n @method onImageError\n * @description\n * Handles image load errors by replacing the broken src with a fallback URL.\n * Called from the template's (error) binding on image-type columns.\n * @param event {Event} - The native error event from the <img> element.\n * @param fallback {string \| undefined} - Optional URL to use as replacement src.\n /\n onImageError(event: Event, fallback?: string): void {\n if (fallback) {\n (event.target as HTMLImageElement).src = fallback;\n }\n }\n}\n","<p-table #tableRef [selection]=\"selection()\" (selectionChange)=\"updateSelection($any($event))\"\n [selectionMode]=\"selectionMode()\" [dataKey]=\"dataKey()\" [value]=\"internalData()\" [customSort]=\"true\"\n (sortFunction)=\"customSort($event)\" [tableStyle]=\"{ 'min-width': '60rem' }\" responsiveLayout=\"scroll\">\n <!-- HEADER -->\n <ng-template pTemplate=\"header\">\n <tr>\n @for (col of columns(); track col.header) {\n <th [id]=\"col.field\" [style.width]=\"col.width\"\n [pSortableColumn]=\"col.sortable ? col.field : undefined\"\n [class.tk-table__header--active]=\"activeFilterColumn() === col.field \|\| isColumnFiltered(col.field!)\">\n <div class=\"tk-table__header-content\">\n @if (col.type === 'selection' && selectionMode() === 'multiple') {\n <div class=\"tk-table__actions hide-validation-messages\">\n <tk-checkbox [binary]=\"true\" [model]=\"isAllSelected()\" [indeterminate]=\"isPartiallySelected()\"\n (click)=\"$event.stopPropagation()\" (keypress)=\"$event.stopPropagation()\"\n (modelChange)=\"toggleAll($event)\"></tk-checkbox>\n </div>\n } @else if (col.type !== 'selection') {\n <span class=\"tk-table__header-label\">{{ col.header }}</span>\n @if (col.sortable) {\n <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n }\n @if (col.filterable && col.field) {\n <button\n class=\"tk-table__filter-trigger\"\n [class.tk-table__filter-trigger--active]=\"isColumnFiltered(col.field)\"\n (click)=\"toggleFilterOverlay(col.field, $event)\"\n type=\"button\"\n [attr.aria-label]=\"'Filter ' + col.header\">\n <tk-icon icon=\"filter\" size=\"sm\"></tk-icon>\n </button>\n }\n }\n </div>\n </th>\n }\n </tr>\n </ng-template>\n\n <!-- BODY -->\n <ng-template pTemplate=\"body\" let-row>\n <tr [pSelectableRow]=\"row\">\n @for (col of columns(); track col.header) {\n <!-- SELECTION -->\n @if (col.type === 'selection') {\n <td>\n @if (selectionMode() === 'multiple') {\n <tk-checkbox [model]=\"selection()\" [value]=\"row\" (click)=\"$event.stopPropagation()\"\n (keypress)=\"$event.stopPropagation()\" (modelChange)=\"updateSelection($any($event))\"></tk-checkbox>\n }\n </td>\n }\n\n <!-- CHECKBOX (Boolean field) -->\n @if (col.type === 'checkbox') {\n <td>\n <tk-checkbox [binary]=\"true\" [(model)]=\"row[col.field!]\" (click)=\"$event.stopPropagation()\"\n (keypress)=\"$event.stopPropagation()\"></tk-checkbox>\n </td>\n }\n\n <!-- TEXT (default) -->\n @if (!col.type \|\| col.type === 'text') {\n <td>{{ row[col.field!] }}</td>\n }\n\n <!-- TAG -->\n @if (col.type === 'tag') {\n <td>\n <tk-tag [value]=\"row[col.field!]\" [severity]=\"col.tagSeverity!(row)\" />\n </td>\n }\n\n <!-- ACTIONS -->\n @if (col.type === 'actions') {\n <td>\n <div class=\"tk-table__actions\">\n @for (action of col.actions!; track action.icon) {\n <tk-button [icon]=\"action.icon\" severity=\"secondary\" (click)=\"$event.stopPropagation()\"\n (keypress)=\"$event.stopPropagation()\" (clicked)=\"action?.action(row)\"></tk-button>\n }\n </div>\n </td>\n }\n\n <!-- ACTION GROUP -->\n @if (col.type === 'action-group') {\n <td>\n <div class=\"tk-table__actions\">\n <tk-action-group\n [actions]=\"getActionGroup(col.actionGroup!, row)\"\n [maxVisible]=\"col.actionGroupMaxVisible ?? 2\"\n [disabled]=\"col.actionGroupDisabled ?? false\"\n (click)=\"$event.stopPropagation()\"\n (keypress)=\"$event.stopPropagation()\"\n ></tk-action-group>\n </div>\n </td>\n }\n\n <!-- CONNECTION STATUS -->\n @if (col.type === 'connection-status') {\n <td>\n <tk-time-ago\n [dateTime]=\"row[col.field!]\"\n [severity]=\"col.connectionStatusSeverity ? col.connectionStatusSeverity(row) : 'success'\"\n [tooltipText]=\"col.connectionStatusTooltipText ? col.connectionStatusTooltipText(row) : undefined\" />\n </td>\n }\n\n <!-- IMAGE -->\n @if (col.type === 'image') {\n <td>\n <img\n class=\"tk-table__cell-img\"\n [class.tk-table__cell-img--clickable]=\"!!col.imageAction\"\n [src]=\"row[col.field!]\"\n [alt]=\"col.imageAlt ? col.imageAlt(row) : ''\"\n [style.width]=\"col.imageWidth ?? '40px'\"\n [style.height]=\"col.imageHeight ?? '40px'\"\n [attr.tabindex]=\"col.imageAction ? 0 : null\"\n [attr.role]=\"col.imageAction ? 'button' : null\"\n (click)=\"handleImageClick($event, col, row)\"\n (keydown.enter)=\"col.imageAction && col.imageAction(row)\"\n (error)=\"onImageError($event, col.imageFallback)\"\n />\n </td>\n }\n }\n </tr>\n </ng-template>\n</p-table>\n\n<!-- Filter Overlay rendered outside the table to avoid overflow clipping -->\n@if (activeFilterColumn()) {\n<div class=\"tk-table__filter-backdrop\"\n tabindex=\"-1\"\n (click)=\"closeFilterOverlay()\"\n (keydown.escape)=\"closeFilterOverlay()\"></div>\n<div\n class=\"tk-table__filter-overlay\"\n tabindex=\"-1\"\n [style.top.px]=\"filterOverlayPosition().top\"\n [style.left.px]=\"filterOverlayPosition().left\"\n (click)=\"$event.stopPropagation()\"\n (keydown.escape)=\"closeFilterOverlay()\">\n <div class=\"tk-table__filter-list\">\n @for (option of getUniqueColumnValues(activeFilterColumn()!); track option) {\n <button\n class=\"tk-table__filter-option\"\n [class.tk-table__filter-option--selected]=\"getActiveFilterValue(activeFilterColumn()!) === option\"\n type=\"button\"\n [attr.aria-pressed]=\"getActiveFilterValue(activeFilterColumn()!) === option\"\n (click)=\"selectFilterValue(activeFilterColumn()!, option)\">\n {{ option }}\n </button>\n }\n </div>\n @if (isColumnFiltered(activeFilterColumn()!)) {\n <div class=\"tk-table__filter-clear\">\n <button\n class=\"tk-table__filter-clear-btn\"\n type=\"button\"\n (click)=\"clearFilter(activeFilterColumn()!)\">\n Clear filter\n </button>\n </div>\n }\n</div>\n}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/tekus-design-system-components-tabs.mjs CHANGED Viewed

@@ -59,11 +59,11 @@ class TabsComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TabsComponent, isStandalone: true, selector: "tk-tabs", inputs: { tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null }, activeIndex: { classPropertyName: "activeIndex", publicName: "activeIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeIndex: "activeIndexChange", tabChange: "tabChange" }, ngImport: i0, template: "<p-tabs [value]=\"activeIndex()\" (valueChange)=\"onTabChange($event !== undefined ? +$event : activeIndex())\"\n  class=\"tk-tabs\">\n  <p-tablist>\n    @for (tab of visibleTabs; track $index) {\n    <p-tab [value]=\"$index\" [disabled]=\"tab.disabled\">\n      <tk-tooltip [content]=\"tab.tooltip ?? ''\" position=\"top\">\n        <span class=\"tk-tab-label\" [style.max-width]=\"tab.badge ? '6rem' : '9rem'\">\n          {{ tab.label }}\n        </span>\n      </tk-tooltip>\n      @if(tab.badge){\n      <tk-badge [value]=\"tab.badge\"></tk-badge>\n      }\n    </p-tab>\n    }\n  </p-tablist>\n\n  <p-tabpanels>\n    @for (tab of visibleTabs; track $index) {\n    <p-tabpanel [value]=\"$index\">\n      @if (!tab.lazy || activeIndex() === $index) {\n      <ng-container *ngTemplateOutlet=\"tab.content || null\"></ng-container>\n      }\n    </p-tabpanel>\n    }\n  </p-tabpanels>\n</p-tabs>", styles: [".tk-tabs{width:100%}.tk-tabs .p-tablist{display:flex;width:100%}.tk-tabs .tk-tab-label{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--tk-surface-950, #191a1b);font-size:var(--tk-font-size-sm, .875rem);font-weight:var(--tk-font-weight-regular, 400)}:host ::ng-deep .p-tab{display:flex;align-items:center;gap:.5rem;padding:var(--tk-spacing-base-50, .5rem) var(--tk-spacing-base-100, 1rem);max-width:var(--tk-size-base-1000, 10rem)}:host ::ng-deep .p-tab-active{background-color:var(--tk-primary-100, #b7b0d2);color:var(--tk-primary-700, #10004f)}:host ::ng-deep .tk-tooltip-wrapper{display:flex!important}\n"], dependencies: [{ kind: "ngmodule", type: TabsModule }, { kind: "component", type: i1.Tabs, selector: "p-tabs", inputs: ["value", "scrollable", "lazy", "selectOnFocus", "showNavigators", "tabindex"], outputs: ["valueChange"] }, { kind: "component", type: i1.TabPanels, selector: "p-tabpanels" }, { kind: "component", type: i1.TabPanel, selector: "p-tabpanel", inputs: ["lazy", "value"], outputs: ["valueChange"] }, { kind: "component", type: i1.TabList, selector: "p-tablist" }, { kind: "component", type: i1.Tab, selector: "p-tab", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: TooltipComponent, selector: "tk-tooltip", inputs: ["content", "position"] }, { kind: "component", type: BadgeComponent, selector: "tk-badge", inputs: ["value", "severity"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TabsComponent, isStandalone: true, selector: "tk-tabs", inputs: { tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null }, activeIndex: { classPropertyName: "activeIndex", publicName: "activeIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeIndex: "activeIndexChange", tabChange: "tabChange" }, ngImport: i0, template: "<p-tabs [value]=\"activeIndex()\" (valueChange)=\"onTabChange($event !== undefined ? +$event : activeIndex())\"\n  class=\"tk-tabs\">\n  <p-tablist>\n    @for (tab of visibleTabs; track $index) {\n    <p-tab [value]=\"$index\" [disabled]=\"tab.disabled\">\n      <tk-tooltip [content]=\"tab.tooltip ?? ''\" position=\"top\">\n        <span class=\"tk-tab-label\" [style.max-width]=\"tab.badge ? '6rem' : '9rem'\">\n          {{ tab.label }}\n        </span>\n      </tk-tooltip>\n      @if(tab.badge){\n      <tk-badge [value]=\"tab.badge\"></tk-badge>\n      }\n    </p-tab>\n    }\n  </p-tablist>\n\n  <p-tabpanels>\n    @for (tab of visibleTabs; track $index) {\n    <p-tabpanel [value]=\"$index\">\n      @if (!tab.lazy || activeIndex() === $index) {\n      <ng-container *ngTemplateOutlet=\"tab.content || null\"></ng-container>\n      }\n    </p-tabpanel>\n    }\n  </p-tabpanels>\n</p-tabs>", styles: [".tk-tabs{width:100%}.tk-tabs .p-tablist{display:flex;width:100%}.tk-tabs .tk-tab-label{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--tk-surface-950, #191a1b);font-size:var(--tk-font-size-sm, .875rem);font-weight:var(--tk-font-weight-regular, 400)}:host ::ng-deep .p-tab{display:flex;align-items:center;gap:var(--tk-spacing-base-50, .5rem);padding:var(--tk-spacing-base-50, .5rem) var(--tk-spacing-base-100, 1rem);max-width:var(--tk-size-base-1000, 10rem)}:host ::ng-deep .p-tab-active{background-color:var(--tk-primary-100, #b7b0d2);color:var(--tk-primary-700, #10004f)}:host ::ng-deep .tk-tooltip-wrapper{display:flex!important}\n"], dependencies: [{ kind: "ngmodule", type: TabsModule }, { kind: "component", type: i1.Tabs, selector: "p-tabs", inputs: ["value", "scrollable", "lazy", "selectOnFocus", "showNavigators", "tabindex"], outputs: ["valueChange"] }, { kind: "component", type: i1.TabPanels, selector: "p-tabpanels" }, { kind: "component", type: i1.TabPanel, selector: "p-tabpanel", inputs: ["lazy", "value"], outputs: ["valueChange"] }, { kind: "component", type: i1.TabList, selector: "p-tablist" }, { kind: "component", type: i1.Tab, selector: "p-tab", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: TooltipComponent, selector: "tk-tooltip", inputs: ["content", "position"] }, { kind: "component", type: BadgeComponent, selector: "tk-badge", inputs: ["value", "severity"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TabsComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'tk-tabs', imports: [TabsModule, TooltipComponent, BadgeComponent, NgTemplateOutlet], template: "<p-tabs [value]=\"activeIndex()\" (valueChange)=\"onTabChange($event !== undefined ? +$event : activeIndex())\"\n  class=\"tk-tabs\">\n  <p-tablist>\n    @for (tab of visibleTabs; track $index) {\n    <p-tab [value]=\"$index\" [disabled]=\"tab.disabled\">\n      <tk-tooltip [content]=\"tab.tooltip ?? ''\" position=\"top\">\n        <span class=\"tk-tab-label\" [style.max-width]=\"tab.badge ? '6rem' : '9rem'\">\n          {{ tab.label }}\n        </span>\n      </tk-tooltip>\n      @if(tab.badge){\n      <tk-badge [value]=\"tab.badge\"></tk-badge>\n      }\n    </p-tab>\n    }\n  </p-tablist>\n\n  <p-tabpanels>\n    @for (tab of visibleTabs; track $index) {\n    <p-tabpanel [value]=\"$index\">\n      @if (!tab.lazy || activeIndex() === $index) {\n      <ng-container *ngTemplateOutlet=\"tab.content || null\"></ng-container>\n      }\n    </p-tabpanel>\n    }\n  </p-tabpanels>\n</p-tabs>", styles: [".tk-tabs{width:100%}.tk-tabs .p-tablist{display:flex;width:100%}.tk-tabs .tk-tab-label{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--tk-surface-950, #191a1b);font-size:var(--tk-font-size-sm, .875rem);font-weight:var(--tk-font-weight-regular, 400)}:host ::ng-deep .p-tab{display:flex;align-items:center;gap:.5rem;padding:var(--tk-spacing-base-50, .5rem) var(--tk-spacing-base-100, 1rem);max-width:var(--tk-size-base-1000, 10rem)}:host ::ng-deep .p-tab-active{background-color:var(--tk-primary-100, #b7b0d2);color:var(--tk-primary-700, #10004f)}:host ::ng-deep .tk-tooltip-wrapper{display:flex!important}\n"] }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'tk-tabs', imports: [TabsModule, TooltipComponent, BadgeComponent, NgTemplateOutlet], template: "<p-tabs [value]=\"activeIndex()\" (valueChange)=\"onTabChange($event !== undefined ? +$event : activeIndex())\"\n  class=\"tk-tabs\">\n  <p-tablist>\n    @for (tab of visibleTabs; track $index) {\n    <p-tab [value]=\"$index\" [disabled]=\"tab.disabled\">\n      <tk-tooltip [content]=\"tab.tooltip ?? ''\" position=\"top\">\n        <span class=\"tk-tab-label\" [style.max-width]=\"tab.badge ? '6rem' : '9rem'\">\n          {{ tab.label }}\n        </span>\n      </tk-tooltip>\n      @if(tab.badge){\n      <tk-badge [value]=\"tab.badge\"></tk-badge>\n      }\n    </p-tab>\n    }\n  </p-tablist>\n\n  <p-tabpanels>\n    @for (tab of visibleTabs; track $index) {\n    <p-tabpanel [value]=\"$index\">\n      @if (!tab.lazy || activeIndex() === $index) {\n      <ng-container *ngTemplateOutlet=\"tab.content || null\"></ng-container>\n      }\n    </p-tabpanel>\n    }\n  </p-tabpanels>\n</p-tabs>", styles: [".tk-tabs{width:100%}.tk-tabs .p-tablist{display:flex;width:100%}.tk-tabs .tk-tab-label{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--tk-surface-950, #191a1b);font-size:var(--tk-font-size-sm, .875rem);font-weight:var(--tk-font-weight-regular, 400)}:host ::ng-deep .p-tab{display:flex;align-items:center;gap:var(--tk-spacing-base-50, .5rem);padding:var(--tk-spacing-base-50, .5rem) var(--tk-spacing-base-100, 1rem);max-width:var(--tk-size-base-1000, 10rem)}:host ::ng-deep .p-tab-active{background-color:var(--tk-primary-100, #b7b0d2);color:var(--tk-primary-700, #10004f)}:host ::ng-deep .tk-tooltip-wrapper{display:flex!important}\n"] }]
         }], propDecorators: { tabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabs", required: false }] }], activeIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeIndex", required: false }] }, { type: i0.Output, args: ["activeIndexChange"] }], tabChange: [{ type: i0.Output, args: ["tabChange"] }] } });
 /**

package/fesm2022/tekus-design-system-components-tabs.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tekus-design-system-components-tabs.mjs","sources":["../../../projects/design-system/components/tabs/src/tabs.component.ts","../../../projects/design-system/components/tabs/src/tabs.component.html","../../../projects/design-system/components/tabs/tekus-design-system-components-tabs.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input, output, model } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { TabsModule } from 'primeng/tabs';\nimport { TabData } from './tabs.interface';\nimport { TooltipComponent } from '@tekus/design-system/components/tooltip';\nimport { BadgeComponent } from '@tekus/design-system/components/badge';\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'tk-tabs',\n imports: [TabsModule, TooltipComponent, BadgeComponent, NgTemplateOutlet],\n templateUrl: './tabs.component.html',\n styleUrl: './tabs.component.scss',\n})\nexport class TabsComponent {\n /*\n @property {InputSignal<TabData[]>} tabs\n * @description\n * Array of tab configurations to display.\n /\n tabs = input<TabData[]>([]);\n\n /\n @property {ModelSignal<number>} activeIndex\n * @description\n * The index of the currently active tab. Supports two-way binding via signals.\n * @default 0\n /\n activeIndex = model<number>(0);\n\n /\n @event tabChange\n * @description\n * Emitted when the active tab changes.\n * Payload: object containing the tab index and tab data.\n \n @example\n * <tk-tabs (tabChange)=\"onTabChange($event)\"></tk-tabs>\n /\n tabChange = output<{\n index: number;\n tab: TabData;\n }>();\n\n /\n @method visibleTabs\n * @description\n * Returns only the tabs that are marked as visible.\n * @returns {TabData[]} Array of visible tabs.\n /\n get visibleTabs(): TabData[] {\n return this.tabs().filter(t => t.visible !== false);\n }\n\n /\n @method onTabChange\n * @description\n * Handles tab change events and emits the tabChange output.\n * @param {number} index - The index of the newly selected tab.\n /\n onTabChange(index: number) {\n if (this.activeIndex() === index) return;\n\n this.activeIndex.set(index);\n\n if (this.visibleTabs[index]) {\n this.tabChange.emit({\n index,\n tab: this.visibleTabs[index],\n });\n }\n }\n}\n","<p-tabs [value]=\"activeIndex()\" (valueChange)=\"onTabChange($event !== undefined ? +$event : activeIndex())\"\n class=\"tk-tabs\">\n <p-tablist>\n @for (tab of visibleTabs; track $index) {\n <p-tab [value]=\"$index\" [disabled]=\"tab.disabled\">\n <tk-tooltip [content]=\"tab.tooltip ?? ''\" position=\"top\">\n <span class=\"tk-tab-label\" [style.max-width]=\"tab.badge ? '6rem' : '9rem'\">\n {{ tab.label }}\n </span>\n </tk-tooltip>\n @if(tab.badge){\n <tk-badge [value]=\"tab.badge\"></tk-badge>\n }\n </p-tab>\n }\n </p-tablist>\n\n <p-tabpanels>\n @for (tab of visibleTabs; track $index) {\n <p-tabpanel [value]=\"$index\">\n @if (!tab.lazy \|\| activeIndex() === $index) {\n <ng-container ngTemplateOutlet=\"tab.content \|\| null\"></ng-container>\n }\n </p-tabpanel>\n }\n </p-tabpanels>\n</p-tabs>","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;MAca,aAAa,CAAA;AAP1B,IAAA,WAAA,GAAA;AAQE;;;;AAIG;AACH,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAY,EAAE,2EAAC;AAE3B;;;;;AAKG;AACH,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK,CAAS,CAAC,kFAAC;AAE9B;;;;;;;;AAQG;QACH,IAAA,CAAA,SAAS,GAAG,MAAM,EAGd;AA8BL,IAAA;AA5BC;;;;;AAKG;AACH,IAAA,IAAI,WAAW,GAAA;AACb,QAAA,OAAO,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,OAAO,KAAK,KAAK,CAAC;IACrD;AAEA;;;;;AAKG;AACH,IAAA,WAAW,CAAC,KAAa,EAAA;AACvB,QAAA,IAAI,IAAI,CAAC,WAAW,EAAE,KAAK,KAAK;YAAE;AAElC,QAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC;AAE3B,QAAA,IAAI,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE;AAC3B,YAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;gBAClB,KAAK;AACL,gBAAA,GAAG,EAAE,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAC7B,aAAA,CAAC;QACJ;IACF;+GAzDW,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAb,aAAa,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,WAAA,EAAA,mBAAA,EAAA,SAAA,EAAA,WAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECd1B,m4BA0BS,EAAA,MAAA,EAAA,CAAA,~~ooBAAA,~~CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDhBG,UAAU,ujBAAE,gBAAgB,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,cAAc,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAI7D,aAAa,EAAA,UAAA,EAAA,CAAA;kBAPzB,SAAS;AACS,YAAA,IAAA,EAAA,CAAA,EAAA,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,SAAS,EAAA,OAAA,EACV,CAAC,UAAU,EAAE,gBAAgB,EAAE,cAAc,EAAE,gBAAgB,CAAC,EAAA,QAAA,EAAA,m4BAAA,EAAA,MAAA,EAAA,CAAA,~~ooBAAA,~~CAAA,EAAA;;;AEV3E;;AAEG;;;;"}
1	+ {"version":3,"file":"tekus-design-system-components-tabs.mjs","sources":["../../../projects/design-system/components/tabs/src/tabs.component.ts","../../../projects/design-system/components/tabs/src/tabs.component.html","../../../projects/design-system/components/tabs/tekus-design-system-components-tabs.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input, output, model } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { TabsModule } from 'primeng/tabs';\nimport { TabData } from './tabs.interface';\nimport { TooltipComponent } from '@tekus/design-system/components/tooltip';\nimport { BadgeComponent } from '@tekus/design-system/components/badge';\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'tk-tabs',\n imports: [TabsModule, TooltipComponent, BadgeComponent, NgTemplateOutlet],\n templateUrl: './tabs.component.html',\n styleUrl: './tabs.component.scss',\n})\nexport class TabsComponent {\n /*\n @property {InputSignal<TabData[]>} tabs\n * @description\n * Array of tab configurations to display.\n /\n tabs = input<TabData[]>([]);\n\n /\n @property {ModelSignal<number>} activeIndex\n * @description\n * The index of the currently active tab. Supports two-way binding via signals.\n * @default 0\n /\n activeIndex = model<number>(0);\n\n /\n @event tabChange\n * @description\n * Emitted when the active tab changes.\n * Payload: object containing the tab index and tab data.\n \n @example\n * <tk-tabs (tabChange)=\"onTabChange($event)\"></tk-tabs>\n /\n tabChange = output<{\n index: number;\n tab: TabData;\n }>();\n\n /\n @method visibleTabs\n * @description\n * Returns only the tabs that are marked as visible.\n * @returns {TabData[]} Array of visible tabs.\n /\n get visibleTabs(): TabData[] {\n return this.tabs().filter(t => t.visible !== false);\n }\n\n /\n @method onTabChange\n * @description\n * Handles tab change events and emits the tabChange output.\n * @param {number} index - The index of the newly selected tab.\n /\n onTabChange(index: number) {\n if (this.activeIndex() === index) return;\n\n this.activeIndex.set(index);\n\n if (this.visibleTabs[index]) {\n this.tabChange.emit({\n index,\n tab: this.visibleTabs[index],\n });\n }\n }\n}\n","<p-tabs [value]=\"activeIndex()\" (valueChange)=\"onTabChange($event !== undefined ? +$event : activeIndex())\"\n class=\"tk-tabs\">\n <p-tablist>\n @for (tab of visibleTabs; track $index) {\n <p-tab [value]=\"$index\" [disabled]=\"tab.disabled\">\n <tk-tooltip [content]=\"tab.tooltip ?? ''\" position=\"top\">\n <span class=\"tk-tab-label\" [style.max-width]=\"tab.badge ? '6rem' : '9rem'\">\n {{ tab.label }}\n </span>\n </tk-tooltip>\n @if(tab.badge){\n <tk-badge [value]=\"tab.badge\"></tk-badge>\n }\n </p-tab>\n }\n </p-tablist>\n\n <p-tabpanels>\n @for (tab of visibleTabs; track $index) {\n <p-tabpanel [value]=\"$index\">\n @if (!tab.lazy \|\| activeIndex() === $index) {\n <ng-container ngTemplateOutlet=\"tab.content \|\| null\"></ng-container>\n }\n </p-tabpanel>\n }\n </p-tabpanels>\n</p-tabs>","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;MAca,aAAa,CAAA;AAP1B,IAAA,WAAA,GAAA;AAQE;;;;AAIG;AACH,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAY,EAAE,2EAAC;AAE3B;;;;;AAKG;AACH,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK,CAAS,CAAC,kFAAC;AAE9B;;;;;;;;AAQG;QACH,IAAA,CAAA,SAAS,GAAG,MAAM,EAGd;AA8BL,IAAA;AA5BC;;;;;AAKG;AACH,IAAA,IAAI,WAAW,GAAA;AACb,QAAA,OAAO,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,OAAO,KAAK,KAAK,CAAC;IACrD;AAEA;;;;;AAKG;AACH,IAAA,WAAW,CAAC,KAAa,EAAA;AACvB,QAAA,IAAI,IAAI,CAAC,WAAW,EAAE,KAAK,KAAK;YAAE;AAElC,QAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC;AAE3B,QAAA,IAAI,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE;AAC3B,YAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;gBAClB,KAAK;AACL,gBAAA,GAAG,EAAE,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAC7B,aAAA,CAAC;QACJ;IACF;+GAzDW,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAb,aAAa,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,WAAA,EAAA,mBAAA,EAAA,SAAA,EAAA,WAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECd1B,m4BA0BS,EAAA,MAAA,EAAA,CAAA,+pBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDhBG,UAAU,ujBAAE,gBAAgB,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,cAAc,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAI7D,aAAa,EAAA,UAAA,EAAA,CAAA;kBAPzB,SAAS;AACS,YAAA,IAAA,EAAA,CAAA,EAAA,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,SAAS,EAAA,OAAA,EACV,CAAC,UAAU,EAAE,gBAAgB,EAAE,cAAc,EAAE,gBAAgB,CAAC,EAAA,QAAA,EAAA,m4BAAA,EAAA,MAAA,EAAA,CAAA,+pBAAA,CAAA,EAAA;;;AEV3E;;AAEG;;;;"}

package/fesm2022/tekus-design-system-components-textarea.mjs CHANGED Viewed

@@ -214,7 +214,7 @@ class TextareaComponent {
         return this.getControl();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TextareaComponent, isStandalone: true, selector: "tk-textarea", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, cols: { classPropertyName: "cols", publicName: "cols", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, ngImport: i0, template: "<p-floatlabel>\n  <div class=\"tk-textarea-wrapper\">\n    <textarea\n      pTextarea\n      [autoResize]=\"true\"\n      [id]=\"id()\"\n      [rows]=\"rows()\"\n      [cols]=\"cols()\"\n      [value]=\"value()\"\n      (input)=\"onInput($event)\"\n      (blur)=\"onBlur()\"\n      [attr.maxlength]=\"maxLength()\"\n      [disabled]=\"disabled()\"\n      [class.p-filled]=\"!!value()\"\n      [class.ng-invalid]=\"effectiveControl.invalid\"\n      [class.ng-dirty]=\"effectiveControl.dirty\"\n      [class.ng-touched]=\"effectiveControl.touched\"></textarea>\n\n    <label [for]=\"id()\">{{ label() }}</label>\n  </div>\n</p-floatlabel>\n\n<div class=\"tk-input-bottom\">\n  <div class=\"tk-input-messages\">\n    @if ((effectiveControl.invalid && (effectiveControl.dirty ||\n    effectiveControl.touched)) && errorMessage()) {\n    <p-message severity=\"error\" size=\"small\" variant=\"simple\">\n      {{ errorMessage() }}\n    </p-message>\n    } @else if (hint()) {\n    <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">\n      {{ hint() }}\n    </p-message>\n    }\n  </div>\n\n  @if (maxLength()) {\n  <p-message\n    severity=\"secondary\"\n    size=\"small\"\n    variant=\"simple\"\n    class=\"tk-character-counter\">\n    {{ counterText() }}\n  </p-message>\n  }\n</div>\n", styles: [":host ::ng-deep .p-textarea{width:100%;flex:1;border:none;border-bottom:.0625rem solid var(--tk-color-base-surface-300, #d2d2d2);border-radius:var(--tk-borderRadius-null, 0);padding:var(--tk-spacing-base-75, .75rem);padding-left:var(--tk-spacing-padding-xs, .25rem);color:var(--tk-color-base-surface-950, #191a1b);background-color:transparent}:host ::ng-deep .p-textarea:focus{border-color:var(--tk-color-base-primary-600, #140065);box-shadow:none}:host ::ng-deep .p-textarea.ng-invalid.ng-dirty,:host ::ng-deep .p-textarea.ng-invalid.ng-touched{border-color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep .p-textarea.has-icon{padding-left:var(--tk-spacing-base-200, 2rem)}:host ::ng-deep .p-textarea:disabled{background-color:var(--tk-color-base-surface-200, #e4e4e4);color:var(--tk-color-base-surface-500, #8a8a8b);opacity:1}:host ::ng-deep .p-floatlabel label{color:var(--tk-color-base-surface-500, #8a8a8b);font-weight:var(--tk-font-weight-400, 400);left:var(--tk-spacing-base-25, .25rem);transition-duration:.2s}:host ::ng-deep .p-floatlabel:has(.p-textarea) label{top:var(--tk-spacing-base-125, 1.25rem)}:host ::ng-deep .p-floatlabel:has(textarea:disabled) label{display:none}:host ::ng-deep .p-floatlabel:has(.p-inputwrapper-filled) label,:host ::ng-deep .p-floatlabel:has(textarea.p-filled) label{top:-.75rem;color:var(--tk-color-base-surface-950, #191a1b)}:host ::ng-deep .p-floatlabel:has(textarea:focus) label{top:-.75rem;color:var(--tk-color-base-primary-600, #140065)}:host ::ng-deep .p-floatlabel:has(.p-textarea.ng-invalid.ng-dirty) label,:host ::ng-deep .p-floatlabel:has(.p-textarea.ng-invalid.ng-touched) label{color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep p-message[severity=error] .p-inline-message-text,:host ::ng-deep p-message[severity=error] span{color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep p-message[severity=secondary] .p-inline-message-text,:host ::ng-deep p-message[severity=secondary] span{color:var(--tk-color-base-surface-600, #5d5d5e)}:host ::ng-deep .tk-input-messages{flex:1;margin-right:1rem}:host ::ng-deep .tk-character-counter{white-space:nowrap;display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: FloatLabelModule }, { kind: "component", type: i2.FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i3.Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant", "motionOptions"], outputs: ["onClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TextareaComponent, isStandalone: true, selector: "tk-textarea", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, cols: { classPropertyName: "cols", publicName: "cols", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, ngImport: i0, template: "<p-floatlabel>\n  <div class=\"tk-textarea-wrapper\">\n    <textarea\n      pTextarea\n      [autoResize]=\"true\"\n      [id]=\"id()\"\n      [rows]=\"rows()\"\n      [cols]=\"cols()\"\n      [value]=\"value()\"\n      (input)=\"onInput($event)\"\n      (blur)=\"onBlur()\"\n      [attr.maxlength]=\"maxLength()\"\n      [disabled]=\"disabled()\"\n      [class.p-filled]=\"!!value()\"\n      [class.ng-invalid]=\"effectiveControl.invalid\"\n      [class.ng-dirty]=\"effectiveControl.dirty\"\n      [class.ng-touched]=\"effectiveControl.touched\"></textarea>\n\n    <label [for]=\"id()\">{{ label() }}</label>\n  </div>\n</p-floatlabel>\n\n<div class=\"tk-input-bottom\">\n  <div class=\"tk-input-messages\">\n    @if ((effectiveControl.invalid && (effectiveControl.dirty ||\n    effectiveControl.touched)) && errorMessage()) {\n    <p-message severity=\"error\" size=\"small\" variant=\"simple\">\n      {{ errorMessage() }}\n    </p-message>\n    } @else if (hint()) {\n    <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">\n      {{ hint() }}\n    </p-message>\n    }\n  </div>\n\n  @if (maxLength()) {\n  <p-message\n    severity=\"secondary\"\n    size=\"small\"\n    variant=\"simple\"\n    class=\"tk-character-counter\">\n    {{ counterText() }}\n  </p-message>\n  }\n</div>\n", styles: [":host ::ng-deep .p-textarea{width:100%;flex:1;border:none;border-bottom:.0625rem solid var(--tk-color-base-surface-300, #d2d2d2);border-radius:var(--tk-borderRadius-null, 0);padding:var(--tk-spacing-base-75, .75rem);padding-left:var(--tk-spacing-padding-xs, .25rem);color:var(--tk-color-base-surface-950, #191a1b);background-color:transparent}:host ::ng-deep .p-textarea:focus{border-color:var(--tk-color-base-primary-600, #140065);box-shadow:none}:host ::ng-deep .p-textarea.ng-invalid.ng-dirty,:host ::ng-deep .p-textarea.ng-invalid.ng-touched{border-color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep .p-textarea.has-icon{padding-left:var(--tk-spacing-base-200, 2rem)}:host ::ng-deep .p-textarea:disabled{background-color:var(--tk-color-base-surface-200, #e4e4e4);color:var(--tk-color-base-surface-500, #8a8a8b);opacity:1}:host ::ng-deep .p-floatlabel label{color:var(--tk-color-base-surface-500, #8a8a8b);font-weight:var(--tk-font-weight-400, 400);left:var(--tk-spacing-base-25, .25rem);transition-duration:.2s}:host ::ng-deep .p-floatlabel:has(.p-textarea) label{top:var(--tk-spacing-base-125, 1.25rem)}:host ::ng-deep .p-floatlabel:has(textarea:disabled) label{display:none}:host ::ng-deep .p-floatlabel:has(.p-inputwrapper-filled) label,:host ::ng-deep .p-floatlabel:has(textarea.p-filled) label{top:-.75rem;color:var(--tk-color-base-surface-950, #191a1b)}:host ::ng-deep .p-floatlabel:has(textarea:focus) label{top:-.75rem;color:var(--tk-color-base-primary-600, #140065)}:host ::ng-deep .p-floatlabel:has(.p-textarea.ng-invalid.ng-dirty) label,:host ::ng-deep .p-floatlabel:has(.p-textarea.ng-invalid.ng-touched) label{color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep p-message[severity=error] .p-inline-message-text,:host ::ng-deep p-message[severity=error] span{color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep p-message[severity=secondary] .p-inline-message-text,:host ::ng-deep p-message[severity=secondary] span{color:var(--tk-color-base-surface-600, #5d5d5e)}:host ::ng-deep .tk-input-messages{flex:1;margin-right:var(--tk-spacing-base-100, 1rem)}:host ::ng-deep .tk-character-counter{white-space:nowrap;display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: FloatLabelModule }, { kind: "component", type: i2.FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i3.Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant", "motionOptions"], outputs: ["onClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TextareaComponent, decorators: [{
             type: Component,
@@ -223,7 +223,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
                         TextareaModule,
                         FloatLabelModule,
                         MessageModule,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-floatlabel>\n  <div class=\"tk-textarea-wrapper\">\n    <textarea\n      pTextarea\n      [autoResize]=\"true\"\n      [id]=\"id()\"\n      [rows]=\"rows()\"\n      [cols]=\"cols()\"\n      [value]=\"value()\"\n      (input)=\"onInput($event)\"\n      (blur)=\"onBlur()\"\n      [attr.maxlength]=\"maxLength()\"\n      [disabled]=\"disabled()\"\n      [class.p-filled]=\"!!value()\"\n      [class.ng-invalid]=\"effectiveControl.invalid\"\n      [class.ng-dirty]=\"effectiveControl.dirty\"\n      [class.ng-touched]=\"effectiveControl.touched\"></textarea>\n\n    <label [for]=\"id()\">{{ label() }}</label>\n  </div>\n</p-floatlabel>\n\n<div class=\"tk-input-bottom\">\n  <div class=\"tk-input-messages\">\n    @if ((effectiveControl.invalid && (effectiveControl.dirty ||\n    effectiveControl.touched)) && errorMessage()) {\n    <p-message severity=\"error\" size=\"small\" variant=\"simple\">\n      {{ errorMessage() }}\n    </p-message>\n    } @else if (hint()) {\n    <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">\n      {{ hint() }}\n    </p-message>\n    }\n  </div>\n\n  @if (maxLength()) {\n  <p-message\n    severity=\"secondary\"\n    size=\"small\"\n    variant=\"simple\"\n    class=\"tk-character-counter\">\n    {{ counterText() }}\n  </p-message>\n  }\n</div>\n", styles: [":host ::ng-deep .p-textarea{width:100%;flex:1;border:none;border-bottom:.0625rem solid var(--tk-color-base-surface-300, #d2d2d2);border-radius:var(--tk-borderRadius-null, 0);padding:var(--tk-spacing-base-75, .75rem);padding-left:var(--tk-spacing-padding-xs, .25rem);color:var(--tk-color-base-surface-950, #191a1b);background-color:transparent}:host ::ng-deep .p-textarea:focus{border-color:var(--tk-color-base-primary-600, #140065);box-shadow:none}:host ::ng-deep .p-textarea.ng-invalid.ng-dirty,:host ::ng-deep .p-textarea.ng-invalid.ng-touched{border-color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep .p-textarea.has-icon{padding-left:var(--tk-spacing-base-200, 2rem)}:host ::ng-deep .p-textarea:disabled{background-color:var(--tk-color-base-surface-200, #e4e4e4);color:var(--tk-color-base-surface-500, #8a8a8b);opacity:1}:host ::ng-deep .p-floatlabel label{color:var(--tk-color-base-surface-500, #8a8a8b);font-weight:var(--tk-font-weight-400, 400);left:var(--tk-spacing-base-25, .25rem);transition-duration:.2s}:host ::ng-deep .p-floatlabel:has(.p-textarea) label{top:var(--tk-spacing-base-125, 1.25rem)}:host ::ng-deep .p-floatlabel:has(textarea:disabled) label{display:none}:host ::ng-deep .p-floatlabel:has(.p-inputwrapper-filled) label,:host ::ng-deep .p-floatlabel:has(textarea.p-filled) label{top:-.75rem;color:var(--tk-color-base-surface-950, #191a1b)}:host ::ng-deep .p-floatlabel:has(textarea:focus) label{top:-.75rem;color:var(--tk-color-base-primary-600, #140065)}:host ::ng-deep .p-floatlabel:has(.p-textarea.ng-invalid.ng-dirty) label,:host ::ng-deep .p-floatlabel:has(.p-textarea.ng-invalid.ng-touched) label{color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep p-message[severity=error] .p-inline-message-text,:host ::ng-deep p-message[severity=error] span{color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep p-message[severity=secondary] .p-inline-message-text,:host ::ng-deep p-message[severity=secondary] span{color:var(--tk-color-base-surface-600, #5d5d5e)}:host ::ng-deep .tk-input-messages{flex:1;margin-right:1rem}:host ::ng-deep .tk-character-counter{white-space:nowrap;display:flex;justify-content:flex-end}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-floatlabel>\n  <div class=\"tk-textarea-wrapper\">\n    <textarea\n      pTextarea\n      [autoResize]=\"true\"\n      [id]=\"id()\"\n      [rows]=\"rows()\"\n      [cols]=\"cols()\"\n      [value]=\"value()\"\n      (input)=\"onInput($event)\"\n      (blur)=\"onBlur()\"\n      [attr.maxlength]=\"maxLength()\"\n      [disabled]=\"disabled()\"\n      [class.p-filled]=\"!!value()\"\n      [class.ng-invalid]=\"effectiveControl.invalid\"\n      [class.ng-dirty]=\"effectiveControl.dirty\"\n      [class.ng-touched]=\"effectiveControl.touched\"></textarea>\n\n    <label [for]=\"id()\">{{ label() }}</label>\n  </div>\n</p-floatlabel>\n\n<div class=\"tk-input-bottom\">\n  <div class=\"tk-input-messages\">\n    @if ((effectiveControl.invalid && (effectiveControl.dirty ||\n    effectiveControl.touched)) && errorMessage()) {\n    <p-message severity=\"error\" size=\"small\" variant=\"simple\">\n      {{ errorMessage() }}\n    </p-message>\n    } @else if (hint()) {\n    <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">\n      {{ hint() }}\n    </p-message>\n    }\n  </div>\n\n  @if (maxLength()) {\n  <p-message\n    severity=\"secondary\"\n    size=\"small\"\n    variant=\"simple\"\n    class=\"tk-character-counter\">\n    {{ counterText() }}\n  </p-message>\n  }\n</div>\n", styles: [":host ::ng-deep .p-textarea{width:100%;flex:1;border:none;border-bottom:.0625rem solid var(--tk-color-base-surface-300, #d2d2d2);border-radius:var(--tk-borderRadius-null, 0);padding:var(--tk-spacing-base-75, .75rem);padding-left:var(--tk-spacing-padding-xs, .25rem);color:var(--tk-color-base-surface-950, #191a1b);background-color:transparent}:host ::ng-deep .p-textarea:focus{border-color:var(--tk-color-base-primary-600, #140065);box-shadow:none}:host ::ng-deep .p-textarea.ng-invalid.ng-dirty,:host ::ng-deep .p-textarea.ng-invalid.ng-touched{border-color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep .p-textarea.has-icon{padding-left:var(--tk-spacing-base-200, 2rem)}:host ::ng-deep .p-textarea:disabled{background-color:var(--tk-color-base-surface-200, #e4e4e4);color:var(--tk-color-base-surface-500, #8a8a8b);opacity:1}:host ::ng-deep .p-floatlabel label{color:var(--tk-color-base-surface-500, #8a8a8b);font-weight:var(--tk-font-weight-400, 400);left:var(--tk-spacing-base-25, .25rem);transition-duration:.2s}:host ::ng-deep .p-floatlabel:has(.p-textarea) label{top:var(--tk-spacing-base-125, 1.25rem)}:host ::ng-deep .p-floatlabel:has(textarea:disabled) label{display:none}:host ::ng-deep .p-floatlabel:has(.p-inputwrapper-filled) label,:host ::ng-deep .p-floatlabel:has(textarea.p-filled) label{top:-.75rem;color:var(--tk-color-base-surface-950, #191a1b)}:host ::ng-deep .p-floatlabel:has(textarea:focus) label{top:-.75rem;color:var(--tk-color-base-primary-600, #140065)}:host ::ng-deep .p-floatlabel:has(.p-textarea.ng-invalid.ng-dirty) label,:host ::ng-deep .p-floatlabel:has(.p-textarea.ng-invalid.ng-touched) label{color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep p-message[severity=error] .p-inline-message-text,:host ::ng-deep p-message[severity=error] span{color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep p-message[severity=secondary] .p-inline-message-text,:host ::ng-deep p-message[severity=secondary] span{color:var(--tk-color-base-surface-600, #5d5d5e)}:host ::ng-deep .tk-input-messages{flex:1;margin-right:var(--tk-spacing-base-100, 1rem)}:host ::ng-deep .tk-character-counter{white-space:nowrap;display:flex;justify-content:flex-end}\n"] }]
         }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], control: [{ type: i0.Input, args: [{ isSignal: true, alias: "control", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], cols: [{ type: i0.Input, args: [{ isSignal: true, alias: "cols", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], errorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessage", required: false }] }], maxLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxLength", required: false }] }] } });
 /**

package/fesm2022/tekus-design-system-components-textarea.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tekus-design-system-components-textarea.mjs","sources":["../../../projects/design-system/components/textarea/src/textarea.component.ts","../../../projects/design-system/components/textarea/src/textarea.component.html","../../../projects/design-system/components/textarea/tekus-design-system-components-textarea.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n DestroyRef,\n input,\n model,\n signal,\n computed,\n inject,\n OnInit,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport {\n ControlValueAccessor,\n FormControl,\n ReactiveFormsModule,\n NgControl,\n} from '@angular/forms';\nimport { FloatLabelModule } from 'primeng/floatlabel';\nimport { TextareaModule } from 'primeng/textarea';\nimport { MessageModule } from 'primeng/message';\n\n@Component({\n selector: 'tk-textarea',\n imports: [\n ReactiveFormsModule,\n TextareaModule,\n FloatLabelModule,\n MessageModule,\n ],\n templateUrl: './textarea.component.html',\n styleUrl: './textarea.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TextareaComponent\n implements ControlValueAccessor, OnInit\n{\n /* ───────────── Dependency injection ───────────── /\n private readonly ngControl = inject(NgControl, {\n self: true,\n optional: true,\n });\n private readonly destroyRef = inject(DestroyRef);\n\n constructor() {\n this.bindValueAccessor();\n }\n\n / ───────────── Inputs / State ───────────── /\n\n /\n @property {ModelSignal<string>} value\n * @description\n * The value of the textarea. Supports two-way binding via signals.\n /\n value = model<string>('');\n\n /\n @property {InputSignal<FormControl>} control\n * @description\n * External FormControl used to read/set the textarea value.\n * If not provided, an internal FormControl is created.\n /\n control = input<FormControl>(new FormControl(''));\n\n /\n @property {InputSignal<string>} label\n * @description\n * Label displayed above the textarea.\n /\n label = input<string>('');\n\n /\n @property {InputSignal<string>} id\n * @description\n * HTML id attribute for the textarea.\n * @default 'tk-textarea'\n /\n id = input<string>('tk-textarea');\n\n /\n @property {InputSignal<number>} rows\n * @description\n * Number of visible text lines for the textarea.\n * @default 1\n /\n rows = input<number>(1);\n\n /\n @property {InputSignal<number>} cols\n * @description\n * Visible width of the textarea in average character widths.\n * @default 30\n /\n cols = input<number>(30);\n\n /\n @property {InputSignal<string>} hint\n * @description\n * Hint text to display below the textarea.\n /\n hint = input<string>('');\n\n /\n @property {InputSignal<string>} errorMessage\n * @description\n * Message to display when the control is invalid and touched.\n /\n errorMessage = input<string>('');\n\n /\n @property {InputSignal<number \| null>} maxLength\n * @description\n * Maximum number of characters allowed in the textarea.\n /\n maxLength = input<number \| null>(null);\n\n /\n @property {boolean} disabled\n * @description\n * Whether the textarea is disabled.\n /\n disabled = signal<boolean>(false);\n\n / ───────────── Derived state ───────────── /\n\n counterText = computed(() => {\n const limit = this.maxLength();\n return limit ? `${this.value().length}/${limit}` : '';\n });\n\n / ───────────── CVA callbacks ───────────── /\n\n private propagateChange: (value: string) => void = () => {};\n private propagateTouched: () => void = () => {};\n\n / ───────────── Internals ───────────── /\n\n private syncingFromView = false;\n\n / ───────────── Lifecycle ───────────── /\n\n ngOnInit(): void {\n this.initializeFromControl();\n this.listenToControlChanges();\n }\n\n / ───────────── ControlValueAccessor ───────────── /\n\n /\n @method writeValue\n * @description\n * Writes a new value to the element.\n * @param value The new value.\n /\n writeValue(value: string): void {\n const safeValue = value ?? '';\n this.value.set(safeValue);\n this.control().setValue(safeValue, { emitEvent: false });\n }\n\n /\n @method registerOnChange\n * @description\n * Registers a callback function that is called when the control's value changes in the UI.\n * @param fn The callback function.\n /\n registerOnChange(fn: (value: string) => void): void {\n this.propagateChange = fn;\n }\n\n /\n @method registerOnTouched\n * @description\n * Registers a callback function that is called by the forms API on initialization to update the form model on blur.\n * @param fn The callback function.\n /\n registerOnTouched(fn: () => void): void {\n this.propagateTouched = fn;\n }\n\n /\n @method setDisabledState\n * @description\n * Function that is called by the forms API when the control status changes to or from 'DISABLED'.\n * @param isDisabled The disabled status to set on the element.\n /\n setDisabledState(isDisabled: boolean): void {\n this.disabled.set(isDisabled);\n if (isDisabled) {\n this.control().disable({ emitEvent: false });\n } else {\n this.control().enable({ emitEvent: false });\n }\n }\n\n / ───────────── Template handlers ───────────── /\n\n /\n @method onInput\n * @description\n * Handles input events to update the model and notify forms.\n * @param event The input event.\n /\n onInput(event: Event): void {\n const nextValue = (event.target as HTMLTextAreaElement).value;\n this.syncFromUserInput(nextValue);\n }\n\n /\n @method onBlur\n * @description\n * Handles blur events to mark the control as touched.\n /\n onBlur(): void {\n this.markControlAsTouched();\n }\n\n / ───────────── Private helpers ───────────── /\n\n private bindValueAccessor(): void {\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n private initializeFromControl(): void {\n const control = this.getControl();\n\n if (control.value !== null && control.value !== undefined) {\n this.value.set(control.value);\n }\n\n this.disabled.set(control.disabled);\n }\n\n private listenToControlChanges(): void {\n const control = this.getControl();\n\n control.valueChanges\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(value => {\n if (this.syncingFromView) return;\n if (value !== this.value()) {\n this.value.set(value ?? '');\n this.propagateChange(value);\n }\n });\n\n control.statusChanges\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(() => {\n this.disabled.set(control.disabled);\n });\n }\n\n private syncFromUserInput(value: string): void {\n this.syncingFromView = true;\n\n this.value.set(value);\n this.propagateChange(value);\n\n const control = this.getControl();\n control.setValue(value);\n control.markAsDirty();\n\n this.syncingFromView = false;\n }\n\n private markControlAsTouched(): void {\n this.propagateTouched();\n this.getControl().markAsTouched();\n }\n\n private getControl(): FormControl {\n return (this.ngControl?.control as FormControl) \|\| this.control();\n }\n\n get effectiveControl(): FormControl {\n return this.getControl();\n }\n}\n","<p-floatlabel>\n <div class=\"tk-textarea-wrapper\">\n <textarea\n pTextarea\n [autoResize]=\"true\"\n [id]=\"id()\"\n [rows]=\"rows()\"\n [cols]=\"cols()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur()\"\n [attr.maxlength]=\"maxLength()\"\n [disabled]=\"disabled()\"\n [class.p-filled]=\"!!value()\"\n [class.ng-invalid]=\"effectiveControl.invalid\"\n [class.ng-dirty]=\"effectiveControl.dirty\"\n [class.ng-touched]=\"effectiveControl.touched\"></textarea>\n\n <label [for]=\"id()\">{{ label() }}</label>\n </div>\n</p-floatlabel>\n\n<div class=\"tk-input-bottom\">\n <div class=\"tk-input-messages\">\n @if ((effectiveControl.invalid && (effectiveControl.dirty \|\|\n effectiveControl.touched)) && errorMessage()) {\n <p-message severity=\"error\" size=\"small\" variant=\"simple\">\n {{ errorMessage() }}\n </p-message>\n } @else if (hint()) {\n <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">\n {{ hint() }}\n </p-message>\n }\n </div>\n\n @if (maxLength()) {\n <p-message\n severity=\"secondary\"\n size=\"small\"\n variant=\"simple\"\n class=\"tk-character-counter\">\n {{ counterText() }}\n </p-message>\n }\n</div>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"tekus-design-system-components-textarea.mjs","sources":["../../../projects/design-system/components/textarea/src/textarea.component.ts","../../../projects/design-system/components/textarea/src/textarea.component.html","../../../projects/design-system/components/textarea/tekus-design-system-components-textarea.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n DestroyRef,\n input,\n model,\n signal,\n computed,\n inject,\n OnInit,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport {\n ControlValueAccessor,\n FormControl,\n ReactiveFormsModule,\n NgControl,\n} from '@angular/forms';\nimport { FloatLabelModule } from 'primeng/floatlabel';\nimport { TextareaModule } from 'primeng/textarea';\nimport { MessageModule } from 'primeng/message';\n\n@Component({\n selector: 'tk-textarea',\n imports: [\n ReactiveFormsModule,\n TextareaModule,\n FloatLabelModule,\n MessageModule,\n ],\n templateUrl: './textarea.component.html',\n styleUrl: './textarea.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TextareaComponent\n implements ControlValueAccessor, OnInit\n{\n /* ───────────── Dependency injection ───────────── /\n private readonly ngControl = inject(NgControl, {\n self: true,\n optional: true,\n });\n private readonly destroyRef = inject(DestroyRef);\n\n constructor() {\n this.bindValueAccessor();\n }\n\n / ───────────── Inputs / State ───────────── /\n\n /\n @property {ModelSignal<string>} value\n * @description\n * The value of the textarea. Supports two-way binding via signals.\n /\n value = model<string>('');\n\n /\n @property {InputSignal<FormControl>} control\n * @description\n * External FormControl used to read/set the textarea value.\n * If not provided, an internal FormControl is created.\n /\n control = input<FormControl>(new FormControl(''));\n\n /\n @property {InputSignal<string>} label\n * @description\n * Label displayed above the textarea.\n /\n label = input<string>('');\n\n /\n @property {InputSignal<string>} id\n * @description\n * HTML id attribute for the textarea.\n * @default 'tk-textarea'\n /\n id = input<string>('tk-textarea');\n\n /\n @property {InputSignal<number>} rows\n * @description\n * Number of visible text lines for the textarea.\n * @default 1\n /\n rows = input<number>(1);\n\n /\n @property {InputSignal<number>} cols\n * @description\n * Visible width of the textarea in average character widths.\n * @default 30\n /\n cols = input<number>(30);\n\n /\n @property {InputSignal<string>} hint\n * @description\n * Hint text to display below the textarea.\n /\n hint = input<string>('');\n\n /\n @property {InputSignal<string>} errorMessage\n * @description\n * Message to display when the control is invalid and touched.\n /\n errorMessage = input<string>('');\n\n /\n @property {InputSignal<number \| null>} maxLength\n * @description\n * Maximum number of characters allowed in the textarea.\n /\n maxLength = input<number \| null>(null);\n\n /\n @property {boolean} disabled\n * @description\n * Whether the textarea is disabled.\n /\n disabled = signal<boolean>(false);\n\n / ───────────── Derived state ───────────── /\n\n counterText = computed(() => {\n const limit = this.maxLength();\n return limit ? `${this.value().length}/${limit}` : '';\n });\n\n / ───────────── CVA callbacks ───────────── /\n\n private propagateChange: (value: string) => void = () => {};\n private propagateTouched: () => void = () => {};\n\n / ───────────── Internals ───────────── /\n\n private syncingFromView = false;\n\n / ───────────── Lifecycle ───────────── /\n\n ngOnInit(): void {\n this.initializeFromControl();\n this.listenToControlChanges();\n }\n\n / ───────────── ControlValueAccessor ───────────── /\n\n /\n @method writeValue\n * @description\n * Writes a new value to the element.\n * @param value The new value.\n /\n writeValue(value: string): void {\n const safeValue = value ?? '';\n this.value.set(safeValue);\n this.control().setValue(safeValue, { emitEvent: false });\n }\n\n /\n @method registerOnChange\n * @description\n * Registers a callback function that is called when the control's value changes in the UI.\n * @param fn The callback function.\n /\n registerOnChange(fn: (value: string) => void): void {\n this.propagateChange = fn;\n }\n\n /\n @method registerOnTouched\n * @description\n * Registers a callback function that is called by the forms API on initialization to update the form model on blur.\n * @param fn The callback function.\n /\n registerOnTouched(fn: () => void): void {\n this.propagateTouched = fn;\n }\n\n /\n @method setDisabledState\n * @description\n * Function that is called by the forms API when the control status changes to or from 'DISABLED'.\n * @param isDisabled The disabled status to set on the element.\n /\n setDisabledState(isDisabled: boolean): void {\n this.disabled.set(isDisabled);\n if (isDisabled) {\n this.control().disable({ emitEvent: false });\n } else {\n this.control().enable({ emitEvent: false });\n }\n }\n\n / ───────────── Template handlers ───────────── /\n\n /\n @method onInput\n * @description\n * Handles input events to update the model and notify forms.\n * @param event The input event.\n /\n onInput(event: Event): void {\n const nextValue = (event.target as HTMLTextAreaElement).value;\n this.syncFromUserInput(nextValue);\n }\n\n /\n @method onBlur\n * @description\n * Handles blur events to mark the control as touched.\n /\n onBlur(): void {\n this.markControlAsTouched();\n }\n\n / ───────────── Private helpers ───────────── /\n\n private bindValueAccessor(): void {\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n private initializeFromControl(): void {\n const control = this.getControl();\n\n if (control.value !== null && control.value !== undefined) {\n this.value.set(control.value);\n }\n\n this.disabled.set(control.disabled);\n }\n\n private listenToControlChanges(): void {\n const control = this.getControl();\n\n control.valueChanges\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(value => {\n if (this.syncingFromView) return;\n if (value !== this.value()) {\n this.value.set(value ?? '');\n this.propagateChange(value);\n }\n });\n\n control.statusChanges\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(() => {\n this.disabled.set(control.disabled);\n });\n }\n\n private syncFromUserInput(value: string): void {\n this.syncingFromView = true;\n\n this.value.set(value);\n this.propagateChange(value);\n\n const control = this.getControl();\n control.setValue(value);\n control.markAsDirty();\n\n this.syncingFromView = false;\n }\n\n private markControlAsTouched(): void {\n this.propagateTouched();\n this.getControl().markAsTouched();\n }\n\n private getControl(): FormControl {\n return (this.ngControl?.control as FormControl) \|\| this.control();\n }\n\n get effectiveControl(): FormControl {\n return this.getControl();\n }\n}\n","<p-floatlabel>\n <div class=\"tk-textarea-wrapper\">\n <textarea\n pTextarea\n [autoResize]=\"true\"\n [id]=\"id()\"\n [rows]=\"rows()\"\n [cols]=\"cols()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur()\"\n [attr.maxlength]=\"maxLength()\"\n [disabled]=\"disabled()\"\n [class.p-filled]=\"!!value()\"\n [class.ng-invalid]=\"effectiveControl.invalid\"\n [class.ng-dirty]=\"effectiveControl.dirty\"\n [class.ng-touched]=\"effectiveControl.touched\"></textarea>\n\n <label [for]=\"id()\">{{ label() }}</label>\n </div>\n</p-floatlabel>\n\n<div class=\"tk-input-bottom\">\n <div class=\"tk-input-messages\">\n @if ((effectiveControl.invalid && (effectiveControl.dirty \|\|\n effectiveControl.touched)) && errorMessage()) {\n <p-message severity=\"error\" size=\"small\" variant=\"simple\">\n {{ errorMessage() }}\n </p-message>\n } @else if (hint()) {\n <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">\n {{ hint() }}\n </p-message>\n }\n </div>\n\n @if (maxLength()) {\n <p-message\n severity=\"secondary\"\n size=\"small\"\n variant=\"simple\"\n class=\"tk-character-counter\">\n {{ counterText() }}\n </p-message>\n }\n</div>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}