@masterteam/properties 0.0.22 → 0.0.24

package/fesm2022/masterteam-properties.mjs

@@ -547,8 +547,8 @@ let PropertiesState = class PropertiesState {
             defaultViewType: action.viewType,
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PropertiesState, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PropertiesState });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PropertiesState, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PropertiesState });
 };
 __decorate([
     Action(GetProperties)
@@ -658,7 +658,7 @@ PropertiesState = __decorate([
         defaults: DEFAULT_STATE,
     })
 ], PropertiesState);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PropertiesState, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PropertiesState, decorators: [{
             type: Injectable
         }], propDecorators: { getAll: [], getOne: [], getLookups: [], getGroups: [], getConfigAsType: [], getCountries: [], testApiConfiguration: [], resetApiConfiguration: [], getPropertiesForConfigType: [], resetConfigProperties: [], resetConfigScopes: [], resetSelectedProperty: [], setModuleInfo: [], create: [], update: [], delete: [], SetPropertyTypes: [], setBreadcrumb: [], setDefaultViewType: [] } });
 
@@ -676,8 +676,8 @@ class PropertiesFacade {
     apiProperties = select(PropertiesState.apiProperties);
     breadcrumbItems = select(PropertiesState.breadcrumbItems);
     defaultViewType = select(PropertiesState.defaultViewType);
-    systemProperties = computed(() => this.list().filter((property) => Boolean(property.isSystem)), { ...(ngDevMode ? { debugName: "systemProperties" } : {}) });
-    customProperties = computed(() => this.list().filter((property) => !Boolean(property.isSystem)), { ...(ngDevMode ? { debugName: "customProperties" } : {}) });
+    systemProperties = computed(() => this.list().filter((property) => Boolean(property.isSystem)), ...(ngDevMode ? [{ debugName: "systemProperties" }] : []));
+    customProperties = computed(() => this.list().filter((property) => !Boolean(property.isSystem)), ...(ngDevMode ? [{ debugName: "customProperties" }] : []));
     isLoading(loadingName) {
         const loadingFactory = select(PropertiesState.isLoadingFactory);
         return computed(() => loadingFactory()(loadingName));
@@ -739,10 +739,10 @@ class PropertiesFacade {
     setDefaultViewType(viewType) {
         return this.store.dispatch(new SetDefaultViewType(viewType));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PropertiesFacade, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PropertiesFacade, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PropertiesFacade, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PropertiesFacade, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PropertiesFacade, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PropertiesFacade, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -764,7 +764,7 @@ class PropertiesList {
     route = inject(ActivatedRoute);
     transloco = inject(TranslocoService);
     defaultTab = 'all';
-    tab = input(undefined, { ...(ngDevMode ? { debugName: "tab" } : {}) });
+    tab = input(...(ngDevMode ? [undefined, { debugName: "tab" }] : []));
     tabs = signal([
         {
             label: this.transloco.translate('properties.list.tabAll'),
@@ -778,13 +778,13 @@ class PropertiesList {
             label: this.transloco.translate('properties.list.tabCustom'),
             value: 'custom',
         },
-    ], { ...(ngDevMode ? { debugName: "tabs" } : {}) });
+    ], ...(ngDevMode ? [{ debugName: "tabs" }] : []));
     activeTab = linkedSignal(() => {
         return this.tab() || this.defaultTab;
-    }, { ...(ngDevMode ? { debugName: "activeTab" } : {}) });
+    }, ...(ngDevMode ? [{ debugName: "activeTab" }] : []));
     tableColumns = signal([
         {
-            key: 'title',
+            key: 'name',
             label: this.transloco.translate('properties.list.columnName'),
         },
         {
@@ -796,7 +796,7 @@ class PropertiesList {
             label: this.transloco.translate('properties.list.columnRequired'),
             type: 'boolean',
         },
-    ], { ...(ngDevMode ? { debugName: "tableColumns" } : {}) });
+    ], ...(ngDevMode ? [{ debugName: "tableColumns" }] : []));
     propertyTypes = signal([
         {
             label: this.transloco.translate('properties.list.typeShortText'),
@@ -834,7 +834,7 @@ class PropertiesList {
             value: 'Lookup',
             color: 'lime',
         },
-    ], { ...(ngDevMode ? { debugName: "propertyTypes" } : {}) });
+    ], ...(ngDevMode ? [{ debugName: "propertyTypes" }] : []));
     tableActions = computed(() => {
         if (this.tableData().length === 0 || this.activeTab() === 'system') {
             return [];
@@ -849,8 +849,8 @@ class PropertiesList {
                 },
             },
         ];
-    }, { ...(ngDevMode ? { debugName: "tableActions" } : {}) });
-    deletingRowIds = signal([], { ...(ngDevMode ? { debugName: "deletingRowIds" } : {}) });
+    }, ...(ngDevMode ? [{ debugName: "tableActions" }] : []));
+    deletingRowIds = signal([], ...(ngDevMode ? [{ debugName: "deletingRowIds" }] : []));
     rowActions = signal([
         {
             icon: 'custom.pencil',
@@ -871,7 +871,7 @@ class PropertiesList {
             },
             loading: (row) => this.deletingRowIds().includes(row.id),
         },
-    ], { ...(ngDevMode ? { debugName: "rowActions" } : {}) });
+    ], ...(ngDevMode ? [{ debugName: "rowActions" }] : []));
     loading = this.facade.isLoading('getAll');
     tableData = computed(() => {
         const tab = this.activeTab();
@@ -885,7 +885,7 @@ class PropertiesList {
             default:
                 return allProperties;
         }
-    }, { ...(ngDevMode ? { debugName: "tableData" } : {}) });
+    }, ...(ngDevMode ? [{ debugName: "tableData" }] : []));
     breadcrumbItems = this.facade.breadcrumbItems;
     editRow(row) {
         if (!row?.id) {
@@ -933,10 +933,10 @@ class PropertiesList {
             queryParamsHandling: 'merge',
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PropertiesList, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: PropertiesList, isStandalone: true, selector: "mt-properties-list", inputs: { tab: { classPropertyName: "tab", publicName: "tab", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"space-y-3\">\n  <div class=\"flex items-center justify-between\">\n    <div class=\"space-y-1\">\n      <h1 class=\"text-xl font-semibold text-slate-900 tracking-tight\">\n        {{ \"properties.list.pageTitle\" | transloco }}\n      </h1>\n      <mt-breadcrumb\n        [items]=\"breadcrumbItems()\"\n        [styleClass]=\"'flex justify-center'\"\n      >\n      </mt-breadcrumb>\n    </div>\n  </div>\n  <mt-card paddingless>\n    <mt-table\n      [tabs]=\"tabs()\"\n      [(activeTab)]=\"activeTab\"\n      (onTabChange)=\"onTabChange($event)\"\n      [data]=\"tableData()\"\n      [actions]=\"tableActions()\"\n      [columns]=\"tableColumns()\"\n      [rowActions]=\"rowActions()\"\n      [generalSearch]=\"true\"\n      [loading]=\"loading()\"\n    >\n      <ng-template #empty>\n        <div headless class=\"flex-col justify-center items-center w-full p-5\">\n          <div\n            class=\"content flex flex-col gap-5 items-center text-center mb-5\"\n          >\n            <svg\n              width=\"152\"\n              height=\"120\"\n              viewBox=\"0 0 152 120\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <circle cx=\"76\" cy=\"52\" r=\"52\" fill=\"#E9EAEB\" />\n              <g filter=\"url(#filter0_ddd_2474_28277)\">\n                <path\n                  d=\"M77.6 16C66.8273 16 57.2978 21.3233 51.4987 29.4829C49.605 29.0363 47.6301 28.8 45.6 28.8C31.4615 28.8 20 40.2615 20 54.4C20 68.5385 31.4615 80 45.6 80L109.6 80C121.971 80 132 69.9712 132 57.6C132 45.2288 121.971 35.2 109.6 35.2C108.721 35.2 107.854 35.2506 107.002 35.349C102.098 23.9677 90.7797 16 77.6 16Z\"\n                  fill=\"#FAFAFA\"\n                />\n                <ellipse\n                  cx=\"45.6\"\n                  cy=\"54.3998\"\n                  rx=\"25.6\"\n                  ry=\"25.6\"\n                  fill=\"url(#paint0_linear_2474_28277)\"\n                />\n                <circle\n                  cx=\"77.6016\"\n                  cy=\"48\"\n                  r=\"32\"\n                  fill=\"url(#paint1_linear_2474_28277)\"\n                />\n                <ellipse\n                  cx=\"109.599\"\n                  cy=\"57.6002\"\n                  rx=\"22.4\"\n                  ry=\"22.4\"\n                  fill=\"url(#paint2_linear_2474_28277)\"\n                />\n              </g>\n              <circle cx=\"21\" cy=\"19\" r=\"5\" fill=\"#F5F5F5\" />\n              <circle cx=\"18\" cy=\"109\" r=\"7\" fill=\"#F5F5F5\" />\n              <circle cx=\"145\" cy=\"35\" r=\"7\" fill=\"#F5F5F5\" />\n              <circle cx=\"134\" cy=\"8\" r=\"4\" fill=\"#F5F5F5\" />\n              <foreignObject x=\"44\" y=\"54\" width=\"64\" height=\"64\">\n                <div\n                  xmlns=\"http://www.w3.org/1999/xhtml\"\n                  style=\"\n                    backdrop-filter: blur(4px);\n                    clip-path: url(#bgblur_0_2474_28277_clip_path);\n                    height: 100%;\n                    width: 100%;\n                  \"\n                ></div>\n              </foreignObject>\n              <g data-figma-bg-blur-radius=\"8\">\n                <path\n                  d=\"M52 86C52 72.7452 62.7452 62 76 62C89.2548 62 100 72.7452 100 86C100 99.2548 89.2548 110 76 110C62.7452 110 52 99.2548 52 86Z\"\n                  fill=\"#344054\"\n                  fill-opacity=\"0.4\"\n                />\n                <path\n                  d=\"M85 95L81.5001 91.5M84 85.5C84 90.1944 80.1944 94 75.5 94C70.8056 94 67 90.1944 67 85.5C67 80.8056 70.8056 77 75.5 77C80.1944 77 84 80.8056 84 85.5Z\"\n                  stroke=\"white\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                />\n              </g>\n              <defs>\n                <filter\n                  id=\"filter0_ddd_2474_28277\"\n                  x=\"0\"\n                  y=\"16\"\n                  width=\"152\"\n                  height=\"104\"\n                  filterUnits=\"userSpaceOnUse\"\n                  color-interpolation-filters=\"sRGB\"\n                >\n                  <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\n                  <feColorMatrix\n                    in=\"SourceAlpha\"\n                    type=\"matrix\"\n                    values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n                    result=\"hardAlpha\"\n                  />\n                  <feMorphology\n                    radius=\"1.5\"\n                    operator=\"erode\"\n                    in=\"SourceAlpha\"\n                    result=\"effect1_dropShadow_2474_28277\"\n                  />\n                  <feOffset dy=\"3\" />\n                  <feGaussianBlur stdDeviation=\"1.5\" />\n                  <feComposite in2=\"hardAlpha\" operator=\"out\" />\n                  <feColorMatrix\n                    type=\"matrix\"\n                    values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.04 0\"\n                  />\n                  <feBlend\n                    mode=\"normal\"\n                    in2=\"BackgroundImageFix\"\n                    result=\"effect1_dropShadow_2474_28277\"\n                  />\n                  <feColorMatrix\n                    in=\"SourceAlpha\"\n                    type=\"matrix\"\n                    values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n                    result=\"hardAlpha\"\n                  />\n                  <feMorphology\n                    radius=\"4\"\n                    operator=\"erode\"\n                    in=\"SourceAlpha\"\n                    result=\"effect2_dropShadow_2474_28277\"\n                  />\n                  <feOffset dy=\"8\" />\n                  <feGaussianBlur stdDeviation=\"4\" />\n                  <feComposite in2=\"hardAlpha\" operator=\"out\" />\n                  <feColorMatrix\n                    type=\"matrix\"\n                    values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.03 0\"\n                  />\n                  <feBlend\n                    mode=\"normal\"\n                    in2=\"effect1_dropShadow_2474_28277\"\n                    result=\"effect2_dropShadow_2474_28277\"\n                  />\n                  <feColorMatrix\n                    in=\"SourceAlpha\"\n                    type=\"matrix\"\n                    values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n                    result=\"hardAlpha\"\n                  />\n                  <feMorphology\n                    radius=\"4\"\n                    operator=\"erode\"\n                    in=\"SourceAlpha\"\n                    result=\"effect3_dropShadow_2474_28277\"\n                  />\n                  <feOffset dy=\"20\" />\n                  <feGaussianBlur stdDeviation=\"12\" />\n                  <feComposite in2=\"hardAlpha\" operator=\"out\" />\n                  <feColorMatrix\n                    type=\"matrix\"\n                    values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.08 0\"\n                  />\n                  <feBlend\n                    mode=\"normal\"\n                    in2=\"effect2_dropShadow_2474_28277\"\n                    result=\"effect3_dropShadow_2474_28277\"\n                  />\n                  <feBlend\n                    mode=\"normal\"\n                    in=\"SourceGraphic\"\n                    in2=\"effect3_dropShadow_2474_28277\"\n                    result=\"shape\"\n                  />\n                </filter>\n                <clipPath\n                  id=\"bgblur_0_2474_28277_clip_path\"\n                  transform=\"translate(-44 -54)\"\n                >\n                  <path\n                    d=\"M52 86C52 72.7452 62.7452 62 76 62C89.2548 62 100 72.7452 100 86C100 99.2548 89.2548 110 76 110C62.7452 110 52 99.2548 52 86Z\"\n                  />\n                </clipPath>\n                <linearGradient\n                  id=\"paint0_linear_2474_28277\"\n                  x1=\"25.9429\"\n                  y1=\"37.4855\"\n                  x2=\"71.2\"\n                  y2=\"79.9998\"\n                  gradientUnits=\"userSpaceOnUse\"\n                >\n                  <stop stop-color=\"#D0D5DD\" />\n                  <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n                </linearGradient>\n                <linearGradient\n                  id=\"paint1_linear_2474_28277\"\n                  x1=\"53.0301\"\n                  y1=\"26.8571\"\n                  x2=\"109.602\"\n                  y2=\"80\"\n                  gradientUnits=\"userSpaceOnUse\"\n                >\n                  <stop stop-color=\"#D0D5DD\" />\n                  <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n                </linearGradient>\n                <linearGradient\n                  id=\"paint2_linear_2474_28277\"\n                  x1=\"92.3992\"\n                  y1=\"42.8002\"\n                  x2=\"131.999\"\n                  y2=\"80.0002\"\n                  gradientUnits=\"userSpaceOnUse\"\n                >\n                  <stop stop-color=\"#D0D5DD\" />\n                  <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n                </linearGradient>\n              </defs>\n            </svg>\n\n            <div class=\"flex flex-col gap-1\">\n              <div class=\"text-md text-surface-600\">\n                {{ \"properties.list.emptyStateNoData\" | transloco }}\n              </div>\n            </div>\n            <div>\n              <mt-button\n                [label]=\"'properties.list.addNewProperty' | transloco\"\n                icon=\"general.plus\"\n                (click)=\"createProperty()\"\n              />\n            </div>\n          </div>\n          <p-divider type=\"solid\">\n            <div class=\"text-lg text-surface-600\">\n              {{ \"properties.list.emptyStateTemplate\" | transloco }}\n            </div>\n          </p-divider>\n          <div class=\"flex gap-3 mt-5 justify-center\">\n            @for (card of propertyTypes(); track card.label) {\n              <mt-card\n                headless\n                class=\"w-25 tailwind-4 cursor-pointer\"\n                style=\"background-color: #fafafa\"\n                (click)=\"createPropertyWithType(card.value)\"\n              >\n                <div\n                  class=\"content flex flex-col gap-3 items-center text-center\"\n                >\n                  <mt-avatar\n                    [style.--p-avatar-background]=\"\n                      'var(--p-' + card.color + '-100)'\n                    \"\n                    [style.--p-avatar-color]=\"'var(--p-' + card.color + '-600)'\"\n                    [icon]=\"card.icon\"\n                    shape=\"square\"\n                  ></mt-avatar>\n                  <div class=\"flex flex-col gap-1\">\n                    <div class=\"text-xs font-normal\">{{ card.label }}</div>\n                  </div>\n                </div>\n              </mt-card>\n            }\n          </div>\n        </div>\n      </ng-template>\n    </mt-table>\n  </mt-card>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Table, selector: "mt-table", inputs: ["data", "columns", "rowActions", "size", "showGridlines", "stripedRows", "selectableRows", "generalSearch", "showFilters", "loading", "updating", "tabs", "tabsOptionLabel", "tabsOptionValue", "activeTab", "actions", "paginatorPosition", "pageSize", "currentPage", "first", "filterTerm"], outputs: ["selectionChange", "cellChange", "activeTabChange", "onTabChange", "pageSizeChange", "currentPageChange", "firstChange", "filterTermChange"] }, { kind: "component", type: Breadcrumb, selector: "mt-breadcrumb", inputs: ["items", "styleClass"], outputs: ["onItemClick"] }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: Avatar, selector: "mt-avatar", inputs: ["label", "icon", "image", "styleClass", "size", "shape", "badge", "badgeSize", "badgeSeverity"], outputs: ["onImageError"] }, { kind: "component", type: Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1.TranslocoPipe, name: "transloco" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PropertiesList, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: PropertiesList, isStandalone: true, selector: "mt-properties-list", inputs: { tab: { classPropertyName: "tab", publicName: "tab", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"space-y-3\">\n  <div class=\"flex items-center justify-between\">\n    <div class=\"space-y-1\">\n      <h1 class=\"text-xl font-semibold text-slate-900 tracking-tight\">\n        {{ \"properties.list.pageTitle\" | transloco }}\n      </h1>\n      <mt-breadcrumb\n        [items]=\"breadcrumbItems()\"\n        [styleClass]=\"'flex justify-center'\"\n      >\n      </mt-breadcrumb>\n    </div>\n  </div>\n  <mt-card paddingless>\n    <mt-table\n      [tabs]=\"tabs()\"\n      [(activeTab)]=\"activeTab\"\n      (onTabChange)=\"onTabChange($event)\"\n      [data]=\"tableData()\"\n      [actions]=\"tableActions()\"\n      [columns]=\"tableColumns()\"\n      [rowActions]=\"rowActions()\"\n      [generalSearch]=\"true\"\n      [loading]=\"loading()\"\n    >\n      <ng-template #empty>\n        <div headless class=\"flex-col justify-center items-center w-full p-5\">\n          <div\n            class=\"content flex flex-col gap-5 items-center text-center mb-5\"\n          >\n            <svg\n              width=\"152\"\n              height=\"120\"\n              viewBox=\"0 0 152 120\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <circle cx=\"76\" cy=\"52\" r=\"52\" fill=\"#E9EAEB\" />\n              <g filter=\"url(#filter0_ddd_2474_28277)\">\n                <path\n                  d=\"M77.6 16C66.8273 16 57.2978 21.3233 51.4987 29.4829C49.605 29.0363 47.6301 28.8 45.6 28.8C31.4615 28.8 20 40.2615 20 54.4C20 68.5385 31.4615 80 45.6 80L109.6 80C121.971 80 132 69.9712 132 57.6C132 45.2288 121.971 35.2 109.6 35.2C108.721 35.2 107.854 35.2506 107.002 35.349C102.098 23.9677 90.7797 16 77.6 16Z\"\n                  fill=\"#FAFAFA\"\n                />\n                <ellipse\n                  cx=\"45.6\"\n                  cy=\"54.3998\"\n                  rx=\"25.6\"\n                  ry=\"25.6\"\n                  fill=\"url(#paint0_linear_2474_28277)\"\n                />\n                <circle\n                  cx=\"77.6016\"\n                  cy=\"48\"\n                  r=\"32\"\n                  fill=\"url(#paint1_linear_2474_28277)\"\n                />\n                <ellipse\n                  cx=\"109.599\"\n                  cy=\"57.6002\"\n                  rx=\"22.4\"\n                  ry=\"22.4\"\n                  fill=\"url(#paint2_linear_2474_28277)\"\n                />\n              </g>\n              <circle cx=\"21\" cy=\"19\" r=\"5\" fill=\"#F5F5F5\" />\n              <circle cx=\"18\" cy=\"109\" r=\"7\" fill=\"#F5F5F5\" />\n              <circle cx=\"145\" cy=\"35\" r=\"7\" fill=\"#F5F5F5\" />\n              <circle cx=\"134\" cy=\"8\" r=\"4\" fill=\"#F5F5F5\" />\n              <foreignObject x=\"44\" y=\"54\" width=\"64\" height=\"64\">\n                <div\n                  xmlns=\"http://www.w3.org/1999/xhtml\"\n                  style=\"\n                    backdrop-filter: blur(4px);\n                    clip-path: url(#bgblur_0_2474_28277_clip_path);\n                    height: 100%;\n                    width: 100%;\n                  \"\n                ></div>\n              </foreignObject>\n              <g data-figma-bg-blur-radius=\"8\">\n                <path\n                  d=\"M52 86C52 72.7452 62.7452 62 76 62C89.2548 62 100 72.7452 100 86C100 99.2548 89.2548 110 76 110C62.7452 110 52 99.2548 52 86Z\"\n                  fill=\"#344054\"\n                  fill-opacity=\"0.4\"\n                />\n                <path\n                  d=\"M85 95L81.5001 91.5M84 85.5C84 90.1944 80.1944 94 75.5 94C70.8056 94 67 90.1944 67 85.5C67 80.8056 70.8056 77 75.5 77C80.1944 77 84 80.8056 84 85.5Z\"\n                  stroke=\"white\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                />\n              </g>\n              <defs>\n                <filter\n                  id=\"filter0_ddd_2474_28277\"\n                  x=\"0\"\n                  y=\"16\"\n                  width=\"152\"\n                  height=\"104\"\n                  filterUnits=\"userSpaceOnUse\"\n                  color-interpolation-filters=\"sRGB\"\n                >\n                  <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\n                  <feColorMatrix\n                    in=\"SourceAlpha\"\n                    type=\"matrix\"\n                    values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n                    result=\"hardAlpha\"\n                  />\n                  <feMorphology\n                    radius=\"1.5\"\n                    operator=\"erode\"\n                    in=\"SourceAlpha\"\n                    result=\"effect1_dropShadow_2474_28277\"\n                  />\n                  <feOffset dy=\"3\" />\n                  <feGaussianBlur stdDeviation=\"1.5\" />\n                  <feComposite in2=\"hardAlpha\" operator=\"out\" />\n                  <feColorMatrix\n                    type=\"matrix\"\n                    values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.04 0\"\n                  />\n                  <feBlend\n                    mode=\"normal\"\n                    in2=\"BackgroundImageFix\"\n                    result=\"effect1_dropShadow_2474_28277\"\n                  />\n                  <feColorMatrix\n                    in=\"SourceAlpha\"\n                    type=\"matrix\"\n                    values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n                    result=\"hardAlpha\"\n                  />\n                  <feMorphology\n                    radius=\"4\"\n                    operator=\"erode\"\n                    in=\"SourceAlpha\"\n                    result=\"effect2_dropShadow_2474_28277\"\n                  />\n                  <feOffset dy=\"8\" />\n                  <feGaussianBlur stdDeviation=\"4\" />\n                  <feComposite in2=\"hardAlpha\" operator=\"out\" />\n                  <feColorMatrix\n                    type=\"matrix\"\n                    values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.03 0\"\n                  />\n                  <feBlend\n                    mode=\"normal\"\n                    in2=\"effect1_dropShadow_2474_28277\"\n                    result=\"effect2_dropShadow_2474_28277\"\n                  />\n                  <feColorMatrix\n                    in=\"SourceAlpha\"\n                    type=\"matrix\"\n                    values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n                    result=\"hardAlpha\"\n                  />\n                  <feMorphology\n                    radius=\"4\"\n                    operator=\"erode\"\n                    in=\"SourceAlpha\"\n                    result=\"effect3_dropShadow_2474_28277\"\n                  />\n                  <feOffset dy=\"20\" />\n                  <feGaussianBlur stdDeviation=\"12\" />\n                  <feComposite in2=\"hardAlpha\" operator=\"out\" />\n                  <feColorMatrix\n                    type=\"matrix\"\n                    values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.08 0\"\n                  />\n                  <feBlend\n                    mode=\"normal\"\n                    in2=\"effect2_dropShadow_2474_28277\"\n                    result=\"effect3_dropShadow_2474_28277\"\n                  />\n                  <feBlend\n                    mode=\"normal\"\n                    in=\"SourceGraphic\"\n                    in2=\"effect3_dropShadow_2474_28277\"\n                    result=\"shape\"\n                  />\n                </filter>\n                <clipPath\n                  id=\"bgblur_0_2474_28277_clip_path\"\n                  transform=\"translate(-44 -54)\"\n                >\n                  <path\n                    d=\"M52 86C52 72.7452 62.7452 62 76 62C89.2548 62 100 72.7452 100 86C100 99.2548 89.2548 110 76 110C62.7452 110 52 99.2548 52 86Z\"\n                  />\n                </clipPath>\n                <linearGradient\n                  id=\"paint0_linear_2474_28277\"\n                  x1=\"25.9429\"\n                  y1=\"37.4855\"\n                  x2=\"71.2\"\n                  y2=\"79.9998\"\n                  gradientUnits=\"userSpaceOnUse\"\n                >\n                  <stop stop-color=\"#D0D5DD\" />\n                  <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n                </linearGradient>\n                <linearGradient\n                  id=\"paint1_linear_2474_28277\"\n                  x1=\"53.0301\"\n                  y1=\"26.8571\"\n                  x2=\"109.602\"\n                  y2=\"80\"\n                  gradientUnits=\"userSpaceOnUse\"\n                >\n                  <stop stop-color=\"#D0D5DD\" />\n                  <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n                </linearGradient>\n                <linearGradient\n                  id=\"paint2_linear_2474_28277\"\n                  x1=\"92.3992\"\n                  y1=\"42.8002\"\n                  x2=\"131.999\"\n                  y2=\"80.0002\"\n                  gradientUnits=\"userSpaceOnUse\"\n                >\n                  <stop stop-color=\"#D0D5DD\" />\n                  <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n                </linearGradient>\n              </defs>\n            </svg>\n\n            <div class=\"flex flex-col gap-1\">\n              <div class=\"text-md text-surface-600\">\n                {{ \"properties.list.emptyStateNoData\" | transloco }}\n              </div>\n            </div>\n            <div>\n              <mt-button\n                [label]=\"'properties.list.addNewProperty' | transloco\"\n                icon=\"general.plus\"\n                (click)=\"createProperty()\"\n              />\n            </div>\n          </div>\n          <p-divider type=\"solid\">\n            <div class=\"text-lg text-surface-600\">\n              {{ \"properties.list.emptyStateTemplate\" | transloco }}\n            </div>\n          </p-divider>\n          <div class=\"flex gap-3 mt-5 justify-center\">\n            @for (card of propertyTypes(); track card.label) {\n              <mt-card\n                headless\n                class=\"w-25 tailwind-4 cursor-pointer\"\n                style=\"background-color: #fafafa\"\n                (click)=\"createPropertyWithType(card.value)\"\n              >\n                <div\n                  class=\"content flex flex-col gap-3 items-center text-center\"\n                >\n                  <mt-avatar\n                    [style.--p-avatar-background]=\"\n                      'var(--p-' + card.color + '-100)'\n                    \"\n                    [style.--p-avatar-color]=\"'var(--p-' + card.color + '-600)'\"\n                    [icon]=\"card.icon\"\n                    shape=\"square\"\n                  ></mt-avatar>\n                  <div class=\"flex flex-col gap-1\">\n                    <div class=\"text-xs font-normal\">{{ card.label }}</div>\n                  </div>\n                </div>\n              </mt-card>\n            }\n          </div>\n        </div>\n      </ng-template>\n    </mt-table>\n  </mt-card>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Table, selector: "mt-table", inputs: ["data", "columns", "rowActions", "size", "showGridlines", "stripedRows", "selectableRows", "generalSearch", "showFilters", "loading", "updating", "tabs", "tabsOptionLabel", "tabsOptionValue", "activeTab", "actions", "paginatorPosition", "pageSize", "currentPage", "first", "filterTerm"], outputs: ["selectionChange", "cellChange", "activeTabChange", "onTabChange", "pageSizeChange", "currentPageChange", "firstChange", "filterTermChange"] }, { kind: "component", type: Breadcrumb, selector: "mt-breadcrumb", inputs: ["items", "styleClass"], outputs: ["onItemClick"] }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: Avatar, selector: "mt-avatar", inputs: ["label", "icon", "image", "styleClass", "size", "shape", "badge", "badgeSize", "badgeSeverity"], outputs: ["onImageError"] }, { kind: "component", type: Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1.TranslocoPipe, name: "transloco" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PropertiesList, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PropertiesList, decorators: [{
             type: Component,
             args: [{ selector: 'mt-properties-list', standalone: true, imports: [
                         CommonModule,
@@ -954,12 +954,12 @@ class ApiConfiguration {
     facade = inject(PropertiesFacade);
     destroyRef = inject(DestroyRef);
     transloco = inject(TranslocoService);
-    schema = signal(null, { ...(ngDevMode ? { debugName: "schema" } : {}) });
+    schema = signal(null, ...(ngDevMode ? [{ debugName: "schema" }] : []));
     isWriting = false;
     touched = false;
     isTesting = this.facade.isLoading('testApiConfiguration');
     apiProperties = this.facade.apiProperties;
-    hasDetectedSchema = computed(() => this.apiProperties().length > 0, { ...(ngDevMode ? { debugName: "hasDetectedSchema" } : {}) });
+    hasDetectedSchema = computed(() => this.apiProperties().length > 0, ...(ngDevMode ? [{ debugName: "hasDetectedSchema" }] : []));
     form = new FormGroup({
         endpoint: new FormControl('', {
             nonNullable: true,
@@ -1102,16 +1102,16 @@ class ApiConfiguration {
             return acc;
         }, {});
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ApiConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: ApiConfiguration, isStandalone: true, selector: "mt-api-configuration", providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: ApiConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: ApiConfiguration, isStandalone: true, selector: "mt-api-configuration", providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ApiConfiguration),
                 multi: true,
             },
-        ], ngImport: i0, template: "<div [formGroup]=\"form\" class=\"space-y-6\">\n  <div class=\"space-y-4 rounded-xl bg-content px-6 py-4 shadow-sm\">\n    <div class=\"grid items-end gap-3 md:grid-cols-[minmax(0,1fr)_auto]\">\n      <mt-text-field\n        formControlName=\"endpoint\"\n        [label]=\"'properties.form.endpoint' | transloco\"\n        [placeholder]=\"'properties.form.endpointPlaceholder' | transloco\"\n      />\n      <div class=\"flex justify-end gap-2\">\n        <mt-button\n          type=\"button\"\n          [text]=\"true\"\n          icon=\"general.plus\"\n          [label]=\"'properties.form.addHeader' | transloco\"\n          (click)=\"addHeader()\"\n        />\n        <mt-button\n          type=\"button\"\n          [label]=\"'properties.form.testApi' | transloco\"\n          [loading]=\"isTesting()\"\n          (click)=\"testApi()\"\n        />\n      </div>\n    </div>\n\n    @if (headers.controls.length) {\n      <div class=\"space-y-3\">\n        <div class=\"text-sm font-medium text-surface-500\">\n          {{ \"properties.form.headers\" | transloco }}\n        </div>\n        <div class=\"space-y-3\">\n          @for (\n            headerCtrl of headers.controls;\n            track headerCtrl;\n            let i = $index\n          ) {\n            <div\n              [formGroup]=\"headerCtrl\"\n              class=\"grid items-end gap-3 md:grid-cols-[minmax(0,1fr)_minmax(0,1fr)_auto]\"\n            >\n              <mt-text-field\n                formControlName=\"key\"\n                [label]=\"'properties.form.headerKey' | transloco\"\n              />\n              <mt-text-field\n                formControlName=\"value\"\n                [label]=\"'properties.form.headerValue' | transloco\"\n              />\n              <mt-button\n                type=\"button\"\n                [text]=\"true\"\n                icon=\"general.trash-01\"\n                (click)=\"removeHeader(i)\"\n              />\n            </div>\n          }\n        </div>\n      </div>\n    } @else {\n      <p class=\"text-xs text-surface-400\">\n        {{ \"properties.form.noHeadersMessage\" | transloco }}\n      </p>\n    }\n  </div>\n\n  <div class=\"space-y-4 rounded-xl bg-content px-6 py-4 shadow-sm\">\n    @if (hasDetectedSchema()) {\n      <div class=\"grid gap-4 md:grid-cols-2\">\n        <mt-select-field\n          formControlName=\"key\"\n          [options]=\"apiProperties()\"\n          [showClear]=\"true\"\n          optionLabel=\"name\"\n          optionValue=\"key\"\n          [label]=\"'properties.form.keyField' | transloco\"\n        />\n        <mt-select-field\n          formControlName=\"value\"\n          [options]=\"apiProperties()\"\n          [showClear]=\"true\"\n          optionLabel=\"name\"\n          optionValue=\"key\"\n          [label]=\"'properties.form.valueField' | transloco\"\n        />\n      </div>\n    } @else {\n      <p class=\"text-xs text-surface-400\">\n        {{ \"properties.form.messageTestApiPrompt\" | transloco }}\n      </p>\n    }\n\n    <div class=\"flex items-center justify-between gap-4\">\n      <mt-toggle-field\n        formControlName=\"supportMultiSelect\"\n        [label]=\"'properties.form.labelSupportMultiSelect' | transloco\"\n      />\n      @if (isTesting()) {\n        <span class=\"text-xs text-surface-400\">\n          {{ \"properties.form.messageTesting\" | transloco }}\n        </span>\n      }\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: TextField, selector: "mt-text-field", inputs: ["field", "hint", "label", "placeholder", "class", "type", "readonly", "pInputs", "required", "icon", "iconPosition"] }, { kind: "component", type: SelectField, selector: "mt-select-field", inputs: ["field", "label", "placeholder", "hasPlaceholderPrefix", "class", "readonly", "pInputs", "options", "optionValue", "optionLabel", "filter", "filterBy", "dataKey", "showClear", "clearAfterSelect", "required"], outputs: ["onChange"] }, { kind: "component", type: ToggleField, selector: "mt-toggle-field", inputs: ["label", "labelPosition", "placeholder", "readonly", "pInputs", "required"], outputs: ["onChange"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], ngImport: i0, template: "<div [formGroup]=\"form\" class=\"space-y-6\">\n  <div class=\"space-y-4 rounded-xl bg-content px-6 py-4 shadow-sm\">\n    <div class=\"grid items-end gap-3 md:grid-cols-[minmax(0,1fr)_auto]\">\n      <mt-text-field\n        formControlName=\"endpoint\"\n        [label]=\"'properties.form.endpoint' | transloco\"\n        [placeholder]=\"'properties.form.endpointPlaceholder' | transloco\"\n      />\n      <div class=\"flex justify-end gap-2\">\n        <mt-button\n          type=\"button\"\n          [text]=\"true\"\n          icon=\"general.plus\"\n          [label]=\"'properties.form.addHeader' | transloco\"\n          (click)=\"addHeader()\"\n        />\n        <mt-button\n          type=\"button\"\n          [label]=\"'properties.form.testApi' | transloco\"\n          [loading]=\"isTesting()\"\n          (click)=\"testApi()\"\n        />\n      </div>\n    </div>\n\n    @if (headers.controls.length) {\n      <div class=\"space-y-3\">\n        <div class=\"text-sm font-medium text-surface-500\">\n          {{ \"properties.form.headers\" | transloco }}\n        </div>\n        <div class=\"space-y-3\">\n          @for (\n            headerCtrl of headers.controls;\n            track headerCtrl;\n            let i = $index\n          ) {\n            <div\n              [formGroup]=\"headerCtrl\"\n              class=\"grid items-end gap-3 md:grid-cols-[minmax(0,1fr)_minmax(0,1fr)_auto]\"\n            >\n              <mt-text-field\n                formControlName=\"key\"\n                [label]=\"'properties.form.headerKey' | transloco\"\n              />\n              <mt-text-field\n                formControlName=\"value\"\n                [label]=\"'properties.form.headerValue' | transloco\"\n              />\n              <mt-button\n                type=\"button\"\n                [text]=\"true\"\n                icon=\"general.trash-01\"\n                (click)=\"removeHeader(i)\"\n              />\n            </div>\n          }\n        </div>\n      </div>\n    } @else {\n      <p class=\"text-xs text-surface-400\">\n        {{ \"properties.form.noHeadersMessage\" | transloco }}\n      </p>\n    }\n  </div>\n\n  <div class=\"space-y-4 rounded-xl bg-content px-6 py-4 shadow-sm\">\n    @if (hasDetectedSchema()) {\n      <div class=\"grid gap-4 md:grid-cols-2\">\n        <mt-select-field\n          formControlName=\"key\"\n          [options]=\"apiProperties()\"\n          [showClear]=\"true\"\n          optionLabel=\"name\"\n          optionValue=\"key\"\n          [label]=\"'properties.form.keyField' | transloco\"\n        />\n        <mt-select-field\n          formControlName=\"value\"\n          [options]=\"apiProperties()\"\n          [showClear]=\"true\"\n          optionLabel=\"name\"\n          optionValue=\"key\"\n          [label]=\"'properties.form.valueField' | transloco\"\n        />\n      </div>\n    } @else {\n      <p class=\"text-xs text-surface-400\">\n        {{ \"properties.form.messageTestApiPrompt\" | transloco }}\n      </p>\n    }\n\n    <div class=\"flex items-center justify-between gap-4\">\n      <mt-toggle-field\n        formControlName=\"supportMultiSelect\"\n        [label]=\"'properties.form.labelSupportMultiSelect' | transloco\"\n      />\n      @if (isTesting()) {\n        <span class=\"text-xs text-surface-400\">\n          {{ \"properties.form.messageTesting\" | transloco }}\n        </span>\n      }\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: TextField, selector: "mt-text-field", inputs: ["field", "hint", "label", "placeholder", "class", "type", "readonly", "pInputs", "required", "icon", "iconPosition"] }, { kind: "component", type: SelectField, selector: "mt-select-field", inputs: ["field", "label", "placeholder", "hasPlaceholderPrefix", "class", "readonly", "pInputs", "options", "optionValue", "optionLabel", "filter", "filterBy", "dataKey", "showClear", "clearAfterSelect", "required", "group", "optionGroupLabel", "optionGroupChildren", "loading"], outputs: ["onChange"] }, { kind: "component", type: ToggleField, selector: "mt-toggle-field", inputs: ["label", "labelPosition", "placeholder", "readonly", "pInputs", "required"], outputs: ["onChange"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ApiConfiguration, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: ApiConfiguration, decorators: [{
             type: Component,
             args: [{ selector: 'mt-api-configuration', standalone: true, imports: [
                         CommonModule,
@@ -1142,7 +1142,7 @@ class CheckListFormConfiguration {
     scopeItems = computed(() => {
         const scope = this.configScopes()[0];
         return scope?.items ?? [];
-    }, { ...(ngDevMode ? { debugName: "scopeItems" } : {}) });
+    }, ...(ngDevMode ? [{ debugName: "scopeItems" }] : []));
     formConfig = linkedSignal(() => ({
         sections: [
             {
@@ -1158,7 +1158,7 @@ class CheckListFormConfiguration {
                         key: 'lookup',
                         type: 'select',
                         label: this.transloco.translate('properties.form.selectLookup'),
-                        optionLabel: 'title',
+                        optionLabel: 'name',
                         optionValue: 'id',
                         filter: true,
                         options: this.lookups(),
@@ -1167,7 +1167,7 @@ class CheckListFormConfiguration {
                         key: 'scopeId',
                         type: 'select',
                         label: this.transloco.translate('properties.form.selectScope'),
-                        optionLabel: 'title',
+                        optionLabel: 'name',
                         optionValue: 'id',
                         options: this.scopeItems(),
                         filter: true,
@@ -1176,7 +1176,7 @@ class CheckListFormConfiguration {
                         key: 'properties',
                         cssClass: 'md:col-span-2',
                         options: this.configProperties(),
-                        optionLabel: 'title',
+                        optionLabel: 'name',
                         optionValue: 'key',
                         sourceHeader: this.transloco.translate('properties.form.availableProperties'),
                         targetHeader: this.transloco.translate('properties.form.selectedProperties'),
@@ -1184,7 +1184,7 @@ class CheckListFormConfiguration {
                 ],
             },
         ],
-    }), { ...(ngDevMode ? { debugName: "formConfig" } : {}) });
+    }), ...(ngDevMode ? [{ debugName: "formConfig" }] : []));
     constructor() {
         effect(() => {
             if (!this.lookups().length) {
@@ -1204,12 +1204,12 @@ class CheckListFormConfiguration {
     ngOnDestroy() {
         this.propertiesFacade.resetConfigProperties();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: CheckListFormConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: CheckListFormConfiguration, isStandalone: true, selector: "mt-check-list-form-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: CheckListFormConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", type: CheckListFormConfiguration, isStandalone: true, selector: "mt-check-list-form-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
             { provide: ControlContainer, useExisting: FormGroupDirective },
         ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: CheckListFormConfiguration, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: CheckListFormConfiguration, decorators: [{
             type: Component,
             args: [{ selector: 'mt-check-list-form-configuration', imports: [DynamicForm, ReactiveFormsModule], viewProviders: [
                         { provide: ControlContainer, useExisting: FormGroupDirective },
@@ -1227,7 +1227,7 @@ class DynamicListConfiguration {
     scopeItems = computed(() => {
         const scope = this.configScopes()[0];
         return scope?.items ?? [];
-    }, { ...(ngDevMode ? { debugName: "scopeItems" } : {}) });
+    }, ...(ngDevMode ? [{ debugName: "scopeItems" }] : []));
     formConfig = linkedSignal(() => ({
         sections: [
             {
@@ -1243,7 +1243,7 @@ class DynamicListConfiguration {
                         key: 'scopeId',
                         type: 'select',
                         label: this.transloco.translate('properties.form.selectScope'),
-                        optionLabel: 'title',
+                        optionLabel: 'name',
                         optionValue: 'id',
                         filter: true,
                         options: this.scopeItems(),
@@ -1252,7 +1252,7 @@ class DynamicListConfiguration {
                         key: 'properties',
                         cssClass: 'md:col-span-2',
                         options: this.configProperties(),
-                        optionLabel: 'title',
+                        optionLabel: 'name',
                         optionValue: 'key',
                         sourceHeader: this.transloco.translate('properties.form.availableProperties'),
                         targetHeader: this.transloco.translate('properties.form.selectedProperties'),
@@ -1266,7 +1266,7 @@ class DynamicListConfiguration {
                 ],
             },
         ],
-    }), { ...(ngDevMode ? { debugName: "formConfig" } : {}) });
+    }), ...(ngDevMode ? [{ debugName: "formConfig" }] : []));
     constructor() {
         effect(() => {
             const scopeId = this.configuration()?.scopeId;
@@ -1281,12 +1281,12 @@ class DynamicListConfiguration {
     ngOnDestroy() {
         this.propertiesFacade.resetConfigProperties();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DynamicListConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: DynamicListConfiguration, isStandalone: true, selector: "mt-dynamic-list-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: DynamicListConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", type: DynamicListConfiguration, isStandalone: true, selector: "mt-dynamic-list-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
             { provide: ControlContainer, useExisting: FormGroupDirective },
         ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DynamicListConfiguration, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: DynamicListConfiguration, decorators: [{
             type: Component,
             args: [{ selector: 'mt-dynamic-list-configuration', imports: [DynamicForm, ReactiveFormsModule], viewProviders: [
                         { provide: ControlContainer, useExisting: FormGroupDirective },
@@ -1304,7 +1304,7 @@ class EditableListViewConfiguration {
     scopeItems = computed(() => {
         const scope = this.configScopes()[0];
         return scope?.items ?? [];
-    }, { ...(ngDevMode ? { debugName: "scopeItems" } : {}) });
+    }, ...(ngDevMode ? [{ debugName: "scopeItems" }] : []));
     formConfig = linkedSignal(() => ({
         sections: [
             {
@@ -1320,7 +1320,7 @@ class EditableListViewConfiguration {
                         key: 'scopeId',
                         type: 'select',
                         label: this.transloco.translate('properties.form.selectScope'),
-                        optionLabel: 'title',
+                        optionLabel: 'name',
                         optionValue: 'id',
                         options: this.scopeItems(),
                     },
@@ -1328,7 +1328,7 @@ class EditableListViewConfiguration {
                         key: 'Properties',
                         cssClass: 'md:col-span-2',
                         options: this.configProperties(),
-                        optionLabel: 'title',
+                        optionLabel: 'name',
                         optionValue: 'key',
                         sourceHeader: this.transloco.translate('properties.form.availableProperties'),
                         targetHeader: this.transloco.translate('properties.form.selectedProperties'),
@@ -1346,7 +1346,7 @@ class EditableListViewConfiguration {
                 ],
             },
         ],
-    }), { ...(ngDevMode ? { debugName: "formConfig" } : {}) });
+    }), ...(ngDevMode ? [{ debugName: "formConfig" }] : []));
     constructor() {
         effect(() => {
             const scopeId = this.configuration()?.scopeId;
@@ -1361,12 +1361,12 @@ class EditableListViewConfiguration {
     ngOnDestroy() {
         this.propertiesFacade.resetConfigProperties();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: EditableListViewConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: EditableListViewConfiguration, isStandalone: true, selector: "mt-editable-list-view-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: EditableListViewConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", type: EditableListViewConfiguration, isStandalone: true, selector: "mt-editable-list-view-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
             { provide: ControlContainer, useExisting: FormGroupDirective },
         ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: EditableListViewConfiguration, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: EditableListViewConfiguration, decorators: [{
             type: Component,
             args: [{ selector: 'mt-editable-list-view-configuration', imports: [DynamicForm, ReactiveFormsModule], viewProviders: [
                         { provide: ControlContainer, useExisting: FormGroupDirective },
@@ -1384,14 +1384,14 @@ class InternalModuleConfiguration {
     configProperties = this.propertiesFacade.configProperties;
     configScopes = this.propertiesFacade.configScopes;
     configuration = toSignal(this.parentGroup.valueChanges.pipe(startWith(this.parentGroup.value), map((v) => v?.configuration), distinctUntilChanged()), { initialValue: this.parentGroup.value?.configuration });
-    PrevModuleId = signal(null, { ...(ngDevMode ? { debugName: "PrevModuleId" } : {}) });
+    PrevModuleId = signal(null, ...(ngDevMode ? [{ debugName: "PrevModuleId" }] : []));
     scopeItems = computed(() => {
         const selectedType = this.configuration()?.type;
         if (!selectedType)
             return [];
         const scope = this.configScopes().find((s) => s.scope === selectedType);
         return scope?.items ?? [];
-    }, { ...(ngDevMode ? { debugName: "scopeItems" } : {}) });
+    }, ...(ngDevMode ? [{ debugName: "scopeItems" }] : []));
     formConfig = linkedSignal(() => ({
         sections: [
             {
@@ -1415,7 +1415,7 @@ class InternalModuleConfiguration {
                         key: 'scopeId',
                         type: 'select',
                         label: this.transloco.translate('properties.form.selectScope'),
-                        optionLabel: 'title',
+                        optionLabel: 'name',
                         optionValue: 'id',
                         filter: true,
                         options: this.scopeItems(),
@@ -1424,7 +1424,7 @@ class InternalModuleConfiguration {
                         type: 'select',
                         key: 'property',
                         label: this.transloco.translate('properties.form.valueProperty'),
-                        optionLabel: 'title',
+                        optionLabel: 'name',
                         optionValue: 'key',
                         options: this.configProperties(),
                     },
@@ -1432,7 +1432,7 @@ class InternalModuleConfiguration {
                         cssClass: 'md:col-span-2 mt-2',
                         key: 'propertyDetails',
                         options: this.configProperties(),
-                        optionLabel: 'title',
+                        optionLabel: 'name',
                         optionValue: 'key',
                         sourceHeader: this.transloco.translate('properties.form.availableProperties'),
                         targetHeader: this.transloco.translate('properties.form.selectedProperties'),
@@ -1446,7 +1446,7 @@ class InternalModuleConfiguration {
                 ],
             },
         ],
-    }), { ...(ngDevMode ? { debugName: "formConfig" } : {}) });
+    }), ...(ngDevMode ? [{ debugName: "formConfig" }] : []));
     constructor() {
         effect(() => {
             if (this.configuration()?.scopeId) {
@@ -1465,12 +1465,12 @@ class InternalModuleConfiguration {
     ngOnDestroy() {
         this.propertiesFacade.resetConfigProperties();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: InternalModuleConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: InternalModuleConfiguration, isStandalone: true, selector: "mt-internal-module-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: InternalModuleConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", type: InternalModuleConfiguration, isStandalone: true, selector: "mt-internal-module-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
             { provide: ControlContainer, useExisting: FormGroupDirective },
         ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: InternalModuleConfiguration, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: InternalModuleConfiguration, decorators: [{
             type: Component,
             args: [{ selector: 'mt-internal-module-configuration', imports: [DynamicForm, ReactiveFormsModule], viewProviders: [
                         { provide: ControlContainer, useExisting: FormGroupDirective },
@@ -1504,7 +1504,7 @@ class LocationConfiguration {
                 ],
             },
         ],
-    }), { ...(ngDevMode ? { debugName: "formConfig" } : {}) });
+    }), ...(ngDevMode ? [{ debugName: "formConfig" }] : []));
     constructor() {
         effect(() => {
             if (!this.countries().length) {
@@ -1512,12 +1512,12 @@ class LocationConfiguration {
             }
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: LocationConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: LocationConfiguration, isStandalone: true, selector: "mt-location-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: LocationConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", type: LocationConfiguration, isStandalone: true, selector: "mt-location-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
             { provide: ControlContainer, useExisting: FormGroupDirective },
         ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: LocationConfiguration, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: LocationConfiguration, decorators: [{
             type: Component,
             args: [{ selector: 'mt-location-configuration', imports: [DynamicForm, ReactiveFormsModule], viewProviders: [
                         { provide: ControlContainer, useExisting: FormGroupDirective },
@@ -1543,7 +1543,7 @@ class LookupConfiguration {
                         key: 'lookup',
                         type: 'select',
                         label: this.transloco.translate('properties.form.selectLookup'),
-                        optionLabel: 'title',
+                        optionLabel: 'name',
                         optionValue: 'id',
                         options: this.lookups(),
                         filter: true,
@@ -1551,7 +1551,7 @@ class LookupConfiguration {
                 ],
             },
         ],
-    }), { ...(ngDevMode ? { debugName: "formConfig" } : {}) });
+    }), ...(ngDevMode ? [{ debugName: "formConfig" }] : []));
     constructor() {
         effect(() => {
             if (!this.lookups().length) {
@@ -1559,12 +1559,12 @@ class LookupConfiguration {
             }
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: LookupConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: LookupConfiguration, isStandalone: true, selector: "mt-lookup-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: LookupConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", type: LookupConfiguration, isStandalone: true, selector: "mt-lookup-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
             { provide: ControlContainer, useExisting: FormGroupDirective },
         ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: LookupConfiguration, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: LookupConfiguration, decorators: [{
             type: Component,
             args: [{ selector: 'mt-lookup-configuration', imports: [DynamicForm, ReactiveFormsModule], viewProviders: [
                         { provide: ControlContainer, useExisting: FormGroupDirective },
@@ -1592,13 +1592,13 @@ class PercentageConfiguration {
                 ],
             },
         ],
-    }, { ...(ngDevMode ? { debugName: "formConfig" } : {}) });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PercentageConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: PercentageConfiguration, isStandalone: true, selector: "mt-percentage-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
+    }, ...(ngDevMode ? [{ debugName: "formConfig" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PercentageConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", type: PercentageConfiguration, isStandalone: true, selector: "mt-percentage-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
             { provide: ControlContainer, useExisting: FormGroupDirective },
         ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PercentageConfiguration, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PercentageConfiguration, decorators: [{
             type: Component,
             args: [{ selector: 'mt-percentage-configuration', imports: [DynamicForm, ReactiveFormsModule], viewProviders: [
                         { provide: ControlContainer, useExisting: FormGroupDirective },
@@ -1624,7 +1624,7 @@ class UserConfiguration {
                         key: 'group',
                         type: 'select',
                         label: this.transloco.translate('properties.form.selectGroup'),
-                        optionLabel: 'title',
+                        optionLabel: 'name',
                         optionValue: 'id',
                         options: this.groups(),
                         filter: true,
@@ -1632,7 +1632,7 @@ class UserConfiguration {
                 ],
             },
         ],
-    }), { ...(ngDevMode ? { debugName: "formConfig" } : {}) });
+    }), ...(ngDevMode ? [{ debugName: "formConfig" }] : []));
     constructor() {
         effect(() => {
             if (!this.groups().length) {
@@ -1640,12 +1640,12 @@ class UserConfiguration {
             }
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UserConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: UserConfiguration, isStandalone: true, selector: "mt-user-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: UserConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", type: UserConfiguration, isStandalone: true, selector: "mt-user-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
             { provide: ControlContainer, useExisting: FormGroupDirective },
         ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UserConfiguration, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: UserConfiguration, decorators: [{
             type: Component,
             args: [{ selector: 'mt-user-configuration', imports: [DynamicForm, ReactiveFormsModule], viewProviders: [
                         { provide: ControlContainer, useExisting: FormGroupDirective },
@@ -1792,13 +1792,13 @@ class AttachmentConfiguration {
                 ],
             },
         ],
-    }, { ...(ngDevMode ? { debugName: "formConfig" } : {}) });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: AttachmentConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: AttachmentConfiguration, isStandalone: true, selector: "mt-attachment-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
+    }, ...(ngDevMode ? [{ debugName: "formConfig" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: AttachmentConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", type: AttachmentConfiguration, isStandalone: true, selector: "mt-attachment-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
             { provide: ControlContainer, useExisting: FormGroupDirective },
         ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: AttachmentConfiguration, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: AttachmentConfiguration, decorators: [{
             type: Component,
             args: [{ selector: 'mt-attachment-configuration', imports: [DynamicForm, ReactiveFormsModule], viewProviders: [
                         { provide: ControlContainer, useExisting: FormGroupDirective },
@@ -1810,12 +1810,12 @@ class PropertyForm {
     router = inject(Router);
     route = inject(ActivatedRoute);
     transloco = inject(TranslocoService);
-    propertyId = input('', { ...(ngDevMode ? { debugName: "propertyId" } : {}) });
+    propertyId = input('', ...(ngDevMode ? [{ debugName: "propertyId" }] : []));
     propertyTypes = this.facade.propertyTypes;
     submitLabel = computed(() => this.propertyId()
         ? this.transloco.translate('properties.form.updateButton')
-        : this.transloco.translate('properties.form.createButton'), { ...(ngDevMode ? { debugName: "submitLabel" } : {}) });
-    isEditing = computed(() => !!this.propertyId(), { ...(ngDevMode ? { debugName: "isEditing" } : {}) });
+        : this.transloco.translate('properties.form.createButton'), ...(ngDevMode ? [{ debugName: "submitLabel" }] : []));
+    isEditing = computed(() => !!this.propertyId(), ...(ngDevMode ? [{ debugName: "isEditing" }] : []));
     // Keep your original structure: "main" is a FormControl<any>, "configuration" is FormControl<any|null>
     propertyForm = new FormGroup({
         main: new FormControl({
@@ -1831,7 +1831,7 @@ class PropertyForm {
     creating = this.facade.isLoading('create');
     updating = this.facade.isLoading('update');
     loading = this.facade.isLoading('getOne');
-    submitting = computed(() => this.creating() || this.updating(), { ...(ngDevMode ? { debugName: "submitting" } : {}) });
+    submitting = computed(() => this.creating() || this.updating(), ...(ngDevMode ? [{ debugName: "submitting" }] : []));
     propertyType = toSignal(this.mainControl.valueChanges.pipe(map((v) => v?.viewType), distinctUntilChanged()));
     selectedPropertyTypeConfiguration = computed(() => {
         const propertyTypesSetting = this.propertyTypes();
@@ -1840,19 +1840,19 @@ class PropertyForm {
             return null;
         const match = propertyTypesSetting.value.find((item) => item.viewType?.toLowerCase() === selectedViewType.toLowerCase());
         return match?.configuration ?? null;
-    }, { ...(ngDevMode ? { debugName: "selectedPropertyTypeConfiguration" } : {}) });
-    configurationFormConfig = computed(() => this.selectedPropertyTypeConfiguration()?.configurationForm ?? null, { ...(ngDevMode ? { debugName: "configurationFormConfig" } : {}) });
+    }, ...(ngDevMode ? [{ debugName: "selectedPropertyTypeConfiguration" }] : []));
+    configurationFormConfig = computed(() => this.selectedPropertyTypeConfiguration()?.configurationForm ?? null, ...(ngDevMode ? [{ debugName: "configurationFormConfig" }] : []));
     configurationHost;
     environmentInjector = inject(EnvironmentInjector);
-    configurationComponentType = signal(null, { ...(ngDevMode ? { debugName: "configurationComponentType" } : {}) });
+    configurationComponentType = signal(null, ...(ngDevMode ? [{ debugName: "configurationComponentType" }] : []));
     configurationComponentRef = null;
     configurationComponentLoadId = 0;
-    externalConfigurationForm = signal(null, { ...(ngDevMode ? { debugName: "externalConfigurationForm" } : {}) });
+    externalConfigurationForm = signal(null, ...(ngDevMode ? [{ debugName: "externalConfigurationForm" }] : []));
     externalConfigurationSubscriptions = null;
-    externalConfigurationInvalid = signal(false, { ...(ngDevMode ? { debugName: "externalConfigurationInvalid" } : {}) });
-    configurationComponentExists = computed(() => !!this.configurationComponentType(), { ...(ngDevMode ? { debugName: "configurationComponentExists" } : {}) });
-    configurationFormInvalid = computed(() => this.externalConfigurationInvalid(), { ...(ngDevMode ? { debugName: "configurationFormInvalid" } : {}) });
-    submitDisabled = computed(() => this.submitting() || this.configurationFormInvalid(), { ...(ngDevMode ? { debugName: "submitDisabled" } : {}) });
+    externalConfigurationInvalid = signal(false, ...(ngDevMode ? [{ debugName: "externalConfigurationInvalid" }] : []));
+    configurationComponentExists = computed(() => !!this.configurationComponentType(), ...(ngDevMode ? [{ debugName: "configurationComponentExists" }] : []));
+    configurationFormInvalid = computed(() => this.externalConfigurationInvalid(), ...(ngDevMode ? [{ debugName: "configurationFormInvalid" }] : []));
+    submitDisabled = computed(() => this.submitting() || this.configurationFormInvalid(), ...(ngDevMode ? [{ debugName: "submitDisabled" }] : []));
     // Your existing dynamic form config unchanged
     dynamicFormConfigMain = linkedSignal(() => ({
         layout: {
@@ -1945,13 +1945,13 @@ class PropertyForm {
                 bodyClass: 'grid grid-cols-1 md:grid-cols-2 gap-3',
                 fields: [
                     {
-                        key: 'title.en',
+                        key: 'name.en',
                         label: this.transloco.translate('properties.form.englishName'),
                         placeholder: this.transloco.translate('properties.form.enterEnglishName'),
                         validators: [new ValidatorConfig({ type: 'required' })],
                     },
                     {
-                        key: 'title.ar',
+                        key: 'name.ar',
                         label: this.transloco.translate('properties.form.arabicName'),
                         placeholder: this.transloco.translate('properties.form.enterArabicName'),
                         validators: [new ValidatorConfig({ type: 'required' })],
@@ -1970,7 +1970,7 @@ class PropertyForm {
                 ],
             },
         ],
-    }), { ...(ngDevMode ? { debugName: "dynamicFormConfigMain" } : {}) });
+    }), ...(ngDevMode ? [{ debugName: "dynamicFormConfigMain" }] : []));
     constructor() {
         // Load when editing
         effect(() => {
@@ -2146,10 +2146,10 @@ class PropertyForm {
         this.facade.setDefaultViewType('');
         this.destroyConfigurationComponent();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PropertyForm, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: PropertyForm, isStandalone: true, selector: "mt-property-form", inputs: { propertyId: { classPropertyName: "propertyId", publicName: "propertyId", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "configurationHost", first: true, predicate: ["configurationHost"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<mt-page\n  [title]=\"\n    propertyId()\n      ? ('properties.form.editProperty' | transloco)\n      : ('properties.form.createNewProperty' | transloco)\n  \"\n  avatarIcon=\"custom.user-pp\"\n  (backButtonClick)=\"goBack()\"\n  backButton\n  class=\"h-full\"\n>\n  <ng-template #headerEnd>\n    <mt-button\n      class=\"mx-2\"\n      [label]=\"submitLabel()\"\n      [icon]=\"isEditing() ? 'custom.pencil' : 'general.plus'\"\n      [loading]=\"submitting()\"\n      [disabled]=\"submitDisabled() || this.propertyForm.invalid\"\n      (click)=\"createOrEditProperty()\"\n    />\n  </ng-template>\n  <div\n    [formGroup]=\"propertyForm\"\n    class=\"h-full py-4 h-full overflow-y-auto flex justify-center\"\n  >\n    <div class=\"w-1/2 flex flex-col gap-6\">\n      @if (loading()) {\n        <!-- Skeleton Loading State -->\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\n          <div class=\"flex justify-between items-center gap-6\">\n            <p-skeleton width=\"50%\" height=\"3rem\"></p-skeleton>\n            <p-skeleton width=\"8rem\" height=\"2.5rem\"></p-skeleton>\n          </div>\n        </div>\n\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\n          <p-skeleton\n            width=\"12rem\"\n            height=\"1.5rem\"\n            styleClass=\"mb-4\"\n          ></p-skeleton>\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n            <p-skeleton height=\"3rem\"></p-skeleton>\n            <p-skeleton height=\"3rem\"></p-skeleton>\n            <p-skeleton height=\"6rem\" styleClass=\"md:col-span-2\"></p-skeleton>\n            <p-skeleton height=\"3rem\" styleClass=\"md:col-span-2\"></p-skeleton>\n          </div>\n        </div>\n\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\n          <p-skeleton\n            width=\"10rem\"\n            height=\"1.5rem\"\n            styleClass=\"mb-4\"\n          ></p-skeleton>\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n            <p-skeleton height=\"3rem\"></p-skeleton>\n            <p-skeleton height=\"3rem\"></p-skeleton>\n            <p-skeleton height=\"8rem\" styleClass=\"md:col-span-2\"></p-skeleton>\n          </div>\n        </div>\n      } @else {\n        <mt-dynamic-form\n          [formConfig]=\"dynamicFormConfigMain()\"\n          [formControlName]=\"'main'\"\n        />\n        @if (configurationFormConfig()) {\n          <mt-dynamic-form\n            formControlName=\"configuration\"\n            [formConfig]=\"configurationFormConfig()!\"\n          />\n        } @else {\n          <ng-container #configurationHost></ng-container>\n          @if (!configurationComponentExists()) {\n            @switch (propertyType()) {\n              @case (\"User\") {\n                <mt-user-configuration />\n              }\n              @case (\"Percentage\") {\n                <mt-percentage-configuration />\n              }\n              @case (\"Lookup\") {\n                <mt-lookup-configuration />\n              }\n              @case (\"LookupMultiSelect\") {\n                <mt-lookup-configuration />\n              }\n              @case (\"InternalModule\") {\n                <mt-internal-module-configuration />\n              }\n              @case (\"DynamicList\") {\n                <mt-dynamic-list-configuration />\n              }\n              @case (\"API\") {\n                <mt-api-configuration formControlName=\"configuration\" />\n              }\n              <!-- @case('ViewList') { REMOVED FOR NOW\n                  <mt-view-list-configuration />\n                  } -->\n              @case (\"Attachment\") {\n                <mt-attachment-configuration />\n              }\n              <!-- @case('ReferenceProperty') { REMOVED FOR NOW\n                   } -->\n              @case (\"EditableListView\") {\n                <mt-editable-list-view-configuration />\n              }\n              @case (\"LookupLog\") {\n                <mt-check-list-form-configuration />\n              }\n              <!-- @case('LookupMatrix') { REMOVED FOR NOW\n                  <mt-lookup-configuration />\n                  } -->\n              @case (\"Location\") {\n                <mt-location-configuration />\n              }\n            }\n          }\n        }\n      }\n    </div>\n  </div>\n</mt-page>\n", styles: [""], dependencies: [{ kind: "component", type: Page, selector: "mt-page", inputs: ["backButton", "backButtonIcon", "avatarIcon", "avatarStyle", "avatarShape", "title", "tabs", "activeTab", "contentClass", "contentId"], outputs: ["backButtonClick", "tabChange"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ApiConfiguration, selector: "mt-api-configuration" }, { kind: "component", type: CheckListFormConfiguration, selector: "mt-check-list-form-configuration" }, { kind: "component", type: DynamicListConfiguration, selector: "mt-dynamic-list-configuration" }, { kind: "component", type: EditableListViewConfiguration, selector: "mt-editable-list-view-configuration" }, { kind: "component", type: InternalModuleConfiguration, selector: "mt-internal-module-configuration" }, { kind: "component", type: LocationConfiguration, selector: "mt-location-configuration" }, { kind: "component", type: LookupConfiguration, selector: "mt-lookup-configuration" }, { kind: "component", type: PercentageConfiguration, selector: "mt-percentage-configuration" }, { kind: "component", type: UserConfiguration, selector: "mt-user-configuration" }, { kind: "component", type: AttachmentConfiguration, selector: "mt-attachment-configuration" }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1.TranslocoPipe, name: "transloco" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PropertyForm, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: PropertyForm, isStandalone: true, selector: "mt-property-form", inputs: { propertyId: { classPropertyName: "propertyId", publicName: "propertyId", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "configurationHost", first: true, predicate: ["configurationHost"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<mt-page\n  [title]=\"\n    propertyId()\n      ? ('properties.form.editProperty' | transloco)\n      : ('properties.form.createNewProperty' | transloco)\n  \"\n  avatarIcon=\"custom.user-pp\"\n  (backButtonClick)=\"goBack()\"\n  backButton\n  class=\"h-full\"\n>\n  <ng-template #headerEnd>\n    <mt-button\n      class=\"mx-2\"\n      [label]=\"submitLabel()\"\n      [icon]=\"isEditing() ? 'custom.pencil' : 'general.plus'\"\n      [loading]=\"submitting()\"\n      [disabled]=\"submitDisabled() || this.propertyForm.invalid\"\n      (click)=\"createOrEditProperty()\"\n    />\n  </ng-template>\n  <div\n    [formGroup]=\"propertyForm\"\n    class=\"h-full py-4 h-full overflow-y-auto flex justify-center\"\n  >\n    <div class=\"w-1/2 flex flex-col gap-6\">\n      @if (loading()) {\n        <!-- Skeleton Loading State -->\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\n          <div class=\"flex justify-between items-center gap-6\">\n            <p-skeleton width=\"50%\" height=\"3rem\"></p-skeleton>\n            <p-skeleton width=\"8rem\" height=\"2.5rem\"></p-skeleton>\n          </div>\n        </div>\n\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\n          <p-skeleton\n            width=\"12rem\"\n            height=\"1.5rem\"\n            styleClass=\"mb-4\"\n          ></p-skeleton>\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n            <p-skeleton height=\"3rem\"></p-skeleton>\n            <p-skeleton height=\"3rem\"></p-skeleton>\n            <p-skeleton height=\"6rem\" styleClass=\"md:col-span-2\"></p-skeleton>\n            <p-skeleton height=\"3rem\" styleClass=\"md:col-span-2\"></p-skeleton>\n          </div>\n        </div>\n\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\n          <p-skeleton\n            width=\"10rem\"\n            height=\"1.5rem\"\n            styleClass=\"mb-4\"\n          ></p-skeleton>\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n            <p-skeleton height=\"3rem\"></p-skeleton>\n            <p-skeleton height=\"3rem\"></p-skeleton>\n            <p-skeleton height=\"8rem\" styleClass=\"md:col-span-2\"></p-skeleton>\n          </div>\n        </div>\n      } @else {\n        <mt-dynamic-form\n          [formConfig]=\"dynamicFormConfigMain()\"\n          [formControlName]=\"'main'\"\n        />\n        @if (configurationFormConfig()) {\n          <mt-dynamic-form\n            formControlName=\"configuration\"\n            [formConfig]=\"configurationFormConfig()!\"\n          />\n        } @else {\n          <ng-container #configurationHost></ng-container>\n          @if (!configurationComponentExists()) {\n            @switch (propertyType()) {\n              @case (\"User\") {\n                <mt-user-configuration />\n              }\n              @case (\"Percentage\") {\n                <mt-percentage-configuration />\n              }\n              @case (\"Lookup\") {\n                <mt-lookup-configuration />\n              }\n              @case (\"LookupMultiSelect\") {\n                <mt-lookup-configuration />\n              }\n              @case (\"InternalModule\") {\n                <mt-internal-module-configuration />\n              }\n              @case (\"DynamicList\") {\n                <mt-dynamic-list-configuration />\n              }\n              @case (\"API\") {\n                <mt-api-configuration formControlName=\"configuration\" />\n              }\n              <!-- @case('ViewList') { REMOVED FOR NOW\n                  <mt-view-list-configuration />\n                  } -->\n              @case (\"Attachment\") {\n                <mt-attachment-configuration />\n              }\n              <!-- @case('ReferenceProperty') { REMOVED FOR NOW\n                   } -->\n              @case (\"EditableListView\") {\n                <mt-editable-list-view-configuration />\n              }\n              @case (\"LookupLog\") {\n                <mt-check-list-form-configuration />\n              }\n              <!-- @case('LookupMatrix') { REMOVED FOR NOW\n                  <mt-lookup-configuration />\n                  } -->\n              @case (\"Location\") {\n                <mt-location-configuration />\n              }\n            }\n          }\n        }\n      }\n    </div>\n  </div>\n</mt-page>\n", styles: [""], dependencies: [{ kind: "component", type: Page, selector: "mt-page", inputs: ["backButton", "backButtonIcon", "avatarIcon", "avatarStyle", "avatarShape", "title", "tabs", "activeTab", "contentClass", "contentId"], outputs: ["backButtonClick", "tabChange"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ApiConfiguration, selector: "mt-api-configuration" }, { kind: "component", type: CheckListFormConfiguration, selector: "mt-check-list-form-configuration" }, { kind: "component", type: DynamicListConfiguration, selector: "mt-dynamic-list-configuration" }, { kind: "component", type: EditableListViewConfiguration, selector: "mt-editable-list-view-configuration" }, { kind: "component", type: InternalModuleConfiguration, selector: "mt-internal-module-configuration" }, { kind: "component", type: LocationConfiguration, selector: "mt-location-configuration" }, { kind: "component", type: LookupConfiguration, selector: "mt-lookup-configuration" }, { kind: "component", type: PercentageConfiguration, selector: "mt-percentage-configuration" }, { kind: "component", type: UserConfiguration, selector: "mt-user-configuration" }, { kind: "component", type: AttachmentConfiguration, selector: "mt-attachment-configuration" }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1.TranslocoPipe, name: "transloco" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PropertyForm, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PropertyForm, decorators: [{
             type: Component,
             args: [{ selector: 'mt-property-form', imports: [
                         Page,