@tekus/design-system 5.18.0 → 5.20.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/assets/tokens/tk-foundations.json +3 -3
  2. package/components/checkbox/src/checkbox.component.d.ts +33 -2
  3. package/components/drawer/index.d.ts +5 -0
  4. package/components/drawer/public-api.d.ts +3 -0
  5. package/components/drawer/src/drawer.component.d.ts +105 -0
  6. package/components/drawer/src/drawer.types.d.ts +22 -0
  7. package/components/drawer/src/services/drawer.service.d.ts +15 -0
  8. package/components/icon/core/icons/arrows-rotate.d.ts +2 -0
  9. package/components/icon/core/icons/edit.d.ts +2 -0
  10. package/components/icon/core/icons/globe-pointer.d.ts +2 -0
  11. package/components/icon/core/icons/grip-vertical.d.ts +2 -0
  12. package/components/modal/src/modal.component.d.ts +86 -67
  13. package/components/modal/src/modal.types.d.ts +22 -2
  14. package/components/modal/src/services/modal.service.d.ts +15 -0
  15. package/components/multiselect/src/multiselect.component.d.ts +115 -19
  16. package/components/panel/index.d.ts +5 -0
  17. package/components/panel/public-api.d.ts +1 -0
  18. package/components/panel/src/panel.component.d.ts +82 -0
  19. package/components/radio-button/src/radio-button.component.d.ts +33 -3
  20. package/components/table/src/table.component.d.ts +45 -1
  21. package/components/table/src/table.interface.d.ts +1 -1
  22. package/components/toolbar/src/toolbar.component.d.ts +55 -1
  23. package/core/types/public-api.d.ts +1 -0
  24. package/core/types/src/interception/index.d.ts +1 -0
  25. package/core/types/src/interception/interception.types.d.ts +21 -0
  26. package/fesm2022/tekus-design-system-components-checkbox.mjs +52 -16
  27. package/fesm2022/tekus-design-system-components-checkbox.mjs.map +1 -1
  28. package/fesm2022/tekus-design-system-components-drawer.mjs +280 -0
  29. package/fesm2022/tekus-design-system-components-drawer.mjs.map +1 -0
  30. package/fesm2022/tekus-design-system-components-icon.mjs +56 -0
  31. package/fesm2022/tekus-design-system-components-icon.mjs.map +1 -1
  32. package/fesm2022/tekus-design-system-components-modal.mjs +190 -89
  33. package/fesm2022/tekus-design-system-components-modal.mjs.map +1 -1
  34. package/fesm2022/tekus-design-system-components-multiselect.mjs +164 -45
  35. package/fesm2022/tekus-design-system-components-multiselect.mjs.map +1 -1
  36. package/fesm2022/tekus-design-system-components-panel.mjs +102 -0
  37. package/fesm2022/tekus-design-system-components-panel.mjs.map +1 -0
  38. package/fesm2022/tekus-design-system-components-radio-button.mjs +53 -18
  39. package/fesm2022/tekus-design-system-components-radio-button.mjs.map +1 -1
  40. package/fesm2022/tekus-design-system-components-select.mjs +3 -8
  41. package/fesm2022/tekus-design-system-components-select.mjs.map +1 -1
  42. package/fesm2022/tekus-design-system-components-table.mjs +72 -5
  43. package/fesm2022/tekus-design-system-components-table.mjs.map +1 -1
  44. package/fesm2022/tekus-design-system-components-toolbar.mjs +72 -4
  45. package/fesm2022/tekus-design-system-components-toolbar.mjs.map +1 -1
  46. package/fesm2022/tekus-design-system-core-types.mjs +31 -1
  47. package/fesm2022/tekus-design-system-core-types.mjs.map +1 -1
  48. package/fesm2022/tekus-design-system-core.mjs +31 -1
  49. package/fesm2022/tekus-design-system-core.mjs.map +1 -1
  50. package/package.json +13 -5
  51. package/styles/variables.css +3 -3
@@ -1,6 +1,6 @@
1
1
  import { CommonModule } from '@angular/common';
2
2
  import * as i0 from '@angular/core';
3
- import { inject, model, input, signal, Component } from '@angular/core';
3
+ import { inject, model, input, Component } from '@angular/core';
4
4
  import * as i1 from '@angular/forms';
