@masterteam/components 0.0.165 → 0.0.167

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 (55) hide show
  1. package/assets/common.css +2 -2
  2. package/assets/i18n/ar.json +128 -0
  3. package/assets/i18n/en.json +128 -0
  4. package/fesm2022/masterteam-components-business-fields.mjs +40 -20
  5. package/fesm2022/masterteam-components-business-fields.mjs.map +1 -1
  6. package/fesm2022/masterteam-components-client-page.mjs +6 -4
  7. package/fesm2022/masterteam-components-client-page.mjs.map +1 -1
  8. package/fesm2022/masterteam-components-drawer.mjs +4 -2
  9. package/fesm2022/masterteam-components-drawer.mjs.map +1 -1
  10. package/fesm2022/masterteam-components-dynamic-drawer.mjs +9 -4
  11. package/fesm2022/masterteam-components-dynamic-drawer.mjs.map +1 -1
  12. package/fesm2022/masterteam-components-entities.mjs +34 -13
  13. package/fesm2022/masterteam-components-entities.mjs.map +1 -1
  14. package/fesm2022/masterteam-components-formula.mjs +52 -14
  15. package/fesm2022/masterteam-components-formula.mjs.map +1 -1
  16. package/fesm2022/masterteam-components-icon-field.mjs +4 -3
  17. package/fesm2022/masterteam-components-icon-field.mjs.map +1 -1
  18. package/fesm2022/masterteam-components-modal.mjs +35 -0
  19. package/fesm2022/masterteam-components-modal.mjs.map +1 -1
  20. package/fesm2022/masterteam-components-module-summary-card.mjs +4 -2
  21. package/fesm2022/masterteam-components-module-summary-card.mjs.map +1 -1
  22. package/fesm2022/masterteam-components-pick-list-field.mjs +5 -3
  23. package/fesm2022/masterteam-components-pick-list-field.mjs.map +1 -1
  24. package/fesm2022/masterteam-components-runtime-action.mjs +21 -13
  25. package/fesm2022/masterteam-components-runtime-action.mjs.map +1 -1
  26. package/fesm2022/masterteam-components-sidebar.mjs +3 -2
  27. package/fesm2022/masterteam-components-sidebar.mjs.map +1 -1
  28. package/fesm2022/masterteam-components-table.mjs +60 -13
  29. package/fesm2022/masterteam-components-table.mjs.map +1 -1
  30. package/fesm2022/masterteam-components-tabs.mjs +4 -2
  31. package/fesm2022/masterteam-components-tabs.mjs.map +1 -1
  32. package/fesm2022/masterteam-components-text-field.mjs +16 -4
  33. package/fesm2022/masterteam-components-text-field.mjs.map +1 -1
  34. package/fesm2022/masterteam-components-topbar.mjs +3 -2
  35. package/fesm2022/masterteam-components-topbar.mjs.map +1 -1
  36. package/fesm2022/masterteam-components-upload-field.mjs +4 -3
  37. package/fesm2022/masterteam-components-upload-field.mjs.map +1 -1
  38. package/fesm2022/masterteam-components-user-search-field.mjs +5 -6
  39. package/fesm2022/masterteam-components-user-search-field.mjs.map +1 -1
  40. package/package.json +1 -1
  41. package/types/masterteam-components-business-fields.d.ts +2 -0
  42. package/types/masterteam-components-client-page.d.ts +2 -1
  43. package/types/masterteam-components-drawer.d.ts +1 -0
  44. package/types/masterteam-components-dynamic-drawer.d.ts +2 -0
  45. package/types/masterteam-components-entities.d.ts +4 -0
  46. package/types/masterteam-components-formula.d.ts +7 -3
  47. package/types/masterteam-components-modal.d.ts +10 -2
  48. package/types/masterteam-components-module-summary-card.d.ts +1 -0
  49. package/types/masterteam-components-pick-list-field.d.ts +1 -0
  50. package/types/masterteam-components-runtime-action.d.ts +2 -0
  51. package/types/masterteam-components-table.d.ts +28 -13
  52. package/types/masterteam-components-tabs.d.ts +1 -0
  53. package/types/masterteam-components-text-field.d.ts +4 -3
  54. package/types/masterteam-components-upload-field.d.ts +1 -0
  55. package/types/masterteam-components-user-search-field.d.ts +0 -1
@@ -6,10 +6,10 @@ import * as i2 from '@angular/forms';
6
6
  import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
