@tekus/design-system 5.26.0 → 5.27.0

package/fesm2022/tekus-design-system-components-sidebar-layout.mjs

@@ -0,0 +1,179 @@
+import * as i0 from '@angular/core';
+import { Injectable, inject, ChangeDetectorRef, input, output, HostListener, ChangeDetectionStrategy, Component } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { BehaviorSubject, Subscription } from 'rxjs';
+import { BreakpointObserver } from '@angular/cdk/layout';
+import { ButtonComponent } from '@tekus/design-system/components/button';
+
+class SidebarService {
+    constructor() {
+        this.collapsedSubject = new BehaviorSubject(false);
+        /**
+         * Observable to track the collapsed state of the sidebar.
+         */
+        this.isCollapsed$ = this.collapsedSubject.asObservable();
+    }
+    /**
+     * Toggles the collapsed state of the sidebar.
+     */
+    toggle() {
+        this.collapsedSubject.next(!this.collapsedSubject.value);
+    }
+    /**
+     * Explicitly sets the collapsed state of the sidebar.
+     * @param value True to collapse, false to expand.
+     */
+    setCollapsed(value) {
+        this.collapsedSubject.next(value);
+    }
+    /**
+     * Gets the current collapsed state.
+     */
+    get isCollapsed() {
+        return this.collapsedSubject.value;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: SidebarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: SidebarService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: SidebarService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class SidebarLayoutComponent {
+    constructor() {
+        this.sidebarService = inject(SidebarService);
+        this.breakpointObserver = inject(BreakpointObserver);
+        this.cdr = inject(ChangeDetectorRef);
+        this.subscription = new Subscription();
+        /**
+         * Breakpoint constants
+         */
+        this.TABLET_BREAKPOINT = '(max-width: 1023px)';
+        this.MOBILE_BREAKPOINT = '(max-width: 479px)';
+        /**
+         * Optional manual control of the collapsed state.
+         * If provided, it overrides the service state.
+         */
+        this.isCollapsed = input(undefined, ...(ngDevMode ? [{ debugName: "isCollapsed" }] : /* istanbul ignore next */ []));
+        /**
+         * Emitted when the collapsed state changes.
+         */
+        this.collapsedChange = output();
+        /**
+         * Internal state of the sidebar.
+         */
+        this.collapsed = false;
+        /**
+         * Responsive states
+         */
+        this.isTablet = false;
+        this.isMobile = false;
+    }
+    ngOnInit() {
+        // Sync with service
+        this.subscription.add(this.sidebarService.isCollapsed$.subscribe((state) => {
+            if (this.isCollapsed() === undefined) {
+                this.collapsed = state;
+                this.collapsedChange.emit(state);
+                this.cdr.markForCheck();
+            }
+        }));
+        // Responsive breakpoints
+        this.subscription.add(this.breakpointObserver
+            .observe([this.TABLET_BREAKPOINT, this.MOBILE_BREAKPOINT])
+            .subscribe((result) => {
+            const wasTablet = this.isTablet;
+            this.isTablet = result.breakpoints[this.TABLET_BREAKPOINT];
+            this.isMobile = result.breakpoints[this.MOBILE_BREAKPOINT];
+            // Auto-collapse when entering tablet/mobile mode (< 1024px)
+            if (this.isTablet && !wasTablet) {
+                this.sidebarService.setCollapsed(true);
+            }
+            // Auto-expand when returning to desktop mode (> 1024px)
+            if (!this.isTablet && wasTablet) {
+                this.sidebarService.setCollapsed(false);
+            }
+            this.cdr.markForCheck();
+        }));
+    }
+    ngOnDestroy() {
+        this.subscription.unsubscribe();
+    }
+    /**
+     * Determines if the sidebar is currently collapsed.
+     */
+    get displayCollapsed() {
+        return this.isCollapsed() === undefined ? this.collapsed : this.isCollapsed();
+    }
+    /**
+     * Toggles the sidebar state.
+     */
+    toggleSidebar() {
+        if (this.isCollapsed() === undefined) {
+            this.sidebarService.toggle();
+        }
+        else {
+            this.collapsedChange.emit(!this.isCollapsed());
+        }
+    }
+    /**
+     * Closes the sidebar explicitly.
+     */
+    closeSidebar() {
+        if (this.isCollapsed() === undefined) {
+            this.sidebarService.setCollapsed(true);
+        }
+        else {
+            this.collapsedChange.emit(true);
+        }
+    }
+    /**
+     * Handles clicks in the sidebar content to auto-close on mobile.
+     * Using HostListener to avoid template accessibility linting on non-interactive aside.
+     */
+    handleSidebarContentClick(event) {
+        if (!this.isMobile)
+            return;
+        // Check if the click is inside the sidebar
+        const sidebar = event.target.closest('.tk-sidebar');
+        if (!sidebar)
+            return;
+        const target = event.target;
+        const navItem = target.closest('.tk-menu-item-link, .tk-pm-item-link, a, button');
+        if (navItem) {
+            // Check if it's a toggle for a sub-menu (has children)
+            const hasChildren = navItem.querySelector('.tk-menu-item-chevron, .tk-pm-item-chevron');
+            if (!hasChildren) {
+                this.closeSidebar();
+            }
+        }
+    }
+    /**
+     * Handles backdrop clicks to close the drawer.
+     */
+    handleBackdropClick() {
+        this.closeSidebar();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: SidebarLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: SidebarLayoutComponent, isStandalone: true, selector: "tk-sidebar-layout", inputs: { isCollapsed: { classPropertyName: "isCollapsed", publicName: "isCollapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsedChange: "collapsedChange" }, host: { listeners: { "click": "handleSidebarContentClick($event)" } }, ngImport: i0, template: "<div\n  class=\"tk-sidebar-layout\"\n  [class.collapsed]=\"displayCollapsed\"\n  [class.is-tablet]=\"isTablet\"\n  [class.is-mobile]=\"isMobile\"\n>\n  <!-- Backdrop for overlay mode -->\n  @if (!displayCollapsed && isTablet) {\n    <tk-button\n      class=\"tk-sidebar-backdrop\"\n      (clicked)=\"handleBackdropClick()\"\n      aria-label=\"Close sidebar\"\n    ></tk-button>\n  }\n\n  <!-- Sidebar -->\n  <aside class=\"tk-sidebar\">\n    @if (!displayCollapsed) {\n      <div class=\"tk-sidebar-header\">\n        <img\n          src=\"assets/img/tk-logo-normal-light.svg\"\n          alt=\"Tekus Logo\"\n          class=\"tk-logo-expanded\"\n        />\n        <tk-button\n          class=\"tk-sidebar-toggle is-sidebar\"\n          (clicked)=\"toggleSidebar()\"\n          severity=\"secondary\"\n          variant=\"text\"\n          icon=\"arrow-left\"\n        ></tk-button>\n      </div>\n    }\n\n    <ng-content select=\"[sidebar-content]\"></ng-content>\n  </aside>\n\n  <!-- Main Content -->\n  <div class=\"tk-main-container\">\n    <header class=\"tk-nav-header\">\n      <div class=\"tk-nav-left\">\n        @if (displayCollapsed || isTablet) {\n          <tk-button\n            class=\"tk-sidebar-toggle\"\n            (clicked)=\"toggleSidebar()\"\n            severity=\"secondary\"\n            variant=\"text\"\n            icon=\"bars\"\n          ></tk-button>\n          <img\n            src=\"assets/img/tk-logo-normal-dark.svg\"\n            alt=\"Tekus Logo\"\n            class=\"tk-logo-header\"\n          />\n        }\n      </div>\n\n      <div class=\"tk-nav-right\">\n        <div class=\"tk-header-actions\">\n          <ng-content select=\"[header-actions]\"></ng-content>\n        </div>\n      </div>\n    </header>\n\n    <main class=\"tk-content\">\n      <ng-content></ng-content>\n    </main>\n  </div>\n</div>\n", styles: [":host{display:block;height:100vh;width:100%}.tk-sidebar-layout{display:flex;height:100%;width:100%;overflow:hidden;position:relative}.tk-sidebar-layout .tk-sidebar-backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:999;cursor:pointer;animation:fadeIn .3s ease-in-out;display:block}.tk-sidebar-layout .tk-sidebar-backdrop::ng-deep .p-button{width:100%!important;height:100%!important;background-color:#00000080!important;border:none!important;padding:0!important;border-radius:0!important;box-shadow:none!important}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.tk-sidebar-layout .tk-sidebar{background-color:var(--tk-color-background-inverse, #191a1b);color:var(--tk-color-text-inverse, #ffffff);width:var(--tk-sidebar-width, 17.5rem);height:100%;display:flex;flex-direction:column;transition:width .3s ease-in-out,transform .3s ease-in-out;flex-shrink:0;overflow-y:auto;overflow-x:hidden}.tk-sidebar-layout .tk-sidebar::-webkit-scrollbar{width:.25rem}.tk-sidebar-layout .tk-sidebar::-webkit-scrollbar-thumb{background:var(--tk-color-base-surface-700, #424243);border-radius:.125rem}.tk-sidebar-layout .tk-sidebar .tk-sidebar-header{padding:0 var(--tk-spacing-padding-m, 1rem);display:flex;align-items:center;justify-content:space-between;height:3.5rem;flex-shrink:0}.tk-sidebar-layout .tk-sidebar .tk-sidebar-header .tk-logo-expanded{height:1.5rem;width:auto}.tk-sidebar-layout .tk-sidebar .tk-sidebar-header .tk-logo-collapsed{height:2.5rem;width:auto}.tk-sidebar-layout .tk-sidebar .tk-sidebar-menu{flex:1;padding:var(--tk-spacing-padding-m, 1rem)}.tk-sidebar-layout .tk-main-container{flex:1;display:flex;flex-direction:column;min-width:0;background-color:var(--tk-color-background-default, #ffffff)}.tk-sidebar-layout .tk-sidebar-toggle{appearance:none;background:none;border:none;box-shadow:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;color:var(--tk-color-text-default, #191a1b);border-radius:var(--tk-borderRadius-s, .5rem);transition:all .2s;min-width:unset}.tk-sidebar-layout .tk-sidebar-toggle::ng-deep .p-button{background:none!important;border:none!important;padding:var(--tk-spacing-padding-xs, .25rem)!important;min-width:unset!important;height:auto!important;color:inherit!important;box-shadow:none!important}.tk-sidebar-layout .tk-sidebar-toggle::ng-deep .p-button:hover{background-color:var(--tk-color-background-soft, #f2f1f1)!important}.tk-sidebar-layout .tk-sidebar-toggle.is-sidebar{color:#fff!important}.tk-sidebar-layout .tk-sidebar-toggle.is-sidebar::ng-deep .p-button{color:#fff!important;background:transparent!important;padding:0!important}.tk-sidebar-layout .tk-sidebar-toggle.is-sidebar::ng-deep .p-button:hover{background-color:transparent!important;opacity:.7}.tk-sidebar-layout .tk-sidebar-toggle.is-sidebar::ng-deep .p-button ::ng-deep svg,.tk-sidebar-layout .tk-sidebar-toggle.is-sidebar::ng-deep .p-button ::ng-deep path{fill:currentColor!important;stroke:currentColor!important}.tk-sidebar-layout .tk-nav-header{height:3.5rem;background-color:var(--tk-color-background-default, #ffffff);display:flex;align-items:center;justify-content:space-between;padding:0 var(--tk-spacing-padding-m, 1rem);border-bottom:1px solid var(--tk-color-border-subtle, #e4e4e4);flex-shrink:0}.tk-sidebar-layout .tk-nav-header .tk-nav-left{display:flex;align-items:center;gap:var(--tk-spacing-gap-m, 1rem)}.tk-sidebar-layout .tk-nav-header .tk-logo-header{height:1.75rem;width:auto;margin-left:var(--tk-spacing-padding-s, .5rem)}.tk-sidebar-layout .tk-nav-header .tk-nav-right{display:flex;align-items:center}.tk-sidebar-layout .tk-nav-header .tk-header-actions{display:flex;align-items:center;gap:var(--tk-spacing-gap-s, .5rem)}.tk-sidebar-layout .tk-nav-header ::ng-deep .tk-header-action-btn{background:transparent;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:var(--tk-spacing-padding-s, .5rem);color:var(--tk-color-primary-default, #16006f);border-radius:50%;transition:background-color .2s}.tk-sidebar-layout .tk-nav-header ::ng-deep .tk-header-action-btn:hover{background-color:var(--tk-color-background-soft, #f2f1f1)}.tk-sidebar-layout .tk-content{flex:1;overflow-y:auto;padding:var(--tk-spacing-padding-l, 1.25rem)}.tk-sidebar-layout.collapsed:not(.is-tablet) .tk-sidebar{width:0;border-right:none}.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .tk-pm-item-label,.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .p-panelmenu-header-label,.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .tk-pm-item-chevron,.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .p-icon{display:none!important}.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .tk-pm-item-link,.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .p-panelmenu-header{justify-content:center;padding-left:0!important;padding-right:0!important}.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .tk-pm-item-content{justify-content:center}.tk-sidebar-layout.is-tablet .tk-sidebar{position:fixed;left:0;top:0;bottom:0;z-index:1000;width:var(--tk-sidebar-width, 17.5rem)!important;transform:translate(0);box-shadow:4px 0 10px #0000001a}.tk-sidebar-layout.is-tablet.collapsed .tk-sidebar{transform:translate(-100%)}.tk-sidebar-layout.is-tablet .tk-main-container{width:100%;flex:1}.tk-sidebar-layout.is-mobile .tk-sidebar{width:100%!important;max-width:none!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonComponent, selector: "tk-button", inputs: ["label", "disabled", "type", "severity", "variant", "link", "icon", "tooltipText", "size"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: SidebarLayoutComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tk-sidebar-layout', imports: [
+                        CommonModule,
+                        ButtonComponent
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"tk-sidebar-layout\"\n  [class.collapsed]=\"displayCollapsed\"\n  [class.is-tablet]=\"isTablet\"\n  [class.is-mobile]=\"isMobile\"\n>\n  <!-- Backdrop for overlay mode -->\n  @if (!displayCollapsed && isTablet) {\n    <tk-button\n      class=\"tk-sidebar-backdrop\"\n      (clicked)=\"handleBackdropClick()\"\n      aria-label=\"Close sidebar\"\n    ></tk-button>\n  }\n\n  <!-- Sidebar -->\n  <aside class=\"tk-sidebar\">\n    @if (!displayCollapsed) {\n      <div class=\"tk-sidebar-header\">\n        <img\n          src=\"assets/img/tk-logo-normal-light.svg\"\n          alt=\"Tekus Logo\"\n          class=\"tk-logo-expanded\"\n        />\n        <tk-button\n          class=\"tk-sidebar-toggle is-sidebar\"\n          (clicked)=\"toggleSidebar()\"\n          severity=\"secondary\"\n          variant=\"text\"\n          icon=\"arrow-left\"\n        ></tk-button>\n      </div>\n    }\n\n    <ng-content select=\"[sidebar-content]\"></ng-content>\n  </aside>\n\n  <!-- Main Content -->\n  <div class=\"tk-main-container\">\n    <header class=\"tk-nav-header\">\n      <div class=\"tk-nav-left\">\n        @if (displayCollapsed || isTablet) {\n          <tk-button\n            class=\"tk-sidebar-toggle\"\n            (clicked)=\"toggleSidebar()\"\n            severity=\"secondary\"\n            variant=\"text\"\n            icon=\"bars\"\n          ></tk-button>\n          <img\n            src=\"assets/img/tk-logo-normal-dark.svg\"\n            alt=\"Tekus Logo\"\n            class=\"tk-logo-header\"\n          />\n        }\n      </div>\n\n      <div class=\"tk-nav-right\">\n        <div class=\"tk-header-actions\">\n          <ng-content select=\"[header-actions]\"></ng-content>\n        </div>\n      </div>\n    </header>\n\n    <main class=\"tk-content\">\n      <ng-content></ng-content>\n    </main>\n  </div>\n</div>\n", styles: [":host{display:block;height:100vh;width:100%}.tk-sidebar-layout{display:flex;height:100%;width:100%;overflow:hidden;position:relative}.tk-sidebar-layout .tk-sidebar-backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:999;cursor:pointer;animation:fadeIn .3s ease-in-out;display:block}.tk-sidebar-layout .tk-sidebar-backdrop::ng-deep .p-button{width:100%!important;height:100%!important;background-color:#00000080!important;border:none!important;padding:0!important;border-radius:0!important;box-shadow:none!important}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.tk-sidebar-layout .tk-sidebar{background-color:var(--tk-color-background-inverse, #191a1b);color:var(--tk-color-text-inverse, #ffffff);width:var(--tk-sidebar-width, 17.5rem);height:100%;display:flex;flex-direction:column;transition:width .3s ease-in-out,transform .3s ease-in-out;flex-shrink:0;overflow-y:auto;overflow-x:hidden}.tk-sidebar-layout .tk-sidebar::-webkit-scrollbar{width:.25rem}.tk-sidebar-layout .tk-sidebar::-webkit-scrollbar-thumb{background:var(--tk-color-base-surface-700, #424243);border-radius:.125rem}.tk-sidebar-layout .tk-sidebar .tk-sidebar-header{padding:0 var(--tk-spacing-padding-m, 1rem);display:flex;align-items:center;justify-content:space-between;height:3.5rem;flex-shrink:0}.tk-sidebar-layout .tk-sidebar .tk-sidebar-header .tk-logo-expanded{height:1.5rem;width:auto}.tk-sidebar-layout .tk-sidebar .tk-sidebar-header .tk-logo-collapsed{height:2.5rem;width:auto}.tk-sidebar-layout .tk-sidebar .tk-sidebar-menu{flex:1;padding:var(--tk-spacing-padding-m, 1rem)}.tk-sidebar-layout .tk-main-container{flex:1;display:flex;flex-direction:column;min-width:0;background-color:var(--tk-color-background-default, #ffffff)}.tk-sidebar-layout .tk-sidebar-toggle{appearance:none;background:none;border:none;box-shadow:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;color:var(--tk-color-text-default, #191a1b);border-radius:var(--tk-borderRadius-s, .5rem);transition:all .2s;min-width:unset}.tk-sidebar-layout .tk-sidebar-toggle::ng-deep .p-button{background:none!important;border:none!important;padding:var(--tk-spacing-padding-xs, .25rem)!important;min-width:unset!important;height:auto!important;color:inherit!important;box-shadow:none!important}.tk-sidebar-layout .tk-sidebar-toggle::ng-deep .p-button:hover{background-color:var(--tk-color-background-soft, #f2f1f1)!important}.tk-sidebar-layout .tk-sidebar-toggle.is-sidebar{color:#fff!important}.tk-sidebar-layout .tk-sidebar-toggle.is-sidebar::ng-deep .p-button{color:#fff!important;background:transparent!important;padding:0!important}.tk-sidebar-layout .tk-sidebar-toggle.is-sidebar::ng-deep .p-button:hover{background-color:transparent!important;opacity:.7}.tk-sidebar-layout .tk-sidebar-toggle.is-sidebar::ng-deep .p-button ::ng-deep svg,.tk-sidebar-layout .tk-sidebar-toggle.is-sidebar::ng-deep .p-button ::ng-deep path{fill:currentColor!important;stroke:currentColor!important}.tk-sidebar-layout .tk-nav-header{height:3.5rem;background-color:var(--tk-color-background-default, #ffffff);display:flex;align-items:center;justify-content:space-between;padding:0 var(--tk-spacing-padding-m, 1rem);border-bottom:1px solid var(--tk-color-border-subtle, #e4e4e4);flex-shrink:0}.tk-sidebar-layout .tk-nav-header .tk-nav-left{display:flex;align-items:center;gap:var(--tk-spacing-gap-m, 1rem)}.tk-sidebar-layout .tk-nav-header .tk-logo-header{height:1.75rem;width:auto;margin-left:var(--tk-spacing-padding-s, .5rem)}.tk-sidebar-layout .tk-nav-header .tk-nav-right{display:flex;align-items:center}.tk-sidebar-layout .tk-nav-header .tk-header-actions{display:flex;align-items:center;gap:var(--tk-spacing-gap-s, .5rem)}.tk-sidebar-layout .tk-nav-header ::ng-deep .tk-header-action-btn{background:transparent;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:var(--tk-spacing-padding-s, .5rem);color:var(--tk-color-primary-default, #16006f);border-radius:50%;transition:background-color .2s}.tk-sidebar-layout .tk-nav-header ::ng-deep .tk-header-action-btn:hover{background-color:var(--tk-color-background-soft, #f2f1f1)}.tk-sidebar-layout .tk-content{flex:1;overflow-y:auto;padding:var(--tk-spacing-padding-l, 1.25rem)}.tk-sidebar-layout.collapsed:not(.is-tablet) .tk-sidebar{width:0;border-right:none}.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .tk-pm-item-label,.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .p-panelmenu-header-label,.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .tk-pm-item-chevron,.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .p-icon{display:none!important}.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .tk-pm-item-link,.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .p-panelmenu-header{justify-content:center;padding-left:0!important;padding-right:0!important}.tk-sidebar-layout.collapsed:not(.is-tablet) ::ng-deep .tk-sidebar .tk-panel-menu .tk-pm-item-content{justify-content:center}.tk-sidebar-layout.is-tablet .tk-sidebar{position:fixed;left:0;top:0;bottom:0;z-index:1000;width:var(--tk-sidebar-width, 17.5rem)!important;transform:translate(0);box-shadow:4px 0 10px #0000001a}.tk-sidebar-layout.is-tablet.collapsed .tk-sidebar{transform:translate(-100%)}.tk-sidebar-layout.is-tablet .tk-main-container{width:100%;flex:1}.tk-sidebar-layout.is-mobile .tk-sidebar{width:100%!important;max-width:none!important}\n"] }]
+        }], propDecorators: { isCollapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCollapsed", required: false }] }], collapsedChange: [{ type: i0.Output, args: ["collapsedChange"] }], handleSidebarContentClick: [{
+                type: HostListener,
+                args: ['click', ['$event']]
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SidebarLayoutComponent, SidebarService };
+//# sourceMappingURL=tekus-design-system-components-sidebar-layout.mjs.map

package/fesm2022/tekus-design-system-components-sidebar-layout.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tekus-design-system-components-sidebar-layout.mjs","sources":["../../../projects/design-system/components/sidebar-layout/src/sidebar.service.ts","../../../projects/design-system/components/sidebar-layout/src/sidebar-layout.component.ts","../../../projects/design-system/components/sidebar-layout/src/sidebar-layout.component.html","../../../projects/design-system/components/sidebar-layout/tekus-design-system-components-sidebar-layout.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { BehaviorSubject } from 'rxjs';\n\n@Injectable({\n  providedIn: 'root',\n})\nexport class SidebarService {\n  private readonly collapsedSubject = new BehaviorSubject<boolean>(false);\n  \n  /**\n   * Observable to track the collapsed state of the sidebar.\n   */\n  isCollapsed$ = this.collapsedSubject.asObservable();\n\n  /**\n   * Toggles the collapsed state of the sidebar.\n   */\n  toggle(): void {\n    this.collapsedSubject.next(!this.collapsedSubject.value);\n  }\n\n  /**\n   * Explicitly sets the collapsed state of the sidebar.\n   * @param value True to collapse, false to expand.\n   */\n  setCollapsed(value: boolean): void {\n    this.collapsedSubject.next(value);\n  }\n\n  /**\n   * Gets the current collapsed state.\n   */\n  get isCollapsed(): boolean {\n    return this.collapsedSubject.value;\n  }\n}\n","import { ChangeDetectionStrategy, Component, inject, input, output, OnInit, OnDestroy, ChangeDetectorRef, HostListener } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { Subscription } from 'rxjs';\nimport { BreakpointObserver } from '@angular/cdk/layout';\nimport { SidebarService } from './sidebar.service';\nimport { ButtonComponent } from '@tekus/design-system/components/button';\n\n@Component({\n  selector: 'tk-sidebar-layout',\n  imports: [\n    CommonModule,\n    ButtonComponent\n  ],\n  templateUrl: './sidebar-layout.component.html',\n  styleUrl: './sidebar-layout.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SidebarLayoutComponent implements OnInit, OnDestroy {\n  private readonly sidebarService = inject(SidebarService);\n  private readonly breakpointObserver = inject(BreakpointObserver);\n  private readonly cdr = inject(ChangeDetectorRef);\n  private readonly subscription = new Subscription();\n\n  /**\n   * Breakpoint constants\n   */\n  private readonly TABLET_BREAKPOINT = '(max-width: 1023px)';\n  private readonly MOBILE_BREAKPOINT = '(max-width: 479px)';\n\n  /**\n   * Optional manual control of the collapsed state.\n   * If provided, it overrides the service state.\n   */\n  isCollapsed = input<boolean | undefined>(undefined);\n\n\n  /**\n   * Emitted when the collapsed state changes.\n   */\n  collapsedChange = output<boolean>();\n\n  /**\n   * Internal state of the sidebar.\n   */\n  collapsed = false;\n\n  /**\n   * Responsive states\n   */\n  isTablet = false;\n  isMobile = false;\n\n  ngOnInit(): void {\n    // Sync with service\n    this.subscription.add(\n      this.sidebarService.isCollapsed$.subscribe((state) => {\n        if (this.isCollapsed() === undefined) {\n          this.collapsed = state;\n          this.collapsedChange.emit(state);\n          this.cdr.markForCheck();\n        }\n      })\n    );\n\n    // Responsive breakpoints\n    this.subscription.add(\n      this.breakpointObserver\n        .observe([this.TABLET_BREAKPOINT, this.MOBILE_BREAKPOINT])\n        .subscribe((result) => {\n          const wasTablet = this.isTablet;\n          this.isTablet = result.breakpoints[this.TABLET_BREAKPOINT];\n          this.isMobile = result.breakpoints[this.MOBILE_BREAKPOINT];\n\n          // Auto-collapse when entering tablet/mobile mode (< 1024px)\n          if (this.isTablet && !wasTablet) {\n            this.sidebarService.setCollapsed(true);\n          }\n\n          // Auto-expand when returning to desktop mode (> 1024px)\n          if (!this.isTablet && wasTablet) {\n            this.sidebarService.setCollapsed(false);\n          }\n\n          this.cdr.markForCheck();\n        })\n    );\n  }\n\n  ngOnDestroy(): void {\n    this.subscription.unsubscribe();\n  }\n\n  /**\n   * Determines if the sidebar is currently collapsed.\n   */\n  get displayCollapsed(): boolean {\n    return this.isCollapsed() === undefined ? this.collapsed : this.isCollapsed()!;\n  }\n\n  /**\n   * Toggles the sidebar state.\n   */\n  toggleSidebar(): void {\n    if (this.isCollapsed() === undefined) {\n      this.sidebarService.toggle();\n    } else {\n      this.collapsedChange.emit(!this.isCollapsed());\n    }\n  }\n\n  /**\n   * Closes the sidebar explicitly.\n   */\n  closeSidebar(): void {\n    if (this.isCollapsed() === undefined) {\n      this.sidebarService.setCollapsed(true);\n    } else {\n      this.collapsedChange.emit(true);\n    }\n  }\n\n  /**\n   * Handles clicks in the sidebar content to auto-close on mobile.\n   * Using HostListener to avoid template accessibility linting on non-interactive aside.\n   */\n  @HostListener('click', ['$event'])\n  handleSidebarContentClick(event: MouseEvent): void {\n    if (!this.isMobile) return;\n\n    // Check if the click is inside the sidebar\n    const sidebar = (event.target as HTMLElement).closest('.tk-sidebar');\n    if (!sidebar) return;\n\n    const target = event.target as HTMLElement;\n    const navItem = target.closest('.tk-menu-item-link, .tk-pm-item-link, a, button');\n\n    if (navItem) {\n      // Check if it's a toggle for a sub-menu (has children)\n      const hasChildren = navItem.querySelector('.tk-menu-item-chevron, .tk-pm-item-chevron');\n      if (!hasChildren) {\n        this.closeSidebar();\n      }\n    }\n  }\n\n  /**\n   * Handles backdrop clicks to close the drawer.\n   */\n  handleBackdropClick(): void {\n    this.closeSidebar();\n  }\n}\n","<div\n  class=\"tk-sidebar-layout\"\n  [class.collapsed]=\"displayCollapsed\"\n  [class.is-tablet]=\"isTablet\"\n  [class.is-mobile]=\"isMobile\"\n>\n  <!-- Backdrop for overlay mode -->\n  @if (!displayCollapsed && isTablet) {\n    <tk-button\n      class=\"tk-sidebar-backdrop\"\n      (clicked)=\"handleBackdropClick()\"\n      aria-label=\"Close sidebar\"\n    ></tk-button>\n  }\n\n  <!-- Sidebar -->\n  <aside class=\"tk-sidebar\">\n    @if (!displayCollapsed) {\n      <div class=\"tk-sidebar-header\">\n        <img\n          src=\"assets/img/tk-logo-normal-light.svg\"\n          alt=\"Tekus Logo\"\n          class=\"tk-logo-expanded\"\n        />\n        <tk-button\n          class=\"tk-sidebar-toggle is-sidebar\"\n          (clicked)=\"toggleSidebar()\"\n          severity=\"secondary\"\n          variant=\"text\"\n          icon=\"arrow-left\"\n        ></tk-button>\n      </div>\n    }\n\n    <ng-content select=\"[sidebar-content]\"></ng-content>\n  </aside>\n\n  <!-- Main Content -->\n  <div class=\"tk-main-container\">\n    <header class=\"tk-nav-header\">\n      <div class=\"tk-nav-left\">\n        @if (displayCollapsed || isTablet) {\n          <tk-button\n            class=\"tk-sidebar-toggle\"\n            (clicked)=\"toggleSidebar()\"\n            severity=\"secondary\"\n            variant=\"text\"\n            icon=\"bars\"\n          ></tk-button>\n          <img\n            src=\"assets/img/tk-logo-normal-dark.svg\"\n            alt=\"Tekus Logo\"\n            class=\"tk-logo-header\"\n          />\n        }\n      </div>\n\n      <div class=\"tk-nav-right\">\n        <div class=\"tk-header-actions\">\n          <ng-content select=\"[header-actions]\"></ng-content>\n        </div>\n      </div>\n    </header>\n\n    <main class=\"tk-content\">\n      <ng-content></ng-content>\n    </main>\n  </div>\n</div>\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-table.mjs

@@ -183,7 +183,7 @@ class TableComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: TableComponent, isStandalone: true, selector: "tk-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange" }, viewQueries: [{ propertyName: "tableRef", first: true, predicate: ["tableRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<p-table #tableRef [selection]=\"selection()\" (selectionChange)=\"updateSelection($any($event))\"\n  [selectionMode]=\"selectionMode()\" [dataKey]=\"dataKey()\" [value]=\"internalData()\" [customSort]=\"true\"\n  (sortFunction)=\"customSort($event)\" [tableStyle]=\"{ 'min-width': '60rem' }\" responsiveLayout=\"scroll\">\n  <!-- HEADER -->\n  <ng-template pTemplate=\"header\">\n    <tr>\n      @for (col of columns(); track col.header) {\n      <th [id]=\"col.field\" [style.width]=\"col.width\" [pSortableColumn]=\"col.sortable ? col.field : undefined\">\n        <div class=\"tk-table__header-content\">\n          @if (col.type === 'selection' && selectionMode() === 'multiple') {\n          <div class=\"tk-table__actions hide-validation-messages\">\n            <tk-checkbox [binary]=\"true\" [model]=\"isAllSelected()\" [indeterminate]=\"isPartiallySelected()\"\n              (click)=\"$event.stopPropagation()\" (keypress)=\"$event.stopPropagation()\"\n              (modelChange)=\"toggleAll($event)\"></tk-checkbox>\n          </div>\n          } @else if (col.type !== 'selection') {\n          {{ col.header }}\n          @if (col.sortable) {\n          <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n          }\n          }\n        </div>\n      </th>\n      }\n    </tr>\n  </ng-template>\n\n  <!-- BODY -->\n  <ng-template pTemplate=\"body\" let-row>\n    <tr [pSelectableRow]=\"row\">\n      @for (col of columns(); track col.header) {\n      <!-- SELECTION -->\n      @if (col.type === 'selection') {\n      <td>\n        @if (selectionMode() === 'multiple') {\n        <tk-checkbox [model]=\"selection()\" [value]=\"row\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\" (modelChange)=\"updateSelection($any($event))\"></tk-checkbox>\n        }\n      </td>\n      }\n\n      <!-- CHECKBOX (Boolean field) -->\n      @if (col.type === 'checkbox') {\n      <td>\n        <tk-checkbox [binary]=\"true\" [(model)]=\"row[col.field!]\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\"></tk-checkbox>\n      </td>\n      }\n\n      <!-- TEXT (default) -->\n      @if (!col.type || col.type === 'text') {\n      <td>{{ row[col.field!] }}</td>\n      }\n\n      <!-- TAG -->\n      @if (col.type === 'tag') {\n      <td>\n        <tk-tag [value]=\"row[col.field!]\" [severity]=\"col.tagSeverity!(row)\" />\n      </td>\n      }\n\n      <!-- ACTIONS -->\n      @if (col.type === 'actions') {\n      <td>\n        <div class=\"tk-table__actions\">\n          @for (action of col.actions!; track action.icon) {\n          <tk-button [icon]=\"action.icon\" severity=\"secondary\" (click)=\"$event.stopPropagation()\"\n            (keypress)=\"$event.stopPropagation()\" (clicked)=\"action?.action(row)\"></tk-button>\n          }\n        </div>\n      </td>\n      }\n      }\n    </tr>\n  </ng-template>\n</p-table>", styles: [":host ::ng-deep .p-datatable-column-sorted{background-color:var(--tk-primary-100, #b7b0d2)!important;color:var(--tk-primary-700, #10004f)!important}:host ::ng-deep .p-datatable-column-sorted svg{color:var(--tk-primary-700, #10004f)!important}:host ::ng-deep .p-datatable-sortable-column{font-size:var(--tk-font-size-sm, .875rem);color:var(--tk-surface-950, #191a1b);padding:.625rem}:host ::ng-deep .p-datatable-sortable-column svg{color:var(--tk-surface-500, #424243)}:host ::ng-deep .p-button-secondary{background-color:var(--tk-surface-0, #ffffff);border:1px solid var(--tk-surface-0, #ffffff)}:host ::ng-deep .p-datatable-tbody td{color:var(--tk-surface-950, #191a1b);font-size:var(--tk-font-size-sm, .875rem);padding:.625rem}.tk-table__actions{display:flex;gap:var(--tk-spacing-gap-s, .25rem)}\n"], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i1.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "component", type: i1.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "ngmodule", type: TagModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: TagComponent, selector: "tk-tag", inputs: ["value", "severity", "truncationLimit"] }, { kind: "component", type: ButtonComponent, selector: "tk-button", inputs: ["label", "disabled", "type", "severity", "variant", "link", "icon", "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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: TableComponent, isStandalone: true, selector: "tk-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange" }, viewQueries: [{ propertyName: "tableRef", first: true, predicate: ["tableRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<p-table #tableRef [selection]=\"selection()\" (selectionChange)=\"updateSelection($any($event))\"\n  [selectionMode]=\"selectionMode()\" [dataKey]=\"dataKey()\" [value]=\"internalData()\" [customSort]=\"true\"\n  (sortFunction)=\"customSort($event)\" [tableStyle]=\"{ 'min-width': '60rem' }\" responsiveLayout=\"scroll\">\n  <!-- HEADER -->\n  <ng-template pTemplate=\"header\">\n    <tr>\n      @for (col of columns(); track col.header) {\n      <th [id]=\"col.field\" [style.width]=\"col.width\" [pSortableColumn]=\"col.sortable ? col.field : undefined\">\n        <div class=\"tk-table__header-content\">\n          @if (col.type === 'selection' && selectionMode() === 'multiple') {\n          <div class=\"tk-table__actions hide-validation-messages\">\n            <tk-checkbox [binary]=\"true\" [model]=\"isAllSelected()\" [indeterminate]=\"isPartiallySelected()\"\n              (click)=\"$event.stopPropagation()\" (keypress)=\"$event.stopPropagation()\"\n              (modelChange)=\"toggleAll($event)\"></tk-checkbox>\n          </div>\n          } @else if (col.type !== 'selection') {\n          {{ col.header }}\n          @if (col.sortable) {\n          <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n          }\n          }\n        </div>\n      </th>\n      }\n    </tr>\n  </ng-template>\n\n  <!-- BODY -->\n  <ng-template pTemplate=\"body\" let-row>\n    <tr [pSelectableRow]=\"row\">\n      @for (col of columns(); track col.header) {\n      <!-- SELECTION -->\n      @if (col.type === 'selection') {\n      <td>\n        @if (selectionMode() === 'multiple') {\n        <tk-checkbox [model]=\"selection()\" [value]=\"row\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\" (modelChange)=\"updateSelection($any($event))\"></tk-checkbox>\n        }\n      </td>\n      }\n\n      <!-- CHECKBOX (Boolean field) -->\n      @if (col.type === 'checkbox') {\n      <td>\n        <tk-checkbox [binary]=\"true\" [(model)]=\"row[col.field!]\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\"></tk-checkbox>\n      </td>\n      }\n\n      <!-- TEXT (default) -->\n      @if (!col.type || col.type === 'text') {\n      <td>{{ row[col.field!] }}</td>\n      }\n\n      <!-- TAG -->\n      @if (col.type === 'tag') {\n      <td>\n        <tk-tag [value]=\"row[col.field!]\" [severity]=\"col.tagSeverity!(row)\" />\n      </td>\n      }\n\n      <!-- ACTIONS -->\n      @if (col.type === 'actions') {\n      <td>\n        <div class=\"tk-table__actions\">\n          @for (action of col.actions!; track action.icon) {\n          <tk-button [icon]=\"action.icon\" severity=\"secondary\" (click)=\"$event.stopPropagation()\"\n            (keypress)=\"$event.stopPropagation()\" (clicked)=\"action?.action(row)\"></tk-button>\n          }\n        </div>\n      </td>\n      }\n      }\n    </tr>\n  </ng-template>\n</p-table>", styles: [":host ::ng-deep .p-datatable-column-sorted{background-color:var(--tk-primary-100, #b7b0d2)!important;color:var(--tk-primary-700, #10004f)!important}:host ::ng-deep .p-datatable-column-sorted svg{color:var(--tk-primary-700, #10004f)!important}:host ::ng-deep .p-datatable-sortable-column{font-size:var(--tk-font-size-sm, .875rem);color:var(--tk-surface-950, #191a1b);padding:.625rem}:host ::ng-deep .p-datatable-sortable-column svg{color:var(--tk-surface-500, #424243)}:host ::ng-deep .p-button-secondary{background-color:var(--tk-surface-0, #ffffff);border:1px solid var(--tk-surface-0, #ffffff)}:host ::ng-deep .p-datatable-tbody td{color:var(--tk-surface-950, #191a1b);font-size:var(--tk-font-size-sm, .875rem);padding:.625rem}.tk-table__actions{display:flex;gap:var(--tk-spacing-gap-xs, .25rem)}\n"], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i1.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "component", type: i1.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "ngmodule", type: TagModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: TagComponent, selector: "tk-tag", inputs: ["value", "severity", "truncationLimit"] }, { kind: "component", type: ButtonComponent, selector: "tk-button", inputs: ["label", "disabled", "type", "severity", "variant", "link", "icon", "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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
@@ -194,7 +194,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImpor
                         TagComponent,
                         ButtonComponent,
                         CheckboxComponent,
-                    ], template: "<p-table #tableRef [selection]=\"selection()\" (selectionChange)=\"updateSelection($any($event))\"\n  [selectionMode]=\"selectionMode()\" [dataKey]=\"dataKey()\" [value]=\"internalData()\" [customSort]=\"true\"\n  (sortFunction)=\"customSort($event)\" [tableStyle]=\"{ 'min-width': '60rem' }\" responsiveLayout=\"scroll\">\n  <!-- HEADER -->\n  <ng-template pTemplate=\"header\">\n    <tr>\n      @for (col of columns(); track col.header) {\n      <th [id]=\"col.field\" [style.width]=\"col.width\" [pSortableColumn]=\"col.sortable ? col.field : undefined\">\n        <div class=\"tk-table__header-content\">\n          @if (col.type === 'selection' && selectionMode() === 'multiple') {\n          <div class=\"tk-table__actions hide-validation-messages\">\n            <tk-checkbox [binary]=\"true\" [model]=\"isAllSelected()\" [indeterminate]=\"isPartiallySelected()\"\n              (click)=\"$event.stopPropagation()\" (keypress)=\"$event.stopPropagation()\"\n              (modelChange)=\"toggleAll($event)\"></tk-checkbox>\n          </div>\n          } @else if (col.type !== 'selection') {\n          {{ col.header }}\n          @if (col.sortable) {\n          <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n          }\n          }\n        </div>\n      </th>\n      }\n    </tr>\n  </ng-template>\n\n  <!-- BODY -->\n  <ng-template pTemplate=\"body\" let-row>\n    <tr [pSelectableRow]=\"row\">\n      @for (col of columns(); track col.header) {\n      <!-- SELECTION -->\n      @if (col.type === 'selection') {\n      <td>\n        @if (selectionMode() === 'multiple') {\n        <tk-checkbox [model]=\"selection()\" [value]=\"row\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\" (modelChange)=\"updateSelection($any($event))\"></tk-checkbox>\n        }\n      </td>\n      }\n\n      <!-- CHECKBOX (Boolean field) -->\n      @if (col.type === 'checkbox') {\n      <td>\n        <tk-checkbox [binary]=\"true\" [(model)]=\"row[col.field!]\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\"></tk-checkbox>\n      </td>\n      }\n\n      <!-- TEXT (default) -->\n      @if (!col.type || col.type === 'text') {\n      <td>{{ row[col.field!] }}</td>\n      }\n\n      <!-- TAG -->\n      @if (col.type === 'tag') {\n      <td>\n        <tk-tag [value]=\"row[col.field!]\" [severity]=\"col.tagSeverity!(row)\" />\n      </td>\n      }\n\n      <!-- ACTIONS -->\n      @if (col.type === 'actions') {\n      <td>\n        <div class=\"tk-table__actions\">\n          @for (action of col.actions!; track action.icon) {\n          <tk-button [icon]=\"action.icon\" severity=\"secondary\" (click)=\"$event.stopPropagation()\"\n            (keypress)=\"$event.stopPropagation()\" (clicked)=\"action?.action(row)\"></tk-button>\n          }\n        </div>\n      </td>\n      }\n      }\n    </tr>\n  </ng-template>\n</p-table>", styles: [":host ::ng-deep .p-datatable-column-sorted{background-color:var(--tk-primary-100, #b7b0d2)!important;color:var(--tk-primary-700, #10004f)!important}:host ::ng-deep .p-datatable-column-sorted svg{color:var(--tk-primary-700, #10004f)!important}:host ::ng-deep .p-datatable-sortable-column{font-size:var(--tk-font-size-sm, .875rem);color:var(--tk-surface-950, #191a1b);padding:.625rem}:host ::ng-deep .p-datatable-sortable-column svg{color:var(--tk-surface-500, #424243)}:host ::ng-deep .p-button-secondary{background-color:var(--tk-surface-0, #ffffff);border:1px solid var(--tk-surface-0, #ffffff)}:host ::ng-deep .p-datatable-tbody td{color:var(--tk-surface-950, #191a1b);font-size:var(--tk-font-size-sm, .875rem);padding:.625rem}.tk-table__actions{display:flex;gap:var(--tk-spacing-gap-s, .25rem)}\n"] }]
+                    ], template: "<p-table #tableRef [selection]=\"selection()\" (selectionChange)=\"updateSelection($any($event))\"\n  [selectionMode]=\"selectionMode()\" [dataKey]=\"dataKey()\" [value]=\"internalData()\" [customSort]=\"true\"\n  (sortFunction)=\"customSort($event)\" [tableStyle]=\"{ 'min-width': '60rem' }\" responsiveLayout=\"scroll\">\n  <!-- HEADER -->\n  <ng-template pTemplate=\"header\">\n    <tr>\n      @for (col of columns(); track col.header) {\n      <th [id]=\"col.field\" [style.width]=\"col.width\" [pSortableColumn]=\"col.sortable ? col.field : undefined\">\n        <div class=\"tk-table__header-content\">\n          @if (col.type === 'selection' && selectionMode() === 'multiple') {\n          <div class=\"tk-table__actions hide-validation-messages\">\n            <tk-checkbox [binary]=\"true\" [model]=\"isAllSelected()\" [indeterminate]=\"isPartiallySelected()\"\n              (click)=\"$event.stopPropagation()\" (keypress)=\"$event.stopPropagation()\"\n              (modelChange)=\"toggleAll($event)\"></tk-checkbox>\n          </div>\n          } @else if (col.type !== 'selection') {\n          {{ col.header }}\n          @if (col.sortable) {\n          <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n          }\n          }\n        </div>\n      </th>\n      }\n    </tr>\n  </ng-template>\n\n  <!-- BODY -->\n  <ng-template pTemplate=\"body\" let-row>\n    <tr [pSelectableRow]=\"row\">\n      @for (col of columns(); track col.header) {\n      <!-- SELECTION -->\n      @if (col.type === 'selection') {\n      <td>\n        @if (selectionMode() === 'multiple') {\n        <tk-checkbox [model]=\"selection()\" [value]=\"row\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\" (modelChange)=\"updateSelection($any($event))\"></tk-checkbox>\n        }\n      </td>\n      }\n\n      <!-- CHECKBOX (Boolean field) -->\n      @if (col.type === 'checkbox') {\n      <td>\n        <tk-checkbox [binary]=\"true\" [(model)]=\"row[col.field!]\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\"></tk-checkbox>\n      </td>\n      }\n\n      <!-- TEXT (default) -->\n      @if (!col.type || col.type === 'text') {\n      <td>{{ row[col.field!] }}</td>\n      }\n\n      <!-- TAG -->\n      @if (col.type === 'tag') {\n      <td>\n        <tk-tag [value]=\"row[col.field!]\" [severity]=\"col.tagSeverity!(row)\" />\n      </td>\n      }\n\n      <!-- ACTIONS -->\n      @if (col.type === 'actions') {\n      <td>\n        <div class=\"tk-table__actions\">\n          @for (action of col.actions!; track action.icon) {\n          <tk-button [icon]=\"action.icon\" severity=\"secondary\" (click)=\"$event.stopPropagation()\"\n            (keypress)=\"$event.stopPropagation()\" (clicked)=\"action?.action(row)\"></tk-button>\n          }\n        </div>\n      </td>\n      }\n      }\n    </tr>\n  </ng-template>\n</p-table>", styles: [":host ::ng-deep .p-datatable-column-sorted{background-color:var(--tk-primary-100, #b7b0d2)!important;color:var(--tk-primary-700, #10004f)!important}:host ::ng-deep .p-datatable-column-sorted svg{color:var(--tk-primary-700, #10004f)!important}:host ::ng-deep .p-datatable-sortable-column{font-size:var(--tk-font-size-sm, .875rem);color:var(--tk-surface-950, #191a1b);padding:.625rem}:host ::ng-deep .p-datatable-sortable-column svg{color:var(--tk-surface-500, #424243)}:host ::ng-deep .p-button-secondary{background-color:var(--tk-surface-0, #ffffff);border:1px solid var(--tk-surface-0, #ffffff)}:host ::ng-deep .p-datatable-tbody td{color:var(--tk-surface-950, #191a1b);font-size:var(--tk-font-size-sm, .875rem);padding:.625rem}.tk-table__actions{display:flex;gap:var(--tk-spacing-gap-xs, .25rem)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], tableRef: [{ type: i0.ViewChild, args: ['tableRef', { isSignal: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }, { type: i0.Output, args: ["selectionChange"] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }] } });
 
 /**

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

@@ -1 +1 @@
-{"version":3,"file":"tekus-design-system-components-table.mjs","sources":["../../../projects/design-system/components/table/src/table.component.ts","../../../projects/design-system/components/table/src/table.component.html","../../../projects/design-system/components/table/tekus-design-system-components-table.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, effect, input, model, signal, viewChild } from '@angular/core';\nimport { Table, TableModule } from 'primeng/table';\nimport { TagModule } from 'primeng/tag';\nimport { ButtonModule } from 'primeng/button';\nimport { TableColumn } from './table.interface';\nimport { TagComponent } from '@tekus/design-system/components/tag';\nimport { SortEvent } from 'primeng/api';\nimport { ButtonComponent } from '@tekus/design-system/components/button';\nimport { CheckboxComponent } from '@tekus/design-system/components/checkbox';\n\n@Component({\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  selector: 'tk-table',\n  imports: [\n    TableModule,\n    TagModule,\n    ButtonModule,\n    TagComponent,\n    ButtonComponent,\n    CheckboxComponent,\n  ],\n  templateUrl: './table.component.html',\n  styleUrl: './table.component.scss',\n})\n/**\n * @component TableComponent\n * @description\n * Generic table wrapper around PrimeNG Table component.\n * Displays tabular data with configurable columns and support for custom rendering via template.\n *\n * @usage\n * ```html\n * <tk-table [data]=\"items\" [columns]=\"columnConfig\"></tk-table>\n * ```\n */\nexport class TableComponent<T = unknown> {\n  /**\n   * @property {InputSignal<T[]>} data\n   * @description\n   * Array of data objects to display in the table rows.\n   * Each object corresponds to one row; properties are mapped to columns via the `columns` input.\n   *\n   * @default []\n   *\n   * @example\n   * [data]=\"[\n   *   { id: 1, name: 'John', status: 'active' },\n   *   { id: 2, name: 'Jane', status: 'inactive' }\n   * ]\"\n   */\n  data = input<T[]>([]);\n\n  /**\n   * @property {viewChild} tableRef\n   * @description\n   * Reference to the PrimeNG Table component instance.\n   * Used to access table methods and properties directly.\n   */\n  readonly tableRef = viewChild<Table>('tableRef');\n\n  /**\n   * @property {InputSignal<TableColumn<T>[]>} columns\n   * @description\n   * Array of column definitions that describe how to render each column.\n   * Each column object specifies the field name, header label, and optional rendering behavior.\n   *\n   * @default []\n   *\n   * @example\n   * [columns]=\"[\n   *   { field: 'id', header: 'ID' },\n   *   { field: 'name', header: 'Name' },\n   *   { field: 'status', header: 'Status', renderAs: 'tag' }\n   * ]\"\n   */\n  columns = input<TableColumn<T>[]>([]);\n\n  /**\n   * @property {InputSignal<'single' | 'multiple' | undefined>} selectionMode\n   * @description\n   * Selection mode of the table.\n   */\n  selectionMode = input<'single' | 'multiple' | undefined>(undefined);\n\n  /**\n   * @property {ModelSignal<any[]>} selection\n   * @description\n   * Selected row(s) in the table.\n   */\n  selection = model<T[]>([]);\n\n  /**\n   * @property {InputSignal<string | undefined>} dataKey\n   * @description\n   * Property name to uniquely identify a row.\n   */\n  dataKey = input<string | undefined>(undefined);\n\n  readonly initialData = signal<T[]>([]);\n  readonly internalData = signal<T[]>([]);\n  readonly isSorted = signal<boolean | null>(null);\n\n  /**\n   * @computed isAllSelected\n   * @description\n   * Returns true if all visible rows are selected.\n   */\n  isAllSelected = computed(() => {\n    const data = this.internalData();\n    const selected = this.selection();\n    if (data.length === 0 || selected.length === 0) return false;\n\n    // We strictly use full objects for selection now.\n    return data.every(row => selected.includes(row));\n  });\n\n  /**\n   * @computed isPartiallySelected\n   * @description\n   * Returns true if some but not all rows are selected.\n   */\n  isPartiallySelected = computed(() => {\n    const data = this.internalData();\n    const selected = this.selection();\n    if (data.length === 0 || selected.length === 0) return false;\n\n    const allSelected = this.isAllSelected();\n    return !allSelected && selected.length > 0;\n  });\n\n  constructor() {\n    /**\n     * @effect data → initialData sync\n     * @description\n     * Whenever the data input changes, update initialData and reset sort state.\n     */\n    effect(() => {\n      this.internalData.set([...this.data()]);\n      this.initialData.set([...this.data()]);\n    });\n  }\n\n  /**\n   * @method toggleAll\n   * @description\n   * Toggles selection of all visible rows using full objects.\n   * @param checked {unknown}\n   */\n  toggleAll(checked: unknown) {\n    if (checked) {\n      this.selection.set([...this.internalData()]);\n    } else {\n      this.selection.set([]);\n    }\n  }\n\n  /**\n   * @method updateSelection\n   * @description\n   * Updates row selection state from checkbox interaction.\n   * @param value {any[]}\n   */\n  updateSelection(value: T[]) {\n    this.selection.set([...value]);\n  }\n\n  customSort(event: SortEvent) {\n    if (this.isSorted() === null || this.isSorted() === undefined) {\n      this.isSorted.set(true);\n      this.sortTableData(event);\n    } else if (this.isSorted()) {\n      this.isSorted.set(false);\n      this.sortTableData(event);\n    } else {\n      this.isSorted.set(null);\n      this.internalData.set([...this.initialData()]);\n      this.tableRef()?.reset();\n    }\n  }\n\n  sortTableData(event: SortEvent) {\n    if (!event.data || !event.field) return;\n\n    event.data.sort((data1, data2) => {\n      const value1 = data1[event.field!];\n      const value2 = data2[event.field!];\n      let result = null;\n      if (value1 == null && value2 != null) result = -1;\n      else if (value1 != null && value2 == null) result = 1;\n      else if (value1 == null && value2 == null) result = 0;\n      else if (typeof value1 === 'string' && typeof value2 === 'string')\n        result = value1.localeCompare(value2);\n      else if (value1 < value2) {\n        result = -1;\n      } else if (value1 > value2) {\n        result = 1;\n      } else {\n        result = 0;\n      }\n\n      return (event.order ?? 1) * result;\n    });\n  }\n}\n","<p-table #tableRef [selection]=\"selection()\" (selectionChange)=\"updateSelection($any($event))\"\n  [selectionMode]=\"selectionMode()\" [dataKey]=\"dataKey()\" [value]=\"internalData()\" [customSort]=\"true\"\n  (sortFunction)=\"customSort($event)\" [tableStyle]=\"{ 'min-width': '60rem' }\" responsiveLayout=\"scroll\">\n  <!-- HEADER -->\n  <ng-template pTemplate=\"header\">\n    <tr>\n      @for (col of columns(); track col.header) {\n      <th [id]=\"col.field\" [style.width]=\"col.width\" [pSortableColumn]=\"col.sortable ? col.field : undefined\">\n        <div class=\"tk-table__header-content\">\n          @if (col.type === 'selection' && selectionMode() === 'multiple') {\n          <div class=\"tk-table__actions hide-validation-messages\">\n            <tk-checkbox [binary]=\"true\" [model]=\"isAllSelected()\" [indeterminate]=\"isPartiallySelected()\"\n              (click)=\"$event.stopPropagation()\" (keypress)=\"$event.stopPropagation()\"\n              (modelChange)=\"toggleAll($event)\"></tk-checkbox>\n          </div>\n          } @else if (col.type !== 'selection') {\n          {{ col.header }}\n          @if (col.sortable) {\n          <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n          }\n          }\n        </div>\n      </th>\n      }\n    </tr>\n  </ng-template>\n\n  <!-- BODY -->\n  <ng-template pTemplate=\"body\" let-row>\n    <tr [pSelectableRow]=\"row\">\n      @for (col of columns(); track col.header) {\n      <!-- SELECTION -->\n      @if (col.type === 'selection') {\n      <td>\n        @if (selectionMode() === 'multiple') {\n        <tk-checkbox [model]=\"selection()\" [value]=\"row\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\" (modelChange)=\"updateSelection($any($event))\"></tk-checkbox>\n        }\n      </td>\n      }\n\n      <!-- CHECKBOX (Boolean field) -->\n      @if (col.type === 'checkbox') {\n      <td>\n        <tk-checkbox [binary]=\"true\" [(model)]=\"row[col.field!]\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\"></tk-checkbox>\n      </td>\n      }\n\n      <!-- TEXT (default) -->\n      @if (!col.type || col.type === 'text') {\n      <td>{{ row[col.field!] }}</td>\n      }\n\n      <!-- TAG -->\n      @if (col.type === 'tag') {\n      <td>\n        <tk-tag [value]=\"row[col.field!]\" [severity]=\"col.tagSeverity!(row)\" />\n      </td>\n      }\n\n      <!-- ACTIONS -->\n      @if (col.type === 'actions') {\n      <td>\n        <div class=\"tk-table__actions\">\n          @for (action of col.actions!; track action.icon) {\n          <tk-button [icon]=\"action.icon\" severity=\"secondary\" (click)=\"$event.stopPropagation()\"\n            (keypress)=\"$event.stopPropagation()\" (clicked)=\"action?.action(row)\"></tk-button>\n          }\n        </div>\n      </td>\n      }\n      }\n    </tr>\n  </ng-template>\n</p-table>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"tekus-design-system-components-table.mjs","sources":["../../../projects/design-system/components/table/src/table.component.ts","../../../projects/design-system/components/table/src/table.component.html","../../../projects/design-system/components/table/tekus-design-system-components-table.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, effect, input, model, signal, viewChild } from '@angular/core';\nimport { Table, TableModule } from 'primeng/table';\nimport { TagModule } from 'primeng/tag';\nimport { ButtonModule } from 'primeng/button';\nimport { TableColumn } from './table.interface';\nimport { TagComponent } from '@tekus/design-system/components/tag';\nimport { SortEvent } from 'primeng/api';\nimport { ButtonComponent } from '@tekus/design-system/components/button';\nimport { CheckboxComponent } from '@tekus/design-system/components/checkbox';\n\n@Component({\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  selector: 'tk-table',\n  imports: [\n    TableModule,\n    TagModule,\n    ButtonModule,\n    TagComponent,\n    ButtonComponent,\n    CheckboxComponent,\n  ],\n  templateUrl: './table.component.html',\n  styleUrl: './table.component.scss',\n})\n/**\n * @component TableComponent\n * @description\n * Generic table wrapper around PrimeNG Table component.\n * Displays tabular data with configurable columns and support for custom rendering via template.\n *\n * @usage\n * ```html\n * <tk-table [data]=\"items\" [columns]=\"columnConfig\"></tk-table>\n * ```\n */\nexport class TableComponent<T = unknown> {\n  /**\n   * @property {InputSignal<T[]>} data\n   * @description\n   * Array of data objects to display in the table rows.\n   * Each object corresponds to one row; properties are mapped to columns via the `columns` input.\n   *\n   * @default []\n   *\n   * @example\n   * [data]=\"[\n   *   { id: 1, name: 'John', status: 'active' },\n   *   { id: 2, name: 'Jane', status: 'inactive' }\n   * ]\"\n   */\n  data = input<T[]>([]);\n\n  /**\n   * @property {viewChild} tableRef\n   * @description\n   * Reference to the PrimeNG Table component instance.\n   * Used to access table methods and properties directly.\n   */\n  readonly tableRef = viewChild<Table>('tableRef');\n\n  /**\n   * @property {InputSignal<TableColumn<T>[]>} columns\n   * @description\n   * Array of column definitions that describe how to render each column.\n   * Each column object specifies the field name, header label, and optional rendering behavior.\n   *\n   * @default []\n   *\n   * @example\n   * [columns]=\"[\n   *   { field: 'id', header: 'ID' },\n   *   { field: 'name', header: 'Name' },\n   *   { field: 'status', header: 'Status', renderAs: 'tag' }\n   * ]\"\n   */\n  columns = input<TableColumn<T>[]>([]);\n\n  /**\n   * @property {InputSignal<'single' | 'multiple' | undefined>} selectionMode\n   * @description\n   * Selection mode of the table.\n   */\n  selectionMode = input<'single' | 'multiple' | undefined>(undefined);\n\n  /**\n   * @property {ModelSignal<any[]>} selection\n   * @description\n   * Selected row(s) in the table.\n   */\n  selection = model<T[]>([]);\n\n  /**\n   * @property {InputSignal<string | undefined>} dataKey\n   * @description\n   * Property name to uniquely identify a row.\n   */\n  dataKey = input<string | undefined>(undefined);\n\n  readonly initialData = signal<T[]>([]);\n  readonly internalData = signal<T[]>([]);\n  readonly isSorted = signal<boolean | null>(null);\n\n  /**\n   * @computed isAllSelected\n   * @description\n   * Returns true if all visible rows are selected.\n   */\n  isAllSelected = computed(() => {\n    const data = this.internalData();\n    const selected = this.selection();\n    if (data.length === 0 || selected.length === 0) return false;\n\n    // We strictly use full objects for selection now.\n    return data.every(row => selected.includes(row));\n  });\n\n  /**\n   * @computed isPartiallySelected\n   * @description\n   * Returns true if some but not all rows are selected.\n   */\n  isPartiallySelected = computed(() => {\n    const data = this.internalData();\n    const selected = this.selection();\n    if (data.length === 0 || selected.length === 0) return false;\n\n    const allSelected = this.isAllSelected();\n    return !allSelected && selected.length > 0;\n  });\n\n  constructor() {\n    /**\n     * @effect data → initialData sync\n     * @description\n     * Whenever the data input changes, update initialData and reset sort state.\n     */\n    effect(() => {\n      this.internalData.set([...this.data()]);\n      this.initialData.set([...this.data()]);\n    });\n  }\n\n  /**\n   * @method toggleAll\n   * @description\n   * Toggles selection of all visible rows using full objects.\n   * @param checked {unknown}\n   */\n  toggleAll(checked: unknown) {\n    if (checked) {\n      this.selection.set([...this.internalData()]);\n    } else {\n      this.selection.set([]);\n    }\n  }\n\n  /**\n   * @method updateSelection\n   * @description\n   * Updates row selection state from checkbox interaction.\n   * @param value {any[]}\n   */\n  updateSelection(value: T[]) {\n    this.selection.set([...value]);\n  }\n\n  customSort(event: SortEvent) {\n    if (this.isSorted() === null || this.isSorted() === undefined) {\n      this.isSorted.set(true);\n      this.sortTableData(event);\n    } else if (this.isSorted()) {\n      this.isSorted.set(false);\n      this.sortTableData(event);\n    } else {\n      this.isSorted.set(null);\n      this.internalData.set([...this.initialData()]);\n      this.tableRef()?.reset();\n    }\n  }\n\n  sortTableData(event: SortEvent) {\n    if (!event.data || !event.field) return;\n\n    event.data.sort((data1, data2) => {\n      const value1 = data1[event.field!];\n      const value2 = data2[event.field!];\n      let result = null;\n      if (value1 == null && value2 != null) result = -1;\n      else if (value1 != null && value2 == null) result = 1;\n      else if (value1 == null && value2 == null) result = 0;\n      else if (typeof value1 === 'string' && typeof value2 === 'string')\n        result = value1.localeCompare(value2);\n      else if (value1 < value2) {\n        result = -1;\n      } else if (value1 > value2) {\n        result = 1;\n      } else {\n        result = 0;\n      }\n\n      return (event.order ?? 1) * result;\n    });\n  }\n}\n","<p-table #tableRef [selection]=\"selection()\" (selectionChange)=\"updateSelection($any($event))\"\n  [selectionMode]=\"selectionMode()\" [dataKey]=\"dataKey()\" [value]=\"internalData()\" [customSort]=\"true\"\n  (sortFunction)=\"customSort($event)\" [tableStyle]=\"{ 'min-width': '60rem' }\" responsiveLayout=\"scroll\">\n  <!-- HEADER -->\n  <ng-template pTemplate=\"header\">\n    <tr>\n      @for (col of columns(); track col.header) {\n      <th [id]=\"col.field\" [style.width]=\"col.width\" [pSortableColumn]=\"col.sortable ? col.field : undefined\">\n        <div class=\"tk-table__header-content\">\n          @if (col.type === 'selection' && selectionMode() === 'multiple') {\n          <div class=\"tk-table__actions hide-validation-messages\">\n            <tk-checkbox [binary]=\"true\" [model]=\"isAllSelected()\" [indeterminate]=\"isPartiallySelected()\"\n              (click)=\"$event.stopPropagation()\" (keypress)=\"$event.stopPropagation()\"\n              (modelChange)=\"toggleAll($event)\"></tk-checkbox>\n          </div>\n          } @else if (col.type !== 'selection') {\n          {{ col.header }}\n          @if (col.sortable) {\n          <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n          }\n          }\n        </div>\n      </th>\n      }\n    </tr>\n  </ng-template>\n\n  <!-- BODY -->\n  <ng-template pTemplate=\"body\" let-row>\n    <tr [pSelectableRow]=\"row\">\n      @for (col of columns(); track col.header) {\n      <!-- SELECTION -->\n      @if (col.type === 'selection') {\n      <td>\n        @if (selectionMode() === 'multiple') {\n        <tk-checkbox [model]=\"selection()\" [value]=\"row\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\" (modelChange)=\"updateSelection($any($event))\"></tk-checkbox>\n        }\n      </td>\n      }\n\n      <!-- CHECKBOX (Boolean field) -->\n      @if (col.type === 'checkbox') {\n      <td>\n        <tk-checkbox [binary]=\"true\" [(model)]=\"row[col.field!]\" (click)=\"$event.stopPropagation()\"\n          (keypress)=\"$event.stopPropagation()\"></tk-checkbox>\n      </td>\n      }\n\n      <!-- TEXT (default) -->\n      @if (!col.type || col.type === 'text') {\n      <td>{{ row[col.field!] }}</td>\n      }\n\n      <!-- TAG -->\n      @if (col.type === 'tag') {\n      <td>\n        <tk-tag [value]=\"row[col.field!]\" [severity]=\"col.tagSeverity!(row)\" />\n      </td>\n      }\n\n      <!-- ACTIONS -->\n      @if (col.type === 'actions') {\n      <td>\n        <div class=\"tk-table__actions\">\n          @for (action of col.actions!; track action.icon) {\n          <tk-button [icon]=\"action.icon\" severity=\"secondary\" (click)=\"$event.stopPropagation()\"\n            (keypress)=\"$event.stopPropagation()\" (clicked)=\"action?.action(row)\"></tk-button>\n          }\n        </div>\n      </td>\n      }\n      }\n    </tr>\n  </ng-template>\n</p-table>","/**\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-textarea.mjs

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

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

@@ -1 +1 @@
-{"version":3,"file":"tekus-design-system-components-textarea.mjs","sources":["../../../projects/design-system/components/textarea/src/textarea.component.ts","../../../projects/design-system/components/textarea/src/textarea.component.html","../../../projects/design-system/components/textarea/tekus-design-system-components-textarea.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  DestroyRef,\n  input,\n  model,\n  signal,\n  computed,\n  inject,\n  OnInit,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport {\n  ControlValueAccessor,\n  FormControl,\n  ReactiveFormsModule,\n  NgControl,\n} from '@angular/forms';\nimport { FloatLabelModule } from 'primeng/floatlabel';\nimport { TextareaModule } from 'primeng/textarea';\nimport { MessageModule } from 'primeng/message';\n\n@Component({\n  selector: 'tk-textarea',\n  imports: [\n    ReactiveFormsModule,\n    TextareaModule,\n    FloatLabelModule,\n    MessageModule,\n  ],\n  templateUrl: './textarea.component.html',\n  styleUrl: './textarea.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TextareaComponent\n  implements ControlValueAccessor, OnInit\n{\n  /* ───────────── Dependency injection ───────────── */\n  private readonly ngControl = inject(NgControl, {\n    self: true,\n    optional: true,\n  });\n  private readonly destroyRef = inject(DestroyRef);\n\n  constructor() {\n    this.bindValueAccessor();\n  }\n\n  /* ───────────── Inputs / State ───────────── */\n\n  /**\n   * @property {ModelSignal<string>} value\n   * @description\n   * The value of the textarea. Supports two-way binding via signals.\n   */\n  value = model<string>('');\n\n  /**\n   * @property {InputSignal<FormControl>} control\n   * @description\n   * External FormControl used to read/set the textarea value.\n   * If not provided, an internal FormControl is created.\n   */\n  control = input<FormControl>(new FormControl(''));\n\n  /**\n   * @property {InputSignal<string>} label\n   * @description\n   * Label displayed above the textarea.\n   */\n  label = input<string>('');\n\n  /**\n   * @property {InputSignal<string>} id\n   * @description\n   * HTML id attribute for the textarea.\n   * @default 'tk-textarea'\n   */\n  id = input<string>('tk-textarea');\n\n  /**\n   * @property {InputSignal<number>} rows\n   * @description\n   * Number of visible text lines for the textarea.\n   * @default 1\n   */\n  rows = input<number>(1);\n\n  /**\n   * @property {InputSignal<number>} cols\n   * @description\n   * Visible width of the textarea in average character widths.\n   * @default 30\n   */\n  cols = input<number>(30);\n\n  /**\n   * @property {InputSignal<string>} hint\n   * @description\n   * Hint text to display below the textarea.\n   */\n  hint = input<string>('');\n\n  /**\n   * @property {InputSignal<string>} errorMessage\n   * @description\n   * Message to display when the control is invalid and touched.\n   */\n  errorMessage = input<string>('');\n\n  /**\n   * @property {InputSignal<number | null>} maxLength\n   * @description\n   * Maximum number of characters allowed in the textarea.\n   */\n  maxLength = input<number | null>(null);\n\n  /**\n   * @property {boolean} disabled\n   * @description\n   * Whether the textarea is disabled.\n   */\n  disabled = signal<boolean>(false);\n\n  /* ───────────── Derived state ───────────── */\n\n  counterText = computed(() => {\n    const limit = this.maxLength();\n    return limit ? `${this.value().length}/${limit}` : '';\n  });\n\n  /* ───────────── CVA callbacks ───────────── */\n\n  private propagateChange: (value: string) => void = () => {};\n  private propagateTouched: () => void = () => {};\n\n  /* ───────────── Internals ───────────── */\n\n  private syncingFromView = false;\n\n  /* ───────────── Lifecycle ───────────── */\n\n  ngOnInit(): void {\n    this.initializeFromControl();\n    this.listenToControlChanges();\n  }\n\n  /* ───────────── ControlValueAccessor ───────────── */\n\n  /**\n   * @method writeValue\n   * @description\n   * Writes a new value to the element.\n   * @param value The new value.\n   */\n  writeValue(value: string): void {\n    const safeValue = value ?? '';\n    this.value.set(safeValue);\n    this.control().setValue(safeValue, { emitEvent: false });\n  }\n\n  /**\n   * @method registerOnChange\n   * @description\n   * Registers a callback function that is called when the control's value changes in the UI.\n   * @param fn The callback function.\n   */\n  registerOnChange(fn: (value: string) => void): void {\n    this.propagateChange = fn;\n  }\n\n  /**\n   * @method registerOnTouched\n   * @description\n   * Registers a callback function that is called by the forms API on initialization to update the form model on blur.\n   * @param fn The callback function.\n   */\n  registerOnTouched(fn: () => void): void {\n    this.propagateTouched = fn;\n  }\n\n  /**\n   * @method setDisabledState\n   * @description\n   * Function that is called by the forms API when the control status changes to or from 'DISABLED'.\n   * @param isDisabled The disabled status to set on the element.\n   */\n  setDisabledState(isDisabled: boolean): void {\n    this.disabled.set(isDisabled);\n    if (isDisabled) {\n      this.control().disable({ emitEvent: false });\n    } else {\n      this.control().enable({ emitEvent: false });\n    }\n  }\n\n  /* ───────────── Template handlers ───────────── */\n\n  /**\n   * @method onInput\n   * @description\n   * Handles input events to update the model and notify forms.\n   * @param event The input event.\n   */\n  onInput(event: Event): void {\n    const nextValue = (event.target as HTMLTextAreaElement).value;\n    this.syncFromUserInput(nextValue);\n  }\n\n  /**\n   * @method onBlur\n   * @description\n   * Handles blur events to mark the control as touched.\n   */\n  onBlur(): void {\n    this.markControlAsTouched();\n  }\n\n  /* ───────────── Private helpers ───────────── */\n\n  private bindValueAccessor(): void {\n    if (this.ngControl) {\n      this.ngControl.valueAccessor = this;\n    }\n  }\n\n  private initializeFromControl(): void {\n    const control = this.getControl();\n\n    if (control.value !== null && control.value !== undefined) {\n      this.value.set(control.value);\n    }\n\n    this.disabled.set(control.disabled);\n  }\n\n  private listenToControlChanges(): void {\n    const control = this.getControl();\n\n    control.valueChanges\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(value => {\n        if (this.syncingFromView) return;\n        if (value !== this.value()) {\n          this.value.set(value ?? '');\n          this.propagateChange(value);\n        }\n      });\n\n    control.statusChanges\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(() => {\n        this.disabled.set(control.disabled);\n      });\n  }\n\n  private syncFromUserInput(value: string): void {\n    this.syncingFromView = true;\n\n    this.value.set(value);\n    this.propagateChange(value);\n\n    const control = this.getControl();\n    control.setValue(value);\n    control.markAsDirty();\n\n    this.syncingFromView = false;\n  }\n\n  private markControlAsTouched(): void {\n    this.propagateTouched();\n    this.getControl().markAsTouched();\n  }\n\n  private getControl(): FormControl {\n    return (this.ngControl?.control as FormControl) || this.control();\n  }\n\n  get effectiveControl(): FormControl {\n    return this.getControl();\n  }\n}\n","<p-floatlabel>\n  <div class=\"tk-textarea-wrapper\">\n    <textarea\n      pTextarea\n      [autoResize]=\"true\"\n      [id]=\"id()\"\n      [rows]=\"rows()\"\n      [cols]=\"cols()\"\n      [value]=\"value()\"\n      (input)=\"onInput($event)\"\n      (blur)=\"onBlur()\"\n      [attr.maxlength]=\"maxLength()\"\n      [disabled]=\"disabled()\"\n      [class.p-filled]=\"!!value()\"\n      [class.ng-invalid]=\"effectiveControl.invalid\"\n      [class.ng-dirty]=\"effectiveControl.dirty\"\n      [class.ng-touched]=\"effectiveControl.touched\"></textarea>\n\n    <label [for]=\"id()\">{{ label() }}</label>\n  </div>\n</p-floatlabel>\n\n<div class=\"tk-input-bottom\">\n  <div class=\"tk-input-messages\">\n    @if ((effectiveControl.invalid && (effectiveControl.dirty ||\n    effectiveControl.touched)) && errorMessage()) {\n    <p-message severity=\"error\" size=\"small\" variant=\"simple\">\n      {{ errorMessage() }}\n    </p-message>\n    } @else if (hint()) {\n    <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">\n      {{ hint() }}\n    </p-message>\n    }\n  </div>\n\n  @if (maxLength()) {\n  <p-message\n    severity=\"secondary\"\n    size=\"small\"\n    variant=\"simple\"\n    class=\"tk-character-counter\">\n    {{ counterText() }}\n  </p-message>\n  }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;MAkCa,iBAAiB,CAAA;AAU5B,IAAA,WAAA,GAAA;;AANiB,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAAC,SAAS,EAAE;AAC7C,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA,CAAC;AACe,QAAA,IAAA,CAAA,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;;AAQhD;;;;AAIG;AACH,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAS,EAAE,4EAAC;AAEzB;;;;;AAKG;QACH,IAAA,CAAA,OAAO,GAAG,KAAK,CAAc,IAAI,WAAW,CAAC,EAAE,CAAC,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,SAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAC;AAEjD;;;;AAIG;AACH,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAS,EAAE,4EAAC;AAEzB;;;;;AAKG;AACH,QAAA,IAAA,CAAA,EAAE,GAAG,KAAK,CAAS,aAAa,yEAAC;AAEjC;;;;;AAKG;AACH,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAS,CAAC,2EAAC;AAEvB;;;;;AAKG;AACH,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAS,EAAE,2EAAC;AAExB;;;;AAIG;AACH,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAS,EAAE,2EAAC;AAExB;;;;AAIG;AACH,QAAA,IAAA,CAAA,YAAY,GAAG,KAAK,CAAS,EAAE,mFAAC;AAEhC;;;;AAIG;AACH,QAAA,IAAA,CAAA,SAAS,GAAG,KAAK,CAAgB,IAAI,gFAAC;AAEtC;;;;AAIG;AACH,QAAA,IAAA,CAAA,QAAQ,GAAG,MAAM,CAAU,KAAK,+EAAC;;AAIjC,QAAA,IAAA,CAAA,WAAW,GAAG,QAAQ,CAAC,MAAK;AAC1B,YAAA,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE;AAC9B,YAAA,OAAO,KAAK,GAAG,CAAA,EAAG,IAAI,CAAC,KAAK,EAAE,CAAC,MAAM,IAAI,KAAK,CAAA,CAAE,GAAG,EAAE;AACvD,QAAA,CAAC,kFAAC;;AAIM,QAAA,IAAA,CAAA,eAAe,GAA4B,MAAK,EAAE,CAAC;AACnD,QAAA,IAAA,CAAA,gBAAgB,GAAe,MAAK,EAAE,CAAC;;QAIvC,IAAA,CAAA,eAAe,GAAG,KAAK;QA7F7B,IAAI,CAAC,iBAAiB,EAAE;IAC1B;;IAgGA,QAAQ,GAAA;QACN,IAAI,CAAC,qBAAqB,EAAE;QAC5B,IAAI,CAAC,sBAAsB,EAAE;IAC/B;;AAIA;;;;;AAKG;AACH,IAAA,UAAU,CAAC,KAAa,EAAA;AACtB,QAAA,MAAM,SAAS,GAAG,KAAK,IAAI,EAAE;AAC7B,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC;AACzB,QAAA,IAAI,CAAC,OAAO,EAAE,CAAC,QAAQ,CAAC,SAAS,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;IAC1D;AAEA;;;;;AAKG;AACH,IAAA,gBAAgB,CAAC,EAA2B,EAAA;AAC1C,QAAA,IAAI,CAAC,eAAe,GAAG,EAAE;IAC3B;AAEA;;;;;AAKG;AACH,IAAA,iBAAiB,CAAC,EAAc,EAAA;AAC9B,QAAA,IAAI,CAAC,gBAAgB,GAAG,EAAE;IAC5B;AAEA;;;;;AAKG;AACH,IAAA,gBAAgB,CAAC,UAAmB,EAAA;AAClC,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,UAAU,CAAC;QAC7B,IAAI,UAAU,EAAE;AACd,YAAA,IAAI,CAAC,OAAO,EAAE,CAAC,OAAO,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;QAC9C;aAAO;AACL,YAAA,IAAI,CAAC,OAAO,EAAE,CAAC,MAAM,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;QAC7C;IACF;;AAIA;;;;;AAKG;AACH,IAAA,OAAO,CAAC,KAAY,EAAA;AAClB,QAAA,MAAM,SAAS,GAAI,KAAK,CAAC,MAA8B,CAAC,KAAK;AAC7D,QAAA,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC;IACnC;AAEA;;;;AAIG;IACH,MAAM,GAAA;QACJ,IAAI,CAAC,oBAAoB,EAAE;IAC7B;;IAIQ,iBAAiB,GAAA;AACvB,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAClB,YAAA,IAAI,CAAC,SAAS,CAAC,aAAa,GAAG,IAAI;QACrC;IACF;IAEQ,qBAAqB,GAAA;AAC3B,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE;AAEjC,QAAA,IAAI,OAAO,CAAC,KAAK,KAAK,IAAI,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS,EAAE;YACzD,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,KAAK,CAAC;QAC/B;QAEA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,QAAQ,CAAC;IACrC;IAEQ,sBAAsB,GAAA;AAC5B,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE;AAEjC,QAAA,OAAO,CAAC;AACL,aAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,UAAU,CAAC;aACxC,SAAS,CAAC,KAAK,IAAG;YACjB,IAAI,IAAI,CAAC,eAAe;gBAAE;AAC1B,YAAA,IAAI,KAAK,KAAK,IAAI,CAAC,KAAK,EAAE,EAAE;gBAC1B,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,IAAI,EAAE,CAAC;AAC3B,gBAAA,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;YAC7B;AACF,QAAA,CAAC,CAAC;AAEJ,QAAA,OAAO,CAAC;AACL,aAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,UAAU,CAAC;aACxC,SAAS,CAAC,MAAK;YACd,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,QAAQ,CAAC;AACrC,QAAA,CAAC,CAAC;IACN;AAEQ,IAAA,iBAAiB,CAAC,KAAa,EAAA;AACrC,QAAA,IAAI,CAAC,eAAe,GAAG,IAAI;AAE3B,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC;AACrB,QAAA,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;AAE3B,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE;AACjC,QAAA,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC;QACvB,OAAO,CAAC,WAAW,EAAE;AAErB,QAAA,IAAI,CAAC,eAAe,GAAG,KAAK;IAC9B;IAEQ,oBAAoB,GAAA;QAC1B,IAAI,CAAC,gBAAgB,EAAE;AACvB,QAAA,IAAI,CAAC,UAAU,EAAE,CAAC,aAAa,EAAE;IACnC;IAEQ,UAAU,GAAA;QAChB,OAAQ,IAAI,CAAC,SAAS,EAAE,OAAuB,IAAI,IAAI,CAAC,OAAO,EAAE;IACnE;AAEA,IAAA,IAAI,gBAAgB,GAAA;AAClB,QAAA,OAAO,IAAI,CAAC,UAAU,EAAE;IAC1B;8GAtPW,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAjB,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,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,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,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,EAAA,EAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,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,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,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,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,KAAA,EAAA,aAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EClC9B,yxCA8CA,EAAA,MAAA,EAAA,CAAA,onEAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDrBI,mBAAmB,8BACnB,cAAc,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,QAAA,EAAA,QAAA,EAAA,+BAAA,EAAA,MAAA,EAAA,CAAA,aAAA,EAAA,mBAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACd,gBAAgB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAChB,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,OAAA,EAAA,YAAA,EAAA,UAAA,EAAA,MAAA,EAAA,WAAA,EAAA,MAAA,EAAA,uBAAA,EAAA,uBAAA,EAAA,MAAA,EAAA,SAAA,EAAA,eAAA,CAAA,EAAA,OAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAMJ,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAZ7B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,EAAA,OAAA,EACd;wBACP,mBAAmB;wBACnB,cAAc;wBACd,gBAAgB;wBAChB,aAAa;qBACd,EAAA,eAAA,EAGgB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,yxCAAA,EAAA,MAAA,EAAA,CAAA,onEAAA,CAAA,EAAA;;;AEhCjD;;AAEG;;;;"}
+{"version":3,"file":"tekus-design-system-components-textarea.mjs","sources":["../../../projects/design-system/components/textarea/src/textarea.component.ts","../../../projects/design-system/components/textarea/src/textarea.component.html","../../../projects/design-system/components/textarea/tekus-design-system-components-textarea.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  DestroyRef,\n  input,\n  model,\n  signal,\n  computed,\n  inject,\n  OnInit,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport {\n  ControlValueAccessor,\n  FormControl,\n  ReactiveFormsModule,\n  NgControl,\n} from '@angular/forms';\nimport { FloatLabelModule } from 'primeng/floatlabel';\nimport { TextareaModule } from 'primeng/textarea';\nimport { MessageModule } from 'primeng/message';\n\n@Component({\n  selector: 'tk-textarea',\n  imports: [\n    ReactiveFormsModule,\n    TextareaModule,\n    FloatLabelModule,\n    MessageModule,\n  ],\n  templateUrl: './textarea.component.html',\n  styleUrl: './textarea.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TextareaComponent\n  implements ControlValueAccessor, OnInit\n{\n  /* ───────────── Dependency injection ───────────── */\n  private readonly ngControl = inject(NgControl, {\n    self: true,\n    optional: true,\n  });\n  private readonly destroyRef = inject(DestroyRef);\n\n  constructor() {\n    this.bindValueAccessor();\n  }\n\n  /* ───────────── Inputs / State ───────────── */\n\n  /**\n   * @property {ModelSignal<string>} value\n   * @description\n   * The value of the textarea. Supports two-way binding via signals.\n   */\n  value = model<string>('');\n\n  /**\n   * @property {InputSignal<FormControl>} control\n   * @description\n   * External FormControl used to read/set the textarea value.\n   * If not provided, an internal FormControl is created.\n   */\n  control = input<FormControl>(new FormControl(''));\n\n  /**\n   * @property {InputSignal<string>} label\n   * @description\n   * Label displayed above the textarea.\n   */\n  label = input<string>('');\n\n  /**\n   * @property {InputSignal<string>} id\n   * @description\n   * HTML id attribute for the textarea.\n   * @default 'tk-textarea'\n   */\n  id = input<string>('tk-textarea');\n\n  /**\n   * @property {InputSignal<number>} rows\n   * @description\n   * Number of visible text lines for the textarea.\n   * @default 1\n   */\n  rows = input<number>(1);\n\n  /**\n   * @property {InputSignal<number>} cols\n   * @description\n   * Visible width of the textarea in average character widths.\n   * @default 30\n   */\n  cols = input<number>(30);\n\n  /**\n   * @property {InputSignal<string>} hint\n   * @description\n   * Hint text to display below the textarea.\n   */\n  hint = input<string>('');\n\n  /**\n   * @property {InputSignal<string>} errorMessage\n   * @description\n   * Message to display when the control is invalid and touched.\n   */\n  errorMessage = input<string>('');\n\n  /**\n   * @property {InputSignal<number | null>} maxLength\n   * @description\n   * Maximum number of characters allowed in the textarea.\n   */\n  maxLength = input<number | null>(null);\n\n  /**\n   * @property {boolean} disabled\n   * @description\n   * Whether the textarea is disabled.\n   */\n  disabled = signal<boolean>(false);\n\n  /* ───────────── Derived state ───────────── */\n\n  counterText = computed(() => {\n    const limit = this.maxLength();\n    return limit ? `${this.value().length}/${limit}` : '';\n  });\n\n  /* ───────────── CVA callbacks ───────────── */\n\n  private propagateChange: (value: string) => void = () => {};\n  private propagateTouched: () => void = () => {};\n\n  /* ───────────── Internals ───────────── */\n\n  private syncingFromView = false;\n\n  /* ───────────── Lifecycle ───────────── */\n\n  ngOnInit(): void {\n    this.initializeFromControl();\n    this.listenToControlChanges();\n  }\n\n  /* ───────────── ControlValueAccessor ───────────── */\n\n  /**\n   * @method writeValue\n   * @description\n   * Writes a new value to the element.\n   * @param value The new value.\n   */\n  writeValue(value: string): void {\n    const safeValue = value ?? '';\n    this.value.set(safeValue);\n    this.control().setValue(safeValue, { emitEvent: false });\n  }\n\n  /**\n   * @method registerOnChange\n   * @description\n   * Registers a callback function that is called when the control's value changes in the UI.\n   * @param fn The callback function.\n   */\n  registerOnChange(fn: (value: string) => void): void {\n    this.propagateChange = fn;\n  }\n\n  /**\n   * @method registerOnTouched\n   * @description\n   * Registers a callback function that is called by the forms API on initialization to update the form model on blur.\n   * @param fn The callback function.\n   */\n  registerOnTouched(fn: () => void): void {\n    this.propagateTouched = fn;\n  }\n\n  /**\n   * @method setDisabledState\n   * @description\n   * Function that is called by the forms API when the control status changes to or from 'DISABLED'.\n   * @param isDisabled The disabled status to set on the element.\n   */\n  setDisabledState(isDisabled: boolean): void {\n    this.disabled.set(isDisabled);\n    if (isDisabled) {\n      this.control().disable({ emitEvent: false });\n    } else {\n      this.control().enable({ emitEvent: false });\n    }\n  }\n\n  /* ───────────── Template handlers ───────────── */\n\n  /**\n   * @method onInput\n   * @description\n   * Handles input events to update the model and notify forms.\n   * @param event The input event.\n   */\n  onInput(event: Event): void {\n    const nextValue = (event.target as HTMLTextAreaElement).value;\n    this.syncFromUserInput(nextValue);\n  }\n\n  /**\n   * @method onBlur\n   * @description\n   * Handles blur events to mark the control as touched.\n   */\n  onBlur(): void {\n    this.markControlAsTouched();\n  }\n\n  /* ───────────── Private helpers ───────────── */\n\n  private bindValueAccessor(): void {\n    if (this.ngControl) {\n      this.ngControl.valueAccessor = this;\n    }\n  }\n\n  private initializeFromControl(): void {\n    const control = this.getControl();\n\n    if (control.value !== null && control.value !== undefined) {\n      this.value.set(control.value);\n    }\n\n    this.disabled.set(control.disabled);\n  }\n\n  private listenToControlChanges(): void {\n    const control = this.getControl();\n\n    control.valueChanges\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(value => {\n        if (this.syncingFromView) return;\n        if (value !== this.value()) {\n          this.value.set(value ?? '');\n          this.propagateChange(value);\n        }\n      });\n\n    control.statusChanges\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(() => {\n        this.disabled.set(control.disabled);\n      });\n  }\n\n  private syncFromUserInput(value: string): void {\n    this.syncingFromView = true;\n\n    this.value.set(value);\n    this.propagateChange(value);\n\n    const control = this.getControl();\n    control.setValue(value);\n    control.markAsDirty();\n\n    this.syncingFromView = false;\n  }\n\n  private markControlAsTouched(): void {\n    this.propagateTouched();\n    this.getControl().markAsTouched();\n  }\n\n  private getControl(): FormControl {\n    return (this.ngControl?.control as FormControl) || this.control();\n  }\n\n  get effectiveControl(): FormControl {\n    return this.getControl();\n  }\n}\n","<p-floatlabel>\n  <div class=\"tk-textarea-wrapper\">\n    <textarea\n      pTextarea\n      [autoResize]=\"true\"\n      [id]=\"id()\"\n      [rows]=\"rows()\"\n      [cols]=\"cols()\"\n      [value]=\"value()\"\n      (input)=\"onInput($event)\"\n      (blur)=\"onBlur()\"\n      [attr.maxlength]=\"maxLength()\"\n      [disabled]=\"disabled()\"\n      [class.p-filled]=\"!!value()\"\n      [class.ng-invalid]=\"effectiveControl.invalid\"\n      [class.ng-dirty]=\"effectiveControl.dirty\"\n      [class.ng-touched]=\"effectiveControl.touched\"></textarea>\n\n    <label [for]=\"id()\">{{ label() }}</label>\n  </div>\n</p-floatlabel>\n\n<div class=\"tk-input-bottom\">\n  <div class=\"tk-input-messages\">\n    @if ((effectiveControl.invalid && (effectiveControl.dirty ||\n    effectiveControl.touched)) && errorMessage()) {\n    <p-message severity=\"error\" size=\"small\" variant=\"simple\">\n      {{ errorMessage() }}\n    </p-message>\n    } @else if (hint()) {\n    <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">\n      {{ hint() }}\n    </p-message>\n    }\n  </div>\n\n  @if (maxLength()) {\n  <p-message\n    severity=\"secondary\"\n    size=\"small\"\n    variant=\"simple\"\n    class=\"tk-character-counter\">\n    {{ counterText() }}\n  </p-message>\n  }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;MAkCa,iBAAiB,CAAA;AAU5B,IAAA,WAAA,GAAA;;AANiB,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAAC,SAAS,EAAE;AAC7C,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA,CAAC;AACe,QAAA,IAAA,CAAA,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;;AAQhD;;;;AAIG;AACH,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAS,EAAE,4EAAC;AAEzB;;;;;AAKG;QACH,IAAA,CAAA,OAAO,GAAG,KAAK,CAAc,IAAI,WAAW,CAAC,EAAE,CAAC,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,SAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAC;AAEjD;;;;AAIG;AACH,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAS,EAAE,4EAAC;AAEzB;;;;;AAKG;AACH,QAAA,IAAA,CAAA,EAAE,GAAG,KAAK,CAAS,aAAa,yEAAC;AAEjC;;;;;AAKG;AACH,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAS,CAAC,2EAAC;AAEvB;;;;;AAKG;AACH,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAS,EAAE,2EAAC;AAExB;;;;AAIG;AACH,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAS,EAAE,2EAAC;AAExB;;;;AAIG;AACH,QAAA,IAAA,CAAA,YAAY,GAAG,KAAK,CAAS,EAAE,mFAAC;AAEhC;;;;AAIG;AACH,QAAA,IAAA,CAAA,SAAS,GAAG,KAAK,CAAgB,IAAI,gFAAC;AAEtC;;;;AAIG;AACH,QAAA,IAAA,CAAA,QAAQ,GAAG,MAAM,CAAU,KAAK,+EAAC;;AAIjC,QAAA,IAAA,CAAA,WAAW,GAAG,QAAQ,CAAC,MAAK;AAC1B,YAAA,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE;AAC9B,YAAA,OAAO,KAAK,GAAG,CAAA,EAAG,IAAI,CAAC,KAAK,EAAE,CAAC,MAAM,IAAI,KAAK,CAAA,CAAE,GAAG,EAAE;AACvD,QAAA,CAAC,kFAAC;;AAIM,QAAA,IAAA,CAAA,eAAe,GAA4B,MAAK,EAAE,CAAC;AACnD,QAAA,IAAA,CAAA,gBAAgB,GAAe,MAAK,EAAE,CAAC;;QAIvC,IAAA,CAAA,eAAe,GAAG,KAAK;QA7F7B,IAAI,CAAC,iBAAiB,EAAE;IAC1B;;IAgGA,QAAQ,GAAA;QACN,IAAI,CAAC,qBAAqB,EAAE;QAC5B,IAAI,CAAC,sBAAsB,EAAE;IAC/B;;AAIA;;;;;AAKG;AACH,IAAA,UAAU,CAAC,KAAa,EAAA;AACtB,QAAA,MAAM,SAAS,GAAG,KAAK,IAAI,EAAE;AAC7B,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC;AACzB,QAAA,IAAI,CAAC,OAAO,EAAE,CAAC,QAAQ,CAAC,SAAS,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;IAC1D;AAEA;;;;;AAKG;AACH,IAAA,gBAAgB,CAAC,EAA2B,EAAA;AAC1C,QAAA,IAAI,CAAC,eAAe,GAAG,EAAE;IAC3B;AAEA;;;;;AAKG;AACH,IAAA,iBAAiB,CAAC,EAAc,EAAA;AAC9B,QAAA,IAAI,CAAC,gBAAgB,GAAG,EAAE;IAC5B;AAEA;;;;;AAKG;AACH,IAAA,gBAAgB,CAAC,UAAmB,EAAA;AAClC,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,UAAU,CAAC;QAC7B,IAAI,UAAU,EAAE;AACd,YAAA,IAAI,CAAC,OAAO,EAAE,CAAC,OAAO,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;QAC9C;aAAO;AACL,YAAA,IAAI,CAAC,OAAO,EAAE,CAAC,MAAM,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;QAC7C;IACF;;AAIA;;;;;AAKG;AACH,IAAA,OAAO,CAAC,KAAY,EAAA;AAClB,QAAA,MAAM,SAAS,GAAI,KAAK,CAAC,MAA8B,CAAC,KAAK;AAC7D,QAAA,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC;IACnC;AAEA;;;;AAIG;IACH,MAAM,GAAA;QACJ,IAAI,CAAC,oBAAoB,EAAE;IAC7B;;IAIQ,iBAAiB,GAAA;AACvB,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAClB,YAAA,IAAI,CAAC,SAAS,CAAC,aAAa,GAAG,IAAI;QACrC;IACF;IAEQ,qBAAqB,GAAA;AAC3B,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE;AAEjC,QAAA,IAAI,OAAO,CAAC,KAAK,KAAK,IAAI,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS,EAAE;YACzD,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,KAAK,CAAC;QAC/B;QAEA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,QAAQ,CAAC;IACrC;IAEQ,sBAAsB,GAAA;AAC5B,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE;AAEjC,QAAA,OAAO,CAAC;AACL,aAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,UAAU,CAAC;aACxC,SAAS,CAAC,KAAK,IAAG;YACjB,IAAI,IAAI,CAAC,eAAe;gBAAE;AAC1B,YAAA,IAAI,KAAK,KAAK,IAAI,CAAC,KAAK,EAAE,EAAE;gBAC1B,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,IAAI,EAAE,CAAC;AAC3B,gBAAA,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;YAC7B;AACF,QAAA,CAAC,CAAC;AAEJ,QAAA,OAAO,CAAC;AACL,aAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,UAAU,CAAC;aACxC,SAAS,CAAC,MAAK;YACd,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,QAAQ,CAAC;AACrC,QAAA,CAAC,CAAC;IACN;AAEQ,IAAA,iBAAiB,CAAC,KAAa,EAAA;AACrC,QAAA,IAAI,CAAC,eAAe,GAAG,IAAI;AAE3B,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC;AACrB,QAAA,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;AAE3B,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE;AACjC,QAAA,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC;QACvB,OAAO,CAAC,WAAW,EAAE;AAErB,QAAA,IAAI,CAAC,eAAe,GAAG,KAAK;IAC9B;IAEQ,oBAAoB,GAAA;QAC1B,IAAI,CAAC,gBAAgB,EAAE;AACvB,QAAA,IAAI,CAAC,UAAU,EAAE,CAAC,aAAa,EAAE;IACnC;IAEQ,UAAU,GAAA;QAChB,OAAQ,IAAI,CAAC,SAAS,EAAE,OAAuB,IAAI,IAAI,CAAC,OAAO,EAAE;IACnE;AAEA,IAAA,IAAI,gBAAgB,GAAA;AAClB,QAAA,OAAO,IAAI,CAAC,UAAU,EAAE;IAC1B;8GAtPW,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAjB,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,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,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,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,EAAA,EAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,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,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,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,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,KAAA,EAAA,aAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EClC9B,yxCA8CA,EAAA,MAAA,EAAA,CAAA,mnEAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDrBI,mBAAmB,8BACnB,cAAc,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,QAAA,EAAA,QAAA,EAAA,+BAAA,EAAA,MAAA,EAAA,CAAA,aAAA,EAAA,mBAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACd,gBAAgB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAChB,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,OAAA,EAAA,YAAA,EAAA,UAAA,EAAA,MAAA,EAAA,WAAA,EAAA,MAAA,EAAA,uBAAA,EAAA,uBAAA,EAAA,MAAA,EAAA,SAAA,EAAA,eAAA,CAAA,EAAA,OAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAMJ,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAZ7B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,EAAA,OAAA,EACd;wBACP,mBAAmB;wBACnB,cAAc;wBACd,gBAAgB;wBAChB,aAAa;qBACd,EAAA,eAAA,EAGgB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,yxCAAA,EAAA,MAAA,EAAA,CAAA,mnEAAA,CAAA,EAAA;;;AEhCjD;;AAEG;;;;"}