5
5
  import { NgControl, FormControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
6
6
  import { Subscription } from 'rxjs';
@@ -10,8 +10,13 @@ import * as i3 from 'primeng/message';
10
10
  import { MessageModule } from 'primeng/message';
11
11
 
12
12
  class CheckboxComponent {
13
+ /**
14
+ * Initialize the component and register it as a ControlValueAccessor.
15
+ */
13
16
  constructor() {
17
+ /** Internal references and injections */
14
18
  this.ngControl = inject(NgControl, { self: true, optional: true });
19
+ /** Properties and Signals */
15
20
  /**
16
21
  * @property {ModelSignal<any>} model
17
22
  * @description
@@ -63,12 +68,19 @@ class CheckboxComponent {
63
68
  * Message to display when the control is invalid and touched.
64
69
  */
65
70
  this.errorMessage = input('');
71
+ /**
72
+ * @property {ModelSignal<boolean>} indeterminate
73
+ * @description
74
+ * Indeterminate state of the checkbox (reactive).
75
+ * Useful for parent checkboxes in lists with partial selection.
76
+ */
77
+ this.indeterminate = model(false);
66
78
  /**
67
79
  * @property {boolean} disabled
68
80
  * @description
69
81
  * Whether the checkbox is disabled.
70
82
  */
71
- this.disabled = signal(false);
83
+ this.disabled = model(false);
72
84
  this.onChange = () => { };
73
85
  this.onTouched = () => { };
74
86
  this.subscription = new Subscription();
@@ -76,40 +88,52 @@ class CheckboxComponent {
76
88
  this.ngControl.valueAccessor = this;
77
89
  }
78
90
  }
91
+ /** Component Methods */
79
92
  get effectiveControl() {
80
93
  return this.ngControl?.control || this.control();
81
94
  }
82
95
  ngOnInit() {
83
96
  const control = this.effectiveControl;
84
- if (control.value !== undefined) {
97
+ if (control.value !== undefined && control.value !== null) {
85
98
  this.model.set(control.value);
86
99
  }
87
- // Sync initial disabled state
88
- this.disabled.set(control.disabled);
89
- this.subscription.add(control.valueChanges.subscribe(val => {
90
- if (val !== this.model()) {
91
- this.model.set(val);
92
- this.onChange(val);
93
- }
94
- }));
95
- // Sync disabled state on status change
100
+ if (this.control() === control && this.disabled()) {
101
+ control.disable({ emitEvent: false });
102
+ }
103
+ else {
104
+ this.disabled.set(control.disabled);
105
+ }
96
106
  this.subscription.add(control.statusChanges.subscribe(() => {
97
107
  this.disabled.set(control.disabled);
98
108
  }));
109
+ this.subscription.add(control.valueChanges.subscribe(value => {
110
+ this.model.set(value);
111
+ }));
99
112
  }
100
113
  ngOnDestroy() {
101
114
  this.subscription.unsubscribe();
102
115
  }
116
+ /**
117
+ * Implementation of ControlValueAccessor: Writes a new value from the form.
118
+ */
103
119
  writeValue(value) {
104
120
  this.model.set(value);
105
- this.control().setValue(value, { emitEvent: false });
106
121
  }
122
+ /**
123
+ * Implementation of ControlValueAccessor: Registers a callback for change events.
124
+ */
107
125
  registerOnChange(fn) {
108
126
  this.onChange = fn;
109
127
  }
128
+ /**
129
+ * Implementation of ControlValueAccessor: Registers a callback for touched events.
130
+ */
110
131
  registerOnTouched(fn) {
111
132
  this.onTouched = fn;
112
133
  }
134
+ /**
135
+ * Implementation of ControlValueAccessor: Sets the disabled state.
136
+ */
113
137
  setDisabledState(isDisabled) {
114
138
  this.disabled.set(isDisabled);
115
139
  if (isDisabled) {
@@ -119,23 +143,35 @@ class CheckboxComponent {
119
143
  this.control().enable({ emitEvent: false });
120
144
  }
121
145
  }
146
+ /**
147
+ * Handle model change events from the template.
148
+ */
122
149
  onModelChange(value) {
123
150
  this.model.set(value);
124
151
  this.onChange(value);
125
- this.effectiveControl.setValue(value);
152
+ this.effectiveControl.setValue(value, { emitEvent: false });
126
153
  this.effectiveControl.markAsDirty();
127
154
  this.onTouched();
128
155
  }
156
+ /**
157
+ * Handle blur events to trigger onTouched.
158
+ */
129
159
  onBlur() {
130
160
  this.onTouched();
131
161
  this.effectiveControl.markAsTouched();
132
162
  }
133
163
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
134
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.18", type: CheckboxComponent, isStandalone: true, selector: "tk-checkbox", inputs: { model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, binary: { classPropertyName: "binary", publicName: "binary", isSignal: true, isRequired: false, transformFunction: null }, control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { model: "modelChange" }, ngImport: i0, template: "<div class=\"tk-checkbox-wrapper\">\n <div class=\"tk-checkbox-group\" [class.tk-disabled]=\"disabled()\">\n <p-checkbox\n [inputId]=\"inputId()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [binary]=\"binary()\"\n [disabled]=\"disabled()\"\n [ngModel]=\"model()\"\n (ngModelChange)=\"onModelChange($event)\"\n [class.ng-invalid]=\"effectiveControl.invalid\"\n [class.ng-dirty]=\"effectiveControl.dirty\"\n [class.ng-touched]=\"effectiveControl.touched\">\n </p-checkbox>\n @if(label()){\n <label [for]=\"inputId()\" class=\"tk-checkbox-label\"> {{ label() }} </label>\n }\n </div>\n \n <div class=\"tk-input-bottom\">\n <div class=\"tk-input-messages\">\n @if ((effectiveControl.invalid && (effectiveControl.dirty || effectiveControl.touched)) && errorMessage()) {\n <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{ errorMessage() }}</p-message>\n }\n </div>\n </div>\n</div>\n", styles: [":host ::ng-deep .tk-checkbox-wrapper{display:flex;flex-direction:column}:host ::ng-deep .tk-checkbox-wrapper label{font-size:var(--tk-font-size-paragraph-s, .875rem);font-weight:var(--tk-font-weight-400, \"Regular\")}:host ::ng-deep .tk-checkbox-group{display:flex;align-items:center;gap:var(--tk-spacing-base-50, .5rem)}:host ::ng-deep .tk-checkbox-group.tk-disabled label{color:var(--tk-color-base-surface-600, #424243)}:host ::ng-deep .tk-checkbox-label{margin-top:var(--tk-spacing-base-25, .25rem)}: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-bottom{display:flex;justify-content:space-between;align-items:flex-start;margin-top:.25rem;min-height:1.25rem}:host ::ng-deep .tk-input-messages{flex:1;margin-right:1rem}:host ::ng-deep .p-checkbox.p-disabled .p-checkbox-icon{color:var(--tk-color-base-surface-300, #d2d2d2)!important}:host ::ng-deep p-checkbox.ng-invalid.ng-touched .p-checkbox-box,:host ::ng-deep p-checkbox.ng-invalid.ng-dirty .p-checkbox-box{border-color:var(--tk-color-base-red-700, #cf2604)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i2.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { 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"], outputs: ["onClose"] }] }); }
164
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.18", type: CheckboxComponent, isStandalone: true, selector: "tk-checkbox", inputs: { model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, binary: { classPropertyName: "binary", publicName: "binary", isSignal: true, isRequired: false, transformFunction: null }, control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { model: "modelChange", indeterminate: "indeterminateChange", disabled: "disabledChange" }, ngImport: i0, template: "<div class=\"tk-checkbox-wrapper\">\n <div class=\"tk-checkbox-group\" [class.tk-disabled]=\"disabled()\">\n <p-checkbox\n [inputId]=\"inputId()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [binary]=\"binary()\"\n [disabled]=\"disabled()\"\n [indeterminate]=\"indeterminate()\"\n [ngModel]=\"model()\"\n (ngModelChange)=\"onModelChange($event)\"\n [class.ng-invalid]=\"effectiveControl.invalid\"\n [class.ng-dirty]=\"effectiveControl.dirty\"\n [class.ng-touched]=\"effectiveControl.touched\">\n </p-checkbox>\n @if (label()) {\n <label [for]=\"inputId()\" class=\"tk-checkbox-label\"> {{ label() }} </label>\n }\n </div>\n @if (\n effectiveControl.invalid &&\n (effectiveControl.dirty || effectiveControl.touched) &&\n errorMessage()\n ) {\n <div class=\"tk-input-bottom\">\n <div class=\"tk-input-messages\">\n <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{\n errorMessage()\n }}</p-message>\n </div>\n </div>\n }\n</div>\n", styles: [":host ::ng-deep .tk-checkbox-wrapper{display:flex;flex-direction:column}:host ::ng-deep .tk-checkbox-wrapper label{font-size:var(--tk-font-size-paragraph-s, .875rem);font-weight:var(--tk-font-weight-400, \"Regular\")}:host ::ng-deep .tk-checkbox-group{display:flex;align-items:center;gap:var(--tk-spacing-base-50, .5rem)}:host ::ng-deep .tk-checkbox-group.tk-disabled label{color:var(--tk-color-base-surface-600, #424243)}:host ::ng-deep .tk-checkbox-label{margin-top:var(--tk-spacing-base-25, .25rem)}: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-bottom{display:flex;justify-content:space-between;align-items:flex-start;margin-top:.25rem;min-height:1.25rem}:host ::ng-deep .tk-input-messages{flex:1;margin-right:1rem}:host ::ng-deep .p-checkbox.p-disabled .p-checkbox-icon{color:var(--tk-color-base-surface-300, #d2d2d2)!important}:host ::ng-deep p-checkbox.ng-invalid.ng-touched .p-checkbox-box,:host ::ng-deep p-checkbox.ng-invalid.ng-dirty .p-checkbox-box{border-color:var(--tk-color-base-red-700, #cf2604)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i2.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { 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"], outputs: ["onClose"] }] }); }
135
165
  }