7
7
  import * as i1 from '@angular/cdk/drag-drop';
8
8
  import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
9
+ import * as i3 from '@jsverse/transloco';
10
+ import { TranslocoPipe, TranslocoService, TranslocoModule } from '@jsverse/transloco';
9
11
  import { Subject, isObservable, from, firstValueFrom, of } from 'rxjs';
10
12
  import { debounceTime, filter, takeUntil, catchError } from 'rxjs/operators';
11
- import * as i3 from '@jsverse/transloco';
12
- import { TranslocoModule } from '@jsverse/transloco';
13
13
  import * as i1$1 from 'primeng/tooltip';
14
14
  import { TooltipModule } from 'primeng/tooltip';
15
15
 
@@ -991,17 +991,17 @@ class FormulaEditor {
991
991
  useExisting: forwardRef(() => FormulaEditor),
992
992
  multi: true,
993
993
  },
994
- ], ngImport: i0, template: "<div\r\n [class]=\"containerClasses()\"\r\n [class.opacity-60]=\"disabled()\"\r\n [class.pointer-events-none]=\"disabled()\"\r\n (focus)=\"handleFocus()\"\r\n (blur)=\"handleBlur()\"\r\n tabindex=\"0\"\r\n>\r\n <!-- Line Numbers -->\r\n <div [class]=\"lineNumberClasses()\">\r\n @for (line of lines(); track $index) {\r\n <div class=\"text-surface-400 dark:text-surface-500 text-sm leading-6\">\r\n {{ $index + 1 }}\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Editor Content - Single Drop Zone -->\r\n <div\r\n class=\"flex-1 p-2 flex flex-wrap gap-0.5 items-start content-start min-h-14 cursor-text\"\r\n cdkDropList\r\n cdkDropListOrientation=\"mixed\"\r\n [cdkDropListData]=\"tokens()\"\r\n [cdkDropListDisabled]=\"disabled()\"\r\n (cdkDropListDropped)=\"onDrop($event)\"\r\n >\r\n @if (tokens().length === 0) {\r\n <div class=\"text-surface-400 dark:text-surface-500 text-sm italic\">\r\n {{ placeholder() }}\r\n </div>\r\n } @else {\r\n @for (token of tokens(); track token.id; let i = $index) {\r\n <div\r\n class=\"relative inline-flex items-center group\"\r\n cdkDrag\r\n [cdkDragData]=\"token\"\r\n [cdkDragDisabled]=\"disabled()\"\r\n (cdkDragStarted)=\"onDragStart($event, token, i)\"\r\n (cdkDragEnded)=\"onDragEnd()\"\r\n >\r\n <!-- Drag Placeholder (thin cursor line) -->\r\n <div\r\n *cdkDragPlaceholder\r\n class=\"w-2 min-w-2 h-5 bg-primary rounded-sm opacity-80\"\r\n ></div>\r\n\r\n <!-- Token -->\r\n <span\r\n [class]=\"getTokenClasses(token)\"\r\n [class.border-b-2]=\"!isDragging() && isHighlighted(token)\"\r\n [class.border-primary]=\"!isDragging() && isHighlighted(token)\"\r\n (mouseenter)=\"onTokenHover(token)\"\r\n (mouseleave)=\"onTokenLeave()\"\r\n >\r\n {{ token.display ?? token.value }}\r\n </span>\r\n\r\n <!-- Delete Button (shows on hover, hidden during drag) -->\r\n @if (!isDragging() && !disabled()) {\r\n <button\r\n type=\"button\"\r\n class=\"absolute -top-1.5 -right-1.5 w-3.5 h-3.5 flex items-center justify-center bg-red-500 hover:bg-red-600 text-white rounded-full cursor-pointer scale-75 hover:scale-100 opacity-0 group-hover:opacity-100 pointer-events-none group-hover:pointer-events-auto z-10\"\r\n (click)=\"removeToken(token, i); $event.stopPropagation()\"\r\n [title]=\"\r\n token.dragBehavior === 'function' ? 'Remove function' : 'Remove'\r\n \"\r\n >\r\n <svg\r\n class=\"h-2.5 w-2.5\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n stroke-width=\"3\"\r\n >\r\n <path\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M6 18L18 6M6 6l12 12\"\r\n />\r\n </svg>\r\n </button>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n</div>\r\n", styles: [".cdk-drag-preview{width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important;max-width:20px!important;max-height:20px!important;border-radius:4px;opacity:.9;overflow:hidden!important;cursor:grabbing}.cdk-drag-animating{transition:none!important}.cdk-drag-dragging{opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i1.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "ngmodule", type: FormsModule }] });
994
+ ], ngImport: i0, template: "<div\r\n [class]=\"containerClasses()\"\r\n [class.opacity-60]=\"disabled()\"\r\n [class.pointer-events-none]=\"disabled()\"\r\n (focus)=\"handleFocus()\"\r\n (blur)=\"handleBlur()\"\r\n tabindex=\"0\"\r\n>\r\n <!-- Line Numbers -->\r\n <div [class]=\"lineNumberClasses()\">\r\n @for (line of lines(); track $index) {\r\n <div class=\"text-surface-400 dark:text-surface-500 text-sm leading-6\">\r\n {{ $index + 1 }}\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Editor Content - Single Drop Zone -->\r\n <div\r\n class=\"flex-1 p-2 flex flex-wrap gap-0.5 items-start content-start min-h-14 cursor-text\"\r\n cdkDropList\r\n cdkDropListOrientation=\"mixed\"\r\n [cdkDropListData]=\"tokens()\"\r\n [cdkDropListDisabled]=\"disabled()\"\r\n (cdkDropListDropped)=\"onDrop($event)\"\r\n >\r\n @if (tokens().length === 0) {\r\n <div class=\"text-surface-400 dark:text-surface-500 text-sm italic\">\r\n {{ placeholder() }}\r\n </div>\r\n } @else {\r\n @for (token of tokens(); track token.id; let i = $index) {\r\n <div\r\n class=\"relative inline-flex items-center group\"\r\n cdkDrag\r\n [cdkDragData]=\"token\"\r\n [cdkDragDisabled]=\"disabled()\"\r\n (cdkDragStarted)=\"onDragStart($event, token, i)\"\r\n (cdkDragEnded)=\"onDragEnd()\"\r\n >\r\n <!-- Drag Placeholder (thin cursor line) -->\r\n <div\r\n *cdkDragPlaceholder\r\n class=\"w-2 min-w-2 h-5 bg-primary rounded-sm opacity-80\"\r\n ></div>\r\n\r\n <!-- Token -->\r\n <span\r\n [class]=\"getTokenClasses(token)\"\r\n [class.border-b-2]=\"!isDragging() && isHighlighted(token)\"\r\n [class.border-primary]=\"!isDragging() && isHighlighted(token)\"\r\n (mouseenter)=\"onTokenHover(token)\"\r\n (mouseleave)=\"onTokenLeave()\"\r\n >\r\n {{ token.display ?? token.value }}\r\n </span>\r\n\r\n <!-- Delete Button (shows on hover, hidden during drag) -->\r\n @if (!isDragging() && !disabled()) {\r\n <button\r\n type=\"button\"\r\n class=\"absolute -top-1.5 -right-1.5 w-3.5 h-3.5 flex items-center justify-center bg-red-500 hover:bg-red-600 text-white rounded-full cursor-pointer scale-75 hover:scale-100 opacity-0 group-hover:opacity-100 pointer-events-none group-hover:pointer-events-auto z-10\"\r\n (click)=\"removeToken(token, i); $event.stopPropagation()\"\r\n [title]=\"\r\n token.dragBehavior === 'function'\r\n ? ('components.formulaEditor.removeFunction' | transloco)\r\n : ('components.formulaEditor.remove' | transloco)\r\n \"\r\n >\r\n <svg\r\n class=\"h-2.5 w-2.5\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n stroke-width=\"3\"\r\n >\r\n <path\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M6 18L18 6M6 6l12 12\"\r\n />\r\n </svg>\r\n </button>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n</div>\r\n", styles: [".cdk-drag-preview{width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important;max-width:20px!important;max-height:20px!important;border-radius:4px;opacity:.9;overflow:hidden!important;cursor:grabbing}.cdk-drag-animating{transition:none!important}.cdk-drag-dragging{opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i1.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "ngmodule", type: FormsModule }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }] });
995
995
  }
