@masterteam/components 0.0.165 → 0.0.167

package/fesm2022/masterteam-components-tabs.mjs

@@ -1,19 +1,21 @@
 import * as i0 from '@angular/core';
-import { input, model, output, booleanAttribute, inject, DestroyRef, viewChild, signal, computed, effect, afterNextRender, Component } from '@angular/core';
+import { inject, input, model, output, booleanAttribute, DestroyRef, viewChild, signal, computed, effect, afterNextRender, Component } from '@angular/core';
 import * as i1 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
+import { TranslocoService } from '@jsverse/transloco';
 import { Icon } from '@masterteam/icons';
 import { SelectButton } from 'primeng/selectbutton';
 import { Popover } from 'primeng/popover';
 import { Button } from '@masterteam/components/button';
 
 class Tabs {
+    transloco = inject(TranslocoService);
     options = input([], ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
     optionLabel = input('label', ...(ngDevMode ? [{ debugName: "optionLabel" }] : /* istanbul ignore next */ []));
     optionValue = input('value', ...(ngDevMode ? [{ debugName: "optionValue" }] : /* istanbul ignore next */ []));
     active = model(null, ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
     mode = input('horizontal', ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
-    moreLabel = input('More', ...(ngDevMode ? [{ debugName: "moreLabel" }] : /* istanbul ignore next */ []));
+    moreLabel = input(this.transloco.translate('components.tabs.more'), ...(ngDevMode ? [{ debugName: "moreLabel" }] : /* istanbul ignore next */ []));
     onChange = output();
     size = input(...(ngDevMode ? [undefined, { debugName: "size" }] : /* istanbul ignore next */ []));
     fluid = input(false, { ...(ngDevMode ? { debugName: "fluid" } : /* istanbul ignore next */ {}), transform: booleanAttribute });

package/fesm2022/masterteam-components-tabs.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"masterteam-components-tabs.mjs","sources":["../../../../packages/masterteam/components/tabs/tabs.ts","../../../../packages/masterteam/components/tabs/tabs.html","../../../../packages/masterteam/components/tabs/masterteam-components-tabs.ts"],"sourcesContent":["import {\r\n  afterNextRender,\r\n  booleanAttribute,\r\n  Component,\r\n  computed,\r\n  DestroyRef,\r\n  effect,\r\n  ElementRef,\r\n  inject,\r\n  input,\r\n  model,\r\n  output,\r\n  signal,\r\n  viewChild,\r\n} from '@angular/core';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { MTIcon, Icon } from '@masterteam/icons';\r\nimport { SelectButton } from 'primeng/selectbutton';\r\nimport { Popover } from 'primeng/popover';\r\nimport { Button } from '@masterteam/components/button';\r\n\r\nexport interface OptionItem {\r\n  label?: string;\r\n  value?: any;\r\n  icon?: MTIcon | null;\r\n  badge?: number | string | null;\r\n  disabled?: boolean;\r\n  [key: string]: unknown;\r\n}\r\n\r\n@Component({\r\n  selector: 'mt-tabs',\r\n  standalone: true,\r\n  imports: [Icon, SelectButton, FormsModule, Button, Popover],\r\n  templateUrl: './tabs.html',\r\n  styleUrls: ['./tabs.scss'],\r\n  host: {\r\n    class: 'grid min-w-0 gap-1',\r\n    '[class.w-full]': 'fluid()',\r\n  },\r\n})\r\nexport class Tabs {\r\n  options = input<OptionItem[]>([]);\r\n  optionLabel = input<string>('label');\r\n  optionValue = input<string>('value');\r\n  active = model<any>(null);\r\n  readonly mode = input<'horizontal' | 'vertical' | 'underline'>('horizontal');\r\n  readonly moreLabel = input<string>('More');\r\n\r\n  onChange = output<any>();\r\n\r\n  readonly size = input<'small' | 'large' | undefined>();\r\n  readonly fluid = input<boolean, unknown>(false, {\r\n    transform: booleanAttribute,\r\n  });\r\n  disabled = input<boolean, unknown>(false, {\r\n    transform: booleanAttribute,\r\n  });\r\n\r\n  private readonly destroyRef = inject(DestroyRef);\r\n  private readonly tabsContainer =\r\n    viewChild<ElementRef<HTMLElement>>('tabsContainer');\r\n  private readonly measureRow =\r\n    viewChild<ElementRef<HTMLElement>>('measureRow');\r\n  private resizeObserver?: ResizeObserver;\r\n  private measureHandle = 0;\r\n\r\n  readonly visibleCount = signal<number>(Number.MAX_SAFE_INTEGER);\r\n  readonly visibleOptions = computed(() =>\r\n    this.options().slice(0, this.visibleCount()),\r\n  );\r\n  readonly overflowOptions = computed(() =>\r\n    this.options().slice(this.visibleCount()),\r\n  );\r\n  readonly hasOverflow = computed(() => this.overflowOptions().length > 0);\r\n  readonly isActiveInOverflow = computed(() =>\r\n    this.overflowOptions().some((option) => this.isActiveOption(option)),\r\n  );\r\n\r\n  constructor() {\r\n    effect(() => {\r\n      const options = this.options();\r\n      const active = this.active();\r\n      if (!options.length) {\r\n        return;\r\n      }\r\n\r\n      const hasActiveOption = options.some((option) =>\r\n        Object.is(this.resolveValue(option), active),\r\n      );\r\n      if (!hasActiveOption) {\r\n        this.active.set(this.resolveValue(options[0]));\r\n      }\r\n    });\r\n\r\n    afterNextRender(() => {\r\n      if (this.mode() !== 'underline') return;\r\n      this.setupResizeObserver();\r\n      this.scheduleMeasure();\r\n    });\r\n\r\n    effect(() => {\r\n      // Re-measure when options or mode change.\r\n      this.options();\r\n      if (this.mode() !== 'underline') return;\r\n      this.scheduleMeasure();\r\n    });\r\n\r\n    this.destroyRef.onDestroy(() => {\r\n      this.resizeObserver?.disconnect();\r\n      if (this.measureHandle) {\r\n        cancelAnimationFrame(this.measureHandle);\r\n      }\r\n    });\r\n  }\r\n\r\n  private setupResizeObserver(): void {\r\n    const container = this.tabsContainer()?.nativeElement;\r\n    if (!container || typeof ResizeObserver === 'undefined') return;\r\n\r\n    this.resizeObserver = new ResizeObserver(() => this.scheduleMeasure());\r\n    this.resizeObserver.observe(container);\r\n  }\r\n\r\n  private scheduleMeasure(): void {\r\n    if (this.measureHandle) {\r\n      cancelAnimationFrame(this.measureHandle);\r\n    }\r\n    this.measureHandle = requestAnimationFrame(() => {\r\n      this.measureHandle = 0;\r\n      this.measureAndUpdate();\r\n    });\r\n  }\r\n\r\n  private measureAndUpdate(): void {\r\n    const container = this.tabsContainer()?.nativeElement;\r\n    const measureRow = this.measureRow()?.nativeElement;\r\n    if (!container || !measureRow) return;\r\n\r\n    const optionsCount = this.options().length;\r\n    if (optionsCount === 0) {\r\n      this.visibleCount.set(0);\r\n      return;\r\n    }\r\n\r\n    if (container.clientWidth === 0) return;\r\n\r\n    // Inner width excludes the container's horizontal padding so we compare\r\n    // against the actual space available to the flex tabs row.\r\n    const style = getComputedStyle(container);\r\n    const paddingX =\r\n      (parseFloat(style.paddingLeft) || 0) +\r\n      (parseFloat(style.paddingRight) || 0);\r\n    const innerWidth = container.clientWidth - paddingX;\r\n    if (innerWidth <= 0) return;\r\n\r\n    const tabWidths = Array.from(measureRow.children).map(\r\n      (el) => (el as HTMLElement).getBoundingClientRect().width,\r\n    );\r\n\r\n    if (tabWidths.length === 0) return;\r\n\r\n    // Approximate gap-0.5 between tabs (2px).\r\n    const gap = 2;\r\n    const totalWidth =\r\n      tabWidths.reduce((sum, width) => sum + width, 0) +\r\n      Math.max(0, tabWidths.length - 1) * gap;\r\n\r\n    // Everything fits — no more button needed.\r\n    if (totalWidth <= innerWidth) {\r\n      this.visibleCount.set(tabWidths.length);\r\n      return;\r\n    }\r\n\r\n    // Reserve space for the More button (icon + label ~ 88px).\r\n    const moreButtonReserve = 96;\r\n    const available = innerWidth - moreButtonReserve;\r\n\r\n    let cumulative = 0;\r\n    let visibleCount = 0;\r\n    for (let i = 0; i < tabWidths.length; i++) {\r\n      const next = cumulative + tabWidths[i] + (i > 0 ? gap : 0);\r\n      if (next > available) break;\r\n      cumulative = next;\r\n      visibleCount++;\r\n    }\r\n\r\n    this.visibleCount.set(Math.max(1, visibleCount));\r\n  }\r\n\r\n  onTabChange(value: any) {\r\n    this.onChange.emit(value);\r\n  }\r\n\r\n  onOptionSelect(option: OptionItem): void {\r\n    if (this.disabled() || this.isOptionDisabled(option)) {\r\n      return;\r\n    }\r\n\r\n    const value = this.resolveValue(option);\r\n    this.active.set(value);\r\n    this.onTabChange(value);\r\n  }\r\n\r\n  resolveLabel(option: OptionItem): string {\r\n    const labelKey = this.optionLabel();\r\n    const label =\r\n      option && typeof option === 'object'\r\n        ? (option as Record<string, unknown>)[labelKey]\r\n        : option;\r\n\r\n    return typeof label === 'string' ? label : String(label ?? '');\r\n  }\r\n\r\n  resolveValue(option: OptionItem): unknown {\r\n    const valueKey = this.optionValue();\r\n    if (option && typeof option === 'object' && valueKey in option) {\r\n      return (option as Record<string, unknown>)[valueKey];\r\n    }\r\n\r\n    return option;\r\n  }\r\n\r\n  resolveIcon(option: OptionItem): MTIcon | null {\r\n    return typeof option?.icon === 'string' ? option.icon : null;\r\n  }\r\n\r\n  resolveBadge(option: OptionItem): number | string | null {\r\n    return option?.badge ?? null;\r\n  }\r\n\r\n  hasBadge(option: OptionItem): boolean {\r\n    return option?.badge !== null && option?.badge !== undefined;\r\n  }\r\n\r\n  hasCountBadge(option: OptionItem): boolean {\r\n    const badge = option?.badge;\r\n    if (badge === null || badge === undefined || badge === '') {\r\n      return false;\r\n    }\r\n    const numeric = typeof badge === 'number' ? badge : Number(badge);\r\n    return Number.isNaN(numeric) ? true : numeric > 0;\r\n  }\r\n\r\n  isActiveOption(option: OptionItem): boolean {\r\n    return Object.is(this.active(), this.resolveValue(option));\r\n  }\r\n\r\n  isOptionDisabled(option: OptionItem): boolean {\r\n    return !!option?.disabled;\r\n  }\r\n\r\n  trackOption(option: OptionItem, index: number): unknown {\r\n    return this.resolveValue(option) ?? index;\r\n  }\r\n}\r\n","@if (mode() === \"vertical\") {\r\n  <div\r\n    class=\"flex min-h-0 flex-col gap-1 rounded-2xl border border-surface-200 bg-white p-2\"\r\n    role=\"tablist\"\r\n    aria-orientation=\"vertical\"\r\n  >\r\n    @for (option of options(); track trackOption(option, $index)) {\r\n      <button\r\n        type=\"button\"\r\n        role=\"tab\"\r\n        class=\"group relative flex w-full items-center gap-3 overflow-hidden rounded-lg px-3 py-2.5 text-left text-sm transition-colors duration-150 outline-none focus-visible:ring-2 focus-visible:ring-primary/20\"\r\n        [attr.aria-selected]=\"isActiveOption(option)\"\r\n        [attr.tabindex]=\"isActiveOption(option) ? 0 : -1\"\r\n        [disabled]=\"disabled() || isOptionDisabled(option)\"\r\n        [class.bg-primary-50]=\"isActiveOption(option)\"\r\n        [class.font-semibold]=\"isActiveOption(option)\"\r\n        [class.text-primary-700]=\"isActiveOption(option)\"\r\n        [class.text-surface-500]=\"!isActiveOption(option)\"\r\n        [class.hover:bg-surface-50]=\"!isActiveOption(option)\"\r\n        [class.cursor-not-allowed]=\"disabled() || isOptionDisabled(option)\"\r\n        [class.opacity-60]=\"disabled() || isOptionDisabled(option)\"\r\n        (click)=\"onOptionSelect(option)\"\r\n      >\r\n        @if (resolveIcon(option); as icon) {\r\n          <mt-icon\r\n            [icon]=\"icon\"\r\n            class=\"relative z-10 text-base\"\r\n            [class.text-primary]=\"isActiveOption(option)\"\r\n            [class.text-surface-400]=\"!isActiveOption(option)\"\r\n          />\r\n        }\r\n\r\n        <span class=\"relative z-10 min-w-0 flex-1 truncate\">\r\n          {{ resolveLabel(option) }}\r\n        </span>\r\n\r\n        @if (hasBadge(option)) {\r\n          <span\r\n            class=\"relative z-10 ms-auto inline-flex min-w-5 items-center justify-center rounded-full px-2 py-0.5 text-[11px] font-bold leading-none\"\r\n            [class.bg-primary]=\"isActiveOption(option)\"\r\n            [class.text-white]=\"isActiveOption(option)\"\r\n            [class.bg-surface-100]=\"!isActiveOption(option)\"\r\n            [class.text-surface-600]=\"!isActiveOption(option)\"\r\n          >\r\n            {{ resolveBadge(option) }}\r\n          </span>\r\n        }\r\n      </button>\r\n    }\r\n  </div>\r\n} @else if (mode() === \"underline\") {\r\n  <div\r\n    #tabsContainer\r\n    class=\"relative flex w-full min-w-0 max-w-full items-center gap-0.5 overflow-x-clip\"\r\n    role=\"tablist\"\r\n    aria-orientation=\"horizontal\"\r\n  >\r\n    <!-- Invisible measurement ghost row: always renders every option at natural width -->\r\n    <div\r\n      #measureRow\r\n      aria-hidden=\"true\"\r\n      class=\"pointer-events-none invisible absolute top-0 left-0 flex flex-nowrap gap-0.5 -z-10\"\r\n    >\r\n      @for (option of options(); track trackOption(option, $index)) {\r\n        <span\r\n          class=\"inline-flex items-center gap-1.5 border-b-2 border-transparent px-3.5 py-2.5 text-sm font-semibold whitespace-nowrap\"\r\n        >\r\n          @if (resolveIcon(option); as icon) {\r\n            <mt-icon [icon]=\"icon\" class=\"text-base\" />\r\n          }\r\n          <span>{{ resolveLabel(option) }}</span>\r\n          @if (hasCountBadge(option)) {\r\n            <span\r\n              class=\"inline-grid min-w-[18px] place-items-center rounded-full px-1.5 text-[10px] leading-4 font-bold tabular-nums\"\r\n            >\r\n              {{ resolveBadge(option) }}\r\n            </span>\r\n          }\r\n        </span>\r\n      }\r\n    </div>\r\n\r\n    <!-- Visible tabs row -->\r\n    <div\r\n      class=\"flex min-w-0 flex-1 items-center gap-0.5 overflow-x-clip border-b border-surface-200\"\r\n    >\r\n      @for (option of visibleOptions(); track trackOption(option, $index)) {\r\n        <button\r\n          type=\"button\"\r\n          role=\"tab\"\r\n          class=\"-mb-px inline-flex shrink-0 items-center gap-1.5 border-b-2 px-3.5 py-2.5 text-sm whitespace-nowrap transition-colors duration-150 outline-none focus-visible:ring-2 focus-visible:ring-primary/20\"\r\n          [attr.aria-selected]=\"isActiveOption(option)\"\r\n          [attr.tabindex]=\"isActiveOption(option) ? 0 : -1\"\r\n          [disabled]=\"disabled() || isOptionDisabled(option)\"\r\n          [class.border-primary]=\"isActiveOption(option)\"\r\n          [class.text-primary]=\"isActiveOption(option)\"\r\n          [class.font-semibold]=\"isActiveOption(option)\"\r\n          [class.border-transparent]=\"!isActiveOption(option)\"\r\n          [class.text-surface-700]=\"!isActiveOption(option)\"\r\n          [class.font-medium]=\"!isActiveOption(option)\"\r\n          [class.hover:text-primary-600]=\"\r\n            !isActiveOption(option) && !(disabled() || isOptionDisabled(option))\r\n          \"\r\n          [class.cursor-pointer]=\"!(disabled() || isOptionDisabled(option))\"\r\n          [class.cursor-not-allowed]=\"disabled() || isOptionDisabled(option)\"\r\n          [class.opacity-60]=\"disabled() || isOptionDisabled(option)\"\r\n          (click)=\"onOptionSelect(option)\"\r\n        >\r\n          @if (resolveIcon(option); as icon) {\r\n            <mt-icon [icon]=\"icon\" class=\"text-base\" />\r\n          }\r\n\r\n          <span class=\"truncate\">{{ resolveLabel(option) }}</span>\r\n\r\n          @if (hasCountBadge(option)) {\r\n            <span\r\n              class=\"inline-grid min-w-[18px] place-items-center rounded-full px-1.5 text-[10px] leading-4 font-bold tabular-nums\"\r\n              [class.bg-primary-50]=\"isActiveOption(option)\"\r\n              [class.text-primary-700]=\"isActiveOption(option)\"\r\n              [class.bg-surface-100]=\"!isActiveOption(option)\"\r\n              [class.text-surface-500]=\"!isActiveOption(option)\"\r\n            >\r\n              {{ resolveBadge(option) }}\r\n            </span>\r\n          }\r\n        </button>\r\n      }\r\n    </div>\r\n\r\n    @if (hasOverflow()) {\r\n      <div\r\n        class=\"flex shrink-0 items-center -mb-px border-b border-surface-200 pb-1\"\r\n      >\r\n        <mt-button\r\n          icon=\"arrow.chevron-down\"\r\n          [label]=\"moreLabel()\"\r\n          size=\"small\"\r\n          severity=\"primary\"\r\n          [text]=\"true\"\r\n          [rounded]=\"true\"\r\n          (onClick)=\"morePopover.toggle($event)\"\r\n        />\r\n        <p-popover #morePopover appendTo=\"body\">\r\n          <div class=\"flex flex-col min-w-40\">\r\n            @for (\r\n              option of overflowOptions();\r\n              track trackOption(option, $index)\r\n            ) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"flex cursor-pointer items-center gap-2 rounded px-2 py-2 text-sm transition-colors\"\r\n                [class.bg-primary-50]=\"isActiveOption(option)\"\r\n                [class.text-primary]=\"isActiveOption(option)\"\r\n                [class.font-semibold]=\"isActiveOption(option)\"\r\n                [class.text-surface-700]=\"!isActiveOption(option)\"\r\n                [class.hover:bg-surface-100]=\"!isActiveOption(option)\"\r\n                [class.cursor-not-allowed]=\"\r\n                  disabled() || isOptionDisabled(option)\r\n                \"\r\n                [class.opacity-60]=\"disabled() || isOptionDisabled(option)\"\r\n                [disabled]=\"disabled() || isOptionDisabled(option)\"\r\n                (click)=\"onOptionSelect(option); morePopover.hide()\"\r\n              >\r\n                @if (resolveIcon(option); as icon) {\r\n                  <mt-icon [icon]=\"icon\" class=\"text-base\" />\r\n                }\r\n                <span class=\"flex-1 truncate\">{{ resolveLabel(option) }}</span>\r\n                @if (hasCountBadge(option)) {\r\n                  <span\r\n                    class=\"inline-grid min-w-[18px] place-items-center rounded-full px-1.5 text-[10px] leading-4 font-bold tabular-nums\"\r\n                    [class.bg-primary-100]=\"isActiveOption(option)\"\r\n                    [class.text-primary-700]=\"isActiveOption(option)\"\r\n                    [class.bg-surface-100]=\"!isActiveOption(option)\"\r\n                    [class.text-surface-500]=\"!isActiveOption(option)\"\r\n                  >\r\n                    {{ resolveBadge(option) }}\r\n                  </span>\r\n                }\r\n              </button>\r\n            }\r\n          </div>\r\n        </p-popover>\r\n      </div>\r\n    }\r\n  </div>\r\n} @else {\r\n  <p-selectbutton\r\n    [options]=\"options()\"\r\n    [(ngModel)]=\"active\"\r\n    (ngModelChange)=\"onTabChange($event)\"\r\n    [optionLabel]=\"optionLabel()\"\r\n    [optionValue]=\"optionValue()\"\r\n    styleClass=\"my-tabs-button\"\r\n    [size]=\"size()\"\r\n    [fluid]=\"fluid()\"\r\n    [disabled]=\"disabled()\"\r\n    unselectable\r\n  />\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;MAyCa,IAAI,CAAA;AACf,IAAA,OAAO,GAAG,KAAK,CAAe,EAAE,8EAAC;AACjC,IAAA,WAAW,GAAG,KAAK,CAAS,OAAO,kFAAC;AACpC,IAAA,WAAW,GAAG,KAAK,CAAS,OAAO,kFAAC;AACpC,IAAA,MAAM,GAAG,KAAK,CAAM,IAAI,6EAAC;AAChB,IAAA,IAAI,GAAG,KAAK,CAA0C,YAAY,2EAAC;AACnE,IAAA,SAAS,GAAG,KAAK,CAAS,MAAM,gFAAC;IAE1C,QAAQ,GAAG,MAAM,EAAO;IAEf,IAAI,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAiC;IAC7C,KAAK,GAAG,KAAK,CAAmB,KAAK,6EAC5C,SAAS,EAAE,gBAAgB,EAAA,CAC3B;IACF,QAAQ,GAAG,KAAK,CAAmB,KAAK,gFACtC,SAAS,EAAE,gBAAgB,EAAA,CAC3B;AAEe,IAAA,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;AAC/B,IAAA,aAAa,GAC5B,SAAS,CAA0B,eAAe,oFAAC;AACpC,IAAA,UAAU,GACzB,SAAS,CAA0B,YAAY,iFAAC;AAC1C,IAAA,cAAc;IACd,aAAa,GAAG,CAAC;AAEhB,IAAA,YAAY,GAAG,MAAM,CAAS,MAAM,CAAC,gBAAgB,mFAAC;IACtD,cAAc,GAAG,QAAQ,CAAC,MACjC,IAAI,CAAC,OAAO,EAAE,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,CAAC,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,gBAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAC7C;AACQ,IAAA,eAAe,GAAG,QAAQ,CAAC,MAClC,IAAI,CAAC,OAAO,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC,sFAC1C;AACQ,IAAA,WAAW,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,eAAe,EAAE,CAAC,MAAM,GAAG,CAAC,kFAAC;IAC/D,kBAAkB,GAAG,QAAQ,CAAC,MACrC,IAAI,CAAC,eAAe,EAAE,CAAC,IAAI,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,oBAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CACrE;AAED,IAAA,WAAA,GAAA;QACE,MAAM,CAAC,MAAK;AACV,YAAA,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,EAAE;AAC9B,YAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE;AAC5B,YAAA,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;gBACnB;YACF;YAEA,MAAM,eAAe,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,KAC1C,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC,CAC7C;YACD,IAAI,CAAC,eAAe,EAAE;AACpB,gBAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;YAChD;AACF,QAAA,CAAC,CAAC;QAEF,eAAe,CAAC,MAAK;AACnB,YAAA,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,WAAW;gBAAE;YACjC,IAAI,CAAC,mBAAmB,EAAE;YAC1B,IAAI,CAAC,eAAe,EAAE;AACxB,QAAA,CAAC,CAAC;QAEF,MAAM,CAAC,MAAK;;YAEV,IAAI,CAAC,OAAO,EAAE;AACd,YAAA,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,WAAW;gBAAE;YACjC,IAAI,CAAC,eAAe,EAAE;AACxB,QAAA,CAAC,CAAC;AAEF,QAAA,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,MAAK;AAC7B,YAAA,IAAI,CAAC,cAAc,EAAE,UAAU,EAAE;AACjC,YAAA,IAAI,IAAI,CAAC,aAAa,EAAE;AACtB,gBAAA,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC;YAC1C;AACF,QAAA,CAAC,CAAC;IACJ;IAEQ,mBAAmB,GAAA;QACzB,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,EAAE,EAAE,aAAa;AACrD,QAAA,IAAI,CAAC,SAAS,IAAI,OAAO,cAAc,KAAK,WAAW;YAAE;AAEzD,QAAA,IAAI,CAAC,cAAc,GAAG,IAAI,cAAc,CAAC,MAAM,IAAI,CAAC,eAAe,EAAE,CAAC;AACtE,QAAA,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,SAAS,CAAC;IACxC;IAEQ,eAAe,GAAA;AACrB,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE;AACtB,YAAA,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC;QAC1C;AACA,QAAA,IAAI,CAAC,aAAa,GAAG,qBAAqB,CAAC,MAAK;AAC9C,YAAA,IAAI,CAAC,aAAa,GAAG,CAAC;YACtB,IAAI,CAAC,gBAAgB,EAAE;AACzB,QAAA,CAAC,CAAC;IACJ;IAEQ,gBAAgB,GAAA;QACtB,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,EAAE,EAAE,aAAa;QACrD,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,EAAE,EAAE,aAAa;AACnD,QAAA,IAAI,CAAC,SAAS,IAAI,CAAC,UAAU;YAAE;QAE/B,MAAM,YAAY,GAAG,IAAI,CAAC,OAAO,EAAE,CAAC,MAAM;AAC1C,QAAA,IAAI,YAAY,KAAK,CAAC,EAAE;AACtB,YAAA,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC;YACxB;QACF;AAEA,QAAA,IAAI,SAAS,CAAC,WAAW,KAAK,CAAC;YAAE;;;AAIjC,QAAA,MAAM,KAAK,GAAG,gBAAgB,CAAC,SAAS,CAAC;QACzC,MAAM,QAAQ,GACZ,CAAC,UAAU,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC;aAClC,UAAU,CAAC,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;AACvC,QAAA,MAAM,UAAU,GAAG,SAAS,CAAC,WAAW,GAAG,QAAQ;QACnD,IAAI,UAAU,IAAI,CAAC;YAAE;QAErB,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,GAAG,CACnD,CAAC,EAAE,KAAM,EAAkB,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAC1D;AAED,QAAA,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC;YAAE;;QAG5B,MAAM,GAAG,GAAG,CAAC;AACb,QAAA,MAAM,UAAU,GACd,SAAS,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,KAAK,KAAK,GAAG,GAAG,KAAK,EAAE,CAAC,CAAC;AAChD,YAAA,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,GAAG;;AAGzC,QAAA,IAAI,UAAU,IAAI,UAAU,EAAE;YAC5B,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,SAAS,CAAC,MAAM,CAAC;YACvC;QACF;;QAGA,MAAM,iBAAiB,GAAG,EAAE;AAC5B,QAAA,MAAM,SAAS,GAAG,UAAU,GAAG,iBAAiB;QAEhD,IAAI,UAAU,GAAG,CAAC;QAClB,IAAI,YAAY,GAAG,CAAC;AACpB,QAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACzC,MAAM,IAAI,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC;YAC1D,IAAI,IAAI,GAAG,SAAS;gBAAE;YACtB,UAAU,GAAG,IAAI;AACjB,YAAA,YAAY,EAAE;QAChB;AAEA,QAAA,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,YAAY,CAAC,CAAC;IAClD;AAEA,IAAA,WAAW,CAAC,KAAU,EAAA;AACpB,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;IAC3B;AAEA,IAAA,cAAc,CAAC,MAAkB,EAAA;AAC/B,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,EAAE;YACpD;QACF;QAEA,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;AACvC,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC;AACtB,QAAA,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;IACzB;AAEA,IAAA,YAAY,CAAC,MAAkB,EAAA;AAC7B,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,EAAE;AACnC,QAAA,MAAM,KAAK,GACT,MAAM,IAAI,OAAO,MAAM,KAAK;AAC1B,cAAG,MAAkC,CAAC,QAAQ;cAC5C,MAAM;AAEZ,QAAA,OAAO,OAAO,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC,KAAK,IAAI,EAAE,CAAC;IAChE;AAEA,IAAA,YAAY,CAAC,MAAkB,EAAA;AAC7B,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,EAAE;QACnC,IAAI,MAAM,IAAI,OAAO,MAAM,KAAK,QAAQ,IAAI,QAAQ,IAAI,MAAM,EAAE;AAC9D,YAAA,OAAQ,MAAkC,CAAC,QAAQ,CAAC;QACtD;AAEA,QAAA,OAAO,MAAM;IACf;AAEA,IAAA,WAAW,CAAC,MAAkB,EAAA;AAC5B,QAAA,OAAO,OAAO,MAAM,EAAE,IAAI,KAAK,QAAQ,GAAG,MAAM,CAAC,IAAI,GAAG,IAAI;IAC9D;AAEA,IAAA,YAAY,CAAC,MAAkB,EAAA;AAC7B,QAAA,OAAO,MAAM,EAAE,KAAK,IAAI,IAAI;IAC9B;AAEA,IAAA,QAAQ,CAAC,MAAkB,EAAA;QACzB,OAAO,MAAM,EAAE,KAAK,KAAK,IAAI,IAAI,MAAM,EAAE,KAAK,KAAK,SAAS;IAC9D;AAEA,IAAA,aAAa,CAAC,MAAkB,EAAA;AAC9B,QAAA,MAAM,KAAK,GAAG,MAAM,EAAE,KAAK;AAC3B,QAAA,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,EAAE,EAAE;AACzD,YAAA,OAAO,KAAK;QACd;AACA,QAAA,MAAM,OAAO,GAAG,OAAO,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;AACjE,QAAA,OAAO,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,IAAI,GAAG,OAAO,GAAG,CAAC;IACnD;AAEA,IAAA,cAAc,CAAC,MAAkB,EAAA;AAC/B,QAAA,OAAO,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;IAC5D;AAEA,IAAA,gBAAgB,CAAC,MAAkB,EAAA;AACjC,QAAA,OAAO,CAAC,CAAC,MAAM,EAAE,QAAQ;IAC3B;IAEA,WAAW,CAAC,MAAkB,EAAE,KAAa,EAAA;QAC3C,OAAO,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,KAAK;IAC3C;uGArNW,IAAI,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAJ,IAAI,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,MAAA,EAAA,cAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,cAAA,EAAA,SAAA,EAAA,EAAA,cAAA,EAAA,oBAAA,EAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,eAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,eAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,YAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,YAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECzCjB,iuRAuMA,EAAA,MAAA,EAAA,CAAA,sBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDtKY,IAAI,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,MAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,YAAY,EAAA,QAAA,EAAA,iDAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,aAAA,EAAA,aAAA,EAAA,gBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,UAAA,EAAA,YAAA,EAAA,YAAA,EAAA,gBAAA,EAAA,SAAA,EAAA,WAAA,EAAA,MAAA,EAAA,OAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,qDAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,gBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,MAAM,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,MAAA,EAAA,YAAA,EAAA,UAAA,EAAA,OAAA,EAAA,SAAA,EAAA,eAAA,EAAA,MAAA,EAAA,SAAA,EAAA,WAAA,EAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,OAAA,EAAA,UAAA,EAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,SAAA,EAAA,SAAA,EAAA,QAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,gBAAA,EAAA,aAAA,EAAA,OAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,gBAAA,EAAA,YAAA,EAAA,aAAA,EAAA,uBAAA,EAAA,uBAAA,EAAA,eAAA,CAAA,EAAA,OAAA,EAAA,CAAA,QAAA,EAAA,QAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAQ/C,IAAI,EAAA,UAAA,EAAA,CAAA;kBAXhB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,SAAS,EAAA,UAAA,EACP,IAAI,EAAA,OAAA,EACP,CAAC,IAAI,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,EAAE,OAAO,CAAC,EAAA,IAAA,EAGrD;AACJ,wBAAA,KAAK,EAAE,oBAAoB;AAC3B,wBAAA,gBAAgB,EAAE,SAAS;AAC5B,qBAAA,EAAA,QAAA,EAAA,iuRAAA,EAAA,MAAA,EAAA,CAAA,sBAAA,CAAA,EAAA;AAsBoC,SAAA,CAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,SAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,aAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,aAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,QAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,cAAA,CAAA,EAAA,CAAA,EAAA,IAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,MAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,SAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,WAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,QAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,UAAA,CAAA,EAAA,CAAA,EAAA,IAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,MAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,KAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,OAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,QAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,UAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,aAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,IAAA,EAAA,CAAA,eAAe,oEAEf,YAAY,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AE/DnD;;AAEG;;;;"}
+{"version":3,"file":"masterteam-components-tabs.mjs","sources":["../../../../packages/masterteam/components/tabs/tabs.ts","../../../../packages/masterteam/components/tabs/tabs.html","../../../../packages/masterteam/components/tabs/masterteam-components-tabs.ts"],"sourcesContent":["import {\r\n  afterNextRender,\r\n  booleanAttribute,\r\n  Component,\r\n  computed,\r\n  DestroyRef,\r\n  effect,\r\n  ElementRef,\r\n  inject,\r\n  input,\r\n  model,\r\n  output,\r\n  signal,\r\n  viewChild,\r\n} from '@angular/core';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { TranslocoService } from '@jsverse/transloco';\r\nimport { MTIcon, Icon } from '@masterteam/icons';\r\nimport { SelectButton } from 'primeng/selectbutton';\r\nimport { Popover } from 'primeng/popover';\r\nimport { Button } from '@masterteam/components/button';\r\n\r\nexport interface OptionItem {\r\n  label?: string;\r\n  value?: any;\r\n  icon?: MTIcon | null;\r\n  badge?: number | string | null;\r\n  disabled?: boolean;\r\n  [key: string]: unknown;\r\n}\r\n\r\n@Component({\r\n  selector: 'mt-tabs',\r\n  standalone: true,\r\n  imports: [Icon, SelectButton, FormsModule, Button, Popover],\r\n  templateUrl: './tabs.html',\r\n  styleUrls: ['./tabs.scss'],\r\n  host: {\r\n    class: 'grid min-w-0 gap-1',\r\n    '[class.w-full]': 'fluid()',\r\n  },\r\n})\r\nexport class Tabs {\r\n  private readonly transloco = inject(TranslocoService);\r\n  options = input<OptionItem[]>([]);\r\n  optionLabel = input<string>('label');\r\n  optionValue = input<string>('value');\r\n  active = model<any>(null);\r\n  readonly mode = input<'horizontal' | 'vertical' | 'underline'>('horizontal');\r\n  readonly moreLabel = input<string>(\r\n    this.transloco.translate('components.tabs.more'),\r\n  );\r\n\r\n  onChange = output<any>();\r\n\r\n  readonly size = input<'small' | 'large' | undefined>();\r\n  readonly fluid = input<boolean, unknown>(false, {\r\n    transform: booleanAttribute,\r\n  });\r\n  disabled = input<boolean, unknown>(false, {\r\n    transform: booleanAttribute,\r\n  });\r\n\r\n  private readonly destroyRef = inject(DestroyRef);\r\n  private readonly tabsContainer =\r\n    viewChild<ElementRef<HTMLElement>>('tabsContainer');\r\n  private readonly measureRow =\r\n    viewChild<ElementRef<HTMLElement>>('measureRow');\r\n  private resizeObserver?: ResizeObserver;\r\n  private measureHandle = 0;\r\n\r\n  readonly visibleCount = signal<number>(Number.MAX_SAFE_INTEGER);\r\n  readonly visibleOptions = computed(() =>\r\n    this.options().slice(0, this.visibleCount()),\r\n  );\r\n  readonly overflowOptions = computed(() =>\r\n    this.options().slice(this.visibleCount()),\r\n  );\r\n  readonly hasOverflow = computed(() => this.overflowOptions().length > 0);\r\n  readonly isActiveInOverflow = computed(() =>\r\n    this.overflowOptions().some((option) => this.isActiveOption(option)),\r\n  );\r\n\r\n  constructor() {\r\n    effect(() => {\r\n      const options = this.options();\r\n      const active = this.active();\r\n      if (!options.length) {\r\n        return;\r\n      }\r\n\r\n      const hasActiveOption = options.some((option) =>\r\n        Object.is(this.resolveValue(option), active),\r\n      );\r\n      if (!hasActiveOption) {\r\n        this.active.set(this.resolveValue(options[0]));\r\n      }\r\n    });\r\n\r\n    afterNextRender(() => {\r\n      if (this.mode() !== 'underline') return;\r\n      this.setupResizeObserver();\r\n      this.scheduleMeasure();\r\n    });\r\n\r\n    effect(() => {\r\n      // Re-measure when options or mode change.\r\n      this.options();\r\n      if (this.mode() !== 'underline') return;\r\n      this.scheduleMeasure();\r\n    });\r\n\r\n    this.destroyRef.onDestroy(() => {\r\n      this.resizeObserver?.disconnect();\r\n      if (this.measureHandle) {\r\n        cancelAnimationFrame(this.measureHandle);\r\n      }\r\n    });\r\n  }\r\n\r\n  private setupResizeObserver(): void {\r\n    const container = this.tabsContainer()?.nativeElement;\r\n    if (!container || typeof ResizeObserver === 'undefined') return;\r\n\r\n    this.resizeObserver = new ResizeObserver(() => this.scheduleMeasure());\r\n    this.resizeObserver.observe(container);\r\n  }\r\n\r\n  private scheduleMeasure(): void {\r\n    if (this.measureHandle) {\r\n      cancelAnimationFrame(this.measureHandle);\r\n    }\r\n    this.measureHandle = requestAnimationFrame(() => {\r\n      this.measureHandle = 0;\r\n      this.measureAndUpdate();\r\n    });\r\n  }\r\n\r\n  private measureAndUpdate(): void {\r\n    const container = this.tabsContainer()?.nativeElement;\r\n    const measureRow = this.measureRow()?.nativeElement;\r\n    if (!container || !measureRow) return;\r\n\r\n    const optionsCount = this.options().length;\r\n    if (optionsCount === 0) {\r\n      this.visibleCount.set(0);\r\n      return;\r\n    }\r\n\r\n    if (container.clientWidth === 0) return;\r\n\r\n    // Inner width excludes the container's horizontal padding so we compare\r\n    // against the actual space available to the flex tabs row.\r\n    const style = getComputedStyle(container);\r\n    const paddingX =\r\n      (parseFloat(style.paddingLeft) || 0) +\r\n      (parseFloat(style.paddingRight) || 0);\r\n    const innerWidth = container.clientWidth - paddingX;\r\n    if (innerWidth <= 0) return;\r\n\r\n    const tabWidths = Array.from(measureRow.children).map(\r\n      (el) => (el as HTMLElement).getBoundingClientRect().width,\r\n    );\r\n\r\n    if (tabWidths.length === 0) return;\r\n\r\n    // Approximate gap-0.5 between tabs (2px).\r\n    const gap = 2;\r\n    const totalWidth =\r\n      tabWidths.reduce((sum, width) => sum + width, 0) +\r\n      Math.max(0, tabWidths.length - 1) * gap;\r\n\r\n    // Everything fits — no more button needed.\r\n    if (totalWidth <= innerWidth) {\r\n      this.visibleCount.set(tabWidths.length);\r\n      return;\r\n    }\r\n\r\n    // Reserve space for the More button (icon + label ~ 88px).\r\n    const moreButtonReserve = 96;\r\n    const available = innerWidth - moreButtonReserve;\r\n\r\n    let cumulative = 0;\r\n    let visibleCount = 0;\r\n    for (let i = 0; i < tabWidths.length; i++) {\r\n      const next = cumulative + tabWidths[i] + (i > 0 ? gap : 0);\r\n      if (next > available) break;\r\n      cumulative = next;\r\n      visibleCount++;\r\n    }\r\n\r\n    this.visibleCount.set(Math.max(1, visibleCount));\r\n  }\r\n\r\n  onTabChange(value: any) {\r\n    this.onChange.emit(value);\r\n  }\r\n\r\n  onOptionSelect(option: OptionItem): void {\r\n    if (this.disabled() || this.isOptionDisabled(option)) {\r\n      return;\r\n    }\r\n\r\n    const value = this.resolveValue(option);\r\n    this.active.set(value);\r\n    this.onTabChange(value);\r\n  }\r\n\r\n  resolveLabel(option: OptionItem): string {\r\n    const labelKey = this.optionLabel();\r\n    const label =\r\n      option && typeof option === 'object'\r\n        ? (option as Record<string, unknown>)[labelKey]\r\n        : option;\r\n\r\n    return typeof label === 'string' ? label : String(label ?? '');\r\n  }\r\n\r\n  resolveValue(option: OptionItem): unknown {\r\n    const valueKey = this.optionValue();\r\n    if (option && typeof option === 'object' && valueKey in option) {\r\n      return (option as Record<string, unknown>)[valueKey];\r\n    }\r\n\r\n    return option;\r\n  }\r\n\r\n  resolveIcon(option: OptionItem): MTIcon | null {\r\n    return typeof option?.icon === 'string' ? option.icon : null;\r\n  }\r\n\r\n  resolveBadge(option: OptionItem): number | string | null {\r\n    return option?.badge ?? null;\r\n  }\r\n\r\n  hasBadge(option: OptionItem): boolean {\r\n    return option?.badge !== null && option?.badge !== undefined;\r\n  }\r\n\r\n  hasCountBadge(option: OptionItem): boolean {\r\n    const badge = option?.badge;\r\n    if (badge === null || badge === undefined || badge === '') {\r\n      return false;\r\n    }\r\n    const numeric = typeof badge === 'number' ? badge : Number(badge);\r\n    return Number.isNaN(numeric) ? true : numeric > 0;\r\n  }\r\n\r\n  isActiveOption(option: OptionItem): boolean {\r\n    return Object.is(this.active(), this.resolveValue(option));\r\n  }\r\n\r\n  isOptionDisabled(option: OptionItem): boolean {\r\n    return !!option?.disabled;\r\n  }\r\n\r\n  trackOption(option: OptionItem, index: number): unknown {\r\n    return this.resolveValue(option) ?? index;\r\n  }\r\n}\r\n","@if (mode() === \"vertical\") {\r\n  <div\r\n    class=\"flex min-h-0 flex-col gap-1 rounded-2xl border border-surface-200 bg-white p-2\"\r\n    role=\"tablist\"\r\n    aria-orientation=\"vertical\"\r\n  >\r\n    @for (option of options(); track trackOption(option, $index)) {\r\n      <button\r\n        type=\"button\"\r\n        role=\"tab\"\r\n        class=\"group relative flex w-full items-center gap-3 overflow-hidden rounded-lg px-3 py-2.5 text-left text-sm transition-colors duration-150 outline-none focus-visible:ring-2 focus-visible:ring-primary/20\"\r\n        [attr.aria-selected]=\"isActiveOption(option)\"\r\n        [attr.tabindex]=\"isActiveOption(option) ? 0 : -1\"\r\n        [disabled]=\"disabled() || isOptionDisabled(option)\"\r\n        [class.bg-primary-50]=\"isActiveOption(option)\"\r\n        [class.font-semibold]=\"isActiveOption(option)\"\r\n        [class.text-primary-700]=\"isActiveOption(option)\"\r\n        [class.text-surface-500]=\"!isActiveOption(option)\"\r\n        [class.hover:bg-surface-50]=\"!isActiveOption(option)\"\r\n        [class.cursor-not-allowed]=\"disabled() || isOptionDisabled(option)\"\r\n        [class.opacity-60]=\"disabled() || isOptionDisabled(option)\"\r\n        (click)=\"onOptionSelect(option)\"\r\n      >\r\n        @if (resolveIcon(option); as icon) {\r\n          <mt-icon\r\n            [icon]=\"icon\"\r\n            class=\"relative z-10 text-base\"\r\n            [class.text-primary]=\"isActiveOption(option)\"\r\n            [class.text-surface-400]=\"!isActiveOption(option)\"\r\n          />\r\n        }\r\n\r\n        <span class=\"relative z-10 min-w-0 flex-1 truncate\">\r\n          {{ resolveLabel(option) }}\r\n        </span>\r\n\r\n        @if (hasBadge(option)) {\r\n          <span\r\n            class=\"relative z-10 ms-auto inline-flex min-w-5 items-center justify-center rounded-full px-2 py-0.5 text-[11px] font-bold leading-none\"\r\n            [class.bg-primary]=\"isActiveOption(option)\"\r\n            [class.text-white]=\"isActiveOption(option)\"\r\n            [class.bg-surface-100]=\"!isActiveOption(option)\"\r\n            [class.text-surface-600]=\"!isActiveOption(option)\"\r\n          >\r\n            {{ resolveBadge(option) }}\r\n          </span>\r\n        }\r\n      </button>\r\n    }\r\n  </div>\r\n} @else if (mode() === \"underline\") {\r\n  <div\r\n    #tabsContainer\r\n    class=\"relative flex w-full min-w-0 max-w-full items-center gap-0.5 overflow-x-clip\"\r\n    role=\"tablist\"\r\n    aria-orientation=\"horizontal\"\r\n  >\r\n    <!-- Invisible measurement ghost row: always renders every option at natural width -->\r\n    <div\r\n      #measureRow\r\n      aria-hidden=\"true\"\r\n      class=\"pointer-events-none invisible absolute top-0 left-0 flex flex-nowrap gap-0.5 -z-10\"\r\n    >\r\n      @for (option of options(); track trackOption(option, $index)) {\r\n        <span\r\n          class=\"inline-flex items-center gap-1.5 border-b-2 border-transparent px-3.5 py-2.5 text-sm font-semibold whitespace-nowrap\"\r\n        >\r\n          @if (resolveIcon(option); as icon) {\r\n            <mt-icon [icon]=\"icon\" class=\"text-base\" />\r\n          }\r\n          <span>{{ resolveLabel(option) }}</span>\r\n          @if (hasCountBadge(option)) {\r\n            <span\r\n              class=\"inline-grid min-w-[18px] place-items-center rounded-full px-1.5 text-[10px] leading-4 font-bold tabular-nums\"\r\n            >\r\n              {{ resolveBadge(option) }}\r\n            </span>\r\n          }\r\n        </span>\r\n      }\r\n    </div>\r\n\r\n    <!-- Visible tabs row -->\r\n    <div\r\n      class=\"flex min-w-0 flex-1 items-center gap-0.5 overflow-x-clip border-b border-surface-200\"\r\n    >\r\n      @for (option of visibleOptions(); track trackOption(option, $index)) {\r\n        <button\r\n          type=\"button\"\r\n          role=\"tab\"\r\n          class=\"-mb-px inline-flex shrink-0 items-center gap-1.5 border-b-2 px-3.5 py-2.5 text-sm whitespace-nowrap transition-colors duration-150 outline-none focus-visible:ring-2 focus-visible:ring-primary/20\"\r\n          [attr.aria-selected]=\"isActiveOption(option)\"\r\n          [attr.tabindex]=\"isActiveOption(option) ? 0 : -1\"\r\n          [disabled]=\"disabled() || isOptionDisabled(option)\"\r\n          [class.border-primary]=\"isActiveOption(option)\"\r\n          [class.text-primary]=\"isActiveOption(option)\"\r\n          [class.font-semibold]=\"isActiveOption(option)\"\r\n          [class.border-transparent]=\"!isActiveOption(option)\"\r\n          [class.text-surface-700]=\"!isActiveOption(option)\"\r\n          [class.font-medium]=\"!isActiveOption(option)\"\r\n          [class.hover:text-primary-600]=\"\r\n            !isActiveOption(option) && !(disabled() || isOptionDisabled(option))\r\n          \"\r\n          [class.cursor-pointer]=\"!(disabled() || isOptionDisabled(option))\"\r\n          [class.cursor-not-allowed]=\"disabled() || isOptionDisabled(option)\"\r\n          [class.opacity-60]=\"disabled() || isOptionDisabled(option)\"\r\n          (click)=\"onOptionSelect(option)\"\r\n        >\r\n          @if (resolveIcon(option); as icon) {\r\n            <mt-icon [icon]=\"icon\" class=\"text-base\" />\r\n          }\r\n\r\n          <span class=\"truncate\">{{ resolveLabel(option) }}</span>\r\n\r\n          @if (hasCountBadge(option)) {\r\n            <span\r\n              class=\"inline-grid min-w-[18px] place-items-center rounded-full px-1.5 text-[10px] leading-4 font-bold tabular-nums\"\r\n              [class.bg-primary-50]=\"isActiveOption(option)\"\r\n              [class.text-primary-700]=\"isActiveOption(option)\"\r\n              [class.bg-surface-100]=\"!isActiveOption(option)\"\r\n              [class.text-surface-500]=\"!isActiveOption(option)\"\r\n            >\r\n              {{ resolveBadge(option) }}\r\n            </span>\r\n          }\r\n        </button>\r\n      }\r\n    </div>\r\n\r\n    @if (hasOverflow()) {\r\n      <div\r\n        class=\"flex shrink-0 items-center -mb-px border-b border-surface-200 pb-1\"\r\n      >\r\n        <mt-button\r\n          icon=\"arrow.chevron-down\"\r\n          [label]=\"moreLabel()\"\r\n          size=\"small\"\r\n          severity=\"primary\"\r\n          [text]=\"true\"\r\n          [rounded]=\"true\"\r\n          (onClick)=\"morePopover.toggle($event)\"\r\n        />\r\n        <p-popover #morePopover appendTo=\"body\">\r\n          <div class=\"flex flex-col min-w-40\">\r\n            @for (\r\n              option of overflowOptions();\r\n              track trackOption(option, $index)\r\n            ) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"flex cursor-pointer items-center gap-2 rounded px-2 py-2 text-sm transition-colors\"\r\n                [class.bg-primary-50]=\"isActiveOption(option)\"\r\n                [class.text-primary]=\"isActiveOption(option)\"\r\n                [class.font-semibold]=\"isActiveOption(option)\"\r\n                [class.text-surface-700]=\"!isActiveOption(option)\"\r\n                [class.hover:bg-surface-100]=\"!isActiveOption(option)\"\r\n                [class.cursor-not-allowed]=\"\r\n                  disabled() || isOptionDisabled(option)\r\n                \"\r\n                [class.opacity-60]=\"disabled() || isOptionDisabled(option)\"\r\n                [disabled]=\"disabled() || isOptionDisabled(option)\"\r\n                (click)=\"onOptionSelect(option); morePopover.hide()\"\r\n              >\r\n                @if (resolveIcon(option); as icon) {\r\n                  <mt-icon [icon]=\"icon\" class=\"text-base\" />\r\n                }\r\n                <span class=\"flex-1 truncate\">{{ resolveLabel(option) }}</span>\r\n                @if (hasCountBadge(option)) {\r\n                  <span\r\n                    class=\"inline-grid min-w-[18px] place-items-center rounded-full px-1.5 text-[10px] leading-4 font-bold tabular-nums\"\r\n                    [class.bg-primary-100]=\"isActiveOption(option)\"\r\n                    [class.text-primary-700]=\"isActiveOption(option)\"\r\n                    [class.bg-surface-100]=\"!isActiveOption(option)\"\r\n                    [class.text-surface-500]=\"!isActiveOption(option)\"\r\n                  >\r\n                    {{ resolveBadge(option) }}\r\n                  </span>\r\n                }\r\n              </button>\r\n            }\r\n          </div>\r\n        </p-popover>\r\n      </div>\r\n    }\r\n  </div>\r\n} @else {\r\n  <p-selectbutton\r\n    [options]=\"options()\"\r\n    [(ngModel)]=\"active\"\r\n    (ngModelChange)=\"onTabChange($event)\"\r\n    [optionLabel]=\"optionLabel()\"\r\n    [optionValue]=\"optionValue()\"\r\n    styleClass=\"my-tabs-button\"\r\n    [size]=\"size()\"\r\n    [fluid]=\"fluid()\"\r\n    [disabled]=\"disabled()\"\r\n    unselectable\r\n  />\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/masterteam-components-text-field.mjs

@@ -3,12 +3,21 @@ import { input, signal, computed, inject, effect, HostBinding, ViewChild, Change
 import * as i2 from 'primeng/inputtext';
 import { InputTextModule } from 'primeng/inputtext';
 import * as i1 from '@angular/forms';
-import { Validators, NgControl, FormsModule } from '@angular/forms';
+import { NgControl, FormsModule } from '@angular/forms';
 import { Tooltip } from '@masterteam/components/tooltip';
 import { FieldValidation } from '@masterteam/components/field-validation';
 import { isInvalid } from '@masterteam/components';
 import { Icon } from '@masterteam/icons';
+import { TranslocoService } from '@jsverse/transloco';
 
+const requiredNoWhitespace = (control) => {
+    const value = control.value;
+    if (value === null || value === undefined)
+        return { required: true };
+    if (typeof value === 'string' && value.trim() === '')
+        return { required: true };
+    return null;
+};
 // TODO: text stuck when reset
 class TextField {
     inputText;
@@ -26,7 +35,7 @@ class TextField {
     iconPosition = input('start', ...(ngDevMode ? [{ debugName: "iconPosition" }] : /* istanbul ignore next */ []));
     // readonly externalControl = input<any>(null);
     styleClass;
-    requiredValidator = Validators.required;
+    requiredValidator = requiredNoWhitespace;
     value = signal(null, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     passwordVisible = signal(false, ...(ngDevMode ? [{ debugName: "passwordVisible" }] : /* istanbul ignore next */ []));
@@ -39,7 +48,10 @@ class TextField {
     hasEndActions = computed(() => this.hasEndIcon() || this.hasHint(), ...(ngDevMode ? [{ debugName: "hasEndActions" }] : /* istanbul ignore next */ []));
     hasTwoEndActions = computed(() => this.hasEndIcon() && this.hasHint(), ...(ngDevMode ? [{ debugName: "hasTwoEndActions" }] : /* istanbul ignore next */ []));
     passwordToggleIcon = computed(() => this.passwordVisible() ? 'general.eye-off' : 'general.eye', ...(ngDevMode ? [{ debugName: "passwordToggleIcon" }] : /* istanbul ignore next */ []));
-    passwordToggleLabel = computed(() => this.passwordVisible() ? 'Hide password' : 'Show password', ...(ngDevMode ? [{ debugName: "passwordToggleLabel" }] : /* istanbul ignore next */ []));
+    transloco = inject(TranslocoService);
+    passwordToggleLabel = computed(() => this.passwordVisible()
+        ? this.transloco.translate('components.textField.hidePassword')
+        : this.transloco.translate('components.textField.showPassword'), ...(ngDevMode ? [{ debugName: "passwordToggleLabel" }] : /* istanbul ignore next */ []));
     alphaNum = /[\u0621-\u064A\u0660-\u0669a-z0-9\s]/i;
     onTouched = () => { };
     onModelChange = () => { };
@@ -59,7 +71,7 @@ class TextField {
         }
         effect(() => {
             if (this.ngControl?.control && this.required()) {
-                this.ngControl.control.addValidators(Validators.required);
+                this.ngControl.control.addValidators(this.requiredValidator);
                 this.ngControl.control.updateValueAndValidity();
             }
         });

package/fesm2022/masterteam-components-text-field.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"masterteam-components-text-field.mjs","sources":["../../../../packages/masterteam/components/text-field/text-field.ts","../../../../packages/masterteam/components/text-field/text-field.html","../../../../packages/masterteam/components/text-field/masterteam-components-text-field.ts"],"sourcesContent":["import {\r\n  Component,\r\n  HostBinding,\r\n  SimpleChanges,\r\n  ViewChild,\r\n  signal,\r\n  input,\r\n  OnInit,\r\n  OnChanges,\r\n  inject,\r\n  ChangeDetectionStrategy,\r\n  effect,\r\n  computed,\r\n} from '@angular/core';\r\nimport { InputTextModule } from 'primeng/inputtext';\r\nimport {\r\n  ControlValueAccessor,\r\n  FormsModule,\r\n  NgControl,\r\n  Validators,\r\n} from '@angular/forms';\r\n// import { KeyFilterModule, KeyFilterPattern } from 'primeng/keyfilter';\r\nimport { Tooltip } from '@masterteam/components/tooltip';\r\nimport { FieldValidation } from '@masterteam/components/field-validation';\r\nimport { isInvalid } from '@masterteam/components';\r\nimport { Icon, MTIcon } from '@masterteam/icons';\r\n\r\n// TODO: text stuck when reset\r\n@Component({\r\n  selector: 'mt-text-field',\r\n  standalone: true,\r\n  imports: [\r\n    FormsModule,\r\n    InputTextModule,\r\n    // INFO: if we need this filter uncomment the import, and next line and add this to the template input\r\n    //[pKeyFilter]=\"\r\n    //   pKeyFilter()\r\n    //     ? pKeyFilter() === 'alphanum'\r\n    //       ? alphaNum\r\n    //       : pKeyFilter()\r\n    //     : null\r\n    // \"\r\n    // KeyFilterModule,\r\n    Tooltip,\r\n    FieldValidation,\r\n    Icon,\r\n  ],\r\n  templateUrl: './text-field.html',\r\n  styleUrls: ['./text-field.scss'],\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  host: {\r\n    class: 'grid gap-1',\r\n  },\r\n})\r\nexport class TextField implements ControlValueAccessor, OnInit, OnChanges {\r\n  @ViewChild('inputText', { static: true })\r\n  inputText: HTMLInputElement;\r\n\r\n  readonly field = input<boolean>(true);\r\n  readonly hint = input<string>();\r\n  readonly label = input<string>();\r\n  readonly placeholder = input<string>();\r\n  readonly class = input<string>('');\r\n  readonly type = input<string>('text');\r\n  readonly readonly = input<boolean>(false);\r\n  readonly pInputs = input<Partial<HTMLInputElement>>();\r\n  // readonly pKeyFilter = input<KeyFilterPattern | RegExp>();\r\n  readonly required = input<boolean>(false);\r\n  readonly icon = input<MTIcon>();\r\n  readonly iconPosition = input<'start' | 'end'>('start');\r\n  // readonly externalControl = input<any>(null);\r\n\r\n  @HostBinding('class') styleClass: string;\r\n\r\n  requiredValidator = Validators.required;\r\n  value = signal<string | null>(null);\r\n  disabled = signal<boolean>(false);\r\n  passwordVisible = signal<boolean>(false);\r\n  isPasswordField = computed(() => this.type() === 'password');\r\n  inputType = computed(() =>\r\n    this.isPasswordField() && this.passwordVisible() ? 'text' : this.type(),\r\n  );\r\n  hasStartIcon = computed(\r\n    () => Boolean(this.icon()) && this.iconPosition() === 'start',\r\n  );\r\n  hasEndIcon = computed(\r\n    () =>\r\n      this.isPasswordField() ||\r\n      (Boolean(this.icon()) && this.iconPosition() === 'end'),\r\n  );\r\n  hasHint = computed(() => Boolean(this.hint()));\r\n  hasEndActions = computed(() => this.hasEndIcon() || this.hasHint());\r\n  hasTwoEndActions = computed(() => this.hasEndIcon() && this.hasHint());\r\n  passwordToggleIcon = computed<MTIcon>(() =>\r\n    this.passwordVisible() ? 'general.eye-off' : 'general.eye',\r\n  );\r\n  passwordToggleLabel = computed(() =>\r\n    this.passwordVisible() ? 'Hide password' : 'Show password',\r\n  );\r\n\r\n  alphaNum: RegExp = /[\\u0621-\\u064A\\u0660-\\u0669a-z0-9\\s]/i;\r\n\r\n  onTouched: () => void = () => {};\r\n  onModelChange: (value: any) => void = () => {};\r\n\r\n  public ngControl: NgControl | null = null;\r\n\r\n  isInvalid = isInvalid;\r\n\r\n  constructor() {\r\n    try {\r\n      // Try to inject NgControl if available\r\n      this.ngControl = inject(NgControl, { self: true, optional: true });\r\n      if (this.ngControl) {\r\n        this.ngControl.valueAccessor = this;\r\n      }\r\n    } catch (_e) {\r\n      // If injection fails, ngControl will remain null\r\n      this.ngControl = null;\r\n    }\r\n    effect(() => {\r\n      if (this.ngControl?.control && this.required()) {\r\n        this.ngControl.control.addValidators(Validators.required);\r\n        this.ngControl.control.updateValueAndValidity();\r\n      }\r\n    });\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.styleClass = this.class();\r\n    // if (this.externalControl()) {\r\n    //   debugger\r\n    //   this.ngControl = this.externalControl();\r\n    // }\r\n\r\n    if (this.pInputs()) {\r\n      this.applyInputsToInputText();\r\n    }\r\n  }\r\n\r\n  applyInputsToInputText() {\r\n    Object.assign(this.inputText, this.pInputs());\r\n  }\r\n\r\n  onValueChange(value: any) {\r\n    this.value.set(value);\r\n\r\n    const control = this.ngControl?.control;\r\n    if (control) {\r\n      control.setValue(value);\r\n      control.markAsDirty();\r\n      control.markAsTouched();\r\n      control.updateValueAndValidity({ emitEvent: false });\r\n      return;\r\n    }\r\n\r\n    this.onModelChange(value);\r\n    this.onTouched();\r\n  }\r\n\r\n  togglePasswordVisibility() {\r\n    if (this.disabled() || this.readonly()) {\r\n      return;\r\n    }\r\n\r\n    this.passwordVisible.update((visible) => !visible);\r\n  }\r\n\r\n  ngOnChanges(changes: SimpleChanges) {\r\n    if (changes['pInputs']) {\r\n      this.applyInputsToInputText();\r\n    }\r\n  }\r\n\r\n  writeValue(value: string) {\r\n    this.value.set(value);\r\n  }\r\n\r\n  registerOnChange(fn: any) {\r\n    this.onModelChange = fn;\r\n  }\r\n\r\n  registerOnTouched(fn: any) {\r\n    this.onTouched = fn;\r\n  }\r\n\r\n  setDisabledState(disabled: boolean) {\r\n    this.disabled.set(disabled);\r\n  }\r\n}\r\n","@if (label()) {\r\n  <label\r\n    [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n    [for]=\"ngControl?.name || label()\"\r\n    >{{ label() }}</label\r\n  >\r\n}\r\n\r\n<div\r\n  class=\"mt-text-field__input\"\r\n  [class.mt-text-field__input--start-icon]=\"hasStartIcon()\"\r\n  [class.mt-text-field__input--end-action]=\"hasEndActions()\"\r\n  [class.mt-text-field__input--two-end-actions]=\"hasTwoEndActions()\"\r\n>\r\n  @if (icon() && iconPosition() === \"start\") {\r\n    <span class=\"mt-text-field__icon mt-text-field__icon--start\">\r\n      <mt-icon [icon]=\"icon()\" />\r\n    </span>\r\n  }\r\n\r\n  <input\r\n    #inputText=\"\"\r\n    pInputText=\"\"\r\n    [ngModel]=\"value()\"\r\n    (ngModelChange)=\"onValueChange($event)\"\r\n    [disabled]=\"disabled() || readonly()\"\r\n    [type]=\"inputType()\"\r\n    [id]=\"ngControl?.name || label()\"\r\n    [invalid]=\"isInvalid(ngControl?.control)\"\r\n    (blur)=\"onTouched()\"\r\n    placeholder=\"{{ placeholder() ?? label() ?? '' }}\"\r\n    class=\"w-full\"\r\n  />\r\n\r\n  @if (isPasswordField()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"mt-text-field__action\"\r\n      [class.mt-text-field__action--before-hint]=\"hasHint()\"\r\n      [disabled]=\"disabled() || readonly()\"\r\n      [attr.aria-label]=\"passwordToggleLabel()\"\r\n      [mtTooltip]=\"passwordToggleLabel()\"\r\n      tooltipPosition=\"top\"\r\n      (click)=\"togglePasswordVisibility()\"\r\n    >\r\n      <mt-icon [icon]=\"passwordToggleIcon()\" />\r\n    </button>\r\n  } @else if (icon() && iconPosition() === \"end\") {\r\n    <span\r\n      class=\"mt-text-field__icon mt-text-field__icon--end\"\r\n      [class.mt-text-field__icon--before-hint]=\"hasHint()\"\r\n    >\r\n      <mt-icon [icon]=\"icon()\" />\r\n    </span>\r\n  }\r\n\r\n  @if (hint()) {\r\n    <span\r\n      class=\"mt-text-field__icon mt-text-field__icon--end\"\r\n      [mtTooltip]=\"hint()\"\r\n      tooltipPosition=\"top\"\r\n    >\r\n      <mt-icon icon=\"general.info-circle\" />\r\n    </span>\r\n  }\r\n</div>\r\n\r\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"masterteam-components-text-field.mjs","sources":["../../../../packages/masterteam/components/text-field/text-field.ts","../../../../packages/masterteam/components/text-field/text-field.html","../../../../packages/masterteam/components/text-field/masterteam-components-text-field.ts"],"sourcesContent":["import {\r\n  Component,\r\n  HostBinding,\r\n  SimpleChanges,\r\n  ViewChild,\r\n  signal,\r\n  input,\r\n  OnInit,\r\n  OnChanges,\r\n  inject,\r\n  ChangeDetectionStrategy,\r\n  effect,\r\n  computed,\r\n} from '@angular/core';\r\nimport { InputTextModule } from 'primeng/inputtext';\r\nimport {\r\n  AbstractControl,\r\n  ControlValueAccessor,\r\n  FormsModule,\r\n  NgControl,\r\n  ValidationErrors,\r\n  ValidatorFn,\r\n} from '@angular/forms';\r\n// import { KeyFilterModule, KeyFilterPattern } from 'primeng/keyfilter';\r\nimport { Tooltip } from '@masterteam/components/tooltip';\r\nimport { FieldValidation } from '@masterteam/components/field-validation';\r\nimport { isInvalid } from '@masterteam/components';\r\nimport { Icon, MTIcon } from '@masterteam/icons';\r\nimport { TranslocoService } from '@jsverse/transloco';\r\n\r\nconst requiredNoWhitespace: ValidatorFn = (\r\n  control: AbstractControl,\r\n): ValidationErrors | null => {\r\n  const value = control.value;\r\n  if (value === null || value === undefined) return { required: true };\r\n  if (typeof value === 'string' && value.trim() === '')\r\n    return { required: true };\r\n  return null;\r\n};\r\n\r\n// TODO: text stuck when reset\r\n@Component({\r\n  selector: 'mt-text-field',\r\n  standalone: true,\r\n  imports: [\r\n    FormsModule,\r\n    InputTextModule,\r\n    // INFO: if we need this filter uncomment the import, and next line and add this to the template input\r\n    //[pKeyFilter]=\"\r\n    //   pKeyFilter()\r\n    //     ? pKeyFilter() === 'alphanum'\r\n    //       ? alphaNum\r\n    //       : pKeyFilter()\r\n    //     : null\r\n    // \"\r\n    // KeyFilterModule,\r\n    Tooltip,\r\n    FieldValidation,\r\n    Icon,\r\n  ],\r\n  templateUrl: './text-field.html',\r\n  styleUrls: ['./text-field.scss'],\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  host: {\r\n    class: 'grid gap-1',\r\n  },\r\n})\r\nexport class TextField implements ControlValueAccessor, OnInit, OnChanges {\r\n  @ViewChild('inputText', { static: true })\r\n  inputText: HTMLInputElement;\r\n\r\n  readonly field = input<boolean>(true);\r\n  readonly hint = input<string>();\r\n  readonly label = input<string>();\r\n  readonly placeholder = input<string>();\r\n  readonly class = input<string>('');\r\n  readonly type = input<string>('text');\r\n  readonly readonly = input<boolean>(false);\r\n  readonly pInputs = input<Partial<HTMLInputElement>>();\r\n  // readonly pKeyFilter = input<KeyFilterPattern | RegExp>();\r\n  readonly required = input<boolean>(false);\r\n  readonly icon = input<MTIcon>();\r\n  readonly iconPosition = input<'start' | 'end'>('start');\r\n  // readonly externalControl = input<any>(null);\r\n\r\n  @HostBinding('class') styleClass: string;\r\n\r\n  requiredValidator: ValidatorFn = requiredNoWhitespace;\r\n  value = signal<string | null>(null);\r\n  disabled = signal<boolean>(false);\r\n  passwordVisible = signal<boolean>(false);\r\n  isPasswordField = computed(() => this.type() === 'password');\r\n  inputType = computed(() =>\r\n    this.isPasswordField() && this.passwordVisible() ? 'text' : this.type(),\r\n  );\r\n  hasStartIcon = computed(\r\n    () => Boolean(this.icon()) && this.iconPosition() === 'start',\r\n  );\r\n  hasEndIcon = computed(\r\n    () =>\r\n      this.isPasswordField() ||\r\n      (Boolean(this.icon()) && this.iconPosition() === 'end'),\r\n  );\r\n  hasHint = computed(() => Boolean(this.hint()));\r\n  hasEndActions = computed(() => this.hasEndIcon() || this.hasHint());\r\n  hasTwoEndActions = computed(() => this.hasEndIcon() && this.hasHint());\r\n  passwordToggleIcon = computed<MTIcon>(() =>\r\n    this.passwordVisible() ? 'general.eye-off' : 'general.eye',\r\n  );\r\n  private readonly transloco = inject(TranslocoService);\r\n  passwordToggleLabel = computed(() =>\r\n    this.passwordVisible()\r\n      ? this.transloco.translate('components.textField.hidePassword')\r\n      : this.transloco.translate('components.textField.showPassword'),\r\n  );\r\n\r\n  alphaNum: RegExp = /[\\u0621-\\u064A\\u0660-\\u0669a-z0-9\\s]/i;\r\n\r\n  onTouched: () => void = () => {};\r\n  onModelChange: (value: any) => void = () => {};\r\n\r\n  public ngControl: NgControl | null = null;\r\n\r\n  isInvalid = isInvalid;\r\n\r\n  constructor() {\r\n    try {\r\n      // Try to inject NgControl if available\r\n      this.ngControl = inject(NgControl, { self: true, optional: true });\r\n      if (this.ngControl) {\r\n        this.ngControl.valueAccessor = this;\r\n      }\r\n    } catch (_e) {\r\n      // If injection fails, ngControl will remain null\r\n      this.ngControl = null;\r\n    }\r\n    effect(() => {\r\n      if (this.ngControl?.control && this.required()) {\r\n        this.ngControl.control.addValidators(this.requiredValidator);\r\n        this.ngControl.control.updateValueAndValidity();\r\n      }\r\n    });\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.styleClass = this.class();\r\n    // if (this.externalControl()) {\r\n    //   debugger\r\n    //   this.ngControl = this.externalControl();\r\n    // }\r\n\r\n    if (this.pInputs()) {\r\n      this.applyInputsToInputText();\r\n    }\r\n  }\r\n\r\n  applyInputsToInputText() {\r\n    Object.assign(this.inputText, this.pInputs());\r\n  }\r\n\r\n  onValueChange(value: any) {\r\n    this.value.set(value);\r\n\r\n    const control = this.ngControl?.control;\r\n    if (control) {\r\n      control.setValue(value);\r\n      control.markAsDirty();\r\n      control.markAsTouched();\r\n      control.updateValueAndValidity({ emitEvent: false });\r\n      return;\r\n    }\r\n\r\n    this.onModelChange(value);\r\n    this.onTouched();\r\n  }\r\n\r\n  togglePasswordVisibility() {\r\n    if (this.disabled() || this.readonly()) {\r\n      return;\r\n    }\r\n\r\n    this.passwordVisible.update((visible) => !visible);\r\n  }\r\n\r\n  ngOnChanges(changes: SimpleChanges) {\r\n    if (changes['pInputs']) {\r\n      this.applyInputsToInputText();\r\n    }\r\n  }\r\n\r\n  writeValue(value: string) {\r\n    this.value.set(value);\r\n  }\r\n\r\n  registerOnChange(fn: any) {\r\n    this.onModelChange = fn;\r\n  }\r\n\r\n  registerOnTouched(fn: any) {\r\n    this.onTouched = fn;\r\n  }\r\n\r\n  setDisabledState(disabled: boolean) {\r\n    this.disabled.set(disabled);\r\n  }\r\n}\r\n","@if (label()) {\r\n  <label\r\n    [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n    [for]=\"ngControl?.name || label()\"\r\n    >{{ label() }}</label\r\n  >\r\n}\r\n\r\n<div\r\n  class=\"mt-text-field__input\"\r\n  [class.mt-text-field__input--start-icon]=\"hasStartIcon()\"\r\n  [class.mt-text-field__input--end-action]=\"hasEndActions()\"\r\n  [class.mt-text-field__input--two-end-actions]=\"hasTwoEndActions()\"\r\n>\r\n  @if (icon() && iconPosition() === \"start\") {\r\n    <span class=\"mt-text-field__icon mt-text-field__icon--start\">\r\n      <mt-icon [icon]=\"icon()\" />\r\n    </span>\r\n  }\r\n\r\n  <input\r\n    #inputText=\"\"\r\n    pInputText=\"\"\r\n    [ngModel]=\"value()\"\r\n    (ngModelChange)=\"onValueChange($event)\"\r\n    [disabled]=\"disabled() || readonly()\"\r\n    [type]=\"inputType()\"\r\n    [id]=\"ngControl?.name || label()\"\r\n    [invalid]=\"isInvalid(ngControl?.control)\"\r\n    (blur)=\"onTouched()\"\r\n    placeholder=\"{{ placeholder() ?? label() ?? '' }}\"\r\n    class=\"w-full\"\r\n  />\r\n\r\n  @if (isPasswordField()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"mt-text-field__action\"\r\n      [class.mt-text-field__action--before-hint]=\"hasHint()\"\r\n      [disabled]=\"disabled() || readonly()\"\r\n      [attr.aria-label]=\"passwordToggleLabel()\"\r\n      [mtTooltip]=\"passwordToggleLabel()\"\r\n      tooltipPosition=\"top\"\r\n      (click)=\"togglePasswordVisibility()\"\r\n    >\r\n      <mt-icon [icon]=\"passwordToggleIcon()\" />\r\n    </button>\r\n  } @else if (icon() && iconPosition() === \"end\") {\r\n    <span\r\n      class=\"mt-text-field__icon mt-text-field__icon--end\"\r\n      [class.mt-text-field__icon--before-hint]=\"hasHint()\"\r\n    >\r\n      <mt-icon [icon]=\"icon()\" />\r\n    </span>\r\n  }\r\n\r\n  @if (hint()) {\r\n    <span\r\n      class=\"mt-text-field__icon mt-text-field__icon--end\"\r\n      [mtTooltip]=\"hint()\"\r\n      tooltipPosition=\"top\"\r\n    >\r\n      <mt-icon icon=\"general.info-circle\" />\r\n    </span>\r\n  }\r\n</div>\r\n\r\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/masterteam-components-topbar.mjs

@@ -1,6 +1,7 @@
 import * as i0 from '@angular/core';
 import { input, booleanAttribute, Component } from '@angular/core';
 import { RouterLink } from '@angular/router';
+import { TranslocoPipe } from '@jsverse/transloco';
 
 class Topbar {
     logo = input(...(ngDevMode ? [undefined, { debugName: "logo" }] : /* istanbul ignore next */ []));
@@ -16,11 +17,11 @@ class Topbar {
     titleClass = input(...(ngDevMode ? [undefined, { debugName: "titleClass" }] : /* istanbul ignore next */ []));
     subTitleClass = input(...(ngDevMode ? [undefined, { debugName: "subTitleClass" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: Topbar, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: Topbar, isStandalone: true, selector: "mt-topbar", inputs: { logo: { classPropertyName: "logo", publicName: "logo", isSignal: true, isRequired: false, transformFunction: null }, logoLink: { classPropertyName: "logoLink", publicName: "logoLink", isSignal: true, isRequired: false, transformFunction: null }, bgColor: { classPropertyName: "bgColor", publicName: "bgColor", isSignal: true, isRequired: false, transformFunction: null }, bgImage: { classPropertyName: "bgImage", publicName: "bgImage", isSignal: true, isRequired: false, transformFunction: null }, bgRepeat: { classPropertyName: "bgRepeat", publicName: "bgRepeat", isSignal: true, isRequired: false, transformFunction: null }, textColor: { classPropertyName: "textColor", publicName: "textColor", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, showBranding: { classPropertyName: "showBranding", publicName: "showBranding", isSignal: true, isRequired: false, transformFunction: null }, logoClass: { classPropertyName: "logoClass", publicName: "logoClass", isSignal: true, isRequired: false, transformFunction: null }, titleClass: { classPropertyName: "titleClass", publicName: "titleClass", isSignal: true, isRequired: false, transformFunction: null }, subTitleClass: { classPropertyName: "subTitleClass", publicName: "subTitleClass", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\r\n  class=\"w-full flex justify-between align-center bg-primary px-4 py-2 h-[var(--header-height)]\"\r\n  [style.backgroundColor]=\"bgColor()\"\r\n  [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n  [style.backgroundSize]=\"bgImage() && !bgRepeat() ? 'cover' : null\"\r\n  [style.backgroundPosition]=\"bgImage() && !bgRepeat() ? 'center' : null\"\r\n  [class.bg-no-repeat]=\"!bgRepeat()\"\r\n  [class.bg-repeat]=\"bgRepeat()\"\r\n>\r\n  <div class=\"flex gap-4 items-center\" [style.color]=\"textColor()\">\r\n    <div\r\n      class=\"flex gap-3 items-center h-full overflow-hidden transition-all duration-400 ease-in-out\"\r\n      [class.max-w-0]=\"!showBranding()\"\r\n      [class.opacity-0]=\"!showBranding()\"\r\n      [class.max-w-lg]=\"showBranding()\"\r\n      [class.opacity-100]=\"showBranding()\"\r\n    >\r\n      @if (logo()) {\r\n        <img\r\n          [src]=\"logo()\"\r\n          alt=\"Logo\"\r\n          class=\"h-10 shrink-0\"\r\n          [class]=\"logoClass()\"\r\n          [routerLink]=\"logoLink()\"\r\n          [class.cursor-pointer]=\"logoLink()\"\r\n        />\r\n      }\r\n      @if (logo() && (title() || subTitle())) {\r\n        <div class=\"h-3/4 w-[1px] bg-current shrink-0 opacity-30\"></div>\r\n      }\r\n      @if (title() || subTitle()) {\r\n        <div class=\"flex flex-col shrink-0\">\r\n          <h2\r\n            class=\"text-md font-semibold product-name whitespace-nowrap\"\r\n            [class]=\"titleClass()\"\r\n          >\r\n            {{ title() }}\r\n          </h2>\r\n          <span\r\n            class=\"text-sm product-tagline whitespace-nowrap\"\r\n            [class]=\"subTitleClass()\"\r\n            >{{ subTitle() }}</span\r\n          >\r\n        </div>\r\n      }\r\n    </div>\r\n    <ng-content select=\"[start]\"></ng-content>\r\n  </div>\r\n  <div class=\"flex gap-2 items-center\">\r\n    <ng-content select=\"[actions]\"></ng-content>\r\n  </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: Topbar, isStandalone: true, selector: "mt-topbar", inputs: { logo: { classPropertyName: "logo", publicName: "logo", isSignal: true, isRequired: false, transformFunction: null }, logoLink: { classPropertyName: "logoLink", publicName: "logoLink", isSignal: true, isRequired: false, transformFunction: null }, bgColor: { classPropertyName: "bgColor", publicName: "bgColor", isSignal: true, isRequired: false, transformFunction: null }, bgImage: { classPropertyName: "bgImage", publicName: "bgImage", isSignal: true, isRequired: false, transformFunction: null }, bgRepeat: { classPropertyName: "bgRepeat", publicName: "bgRepeat", isSignal: true, isRequired: false, transformFunction: null }, textColor: { classPropertyName: "textColor", publicName: "textColor", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, showBranding: { classPropertyName: "showBranding", publicName: "showBranding", isSignal: true, isRequired: false, transformFunction: null }, logoClass: { classPropertyName: "logoClass", publicName: "logoClass", isSignal: true, isRequired: false, transformFunction: null }, titleClass: { classPropertyName: "titleClass", publicName: "titleClass", isSignal: true, isRequired: false, transformFunction: null }, subTitleClass: { classPropertyName: "subTitleClass", publicName: "subTitleClass", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\r\n  class=\"w-full flex justify-between align-center bg-primary px-4 py-2 h-[var(--header-height)]\"\r\n  [style.backgroundColor]=\"bgColor()\"\r\n  [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n  [style.backgroundSize]=\"bgImage() && !bgRepeat() ? 'cover' : null\"\r\n  [style.backgroundPosition]=\"bgImage() && !bgRepeat() ? 'center' : null\"\r\n  [class.bg-no-repeat]=\"!bgRepeat()\"\r\n  [class.bg-repeat]=\"bgRepeat()\"\r\n>\r\n  <div class=\"flex gap-4 items-center\" [style.color]=\"textColor()\">\r\n    <div\r\n      class=\"flex gap-3 items-center h-full overflow-hidden transition-all duration-400 ease-in-out\"\r\n      [class.max-w-0]=\"!showBranding()\"\r\n      [class.opacity-0]=\"!showBranding()\"\r\n      [class.max-w-lg]=\"showBranding()\"\r\n      [class.opacity-100]=\"showBranding()\"\r\n    >\r\n      @if (logo()) {\r\n        <img\r\n          [src]=\"logo()\"\r\n          [alt]=\"'components.topbar.logoAlt' | transloco\"\r\n          class=\"h-10 shrink-0\"\r\n          [class]=\"logoClass()\"\r\n          [routerLink]=\"logoLink()\"\r\n          [class.cursor-pointer]=\"logoLink()\"\r\n        />\r\n      }\r\n      @if (logo() && (title() || subTitle())) {\r\n        <div class=\"h-3/4 w-[1px] bg-current shrink-0 opacity-30\"></div>\r\n      }\r\n      @if (title() || subTitle()) {\r\n        <div class=\"flex flex-col shrink-0\">\r\n          <h2\r\n            class=\"text-md font-semibold product-name whitespace-nowrap\"\r\n            [class]=\"titleClass()\"\r\n          >\r\n            {{ title() }}\r\n          </h2>\r\n          <span\r\n            class=\"text-sm product-tagline whitespace-nowrap\"\r\n            [class]=\"subTitleClass()\"\r\n            >{{ subTitle() }}</span\r\n          >\r\n        </div>\r\n      }\r\n    </div>\r\n    <ng-content select=\"[start]\"></ng-content>\r\n  </div>\r\n  <div class=\"flex gap-2 items-center\">\r\n    <ng-content select=\"[actions]\"></ng-content>\r\n  </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: Topbar, decorators: [{
             type: Component,
-            args: [{ selector: 'mt-topbar', standalone: true, imports: [RouterLink], template: "<div\r\n  class=\"w-full flex justify-between align-center bg-primary px-4 py-2 h-[var(--header-height)]\"\r\n  [style.backgroundColor]=\"bgColor()\"\r\n  [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n  [style.backgroundSize]=\"bgImage() && !bgRepeat() ? 'cover' : null\"\r\n  [style.backgroundPosition]=\"bgImage() && !bgRepeat() ? 'center' : null\"\r\n  [class.bg-no-repeat]=\"!bgRepeat()\"\r\n  [class.bg-repeat]=\"bgRepeat()\"\r\n>\r\n  <div class=\"flex gap-4 items-center\" [style.color]=\"textColor()\">\r\n    <div\r\n      class=\"flex gap-3 items-center h-full overflow-hidden transition-all duration-400 ease-in-out\"\r\n      [class.max-w-0]=\"!showBranding()\"\r\n      [class.opacity-0]=\"!showBranding()\"\r\n      [class.max-w-lg]=\"showBranding()\"\r\n      [class.opacity-100]=\"showBranding()\"\r\n    >\r\n      @if (logo()) {\r\n        <img\r\n          [src]=\"logo()\"\r\n          alt=\"Logo\"\r\n          class=\"h-10 shrink-0\"\r\n          [class]=\"logoClass()\"\r\n          [routerLink]=\"logoLink()\"\r\n          [class.cursor-pointer]=\"logoLink()\"\r\n        />\r\n      }\r\n      @if (logo() && (title() || subTitle())) {\r\n        <div class=\"h-3/4 w-[1px] bg-current shrink-0 opacity-30\"></div>\r\n      }\r\n      @if (title() || subTitle()) {\r\n        <div class=\"flex flex-col shrink-0\">\r\n          <h2\r\n            class=\"text-md font-semibold product-name whitespace-nowrap\"\r\n            [class]=\"titleClass()\"\r\n          >\r\n            {{ title() }}\r\n          </h2>\r\n          <span\r\n            class=\"text-sm product-tagline whitespace-nowrap\"\r\n            [class]=\"subTitleClass()\"\r\n            >{{ subTitle() }}</span\r\n          >\r\n        </div>\r\n      }\r\n    </div>\r\n    <ng-content select=\"[start]\"></ng-content>\r\n  </div>\r\n  <div class=\"flex gap-2 items-center\">\r\n    <ng-content select=\"[actions]\"></ng-content>\r\n  </div>\r\n</div>\r\n" }]
+            args: [{ selector: 'mt-topbar', standalone: true, imports: [RouterLink, TranslocoPipe], template: "<div\r\n  class=\"w-full flex justify-between align-center bg-primary px-4 py-2 h-[var(--header-height)]\"\r\n  [style.backgroundColor]=\"bgColor()\"\r\n  [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n  [style.backgroundSize]=\"bgImage() && !bgRepeat() ? 'cover' : null\"\r\n  [style.backgroundPosition]=\"bgImage() && !bgRepeat() ? 'center' : null\"\r\n  [class.bg-no-repeat]=\"!bgRepeat()\"\r\n  [class.bg-repeat]=\"bgRepeat()\"\r\n>\r\n  <div class=\"flex gap-4 items-center\" [style.color]=\"textColor()\">\r\n    <div\r\n      class=\"flex gap-3 items-center h-full overflow-hidden transition-all duration-400 ease-in-out\"\r\n      [class.max-w-0]=\"!showBranding()\"\r\n      [class.opacity-0]=\"!showBranding()\"\r\n      [class.max-w-lg]=\"showBranding()\"\r\n      [class.opacity-100]=\"showBranding()\"\r\n    >\r\n      @if (logo()) {\r\n        <img\r\n          [src]=\"logo()\"\r\n          [alt]=\"'components.topbar.logoAlt' | transloco\"\r\n          class=\"h-10 shrink-0\"\r\n          [class]=\"logoClass()\"\r\n          [routerLink]=\"logoLink()\"\r\n          [class.cursor-pointer]=\"logoLink()\"\r\n        />\r\n      }\r\n      @if (logo() && (title() || subTitle())) {\r\n        <div class=\"h-3/4 w-[1px] bg-current shrink-0 opacity-30\"></div>\r\n      }\r\n      @if (title() || subTitle()) {\r\n        <div class=\"flex flex-col shrink-0\">\r\n          <h2\r\n            class=\"text-md font-semibold product-name whitespace-nowrap\"\r\n            [class]=\"titleClass()\"\r\n          >\r\n            {{ title() }}\r\n          </h2>\r\n          <span\r\n            class=\"text-sm product-tagline whitespace-nowrap\"\r\n            [class]=\"subTitleClass()\"\r\n            >{{ subTitle() }}</span\r\n          >\r\n        </div>\r\n      }\r\n    </div>\r\n    <ng-content select=\"[start]\"></ng-content>\r\n  </div>\r\n  <div class=\"flex gap-2 items-center\">\r\n    <ng-content select=\"[actions]\"></ng-content>\r\n  </div>\r\n</div>\r\n" }]
         }], propDecorators: { logo: [{ type: i0.Input, args: [{ isSignal: true, alias: "logo", required: false }] }], logoLink: [{ type: i0.Input, args: [{ isSignal: true, alias: "logoLink", required: false }] }], bgColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgColor", required: false }] }], bgImage: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgImage", required: false }] }], bgRepeat: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgRepeat", required: false }] }], textColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "textColor", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subTitle", required: false }] }], showBranding: [{ type: i0.Input, args: [{ isSignal: true, alias: "showBranding", required: false }] }], logoClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "logoClass", required: false }] }], titleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleClass", required: false }] }], subTitleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "subTitleClass", required: false }] }] } });
 
 /**

package/fesm2022/masterteam-components-topbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"masterteam-components-topbar.mjs","sources":["../../../../packages/masterteam/components/topbar/topbar.ts","../../../../packages/masterteam/components/topbar/topbar.html","../../../../packages/masterteam/components/topbar/masterteam-components-topbar.ts"],"sourcesContent":["import { booleanAttribute, Component, input } from '@angular/core';\r\nimport { RouterLink } from '@angular/router';\r\n\r\n@Component({\r\n  selector: 'mt-topbar',\r\n  standalone: true,\r\n  imports: [RouterLink],\r\n  templateUrl: './topbar.html',\r\n})\r\nexport class Topbar {\r\n  logo = input<string>();\r\n  logoLink = input<string | any[]>();\r\n  bgColor = input<string>('var(--p-primary-color)');\r\n  bgImage = input<string>();\r\n  bgRepeat = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n  textColor = input<string>('var(--p-primary-contrast-color)');\r\n  title = input<string>();\r\n  subTitle = input<string>();\r\n  showBranding = input<boolean, unknown>(true, { transform: booleanAttribute });\r\n  logoClass = input<string>();\r\n  titleClass = input<string>();\r\n  subTitleClass = input<string>();\r\n}\r\n","<div\r\n  class=\"w-full flex justify-between align-center bg-primary px-4 py-2 h-[var(--header-height)]\"\r\n  [style.backgroundColor]=\"bgColor()\"\r\n  [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n  [style.backgroundSize]=\"bgImage() && !bgRepeat() ? 'cover' : null\"\r\n  [style.backgroundPosition]=\"bgImage() && !bgRepeat() ? 'center' : null\"\r\n  [class.bg-no-repeat]=\"!bgRepeat()\"\r\n  [class.bg-repeat]=\"bgRepeat()\"\r\n>\r\n  <div class=\"flex gap-4 items-center\" [style.color]=\"textColor()\">\r\n    <div\r\n      class=\"flex gap-3 items-center h-full overflow-hidden transition-all duration-400 ease-in-out\"\r\n      [class.max-w-0]=\"!showBranding()\"\r\n      [class.opacity-0]=\"!showBranding()\"\r\n      [class.max-w-lg]=\"showBranding()\"\r\n      [class.opacity-100]=\"showBranding()\"\r\n    >\r\n      @if (logo()) {\r\n        <img\r\n          [src]=\"logo()\"\r\n          alt=\"Logo\"\r\n          class=\"h-10 shrink-0\"\r\n          [class]=\"logoClass()\"\r\n          [routerLink]=\"logoLink()\"\r\n          [class.cursor-pointer]=\"logoLink()\"\r\n        />\r\n      }\r\n      @if (logo() && (title() || subTitle())) {\r\n        <div class=\"h-3/4 w-[1px] bg-current shrink-0 opacity-30\"></div>\r\n      }\r\n      @if (title() || subTitle()) {\r\n        <div class=\"flex flex-col shrink-0\">\r\n          <h2\r\n            class=\"text-md font-semibold product-name whitespace-nowrap\"\r\n            [class]=\"titleClass()\"\r\n          >\r\n            {{ title() }}\r\n          </h2>\r\n          <span\r\n            class=\"text-sm product-tagline whitespace-nowrap\"\r\n            [class]=\"subTitleClass()\"\r\n            >{{ subTitle() }}</span\r\n          >\r\n        </div>\r\n      }\r\n    </div>\r\n    <ng-content select=\"[start]\"></ng-content>\r\n  </div>\r\n  <div class=\"flex gap-2 items-center\">\r\n    <ng-content select=\"[actions]\"></ng-content>\r\n  </div>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"masterteam-components-topbar.mjs","sources":["../../../../packages/masterteam/components/topbar/topbar.ts","../../../../packages/masterteam/components/topbar/topbar.html","../../../../packages/masterteam/components/topbar/masterteam-components-topbar.ts"],"sourcesContent":["import { booleanAttribute, Component, input } from '@angular/core';\r\nimport { RouterLink } from '@angular/router';\r\nimport { TranslocoPipe } from '@jsverse/transloco';\r\n\r\n@Component({\r\n  selector: 'mt-topbar',\r\n  standalone: true,\r\n  imports: [RouterLink, TranslocoPipe],\r\n  templateUrl: './topbar.html',\r\n})\r\nexport class Topbar {\r\n  logo = input<string>();\r\n  logoLink = input<string | any[]>();\r\n  bgColor = input<string>('var(--p-primary-color)');\r\n  bgImage = input<string>();\r\n  bgRepeat = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n  textColor = input<string>('var(--p-primary-contrast-color)');\r\n  title = input<string>();\r\n  subTitle = input<string>();\r\n  showBranding = input<boolean, unknown>(true, { transform: booleanAttribute });\r\n  logoClass = input<string>();\r\n  titleClass = input<string>();\r\n  subTitleClass = input<string>();\r\n}\r\n","<div\r\n  class=\"w-full flex justify-between align-center bg-primary px-4 py-2 h-[var(--header-height)]\"\r\n  [style.backgroundColor]=\"bgColor()\"\r\n  [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n  [style.backgroundSize]=\"bgImage() && !bgRepeat() ? 'cover' : null\"\r\n  [style.backgroundPosition]=\"bgImage() && !bgRepeat() ? 'center' : null\"\r\n  [class.bg-no-repeat]=\"!bgRepeat()\"\r\n  [class.bg-repeat]=\"bgRepeat()\"\r\n>\r\n  <div class=\"flex gap-4 items-center\" [style.color]=\"textColor()\">\r\n    <div\r\n      class=\"flex gap-3 items-center h-full overflow-hidden transition-all duration-400 ease-in-out\"\r\n      [class.max-w-0]=\"!showBranding()\"\r\n      [class.opacity-0]=\"!showBranding()\"\r\n      [class.max-w-lg]=\"showBranding()\"\r\n      [class.opacity-100]=\"showBranding()\"\r\n    >\r\n      @if (logo()) {\r\n        <img\r\n          [src]=\"logo()\"\r\n          [alt]=\"'components.topbar.logoAlt' | transloco\"\r\n          class=\"h-10 shrink-0\"\r\n          [class]=\"logoClass()\"\r\n          [routerLink]=\"logoLink()\"\r\n          [class.cursor-pointer]=\"logoLink()\"\r\n        />\r\n      }\r\n      @if (logo() && (title() || subTitle())) {\r\n        <div class=\"h-3/4 w-[1px] bg-current shrink-0 opacity-30\"></div>\r\n      }\r\n      @if (title() || subTitle()) {\r\n        <div class=\"flex flex-col shrink-0\">\r\n          <h2\r\n            class=\"text-md font-semibold product-name whitespace-nowrap\"\r\n            [class]=\"titleClass()\"\r\n          >\r\n            {{ title() }}\r\n          </h2>\r\n          <span\r\n            class=\"text-sm product-tagline whitespace-nowrap\"\r\n            [class]=\"subTitleClass()\"\r\n            >{{ subTitle() }}</span\r\n          >\r\n        </div>\r\n      }\r\n    </div>\r\n    <ng-content select=\"[start]\"></ng-content>\r\n  </div>\r\n  <div class=\"flex gap-2 items-center\">\r\n    <ng-content select=\"[actions]\"></ng-content>\r\n  </div>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/masterteam-components-upload-field.mjs

@@ -7,7 +7,7 @@ import { Subscription, BehaviorSubject, of, finalize as finalize$1, catchError a
 import { HttpClient, HttpContext } from '@angular/common/http';
 import { Avatar } from '@masterteam/components/avatar';
 import * as i1 from '@jsverse/transloco';
-import { TranslocoModule } from '@jsverse/transloco';
+import { TranslocoModule, TranslocoService } from '@jsverse/transloco';
 import { Tooltip } from '@masterteam/components/tooltip';
 import { Icon } from '@masterteam/icons';
 import { Validators, NgControl } from '@angular/forms';
@@ -272,9 +272,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
         }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], imgPath: [{ type: i0.Input, args: [{ isSignal: true, alias: "imgPath", required: false }] }], context: [{ type: i0.Input, args: [{ isSignal: true, alias: "context", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], uploadProgress: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadProgress", required: false }] }], isDragging: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDragging", required: false }] }], onUploadInputClicked: [{ type: i0.Output, args: ["onUploadInputClicked"] }], ondDownloadFile: [{ type: i0.Output, args: ["ondDownloadFile"] }], onDeleteFile: [{ type: i0.Output, args: ["onDeleteFile"] }], onDragOver: [{ type: i0.Output, args: ["onDragOver"] }], onDragLeave: [{ type: i0.Output, args: ["onDragLeave"] }], onDrop: [{ type: i0.Output, args: ["onDrop"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], userImgClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "userImgClass", required: false }] }] } });
 
 class UploadField {
+    transloco = inject(TranslocoService);
     label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
-    title = input('Upload File', ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
-    description = input('Click or drop a file to upload', ...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
+    title = input(this.transloco.translate('components.uploadField.uploadFile'), ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    description = input(this.transloco.translate('components.uploadField.clickOrDrop'), ...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
     endPoint = input('uploader', ...(ngDevMode ? [{ debugName: "endPoint" }] : /* istanbul ignore next */ []));
     size = input(...(ngDevMode ? [undefined, { debugName: "size" }] : /* istanbul ignore next */ []));
     userImgClass = input('w-25! h-25! text-4xl! text-gray-400!', ...(ngDevMode ? [{ debugName: "userImgClass" }] : /* istanbul ignore next */ []));