136
166
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: CheckboxComponent, decorators: [{
137
167
  type: Component,
138
- args: [{ selector: 'tk-checkbox', imports: [CommonModule, ReactiveFormsModule, FormsModule, CheckboxModule, MessageModule], template: "<div class=\"tk-checkbox-wrapper\">\n <div class=\"tk-checkbox-group\" [class.tk-disabled]=\"disabled()\">\n <p-checkbox\n [inputId]=\"inputId()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [binary]=\"binary()\"\n [disabled]=\"disabled()\"\n [ngModel]=\"model()\"\n (ngModelChange)=\"onModelChange($event)\"\n [class.ng-invalid]=\"effectiveControl.invalid\"\n [class.ng-dirty]=\"effectiveControl.dirty\"\n [class.ng-touched]=\"effectiveControl.touched\">\n </p-checkbox>\n @if(label()){\n <label [for]=\"inputId()\" class=\"tk-checkbox-label\"> {{ label() }} </label>\n }\n </div>\n \n <div class=\"tk-input-bottom\">\n <div class=\"tk-input-messages\">\n @if ((effectiveControl.invalid && (effectiveControl.dirty || effectiveControl.touched)) && errorMessage()) {\n <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{ errorMessage() }}</p-message>\n }\n </div>\n </div>\n</div>\n", styles: [":host ::ng-deep .tk-checkbox-wrapper{display:flex;flex-direction:column}:host ::ng-deep .tk-checkbox-wrapper label{font-size:var(--tk-font-size-paragraph-s, .875rem);font-weight:var(--tk-font-weight-400, \"Regular\")}:host ::ng-deep .tk-checkbox-group{display:flex;align-items:center;gap:var(--tk-spacing-base-50, .5rem)}:host ::ng-deep .tk-checkbox-group.tk-disabled label{color:var(--tk-color-base-surface-600, #424243)}:host ::ng-deep .tk-checkbox-label{margin-top:var(--tk-spacing-base-25, .25rem)}: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-bottom{display:flex;justify-content:space-between;align-items:flex-start;margin-top:.25rem;min-height:1.25rem}:host ::ng-deep .tk-input-messages{flex:1;margin-right:1rem}:host ::ng-deep .p-checkbox.p-disabled .p-checkbox-icon{color:var(--tk-color-base-surface-300, #d2d2d2)!important}:host ::ng-deep p-checkbox.ng-invalid.ng-touched .p-checkbox-box,:host ::ng-deep p-checkbox.ng-invalid.ng-dirty .p-checkbox-box{border-color:var(--tk-color-base-red-700, #cf2604)}\n"] }]
168
+ args: [{ selector: 'tk-checkbox', imports: [
169
+ CommonModule,
170
+ ReactiveFormsModule,
171
+ FormsModule,
172
+ CheckboxModule,
173
+ MessageModule,
174
+ ], template: "<div class=\"tk-checkbox-wrapper\">\n <div class=\"tk-checkbox-group\" [class.tk-disabled]=\"disabled()\">\n <p-checkbox\n [inputId]=\"inputId()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [binary]=\"binary()\"\n [disabled]=\"disabled()\"\n [indeterminate]=\"indeterminate()\"\n [ngModel]=\"model()\"\n (ngModelChange)=\"onModelChange($event)\"\n [class.ng-invalid]=\"effectiveControl.invalid\"\n [class.ng-dirty]=\"effectiveControl.dirty\"\n [class.ng-touched]=\"effectiveControl.touched\">\n </p-checkbox>\n @if (label()) {\n <label [for]=\"inputId()\" class=\"tk-checkbox-label\"> {{ label() }} </label>\n }\n </div>\n @if (\n effectiveControl.invalid &&\n (effectiveControl.dirty || effectiveControl.touched) &&\n errorMessage()\n ) {\n <div class=\"tk-input-bottom\">\n <div class=\"tk-input-messages\">\n <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{\n errorMessage()\n }}</p-message>\n </div>\n </div>\n }\n</div>\n", styles: [":host ::ng-deep .tk-checkbox-wrapper{display:flex;flex-direction:column}:host ::ng-deep .tk-checkbox-wrapper label{font-size:var(--tk-font-size-paragraph-s, .875rem);font-weight:var(--tk-font-weight-400, \"Regular\")}:host ::ng-deep .tk-checkbox-group{display:flex;align-items:center;gap:var(--tk-spacing-base-50, .5rem)}:host ::ng-deep .tk-checkbox-group.tk-disabled label{color:var(--tk-color-base-surface-600, #424243)}:host ::ng-deep .tk-checkbox-label{margin-top:var(--tk-spacing-base-25, .25rem)}: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-bottom{display:flex;justify-content:space-between;align-items:flex-start;margin-top:.25rem;min-height:1.25rem}:host ::ng-deep .tk-input-messages{flex:1;margin-right:1rem}:host ::ng-deep .p-checkbox.p-disabled .p-checkbox-icon{color:var(--tk-color-base-surface-300, #d2d2d2)!important}:host ::ng-deep p-checkbox.ng-invalid.ng-touched .p-checkbox-box,:host ::ng-deep p-checkbox.ng-invalid.ng-dirty .p-checkbox-box{border-color:var(--tk-color-base-red-700, #cf2604)}\n"] }]
139
175
  }], ctorParameters: () => [] });
140
176
 