996
996
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: FormulaEditor, decorators: [{
997
997
  type: Component,
998
- args: [{ selector: 'mt-formula-editor', standalone: true, imports: [CommonModule, DragDropModule, FormsModule], providers: [
998
+ args: [{ selector: 'mt-formula-editor', standalone: true, imports: [CommonModule, DragDropModule, FormsModule, TranslocoPipe], providers: [
999
999
  {
1000
1000
  provide: NG_VALUE_ACCESSOR,
1001
1001
  useExisting: forwardRef(() => FormulaEditor),
1002
1002
  multi: true,
1003
1003
  },
1004
- ], template: "<div\r\n [class]=\"containerClasses()\"\r\n [class.opacity-60]=\"disabled()\"\r\n [class.pointer-events-none]=\"disabled()\"\r\n (focus)=\"handleFocus()\"\r\n (blur)=\"handleBlur()\"\r\n tabindex=\"0\"\r\n>\r\n <!-- Line Numbers -->\r\n <div [class]=\"lineNumberClasses()\">\r\n @for (line of lines(); track $index) {\r\n <div class=\"text-surface-400 dark:text-surface-500 text-sm leading-6\">\r\n {{ $index + 1 }}\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Editor Content - Single Drop Zone -->\r\n <div\r\n class=\"flex-1 p-2 flex flex-wrap gap-0.5 items-start content-start min-h-14 cursor-text\"\r\n cdkDropList\r\n cdkDropListOrientation=\"mixed\"\r\n [cdkDropListData]=\"tokens()\"\r\n [cdkDropListDisabled]=\"disabled()\"\r\n (cdkDropListDropped)=\"onDrop($event)\"\r\n >\r\n @if (tokens().length === 0) {\r\n <div class=\"text-surface-400 dark:text-surface-500 text-sm italic\">\r\n {{ placeholder() }}\r\n </div>\r\n } @else {\r\n @for (token of tokens(); track token.id; let i = $index) {\r\n <div\r\n class=\"relative inline-flex items-center group\"\r\n cdkDrag\r\n [cdkDragData]=\"token\"\r\n [cdkDragDisabled]=\"disabled()\"\r\n (cdkDragStarted)=\"onDragStart($event, token, i)\"\r\n (cdkDragEnded)=\"onDragEnd()\"\r\n >\r\n <!-- Drag Placeholder (thin cursor line) -->\r\n <div\r\n *cdkDragPlaceholder\r\n class=\"w-2 min-w-2 h-5 bg-primary rounded-sm opacity-80\"\r\n ></div>\r\n\r\n <!-- Token -->\r\n <span\r\n [class]=\"getTokenClasses(token)\"\r\n [class.border-b-2]=\"!isDragging() && isHighlighted(token)\"\r\n [class.border-primary]=\"!isDragging() && isHighlighted(token)\"\r\n (mouseenter)=\"onTokenHover(token)\"\r\n (mouseleave)=\"onTokenLeave()\"\r\n >\r\n {{ token.display ?? token.value }}\r\n </span>\r\n\r\n <!-- Delete Button (shows on hover, hidden during drag) -->\r\n @if (!isDragging() && !disabled()) {\r\n <button\r\n type=\"button\"\r\n class=\"absolute -top-1.5 -right-1.5 w-3.5 h-3.5 flex items-center justify-center bg-red-500 hover:bg-red-600 text-white rounded-full cursor-pointer scale-75 hover:scale-100 opacity-0 group-hover:opacity-100 pointer-events-none group-hover:pointer-events-auto z-10\"\r\n (click)=\"removeToken(token, i); $event.stopPropagation()\"\r\n [title]=\"\r\n token.dragBehavior === 'function' ? 'Remove function' : 'Remove'\r\n \"\r\n >\r\n <svg\r\n class=\"h-2.5 w-2.5\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n stroke-width=\"3\"\r\n >\r\n <path\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M6 18L18 6M6 6l12 12\"\r\n />\r\n </svg>\r\n </button>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n</div>\r\n", styles: [".cdk-drag-preview{width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important;max-width:20px!important;max-height:20px!important;border-radius:4px;opacity:.9;overflow:hidden!important;cursor:grabbing}.cdk-drag-animating{transition:none!important}.cdk-drag-dragging{opacity:1}\n"] }]
1004
+ ], template: "<div\r\n [class]=\"containerClasses()\"\r\n [class.opacity-60]=\"disabled()\"\r\n [class.pointer-events-none]=\"disabled()\"\r\n (focus)=\"handleFocus()\"\r\n (blur)=\"handleBlur()\"\r\n tabindex=\"0\"\r\n>\r\n <!-- Line Numbers -->\r\n <div [class]=\"lineNumberClasses()\">\r\n @for (line of lines(); track $index) {\r\n <div class=\"text-surface-400 dark:text-surface-500 text-sm leading-6\">\r\n {{ $index + 1 }}\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Editor Content - Single Drop Zone -->\r\n <div\r\n class=\"flex-1 p-2 flex flex-wrap gap-0.5 items-start content-start min-h-14 cursor-text\"\r\n cdkDropList\r\n cdkDropListOrientation=\"mixed\"\r\n [cdkDropListData]=\"tokens()\"\r\n [cdkDropListDisabled]=\"disabled()\"\r\n (cdkDropListDropped)=\"onDrop($event)\"\r\n >\r\n @if (tokens().length === 0) {\r\n <div class=\"text-surface-400 dark:text-surface-500 text-sm italic\">\r\n {{ placeholder() }}\r\n </div>\r\n } @else {\r\n @for (token of tokens(); track token.id; let i = $index) {\r\n <div\r\n class=\"relative inline-flex items-center group\"\r\n cdkDrag\r\n [cdkDragData]=\"token\"\r\n [cdkDragDisabled]=\"disabled()\"\r\n (cdkDragStarted)=\"onDragStart($event, token, i)\"\r\n (cdkDragEnded)=\"onDragEnd()\"\r\n >\r\n <!-- Drag Placeholder (thin cursor line) -->\r\n <div\r\n *cdkDragPlaceholder\r\n class=\"w-2 min-w-2 h-5 bg-primary rounded-sm opacity-80\"\r\n ></div>\r\n\r\n <!-- Token -->\r\n <span\r\n [class]=\"getTokenClasses(token)\"\r\n [class.border-b-2]=\"!isDragging() && isHighlighted(token)\"\r\n [class.border-primary]=\"!isDragging() && isHighlighted(token)\"\r\n (mouseenter)=\"onTokenHover(token)\"\r\n (mouseleave)=\"onTokenLeave()\"\r\n >\r\n {{ token.display ?? token.value }}\r\n </span>\r\n\r\n <!-- Delete Button (shows on hover, hidden during drag) -->\r\n @if (!isDragging() && !disabled()) {\r\n <button\r\n type=\"button\"\r\n class=\"absolute -top-1.5 -right-1.5 w-3.5 h-3.5 flex items-center justify-center bg-red-500 hover:bg-red-600 text-white rounded-full cursor-pointer scale-75 hover:scale-100 opacity-0 group-hover:opacity-100 pointer-events-none group-hover:pointer-events-auto z-10\"\r\n (click)=\"removeToken(token, i); $event.stopPropagation()\"\r\n [title]=\"\r\n token.dragBehavior === 'function'\r\n ? ('components.formulaEditor.removeFunction' | transloco)\r\n : ('components.formulaEditor.remove' | transloco)\r\n \"\r\n >\r\n <svg\r\n class=\"h-2.5 w-2.5\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n stroke-width=\"3\"\r\n >\r\n <path\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M6 18L18 6M6 6l12 12\"\r\n />\r\n </svg>\r\n </button>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n</div>\r\n", styles: [".cdk-drag-preview{width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important;max-width:20px!important;max-height:20px!important;border-radius:4px;opacity:.9;overflow:hidden!important;cursor:grabbing}.cdk-drag-animating{transition:none!important}.cdk-drag-dragging{opacity:1}\n"] }]
1005
1005
  }], ctorParameters: () => [], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], initialTokens: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialTokens", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], borderless: [{ type: i0.Input, args: [{ isSignal: true, alias: "borderless", required: false }] }], formulaChange: [{ type: i0.Output, args: ["formulaChange"] }], tokensChange: [{ type: i0.Output, args: ["tokensChange"] }], onBlur: [{ type: i0.Output, args: ["onBlur"] }], onFocus: [{ type: i0.Output, args: ["onFocus"] }] } });
