npm - @tekus/design-system - Versions diffs - 5.33.0 → 5.33.1 - Mend

@tekus/design-system 5.33.0 → 5.33.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 (87) hide show

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

@@ -61,10 +61,10 @@ class ActionGroupComponent {
             }));
         }, ...(ngDevMode ? [{ debugName: "overflowMenuItems" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: ActionGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: ActionGroupComponent, isStandalone: true, selector: "tk-action-group", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, maxVisible: { classPropertyName: "maxVisible", publicName: "maxVisible", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"tk-action-group-container\">\n  @for (action of visibleActions(); track action.label) {\n    <tk-button\n      [icon]=\"action.icon\"\n      [tooltipText]=\"action.label\"\n      [disabled]=\"disabled() || (action.disabled ?? false)\"\n      severity=\"secondary\"\n      variant=\"text\"\n      (clicked)=\"action.action()\"\n    ></tk-button>\n  }\n\n  @if (overflowMenuItems().length > 0) {\n    <tk-dropdown\n      icon=\"ellipsis-vertical\"\n      tooltip=\"M\u00E1s acciones\"\n      [disabled]=\"disabled()\"\n      [model]=\"overflowMenuItems()\"\n    ></tk-dropdown>\n  }\n</div>\n", styles: [".tk-action-group-container{display:inline-flex;align-items:center}.tk-action-group-container ::ng-deep tk-button .p-button,.tk-action-group-container ::ng-deep tk-dropdown .p-button{color:var(--tk-color-gray-950, #191A1B)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonComponent, selector: "tk-button", inputs: ["label", "disabled", "type", "severity", "variant", "link", "icon", "iconPosition", "tooltipText", "size"], outputs: ["clicked"] }, { kind: "component", type: DropdownComponent, selector: "tk-dropdown", inputs: ["model", "icon", "label", "iconPosition", "size", "disabled", "tooltip", "tooltipPosition"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: ActionGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: ActionGroupComponent, isStandalone: true, selector: "tk-action-group", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, maxVisible: { classPropertyName: "maxVisible", publicName: "maxVisible", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"tk-action-group-container\">\n  @for (action of visibleActions(); track action.label) {\n    <tk-button\n      [icon]=\"action.icon\"\n      [tooltipText]=\"action.label\"\n      [disabled]=\"disabled() || (action.disabled ?? false)\"\n      severity=\"secondary\"\n      variant=\"text\"\n      (clicked)=\"action.action()\"\n    ></tk-button>\n  }\n\n  @if (overflowMenuItems().length > 0) {\n    <tk-dropdown\n      icon=\"ellipsis-vertical\"\n      tooltip=\"M\u00E1s acciones\"\n      [disabled]=\"disabled()\"\n      [model]=\"overflowMenuItems()\"\n    ></tk-dropdown>\n  }\n</div>\n", styles: [".tk-action-group-container{display:inline-flex;align-items:center}.tk-action-group-container ::ng-deep tk-button .p-button,.tk-action-group-container ::ng-deep tk-dropdown .p-button{color:var(--tk-color-gray-950, #191A1B)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonComponent, selector: "tk-button", inputs: ["label", "disabled", "type", "severity", "variant", "link", "icon", "iconPosition", "tooltipText", "size"], outputs: ["clicked"] }, { kind: "component", type: DropdownComponent, selector: "tk-dropdown", inputs: ["model", "icon", "label", "iconPosition", "size", "disabled", "tooltip", "tooltipPosition"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: ActionGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: ActionGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tk-action-group', standalone: true, imports: [CommonModule, ButtonComponent, DropdownComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"tk-action-group-container\">\n  @for (action of visibleActions(); track action.label) {\n    <tk-button\n      [icon]=\"action.icon\"\n      [tooltipText]=\"action.label\"\n      [disabled]=\"disabled() || (action.disabled ?? false)\"\n      severity=\"secondary\"\n      variant=\"text\"\n      (clicked)=\"action.action()\"\n    ></tk-button>\n  }\n\n  @if (overflowMenuItems().length > 0) {\n    <tk-dropdown\n      icon=\"ellipsis-vertical\"\n      tooltip=\"M\u00E1s acciones\"\n      [disabled]=\"disabled()\"\n      [model]=\"overflowMenuItems()\"\n    ></tk-dropdown>\n  }\n</div>\n", styles: [".tk-action-group-container{display:inline-flex;align-items:center}.tk-action-group-container ::ng-deep tk-button .p-button,.tk-action-group-container ::ng-deep tk-dropdown .p-button{color:var(--tk-color-gray-950, #191A1B)}\n"] }]
         }], propDecorators: { actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], maxVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisible", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });

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

	@@ -1 +1 @@
1	- {"version":3,"file":"tekus-design-system-components-action-group.mjs","sources":["../../../projects/design-system/components/action-group/src/action-group.component.ts","../../../projects/design-system/components/action-group/src/action-group.component.html","../../../projects/design-system/components/action-group/tekus-design-system-components-action-group.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MenuItem } from 'primeng/api';\nimport { ButtonComponent } from '@tekus/design-system/components/button';\nimport { DropdownComponent } from '@tekus/design-system/components/dropdown';\nimport { TkAction } from './action-group.types';\n\n/*\n @component ActionGroupComponent\n * @description\n * Component that displays a list of actions as a group of icon buttons.\n * When the number of actions exceeds `maxVisible`, the remaining actions\n * are grouped into an overflow dropdown menu.\n \n @usage\n * ```html\n * <tk-action-group [actions]=\"myActions\" [maxVisible]=\"3\"></tk-action-group>\n * ```\n /\n@Component({\n selector: 'tk-action-group',\n standalone: true,\n imports: [CommonModule, ButtonComponent, DropdownComponent],\n templateUrl: './action-group.component.html',\n styleUrl: './action-group.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ActionGroupComponent {\n /\n The list of actions to display.\n /\n actions = input<TkAction[]>([]);\n\n /\n Maximum number of actions to show directly as buttons before collapsing the rest into a dropdown menu.\n * @default 2\n /\n maxVisible = input<number>(2);\n\n /\n Disables all actions in the group.\n * Individual actions can also be disabled via `TkAction.disabled`.\n * @default false\n /\n disabled = input<boolean>(false);\n\n /\n The subset of actions to display directly as buttons.\n /\n visibleActions = computed(() => {\n const list = this.actions();\n const max = this.maxVisible();\n return list.slice(0, max);\n });\n\n /\n The subset of actions to display in the overflow dropdown menu.\n * Mapped to PrimeNG MenuItem structure.\n /\n overflowMenuItems = computed<MenuItem[]>(() => {\n const list = this.actions();\n const max = this.maxVisible();\n if (list.length <= max) {\n return [];\n }\n\n const globalDisabled = this.disabled();\n const overflowList = list.slice(max);\n return overflowList.map(action => ({\n label: action.label,\n icon: action.icon,\n command: () => action.action(),\n disabled: globalDisabled \|\| (action.disabled ?? false),\n }));\n });\n}\n","<div class=\"tk-action-group-container\">\n @for (action of visibleActions(); track action.label) {\n <tk-button\n [icon]=\"action.icon\"\n [tooltipText]=\"action.label\"\n [disabled]=\"disabled() \|\| (action.disabled ?? false)\"\n severity=\"secondary\"\n variant=\"text\"\n (clicked)=\"action.action()\"\n ></tk-button>\n }\n\n @if (overflowMenuItems().length > 0) {\n <tk-dropdown\n icon=\"ellipsis-vertical\"\n tooltip=\"Más acciones\"\n [disabled]=\"disabled()\"\n [model]=\"overflowMenuItems()\"\n ></tk-dropdown>\n }\n</div>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;AAOA;;;;;;;;;;;AAWG;MASU,oBAAoB,CAAA;AARjC,IAAA,WAAA,GAAA;AASE;;AAEG;AACH,QAAA,IAAA,CAAA,OAAO,GAAG,KAAK,CAAa,EAAE,8EAAC;AAE/B;;;AAGG;AACH,QAAA,IAAA,CAAA,UAAU,GAAG,KAAK,CAAS,CAAC,iFAAC;AAE7B;;;;AAIG;AACH,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAU,KAAK,+EAAC;AAEhC;;AAEG;AACH,QAAA,IAAA,CAAA,cAAc,GAAG,QAAQ,CAAC,MAAK;AAC7B,YAAA,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,EAAE;AAC3B,YAAA,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,EAAE;YAC7B,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC;AAC3B,QAAA,CAAC,qFAAC;AAEF;;;AAGG;AACH,QAAA,IAAA,CAAA,iBAAiB,GAAG,QAAQ,CAAa,MAAK;AAC5C,YAAA,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,EAAE;AAC3B,YAAA,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,EAAE;AAC7B,YAAA,IAAI,IAAI,CAAC,MAAM,IAAI,GAAG,EAAE;AACtB,gBAAA,OAAO,EAAE;YACX;AAEA,YAAA,MAAM,cAAc,GAAG,IAAI,CAAC,QAAQ,EAAE;YACtC,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YACpC,OAAO,YAAY,CAAC,GAAG,CAAC,MAAM,KAAK;gBACjC,KAAK,EAAE,MAAM,CAAC,KAAK;gBACnB,IAAI,EAAE,MAAM,CAAC,IAAI;AACjB,gBAAA,OAAO,EAAE,MAAM,MAAM,CAAC,MAAM,EAAE;gBAC9B,QAAQ,EAAE,cAAc,KAAK,MAAM,CAAC,QAAQ,IAAI,KAAK,CAAC;AACvD,aAAA,CAAC,CAAC;AACL,QAAA,CAAC,wFAAC;AACH,IAAA~~;8GAhDY~~,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,~~QAAA~~,EAAA,IAAA,EAAA,oBAAoB,6dC3BjC,6lBAqBA,EAAA,MAAA,EAAA,CAAA,kOAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDCY,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,eAAe,iMAAE,iBAAiB,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,MAAA,EAAA,OAAA,EAAA,cAAA,EAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,iBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;~~2FAK~~/C,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBARhC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,iBAAiB,EAAA,UAAA,EACf,IAAI,EAAA,OAAA,EACP,CAAC,YAAY,EAAE,eAAe,EAAE,iBAAiB,CAAC,EAAA,eAAA,EAG1C,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,6lBAAA,EAAA,MAAA,EAAA,CAAA,kOAAA,CAAA,EAAA;;;AEzBjD;;AAEG;;;;"}
1	+ {"version":3,"file":"tekus-design-system-components-action-group.mjs","sources":["../../../projects/design-system/components/action-group/src/action-group.component.ts","../../../projects/design-system/components/action-group/src/action-group.component.html","../../../projects/design-system/components/action-group/tekus-design-system-components-action-group.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MenuItem } from 'primeng/api';\nimport { ButtonComponent } from '@tekus/design-system/components/button';\nimport { DropdownComponent } from '@tekus/design-system/components/dropdown';\nimport { TkAction } from './action-group.types';\n\n/*\n @component ActionGroupComponent\n * @description\n * Component that displays a list of actions as a group of icon buttons.\n * When the number of actions exceeds `maxVisible`, the remaining actions\n * are grouped into an overflow dropdown menu.\n \n @usage\n * ```html\n * <tk-action-group [actions]=\"myActions\" [maxVisible]=\"3\"></tk-action-group>\n * ```\n /\n@Component({\n selector: 'tk-action-group',\n standalone: true,\n imports: [CommonModule, ButtonComponent, DropdownComponent],\n templateUrl: './action-group.component.html',\n styleUrl: './action-group.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ActionGroupComponent {\n /\n The list of actions to display.\n /\n actions = input<TkAction[]>([]);\n\n /\n Maximum number of actions to show directly as buttons before collapsing the rest into a dropdown menu.\n * @default 2\n /\n maxVisible = input<number>(2);\n\n /\n Disables all actions in the group.\n * Individual actions can also be disabled via `TkAction.disabled`.\n * @default false\n /\n disabled = input<boolean>(false);\n\n /\n The subset of actions to display directly as buttons.\n /\n visibleActions = computed(() => {\n const list = this.actions();\n const max = this.maxVisible();\n return list.slice(0, max);\n });\n\n /\n The subset of actions to display in the overflow dropdown menu.\n * Mapped to PrimeNG MenuItem structure.\n /\n overflowMenuItems = computed<MenuItem[]>(() => {\n const list = this.actions();\n const max = this.maxVisible();\n if (list.length <= max) {\n return [];\n }\n\n const globalDisabled = this.disabled();\n const overflowList = list.slice(max);\n return overflowList.map(action => ({\n label: action.label,\n icon: action.icon,\n command: () => action.action(),\n disabled: globalDisabled \|\| (action.disabled ?? false),\n }));\n });\n}\n","<div class=\"tk-action-group-container\">\n @for (action of visibleActions(); track action.label) {\n <tk-button\n [icon]=\"action.icon\"\n [tooltipText]=\"action.label\"\n [disabled]=\"disabled() \|\| (action.disabled ?? false)\"\n severity=\"secondary\"\n variant=\"text\"\n (clicked)=\"action.action()\"\n ></tk-button>\n }\n\n @if (overflowMenuItems().length > 0) {\n <tk-dropdown\n icon=\"ellipsis-vertical\"\n tooltip=\"Más acciones\"\n [disabled]=\"disabled()\"\n [model]=\"overflowMenuItems()\"\n ></tk-dropdown>\n }\n</div>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;AAOA;;;;;;;;;;;AAWG;MASU,oBAAoB,CAAA;AARjC,IAAA,WAAA,GAAA;AASE;;AAEG;AACH,QAAA,IAAA,CAAA,OAAO,GAAG,KAAK,CAAa,EAAE,8EAAC;AAE/B;;;AAGG;AACH,QAAA,IAAA,CAAA,UAAU,GAAG,KAAK,CAAS,CAAC,iFAAC;AAE7B;;;;AAIG;AACH,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAU,KAAK,+EAAC;AAEhC;;AAEG;AACH,QAAA,IAAA,CAAA,cAAc,GAAG,QAAQ,CAAC,MAAK;AAC7B,YAAA,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,EAAE;AAC3B,YAAA,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,EAAE;YAC7B,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC;AAC3B,QAAA,CAAC,qFAAC;AAEF;;;AAGG;AACH,QAAA,IAAA,CAAA,iBAAiB,GAAG,QAAQ,CAAa,MAAK;AAC5C,YAAA,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,EAAE;AAC3B,YAAA,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,EAAE;AAC7B,YAAA,IAAI,IAAI,CAAC,MAAM,IAAI,GAAG,EAAE;AACtB,gBAAA,OAAO,EAAE;YACX;AAEA,YAAA,MAAM,cAAc,GAAG,IAAI,CAAC,QAAQ,EAAE;YACtC,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YACpC,OAAO,YAAY,CAAC,GAAG,CAAC,MAAM,KAAK;gBACjC,KAAK,EAAE,MAAM,CAAC,KAAK;gBACnB,IAAI,EAAE,MAAM,CAAC,IAAI;AACjB,gBAAA,OAAO,EAAE,MAAM,MAAM,CAAC,MAAM,EAAE;gBAC9B,QAAQ,EAAE,cAAc,KAAK,MAAM,CAAC,QAAQ,IAAI,KAAK,CAAC;AACvD,aAAA,CAAC,CAAC;AACL,QAAA,CAAC,wFAAC;AACH,IAAA;+GAhDY,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,oBAAoB,6dC3BjC,6lBAqBA,EAAA,MAAA,EAAA,CAAA,kOAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDCY,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,eAAe,iMAAE,iBAAiB,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,MAAA,EAAA,OAAA,EAAA,cAAA,EAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,iBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAK/C,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBARhC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,iBAAiB,EAAA,UAAA,EACf,IAAI,EAAA,OAAA,EACP,CAAC,YAAY,EAAE,eAAe,EAAE,iBAAiB,CAAC,EAAA,eAAA,EAG1C,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,6lBAAA,EAAA,MAAA,EAAA,CAAA,kOAAA,CAAA,EAAA;;;AEzBjD;;AAEG;;;;"}

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

@@ -202,8 +202,8 @@ class AutocompleteComponent {
     get effectiveControl() {
         return this.ngControl?.control || this.control();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: AutocompleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: AutocompleteComponent, isStandalone: true, selector: "tk-autocomplete", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", 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 }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { model: "modelChange", modelChange: "modelChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: AutocompleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: AutocompleteComponent, isStandalone: true, selector: "tk-autocomplete", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", 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 }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { model: "modelChange", modelChange: "modelChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => AutocompleteComponent),
@@ -211,7 +211,7 @@ class AutocompleteComponent {
             },
         ], viewQueries: [{ propertyName: "autoComplete", first: true, predicate: AutoComplete, descendants: true, isSignal: true }], ngImport: i0, template: "<p-floatlabel class=\"w-full\">\n  <div class=\"tk-autocomplete-wrapper\">\n    @if (icon()) {\n    <tk-icon [icon]=\"icon()\" class=\"tk-autocomplete-icon\"></tk-icon>\n    }\n    <p-autocomplete [ngModel]=\"value\" (ngModelChange)=\"handleChange($event)\" [disabled]=\"disabled()\" [inputId]=\"id()\"\n      [typeahead]=\"false\" multiple fluid (onBlur)=\"handleBlur()\"\n      [class.ng-invalid]=\"effectiveControl?.invalid && (effectiveControl?.dirty || effectiveControl?.touched)\"\n      [class.ng-dirty]=\"effectiveControl?.dirty\" [class.ng-touched]=\"effectiveControl?.touched\" />\n    <label [for]=\"id()\">{{ label() }}</label>\n  </div>\n</p-floatlabel>\n\n<div class=\"tk-autocomplete-bottom\">\n  <div class=\"tk-autocomplete-messages\">\n    @if ((effectiveControl?.invalid && (effectiveControl?.dirty || effectiveControl?.touched)) && errorMessage()) {\n    <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{ errorMessage() }}</p-message>\n    } @else if (hint()) {\n    <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">{{ hint() }}</p-message>\n    }\n  </div>\n</div>", styles: [":host ::ng-deep .p-autocomplete-input-multiple{width:100%;border:none;border-bottom:1px solid var(--tk-color-border-default, #cecdcd);border-radius:0;background-color:transparent}:host ::ng-deep .p-autocomplete-input-multiple:focus{border-color:var(--tk-color-base-primary-600, #140065)}:host ::ng-deep p-autocomplete{flex:1;width:100%}:host ::ng-deep .tk-autocomplete-wrapper:has(.tk-autocomplete-icon) .p-autocomplete-input-multiple{padding-left:var(--tk-spacing-base-200, 2rem)}:host ::ng-deep p-autocomplete.ng-invalid.ng-dirty .p-autocomplete-input-multiple,:host ::ng-deep p-autocomplete.ng-invalid.ng-touched .p-autocomplete-input-multiple{border-color:var(--tk-color-base-red-700, #cf2604)}:host ::ng-deep .p-floatlabel:has(.p-inputwrapper-filled) label,:host ::ng-deep .p-floatlabel:has(input:focus) label{color:var(--tk-primary-500, #16006f)}:host ::ng-deep .p-floatlabel label{color:var(--tk-color-base-surface-500, #8a8a8b);font-family:var(--tk-font-family, Poppins, sans-serif);font-size:var(--tk-font-size-2xs, 1rem);font-weight:var(--tk-font-weight-400, 400);left:var(--tk-spacing-base-25, .25rem)}:host ::ng-deep .p-floatlabel .tk-autocomplete-wrapper:has(.tk-autocomplete-icon) label{left:var(--tk-spacing-base-200, 2rem)}:host ::ng-deep .p-floatlabel:has(p-autocomplete.ng-invalid.ng-dirty) label,:host ::ng-deep .p-floatlabel:has(p-autocomplete.ng-invalid.ng-touched) label{color:var(--tk-color-base-red-700, #cf2604)!important}:host ::ng-deep .p-autocomplete-chip-icon{display:flex;color:var(--tk-surface-700, #424243)}:host ::ng-deep .p-autocomplete-chip{border-radius:var(--tk-borderRadius-full, 999px)!important;color:var(--tk-surface-700, #424243)}:host ::ng-deep .p-chip-label{display:inline-block;max-width:10ch;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .p-autocomplete-input-multiple-label{gap:.313rem;padding:var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-25, 4px)!important}: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-autocomplete-bottom{display:flex;justify-content:space-between;align-items:flex-start;margin-top:var(--tk-spacing-base-25, .25rem);min-height:var(--tk-spacing-base-125, 1.25rem)}:host ::ng-deep .tk-autocomplete-messages{flex:1;margin-right:var(--tk-spacing-base-100, 1rem)}:host ::ng-deep .tk-autocomplete-wrapper{position:relative;display:flex;align-items:center;width:100%}:host ::ng-deep .tk-autocomplete-icon{position:absolute;left:0;top:50%;transform:translateY(-50%)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "minQueryLength", "delay", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "addOnTab", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "addOnBlur", "separator", "appendTo", "motionOptions"], outputs: ["completeMethod", "onSelect", "onUnselect", "onAdd", "onFocus", "onBlur", "onDropdownClick", "onClear", "onInputKeydown", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { 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"] }, { kind: "component", type: IconComponent, selector: "tk-icon", inputs: ["icon", "styleIcon", "color", "size", "disabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: AutocompleteComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: AutocompleteComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tk-autocomplete', imports: [FormsModule, AutoComplete, FloatLabelModule, MessageModule, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"tekus-design-system-components-autocomplete.mjs","sources":["../../../projects/design-system/components/autocomplete/src/autocomplete.component.ts","../../../projects/design-system/components/autocomplete/src/autocomplete.component.html","../../../projects/design-system/components/autocomplete/tekus-design-system-components-autocomplete.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n effect,\n model,\n forwardRef,\n input,\n output,\n signal,\n inject,\n viewChild,\n} from '@angular/core';\nimport {\n ControlValueAccessor,\n NG_VALUE_ACCESSOR,\n FormsModule, \n NgControl, \n FormControl \n} from '@angular/forms';\nimport { FloatLabelModule } from 'primeng/floatlabel';\nimport { AutoComplete } from 'primeng/autocomplete';\nimport { MessageModule } from 'primeng/message';\nimport { IconComponent } from '@tekus/design-system/components/icon';\ntype AutocompleteValue<T = unknown> = T \| T[] \| null;\n\n@Component({\n selector: 'tk-autocomplete',\n imports: [FormsModule, AutoComplete, FloatLabelModule, MessageModule, IconComponent],\n templateUrl: './autocomplete.component.html',\n styleUrl: './autocomplete.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => AutocompleteComponent),\n multi: true,\n },\n ],\n})\nexport class AutocompleteComponent<T = unknown>\n implements ControlValueAccessor\n{\n readonly ngControl = inject(NgControl, { self: true, optional: true });\n /*\n @property {string} id\n * @description\n * HTML id attribute for the autocomplete input.\n \n @default 'autocomplete'\n /\n id = input<string>('autocomplete');\n\n /\n @property {InputSignal<string>} icon\n * @description\n * Icon to display next to the input (e.g., 'magnifying-glass').\n /\n icon = input<string>('');\n\n /\n @property {InputSignal<FormControl>} control\n * @description\n * External FormControl used to read/set the input value.\n * If not provided, an internal FormControl is created.\n /\n control = input<FormControl>();\n\n /\n @property {string} label\n * @description\n * Floating label displayed above the autocomplete input.\n /\n label = input<string>('');\n\n /\n @property {boolean} disabled\n * @description\n * Determines whether the autocomplete field is disabled.\n \n @default false\n /\n disabled = input<boolean>(false);\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<string>} hint\n * @description\n * Hint text to display below the input.\n /\n hint = input<string>('');\n\n /\n @property {AutocompleteValue<T>} value\n * @description\n * Internal selected value. Synced with Angular forms and the model signal.\n \n @internal\n /\n value: AutocompleteValue<T> = null;\n\n internalDisabled = signal(false);\n\n /\n @property {Signal<AutocompleteValue<T>>} model\n * @description\n * Two-way binding model using Angular signals.\n * Allows usage with the syntax: `[(model)]=\"myValue\"`.\n /\n model = model<AutocompleteValue<T>>();\n\n /\n @event modelChange\n * @description\n * Emits whenever the value changes.\n * Payload: the selected item(s) of type `AutocompleteValue<T>`.\n \n @example\n * <tk-autocomplete (modelChange)=\"onChange($event)\"></tk-autocomplete>\n /\n modelChange = output<AutocompleteValue<T>>();\n\n // -----------------------------------\n // CVA CALLBACKS\n // -----------------------------------\n\n private onChangeFn: (value: AutocompleteValue<T>) => void = () => {};\n private onTouchedFn = () => {};\n\n private readonly init = (() => {\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n })();\n\n /\n disabled → internalDisabled\n /\n private readonly syncDisabled = effect(() => {\n this.internalDisabled.set(this.disabled());\n });\n\n /\n model → internal value + forms\n /\n private readonly syncModel = effect(() => {\n const v = this.model();\n if (v !== this.value) {\n this.value = v ?? null;\n this.onChangeFn(this.value);\n }\n });\n\n /\n @method writeValue\n * @description\n * Receives value updates from Angular Forms and writes them into the component.\n \n @param {AutocompleteValue<T>} value - New value from the forms API.\n /\n writeValue(value: AutocompleteValue<T>): void {\n this.model.set(value);\n }\n\n /\n @method registerOnChange\n * @description\n * Registers a callback that is invoked when the component's value changes.\n /\n registerOnChange(fn: (value: AutocompleteValue<T>) => void): void {\n this.onChangeFn = fn;\n }\n\n /\n @method registerOnTouched\n * @description\n * Registers a callback invoked when the component is touched.\n /\n registerOnTouched(fn: () => void): void {\n this.onTouchedFn = fn;\n }\n\n /\n @method setDisabledState\n * @description\n * Updates the disabled state of the autocomplete control.\n \n @param {boolean} isDisabled - Whether the component should be disabled.\n /\n setDisabledState(isDisabled: boolean): void {\n this.internalDisabled.set(isDisabled);\n }\n\n /\n @method handleChange\n * @description\n * Handles value changes from the autocomplete component.\n * Updates Angular Forms, Signals, and emits the modelChange event.\n \n @param {AutocompleteValue<T>} value - The new selected value(s).\n /\n handleChange(value: AutocompleteValue<T>) {\n this.value = value;\n this.onChangeFn(value);\n this.onTouchedFn();\n this.model.set(value);\n this.modelChange.emit(value);\n this.effectiveControl?.setValue(value);\n this.effectiveControl?.markAsDirty();\n }\n\n /\n @property {AutoComplete} autoComplete\n * @description\n * Reference to the underlying PrimeNG AutoComplete component.\n * Used to access the native input element for chip creation on blur.\n /\n autoComplete = viewChild<AutoComplete>(AutoComplete);\n\n /\n @method handleBlur\n * @description\n * Handles the blur event of the autocomplete input.\n * Captures any pending text in the input field and converts it into a chip/value.\n * This ensures that typing text and clicking away behaves similarly to pressing \"Enter\".\n /\n handleBlur() {\n const ac = this.autoComplete();\n if (ac?.inputEL) {\n const inputValue = ac.inputEL.nativeElement.value;\n if (inputValue && inputValue.trim() !== '') {\n const newValue = inputValue.trim();\n const currentValues = Array.isArray(this.value) ? [...this.value] : [];\n currentValues.push(newValue);\n\n this.handleChange(currentValues as unknown as AutocompleteValue<T>);\n\n ac.inputEL.nativeElement.value = '';\n }\n }\n }\n\n /\n @method effectiveControl\n * @description\n * Gets the active FormControl for the component.\n * Returns the injected NgControl's control if available, otherwise falls back to the local `control` input.\n * This getter is crucial for unifying validation status checks in the template.\n /\n get effectiveControl(): FormControl \| undefined {\n return (this.ngControl?.control as FormControl) \|\| this.control();\n }\n}\n","<p-floatlabel class=\"w-full\">\n <div class=\"tk-autocomplete-wrapper\">\n @if (icon()) {\n <tk-icon [icon]=\"icon()\" class=\"tk-autocomplete-icon\"></tk-icon>\n }\n <p-autocomplete [ngModel]=\"value\" (ngModelChange)=\"handleChange($event)\" [disabled]=\"disabled()\" [inputId]=\"id()\"\n [typeahead]=\"false\" multiple fluid (onBlur)=\"handleBlur()\"\n [class.ng-invalid]=\"effectiveControl?.invalid && (effectiveControl?.dirty \|\| effectiveControl?.touched)\"\n [class.ng-dirty]=\"effectiveControl?.dirty\" [class.ng-touched]=\"effectiveControl?.touched\" />\n <label [for]=\"id()\">{{ label() }}</label>\n </div>\n</p-floatlabel>\n\n<div class=\"tk-autocomplete-bottom\">\n <div class=\"tk-autocomplete-messages\">\n @if ((effectiveControl?.invalid && (effectiveControl?.dirty \|\| effectiveControl?.touched)) && errorMessage()) {\n <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{ errorMessage() }}</p-message>\n } @else if (hint()) {\n <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">{{ hint() }}</p-message>\n }\n </div>\n</div>","/\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-autocomplete.mjs","sources":["../../../projects/design-system/components/autocomplete/src/autocomplete.component.ts","../../../projects/design-system/components/autocomplete/src/autocomplete.component.html","../../../projects/design-system/components/autocomplete/tekus-design-system-components-autocomplete.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n effect,\n model,\n forwardRef,\n input,\n output,\n signal,\n inject,\n viewChild,\n} from '@angular/core';\nimport {\n ControlValueAccessor,\n NG_VALUE_ACCESSOR,\n FormsModule, \n NgControl, \n FormControl \n} from '@angular/forms';\nimport { FloatLabelModule } from 'primeng/floatlabel';\nimport { AutoComplete } from 'primeng/autocomplete';\nimport { MessageModule } from 'primeng/message';\nimport { IconComponent } from '@tekus/design-system/components/icon';\ntype AutocompleteValue<T = unknown> = T \| T[] \| null;\n\n@Component({\n selector: 'tk-autocomplete',\n imports: [FormsModule, AutoComplete, FloatLabelModule, MessageModule, IconComponent],\n templateUrl: './autocomplete.component.html',\n styleUrl: './autocomplete.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => AutocompleteComponent),\n multi: true,\n },\n ],\n})\nexport class AutocompleteComponent<T = unknown>\n implements ControlValueAccessor\n{\n readonly ngControl = inject(NgControl, { self: true, optional: true });\n /*\n @property {string} id\n * @description\n * HTML id attribute for the autocomplete input.\n \n @default 'autocomplete'\n /\n id = input<string>('autocomplete');\n\n /\n @property {InputSignal<string>} icon\n * @description\n * Icon to display next to the input (e.g., 'magnifying-glass').\n /\n icon = input<string>('');\n\n /\n @property {InputSignal<FormControl>} control\n * @description\n * External FormControl used to read/set the input value.\n * If not provided, an internal FormControl is created.\n /\n control = input<FormControl>();\n\n /\n @property {string} label\n * @description\n * Floating label displayed above the autocomplete input.\n /\n label = input<string>('');\n\n /\n @property {boolean} disabled\n * @description\n * Determines whether the autocomplete field is disabled.\n \n @default false\n /\n disabled = input<boolean>(false);\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<string>} hint\n * @description\n * Hint text to display below the input.\n /\n hint = input<string>('');\n\n /\n @property {AutocompleteValue<T>} value\n * @description\n * Internal selected value. Synced with Angular forms and the model signal.\n \n @internal\n /\n value: AutocompleteValue<T> = null;\n\n internalDisabled = signal(false);\n\n /\n @property {Signal<AutocompleteValue<T>>} model\n * @description\n * Two-way binding model using Angular signals.\n * Allows usage with the syntax: `[(model)]=\"myValue\"`.\n /\n model = model<AutocompleteValue<T>>();\n\n /\n @event modelChange\n * @description\n * Emits whenever the value changes.\n * Payload: the selected item(s) of type `AutocompleteValue<T>`.\n \n @example\n * <tk-autocomplete (modelChange)=\"onChange($event)\"></tk-autocomplete>\n /\n modelChange = output<AutocompleteValue<T>>();\n\n // -----------------------------------\n // CVA CALLBACKS\n // -----------------------------------\n\n private onChangeFn: (value: AutocompleteValue<T>) => void = () => {};\n private onTouchedFn = () => {};\n\n private readonly init = (() => {\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n })();\n\n /\n disabled → internalDisabled\n /\n private readonly syncDisabled = effect(() => {\n this.internalDisabled.set(this.disabled());\n });\n\n /\n model → internal value + forms\n /\n private readonly syncModel = effect(() => {\n const v = this.model();\n if (v !== this.value) {\n this.value = v ?? null;\n this.onChangeFn(this.value);\n }\n });\n\n /\n @method writeValue\n * @description\n * Receives value updates from Angular Forms and writes them into the component.\n \n @param {AutocompleteValue<T>} value - New value from the forms API.\n /\n writeValue(value: AutocompleteValue<T>): void {\n this.model.set(value);\n }\n\n /\n @method registerOnChange\n * @description\n * Registers a callback that is invoked when the component's value changes.\n /\n registerOnChange(fn: (value: AutocompleteValue<T>) => void): void {\n this.onChangeFn = fn;\n }\n\n /\n @method registerOnTouched\n * @description\n * Registers a callback invoked when the component is touched.\n /\n registerOnTouched(fn: () => void): void {\n this.onTouchedFn = fn;\n }\n\n /\n @method setDisabledState\n * @description\n * Updates the disabled state of the autocomplete control.\n \n @param {boolean} isDisabled - Whether the component should be disabled.\n /\n setDisabledState(isDisabled: boolean): void {\n this.internalDisabled.set(isDisabled);\n }\n\n /\n @method handleChange\n * @description\n * Handles value changes from the autocomplete component.\n * Updates Angular Forms, Signals, and emits the modelChange event.\n \n @param {AutocompleteValue<T>} value - The new selected value(s).\n /\n handleChange(value: AutocompleteValue<T>) {\n this.value = value;\n this.onChangeFn(value);\n this.onTouchedFn();\n this.model.set(value);\n this.modelChange.emit(value);\n this.effectiveControl?.setValue(value);\n this.effectiveControl?.markAsDirty();\n }\n\n /\n @property {AutoComplete} autoComplete\n * @description\n * Reference to the underlying PrimeNG AutoComplete component.\n * Used to access the native input element for chip creation on blur.\n /\n autoComplete = viewChild<AutoComplete>(AutoComplete);\n\n /\n @method handleBlur\n * @description\n * Handles the blur event of the autocomplete input.\n * Captures any pending text in the input field and converts it into a chip/value.\n * This ensures that typing text and clicking away behaves similarly to pressing \"Enter\".\n /\n handleBlur() {\n const ac = this.autoComplete();\n if (ac?.inputEL) {\n const inputValue = ac.inputEL.nativeElement.value;\n if (inputValue && inputValue.trim() !== '') {\n const newValue = inputValue.trim();\n const currentValues = Array.isArray(this.value) ? [...this.value] : [];\n currentValues.push(newValue);\n\n this.handleChange(currentValues as unknown as AutocompleteValue<T>);\n\n ac.inputEL.nativeElement.value = '';\n }\n }\n }\n\n /\n @method effectiveControl\n * @description\n * Gets the active FormControl for the component.\n * Returns the injected NgControl's control if available, otherwise falls back to the local `control` input.\n * This getter is crucial for unifying validation status checks in the template.\n /\n get effectiveControl(): FormControl \| undefined {\n return (this.ngControl?.control as FormControl) \|\| this.control();\n }\n}\n","<p-floatlabel class=\"w-full\">\n <div class=\"tk-autocomplete-wrapper\">\n @if (icon()) {\n <tk-icon [icon]=\"icon()\" class=\"tk-autocomplete-icon\"></tk-icon>\n }\n <p-autocomplete [ngModel]=\"value\" (ngModelChange)=\"handleChange($event)\" [disabled]=\"disabled()\" [inputId]=\"id()\"\n [typeahead]=\"false\" multiple fluid (onBlur)=\"handleBlur()\"\n [class.ng-invalid]=\"effectiveControl?.invalid && (effectiveControl?.dirty \|\| effectiveControl?.touched)\"\n [class.ng-dirty]=\"effectiveControl?.dirty\" [class.ng-touched]=\"effectiveControl?.touched\" />\n <label [for]=\"id()\">{{ label() }}</label>\n </div>\n</p-floatlabel>\n\n<div class=\"tk-autocomplete-bottom\">\n <div class=\"tk-autocomplete-messages\">\n @if ((effectiveControl?.invalid && (effectiveControl?.dirty \|\| effectiveControl?.touched)) && errorMessage()) {\n <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{ errorMessage() }}</p-message>\n } @else if (hint()) {\n <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">{{ hint() }}</p-message>\n }\n </div>\n</div>","/\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-badge.mjs CHANGED Viewed

@@ -43,10 +43,10 @@ class BadgeComponent {
             return severityMap[this.severity()];
         }, ...(ngDevMode ? [{ debugName: "primeSeverity" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: BadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.3", type: BadgeComponent, isStandalone: true, selector: "tk-badge", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<p-badge [value]=\"value()\" [severity]=\"primeSeverity()\" />\n", styles: [":host{display:inline-flex}:host ::ng-deep .p-badge{font-weight:var(--tk-font-weight-400, 400);font-size:var(--tk-font-size-legal-s, .625rem);border-radius:var(--tk-borderRadius-full, 50%)}:host ::ng-deep .p-badge-success{background-color:var(--tk-color-base-primary-500);color:var(--tk-color-base-surface-0, #ffffff)}:host ::ng-deep .p-badge-secondary{background-color:var(--tk-color-base-surface-300, #d2d2d2);color:var(--tk-color-base-surface-600, #5d5d5e)}:host ::ng-deep .p-badge-contrast{background-color:var(--tk-color-base-surface-950, #191a1b);color:var(--tk-color-base-surface-0, #ffffff)}\n"], dependencies: [{ kind: "ngmodule", type: BadgeModule }, { kind: "component", type: i1.Badge, selector: "p-badge", inputs: ["styleClass", "badgeSize", "size", "severity", "value", "badgeDisabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: BadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.17", type: BadgeComponent, isStandalone: true, selector: "tk-badge", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<p-badge [value]=\"value()\" [severity]=\"primeSeverity()\" />\n", styles: [":host{display:inline-flex}:host ::ng-deep .p-badge{font-weight:var(--tk-font-weight-400, 400);font-size:var(--tk-font-size-legal-s, .625rem);border-radius:var(--tk-borderRadius-full, 50%)}:host ::ng-deep .p-badge-success{background-color:var(--tk-color-base-primary-500);color:var(--tk-color-base-surface-0, #ffffff)}:host ::ng-deep .p-badge-secondary{background-color:var(--tk-color-base-surface-300, #d2d2d2);color:var(--tk-color-base-surface-600, #5d5d5e)}:host ::ng-deep .p-badge-contrast{background-color:var(--tk-color-base-surface-950, #191a1b);color:var(--tk-color-base-surface-0, #ffffff)}\n"], dependencies: [{ kind: "ngmodule", type: BadgeModule }, { kind: "component", type: i1.Badge, selector: "p-badge", inputs: ["styleClass", "badgeSize", "size", "severity", "value", "badgeDisabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: BadgeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: BadgeComponent, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'tk-badge', imports: [BadgeModule], template: "<p-badge [value]=\"value()\" [severity]=\"primeSeverity()\" />\n", styles: [":host{display:inline-flex}:host ::ng-deep .p-badge{font-weight:var(--tk-font-weight-400, 400);font-size:var(--tk-font-size-legal-s, .625rem);border-radius:var(--tk-borderRadius-full, 50%)}:host ::ng-deep .p-badge-success{background-color:var(--tk-color-base-primary-500);color:var(--tk-color-base-surface-0, #ffffff)}:host ::ng-deep .p-badge-secondary{background-color:var(--tk-color-base-surface-300, #d2d2d2);color:var(--tk-color-base-surface-600, #5d5d5e)}:host ::ng-deep .p-badge-contrast{background-color:var(--tk-color-base-surface-950, #191a1b);color:var(--tk-color-base-surface-0, #ffffff)}\n"] }]
         }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], severity: [{ type: i0.Input, args: [{ isSignal: true, alias: "severity", required: false }] }] } });

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

	@@ -1 +1 @@
1	- {"version":3,"file":"tekus-design-system-components-badge.mjs","sources":["../../../projects/design-system/components/badge/src/badge.component.ts","../../../projects/design-system/components/badge/src/badge.component.html","../../../projects/design-system/components/badge/tekus-design-system-components-badge.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\nimport { BadgeModule } from 'primeng/badge';\n\nexport type BadgeSeverity = 'secondary' \| 'primary' \| 'contrast' \| 'danger';\n/*\n @component BadgeComponent\n * @description\n * A component used to display numerical or textual badges.\n * It wraps PrimeNG's `p-badge` component with custom styling and behavior.\n \n This component supports:\n * - `value`: The text content to be displayed in the badge\n * - `severity`: The color scheme of the badge. Options: `'primary' \| 'secondary' \| 'contrast' \| 'danger'`\n * - Automatically maps severity values to PrimeNG's badge styles\n \n @usage\n * ### Basic Usage\n * ```html\n * <tk-badge value=\"5\" severity=\"primary\"></tk-badge>\n * ```\n * /\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'tk-badge',\n imports: [BadgeModule],\n templateUrl: './badge.component.html',\n styleUrl: './badge.component.scss',\n})\nexport class BadgeComponent {\n /* The text content to be displayed in the badge. /\n value = input.required<string>();\n\n /\n The severity level of the badge, which determines its color and styling.\n * @default 'primary'\n /\n severity = input<BadgeSeverity>('primary');\n\n /\n Computed property that maps the custom `BadgeSeverity` to the underlying PrimeNG `severity`.\n * Returns `undefined` for 'primary' as it uses the default style, and maps others accordingly.\n /\n primeSeverity = computed((): 'success' \| 'secondary' \| 'contrast' \| 'danger' => {\n const severityMap: Record<\n BadgeSeverity,\n 'success' \| 'secondary' \| 'contrast' \| 'danger'\n > = {\n secondary: 'secondary',\n primary: 'success',\n contrast: 'contrast',\n danger: 'danger',\n };\n return severityMap[this.severity()];\n });\n}\n","<p-badge [value]=\"value()\" [severity]=\"primeSeverity()\" />\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;AAIA;;;;;;;;;;;;;;;;AAgBK;MAQQ,cAAc,CAAA;AAP3B,IAAA,WAAA,GAAA;;AASE,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,2EAAU;AAEhC;;;AAGG;AACH,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAgB,SAAS,+EAAC;AAE1C;;;AAGG;AACH,QAAA,IAAA,CAAA,aAAa,GAAG,QAAQ,CAAC,MAAsD;AAC7E,YAAA,MAAM,WAAW,GAGb;AACF,gBAAA,SAAS,EAAE,WAAW;AACtB,gBAAA,OAAO,EAAE,SAAS;AAClB,gBAAA,QAAQ,EAAE,UAAU;AACpB,gBAAA,MAAM,EAAE,QAAQ;aACjB;AACD,YAAA,OAAO,WAAW,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;AACrC,QAAA,CAAC,oFAAC;AACH,IAAA~~;8GA1BY~~,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;~~kGAAd~~,cAAc,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC5B3B,kEACA,EAAA,MAAA,EAAA,CAAA,0lBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDuBY,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,WAAA,EAAA,MAAA,EAAA,UAAA,EAAA,OAAA,EAAA,eAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;~~2FAIV~~,cAAc,EAAA,UAAA,EAAA,CAAA;kBAP1B,SAAS;AACS,YAAA,IAAA,EAAA,CAAA,EAAA,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,UAAU,EAAA,OAAA,EACX,CAAC,WAAW,CAAC,EAAA,QAAA,EAAA,kEAAA,EAAA,MAAA,EAAA,CAAA,0lBAAA,CAAA,EAAA;;;AExBxB;;AAEG;;;;"}
1	+ {"version":3,"file":"tekus-design-system-components-badge.mjs","sources":["../../../projects/design-system/components/badge/src/badge.component.ts","../../../projects/design-system/components/badge/src/badge.component.html","../../../projects/design-system/components/badge/tekus-design-system-components-badge.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\nimport { BadgeModule } from 'primeng/badge';\n\nexport type BadgeSeverity = 'secondary' \| 'primary' \| 'contrast' \| 'danger';\n/*\n @component BadgeComponent\n * @description\n * A component used to display numerical or textual badges.\n * It wraps PrimeNG's `p-badge` component with custom styling and behavior.\n \n This component supports:\n * - `value`: The text content to be displayed in the badge\n * - `severity`: The color scheme of the badge. Options: `'primary' \| 'secondary' \| 'contrast' \| 'danger'`\n * - Automatically maps severity values to PrimeNG's badge styles\n \n @usage\n * ### Basic Usage\n * ```html\n * <tk-badge value=\"5\" severity=\"primary\"></tk-badge>\n * ```\n * /\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'tk-badge',\n imports: [BadgeModule],\n templateUrl: './badge.component.html',\n styleUrl: './badge.component.scss',\n})\nexport class BadgeComponent {\n /* The text content to be displayed in the badge. /\n value = input.required<string>();\n\n /\n The severity level of the badge, which determines its color and styling.\n * @default 'primary'\n /\n severity = input<BadgeSeverity>('primary');\n\n /\n Computed property that maps the custom `BadgeSeverity` to the underlying PrimeNG `severity`.\n * Returns `undefined` for 'primary' as it uses the default style, and maps others accordingly.\n /\n primeSeverity = computed((): 'success' \| 'secondary' \| 'contrast' \| 'danger' => {\n const severityMap: Record<\n BadgeSeverity,\n 'success' \| 'secondary' \| 'contrast' \| 'danger'\n > = {\n secondary: 'secondary',\n primary: 'success',\n contrast: 'contrast',\n danger: 'danger',\n };\n return severityMap[this.severity()];\n });\n}\n","<p-badge [value]=\"value()\" [severity]=\"primeSeverity()\" />\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;AAIA;;;;;;;;;;;;;;;;AAgBK;MAQQ,cAAc,CAAA;AAP3B,IAAA,WAAA,GAAA;;AASE,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,2EAAU;AAEhC;;;AAGG;AACH,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAgB,SAAS,+EAAC;AAE1C;;;AAGG;AACH,QAAA,IAAA,CAAA,aAAa,GAAG,QAAQ,CAAC,MAAsD;AAC7E,YAAA,MAAM,WAAW,GAGb;AACF,gBAAA,SAAS,EAAE,WAAW;AACtB,gBAAA,OAAO,EAAE,SAAS;AAClB,gBAAA,QAAQ,EAAE,UAAU;AACpB,gBAAA,MAAM,EAAE,QAAQ;aACjB;AACD,YAAA,OAAO,WAAW,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;AACrC,QAAA,CAAC,oFAAC;AACH,IAAA;+GA1BY,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAd,cAAc,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC5B3B,kEACA,EAAA,MAAA,EAAA,CAAA,0lBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDuBY,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,WAAA,EAAA,MAAA,EAAA,UAAA,EAAA,OAAA,EAAA,eAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAIV,cAAc,EAAA,UAAA,EAAA,CAAA;kBAP1B,SAAS;AACS,YAAA,IAAA,EAAA,CAAA,EAAA,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,UAAU,EAAA,OAAA,EACX,CAAC,WAAW,CAAC,EAAA,QAAA,EAAA,kEAAA,EAAA,MAAA,EAAA,CAAA,0lBAAA,CAAA,EAAA;;;AExBxB;;AAEG;;;;"}

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

@@ -49,10 +49,10 @@ class BreadCrumpsComponent {
             this.buildBreadcrumbs(child, url, breadcrumbs);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: BreadCrumpsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: BreadCrumpsComponent, isStandalone: true, selector: "tk-bread-crumps", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, onlyCurrent: { classPropertyName: "onlyCurrent", publicName: "onlyCurrent", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<nav class=\"tk-breadcrumps\" [class.tk-breadcrumps--size-small]=\"size() === 'small'\" [class.tk-breadcrumps--size-large]=\"size() === 'large'\">\n  <ul class=\"tk-breadcrumps__list\">\n    @for (item of (onlyCurrent() ? [routeItems()[routeItems().length - 1]] : routeItems()); track $index; let last = $last) {\n      @if (item) {\n        <li class=\"tk-breadcrumps__item\">\n          @if (!last && item.url) {\n            <a [routerLink]=\"item.url\" class=\"tk-breadcrumps__link\">\n              {{ item.label }}\n            </a>\n          } @else {\n            <span [class.tk-breadcrumps__current]=\"last\">\n              {{ item.label }}\n            </span>\n          }\n\n          @if (!last) {\n            <span class=\"tk-breadcrumps__separator\">/</span>\n          }\n        </li>\n      }\n    }\n  </ul>\n</nav>\n", styles: [":host{display:block;min-width:0;flex:1;overflow:hidden}.tk-breadcrumps{display:flex;align-items:center;width:100%}.tk-breadcrumps__list{display:flex;flex-wrap:nowrap;list-style:none;padding:0;margin:0;gap:0;font-family:var(--tk-font-family, \"Poppins\", sans-serif);font-size:var(--tk-font-size-paragraph-s, .875rem);width:100%;overflow:hidden}.tk-breadcrumps__item{display:flex;align-items:center;color:var(--tk-color-text-subtle, #5d5d5e);flex-shrink:3;min-width:1.5rem}.tk-breadcrumps__item:last-child{flex-shrink:1;min-width:3rem}.tk-breadcrumps__link{color:inherit;font-size:inherit;text-decoration:none;transition:color .2s ease}.tk-breadcrumps__link:hover{color:var(--tk-color-primary-default, #16006f);text-decoration:underline}.tk-breadcrumps__link,.tk-breadcrumps span:not(.tk-breadcrumps__separator){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;min-width:0;font-size:inherit}.tk-breadcrumps__separator{margin:0 .25rem;color:var(--tk-color-text-muted, #8a8a8b);-webkit-user-select:none;user-select:none;flex-shrink:0}.tk-breadcrumps__current{color:var(--tk-color-text-default, #191a1b);font-weight:var(--tk-font-weight-600, 600);font-size:inherit}.tk-breadcrumps--size-small .tk-breadcrumps__list{font-size:24px}.tk-breadcrumps--size-large .tk-breadcrumps__list{font-size:var(--tk-font-size-headers-l, 2rem)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: BreadCrumpsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: BreadCrumpsComponent, isStandalone: true, selector: "tk-bread-crumps", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, onlyCurrent: { classPropertyName: "onlyCurrent", publicName: "onlyCurrent", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<nav class=\"tk-breadcrumps\" [class.tk-breadcrumps--size-small]=\"size() === 'small'\" [class.tk-breadcrumps--size-large]=\"size() === 'large'\">\n  <ul class=\"tk-breadcrumps__list\">\n    @for (item of (onlyCurrent() ? [routeItems()[routeItems().length - 1]] : routeItems()); track $index; let last = $last) {\n      @if (item) {\n        <li class=\"tk-breadcrumps__item\">\n          @if (!last && item.url) {\n            <a [routerLink]=\"item.url\" class=\"tk-breadcrumps__link\">\n              {{ item.label }}\n            </a>\n          } @else {\n            <span [class.tk-breadcrumps__current]=\"last\">\n              {{ item.label }}\n            </span>\n          }\n\n          @if (!last) {\n            <span class=\"tk-breadcrumps__separator\">/</span>\n          }\n        </li>\n      }\n    }\n  </ul>\n</nav>\n", styles: [":host{display:block;min-width:0;flex:1;overflow:hidden}.tk-breadcrumps{display:flex;align-items:center;width:100%}.tk-breadcrumps__list{display:flex;flex-wrap:nowrap;list-style:none;padding:0;margin:0;gap:0;font-family:var(--tk-font-family, \"Poppins\", sans-serif);font-size:var(--tk-font-size-paragraph-s, .875rem);width:100%;overflow:hidden}.tk-breadcrumps__item{display:flex;align-items:center;color:var(--tk-color-text-subtle, #5d5d5e);flex-shrink:3;min-width:1.5rem}.tk-breadcrumps__item:last-child{flex-shrink:1;min-width:3rem}.tk-breadcrumps__link{color:inherit;font-size:inherit;text-decoration:none;transition:color .2s ease}.tk-breadcrumps__link:hover{color:var(--tk-color-primary-default, #16006f);text-decoration:underline}.tk-breadcrumps__link,.tk-breadcrumps span:not(.tk-breadcrumps__separator){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;min-width:0;font-size:inherit}.tk-breadcrumps__separator{margin:0 .25rem;color:var(--tk-color-text-muted, #8a8a8b);-webkit-user-select:none;user-select:none;flex-shrink:0}.tk-breadcrumps__current{color:var(--tk-color-text-default, #191a1b);font-weight:var(--tk-font-weight-600, 600);font-size:inherit}.tk-breadcrumps--size-small .tk-breadcrumps__list{font-size:24px}.tk-breadcrumps--size-large .tk-breadcrumps__list{font-size:var(--tk-font-size-headers-l, 2rem)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: BreadCrumpsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: BreadCrumpsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tk-bread-crumps', standalone: true, imports: [CommonModule, RouterModule], template: "<nav class=\"tk-breadcrumps\" [class.tk-breadcrumps--size-small]=\"size() === 'small'\" [class.tk-breadcrumps--size-large]=\"size() === 'large'\">\n  <ul class=\"tk-breadcrumps__list\">\n    @for (item of (onlyCurrent() ? [routeItems()[routeItems().length - 1]] : routeItems()); track $index; let last = $last) {\n      @if (item) {\n        <li class=\"tk-breadcrumps__item\">\n          @if (!last && item.url) {\n            <a [routerLink]=\"item.url\" class=\"tk-breadcrumps__link\">\n              {{ item.label }}\n            </a>\n          } @else {\n            <span [class.tk-breadcrumps__current]=\"last\">\n              {{ item.label }}\n            </span>\n          }\n\n          @if (!last) {\n            <span class=\"tk-breadcrumps__separator\">/</span>\n          }\n        </li>\n      }\n    }\n  </ul>\n</nav>\n", styles: [":host{display:block;min-width:0;flex:1;overflow:hidden}.tk-breadcrumps{display:flex;align-items:center;width:100%}.tk-breadcrumps__list{display:flex;flex-wrap:nowrap;list-style:none;padding:0;margin:0;gap:0;font-family:var(--tk-font-family, \"Poppins\", sans-serif);font-size:var(--tk-font-size-paragraph-s, .875rem);width:100%;overflow:hidden}.tk-breadcrumps__item{display:flex;align-items:center;color:var(--tk-color-text-subtle, #5d5d5e);flex-shrink:3;min-width:1.5rem}.tk-breadcrumps__item:last-child{flex-shrink:1;min-width:3rem}.tk-breadcrumps__link{color:inherit;font-size:inherit;text-decoration:none;transition:color .2s ease}.tk-breadcrumps__link:hover{color:var(--tk-color-primary-default, #16006f);text-decoration:underline}.tk-breadcrumps__link,.tk-breadcrumps span:not(.tk-breadcrumps__separator){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;min-width:0;font-size:inherit}.tk-breadcrumps__separator{margin:0 .25rem;color:var(--tk-color-text-muted, #8a8a8b);-webkit-user-select:none;user-select:none;flex-shrink:0}.tk-breadcrumps__current{color:var(--tk-color-text-default, #191a1b);font-weight:var(--tk-font-weight-600, 600);font-size:inherit}.tk-breadcrumps--size-small .tk-breadcrumps__list{font-size:24px}.tk-breadcrumps--size-large .tk-breadcrumps__list{font-size:var(--tk-font-size-headers-l, 2rem)}\n"] }]
         }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], onlyCurrent: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyCurrent", required: false }] }] } });

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

	@@ -1 +1 @@
1	- {"version":3,"file":"tekus-design-system-components-bread-crumps.mjs","sources":["../../../projects/design-system/components/bread-crumps/src/bread-crumps.component.ts","../../../projects/design-system/components/bread-crumps/src/bread-crumps.component.html","../../../projects/design-system/components/bread-crumps/tekus-design-system-components-bread-crumps.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, computed, inject, input } from '@angular/core';\nimport { ActivatedRouteSnapshot, NavigationEnd, Router, RouterModule, UrlSegment } from '@angular/router';\nimport { toSignal } from '@angular/core/rxjs-interop';\nimport { filter, map, startWith } from 'rxjs/operators';\nimport { BreadCrumpItem } from './bread-crumps.types';\n\n@Component({\n selector: 'tk-bread-crumps',\n standalone: true,\n imports: [CommonModule, RouterModule],\n templateUrl: './bread-crumps.component.html',\n styleUrl: './bread-crumps.component.scss',\n})\nexport class BreadCrumpsComponent {\n private readonly router = inject(Router);\n\n /** Optional manual items. If provided, route listening is ignored. /\n items = input<BreadCrumpItem[] \| null>(null);\n\n /* Size of the breadcrumbs title. Can be 'small' (24px) or 'large' (32px). Default is 'large'. /\n size = input<'small' \| 'large'>('large');\n\n /* If true, only the current (last) item will be displayed. /\n onlyCurrent = input<boolean>(false);\n\n /* Signal that updates on every successful navigation /\n private readonly navigationEnd = toSignal(\n this.router.events.pipe(\n filter((event) => event instanceof NavigationEnd),\n startWith(null),\n map(() => this.router.routerState.snapshot.root)\n )\n );\n\n /* Computed list of breadcrumbs derived from the current route state /\n routeItems = computed(() => {\n const manualItems = this.items();\n if (manualItems) return manualItems;\n\n const root = this.navigationEnd();\n if (!root) return [];\n\n const breadcrumbs: BreadCrumpItem[] = [];\n this.buildBreadcrumbs(root, '', breadcrumbs);\n return breadcrumbs;\n });\n\n private buildBreadcrumbs(\n route: ActivatedRouteSnapshot,\n url: string = '',\n breadcrumbs: BreadCrumpItem[] = []\n ): void {\n const children: ActivatedRouteSnapshot[] = route.children;\n\n if (children.length === 0) {\n return;\n }\n\n for (const child of children) {\n const routeURL: string = child.url\n .map((segment: UrlSegment) => segment.path)\n .join('/');\n if (routeURL !== '') {\n url += `/${routeURL}`;\n }\n\n const label = child.data['breadcrumb'];\n if (label) {\n breadcrumbs.push({ label, url });\n }\n\n this.buildBreadcrumbs(child, url, breadcrumbs);\n }\n }\n}\n","<nav class=\"tk-breadcrumps\" [class.tk-breadcrumps--size-small]=\"size() === 'small'\" [class.tk-breadcrumps--size-large]=\"size() === 'large'\">\n <ul class=\"tk-breadcrumps__list\">\n @for (item of (onlyCurrent() ? [routeItems()[routeItems().length - 1]] : routeItems()); track $index; let last = $last) {\n @if (item) {\n <li class=\"tk-breadcrumps__item\">\n @if (!last && item.url) {\n <a [routerLink]=\"item.url\" class=\"tk-breadcrumps__link\">\n {{ item.label }}\n </a>\n } @else {\n <span [class.tk-breadcrumps__current]=\"last\">\n {{ item.label }}\n </span>\n }\n\n @if (!last) {\n <span class=\"tk-breadcrumps__separator\">/</span>\n }\n </li>\n }\n }\n </ul>\n</nav>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;MAca,oBAAoB,CAAA;AAPjC,IAAA,WAAA,GAAA;AAQmB,QAAA,IAAA,CAAA,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;;AAGxC,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAA0B,IAAI,4EAAC;;AAG5C,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAoB,OAAO,2EAAC;;AAGxC,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK,CAAU,KAAK,kFAAC;;QAGlB,IAAA,CAAA,aAAa,GAAG,QAAQ,CACvC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CACrB,MAAM,CAAC,CAAC,KAAK,KAAK,KAAK,YAAY,aAAa,CAAC,EACjD,SAAS,CAAC,IAAI,CAAC,EACf,GAAG,CAAC,MAAM,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,CACjD,CACF;;AAGD,QAAA,IAAA,CAAA,UAAU,GAAG,QAAQ,CAAC,MAAK;AACzB,YAAA,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,EAAE;AAChC,YAAA,IAAI,WAAW;AAAE,gBAAA,OAAO,WAAW;AAEnC,YAAA,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,EAAE;AACjC,YAAA,IAAI,CAAC,IAAI;AAAE,gBAAA,OAAO,EAAE;YAEpB,MAAM,WAAW,GAAqB,EAAE;YACxC,IAAI,CAAC,gBAAgB,CAAC,IAAI,EAAE,EAAE,EAAE,WAAW,CAAC;AAC5C,YAAA,OAAO,WAAW;AACpB,QAAA,CAAC,iFAAC;AA6BH,IAAA;AA3BS,IAAA,gBAAgB,CACtB,KAA6B,EAC7B,MAAc,EAAE,EAChB,cAAgC,EAAE,EAAA;AAElC,QAAA,MAAM,QAAQ,GAA6B,KAAK,CAAC,QAAQ;AAEzD,QAAA,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE;YACzB;QACF;AAEA,QAAA,KAAK,MAAM,KAAK,IAAI,QAAQ,EAAE;AAC5B,YAAA,MAAM,QAAQ,GAAW,KAAK,CAAC;iBAC5B,GAAG,CAAC,CAAC,OAAmB,KAAK,OAAO,CAAC,IAAI;iBACzC,IAAI,CAAC,GAAG,CAAC;AACZ,YAAA,IAAI,QAAQ,KAAK,EAAE,EAAE;AACnB,gBAAA,GAAG,IAAI,CAAA,CAAA,EAAI,QAAQ,CAAA,CAAE;YACvB;YAEA,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC;YACtC,IAAI,KAAK,EAAE;gBACT,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC;YAClC;YAEA,IAAI,CAAC,gBAAgB,CAAC,KAAK,EAAE,GAAG,EAAE,WAAW,CAAC;QAChD;IACF~~;8GA5DW~~,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,~~QAAA~~,EAAA,IAAA,EAAA,oBAAoB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,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,QAAA,EAAA,EAAA,EAAA,QAAA,ECdjC,00BAuBA,EAAA,MAAA,EAAA,CAAA,q0CAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDbY,YAAY,8BAAE,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,aAAA,EAAA,UAAA,EAAA,qBAAA,EAAA,OAAA,EAAA,MAAA,EAAA,YAAA,EAAA,kBAAA,EAAA,oBAAA,EAAA,YAAA,EAAA,YAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;~~2FAIzB~~,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAPhC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,iBAAiB,cACf,IAAI,EAAA,OAAA,EACP,CAAC,YAAY,EAAE,YAAY,CAAC,EAAA,QAAA,EAAA,00BAAA,EAAA,MAAA,EAAA,CAAA,q0CAAA,CAAA,EAAA;;;AEVvC;;AAEG;;;;"}
1	+ {"version":3,"file":"tekus-design-system-components-bread-crumps.mjs","sources":["../../../projects/design-system/components/bread-crumps/src/bread-crumps.component.ts","../../../projects/design-system/components/bread-crumps/src/bread-crumps.component.html","../../../projects/design-system/components/bread-crumps/tekus-design-system-components-bread-crumps.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, computed, inject, input } from '@angular/core';\nimport { ActivatedRouteSnapshot, NavigationEnd, Router, RouterModule, UrlSegment } from '@angular/router';\nimport { toSignal } from '@angular/core/rxjs-interop';\nimport { filter, map, startWith } from 'rxjs/operators';\nimport { BreadCrumpItem } from './bread-crumps.types';\n\n@Component({\n selector: 'tk-bread-crumps',\n standalone: true,\n imports: [CommonModule, RouterModule],\n templateUrl: './bread-crumps.component.html',\n styleUrl: './bread-crumps.component.scss',\n})\nexport class BreadCrumpsComponent {\n private readonly router = inject(Router);\n\n /** Optional manual items. If provided, route listening is ignored. /\n items = input<BreadCrumpItem[] \| null>(null);\n\n /* Size of the breadcrumbs title. Can be 'small' (24px) or 'large' (32px). Default is 'large'. /\n size = input<'small' \| 'large'>('large');\n\n /* If true, only the current (last) item will be displayed. /\n onlyCurrent = input<boolean>(false);\n\n /* Signal that updates on every successful navigation /\n private readonly navigationEnd = toSignal(\n this.router.events.pipe(\n filter((event) => event instanceof NavigationEnd),\n startWith(null),\n map(() => this.router.routerState.snapshot.root)\n )\n );\n\n /* Computed list of breadcrumbs derived from the current route state /\n routeItems = computed(() => {\n const manualItems = this.items();\n if (manualItems) return manualItems;\n\n const root = this.navigationEnd();\n if (!root) return [];\n\n const breadcrumbs: BreadCrumpItem[] = [];\n this.buildBreadcrumbs(root, '', breadcrumbs);\n return breadcrumbs;\n });\n\n private buildBreadcrumbs(\n route: ActivatedRouteSnapshot,\n url: string = '',\n breadcrumbs: BreadCrumpItem[] = []\n ): void {\n const children: ActivatedRouteSnapshot[] = route.children;\n\n if (children.length === 0) {\n return;\n }\n\n for (const child of children) {\n const routeURL: string = child.url\n .map((segment: UrlSegment) => segment.path)\n .join('/');\n if (routeURL !== '') {\n url += `/${routeURL}`;\n }\n\n const label = child.data['breadcrumb'];\n if (label) {\n breadcrumbs.push({ label, url });\n }\n\n this.buildBreadcrumbs(child, url, breadcrumbs);\n }\n }\n}\n","<nav class=\"tk-breadcrumps\" [class.tk-breadcrumps--size-small]=\"size() === 'small'\" [class.tk-breadcrumps--size-large]=\"size() === 'large'\">\n <ul class=\"tk-breadcrumps__list\">\n @for (item of (onlyCurrent() ? [routeItems()[routeItems().length - 1]] : routeItems()); track $index; let last = $last) {\n @if (item) {\n <li class=\"tk-breadcrumps__item\">\n @if (!last && item.url) {\n <a [routerLink]=\"item.url\" class=\"tk-breadcrumps__link\">\n {{ item.label }}\n </a>\n } @else {\n <span [class.tk-breadcrumps__current]=\"last\">\n {{ item.label }}\n </span>\n }\n\n @if (!last) {\n <span class=\"tk-breadcrumps__separator\">/</span>\n }\n </li>\n }\n }\n </ul>\n</nav>\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-button.mjs CHANGED Viewed

@@ -149,10 +149,10 @@ class ButtonComponent {
         if (!this.disabled())
             this.clicked.emit('mouse');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: ButtonComponent, isStandalone: true, selector: "tk-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconPosition: { classPropertyName: "iconPosition", publicName: "iconPosition", isSignal: true, isRequired: false, transformFunction: null }, tooltipText: { classPropertyName: "tooltipText", publicName: "tooltipText", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<p-button\n  [styleClass]=\"'tk-button'\"\n  [disabled]=\"disabled()\"\n  [type]=\"type()\"\n  [severity]=\"link() ? undefined : severity()\"\n  [variant]=\"variant()\"\n  [link]=\"link()\"\n  [size]=\"size()\"\n  [pTooltip]=\"tooltipText()\"\n  tooltipPosition=\"top\"\n  (click)=\"onButtonClick()\"\n  (keydown.enter)=\"onButtonClick()\"\n  (keydown.space)=\"onButtonClick()\">\n\n  @if (icon() && iconPosition() === 'left') {\n    <tk-icon [icon]=\"icon()!\"></tk-icon>\n  }\n\n  @if (label()) {\n    <span class=\"p-button-label\">{{ label() }}</span>\n  }\n\n  @if (icon() && iconPosition() === 'right') {\n    <tk-icon [icon]=\"icon()!\"></tk-icon>\n  }\n</p-button>\n", styles: [":host{display:inline-flex;vertical-align:middle}:host ::ng-deep .p-button{min-width:var(--tk-size-base-250, 2.5rem)}:host ::ng-deep .p-button.p-button-sm{min-width:var(--tk-spacing-padding-xl, 1.5rem);height:var(--tk-spacing-padding-xl, 1.5rem);padding:0;display:flex;align-items:center;justify-content:center;line-height:1}:host ::ng-deep .p-button.p-button-sm.p-button-icon-only{width:var(--tk-spacing-padding-xl, 1.5rem)}:host ::ng-deep .p-button.p-button-sm ::ng-deep tk-icon{display:flex;align-items:center;justify-content:center}:host ::ng-deep .p-button.p-button-sm ::ng-deep tk-icon svg{width:1rem;height:1rem}:host ::ng-deep .p-button{display:inline-flex;align-items:center;gap:var(--tk-spacing-padding-xs, .5rem)}:host ::ng-deep .p-button tk-icon{display:flex}:host ::ng-deep .p-button.p-button-primary .p-button-label,:host ::ng-deep .p-button.p-button-danger .p-button-label{color:var(--tk-color-base-surface-0, #ffffff)!important}:host ::ng-deep .p-button.p-button-link .p-button-label{color:var(--tk-color-base-primary-500, #16006f)!important}:host ::ng-deep .p-button.p-button-link:hover .p-button-label{color:var(--tk-color-base-primary-400, #45338c)!important}:host ::ng-deep .p-button.p-button-secondary .p-button-label{color:var(--tk-color-base-surface-900, #191A1B)!important}:host ::ng-deep .p-button.p-button-secondary.p-button-outlined .p-button-label{color:var(--tk-color-base-surface-500, #8a8a8b)!important}:host ::ng-deep .p-button.p-button-secondary .p-button-label,:host ::ng-deep .p-button.p-button-danger .p-button-label{font-weight:var(--tk-font-weight-400, 400)}:host ::ng-deep .p-button-label{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: IconComponent, selector: "tk-icon", inputs: ["icon", "styleIcon", "color", "size", "disabled"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: ButtonComponent, isStandalone: true, selector: "tk-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconPosition: { classPropertyName: "iconPosition", publicName: "iconPosition", isSignal: true, isRequired: false, transformFunction: null }, tooltipText: { classPropertyName: "tooltipText", publicName: "tooltipText", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<p-button\n  [styleClass]=\"'tk-button'\"\n  [disabled]=\"disabled()\"\n  [type]=\"type()\"\n  [severity]=\"link() ? undefined : severity()\"\n  [variant]=\"variant()\"\n  [link]=\"link()\"\n  [size]=\"size()\"\n  [pTooltip]=\"tooltipText()\"\n  tooltipPosition=\"top\"\n  (click)=\"onButtonClick()\"\n  (keydown.enter)=\"onButtonClick()\"\n  (keydown.space)=\"onButtonClick()\">\n\n  @if (icon() && iconPosition() === 'left') {\n    <tk-icon [icon]=\"icon()!\"></tk-icon>\n  }\n\n  @if (label()) {\n    <span class=\"p-button-label\">{{ label() }}</span>\n  }\n\n  @if (icon() && iconPosition() === 'right') {\n    <tk-icon [icon]=\"icon()!\"></tk-icon>\n  }\n</p-button>\n", styles: [":host{display:inline-flex;vertical-align:middle}:host ::ng-deep .p-button{min-width:var(--tk-size-base-250, 2.5rem)}:host ::ng-deep .p-button.p-button-sm{min-width:var(--tk-spacing-padding-xl, 1.5rem);height:var(--tk-spacing-padding-xl, 1.5rem);padding:0;display:flex;align-items:center;justify-content:center;line-height:1}:host ::ng-deep .p-button.p-button-sm.p-button-icon-only{width:var(--tk-spacing-padding-xl, 1.5rem)}:host ::ng-deep .p-button.p-button-sm ::ng-deep tk-icon{display:flex;align-items:center;justify-content:center}:host ::ng-deep .p-button.p-button-sm ::ng-deep tk-icon svg{width:1rem;height:1rem}:host ::ng-deep .p-button{display:inline-flex;align-items:center;gap:var(--tk-spacing-padding-xs, .5rem)}:host ::ng-deep .p-button tk-icon{display:flex}:host ::ng-deep .p-button.p-button-primary .p-button-label,:host ::ng-deep .p-button.p-button-danger .p-button-label{color:var(--tk-color-base-surface-0, #ffffff)!important}:host ::ng-deep .p-button.p-button-link .p-button-label{color:var(--tk-color-base-primary-500, #16006f)!important}:host ::ng-deep .p-button.p-button-link:hover .p-button-label{color:var(--tk-color-base-primary-400, #45338c)!important}:host ::ng-deep .p-button.p-button-secondary .p-button-label{color:var(--tk-color-base-surface-900, #191A1B)!important}:host ::ng-deep .p-button.p-button-secondary.p-button-outlined .p-button-label{color:var(--tk-color-base-surface-500, #8a8a8b)!important}:host ::ng-deep .p-button.p-button-secondary .p-button-label,:host ::ng-deep .p-button.p-button-danger .p-button-label{font-weight:var(--tk-font-weight-400, 400)}:host ::ng-deep .p-button-label{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: IconComponent, selector: "tk-icon", inputs: ["icon", "styleIcon", "color", "size", "disabled"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: ButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: ButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tk-button', imports: [ButtonModule, IconComponent, Tooltip], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-button\n  [styleClass]=\"'tk-button'\"\n  [disabled]=\"disabled()\"\n  [type]=\"type()\"\n  [severity]=\"link() ? undefined : severity()\"\n  [variant]=\"variant()\"\n  [link]=\"link()\"\n  [size]=\"size()\"\n  [pTooltip]=\"tooltipText()\"\n  tooltipPosition=\"top\"\n  (click)=\"onButtonClick()\"\n  (keydown.enter)=\"onButtonClick()\"\n  (keydown.space)=\"onButtonClick()\">\n\n  @if (icon() && iconPosition() === 'left') {\n    <tk-icon [icon]=\"icon()!\"></tk-icon>\n  }\n\n  @if (label()) {\n    <span class=\"p-button-label\">{{ label() }}</span>\n  }\n\n  @if (icon() && iconPosition() === 'right') {\n    <tk-icon [icon]=\"icon()!\"></tk-icon>\n  }\n</p-button>\n", styles: [":host{display:inline-flex;vertical-align:middle}:host ::ng-deep .p-button{min-width:var(--tk-size-base-250, 2.5rem)}:host ::ng-deep .p-button.p-button-sm{min-width:var(--tk-spacing-padding-xl, 1.5rem);height:var(--tk-spacing-padding-xl, 1.5rem);padding:0;display:flex;align-items:center;justify-content:center;line-height:1}:host ::ng-deep .p-button.p-button-sm.p-button-icon-only{width:var(--tk-spacing-padding-xl, 1.5rem)}:host ::ng-deep .p-button.p-button-sm ::ng-deep tk-icon{display:flex;align-items:center;justify-content:center}:host ::ng-deep .p-button.p-button-sm ::ng-deep tk-icon svg{width:1rem;height:1rem}:host ::ng-deep .p-button{display:inline-flex;align-items:center;gap:var(--tk-spacing-padding-xs, .5rem)}:host ::ng-deep .p-button tk-icon{display:flex}:host ::ng-deep .p-button.p-button-primary .p-button-label,:host ::ng-deep .p-button.p-button-danger .p-button-label{color:var(--tk-color-base-surface-0, #ffffff)!important}:host ::ng-deep .p-button.p-button-link .p-button-label{color:var(--tk-color-base-primary-500, #16006f)!important}:host ::ng-deep .p-button.p-button-link:hover .p-button-label{color:var(--tk-color-base-primary-400, #45338c)!important}:host ::ng-deep .p-button.p-button-secondary .p-button-label{color:var(--tk-color-base-surface-900, #191A1B)!important}:host ::ng-deep .p-button.p-button-secondary.p-button-outlined .p-button-label{color:var(--tk-color-base-surface-500, #8a8a8b)!important}:host ::ng-deep .p-button.p-button-secondary .p-button-label,:host ::ng-deep .p-button.p-button-danger .p-button-label{font-weight:var(--tk-font-weight-400, 400)}:host ::ng-deep .p-button-label{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
         }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], severity: [{ type: i0.Input, args: [{ isSignal: true, alias: "severity", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], link: [{ type: i0.Input, args: [{ isSignal: true, alias: "link", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconPosition", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }], tooltipText: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltipText", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });

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

	@@ -1 +1 @@
1	- {"version":3,"file":"tekus-design-system-components-button.mjs","sources":["../../../projects/design-system/components/button/src/button.component.ts","../../../projects/design-system/components/button/src/button.component.html","../../../projects/design-system/components/button/tekus-design-system-components-button.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input, output } from '@angular/core';\nimport { ButtonModule } from 'primeng/button';\nimport { IconComponent } from '@tekus/design-system/components/icon';\nimport { Tooltip } from 'primeng/tooltip';\n\n\nexport type ButtonSeverity = 'primary' \| 'secondary' \| 'danger';\nexport type Variant = 'text' \| 'outlined';\n/*\n @component ButtonComponent\n * @description\n * Atomic button component that provides a reusable and customizable button element\n * across the application.\n * It uses PrimeNG's `ButtonModule` under the hood and allows setting different visual\n * variants (severity), button types, and disabled states.\n \n This component ensures consistent design and behavior in all button interactions.\n * It is accessible via both mouse clicks and keyboard actions (Enter/Space).\n \n @usage\n * ```html\n * <tk-button\n * label=\"Save\"\n * [severity]=\"'primary'\"\n * [type]=\"'submit'\"\n * (clicked)=\"handleSave()\">\n * </tk-button>\n \n <tk-button\n * label=\"Cancel\"\n * [severity]=\"'secondary'\"\n * [disabled]=\"true\">\n * </tk-button>\n * ```\n /\n@Component({\n selector: 'tk-button',\n imports: [ButtonModule, IconComponent, Tooltip],\n templateUrl: './button.component.html',\n styleUrl: './button.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ButtonComponent {\n /\n @property {string} label\n * @description\n * Text displayed inside the button.\n \n @default `undefined`\n /\n label = input<string>();\n\n /\n @property {boolean} disabled\n * @description\n * Disables the button, preventing user interaction and applying a visual style\n * that indicates the inactive state.\n \n @default `false`\n /\n disabled = input<boolean>(false);\n\n /\n @property {'button' \| 'submit'} type\n * @description\n * Defines the button's HTML type attribute.\n * - `'button'`: Standard clickable button (default).\n * - `'submit'`: Used to submit forms.\n \n @default `'button'`\n /\n type = input<'button' \| 'submit'>('button');\n\n /\n @property {ButtonSeverity} severity\n * @description\n * Defines the visual importance or style of the button.\n * - `'primary'`: Default, neutral action.\n * - `'secondary'`: Secondary option.\n * - `'danger'`: Destructive or warning actions.\n \n @default `'primary'`\n /\n severity = input<ButtonSeverity>('primary');\n\n /\n @property {'text' \| 'outlined'} variant\n * @description\n * Defines the variant of the button.\n * - `'text'`: Text-only button.\n * - `'outlined'`: Outlined button.\n \n @default `undefined`\n /\n variant = input<Variant>();\n\n /\n @property {boolean} link\n * @description\n * When true, the button will be styled as a link (text only with underline).\n \n @default false\n /\n link = input<boolean>(false);\n\n /\n @property {string} icon\n * @description\n * - If `label` is provided, the icon is displayed to the left.\n * - If `label` is empty, the button is rendered as an icon-only button.\n \n @default `undefined`\n /\n icon = input<string>();\n\n /\n @property {'left' \| 'right'} iconPosition\n * @description\n * Defines the position of the icon relative to the label.\n \n @default `'left'`\n /\n iconPosition = input<'left' \| 'right'>('left');\n\n /\n @event clicked\n * @description\n * Emits when the button is activated via click or keyboard (Enter/Space),\n * unless the button is disabled.\n \n @example\n * ```html\n * <tk-button label=\"Click me\" (clicked)=\"handleClick()\"></tk-button>\n * ```\n /\n clicked = output<'mouse' \| 'keyboard'>();\n\n /\n @property {string} tooltipText\n * @description\n * Tooltip text to be displayed when the user hovers over the button.\n \n @default `undefined`\n /\n tooltipText = input<string>();\n\n /\n @property {'small' \| 'large' \| undefined} size\n * @description\n * Defines the size of the button.\n * - `'small'`: Small button.\n * - `'large'`: Large button.\n * - `undefined`: Default size.\n \n @default `undefined`\n /\n size = input<'small' \| 'large' \| undefined>();\n\n /\n @method onButtonClick\n * @description\n * Handles the native click event. Emits the `clicked` event if the button\n * is not disabled.\n /\n onButtonClick(): void {\n if (!this.disabled()) this.clicked.emit('mouse');\n }\n}\n","<p-button\n [styleClass]=\"'tk-button'\"\n [disabled]=\"disabled()\"\n [type]=\"type()\"\n [severity]=\"link() ? undefined : severity()\"\n [variant]=\"variant()\"\n [link]=\"link()\"\n [size]=\"size()\"\n [pTooltip]=\"tooltipText()\"\n tooltipPosition=\"top\"\n (click)=\"onButtonClick()\"\n (keydown.enter)=\"onButtonClick()\"\n (keydown.space)=\"onButtonClick()\">\n\n @if (icon() && iconPosition() === 'left') {\n <tk-icon [icon]=\"icon()!\"></tk-icon>\n }\n\n @if (label()) {\n <span class=\"p-button-label\">{{ label() }}</span>\n }\n\n @if (icon() && iconPosition() === 'right') {\n <tk-icon [icon]=\"icon()!\"></tk-icon>\n }\n</p-button>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;AAQA;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BG;MAQU,eAAe,CAAA;AAP5B,IAAA,WAAA,GAAA;AAQE;;;;;;AAMG;QACH,IAAA,CAAA,KAAK,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,OAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAU;AAEvB;;;;;;;AAOG;AACH,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAU,KAAK,+EAAC;AAEhC;;;;;;;;AAQG;AACH,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAsB,QAAQ,2EAAC;AAE3C;;;;;;;;;AASG;AACH,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAiB,SAAS,+EAAC;AAE3C;;;;;;;;AAQG;QACH,IAAA,CAAA,OAAO,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,SAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAW;AAE1B;;;;;;AAMG;AACH,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAU,KAAK,2EAAC;AAE5B;;;;;;;AAOG;QACH,IAAA,CAAA,IAAI,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAU;AAEtB;;;;;;AAMG;AACH,QAAA,IAAA,CAAA,YAAY,GAAG,KAAK,CAAmB,MAAM,mFAAC;AAE9C;;;;;;;;;;AAUG;QACH,IAAA,CAAA,OAAO,GAAG,MAAM,EAAwB;AAExC;;;;;;AAMG;QACH,IAAA,CAAA,WAAW,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,aAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAU;AAE7B;;;;;;;;;AASG;QACH,IAAA,CAAA,IAAI,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAiC;AAW9C,IAAA;AATC;;;;;AAKG;IACH,aAAa,GAAA;AACX,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAAE,YAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC;IAClD~~;8GA5HW~~,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAf,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,~~QAAA~~,EAAA,IAAA,EAAA,eAAe,q1CC1C5B,oqBA0BA,EAAA,MAAA,EAAA,CAAA,6rDAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDWY,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,MAAA,EAAA,OAAA,EAAA,UAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,OAAA,EAAA,UAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,SAAA,EAAA,OAAA,EAAA,YAAA,EAAA,YAAA,EAAA,eAAA,EAAA,WAAA,EAAA,WAAA,EAAA,SAAA,EAAA,MAAA,EAAA,OAAA,EAAA,SAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,OAAA,CAAA,EAAA,OAAA,EAAA,CAAA,SAAA,EAAA,SAAA,EAAA,QAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,aAAa,gHAAE,OAAO,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,iBAAA,EAAA,cAAA,EAAA,eAAA,EAAA,mBAAA,EAAA,eAAA,EAAA,QAAA,EAAA,WAAA,EAAA,WAAA,EAAA,MAAA,EAAA,aAAA,EAAA,cAAA,EAAA,UAAA,EAAA,YAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,WAAA,EAAA,YAAA,EAAA,kBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;~~2FAKnC~~,eAAe,EAAA,UAAA,EAAA,CAAA;kBAP3B,SAAS;+BACE,WAAW,EAAA,OAAA,EACZ,CAAC,YAAY,EAAE,aAAa,EAAE,OAAO,CAAC,EAAA,eAAA,EAG9B,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,oqBAAA,EAAA,MAAA,EAAA,CAAA,6rDAAA,CAAA,EAAA;;;AExCjD;;AAEG;;;;"}
1	+ {"version":3,"file":"tekus-design-system-components-button.mjs","sources":["../../../projects/design-system/components/button/src/button.component.ts","../../../projects/design-system/components/button/src/button.component.html","../../../projects/design-system/components/button/tekus-design-system-components-button.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input, output } from '@angular/core';\nimport { ButtonModule } from 'primeng/button';\nimport { IconComponent } from '@tekus/design-system/components/icon';\nimport { Tooltip } from 'primeng/tooltip';\n\n\nexport type ButtonSeverity = 'primary' \| 'secondary' \| 'danger';\nexport type Variant = 'text' \| 'outlined';\n/*\n @component ButtonComponent\n * @description\n * Atomic button component that provides a reusable and customizable button element\n * across the application.\n * It uses PrimeNG's `ButtonModule` under the hood and allows setting different visual\n * variants (severity), button types, and disabled states.\n \n This component ensures consistent design and behavior in all button interactions.\n * It is accessible via both mouse clicks and keyboard actions (Enter/Space).\n \n @usage\n * ```html\n * <tk-button\n * label=\"Save\"\n * [severity]=\"'primary'\"\n * [type]=\"'submit'\"\n * (clicked)=\"handleSave()\">\n * </tk-button>\n \n <tk-button\n * label=\"Cancel\"\n * [severity]=\"'secondary'\"\n * [disabled]=\"true\">\n * </tk-button>\n * ```\n /\n@Component({\n selector: 'tk-button',\n imports: [ButtonModule, IconComponent, Tooltip],\n templateUrl: './button.component.html',\n styleUrl: './button.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ButtonComponent {\n /\n @property {string} label\n * @description\n * Text displayed inside the button.\n \n @default `undefined`\n /\n label = input<string>();\n\n /\n @property {boolean} disabled\n * @description\n * Disables the button, preventing user interaction and applying a visual style\n * that indicates the inactive state.\n \n @default `false`\n /\n disabled = input<boolean>(false);\n\n /\n @property {'button' \| 'submit'} type\n * @description\n * Defines the button's HTML type attribute.\n * - `'button'`: Standard clickable button (default).\n * - `'submit'`: Used to submit forms.\n \n @default `'button'`\n /\n type = input<'button' \| 'submit'>('button');\n\n /\n @property {ButtonSeverity} severity\n * @description\n * Defines the visual importance or style of the button.\n * - `'primary'`: Default, neutral action.\n * - `'secondary'`: Secondary option.\n * - `'danger'`: Destructive or warning actions.\n \n @default `'primary'`\n /\n severity = input<ButtonSeverity>('primary');\n\n /\n @property {'text' \| 'outlined'} variant\n * @description\n * Defines the variant of the button.\n * - `'text'`: Text-only button.\n * - `'outlined'`: Outlined button.\n \n @default `undefined`\n /\n variant = input<Variant>();\n\n /\n @property {boolean} link\n * @description\n * When true, the button will be styled as a link (text only with underline).\n \n @default false\n /\n link = input<boolean>(false);\n\n /\n @property {string} icon\n * @description\n * - If `label` is provided, the icon is displayed to the left.\n * - If `label` is empty, the button is rendered as an icon-only button.\n \n @default `undefined`\n /\n icon = input<string>();\n\n /\n @property {'left' \| 'right'} iconPosition\n * @description\n * Defines the position of the icon relative to the label.\n \n @default `'left'`\n /\n iconPosition = input<'left' \| 'right'>('left');\n\n /\n @event clicked\n * @description\n * Emits when the button is activated via click or keyboard (Enter/Space),\n * unless the button is disabled.\n \n @example\n * ```html\n * <tk-button label=\"Click me\" (clicked)=\"handleClick()\"></tk-button>\n * ```\n /\n clicked = output<'mouse' \| 'keyboard'>();\n\n /\n @property {string} tooltipText\n * @description\n * Tooltip text to be displayed when the user hovers over the button.\n \n @default `undefined`\n /\n tooltipText = input<string>();\n\n /\n @property {'small' \| 'large' \| undefined} size\n * @description\n * Defines the size of the button.\n * - `'small'`: Small button.\n * - `'large'`: Large button.\n * - `undefined`: Default size.\n \n @default `undefined`\n /\n size = input<'small' \| 'large' \| undefined>();\n\n /\n @method onButtonClick\n * @description\n * Handles the native click event. Emits the `clicked` event if the button\n * is not disabled.\n /\n onButtonClick(): void {\n if (!this.disabled()) this.clicked.emit('mouse');\n }\n}\n","<p-button\n [styleClass]=\"'tk-button'\"\n [disabled]=\"disabled()\"\n [type]=\"type()\"\n [severity]=\"link() ? undefined : severity()\"\n [variant]=\"variant()\"\n [link]=\"link()\"\n [size]=\"size()\"\n [pTooltip]=\"tooltipText()\"\n tooltipPosition=\"top\"\n (click)=\"onButtonClick()\"\n (keydown.enter)=\"onButtonClick()\"\n (keydown.space)=\"onButtonClick()\">\n\n @if (icon() && iconPosition() === 'left') {\n <tk-icon [icon]=\"icon()!\"></tk-icon>\n }\n\n @if (label()) {\n <span class=\"p-button-label\">{{ label() }}</span>\n }\n\n @if (icon() && iconPosition() === 'right') {\n <tk-icon [icon]=\"icon()!\"></tk-icon>\n }\n</p-button>\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-card-list.mjs CHANGED Viewed

@@ -45,10 +45,10 @@ class CardListComponent {
             this.selectedIds.set(current.filter(item => item !== id));
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: CardListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: CardListComponent, isStandalone: true, selector: "tk-card-list", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selectedIds: { classPropertyName: "selectedIds", publicName: "selectedIds", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedIds: "selectedIdsChange" }, ngImport: i0, template: "<div class=\"tk-card-list-grid\">\n  @for (item of items(); track item.id) {\n    <div class=\"tk-card-list-item\">\n      <tk-card\n        [title]=\"item.title\"\n        [titleIcon]=\"item.titleIcon!\"\n        [description]=\"item.description!\"\n        [image]=\"item.image!\"\n        [badgeText]=\"item.badgeText!\"\n        [secondaryBadgeText]=\"item.secondaryBadgeText!\"\n        [actions]=\"item.actions || []\"\n        [infoElements]=\"item.infoElements || []\"\n        [selectable]=\"item.selectable ?? selectable()\"\n        [selected]=\"isCardSelected(item)\"\n        (selectedChange)=\"onItemSelected(item.id, $event)\">\n      </tk-card>\n    </div>\n  }\n</div>\n", styles: [".tk-card-list-grid{display:grid;gap:var(--tk-spacing-base-150);width:100%;grid-template-columns:repeat(1,1fr)}@media screen and (min-width:768px){.tk-card-list-grid{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width:1024px){.tk-card-list-grid{grid-template-columns:repeat(4,1fr)}}@media screen and (min-width:1440px){.tk-card-list-grid{grid-template-columns:repeat(5,1fr)}}.tk-card-list-grid .tk-card-list-item{display:flex;flex-direction:column;height:100%}.tk-card-list-grid .tk-card-list-item tk-card{display:block;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CardComponent, selector: "tk-card", inputs: ["title", "titleLink", "titleHref", "titleIcon", "description", "image", "showImage", "layout", "selectable", "selected", "badgeText", "secondaryBadgeText", "connectionStatusDate", "connectionStatusSeverity", "actions", "actionGroup", "actionGroupMaxVisible", "actionGroupDisabled", "infoElements"], outputs: ["selectedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: CardListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: CardListComponent, isStandalone: true, selector: "tk-card-list", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selectedIds: { classPropertyName: "selectedIds", publicName: "selectedIds", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedIds: "selectedIdsChange" }, ngImport: i0, template: "<div class=\"tk-card-list-grid\">\n  @for (item of items(); track item.id) {\n    <div class=\"tk-card-list-item\">\n      <tk-card\n        [title]=\"item.title\"\n        [titleIcon]=\"item.titleIcon!\"\n        [description]=\"item.description!\"\n        [image]=\"item.image!\"\n        [badgeText]=\"item.badgeText!\"\n        [secondaryBadgeText]=\"item.secondaryBadgeText!\"\n        [actions]=\"item.actions || []\"\n        [infoElements]=\"item.infoElements || []\"\n        [selectable]=\"item.selectable ?? selectable()\"\n        [selected]=\"isCardSelected(item)\"\n        (selectedChange)=\"onItemSelected(item.id, $event)\">\n      </tk-card>\n    </div>\n  }\n</div>\n", styles: [".tk-card-list-grid{display:grid;gap:var(--tk-spacing-base-150);width:100%;grid-template-columns:repeat(1,1fr)}@media screen and (min-width:768px){.tk-card-list-grid{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width:1024px){.tk-card-list-grid{grid-template-columns:repeat(4,1fr)}}@media screen and (min-width:1440px){.tk-card-list-grid{grid-template-columns:repeat(5,1fr)}}.tk-card-list-grid .tk-card-list-item{display:flex;flex-direction:column;height:100%}.tk-card-list-grid .tk-card-list-item tk-card{display:block;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CardComponent, selector: "tk-card", inputs: ["title", "titleLink", "titleHref", "titleIcon", "description", "image", "showImage", "layout", "selectable", "selected", "badgeText", "secondaryBadgeText", "connectionStatusDate", "connectionStatusSeverity", "actions", "actionGroup", "actionGroupMaxVisible", "actionGroupDisabled", "infoElements"], outputs: ["selectedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: CardListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: CardListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tk-card-list', standalone: true, imports: [CommonModule, CardComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"tk-card-list-grid\">\n  @for (item of items(); track item.id) {\n    <div class=\"tk-card-list-item\">\n      <tk-card\n        [title]=\"item.title\"\n        [titleIcon]=\"item.titleIcon!\"\n        [description]=\"item.description!\"\n        [image]=\"item.image!\"\n        [badgeText]=\"item.badgeText!\"\n        [secondaryBadgeText]=\"item.secondaryBadgeText!\"\n        [actions]=\"item.actions || []\"\n        [infoElements]=\"item.infoElements || []\"\n        [selectable]=\"item.selectable ?? selectable()\"\n        [selected]=\"isCardSelected(item)\"\n        (selectedChange)=\"onItemSelected(item.id, $event)\">\n      </tk-card>\n    </div>\n  }\n</div>\n", styles: [".tk-card-list-grid{display:grid;gap:var(--tk-spacing-base-150);width:100%;grid-template-columns:repeat(1,1fr)}@media screen and (min-width:768px){.tk-card-list-grid{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width:1024px){.tk-card-list-grid{grid-template-columns:repeat(4,1fr)}}@media screen and (min-width:1440px){.tk-card-list-grid{grid-template-columns:repeat(5,1fr)}}.tk-card-list-grid .tk-card-list-item{display:flex;flex-direction:column;height:100%}.tk-card-list-grid .tk-card-list-item tk-card{display:block;height:100%}\n"] }]
         }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], selectedIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedIds", required: false }] }, { type: i0.Output, args: ["selectedIdsChange"] }] } });

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

	@@ -1 +1 @@
1	- {"version":3,"file":"tekus-design-system-components-card-list.mjs","sources":["../../../projects/design-system/components/card-list/src/card-list.component.ts","../../../projects/design-system/components/card-list/src/card-list.component.html","../../../projects/design-system/components/card-list/tekus-design-system-components-card-list.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input, model } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { CardComponent } from '@tekus/design-system/components/card';\nimport { TkCardListItem } from './card-list.types';\n\n/*\n @component CardListComponent\n * @description\n * High-level component used to display a grid of cards with responsive behavioral breakpoints.\n * Supports individual item selection and consistent spacing.\n /\n@Component({\n selector: 'tk-card-list',\n standalone: true,\n imports: [CommonModule, CardComponent],\n templateUrl: './card-list.component.html',\n styleUrl: './card-list.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CardListComponent {\n /* The list of items to display in the grid. Required. /\n items = input.required<TkCardListItem[]>();\n\n /* Whether the list supports global item selection (checkboxes). /\n selectable = input<boolean>(false);\n\n /* Two-way signal for the current selection of item IDs. /\n selectedIds = model<string[]>([]);\n\n /\n Helper method to determine if an individual item is currently selected.\n /\n isItemSelected(id: string): boolean {\n return this.selectedIds().includes(id);\n }\n\n /\n Helper method to determine if a card should be marked as selected in the template.\n * Only returns true if the item is explicitly selectable and its ID is in the selected list.\n /\n isCardSelected(item: TkCardListItem): boolean {\n const isSelectable = item.selectable ?? this.selectable();\n return isSelectable ? this.isItemSelected(item.id) : false;\n }\n\n /\n Handler for individual card selection change events.\n * Updates the global selectedIds model accordingly.\n /\n onItemSelected(id: string, selected: boolean): void {\n const current = this.selectedIds();\n if (selected && !current.includes(id)) {\n this.selectedIds.set([...current, id]);\n } else if (!selected && current.includes(id)) {\n this.selectedIds.set(current.filter(item => item !== id));\n }\n }\n}\n","<div class=\"tk-card-list-grid\">\n @for (item of items(); track item.id) {\n <div class=\"tk-card-list-item\">\n <tk-card\n [title]=\"item.title\"\n [titleIcon]=\"item.titleIcon!\"\n [description]=\"item.description!\"\n [image]=\"item.image!\"\n [badgeText]=\"item.badgeText!\"\n [secondaryBadgeText]=\"item.secondaryBadgeText!\"\n [actions]=\"item.actions \|\| []\"\n [infoElements]=\"item.infoElements \|\| []\"\n [selectable]=\"item.selectable ?? selectable()\"\n [selected]=\"isCardSelected(item)\"\n (selectedChange)=\"onItemSelected(item.id, $event)\">\n </tk-card>\n </div>\n }\n</div>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;AAKA;;;;;AAKG;MASU,iBAAiB,CAAA;AAR9B,IAAA,WAAA,GAAA;;AAUE,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,2EAAoB;;AAG1C,QAAA,IAAA,CAAA,UAAU,GAAG,KAAK,CAAU,KAAK,iFAAC;;AAGlC,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK,CAAW,EAAE,kFAAC;AA8BlC,IAAA;AA5BC;;AAEG;AACH,IAAA,cAAc,CAAC,EAAU,EAAA;QACvB,OAAO,IAAI,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC;IACxC;AAEA;;;AAGG;AACH,IAAA,cAAc,CAAC,IAAoB,EAAA;QACjC,MAAM,YAAY,GAAG,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,EAAE;AACzD,QAAA,OAAO,YAAY,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,GAAG,KAAK;IAC5D;AAEA;;;AAGG;IACH,cAAc,CAAC,EAAU,EAAE,QAAiB,EAAA;AAC1C,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,EAAE;QAClC,IAAI,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE;AACrC,YAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,GAAG,OAAO,EAAE,EAAE,CAAC,CAAC;QACxC;aAAO,IAAI,CAAC,QAAQ,IAAI,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE;AAC5C,YAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,IAAI,IAAI,KAAK,EAAE,CAAC,CAAC;QAC3D;IACF~~;8GArCW~~,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,~~QAAA~~,EAAA,IAAA,EAAA,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,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,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnB9B,irBAmBA,EAAA,MAAA,EAAA,CAAA,qiBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDLY,YAAY,+BAAE,aAAa,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,OAAA,EAAA,WAAA,EAAA,QAAA,EAAA,YAAA,EAAA,UAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,sBAAA,EAAA,0BAAA,EAAA,SAAA,EAAA,aAAA,EAAA,uBAAA,EAAA,qBAAA,EAAA,cAAA,CAAA,EAAA,OAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;~~2FAK1B~~,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAR7B,SAAS;+BACE,cAAc,EAAA,UAAA,EACZ,IAAI,EAAA,OAAA,EACP,CAAC,YAAY,EAAE,aAAa,CAAC,EAAA,eAAA,EAGrB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,irBAAA,EAAA,MAAA,EAAA,CAAA,qiBAAA,CAAA,EAAA;;;AEjBjD;;AAEG;;;;"}
1	+ {"version":3,"file":"tekus-design-system-components-card-list.mjs","sources":["../../../projects/design-system/components/card-list/src/card-list.component.ts","../../../projects/design-system/components/card-list/src/card-list.component.html","../../../projects/design-system/components/card-list/tekus-design-system-components-card-list.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input, model } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { CardComponent } from '@tekus/design-system/components/card';\nimport { TkCardListItem } from './card-list.types';\n\n/*\n @component CardListComponent\n * @description\n * High-level component used to display a grid of cards with responsive behavioral breakpoints.\n * Supports individual item selection and consistent spacing.\n /\n@Component({\n selector: 'tk-card-list',\n standalone: true,\n imports: [CommonModule, CardComponent],\n templateUrl: './card-list.component.html',\n styleUrl: './card-list.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CardListComponent {\n /* The list of items to display in the grid. Required. /\n items = input.required<TkCardListItem[]>();\n\n /* Whether the list supports global item selection (checkboxes). /\n selectable = input<boolean>(false);\n\n /* Two-way signal for the current selection of item IDs. /\n selectedIds = model<string[]>([]);\n\n /\n Helper method to determine if an individual item is currently selected.\n /\n isItemSelected(id: string): boolean {\n return this.selectedIds().includes(id);\n }\n\n /\n Helper method to determine if a card should be marked as selected in the template.\n * Only returns true if the item is explicitly selectable and its ID is in the selected list.\n /\n isCardSelected(item: TkCardListItem): boolean {\n const isSelectable = item.selectable ?? this.selectable();\n return isSelectable ? this.isItemSelected(item.id) : false;\n }\n\n /\n Handler for individual card selection change events.\n * Updates the global selectedIds model accordingly.\n /\n onItemSelected(id: string, selected: boolean): void {\n const current = this.selectedIds();\n if (selected && !current.includes(id)) {\n this.selectedIds.set([...current, id]);\n } else if (!selected && current.includes(id)) {\n this.selectedIds.set(current.filter(item => item !== id));\n }\n }\n}\n","<div class=\"tk-card-list-grid\">\n @for (item of items(); track item.id) {\n <div class=\"tk-card-list-item\">\n <tk-card\n [title]=\"item.title\"\n [titleIcon]=\"item.titleIcon!\"\n [description]=\"item.description!\"\n [image]=\"item.image!\"\n [badgeText]=\"item.badgeText!\"\n [secondaryBadgeText]=\"item.secondaryBadgeText!\"\n [actions]=\"item.actions \|\| []\"\n [infoElements]=\"item.infoElements \|\| []\"\n [selectable]=\"item.selectable ?? selectable()\"\n [selected]=\"isCardSelected(item)\"\n (selectedChange)=\"onItemSelected(item.id, $event)\">\n </tk-card>\n </div>\n }\n</div>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;AAKA;;;;;AAKG;MASU,iBAAiB,CAAA;AAR9B,IAAA,WAAA,GAAA;;AAUE,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,2EAAoB;;AAG1C,QAAA,IAAA,CAAA,UAAU,GAAG,KAAK,CAAU,KAAK,iFAAC;;AAGlC,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK,CAAW,EAAE,kFAAC;AA8BlC,IAAA;AA5BC;;AAEG;AACH,IAAA,cAAc,CAAC,EAAU,EAAA;QACvB,OAAO,IAAI,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC;IACxC;AAEA;;;AAGG;AACH,IAAA,cAAc,CAAC,IAAoB,EAAA;QACjC,MAAM,YAAY,GAAG,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,EAAE;AACzD,QAAA,OAAO,YAAY,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,GAAG,KAAK;IAC5D;AAEA;;;AAGG;IACH,cAAc,CAAC,EAAU,EAAE,QAAiB,EAAA;AAC1C,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,EAAE;QAClC,IAAI,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE;AACrC,YAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,GAAG,OAAO,EAAE,EAAE,CAAC,CAAC;QACxC;aAAO,IAAI,CAAC,QAAQ,IAAI,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE;AAC5C,YAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,IAAI,IAAI,KAAK,EAAE,CAAC,CAAC;QAC3D;IACF;+GArCW,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,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,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnB9B,irBAmBA,EAAA,MAAA,EAAA,CAAA,qiBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDLY,YAAY,+BAAE,aAAa,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,OAAA,EAAA,WAAA,EAAA,QAAA,EAAA,YAAA,EAAA,UAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,sBAAA,EAAA,0BAAA,EAAA,SAAA,EAAA,aAAA,EAAA,uBAAA,EAAA,qBAAA,EAAA,cAAA,CAAA,EAAA,OAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAK1B,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAR7B,SAAS;+BACE,cAAc,EAAA,UAAA,EACZ,IAAI,EAAA,OAAA,EACP,CAAC,YAAY,EAAE,aAAa,CAAC,EAAA,eAAA,EAGrB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,irBAAA,EAAA,MAAA,EAAA,CAAA,qiBAAA,CAAA,EAAA;;;AEjBjD;;AAEG;;;;"}

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

@@ -118,10 +118,10 @@ class CardComponent {
             return 'secondary';
         return 'primary';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: CardComponent, isStandalone: true, selector: "tk-card", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, titleLink: { classPropertyName: "titleLink", publicName: "titleLink", isSignal: true, isRequired: false, transformFunction: null }, titleHref: { classPropertyName: "titleHref", publicName: "titleHref", isSignal: true, isRequired: false, transformFunction: null }, titleIcon: { classPropertyName: "titleIcon", publicName: "titleIcon", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, showImage: { classPropertyName: "showImage", publicName: "showImage", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, badgeText: { classPropertyName: "badgeText", publicName: "badgeText", isSignal: true, isRequired: false, transformFunction: null }, secondaryBadgeText: { classPropertyName: "secondaryBadgeText", publicName: "secondaryBadgeText", isSignal: true, isRequired: false, transformFunction: null }, connectionStatusDate: { classPropertyName: "connectionStatusDate", publicName: "connectionStatusDate", isSignal: true, isRequired: false, transformFunction: null }, connectionStatusSeverity: { classPropertyName: "connectionStatusSeverity", publicName: "connectionStatusSeverity", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, actionGroup: { classPropertyName: "actionGroup", publicName: "actionGroup", isSignal: true, isRequired: false, transformFunction: null }, actionGroupMaxVisible: { classPropertyName: "actionGroupMaxVisible", publicName: "actionGroupMaxVisible", isSignal: true, isRequired: false, transformFunction: null }, actionGroupDisabled: { classPropertyName: "actionGroupDisabled", publicName: "actionGroupDisabled", isSignal: true, isRequired: false, transformFunction: null }, infoElements: { classPropertyName: "infoElements", publicName: "infoElements", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selectedChange" }, ngImport: i0, template: "<div \n  class=\"tk-card\" \n  [class.tk-card-horizontal]=\"layout() === 'horizontal'\"\n  [class.tk-card-selectable]=\"selectable()\"\n  [class.tk-card-selected]=\"selectable() && selected()\"\n  [class.tk-card-no-image]=\"!showImage()\"\n  [attr.aria-pressed]=\"selectable() ? selected() : null\">\n  \n  <!-- Header: Selection, Metadata, and Actions -->\n  @if (selectable() || badgeText() || secondaryBadgeText() || connectionStatusDate() || actions().length > 0 || actionGroup().length > 0) {\n    <div class=\"tk-card-header\">\n      <div class=\"tk-card-header-left\">\n        @if (selectable()) {\n          <div \n            class=\"tk-card-selection\" \n            tabindex=\"-1\">\n            <tk-checkbox [binary]=\"true\" [(model)]=\"selected\"></tk-checkbox>\n          </div>\n        }\n        @if (badgeText() || secondaryBadgeText() || connectionStatusDate()) {\n          <div class=\"tk-card-metadata\">\n            @if (badgeText()) {\n              <tk-tag [value]=\"badgeText()!\"></tk-tag>\n            }\n            @if (connectionStatusDate()) {\n              <tk-time-ago [dateTime]=\"connectionStatusDate()!\" [severity]=\"connectionStatusSeverity()\"></tk-time-ago>\n            }\n            @if (secondaryBadgeText()) {\n              <span class=\"tk-card-metadata-secondary\">{{ secondaryBadgeText() }}</span>\n            }\n          </div>\n        }\n      </div>\n\n      <div \n        class=\"tk-card-actions\" \n        tabindex=\"-1\">\n        <!-- Single Action -->\n        @for (action of visibleActions(); track action.id) {\n          <tk-button \n            [icon]=\"action.icon\" \n            [severity]=\"getButtonSeverity(action.severity)\"\n            variant=\"text\"\n            [disabled]=\"action.disabled || false\"\n            [tooltipText]=\"action.label\"\n            size=\"small\"\n            (clicked)=\"action.handler()\">\n          </tk-button>\n        }\n\n        <!-- Multiple Actions Dropdown -->\n        @if (hasOverflowActions()) {\n          <tk-dropdown [model]=\"menuItems()\" size=\"small\"></tk-dropdown>\n        }\n\n        <!-- Action Group -->\n        @if (actionGroup().length > 0) {\n          <tk-action-group\n            [actions]=\"actionGroup()\"\n            [maxVisible]=\"actionGroupMaxVisible()\"\n            [disabled]=\"actionGroupDisabled()\"\n          ></tk-action-group>\n        }\n      </div>\n    </div>\n  }\n\n  <!-- Image Section -->\n  @if (showImage()) {\n    <div class=\"tk-card-image-container\">\n      @if (image()) {\n        <div \n          class=\"tk-card-image\" \n          [style.background-image]=\"'url(' + image() + ')'\">\n        </div>\n      } @else {\n        <div class=\"tk-card-image-placeholder\">\n          <tk-icon icon=\"image\" size=\"lg\"></tk-icon>\n        </div>\n      }\n    </div>\n  }\n\n  <!-- Content Section -->\n  <div class=\"tk-card-content\">\n    <div class=\"tk-card-body\">\n      <h3 class=\"tk-card-title\" [class.tk-card-title--link]=\"titleLink() || titleHref()\">\n        @if (titleLink()) {\n          <a [routerLink]=\"titleLink()!\" class=\"tk-card-title-link\">\n            @if (titleIcon()) {\n              <tk-icon [icon]=\"titleIcon()!\" size=\"sm\"></tk-icon>\n            }\n            {{ title() }}\n          </a>\n        } @else if (titleHref()) {\n          <a [href]=\"titleHref()!\" class=\"tk-card-title-link\">\n            @if (titleIcon()) {\n              <tk-icon [icon]=\"titleIcon()!\" size=\"sm\"></tk-icon>\n            }\n            {{ title() }}\n          </a>\n        } @else {\n          @if (titleIcon()) {\n            <tk-icon [icon]=\"titleIcon()!\" size=\"sm\"></tk-icon>\n          }\n          {{ title() }}\n        }\n      </h3>\n      @if (description()) {\n        <p class=\"tk-card-description\">{{ description() }}</p>\n      }\n    </div>\n\n    @if (infoElements().length > 0) {\n      <div class=\"tk-card-info-elements\">\n        @for (element of infoElements(); track $index) {\n          <div class=\"tk-card-info-item\">\n            @switch (element.type) {\n              @case ('progress-bar') {\n                <div class=\"tk-card-info-progress\">\n                  @if (element.label) {\n                    <span class=\"tk-card-info-progress-label\">{{ element.label }}</span>\n                  }\n                  <tk-progress-bar [value]=\"element.value || 0\" size=\"small\"></tk-progress-bar>\n                </div>\n              }\n              @case ('tag') {\n                <tk-tag [value]=\"element.label || ''\" [severity]=\"element.severity || 'secondary'\"></tk-tag>\n              }\n              @case ('chip') {\n                <!-- Using tag for chips as per design system style -->\n                <tk-tag [value]=\"element.label || ''\" [severity]=\"element.severity || 'secondary'\"></tk-tag>\n              }\n              @case ('status-bar') {\n                <tk-status-bar \n                  [label]=\"element.label || ''\" \n                  [barLabel]=\"element.barLabel || ''\"\n                  [severity]=\"getStatusBarSeverity(element.severity)\">\n                </tk-status-bar>\n              }\n              @case ('button') {\n                <tk-button \n                  [label]=\"element.label\" \n                  [icon]=\"element.icon\" \n                  [severity]=\"getButtonSeverity(element.severity)\"\n                  size=\"small\"\n                  (clicked)=\"element.handler ? element.handler() : null\">\n                </tk-button>\n              }\n              @case ('icon') {\n                <tk-icon [icon]=\"element.icon || ''\"></tk-icon>\n              }\n              @case ('string') {\n                <span class=\"tk-card-info-text\">{{ element.label }}</span>\n              }\n            }\n          </div>\n        }\n      </div>\n    }\n  </div>\n</div>\n", styles: [":host{display:block;width:100%}.tk-card{background-color:var(--tk-color-base-surface-0);border:1px solid var(--tk-color-base-surface-200);border-radius:var(--tk-borderRadius-m);display:flex;flex-direction:column;position:relative;overflow:hidden;transition:all .2s cubic-bezier(.4,0,.2,1);width:100%;box-shadow:0 1px 3px rgba(var(--tk-color-base-surface-1000),.05)}.tk-card.tk-card-selectable:hover{border-color:var(--tk-color-base-primary-300);box-shadow:0 4px 12px rgba(var(--tk-color-base-surface-1000),.08);transform:translateY(-2px)}.tk-card.tk-card-selected{border-color:var(--tk-color-base-primary-500);background-color:var(--tk-color-base-sky-100)}.tk-card .tk-card-header{display:flex;justify-content:space-between;align-items:center;padding:var(--tk-spacing-padding-s);min-height:var(--tk-spacing-base-300);z-index:2}.tk-card .tk-card-header .tk-card-header-left{display:flex;align-items:center;gap:var(--tk-spacing-base-100)}.tk-card .tk-card-header .tk-card-metadata{display:flex;align-items:center;gap:var(--tk-spacing-base-75)}.tk-card .tk-card-header .tk-card-metadata tk-tag ::ng-deep .p-tag{background-color:var(--tk-color-base-surface-100)!important;color:var(--tk-color-text-default)!important;font-weight:500}.tk-card .tk-card-header .tk-card-metadata .tk-card-metadata-secondary{font-size:var(--tk-font-size-legal-m);color:var(--tk-color-text-subtle);font-weight:400}.tk-card .tk-card-header .tk-card-actions{display:flex;align-items:center;gap:var(--tk-spacing-base-25)}.tk-card .tk-card-image-container{background-color:var(--tk-color-base-surface-100);display:flex;justify-content:center;align-items:center;width:100%;position:relative}.tk-card .tk-card-image-container .tk-card-image{width:100%;height:100%;background-size:contain;background-position:center;background-repeat:no-repeat}.tk-card .tk-card-image-container .tk-card-image-placeholder{color:var(--tk-color-base-surface-400);display:flex;justify-content:center;align-items:center;width:100%;height:100%}.tk-card .tk-card-image-container .tk-card-image-placeholder tk-icon{font-size:3rem;opacity:.5}.tk-card .tk-card-content{padding:var(--tk-spacing-padding-m);display:flex;flex-direction:column;gap:var(--tk-spacing-gap-xs);flex:1}.tk-card .tk-card-content .tk-card-body{display:flex;flex-direction:column;gap:var(--tk-spacing-base-25)}.tk-card .tk-card-content .tk-card-title{margin:0;font-size:var(--tk-font-size-paragraph-m);font-weight:var(--tk-font-weight-600);color:var(--tk-color-text-default);display:flex;align-items:center;gap:var(--tk-spacing-base-50);line-height:normal}.tk-card .tk-card-content .tk-card-title.tk-card-title--link{cursor:pointer}.tk-card .tk-card-content .tk-card-title .tk-card-title-link{color:inherit;text-decoration:none;display:flex;align-items:center;gap:inherit;width:100%;transition:opacity .2s ease-in-out}.tk-card .tk-card-content .tk-card-title .tk-card-title-link:hover{opacity:.7}.tk-card .tk-card-content .tk-card-description{margin:0;font-size:var(--tk-font-size-paragraph-s);color:var(--tk-color-text-subtle);line-height:1.5}.tk-card .tk-card-content .tk-card-info-elements{display:flex;flex-direction:column;gap:var(--tk-spacing-base-100);margin-top:auto}.tk-card .tk-card-content .tk-card-info-progress{display:flex;flex-direction:row;align-items:center;gap:var(--tk-spacing-base-75)}.tk-card .tk-card-content .tk-card-info-progress .tk-card-info-progress-label{font-size:var(--tk-font-size-legal-m);font-weight:600;color:var(--tk-color-text-default);min-width:fit-content}.tk-card .tk-card-content .tk-card-info-progress tk-progress-bar{flex:1}.tk-card .tk-card-content .tk-card-info-text{font-size:var(--tk-font-size-legal-m);color:var(--tk-color-text-default);line-height:normal}.tk-card.tk-card-horizontal{flex-direction:row;min-height:11.25rem;display:grid;grid-template-columns:11.25rem 1fr;grid-template-rows:auto 1fr}.tk-card.tk-card-horizontal.tk-card-no-image{grid-template-columns:1fr;min-height:auto}.tk-card.tk-card-horizontal .tk-card-image-container{grid-row:1/span 2;grid-column:1;width:11.25rem;min-width:11.25rem;height:100%;border-right:1px solid var(--tk-color-base-surface-100)}.tk-card.tk-card-horizontal .tk-card-header{grid-column:2;grid-row:1}.tk-card.tk-card-horizontal .tk-card-content{grid-column:2;grid-row:2;margin-top:0}.tk-card:not(.tk-card-horizontal) .tk-card-image-container{height:13.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MenuModule }, { kind: "component", type: ButtonComponent, selector: "tk-button", inputs: ["label", "disabled", "type", "severity", "variant", "link", "icon", "iconPosition", "tooltipText", "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: IconComponent, selector: "tk-icon", inputs: ["icon", "styleIcon", "color", "size", "disabled"] }, { kind: "component", type: ProgressBarComponent, selector: "tk-progress-bar", inputs: ["value", "showValue", "size"] }, { kind: "component", type: StatusBarComponent, selector: "tk-status-bar", inputs: ["label", "severity", "size", "barLabel"] }, { kind: "component", type: TagComponent, selector: "tk-tag", inputs: ["value", "severity", "truncationLimit"] }, { kind: "component", type: DropdownComponent, selector: "tk-dropdown", inputs: ["model", "icon", "label", "iconPosition", "size", "disabled", "tooltip", "tooltipPosition"] }, { kind: "component", type: ActionGroupComponent, selector: "tk-action-group", inputs: ["actions", "maxVisible", "disabled"] }, { kind: "component", type: TimeAgoComponent, selector: "tk-time-ago", inputs: ["dateTime", "severity", "tooltipText", "tooltipFormat"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: CardComponent, isStandalone: true, selector: "tk-card", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, titleLink: { classPropertyName: "titleLink", publicName: "titleLink", isSignal: true, isRequired: false, transformFunction: null }, titleHref: { classPropertyName: "titleHref", publicName: "titleHref", isSignal: true, isRequired: false, transformFunction: null }, titleIcon: { classPropertyName: "titleIcon", publicName: "titleIcon", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, showImage: { classPropertyName: "showImage", publicName: "showImage", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, badgeText: { classPropertyName: "badgeText", publicName: "badgeText", isSignal: true, isRequired: false, transformFunction: null }, secondaryBadgeText: { classPropertyName: "secondaryBadgeText", publicName: "secondaryBadgeText", isSignal: true, isRequired: false, transformFunction: null }, connectionStatusDate: { classPropertyName: "connectionStatusDate", publicName: "connectionStatusDate", isSignal: true, isRequired: false, transformFunction: null }, connectionStatusSeverity: { classPropertyName: "connectionStatusSeverity", publicName: "connectionStatusSeverity", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, actionGroup: { classPropertyName: "actionGroup", publicName: "actionGroup", isSignal: true, isRequired: false, transformFunction: null }, actionGroupMaxVisible: { classPropertyName: "actionGroupMaxVisible", publicName: "actionGroupMaxVisible", isSignal: true, isRequired: false, transformFunction: null }, actionGroupDisabled: { classPropertyName: "actionGroupDisabled", publicName: "actionGroupDisabled", isSignal: true, isRequired: false, transformFunction: null }, infoElements: { classPropertyName: "infoElements", publicName: "infoElements", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selectedChange" }, ngImport: i0, template: "<div \n  class=\"tk-card\" \n  [class.tk-card-horizontal]=\"layout() === 'horizontal'\"\n  [class.tk-card-selectable]=\"selectable()\"\n  [class.tk-card-selected]=\"selectable() && selected()\"\n  [class.tk-card-no-image]=\"!showImage()\"\n  [attr.aria-pressed]=\"selectable() ? selected() : null\">\n  \n  <!-- Header: Selection, Metadata, and Actions -->\n  @if (selectable() || badgeText() || secondaryBadgeText() || connectionStatusDate() || actions().length > 0 || actionGroup().length > 0) {\n    <div class=\"tk-card-header\">\n      <div class=\"tk-card-header-left\">\n        @if (selectable()) {\n          <div \n            class=\"tk-card-selection\" \n            tabindex=\"-1\">\n            <tk-checkbox [binary]=\"true\" [(model)]=\"selected\"></tk-checkbox>\n          </div>\n        }\n        @if (badgeText() || secondaryBadgeText() || connectionStatusDate()) {\n          <div class=\"tk-card-metadata\">\n            @if (badgeText()) {\n              <tk-tag [value]=\"badgeText()!\"></tk-tag>\n            }\n            @if (connectionStatusDate()) {\n              <tk-time-ago [dateTime]=\"connectionStatusDate()!\" [severity]=\"connectionStatusSeverity()\"></tk-time-ago>\n            }\n            @if (secondaryBadgeText()) {\n              <span class=\"tk-card-metadata-secondary\">{{ secondaryBadgeText() }}</span>\n            }\n          </div>\n        }\n      </div>\n\n      <div \n        class=\"tk-card-actions\" \n        tabindex=\"-1\">\n        <!-- Single Action -->\n        @for (action of visibleActions(); track action.id) {\n          <tk-button \n            [icon]=\"action.icon\" \n            [severity]=\"getButtonSeverity(action.severity)\"\n            variant=\"text\"\n            [disabled]=\"action.disabled || false\"\n            [tooltipText]=\"action.label\"\n            size=\"small\"\n            (clicked)=\"action.handler()\">\n          </tk-button>\n        }\n\n        <!-- Multiple Actions Dropdown -->\n        @if (hasOverflowActions()) {\n          <tk-dropdown [model]=\"menuItems()\" size=\"small\"></tk-dropdown>\n        }\n\n        <!-- Action Group -->\n        @if (actionGroup().length > 0) {\n          <tk-action-group\n            [actions]=\"actionGroup()\"\n            [maxVisible]=\"actionGroupMaxVisible()\"\n            [disabled]=\"actionGroupDisabled()\"\n          ></tk-action-group>\n        }\n      </div>\n    </div>\n  }\n\n  <!-- Image Section -->\n  @if (showImage()) {\n    <div class=\"tk-card-image-container\">\n      @if (image()) {\n        <div \n          class=\"tk-card-image\" \n          [style.background-image]=\"'url(' + image() + ')'\">\n        </div>\n      } @else {\n        <div class=\"tk-card-image-placeholder\">\n          <tk-icon icon=\"image\" size=\"lg\"></tk-icon>\n        </div>\n      }\n    </div>\n  }\n\n  <!-- Content Section -->\n  <div class=\"tk-card-content\">\n    <div class=\"tk-card-body\">\n      <h3 class=\"tk-card-title\" [class.tk-card-title--link]=\"titleLink() || titleHref()\">\n        @if (titleLink()) {\n          <a [routerLink]=\"titleLink()!\" class=\"tk-card-title-link\">\n            @if (titleIcon()) {\n              <tk-icon [icon]=\"titleIcon()!\" size=\"sm\"></tk-icon>\n            }\n            {{ title() }}\n          </a>\n        } @else if (titleHref()) {\n          <a [href]=\"titleHref()!\" class=\"tk-card-title-link\">\n            @if (titleIcon()) {\n              <tk-icon [icon]=\"titleIcon()!\" size=\"sm\"></tk-icon>\n            }\n            {{ title() }}\n          </a>\n        } @else {\n          @if (titleIcon()) {\n            <tk-icon [icon]=\"titleIcon()!\" size=\"sm\"></tk-icon>\n          }\n          {{ title() }}\n        }\n      </h3>\n      @if (description()) {\n        <p class=\"tk-card-description\">{{ description() }}</p>\n      }\n    </div>\n\n    @if (infoElements().length > 0) {\n      <div class=\"tk-card-info-elements\">\n        @for (element of infoElements(); track $index) {\n          <div class=\"tk-card-info-item\">\n            @switch (element.type) {\n              @case ('progress-bar') {\n                <div class=\"tk-card-info-progress\">\n                  @if (element.label) {\n                    <span class=\"tk-card-info-progress-label\">{{ element.label }}</span>\n                  }\n                  <tk-progress-bar [value]=\"element.value || 0\" size=\"small\"></tk-progress-bar>\n                </div>\n              }\n              @case ('tag') {\n                <tk-tag [value]=\"element.label || ''\" [severity]=\"element.severity || 'secondary'\"></tk-tag>\n              }\n              @case ('chip') {\n                <!-- Using tag for chips as per design system style -->\n                <tk-tag [value]=\"element.label || ''\" [severity]=\"element.severity || 'secondary'\"></tk-tag>\n              }\n              @case ('status-bar') {\n                <tk-status-bar \n                  [label]=\"element.label || ''\" \n                  [barLabel]=\"element.barLabel || ''\"\n                  [severity]=\"getStatusBarSeverity(element.severity)\">\n                </tk-status-bar>\n              }\n              @case ('button') {\n                <tk-button \n                  [label]=\"element.label\" \n                  [icon]=\"element.icon\" \n                  [severity]=\"getButtonSeverity(element.severity)\"\n                  size=\"small\"\n                  (clicked)=\"element.handler ? element.handler() : null\">\n                </tk-button>\n              }\n              @case ('icon') {\n                <tk-icon [icon]=\"element.icon || ''\"></tk-icon>\n              }\n              @case ('string') {\n                <span class=\"tk-card-info-text\">{{ element.label }}</span>\n              }\n            }\n          </div>\n        }\n      </div>\n    }\n  </div>\n</div>\n", styles: [":host{display:block;width:100%}.tk-card{background-color:var(--tk-color-base-surface-0);border:1px solid var(--tk-color-base-surface-200);border-radius:var(--tk-borderRadius-m);display:flex;flex-direction:column;position:relative;overflow:hidden;transition:all .2s cubic-bezier(.4,0,.2,1);width:100%;box-shadow:0 1px 3px rgba(var(--tk-color-base-surface-1000),.05)}.tk-card.tk-card-selectable:hover{border-color:var(--tk-color-base-primary-300);box-shadow:0 4px 12px rgba(var(--tk-color-base-surface-1000),.08);transform:translateY(-2px)}.tk-card.tk-card-selected{border-color:var(--tk-color-base-primary-500);background-color:var(--tk-color-base-sky-100)}.tk-card .tk-card-header{display:flex;justify-content:space-between;align-items:center;padding:var(--tk-spacing-padding-s);min-height:var(--tk-spacing-base-300);z-index:2}.tk-card .tk-card-header .tk-card-header-left{display:flex;align-items:center;gap:var(--tk-spacing-base-100)}.tk-card .tk-card-header .tk-card-metadata{display:flex;align-items:center;gap:var(--tk-spacing-base-75)}.tk-card .tk-card-header .tk-card-metadata tk-tag ::ng-deep .p-tag{background-color:var(--tk-color-base-surface-100)!important;color:var(--tk-color-text-default)!important;font-weight:500}.tk-card .tk-card-header .tk-card-metadata .tk-card-metadata-secondary{font-size:var(--tk-font-size-legal-m);color:var(--tk-color-text-subtle);font-weight:400}.tk-card .tk-card-header .tk-card-actions{display:flex;align-items:center;gap:var(--tk-spacing-base-25)}.tk-card .tk-card-image-container{background-color:var(--tk-color-base-surface-100);display:flex;justify-content:center;align-items:center;width:100%;position:relative}.tk-card .tk-card-image-container .tk-card-image{width:100%;height:100%;background-size:contain;background-position:center;background-repeat:no-repeat}.tk-card .tk-card-image-container .tk-card-image-placeholder{color:var(--tk-color-base-surface-400);display:flex;justify-content:center;align-items:center;width:100%;height:100%}.tk-card .tk-card-image-container .tk-card-image-placeholder tk-icon{font-size:3rem;opacity:.5}.tk-card .tk-card-content{padding:var(--tk-spacing-padding-m);display:flex;flex-direction:column;gap:var(--tk-spacing-gap-xs);flex:1}.tk-card .tk-card-content .tk-card-body{display:flex;flex-direction:column;gap:var(--tk-spacing-base-25)}.tk-card .tk-card-content .tk-card-title{margin:0;font-size:var(--tk-font-size-paragraph-m);font-weight:var(--tk-font-weight-600);color:var(--tk-color-text-default);display:flex;align-items:center;gap:var(--tk-spacing-base-50);line-height:normal}.tk-card .tk-card-content .tk-card-title.tk-card-title--link{cursor:pointer}.tk-card .tk-card-content .tk-card-title .tk-card-title-link{color:inherit;text-decoration:none;display:flex;align-items:center;gap:inherit;width:100%;transition:opacity .2s ease-in-out}.tk-card .tk-card-content .tk-card-title .tk-card-title-link:hover{opacity:.7}.tk-card .tk-card-content .tk-card-description{margin:0;font-size:var(--tk-font-size-paragraph-s);color:var(--tk-color-text-subtle);line-height:1.5}.tk-card .tk-card-content .tk-card-info-elements{display:flex;flex-direction:column;gap:var(--tk-spacing-base-100);margin-top:auto}.tk-card .tk-card-content .tk-card-info-progress{display:flex;flex-direction:row;align-items:center;gap:var(--tk-spacing-base-75)}.tk-card .tk-card-content .tk-card-info-progress .tk-card-info-progress-label{font-size:var(--tk-font-size-legal-m);font-weight:600;color:var(--tk-color-text-default);min-width:fit-content}.tk-card .tk-card-content .tk-card-info-progress tk-progress-bar{flex:1}.tk-card .tk-card-content .tk-card-info-text{font-size:var(--tk-font-size-legal-m);color:var(--tk-color-text-default);line-height:normal}.tk-card.tk-card-horizontal{flex-direction:row;min-height:11.25rem;display:grid;grid-template-columns:11.25rem 1fr;grid-template-rows:auto 1fr}.tk-card.tk-card-horizontal.tk-card-no-image{grid-template-columns:1fr;min-height:auto}.tk-card.tk-card-horizontal .tk-card-image-container{grid-row:1/span 2;grid-column:1;width:11.25rem;min-width:11.25rem;height:100%;border-right:1px solid var(--tk-color-base-surface-100)}.tk-card.tk-card-horizontal .tk-card-header{grid-column:2;grid-row:1}.tk-card.tk-card-horizontal .tk-card-content{grid-column:2;grid-row:2;margin-top:0}.tk-card:not(.tk-card-horizontal) .tk-card-image-container{height:13.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MenuModule }, { kind: "component", type: ButtonComponent, selector: "tk-button", inputs: ["label", "disabled", "type", "severity", "variant", "link", "icon", "iconPosition", "tooltipText", "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: IconComponent, selector: "tk-icon", inputs: ["icon", "styleIcon", "color", "size", "disabled"] }, { kind: "component", type: ProgressBarComponent, selector: "tk-progress-bar", inputs: ["value", "showValue", "size"] }, { kind: "component", type: StatusBarComponent, selector: "tk-status-bar", inputs: ["label", "severity", "size", "barLabel"] }, { kind: "component", type: TagComponent, selector: "tk-tag", inputs: ["value", "severity", "truncationLimit"] }, { kind: "component", type: DropdownComponent, selector: "tk-dropdown", inputs: ["model", "icon", "label", "iconPosition", "size", "disabled", "tooltip", "tooltipPosition"] }, { kind: "component", type: ActionGroupComponent, selector: "tk-action-group", inputs: ["actions", "maxVisible", "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.3", ngImport: i0, type: CardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: CardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tk-card', standalone: true, imports: [
                         CommonModule,