141
177
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"tekus-design-system-components-checkbox.mjs","sources":["../../../projects/design-system/components/checkbox/src/checkbox.component.ts","../../../projects/design-system/components/checkbox/src/checkbox.component.html","../../../projects/design-system/components/checkbox/tekus-design-system-components-checkbox.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, input, model, signal, OnInit, inject, OnDestroy } from '@angular/core';\nimport { ControlValueAccessor, FormControl, ReactiveFormsModule, NgControl, FormsModule } from '@angular/forms';\nimport { Subscription } from 'rxjs';\nimport { CheckboxModule } from 'primeng/checkbox';\nimport { MessageModule } from 'primeng/message';\n\n@Component({\n selector: 'tk-checkbox',\n imports: [CommonModule, ReactiveFormsModule, FormsModule, CheckboxModule, MessageModule],\n templateUrl: './checkbox.component.html',\n styleUrl: './checkbox.component.scss'\n})\nexport class CheckboxComponent implements ControlValueAccessor, OnInit, OnDestroy {\n readonly ngControl = inject(NgControl, { self: true, optional: true });\n\n constructor() {\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n /**\n * @property {ModelSignal<any>} model\n * @description\n * The value of the checkbox model (checked state or array of values).\n * Supports two-way binding via signals.\n */\n model = model<unknown>();\n\n /**\n * @property {InputSignal<any>} value\n * @description\n * The value of the checkbox itself (used when part of a group).\n */\n value = input<unknown>();\n\n /**\n * @property {InputSignal<string>} label\n * @description\n * Label displayed next to the checkbox.\n */\n label = input<string>('');\n\n /**\n * @property {InputSignal<string>} name\n * @description\n * Name attribute for the checkbox.\n */\n name = input<string>('');\n\n /**\n * @property {InputSignal<string>} inputId\n * @description\n * HTML id attribute for the checkbox input.\n */\n inputId = input<string>('');\n\n /**\n * @property {InputSignal<boolean>} binary\n * @description\n * Boolean property to indicate if the checkbox is a binary toggle.\n * @default false\n */\n binary = input<boolean>(false);\n\n /**\n * @property {InputSignal<FormControl>} control\n * @description\n * External FormControl used to read/set the checkbox value.\n * If not provided, an internal FormControl is created.\n */\n control = input<FormControl>(new FormControl());\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 {boolean} disabled\n * @description\n * Whether the checkbox is disabled.\n */\n disabled = signal<boolean>(false);\n\n get effectiveControl(): FormControl {\n return (this.ngControl?.control as FormControl) || this.control();\n }\n\n onChange: (value: unknown) => void = () => {};\n onTouched: () => void = () => {};\n private readonly subscription = new Subscription();\n\n ngOnInit(): void {\n const control = this.effectiveControl;\n if (control.value !== undefined) {\n this.model.set(control.value);\n }\n\n // Sync initial disabled state\n this.disabled.set(control.disabled);\n\n this.subscription.add(\n control.valueChanges.subscribe(val => {\n if (val !== this.model()) {\n this.model.set(val);\n this.onChange(val);\n }\n })\n );\n\n // Sync disabled state on status change\n this.subscription.add(\n control.statusChanges.subscribe(() => {\n this.disabled.set(control.disabled);\n })\n );\n }\n\n ngOnDestroy(): void {\n this.subscription.unsubscribe();\n }\n\n writeValue(value: unknown): void {\n this.model.set(value);\n this.control().setValue(value, { emitEvent: false });\n }\n\n registerOnChange(fn: (value: unknown) => void): void {\n this.onChange = fn;\n }\n\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\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 onModelChange(value: unknown): void {\n this.model.set(value);\n this.onChange(value);\n this.effectiveControl.setValue(value);\n this.effectiveControl.markAsDirty();\n this.onTouched();\n }\n\n onBlur(): void {\n this.onTouched();\n this.effectiveControl.markAsTouched();\n }\n}\n","<div class=\"tk-checkbox-wrapper\">\n <div class=\"tk-checkbox-group\" [class.tk-disabled]=\"disabled()\">\n <p-checkbox\n [inputId]=\"inputId()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [binary]=\"binary()\"\n [disabled]=\"disabled()\"\n [ngModel]=\"model()\"\n (ngModelChange)=\"onModelChange($event)\"\n [class.ng-invalid]=\"effectiveControl.invalid\"\n [class.ng-dirty]=\"effectiveControl.dirty\"\n [class.ng-touched]=\"effectiveControl.touched\">\n </p-checkbox>\n @if(label()){\n <label [for]=\"inputId()\" class=\"tk-checkbox-label\"> {{ label() }} </label>\n }\n </div>\n \n <div class=\"tk-input-bottom\">\n <div class=\"tk-input-messages\">\n @if ((effectiveControl.invalid && (effectiveControl.dirty || effectiveControl.touched)) && errorMessage()) {\n <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{ errorMessage() }}</p-message>\n }\n </div>\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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"}
1
+ {"version":3,"file":"tekus-design-system-components-checkbox.mjs","sources":["../../../projects/design-system/components/checkbox/src/checkbox.component.ts","../../../projects/design-system/components/checkbox/src/checkbox.component.html","../../../projects/design-system/components/checkbox/tekus-design-system-components-checkbox.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport {\n Component,\n input,\n model,\n OnInit,\n inject,\n OnDestroy,\n} from '@angular/core';\nimport {\n ControlValueAccessor,\n FormControl,\n ReactiveFormsModule,\n NgControl,\n FormsModule,\n} from '@angular/forms';\nimport { Subscription } from 'rxjs';\nimport { CheckboxModule } from 'primeng/checkbox';\nimport { MessageModule } from 'primeng/message';\n\n@Component({\n selector: 'tk-checkbox',\n imports: [\n CommonModule,\n ReactiveFormsModule,\n FormsModule,\n CheckboxModule,\n MessageModule,\n ],\n templateUrl: './checkbox.component.html',\n styleUrl: './checkbox.component.scss',\n})\nexport class CheckboxComponent\n implements ControlValueAccessor, OnInit, OnDestroy\n{\n /** Internal references and injections */\n readonly ngControl = inject(NgControl, { self: true, optional: true });\n\n /**\n * Initialize the component and register it as a ControlValueAccessor.\n */\n constructor() {\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n /** Properties and Signals */\n\n /**\n * @property {ModelSignal<any>} model\n * @description\n * The value of the checkbox model (checked state or array of values).\n * Supports two-way binding via signals.\n */\n model = model<unknown>();\n\n /**\n * @property {InputSignal<any>} value\n * @description\n * The value of the checkbox itself (used when part of a group).\n */\n value = input<unknown>();\n\n /**\n * @property {InputSignal<string>} label\n * @description\n * Label displayed next to the checkbox.\n */\n label = input<string>('');\n\n /**\n * @property {InputSignal<string>} name\n * @description\n * Name attribute for the checkbox.\n */\n name = input<string>('');\n\n /**\n * @property {InputSignal<string>} inputId\n * @description\n * HTML id attribute for the checkbox input.\n */\n inputId = input<string>('');\n\n /**\n * @property {InputSignal<boolean>} binary\n * @description\n * Boolean property to indicate if the checkbox is a binary toggle.\n * @default false\n */\n binary = input<boolean>(false);\n\n /**\n * @property {InputSignal<FormControl>} control\n * @description\n * External FormControl used to read/set the checkbox value.\n * If not provided, an internal FormControl is created.\n */\n control = input<FormControl>(new FormControl());\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 {ModelSignal<boolean>} indeterminate\n * @description\n * Indeterminate state of the checkbox (reactive).\n * Useful for parent checkboxes in lists with partial selection.\n */\n indeterminate = model<boolean>(false);\n\n /**\n * @property {boolean} disabled\n * @description\n * Whether the checkbox is disabled.\n */\n disabled = model<boolean>(false);\n\n /** Component Methods */\n\n get effectiveControl(): FormControl {\n return (this.ngControl?.control as FormControl) || this.control();\n }\n\n onChange: (value: unknown) => void = () => {};\n onTouched: () => void = () => {};\n private readonly subscription = new Subscription();\n\n ngOnInit(): void {\n const control = this.effectiveControl;\n\n if (control.value !== undefined && control.value !== null) {\n this.model.set(control.value);\n }\n\n if (this.control() === control && this.disabled()) {\n control.disable({ emitEvent: false });\n } else {\n this.disabled.set(control.disabled);\n }\n\n this.subscription.add(\n control.statusChanges.subscribe(() => {\n this.disabled.set(control.disabled);\n })\n );\n\n this.subscription.add(\n control.valueChanges.subscribe(value => {\n this.model.set(value);\n })\n );\n }\n\n ngOnDestroy(): void {\n this.subscription.unsubscribe();\n }\n\n /**\n * Implementation of ControlValueAccessor: Writes a new value from the form.\n */\n writeValue(value: unknown): void {\n this.model.set(value);\n }\n\n /**\n * Implementation of ControlValueAccessor: Registers a callback for change events.\n */\n registerOnChange(fn: (value: unknown) => void): void {\n this.onChange = fn;\n }\n\n /**\n * Implementation of ControlValueAccessor: Registers a callback for touched events.\n */\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n /**\n * Implementation of ControlValueAccessor: Sets the disabled state.\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 /**\n * Handle model change events from the template.\n */\n onModelChange(value: unknown): void {\n this.model.set(value);\n this.onChange(value);\n this.effectiveControl.setValue(value, { emitEvent: false });\n this.effectiveControl.markAsDirty();\n this.onTouched();\n }\n\n /**\n * Handle blur events to trigger onTouched.\n */\n onBlur(): void {\n this.onTouched();\n this.effectiveControl.markAsTouched();\n }\n}\n","<div class=\"tk-checkbox-wrapper\">\n <div class=\"tk-checkbox-group\" [class.tk-disabled]=\"disabled()\">\n <p-checkbox\n [inputId]=\"inputId()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [binary]=\"binary()\"\n [disabled]=\"disabled()\"\n [indeterminate]=\"indeterminate()\"\n [ngModel]=\"model()\"\n (ngModelChange)=\"onModelChange($event)\"\n [class.ng-invalid]=\"effectiveControl.invalid\"\n [class.ng-dirty]=\"effectiveControl.dirty\"\n [class.ng-touched]=\"effectiveControl.touched\">\n </p-checkbox>\n @if (label()) {\n <label [for]=\"inputId()\" class=\"tk-checkbox-label\"> {{ label() }} </label>\n }\n </div>\n @if (\n effectiveControl.invalid &&\n (effectiveControl.dirty || effectiveControl.touched) &&\n errorMessage()\n ) {\n <div class=\"tk-input-bottom\">\n <div class=\"tk-input-messages\">\n <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{\n errorMessage()\n }}</p-message>\n </div>\n </div>\n }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
@@ -0,0 +1,280 @@
1
+ import * as i0 from '@angular/core';
2
+ import { viewChild, ViewContainerRef, input, computed, model, EventEmitter, effect, untracked, afterRender, Component, createComponent, Injectable } from '@angular/core';
3
+ import { ButtonComponent } from '@tekus/design-system/components/button';
4
+ import * as i1 from 'primeng/drawer';
5
+ import { DrawerModule } from 'primeng/drawer';
6
+ import * as i2 from 'primeng/api';
7
+ import { Subject } from 'rxjs';
8
+
9
+ /**
10
+ * @component DrawerComponent
11
+ * @description
12
+ * A programmatically controlled drawer overlay used for displaying dynamic content,
13
+ * titles, and header actions. The drawer is opened through a service with a configuration object,
14
+ * similar to tk-modal.
15
+ *
16
+ * This component supports:
17
+ * - Required title with ellipsis for long text.
18
+ * - Optional header action button + close button.
19
+ * - Content as string or component.
20
+ * - Position: always right.
21
+ * - Sizes: small (500px), large (1024px).
22
+ * - Closable and dismissible mask behavior.
23
+ *
24
+ * @usage
25
+ * ### Open a drawer from TypeScript using the drawer service
26
+ * ```ts
27
+ * this.drawerService.open({
28
+ * title: 'Drawer name',
29
+ * content: 'Content text drawer example',
30
+ * headerAction: {
31
+ * label: 'Action',
32
+ * severity: 'primary',
33
+ * action: () => console.log('Action clicked'),
34
+ * returnValue: true,
35
+ * },
36
+ * size: 'small',
37
+ * }).subscribe((result) => {
38
+ * console.log('Drawer closed with value:', result);
39
+ * });
40
+ * ```
41
+ * Modernized for Angular 19 with 100% synchronous Signal-based closing interception.
42
+ */
43
+ class DrawerComponent {
44
+ constructor(elementRef) {
45
+ this.elementRef = elementRef;
46
+ this.contentHost = viewChild('contentHost', {
47
+ read: ViewContainerRef,
48
+ });
49
+ /** The required title displayed at the top left of the drawer header */
50
+ this.title = input.required();
51
+ /** The main content of the drawer. Can be a string or a Component Type. */
52
+ this.content = input(null);
53
+ /** Optional header action button (displayed before close button) */
54
+ this.headerAction = input(null);
55
+ /** Drawer size: 'small' (500px), 'large' (1024px) */
56
+ this.size = input('small');
57
+ /** Whether the drawer can be closed by the user via close button */
58
+ this.closable = input(true);
59
+ /** Whether clicking the mask closes the drawer */
60
+ this.dismissible = input(true);
61
+ /** Optional data to be passed as inputs to the dynamic component. */
62
+ this.data = input({});
63
+ /** Optional interceptor called before the drawer closes. */
64
+ this.interceptor = input(undefined);
65
+ this.isContentString = computed(() => typeof this.content() === 'string');
66
+ this.hasHeaderAction = computed(() => this.headerAction() != null);
67
+ /** Computed: drawer width (responsive) and max-width based on `size`. Always right position. */
68
+ this.drawerStyle = computed(() => {
69
+ const sz = this.size();
70
+ const maxWidth = sz === 'large' ? '1024px' : '500px';
71
+ return {
72
+ width: 'calc(100vw - 1rem)',
73
+ maxWidth,
74
+ };
75
+ });
76
+ /** Visibility flag. Use model for two-way binding when using drawer in template. */
77
+ this.isOpened = model(false);
78
+ /** Whether the drawer content has a scrollbar */
79
+ this.hasScroll = false;
80
+ /** Emits when the drawer closes, passing the return value from header action or null */
81
+ this.onClose = new EventEmitter();
82
+ this.alreadyEmitted = false;
83
+ this.returnValueOnClose = null;
84
+ /**
85
+ * @summary Orchestrates the reactive dynamic lifecycle.
86
+ */
87
+ effect(() => {
88
+ const opened = this.isOpened();
89
+ const host = this.contentHost();
90
+ untracked(() => {
91
+ if (opened && host) {
92
+ this.attachDynamicContent();
93
+ }
94
+ else if (!opened) {
95
+ this.detachDynamicContent();
96
+ }
97
+ });
98
+ });
99
+ effect(() => {
100
+ const currentData = this.data();
101
+ untracked(() => this.syncDynamicInputs(currentData));
102
+ });
103
+ afterRender(() => {
104
+ this.checkScroll();
105
+ });
106
+ }
107
+ ngOnDestroy() {
108
+ this.detachDynamicContent();
109
+ }
110
+ attachDynamicContent() {
111
+ const type = this.content();
112
+ const host = this.contentHost();
113
+ if (!type || typeof type === 'string' || !host)
114
+ return;
115
+ this.detachDynamicContent();
116
+ this.componentRef = host.createComponent(type);
117
+ this.syncDynamicInputs(this.data());
118
+ }
119
+ syncDynamicInputs(data) {
120
+ if (!this.componentRef)
121
+ return;
122
+ Object.entries(data).forEach(([key, value]) => {
123
+ this.componentRef?.setInput(key, value);
124
+ });
125
+ }
126
+ detachDynamicContent() {
127
+ if (this.componentRef) {
128
+ this.componentRef.destroy();
129
+ this.componentRef = undefined;
130
+ }
131
+ }
132
+ /**
133
+ * Checks if the drawer content has a scrollbar and updates `hasScroll` state.
134
+ */
135
+ checkScroll() {
136
+ const contentEl = this.elementRef.nativeElement.querySelector('.p-drawer-content');
137
+ if (contentEl) {
138
+ this.hasScroll = contentEl.scrollHeight > contentEl.clientHeight;
139
+ }
140
+ }
141
+ /** Opens the drawer */
142
+ open() {
143
+ this.isOpened.set(true);
144
+ this.resetClosureState();
145
+ }
146
+ /**
147
+ * @summary Main entry point for closure requests.
148
+ * @returns true if closure was executed.
149
+ */
150
+ tryClose(returnValue = null) {
151
+ if (this.canExecuteClosure()) {
152
+ this.executeClosure(returnValue, arguments.length > 0);
153
+ return true;
154
+ }
155
+ else {
156
+ const instance = this.componentRef?.instance;
157
+ instance?.onBlockedClose?.();
158
+ return false;
159
+ }
160
+ }
161
+ canExecuteClosure() {
162
+ const instance = this.componentRef?.instance;
163
+ const canClose = instance?.canClose ? instance.canClose() : true;
164
+ if (!canClose)
165
+ return false;
166
+ const configInterceptor = this.interceptor();
167
+ if (configInterceptor && !configInterceptor())
168
+ return false;
169
+ return true;
170
+ }
171
+ executeClosure(returnValue, hasReturnValue) {
172
+ if (hasReturnValue) {
173
+ this.alreadyEmitted = true;
174
+ this.returnValueOnClose = returnValue;
175
+ }
176
+ this.isOpened.set(false);
177
+ }
178
+ /** Handles external visibility changes (from p-drawer close button or mask) */
179
+ onVisibleChange(visible) {
180
+ if (!visible) {
181
+ const closed = this.tryClose();
182
+ if (!closed) {
183
+ this.isOpened.set(true);
184
+ }
185
+ }
186
+ }
187
+ /** Closes the drawer and emits onClose */
188
+ handleClose() {
189
+ if (this.isOpened()) {
190
+ return;
191
+ }
192
+ const valueToEmit = this.alreadyEmitted ? this.returnValueOnClose : null;
193
+ this.onClose.emit(valueToEmit);
194
+ this.resetClosureState();
195
+ }
196
+ /** Forcefully closes the drawer without checks */
197
+ close() {
198
+ this.tryClose();
199
+ }
200
+ /**
201
+ * Handles header action button click.
202
+ */
203
+ handleHeaderAction(action, returnValue) {
204
+ if (action)
205
+ action();
206
+ this.tryClose(returnValue);
207
+ }
208
+ resetClosureState() {
209
+ this.alreadyEmitted = false;
210
+ this.returnValueOnClose = null;
211
+ }
212
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DrawerComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
213
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.18", type: DrawerComponent, isStandalone: true, selector: "tk-drawer", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, headerAction: { classPropertyName: "headerAction", publicName: "headerAction", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, interceptor: { classPropertyName: "interceptor", publicName: "interceptor", isSignal: true, isRequired: false, transformFunction: null }, isOpened: { classPropertyName: "isOpened", publicName: "isOpened", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpened: "isOpenedChange" }, viewQueries: [{ propertyName: "contentHost", first: true, predicate: ["contentHost"], descendants: true, read: ViewContainerRef, isSignal: true }], ngImport: i0, template: "<p-drawer\n [modal]=\"true\"\n [visible]=\"isOpened()\"\n (visibleChange)=\"onVisibleChange($event)\"\n [closable]=\"closable()\"\n [dismissible]=\"dismissible()\"\n [closeOnEscape]=\"true\"\n position=\"right\"\n [style]=\"drawerStyle()\"\n [styleClass]=\"'tk-drawer'\"\n [class.tk-drawer--has-scroll]=\"hasScroll\"\n (onHide)=\"handleClose()\">\n <ng-template pTemplate=\"header\">\n <div class=\"tk-drawer__header\">\n <h2 class=\"tk-drawer__title\" [title]=\"title()\">{{ title() }}</h2>\n @if (hasHeaderAction()) {\n <div class=\"tk-drawer__actions\">\n <tk-button\n [label]=\"headerAction()!.label\"\n [severity]=\"headerAction()!.severity\"\n [variant]=\"headerAction()!.variant\"\n (clicked)=\"\n handleHeaderAction(\n headerAction()!.action,\n headerAction()!.returnValue\n )\n \" />\n </div>\n }\n </div>\n </ng-template>\n\n <section class=\"tk-drawer__content\">\n @if (content()) {\n @if (isContentString()) {\n <p [innerHTML]=\"content()\"></p>\n } @else {\n <ng-template #contentHost></ng-template>\n }\n }\n </section>\n</p-drawer>\n", styles: [":host ::ng-deep .tk-drawer{max-height:100vh;display:flex;flex-direction:column}:host ::ng-deep .tk-drawer__content{flex:1;overflow-y:auto;padding:var(--tk-spacing-paddingX-m, 1.5rem)}:host ::ng-deep .p-drawer-content{overflow-y:auto;display:flex;flex-direction:column;flex:1}:host ::ng-deep .p-drawer-close-button{color:var(--tk-color-base-surface-500, #8a8a8b)}:host ::ng-deep .p-drawer-close-button:hover{background:var(--tk-color-base-surface-100, #f0f0f0)!important;color:var(--tk-color-base-surface-500, #8a8a8b)}.tk-drawer--has-scroll .p-drawer-header{border-bottom:1px solid var(--tk-color-base-surface-200, #e2e8f0);box-shadow:0 2px 4px #00000005}.tk-drawer__header{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--tk-spacing-base-100, 1rem);flex-shrink:0;width:calc(100% - var(--tk-spacing-base-250, 2.5rem))}.tk-drawer__title{margin:0;font-size:var(--tk-font-size-headers-s, 1.125rem);font-weight:var(--tk-font-weight-600, 600);color:var(--tk-color-text-default, #212121);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.tk-drawer__actions{display:flex;flex-direction:row;align-items:center;gap:var(--tk-spacing-base-50, .5rem);flex-shrink:0;padding-right:var(--tk-spacing-paddingX-xs, .25rem)}\n"], dependencies: [{ kind: "ngmodule", type: DrawerModule }, { kind: "component", type: i1.Drawer, selector: "p-drawer", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "closeButtonProps", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen", "header", "maskStyle", "closable"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: ButtonComponent, selector: "tk-button", inputs: ["label", "disabled", "type", "severity", "variant", "link", "icon", "tooltipText"], outputs: ["clicked"] }] }); }
214
+ }
215
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DrawerComponent, decorators: [{
216
+ type: Component,
217
+ args: [{ selector: 'tk-drawer', standalone: true, imports: [DrawerModule, ButtonComponent], template: "<p-drawer\n [modal]=\"true\"\n [visible]=\"isOpened()\"\n (visibleChange)=\"onVisibleChange($event)\"\n [closable]=\"closable()\"\n [dismissible]=\"dismissible()\"\n [closeOnEscape]=\"true\"\n position=\"right\"\n [style]=\"drawerStyle()\"\n [styleClass]=\"'tk-drawer'\"\n [class.tk-drawer--has-scroll]=\"hasScroll\"\n (onHide)=\"handleClose()\">\n <ng-template pTemplate=\"header\">\n <div class=\"tk-drawer__header\">\n <h2 class=\"tk-drawer__title\" [title]=\"title()\">{{ title() }}</h2>\n @if (hasHeaderAction()) {\n <div class=\"tk-drawer__actions\">\n <tk-button\n [label]=\"headerAction()!.label\"\n [severity]=\"headerAction()!.severity\"\n [variant]=\"headerAction()!.variant\"\n (clicked)=\"\n handleHeaderAction(\n headerAction()!.action,\n headerAction()!.returnValue\n )\n \" />\n </div>\n }\n </div>\n </ng-template>\n\n <section class=\"tk-drawer__content\">\n @if (content()) {\n @if (isContentString()) {\n <p [innerHTML]=\"content()\"></p>\n } @else {\n <ng-template #contentHost></ng-template>\n }\n }\n </section>\n</p-drawer>\n", styles: [":host ::ng-deep .tk-drawer{max-height:100vh;display:flex;flex-direction:column}:host ::ng-deep .tk-drawer__content{flex:1;overflow-y:auto;padding:var(--tk-spacing-paddingX-m, 1.5rem)}:host ::ng-deep .p-drawer-content{overflow-y:auto;display:flex;flex-direction:column;flex:1}:host ::ng-deep .p-drawer-close-button{color:var(--tk-color-base-surface-500, #8a8a8b)}:host ::ng-deep .p-drawer-close-button:hover{background:var(--tk-color-base-surface-100, #f0f0f0)!important;color:var(--tk-color-base-surface-500, #8a8a8b)}.tk-drawer--has-scroll .p-drawer-header{border-bottom:1px solid var(--tk-color-base-surface-200, #e2e8f0);box-shadow:0 2px 4px #00000005}.tk-drawer__header{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--tk-spacing-base-100, 1rem);flex-shrink:0;width:calc(100% - var(--tk-spacing-base-250, 2.5rem))}.tk-drawer__title{margin:0;font-size:var(--tk-font-size-headers-s, 1.125rem);font-weight:var(--tk-font-weight-600, 600);color:var(--tk-color-text-default, #212121);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.tk-drawer__actions{display:flex;flex-direction:row;align-items:center;gap:var(--tk-spacing-base-50, .5rem);flex-shrink:0;padding-right:var(--tk-spacing-paddingX-xs, .25rem)}\n"] }]
218
+ }], ctorParameters: () => [{ type: i0.ElementRef }] });
219
+
220
+ class DrawerService {
221
+ constructor(appRef) {
222
+ this.appRef = appRef;
223
+ this.drawerRef = null;
224
+ }
225
+ get _drawerRefForTesting() {
226
+ return this.drawerRef;
227
+ }
228
+ set _drawerRefForTesting(ref) {
229
+ this.drawerRef = ref;
230
+ }
231
+ open(config) {
232
+ if (this.drawerRef) {
233
+ this.drawerRef.instance.close();
234
+ this.appRef.detachView(this.drawerRef.hostView);
235
+ this.drawerRef.destroy();
236
+ this.drawerRef = null;
237
+ }
238
+ const componentRef = createComponent(DrawerComponent, {
239
+ environmentInjector: this.appRef.injector,
240
+ });
241
+ this.appRef.attachView(componentRef.hostView);
242
+ const domElem = componentRef.hostView
243
+ .rootNodes[0];
244
+ document.body.appendChild(domElem);
245
+ componentRef.setInput('title', config.title);
246
+ componentRef.setInput('content', config.content ?? null);
247
+ componentRef.setInput('headerAction', config.headerAction ?? null);
248
+ componentRef.setInput('size', config.size ?? 'small');
249
+ componentRef.setInput('closable', config.closable ?? true);
250
+ componentRef.setInput('dismissible', config.dismissible ?? true);
251
+ componentRef.setInput('data', config.data ?? {});
252
+ componentRef.setInput('interceptor', config.interceptor ?? undefined);
253
+ const close$ = new Subject();
254
+ componentRef.instance.onClose.subscribe(value => {
255
+ close$.next(value);
256
+ close$.complete();
257
+ this.appRef.detachView(componentRef.hostView);
258
+ componentRef.destroy();
259
+ if (this.drawerRef === componentRef) {
260
+ this.drawerRef = null;
261
+ }
262
+ });
263
+ componentRef.instance.open();
264
+ this.drawerRef = componentRef;
265
+ return close$.asObservable();
266
+ }
267
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DrawerService, deps: [{ token: i0.ApplicationRef }], target: i0.ɵɵFactoryTarget.Injectable }); }
268
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DrawerService, providedIn: 'root' }); }
269
+ }
270
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DrawerService, decorators: [{
271
+ type: Injectable,
272
+ args: [{ providedIn: 'root' }]
273
+ }], ctorParameters: () => [{ type: i0.ApplicationRef }] });
274
+
275
+ /**
276
+ * Generated bundle index. Do not edit.
277
+ */
278
+
279
+ export { DrawerComponent, DrawerService };
280
+ //# sourceMappingURL=tekus-design-system-components-drawer.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tekus-design-system-components-drawer.mjs","sources":["../../../projects/design-system/components/drawer/src/drawer.component.ts","../../../projects/design-system/components/drawer/src/drawer.component.html","../../../projects/design-system/components/drawer/src/services/drawer.service.ts","../../../projects/design-system/components/drawer/tekus-design-system-components-drawer.ts"],"sourcesContent":["import {\n Component,\n computed,\n input,\n model,\n EventEmitter,\n Type,\n ElementRef,\n ViewContainerRef,\n viewChild,\n ComponentRef,\n effect,\n untracked,\n OnDestroy,\n afterRender,\n} from '@angular/core';\nimport { ButtonComponent } from '@tekus/design-system/components/button';\nimport { DrawerModule } from 'primeng/drawer';\nimport { DrawerHeaderAction, DrawerSizeType } from './drawer.types';\nimport {\n TkCanClose,\n TkCloseInterceptor,\n} from '@tekus/design-system/core/types';\n\n/**\n * @component DrawerComponent\n * @description\n * A programmatically controlled drawer overlay used for displaying dynamic content,\n * titles, and header actions. The drawer is opened through a service with a configuration object,\n * similar to tk-modal.\n *\n * This component supports:\n * - Required title with ellipsis for long text.\n * - Optional header action button + close button.\n * - Content as string or component.\n * - Position: always right.\n * - Sizes: small (500px), large (1024px).\n * - Closable and dismissible mask behavior.\n *\n * @usage\n * ### Open a drawer from TypeScript using the drawer service\n * ```ts\n * this.drawerService.open({\n * title: 'Drawer name',\n * content: 'Content text drawer example',\n * headerAction: {\n * label: 'Action',\n * severity: 'primary',\n * action: () => console.log('Action clicked'),\n * returnValue: true,\n * },\n * size: 'small',\n * }).subscribe((result) => {\n * console.log('Drawer closed with value:', result);\n * });\n * ```\n * Modernized for Angular 19 with 100% synchronous Signal-based closing interception.\n */\n@Component({\n selector: 'tk-drawer',\n standalone: true,\n imports: [DrawerModule, ButtonComponent],\n templateUrl: './drawer.component.html',\n styleUrls: ['./drawer.component.scss'],\n})\nexport class DrawerComponent<T = unknown> implements OnDestroy {\n private readonly contentHost = viewChild('contentHost', {\n read: ViewContainerRef,\n });\n private componentRef?: ComponentRef<T>;\n\n /** The required title displayed at the top left of the drawer header */\n title = input.required<string>();\n\n /** The main content of the drawer. Can be a string or a Component Type. */\n content = input<string | Type<T> | null>(null);\n\n /** Optional header action button (displayed before close button) */\n headerAction = input<DrawerHeaderAction | null>(null);\n\n /** Drawer size: 'small' (500px), 'large' (1024px) */\n size = input<DrawerSizeType>('small');\n\n /** Whether the drawer can be closed by the user via close button */\n closable = input<boolean>(true);\n\n /** Whether clicking the mask closes the drawer */\n dismissible = input<boolean>(true);\n\n /** Optional data to be passed as inputs to the dynamic component. */\n data = input<Partial<T>>({});\n\n /** Optional interceptor called before the drawer closes. */\n interceptor = input<TkCloseInterceptor | undefined>(undefined);\n\n isContentString = computed(() => typeof this.content() === 'string');\n hasHeaderAction = computed(() => this.headerAction() != null);\n\n /** Computed: drawer width (responsive) and max-width based on `size`. Always right position. */\n drawerStyle = computed(() => {\n const sz = this.size();\n const maxWidth = sz === 'large' ? '1024px' : '500px';\n return {\n width: 'calc(100vw - 1rem)',\n maxWidth,\n };\n });\n\n /** Visibility flag. Use model for two-way binding when using drawer in template. */\n isOpened = model<boolean>(false);\n\n /** Whether the drawer content has a scrollbar */\n hasScroll = false;\n\n /** Emits when the drawer closes, passing the return value from header action or null */\n readonly onClose = new EventEmitter<unknown>();\n private alreadyEmitted = false;\n private returnValueOnClose: unknown = null;\n\n constructor(private readonly elementRef: ElementRef) {\n /**\n * @summary Orchestrates the reactive dynamic lifecycle.\n */\n effect(() => {\n const opened = this.isOpened();\n const host = this.contentHost();\n\n untracked(() => {\n if (opened && host) {\n this.attachDynamicContent();\n } else if (!opened) {\n this.detachDynamicContent();\n }\n });\n });\n\n effect(() => {\n const currentData = this.data();\n untracked(() => this.syncDynamicInputs(currentData));\n });\n\n afterRender(() => {\n this.checkScroll();\n });\n }\n\n ngOnDestroy(): void {\n this.detachDynamicContent();\n }\n\n private attachDynamicContent(): void {\n const type = this.content();\n const host = this.contentHost();\n\n if (!type || typeof type === 'string' || !host) return;\n this.detachDynamicContent();\n this.componentRef = host.createComponent(type);\n this.syncDynamicInputs(this.data());\n }\n\n private syncDynamicInputs(data: Partial<T>): void {\n if (!this.componentRef) return;\n Object.entries(data).forEach(([key, value]) => {\n this.componentRef?.setInput(key, value);\n });\n }\n\n private detachDynamicContent(): void {\n if (this.componentRef) {\n this.componentRef.destroy();\n this.componentRef = undefined;\n }\n }\n\n /**\n * Checks if the drawer content has a scrollbar and updates `hasScroll` state.\n */\n checkScroll(): void {\n const contentEl =\n this.elementRef.nativeElement.querySelector('.p-drawer-content');\n if (contentEl) {\n this.hasScroll = contentEl.scrollHeight > contentEl.clientHeight;\n }\n }\n\n /** Opens the drawer */\n open(): void {\n this.isOpened.set(true);\n this.resetClosureState();\n }\n\n /**\n * @summary Main entry point for closure requests.\n * @returns true if closure was executed.\n */\n tryClose(returnValue: unknown = null): boolean {\n if (this.canExecuteClosure()) {\n this.executeClosure(returnValue, arguments.length > 0);\n return true;\n } else {\n const instance = this.componentRef?.instance as TkCanClose | undefined;\n instance?.onBlockedClose?.();\n return false;\n }\n }\n\n private canExecuteClosure(): boolean {\n const instance = this.componentRef?.instance as TkCanClose | undefined;\n const canClose = instance?.canClose ? instance.canClose() : true;\n if (!canClose) return false;\n\n const configInterceptor = this.interceptor();\n if (configInterceptor && !configInterceptor()) return false;\n\n return true;\n }\n\n private executeClosure(returnValue: unknown, hasReturnValue: boolean): void {\n if (hasReturnValue) {\n this.alreadyEmitted = true;\n this.returnValueOnClose = returnValue;\n }\n this.isOpened.set(false);\n }\n\n /** Handles external visibility changes (from p-drawer close button or mask) */\n onVisibleChange(visible: boolean): void {\n if (!visible) {\n const closed = this.tryClose();\n\n if (!closed) {\n this.isOpened.set(true);\n }\n }\n }\n\n /** Closes the drawer and emits onClose */\n handleClose(): void {\n if (this.isOpened()) {\n return;\n }\n const valueToEmit = this.alreadyEmitted ? this.returnValueOnClose : null;\n this.onClose.emit(valueToEmit);\n this.resetClosureState();\n }\n\n /** Forcefully closes the drawer without checks */\n close(): void {\n this.tryClose();\n }\n\n /**\n * Handles header action button click.\n */\n handleHeaderAction(\n action: (() => void) | undefined,\n returnValue: unknown\n ): void {\n if (action) action();\n this.tryClose(returnValue);\n }\n\n private resetClosureState(): void {\n this.alreadyEmitted = false;\n this.returnValueOnClose = null;\n }\n}\n","<p-drawer\n [modal]=\"true\"\n [visible]=\"isOpened()\"\n (visibleChange)=\"onVisibleChange($event)\"\n [closable]=\"closable()\"\n [dismissible]=\"dismissible()\"\n [closeOnEscape]=\"true\"\n position=\"right\"\n [style]=\"drawerStyle()\"\n [styleClass]=\"'tk-drawer'\"\n [class.tk-drawer--has-scroll]=\"hasScroll\"\n (onHide)=\"handleClose()\">\n <ng-template pTemplate=\"header\">\n <div class=\"tk-drawer__header\">\n <h2 class=\"tk-drawer__title\" [title]=\"title()\">{{ title() }}</h2>\n @if (hasHeaderAction()) {\n <div class=\"tk-drawer__actions\">\n <tk-button\n [label]=\"headerAction()!.label\"\n [severity]=\"headerAction()!.severity\"\n [variant]=\"headerAction()!.variant\"\n (clicked)=\"\n handleHeaderAction(\n headerAction()!.action,\n headerAction()!.returnValue\n )\n \" />\n </div>\n }\n </div>\n </ng-template>\n\n <section class=\"tk-drawer__content\">\n @if (content()) {\n @if (isContentString()) {\n <p [innerHTML]=\"content()\"></p>\n } @else {\n <ng-template #contentHost></ng-template>\n }\n }\n </section>\n</p-drawer>\n","import {\n Injectable,\n ApplicationRef,\n ComponentRef,\n createComponent,\n EmbeddedViewRef,\n} from '@angular/core';\nimport { DrawerComponent } from '../drawer.component';\nimport { Observable, Subject } from 'rxjs';\nimport { DrawerConfig } from '../drawer.types';\n\n@Injectable({ providedIn: 'root' })\nexport class DrawerService {\n private drawerRef: ComponentRef<DrawerComponent<unknown>> | null = null;\n\n constructor(private readonly appRef: ApplicationRef) {}\n\n get _drawerRefForTesting(): ComponentRef<DrawerComponent<unknown>> | null {\n return this.drawerRef;\n }\n set _drawerRefForTesting(ref: ComponentRef<DrawerComponent<unknown>> | null) {\n this.drawerRef = ref;\n }\n\n open(config: DrawerConfig): Observable<unknown> {\n if (this.drawerRef) {\n this.drawerRef.instance.close();\n this.appRef.detachView(this.drawerRef.hostView);\n this.drawerRef.destroy();\n this.drawerRef = null;\n }\n\n const componentRef = createComponent(DrawerComponent, {\n environmentInjector: this.appRef.injector,\n });\n\n this.appRef.attachView(componentRef.hostView);\n\n const domElem = (componentRef.hostView as EmbeddedViewRef<unknown>)\n .rootNodes[0] as HTMLElement;\n document.body.appendChild(domElem);\n\n componentRef.setInput('title', config.title);\n componentRef.setInput('content', config.content ?? null);\n componentRef.setInput('headerAction', config.headerAction ?? null);\n componentRef.setInput('size', config.size ?? 'small');\n componentRef.setInput('closable', config.closable ?? true);\n componentRef.setInput('dismissible', config.dismissible ?? true);\n componentRef.setInput('data', config.data ?? {});\n componentRef.setInput('interceptor', config.interceptor ?? undefined);\n\n const close$ = new Subject<unknown>();\n\n componentRef.instance.onClose.subscribe(value => {\n close$.next(value);\n close$.complete();\n\n this.appRef.detachView(componentRef.hostView);\n componentRef.destroy();\n if (this.drawerRef === (componentRef as unknown)) {\n this.drawerRef = null;\n }\n });\n\n componentRef.instance.open();\n this.drawerRef = componentRef as unknown as ComponentRef<\n DrawerComponent<unknown>\n >;\n\n return close$.asObservable();\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}