1006
1006
 
1007
1007
  function buildCompletionFilterText(suggestion) {
@@ -1920,6 +1920,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
1920
1920
  }, template: "<button\r\n type=\"button\"\r\n class=\"inline-flex min-w-0 max-w-full cursor-pointer items-center gap-1 rounded px-2 py-1 text-sm font-medium transition-colors hover:shadow-sm active:scale-95\"\r\n [class]=\"itemClass()\"\r\n [pTooltip]=\"hasRichTooltip() ? richTooltip : simpleTooltip()\"\r\n [tooltipDisabled]=\"!hasRichTooltip() && !simpleTooltip()\"\r\n [tooltipStyleClass]=\"tooltipStyleClass()\"\r\n [tooltipPosition]=\"'bottom'\"\r\n [showDelay]=\"300\"\r\n [hideDelay]=\"100\"\r\n [autoHide]=\"!hasRichTooltip()\"\r\n (click)=\"handleClick()\"\r\n>\r\n @if (type() === \"function\") {\r\n <span class=\"text-sm opacity-60\">f</span>\r\n }\r\n <span class=\"truncate\">{{ displayValue() }}</span>\r\n</button>\r\n\r\n<ng-template #richTooltip>\r\n <div class=\"space-y-3\">\r\n @if (normalizedSignature()) {\r\n <div class=\"rounded bg-slate-700 px-3 py-2\">\r\n <code\r\n class=\"block whitespace-pre-wrap break-words font-mono text-sm text-emerald-400\"\r\n >{{ normalizedSignature() }}</code\r\n >\r\n </div>\r\n }\r\n\r\n @if (shouldShowTemplate()) {\r\n <div class=\"space-y-1\">\r\n <span\r\n class=\"text-xs font-semibold uppercase tracking-wider text-slate-400\"\r\n >Insert</span\r\n >\r\n <div class=\"rounded bg-slate-800 px-3 py-2\">\r\n <code\r\n class=\"block whitespace-pre-wrap break-words font-mono text-xs text-amber-300\"\r\n >{{ normalizedTemplate() }}</code\r\n >\r\n </div>\r\n </div>\r\n }\r\n\r\n @if (normalizedDescription()) {\r\n <p class=\"text-sm leading-relaxed text-slate-200\">\r\n {{ normalizedDescription() }}\r\n </p>\r\n }\r\n\r\n @if (normalizedReturnType()) {\r\n <div class=\"flex items-center gap-2 text-xs text-slate-300\">\r\n <span class=\"font-semibold uppercase tracking-wider text-slate-400\"\r\n >Returns</span\r\n >\r\n <code class=\"rounded bg-slate-800 px-2 py-0.5 text-sky-300\">{{\r\n normalizedReturnType()\r\n }}</code>\r\n </div>\r\n }\r\n\r\n @if (normalizedParameters().length > 0) {\r\n <div class=\"space-y-2 border-t border-slate-600 pt-3\">\r\n <span\r\n class=\"text-xs font-semibold uppercase tracking-wider text-slate-400\"\r\n >Parameters</span\r\n >\r\n <div class=\"space-y-2\">\r\n @for (\r\n parameter of normalizedParameters();\r\n track parameter.name + parameter.type\r\n ) {\r\n <div class=\"rounded bg-slate-800/70 px-3 py-2\">\r\n <div class=\"flex flex-wrap items-center gap-2 text-xs\">\r\n @if (parameter.name) {\r\n <code class=\"font-mono text-emerald-300\">{{\r\n parameter.name\r\n }}</code>\r\n }\r\n @if (parameter.type) {\r\n <code class=\"text-sky-300\">{{ parameter.type }}</code>\r\n }\r\n </div>\r\n @if (parameter.description) {\r\n <p class=\"mt-1 text-xs leading-relaxed text-slate-400\">\r\n {{ parameter.description }}\r\n </p>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n\r\n @if (normalizedExamples().length > 0) {\r\n <div class=\"space-y-2 border-t border-slate-600 pt-3\">\r\n <span\r\n class=\"text-xs font-semibold uppercase tracking-wider text-slate-400\"\r\n >Examples</span\r\n >\r\n <div class=\"space-y-2\">\r\n @for (example of normalizedExamples(); track example.code + $index) {\r\n <div class=\"space-y-1\">\r\n <div class=\"rounded bg-slate-800 px-3 py-2\">\r\n <code\r\n class=\"block whitespace-pre-wrap break-words font-mono text-xs text-amber-300\"\r\n >{{ example.code }}</code\r\n >\r\n </div>\r\n @if (example.description) {\r\n <p class=\"px-1 text-xs leading-relaxed text-slate-400\">\r\n {{ example.description }}\r\n </p>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n\r\n @if (normalizedHints().length > 0) {\r\n <div class=\"space-y-2 border-t border-slate-600 pt-3\">\r\n <span\r\n class=\"text-xs font-semibold uppercase tracking-wider text-slate-400\"\r\n >Hints</span\r\n >\r\n <div class=\"space-y-1.5\">\r\n @for (hint of normalizedHints(); track hint) {\r\n <p\r\n class=\"rounded bg-slate-800/70 px-3 py-2 text-xs leading-relaxed text-slate-300\"\r\n >\r\n {{ hint }}\r\n </p>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</ng-template>\r\n", styles: [".mt-formula-toolbar-item-tooltip.p-tooltip,.mt-formula-toolbar-item-tooltip .p-tooltip-text{max-width:min(32rem,92vw)}.mt-formula-toolbar-item-tooltip-rich .p-tooltip-text{width:min(32rem,92vw);max-height:min(70vh,36rem);overflow-y:auto;padding:.75rem}\n"] }]
1921
1921
  }], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], display: [{ type: i0.Input, args: [{ isSignal: true, alias: "display", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], signature: [{ type: i0.Input, args: [{ isSignal: true, alias: "signature", required: false }] }], examples: [{ type: i0.Input, args: [{ isSignal: true, alias: "examples", required: false }] }], template: [{ type: i0.Input, args: [{ isSignal: true, alias: "template", required: false }] }], templateCursorOffset: [{ type: i0.Input, args: [{ isSignal: true, alias: "templateCursorOffset", required: false }] }], hints: [{ type: i0.Input, args: [{ isSignal: true, alias: "hints", required: false }] }], returnType: [{ type: i0.Input, args: [{ isSignal: true, alias: "returnType", required: false }] }], parameters: [{ type: i0.Input, args: [{ isSignal: true, alias: "parameters", required: false }] }], propertyType: [{ type: i0.Input, args: [{ isSignal: true, alias: "propertyType", required: false }] }], onInsert: [{ type: i0.Output, args: ["onInsert"] }] } });
1922
1922
 
1923
+ const OPERATOR_SYMBOL_TO_TRANSLATION_KEY = {
1924
+ '+': 'add',
1925
+ '-': 'subtract',
1926
+ '*': 'multiply',
1927
+ '/': 'divide',
1928
+ '%': 'modulo',
1929
+ '==': 'equal',
1930
+ '!=': 'notEqual',
1931
+ '>': 'greater',
1932
+ '<': 'less',
1933
+ '>=': 'greaterOrEqual',
1934
+ '<=': 'lessOrEqual',
1935
+ '&&': 'and',
1936
+ '||': 'or',
1937
+ '!': 'not',
1938
+ };
1923
1939
  const DEFAULT_OPERATORS = [
1924
1940
  // Arithmetic
1925
1941
  {
@@ -2032,6 +2048,7 @@ const DEFAULT_OPERATORS = [
2032
2048
  * All data (functions, operators, properties) must be passed via inputs.
2033
2049
  */
2034
2050
  class FormulaToolbar {
2051
+ transloco = inject(TranslocoService);
2035
2052
  // ============ INPUTS ============
2036
2053
  /** Known properties to show in properties tab */
2037
2054
  knownProperties = input([], ...(ngDevMode ? [{ debugName: "knownProperties" }] : /* istanbul ignore next */ []));
@@ -2064,16 +2081,26 @@ class FormulaToolbar {
2064
2081
  /** Active tab */
2065
2082
  activeTab = signal('functions', ...(ngDevMode ? [{ debugName: "activeTab" }] : /* istanbul ignore next */ []));
2066
2083
  /** Tab options */
2067
- tabOptions = [
2068
- { label: 'Functions', value: 'functions' },
2069
- { label: 'Properties', value: 'properties' },
2070
- { label: 'Operators', value: 'operators' },
2071
- ];
2084
+ tabOptions = computed(() => [
2085
+ {
2086
+ label: this.transloco.translate('components.formula.toolbar.functions'),
2087
+ value: 'functions',
2088
+ },
2089
+ {
2090
+ label: this.transloco.translate('components.formula.toolbar.properties'),
2091
+ value: 'properties',
2092
+ },
2093
+ {
2094
+ label: this.transloco.translate('components.formula.toolbar.operators'),
2095
+ value: 'operators',
2096
+ },
2097
+ ], ...(ngDevMode ? [{ debugName: "tabOptions" }] : /* istanbul ignore next */ []));
2072
2098
  /** Tabs actually rendered */
2073
2099
  resolvedTabOptions = computed(() => {
2074
2100
  const visibleTabs = this.visibleTabs();
2075
- const tabs = this.tabOptions.filter((tab) => visibleTabs.includes(tab.value));
2076
- return tabs.length > 0 ? tabs : [this.tabOptions[0]];
2101
+ const allTabs = this.tabOptions();
2102
+ const tabs = allTabs.filter((tab) => visibleTabs.includes(tab.value));
2103
+ return tabs.length > 0 ? tabs : [allTabs[0]];
2077
2104
  }, ...(ngDevMode ? [{ debugName: "resolvedTabOptions" }] : /* istanbul ignore next */ []));
2078
2105
  /** Context for custom properties template */
2079
2106
  propertiesTemplateContext = {
@@ -2170,10 +2197,21 @@ class FormulaToolbar {
2170
2197
  return props;
2171
2198
  return props.filter((p) => p.toLowerCase().includes(query));
2172
2199
  }, ...(ngDevMode ? [{ debugName: "filteredProperties" }] : /* istanbul ignore next */ []));
2200
+ /** Operators translated through the active locale */
2201
+ translatedOperators = computed(() => this.operators().map((op) => {
2202
+ const key = OPERATOR_SYMBOL_TO_TRANSLATION_KEY[op.symbol];
2203
+ if (!key)
2204
+ return op;
2205
+ return {
2206
+ ...op,
2207
+ name: this.transloco.translate(`components.formulaOperators.${key}.name`),
2208
+ description: this.transloco.translate(`components.formulaOperators.${key}.description`),
2209
+ };
2210
+ }), ...(ngDevMode ? [{ debugName: "translatedOperators" }] : /* istanbul ignore next */ []));
2173
2211
  /** Filtered operators based on search */
2174
2212
  filteredOperators = computed(() => {
2175
2213
  const query = this.searchQuery().toLowerCase();
2176
- const ops = this.operators();
2214
+ const ops = this.translatedOperators();
2177
2215
  if (!query)
2178
2216
  return ops;
2179
2217
  return ops.filter((op) => op.symbol.toLowerCase().includes(query) ||
@@ -3559,5 +3597,5 @@ function createRuntimeError(code, error) {
3559
3597
  * Generated bundle index. Do not edit.
3560
3598
  */
3561
3599
 
3562
- export { CONDITION_FUNCTION_CATEGORIES, CONDITION_OPERATORS, CONDITION_RUNTIME_CATALOG, DEFAULT_OPERATORS, FormulaEditor, FormulaEditorCode, FormulaRuntimeEngine, FormulaStatusBar, FormulaToolbar, FormulaToolbarItem, VALIDATION_FUNCTION_CATEGORIES, VALIDATION_OPERATORS, VALIDATION_RUNTIME_CATALOG, cloneBlock, cloneToken, cloneTokens, createFunctionBlock, createFunctionTokens, createLiteralBlock, createLiteralToken, createOperatorBlock, createOperatorToken, createPropertyBlock, createPropertyToken, createTextToken, findFunctionRange, generateFunctionId, generateSmartBlockId, generateTokenId, getArgumentIndexAtPosition, getFunctionTokens, isValidDropPosition, parseSignature, recalculateDepths, serializeTokens, tokenizeFormulaTemplate };
3600
+ export { CONDITION_FUNCTION_CATEGORIES, CONDITION_OPERATORS, CONDITION_RUNTIME_CATALOG, DEFAULT_OPERATORS, FormulaEditor, FormulaEditorCode, FormulaRuntimeEngine, FormulaStatusBar, FormulaToolbar, FormulaToolbarItem, OPERATOR_SYMBOL_TO_TRANSLATION_KEY, VALIDATION_FUNCTION_CATEGORIES, VALIDATION_OPERATORS, VALIDATION_RUNTIME_CATALOG, cloneBlock, cloneToken, cloneTokens, createFunctionBlock, createFunctionTokens, createLiteralBlock, createLiteralToken, createOperatorBlock, createOperatorToken, createPropertyBlock, createPropertyToken, createTextToken, findFunctionRange, generateFunctionId, generateSmartBlockId, generateTokenId, getArgumentIndexAtPosition, getFunctionTokens, isValidDropPosition, parseSignature, recalculateDepths, serializeTokens, tokenizeFormulaTemplate };
3563
3601
  //# sourceMappingURL=masterteam-components-formula.mjs.map