@masterteam/properties 0.0.71 → 0.0.72

package/assets/properties.css

@@ -1,2 +1,2 @@
-/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
 @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-500:oklch(63.7% .237 25.331);--color-red-600:oklch(57.7% .245 27.325);--color-blue-50:oklch(97% .014 254.604);--color-blue-200:oklch(88.2% .059 254.128);--color-blue-300:oklch(80.9% .105 251.813);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-blue-900:oklch(37.9% .146 265.522);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-400:oklch(70.4% .04 256.788);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-white:#fff;--spacing:.25rem;--container-6xl:72rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--tracking-tight:-.025em;--radius-md:.375rem;--radius-xl:.75rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.static{position:static}.mx-2{margin-inline:calc(var(--spacing) * 2)}.my-4{margin-block:calc(var(--spacing) * 4)}.me-auto{margin-inline-end:auto}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-5{margin-top:calc(var(--spacing) * 5)}.mt-7{margin-top:calc(var(--spacing) * 7)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mb-0{margin-bottom:0}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-5{margin-bottom:calc(var(--spacing) * 5)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.h-5{height:calc(var(--spacing) * 5)}.h-full{height:100%}.max-h-\[75vh\]{max-height:75vh}.min-h-0{min-height:0}.\!w-\[72vw\]{width:72vw!important}.w-1\/2{width:50%}.w-2\/3{width:66.6667%}.w-5{width:calc(var(--spacing) * 5)}.w-25{width:calc(var(--spacing) * 25)}.w-full{width:100%}.max-w-6xl{max-width:var(--container-6xl)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.cursor-pointer{cursor:pointer}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.flex-col{flex-direction:column}.items-center{align-items:center}.items-end{align-items:flex-end}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:var(--spacing)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}.overflow-y-auto{overflow-y:auto}.rounded-full{border-radius:3.40282e38px}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-surface{border-color:var(--p-content-border-color)}.border-surface-200{border-color:var(--p-surface-200)}@supports (color:color-mix(in lab, red, red)){.border-surface-200{border-color:color-mix(in srgb, var(--p-surface-200) calc(100% * 1), transparent)}}.border-surface-300{border-color:var(--p-surface-300)}@supports (color:color-mix(in lab, red, red)){.border-surface-300{border-color:color-mix(in srgb, var(--p-surface-300) calc(100% * 1), transparent)}}.bg-blue-50{background-color:var(--color-blue-50)}.bg-slate-100{background-color:var(--color-slate-100)}.bg-surface-50{background-color:var(--p-surface-50)}@supports (color:color-mix(in lab, red, red)){.bg-surface-50{background-color:color-mix(in srgb, var(--p-surface-50) calc(100% * 1), transparent)}}.bg-white{background-color:var(--color-white)}.p-2{padding:calc(var(--spacing) * 2)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-5{padding-block:calc(var(--spacing) * 5)}.py-6{padding-block:calc(var(--spacing) * 6)}.text-center{text-align:center}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.text-blue-600{color:var(--color-blue-600)}.text-blue-700{color:var(--color-blue-700)}.text-red-500{color:var(--color-red-500)}.text-slate-500{color:var(--color-slate-500)}.text-slate-600{color:var(--color-slate-600)}.text-slate-700{color:var(--color-slate-700)}.text-slate-900{color:var(--color-slate-900)}.text-surface-400{color:var(--p-surface-400)}@supports (color:color-mix(in lab, red, red)){.text-surface-400{color:color-mix(in srgb, var(--p-surface-400) calc(100% * 1), transparent)}}.text-surface-500{color:var(--p-surface-500)}@supports (color:color-mix(in lab, red, red)){.text-surface-500{color:color-mix(in srgb, var(--p-surface-500) calc(100% * 1), transparent)}}.text-surface-600{color:var(--p-surface-600)}@supports (color:color-mix(in lab, red, red)){.text-surface-600{color:color-mix(in srgb, var(--p-surface-600) calc(100% * 1), transparent)}}.text-surface-700{color:var(--p-surface-700)}@supports (color:color-mix(in lab, red, red)){.text-surface-700{color:color-mix(in srgb, var(--p-surface-700) calc(100% * 1), transparent)}}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.backdrop-filter{-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}@media (min-width:48rem){.md\:col-span-2{grid-column:span 2/span 2}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-\[minmax\(0\,1fr\)_auto\]{grid-template-columns:minmax(0,1fr) auto}.md\:grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1fr\)\]{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.md\:grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1fr\)_auto\]{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}}.dark\:bg-blue-900\/30:where(.dark,.dark *){background-color:#1c398e4d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-blue-900\/30:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-blue-900) 30%, transparent)}}.dark\:bg-slate-800\/50:where(.dark,.dark *){background-color:#1d293d80}@supports (color:color-mix(in lab, red, red)){.dark\:bg-slate-800\/50:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-slate-800) 50%, transparent)}}.dark\:text-blue-200:where(.dark,.dark *){color:var(--color-blue-200)}.dark\:text-blue-300:where(.dark,.dark *){color:var(--color-blue-300)}.dark\:text-red-600:where(.dark,.dark *){color:var(--color-red-600)}.dark\:text-slate-200:where(.dark,.dark *){color:var(--color-slate-200)}.dark\:text-slate-300:where(.dark,.dark *){color:var(--color-slate-300)}.dark\:text-slate-400:where(.dark,.dark *){color:var(--color-slate-400)}}@keyframes enter{0%{opacity:var(--p-enter-opacity,1);transform:translate3d(var(--p-enter-translate-x,0), var(--p-enter-translate-y,0), 0) scale3d(var(--p-enter-scale,1), var(--p-enter-scale,1), var(--p-enter-scale,1)) rotate(var(--p-enter-rotate,0))}}@keyframes leave{to{opacity:var(--p-leave-opacity,1);transform:translate3d(var(--p-leave-translate-x,0), var(--p-leave-translate-y,0), 0) scale3d(var(--p-leave-scale,1), var(--p-leave-scale,1), var(--p-leave-scale,1)) rotate(var(--p-leave-rotate,0))}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}

package/fesm2022/masterteam-properties.mjs

@@ -1302,7 +1302,7 @@ class PropertiesList {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PropertiesList, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: PropertiesList, isStandalone: true, selector: "mt-properties-list", inputs: { tab: { classPropertyName: "tab", publicName: "tab", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "isCalculatedTpl", first: true, predicate: ["isCalculatedTpl"], descendants: true, isSignal: true }, { propertyName: "viewTypeTpl", first: true, predicate: ["viewTypeTpl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"space-y-3\">\r\n  <div class=\"flex items-center justify-between\">\r\n    <div class=\"space-y-1\">\r\n      <h1 class=\"text-xl font-semibold text-slate-900 tracking-tight\">\r\n        {{ \"properties.list.pageTitle\" | transloco }}\r\n      </h1>\r\n      <mt-breadcrumb\r\n        [items]=\"breadcrumbItems()\"\r\n        [styleClass]=\"'flex justify-center'\"\r\n      >\r\n      </mt-breadcrumb>\r\n    </div>\r\n  </div>\r\n  <mt-table\r\n    [tabs]=\"tabs()\"\r\n    [(activeTab)]=\"activeTab\"\r\n    (onTabChange)=\"onTabChange($event)\"\r\n    [data]=\"tableData()\"\r\n    [actions]=\"tableActions()\"\r\n    [columns]=\"tableColumns()\"\r\n    dataKey=\"id\"\r\n    storageKey=\"properties-list-table\"\r\n    [rowActions]=\"rowActions()\"\r\n    [generalSearch]=\"true\"\r\n    [showFilters]=\"true\"\r\n    [loading]=\"loading()\"\r\n  >\r\n    <ng-template #viewTypeTpl let-row>\r\n      <span class=\"text-sm text-slate-700 dark:text-slate-200\">\r\n        {{ row.viewTypeLabel || row.viewType }}\r\n      </span>\r\n    </ng-template>\r\n\r\n    <ng-template #isCalculatedTpl let-row>\r\n      @if (row.isCalculated) {\r\n        <span\r\n          class=\"inline-flex items-center gap-1 rounded-md bg-blue-50 dark:bg-blue-900/30 p-2\"\r\n        >\r\n          <mt-icon\r\n            icon=\"education.calculator\"\r\n            class=\"text-blue-600 dark:text-blue-300 text-sm\"\r\n          />\r\n          <span class=\"text-blue-700 dark:text-blue-200 text-xs font-medium\">\r\n            {{ \"properties.list.calculated\" | transloco }}\r\n          </span>\r\n        </span>\r\n      } @else {\r\n        <span\r\n          class=\"inline-flex items-center gap-1 rounded-md bg-slate-100 dark:bg-slate-800/50 p-2\"\r\n        >\r\n          <mt-icon\r\n            icon=\"general.minus-circle\"\r\n            class=\"text-slate-500 dark:text-slate-400 text-sm\"\r\n          />\r\n          <span class=\"text-slate-600 dark:text-slate-300 text-xs font-medium\">\r\n            {{ \"properties.list.uncalculated\" | transloco }}\r\n          </span>\r\n        </span>\r\n      }\r\n    </ng-template>\r\n\r\n    <ng-template #empty>\r\n      <div headless class=\"flex-col justify-center items-center w-full p-5\">\r\n        <div class=\"content flex flex-col gap-5 items-center text-center mb-5\">\r\n          <svg\r\n            width=\"152\"\r\n            height=\"120\"\r\n            viewBox=\"0 0 152 120\"\r\n            fill=\"none\"\r\n            xmlns=\"http://www.w3.org/2000/svg\"\r\n          >\r\n            <circle cx=\"76\" cy=\"52\" r=\"52\" fill=\"#E9EAEB\" />\r\n            <g filter=\"url(#filter0_ddd_2474_28277)\">\r\n              <path\r\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\"\r\n                fill=\"#FAFAFA\"\r\n              />\r\n              <ellipse\r\n                cx=\"45.6\"\r\n                cy=\"54.3998\"\r\n                rx=\"25.6\"\r\n                ry=\"25.6\"\r\n                fill=\"url(#paint0_linear_2474_28277)\"\r\n              />\r\n              <circle\r\n                cx=\"77.6016\"\r\n                cy=\"48\"\r\n                r=\"32\"\r\n                fill=\"url(#paint1_linear_2474_28277)\"\r\n              />\r\n              <ellipse\r\n                cx=\"109.599\"\r\n                cy=\"57.6002\"\r\n                rx=\"22.4\"\r\n                ry=\"22.4\"\r\n                fill=\"url(#paint2_linear_2474_28277)\"\r\n              />\r\n            </g>\r\n            <circle cx=\"21\" cy=\"19\" r=\"5\" fill=\"#F5F5F5\" />\r\n            <circle cx=\"18\" cy=\"109\" r=\"7\" fill=\"#F5F5F5\" />\r\n            <circle cx=\"145\" cy=\"35\" r=\"7\" fill=\"#F5F5F5\" />\r\n            <circle cx=\"134\" cy=\"8\" r=\"4\" fill=\"#F5F5F5\" />\r\n            <foreignObject x=\"44\" y=\"54\" width=\"64\" height=\"64\">\r\n              <div\r\n                xmlns=\"http://www.w3.org/1999/xhtml\"\r\n                style=\"\r\n                  backdrop-filter: blur(4px);\r\n                  clip-path: url(#bgblur_0_2474_28277_clip_path);\r\n                  height: 100%;\r\n                  width: 100%;\r\n                \"\r\n              ></div>\r\n            </foreignObject>\r\n            <g data-figma-bg-blur-radius=\"8\">\r\n              <path\r\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\"\r\n                fill=\"#344054\"\r\n                fill-opacity=\"0.4\"\r\n              />\r\n              <path\r\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\"\r\n                stroke=\"white\"\r\n                stroke-width=\"2\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\"\r\n              />\r\n            </g>\r\n            <defs>\r\n              <filter\r\n                id=\"filter0_ddd_2474_28277\"\r\n                x=\"0\"\r\n                y=\"16\"\r\n                width=\"152\"\r\n                height=\"104\"\r\n                filterUnits=\"userSpaceOnUse\"\r\n                color-interpolation-filters=\"sRGB\"\r\n              >\r\n                <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n                <feColorMatrix\r\n                  in=\"SourceAlpha\"\r\n                  type=\"matrix\"\r\n                  values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n                  result=\"hardAlpha\"\r\n                />\r\n                <feMorphology\r\n                  radius=\"1.5\"\r\n                  operator=\"erode\"\r\n                  in=\"SourceAlpha\"\r\n                  result=\"effect1_dropShadow_2474_28277\"\r\n                />\r\n                <feOffset dy=\"3\" />\r\n                <feGaussianBlur stdDeviation=\"1.5\" />\r\n                <feComposite in2=\"hardAlpha\" operator=\"out\" />\r\n                <feColorMatrix\r\n                  type=\"matrix\"\r\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\"\r\n                />\r\n                <feBlend\r\n                  mode=\"normal\"\r\n                  in2=\"BackgroundImageFix\"\r\n                  result=\"effect1_dropShadow_2474_28277\"\r\n                />\r\n                <feColorMatrix\r\n                  in=\"SourceAlpha\"\r\n                  type=\"matrix\"\r\n                  values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n                  result=\"hardAlpha\"\r\n                />\r\n                <feMorphology\r\n                  radius=\"4\"\r\n                  operator=\"erode\"\r\n                  in=\"SourceAlpha\"\r\n                  result=\"effect2_dropShadow_2474_28277\"\r\n                />\r\n                <feOffset dy=\"8\" />\r\n                <feGaussianBlur stdDeviation=\"4\" />\r\n                <feComposite in2=\"hardAlpha\" operator=\"out\" />\r\n                <feColorMatrix\r\n                  type=\"matrix\"\r\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\"\r\n                />\r\n                <feBlend\r\n                  mode=\"normal\"\r\n                  in2=\"effect1_dropShadow_2474_28277\"\r\n                  result=\"effect2_dropShadow_2474_28277\"\r\n                />\r\n                <feColorMatrix\r\n                  in=\"SourceAlpha\"\r\n                  type=\"matrix\"\r\n                  values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n                  result=\"hardAlpha\"\r\n                />\r\n                <feMorphology\r\n                  radius=\"4\"\r\n                  operator=\"erode\"\r\n                  in=\"SourceAlpha\"\r\n                  result=\"effect3_dropShadow_2474_28277\"\r\n                />\r\n                <feOffset dy=\"20\" />\r\n                <feGaussianBlur stdDeviation=\"12\" />\r\n                <feComposite in2=\"hardAlpha\" operator=\"out\" />\r\n                <feColorMatrix\r\n                  type=\"matrix\"\r\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\"\r\n                />\r\n                <feBlend\r\n                  mode=\"normal\"\r\n                  in2=\"effect2_dropShadow_2474_28277\"\r\n                  result=\"effect3_dropShadow_2474_28277\"\r\n                />\r\n                <feBlend\r\n                  mode=\"normal\"\r\n                  in=\"SourceGraphic\"\r\n                  in2=\"effect3_dropShadow_2474_28277\"\r\n                  result=\"shape\"\r\n                />\r\n              </filter>\r\n              <clipPath\r\n                id=\"bgblur_0_2474_28277_clip_path\"\r\n                transform=\"translate(-44 -54)\"\r\n              >\r\n                <path\r\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\"\r\n                />\r\n              </clipPath>\r\n              <linearGradient\r\n                id=\"paint0_linear_2474_28277\"\r\n                x1=\"25.9429\"\r\n                y1=\"37.4855\"\r\n                x2=\"71.2\"\r\n                y2=\"79.9998\"\r\n                gradientUnits=\"userSpaceOnUse\"\r\n              >\r\n                <stop stop-color=\"#D0D5DD\" />\r\n                <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\r\n              </linearGradient>\r\n              <linearGradient\r\n                id=\"paint1_linear_2474_28277\"\r\n                x1=\"53.0301\"\r\n                y1=\"26.8571\"\r\n                x2=\"109.602\"\r\n                y2=\"80\"\r\n                gradientUnits=\"userSpaceOnUse\"\r\n              >\r\n                <stop stop-color=\"#D0D5DD\" />\r\n                <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\r\n              </linearGradient>\r\n              <linearGradient\r\n                id=\"paint2_linear_2474_28277\"\r\n                x1=\"92.3992\"\r\n                y1=\"42.8002\"\r\n                x2=\"131.999\"\r\n                y2=\"80.0002\"\r\n                gradientUnits=\"userSpaceOnUse\"\r\n              >\r\n                <stop stop-color=\"#D0D5DD\" />\r\n                <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\r\n              </linearGradient>\r\n            </defs>\r\n          </svg>\r\n\r\n          <div class=\"flex flex-col gap-1\">\r\n            <div class=\"text-md text-surface-600\">\r\n              {{ \"properties.list.emptyStateNoData\" | transloco }}\r\n            </div>\r\n          </div>\r\n          <div>\r\n            <mt-button\r\n              [label]=\"'properties.list.addNewProperty' | transloco\"\r\n              icon=\"general.plus\"\r\n              (click)=\"createProperty()\"\r\n            />\r\n          </div>\r\n        </div>\r\n        <p-divider type=\"solid\">\r\n          <div class=\"text-lg text-surface-600\">\r\n            {{ \"properties.list.emptyStateTemplate\" | transloco }}\r\n          </div>\r\n        </p-divider>\r\n        <div class=\"flex gap-3 mt-5 justify-center\">\r\n          @for (card of propertyTypes(); track card.label) {\r\n            <mt-card\r\n              headless\r\n              class=\"w-25 tailwind-4 cursor-pointer\"\r\n              style=\"background-color: #fafafa\"\r\n              (click)=\"createPropertyWithType(card.value)\"\r\n            >\r\n              <div class=\"content flex flex-col gap-3 items-center text-center\">\r\n                <mt-avatar\r\n                  [style.--p-avatar-background]=\"\r\n                    'var(--p-' + card.color + '-100)'\r\n                  \"\r\n                  [style.--p-avatar-color]=\"'var(--p-' + card.color + '-600)'\"\r\n                  [icon]=\"card.icon\"\r\n                  shape=\"square\"\r\n                ></mt-avatar>\r\n                <div class=\"flex flex-col gap-1\">\r\n                  <div class=\"text-xs font-normal\">{{ card.label }}</div>\r\n                </div>\r\n              </div>\r\n            </mt-card>\r\n          }\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </mt-table>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Table, selector: "mt-table", inputs: ["filters", "data", "columns", "rowActions", "size", "showGridlines", "stripedRows", "selectableRows", "clickableRows", "generalSearch", "lazyLocalSearch", "showFilters", "filterMode", "loading", "updating", "lazy", "lazyLocalSort", "lazyTotalRecords", "reorderableColumns", "reorderableRows", "dataKey", "storageKey", "storageMode", "persistStateExclude", "exportable", "printable", "groupable", "groupCountMap", "cellClickFilter", "freezeActions", "virtualScroll", "virtualScrollItemSize", "scrollHeight", "printTitle", "exportFilename", "actionShape", "rowActionsLoadingFn", "tableLayout", "noCard", "tabs", "tabsOptionLabel", "tabsOptionValue", "activeTab", "actions", "paginatorPosition", "alwaysShowPaginator", "rowsPerPageOptions", "pageSize", "currentPage", "first", "filterTerm", "groupBy"], outputs: ["selectionChange", "cellChange", "lazyLoad", "columnReorder", "rowReorder", "rowClick", "rowActionsRequested", "filtersChange", "activeTabChange", "onTabChange", "pageSizeChange", "currentPageChange", "firstChange", "filterTermChange", "groupByChange"] }, { 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: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: PropertiesList, isStandalone: true, selector: "mt-properties-list", inputs: { tab: { classPropertyName: "tab", publicName: "tab", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "isCalculatedTpl", first: true, predicate: ["isCalculatedTpl"], descendants: true, isSignal: true }, { propertyName: "viewTypeTpl", first: true, predicate: ["viewTypeTpl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"space-y-3\">\r\n  <div class=\"flex items-center justify-between\">\r\n    <div class=\"space-y-1\">\r\n      <h1 class=\"text-xl font-semibold text-slate-900 tracking-tight\">\r\n        {{ \"properties.list.pageTitle\" | transloco }}\r\n      </h1>\r\n      <mt-breadcrumb\r\n        [items]=\"breadcrumbItems()\"\r\n        [styleClass]=\"'flex justify-center'\"\r\n      >\r\n      </mt-breadcrumb>\r\n    </div>\r\n  </div>\r\n  <mt-table\r\n    [tabs]=\"tabs()\"\r\n    [(activeTab)]=\"activeTab\"\r\n    (onTabChange)=\"onTabChange($event)\"\r\n    [data]=\"tableData()\"\r\n    [actions]=\"tableActions()\"\r\n    [columns]=\"tableColumns()\"\r\n    dataKey=\"id\"\r\n    storageKey=\"properties-list-table\"\r\n    [rowActions]=\"rowActions()\"\r\n    [generalSearch]=\"true\"\r\n    [showFilters]=\"true\"\r\n    [loading]=\"loading()\"\r\n  >\r\n    <ng-template #viewTypeTpl let-row>\r\n      <span class=\"text-sm text-slate-700 dark:text-slate-200\">\r\n        {{ row.viewTypeLabel || row.viewType }}\r\n      </span>\r\n    </ng-template>\r\n\r\n    <ng-template #isCalculatedTpl let-row>\r\n      @if (row.isCalculated) {\r\n        <span\r\n          class=\"inline-flex items-center gap-1 rounded-md bg-blue-50 dark:bg-blue-900/30 p-2\"\r\n        >\r\n          <mt-icon\r\n            icon=\"education.calculator\"\r\n            class=\"text-blue-600 dark:text-blue-300 text-sm\"\r\n          />\r\n          <span class=\"text-blue-700 dark:text-blue-200 text-xs font-medium\">\r\n            {{ \"properties.list.calculated\" | transloco }}\r\n          </span>\r\n        </span>\r\n      } @else {\r\n        <span\r\n          class=\"inline-flex items-center gap-1 rounded-md bg-slate-100 dark:bg-slate-800/50 p-2\"\r\n        >\r\n          <mt-icon\r\n            icon=\"general.minus-circle\"\r\n            class=\"text-slate-500 dark:text-slate-400 text-sm\"\r\n          />\r\n          <span class=\"text-slate-600 dark:text-slate-300 text-xs font-medium\">\r\n            {{ \"properties.list.uncalculated\" | transloco }}\r\n          </span>\r\n        </span>\r\n      }\r\n    </ng-template>\r\n\r\n    <ng-template #empty>\r\n      <div headless class=\"flex-col justify-center items-center w-full p-5\">\r\n        <div class=\"content flex flex-col gap-5 items-center text-center mb-5\">\r\n          <svg\r\n            width=\"152\"\r\n            height=\"120\"\r\n            viewBox=\"0 0 152 120\"\r\n            fill=\"none\"\r\n            xmlns=\"http://www.w3.org/2000/svg\"\r\n          >\r\n            <circle cx=\"76\" cy=\"52\" r=\"52\" fill=\"#E9EAEB\" />\r\n            <g filter=\"url(#filter0_ddd_2474_28277)\">\r\n              <path\r\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\"\r\n                fill=\"#FAFAFA\"\r\n              />\r\n              <ellipse\r\n                cx=\"45.6\"\r\n                cy=\"54.3998\"\r\n                rx=\"25.6\"\r\n                ry=\"25.6\"\r\n                fill=\"url(#paint0_linear_2474_28277)\"\r\n              />\r\n              <circle\r\n                cx=\"77.6016\"\r\n                cy=\"48\"\r\n                r=\"32\"\r\n                fill=\"url(#paint1_linear_2474_28277)\"\r\n              />\r\n              <ellipse\r\n                cx=\"109.599\"\r\n                cy=\"57.6002\"\r\n                rx=\"22.4\"\r\n                ry=\"22.4\"\r\n                fill=\"url(#paint2_linear_2474_28277)\"\r\n              />\r\n            </g>\r\n            <circle cx=\"21\" cy=\"19\" r=\"5\" fill=\"#F5F5F5\" />\r\n            <circle cx=\"18\" cy=\"109\" r=\"7\" fill=\"#F5F5F5\" />\r\n            <circle cx=\"145\" cy=\"35\" r=\"7\" fill=\"#F5F5F5\" />\r\n            <circle cx=\"134\" cy=\"8\" r=\"4\" fill=\"#F5F5F5\" />\r\n            <foreignObject x=\"44\" y=\"54\" width=\"64\" height=\"64\">\r\n              <div\r\n                xmlns=\"http://www.w3.org/1999/xhtml\"\r\n                style=\"\r\n                  backdrop-filter: blur(4px);\r\n                  clip-path: url(#bgblur_0_2474_28277_clip_path);\r\n                  height: 100%;\r\n                  width: 100%;\r\n                \"\r\n              ></div>\r\n            </foreignObject>\r\n            <g data-figma-bg-blur-radius=\"8\">\r\n              <path\r\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\"\r\n                fill=\"#344054\"\r\n                fill-opacity=\"0.4\"\r\n              />\r\n              <path\r\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\"\r\n                stroke=\"white\"\r\n                stroke-width=\"2\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\"\r\n              />\r\n            </g>\r\n            <defs>\r\n              <filter\r\n                id=\"filter0_ddd_2474_28277\"\r\n                x=\"0\"\r\n                y=\"16\"\r\n                width=\"152\"\r\n                height=\"104\"\r\n                filterUnits=\"userSpaceOnUse\"\r\n                color-interpolation-filters=\"sRGB\"\r\n              >\r\n                <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n                <feColorMatrix\r\n                  in=\"SourceAlpha\"\r\n                  type=\"matrix\"\r\n                  values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n                  result=\"hardAlpha\"\r\n                />\r\n                <feMorphology\r\n                  radius=\"1.5\"\r\n                  operator=\"erode\"\r\n                  in=\"SourceAlpha\"\r\n                  result=\"effect1_dropShadow_2474_28277\"\r\n                />\r\n                <feOffset dy=\"3\" />\r\n                <feGaussianBlur stdDeviation=\"1.5\" />\r\n                <feComposite in2=\"hardAlpha\" operator=\"out\" />\r\n                <feColorMatrix\r\n                  type=\"matrix\"\r\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\"\r\n                />\r\n                <feBlend\r\n                  mode=\"normal\"\r\n                  in2=\"BackgroundImageFix\"\r\n                  result=\"effect1_dropShadow_2474_28277\"\r\n                />\r\n                <feColorMatrix\r\n                  in=\"SourceAlpha\"\r\n                  type=\"matrix\"\r\n                  values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n                  result=\"hardAlpha\"\r\n                />\r\n                <feMorphology\r\n                  radius=\"4\"\r\n                  operator=\"erode\"\r\n                  in=\"SourceAlpha\"\r\n                  result=\"effect2_dropShadow_2474_28277\"\r\n                />\r\n                <feOffset dy=\"8\" />\r\n                <feGaussianBlur stdDeviation=\"4\" />\r\n                <feComposite in2=\"hardAlpha\" operator=\"out\" />\r\n                <feColorMatrix\r\n                  type=\"matrix\"\r\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\"\r\n                />\r\n                <feBlend\r\n                  mode=\"normal\"\r\n                  in2=\"effect1_dropShadow_2474_28277\"\r\n                  result=\"effect2_dropShadow_2474_28277\"\r\n                />\r\n                <feColorMatrix\r\n                  in=\"SourceAlpha\"\r\n                  type=\"matrix\"\r\n                  values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n                  result=\"hardAlpha\"\r\n                />\r\n                <feMorphology\r\n                  radius=\"4\"\r\n                  operator=\"erode\"\r\n                  in=\"SourceAlpha\"\r\n                  result=\"effect3_dropShadow_2474_28277\"\r\n                />\r\n                <feOffset dy=\"20\" />\r\n                <feGaussianBlur stdDeviation=\"12\" />\r\n                <feComposite in2=\"hardAlpha\" operator=\"out\" />\r\n                <feColorMatrix\r\n                  type=\"matrix\"\r\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\"\r\n                />\r\n                <feBlend\r\n                  mode=\"normal\"\r\n                  in2=\"effect2_dropShadow_2474_28277\"\r\n                  result=\"effect3_dropShadow_2474_28277\"\r\n                />\r\n                <feBlend\r\n                  mode=\"normal\"\r\n                  in=\"SourceGraphic\"\r\n                  in2=\"effect3_dropShadow_2474_28277\"\r\n                  result=\"shape\"\r\n                />\r\n              </filter>\r\n              <clipPath\r\n                id=\"bgblur_0_2474_28277_clip_path\"\r\n                transform=\"translate(-44 -54)\"\r\n              >\r\n                <path\r\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\"\r\n                />\r\n              </clipPath>\r\n              <linearGradient\r\n                id=\"paint0_linear_2474_28277\"\r\n                x1=\"25.9429\"\r\n                y1=\"37.4855\"\r\n                x2=\"71.2\"\r\n                y2=\"79.9998\"\r\n                gradientUnits=\"userSpaceOnUse\"\r\n              >\r\n                <stop stop-color=\"#D0D5DD\" />\r\n                <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\r\n              </linearGradient>\r\n              <linearGradient\r\n                id=\"paint1_linear_2474_28277\"\r\n                x1=\"53.0301\"\r\n                y1=\"26.8571\"\r\n                x2=\"109.602\"\r\n                y2=\"80\"\r\n                gradientUnits=\"userSpaceOnUse\"\r\n              >\r\n                <stop stop-color=\"#D0D5DD\" />\r\n                <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\r\n              </linearGradient>\r\n              <linearGradient\r\n                id=\"paint2_linear_2474_28277\"\r\n                x1=\"92.3992\"\r\n                y1=\"42.8002\"\r\n                x2=\"131.999\"\r\n                y2=\"80.0002\"\r\n                gradientUnits=\"userSpaceOnUse\"\r\n              >\r\n                <stop stop-color=\"#D0D5DD\" />\r\n                <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\r\n              </linearGradient>\r\n            </defs>\r\n          </svg>\r\n\r\n          <div class=\"flex flex-col gap-1\">\r\n            <div class=\"text-md text-surface-600\">\r\n              {{ \"properties.list.emptyStateNoData\" | transloco }}\r\n            </div>\r\n          </div>\r\n          <div>\r\n            <mt-button\r\n              [label]=\"'properties.list.addNewProperty' | transloco\"\r\n              icon=\"general.plus\"\r\n              (click)=\"createProperty()\"\r\n            />\r\n          </div>\r\n        </div>\r\n        <p-divider type=\"solid\">\r\n          <div class=\"text-lg text-surface-600\">\r\n            {{ \"properties.list.emptyStateTemplate\" | transloco }}\r\n          </div>\r\n        </p-divider>\r\n        <div class=\"flex gap-3 mt-5 justify-center\">\r\n          @for (card of propertyTypes(); track card.label) {\r\n            <mt-card\r\n              headless\r\n              class=\"w-25 tailwind-4 cursor-pointer\"\r\n              style=\"background-color: #fafafa\"\r\n              (click)=\"createPropertyWithType(card.value)\"\r\n            >\r\n              <div class=\"content flex flex-col gap-3 items-center text-center\">\r\n                <mt-avatar\r\n                  [style.--p-avatar-background]=\"\r\n                    'var(--p-' + card.color + '-100)'\r\n                  \"\r\n                  [style.--p-avatar-color]=\"'var(--p-' + card.color + '-600)'\"\r\n                  [icon]=\"card.icon\"\r\n                  shape=\"square\"\r\n                ></mt-avatar>\r\n                <div class=\"flex flex-col gap-1\">\r\n                  <div class=\"text-xs font-normal\">{{ card.label }}</div>\r\n                </div>\r\n              </div>\r\n            </mt-card>\r\n          }\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </mt-table>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Table, selector: "mt-table", inputs: ["filters", "data", "columns", "rowActions", "size", "showGridlines", "stripedRows", "selectableRows", "clickableRows", "generalSearch", "lazyLocalSearch", "showFilters", "filterMode", "loading", "updating", "lazy", "lazyLocalSort", "lazyTotalRecords", "reorderableColumns", "reorderableRows", "dataKey", "storageKey", "storageMode", "persistStateExclude", "exportable", "printable", "groupable", "groupCountMap", "cellClickFilter", "freezeActions", "virtualScroll", "virtualScrollItemSize", "scrollHeight", "printTitle", "exportFilename", "actionShape", "rowActionsLoadingFn", "tableLayout", "noCard", "tabs", "tabsOptionLabel", "tabsOptionValue", "activeTab", "actions", "paginatorPosition", "alwaysShowPaginator", "rowsPerPageOptions", "pageSize", "currentPage", "first", "filterTerm", "groupBy", "sortField", "sortDirection"], outputs: ["selectionChange", "cellChange", "lazyLoad", "columnReorder", "rowReorder", "rowClick", "rowActionsRequested", "filtersChange", "activeTabChange", "onTabChange", "pageSizeChange", "currentPageChange", "firstChange", "filterTermChange", "groupByChange", "sortFieldChange", "sortDirectionChange"] }, { 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: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PropertiesList, decorators: [{
             type: Component,
@@ -2263,7 +2263,7 @@ class StatusConfiguration {
         return Number.isFinite(parsed) ? parsed : null;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: StatusConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: StatusConfiguration, isStandalone: true, selector: "mt-status-configuration", inputs: { propertyId: { classPropertyName: "propertyId", publicName: "propertyId", isSignal: true, isRequired: false, transformFunction: null }, contextKey: { classPropertyName: "contextKey", publicName: "contextKey", isSignal: true, isRequired: false, transformFunction: null }, levelSchemaId: { classPropertyName: "levelSchemaId", publicName: "levelSchemaId", isSignal: true, isRequired: false, transformFunction: null }, moduleId: { classPropertyName: "moduleId", publicName: "moduleId", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "colorTpl", first: true, predicate: ["colorTpl"], descendants: true, isSignal: true }], ngImport: i0, template: "<mt-card [title]=\"'properties.form.statusesSection' | transloco\">\r\n  @if (canManageStatuses()) {\r\n    <mt-table\r\n      [data]=\"statuses()\"\r\n      [columns]=\"tableColumns()\"\r\n      [actions]=\"tableActions()\"\r\n      [rowActions]=\"rowActions()\"\r\n      [generalSearch]=\"true\"\r\n      [loading]=\"loading()\"\r\n      [updating]=\"reordering()\"\r\n      [reorderableRows]=\"true\"\r\n      dataKey=\"id\"\r\n      storageKey=\"properties-status-configuration-table\"\r\n      (rowReorder)=\"onRowReorder($event)\"\r\n    >\r\n      <ng-template #colorTpl let-row>\r\n        @if (row.color) {\r\n          <span\r\n            class=\"inline-block h-5 w-5 rounded-full border border-surface-300\"\r\n            [style.background-color]=\"row.color\"\r\n            [title]=\"row.color\"\r\n          ></span>\r\n        } @else {\r\n          <span class=\"text-surface-400\">\u2014</span>\r\n        }\r\n      </ng-template>\r\n    </mt-table>\r\n  } @else {\r\n    <div\r\n      class=\"rounded-xl border border-dashed border-surface-300 bg-surface-50 px-4 py-6 text-sm text-surface-600\"\r\n    >\r\n      {{ \"properties.form.statusesSavePrompt\" | transloco }}\r\n    </div>\r\n  }\r\n</mt-card>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: Table, selector: "mt-table", inputs: ["filters", "data", "columns", "rowActions", "size", "showGridlines", "stripedRows", "selectableRows", "clickableRows", "generalSearch", "lazyLocalSearch", "showFilters", "filterMode", "loading", "updating", "lazy", "lazyLocalSort", "lazyTotalRecords", "reorderableColumns", "reorderableRows", "dataKey", "storageKey", "storageMode", "persistStateExclude", "exportable", "printable", "groupable", "groupCountMap", "cellClickFilter", "freezeActions", "virtualScroll", "virtualScrollItemSize", "scrollHeight", "printTitle", "exportFilename", "actionShape", "rowActionsLoadingFn", "tableLayout", "noCard", "tabs", "tabsOptionLabel", "tabsOptionValue", "activeTab", "actions", "paginatorPosition", "alwaysShowPaginator", "rowsPerPageOptions", "pageSize", "currentPage", "first", "filterTerm", "groupBy"], outputs: ["selectionChange", "cellChange", "lazyLoad", "columnReorder", "rowReorder", "rowClick", "rowActionsRequested", "filtersChange", "activeTabChange", "onTabChange", "pageSizeChange", "currentPageChange", "firstChange", "filterTermChange", "groupByChange"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: StatusConfiguration, isStandalone: true, selector: "mt-status-configuration", inputs: { propertyId: { classPropertyName: "propertyId", publicName: "propertyId", isSignal: true, isRequired: false, transformFunction: null }, contextKey: { classPropertyName: "contextKey", publicName: "contextKey", isSignal: true, isRequired: false, transformFunction: null }, levelSchemaId: { classPropertyName: "levelSchemaId", publicName: "levelSchemaId", isSignal: true, isRequired: false, transformFunction: null }, moduleId: { classPropertyName: "moduleId", publicName: "moduleId", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "colorTpl", first: true, predicate: ["colorTpl"], descendants: true, isSignal: true }], ngImport: i0, template: "<mt-card [title]=\"'properties.form.statusesSection' | transloco\">\r\n  @if (canManageStatuses()) {\r\n    <mt-table\r\n      [data]=\"statuses()\"\r\n      [columns]=\"tableColumns()\"\r\n      [actions]=\"tableActions()\"\r\n      [rowActions]=\"rowActions()\"\r\n      [generalSearch]=\"true\"\r\n      [loading]=\"loading()\"\r\n      [updating]=\"reordering()\"\r\n      [reorderableRows]=\"true\"\r\n      dataKey=\"id\"\r\n      storageKey=\"properties-status-configuration-table\"\r\n      (rowReorder)=\"onRowReorder($event)\"\r\n    >\r\n      <ng-template #colorTpl let-row>\r\n        @if (row.color) {\r\n          <span\r\n            class=\"inline-block h-5 w-5 rounded-full border border-surface-300\"\r\n            [style.background-color]=\"row.color\"\r\n            [title]=\"row.color\"\r\n          ></span>\r\n        } @else {\r\n          <span class=\"text-surface-400\">\u2014</span>\r\n        }\r\n      </ng-template>\r\n    </mt-table>\r\n  } @else {\r\n    <div\r\n      class=\"rounded-xl border border-dashed border-surface-300 bg-surface-50 px-4 py-6 text-sm text-surface-600\"\r\n    >\r\n      {{ \"properties.form.statusesSavePrompt\" | transloco }}\r\n    </div>\r\n  }\r\n</mt-card>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: Table, selector: "mt-table", inputs: ["filters", "data", "columns", "rowActions", "size", "showGridlines", "stripedRows", "selectableRows", "clickableRows", "generalSearch", "lazyLocalSearch", "showFilters", "filterMode", "loading", "updating", "lazy", "lazyLocalSort", "lazyTotalRecords", "reorderableColumns", "reorderableRows", "dataKey", "storageKey", "storageMode", "persistStateExclude", "exportable", "printable", "groupable", "groupCountMap", "cellClickFilter", "freezeActions", "virtualScroll", "virtualScrollItemSize", "scrollHeight", "printTitle", "exportFilename", "actionShape", "rowActionsLoadingFn", "tableLayout", "noCard", "tabs", "tabsOptionLabel", "tabsOptionValue", "activeTab", "actions", "paginatorPosition", "alwaysShowPaginator", "rowsPerPageOptions", "pageSize", "currentPage", "first", "filterTerm", "groupBy", "sortField", "sortDirection"], outputs: ["selectionChange", "cellChange", "lazyLoad", "columnReorder", "rowReorder", "rowClick", "rowActionsRequested", "filtersChange", "activeTabChange", "onTabChange", "pageSizeChange", "currentPageChange", "firstChange", "filterTermChange", "groupByChange", "sortFieldChange", "sortDirectionChange"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: StatusConfiguration, decorators: [{
             type: Component,
@@ -2539,7 +2539,16 @@ class PropertyForm {
         'Number',
         'Checkbox',
         'Time',
+        'PhaseGate',
     ];
+    /**
+     * View types whose value is always produced by a formula — the backend owns
+     * the value and nothing in the runtime writes it back. The Calculated toggle
+     * is still rendered (it is what reveals the formula card) but is pinned on
+     * and locked: authoring the formula is the only thing left to the user, on
+     * create and on edit alike, whether or not the property is a system one.
+     */
+    alwaysCalculatedViewTypes = ['PhaseGate'];
     translatableToggleViewTypes = ['Text', 'LongText'];
     submitLabel = computed(() => this.propertyId()
         ? this.transloco.translate('properties.form.updateButton')
@@ -2566,8 +2575,21 @@ class PropertyForm {
     loading = this.facade.isLoadingOne;
     submitting = computed(() => this.creating() || this.updating(), ...(ngDevMode ? [{ debugName: "submitting" }] : /* istanbul ignore next */ []));
     propertyType = computed(() => this.mainValue()?.viewType ?? null, ...(ngDevMode ? [{ debugName: "propertyType" }] : /* istanbul ignore next */ []));
-    isCalculated = computed(() => Boolean(this.mainValue()?.isCalculated), ...(ngDevMode ? [{ debugName: "isCalculated" }] : /* istanbul ignore next */ []));
+    /** True while the selected view type is calculated by definition. */
+    isAlwaysCalculatedType = computed(() => this.alwaysCalculatedViewTypes.includes(this.propertyType() ?? ''), ...(ngDevMode ? [{ debugName: "isAlwaysCalculatedType" }] : /* istanbul ignore next */ []));
+    /**
+     * Keys DynamicForm must lock in the "main" form. `forcedDisabledFieldKeys`
+     * (rather than a `disabled` field config) is what keeps the pinned `true`
+     * intact — a field disabled by config is treated as a normal disable and has
+     * its value reset, a forced-disabled one is treated as a context lock.
+     */
+    lockedMainFieldKeys = computed(() => this.isAlwaysCalculatedType() ? ['isCalculated'] : [], ...(ngDevMode ? [{ debugName: "lockedMainFieldKeys" }] : /* istanbul ignore next */ []));
+    isCalculated = computed(() => this.isAlwaysCalculatedType() || Boolean(this.mainValue()?.isCalculated), ...(ngDevMode ? [{ debugName: "isCalculated" }] : /* istanbul ignore next */ []));
     hideFormulaBuilder = computed(() => {
+        // An always-calculated type has nothing to show without its formula.
+        if (this.isAlwaysCalculatedType()) {
+            return false;
+        }
         const normalizedKey = (this.facade.selected()
             ?.normalizedKey ??
             this.mainValue()?.normalizedKey ??
@@ -2795,6 +2817,34 @@ class PropertyForm {
         effect(() => {
             this.renderConfigurationComponent(this.configurationComponentType());
         });
+        // Pin the Calculated toggle on for view types that are calculated by
+        // definition. The lock in `lockedMainFieldKeys` only stops the user from
+        // switching it off; the value itself still has to be written, both for a
+        // freshly picked view type and for a stored property the backend sent with
+        // the flag unset. Releasing the pin on the way out matters on create only
+        // (viewType is disabled while editing): the next type must start from the
+        // user's own choice, not from a value this effect wrote.
+        let pinnedCalculated = false;
+        effect(() => {
+            const alwaysCalculated = this.isAlwaysCalculatedType();
+            // untracked: see syncFormWithSelectedProperty effect — patchValue runs
+            // DynamicForm.writeValue → evaluateRelations (reads+writes its signals),
+            // which would otherwise make this effect self-dependent and loop.
+            untracked(() => {
+                const value = this.mainControl.value;
+                if (alwaysCalculated) {
+                    pinnedCalculated = true;
+                    if (value?.isCalculated === true)
+                        return;
+                    this.mainControl.patchValue({ ...value, isCalculated: true }, { emitEvent: true });
+                    return;
+                }
+                if (!pinnedCalculated)
+                    return;
+                pinnedCalculated = false;
+                this.mainControl.patchValue({ ...value, isCalculated: false }, { emitEvent: true });
+            });
+        });
         effect(() => {
             const calculated = this.isCalculated();
             this.formulaControl.setValidators(calculated ? [Validators.required] : []);
@@ -2923,13 +2973,7 @@ class PropertyForm {
         const mainValue = this.mainControl.value;
         if (!mainValue)
             return;
-        // The isCalculated toggle is hidden for viewTypes outside calculatedToggleViewTypes
-        // (e.g. Status). DynamicForm clears hidden field values, so preserve the original
-        // isCalculated from the loaded property to avoid overwriting a backend-managed flag.
-        const supportsCalculatedToggle = this.calculatedToggleViewTypes.includes(mainValue.viewType);
-        const isCalculated = supportsCalculatedToggle
-            ? Boolean(mainValue.isCalculated)
-            : Boolean(this.facade.selected()?.isCalculated);
+        const isCalculated = this.resolveIsCalculated(mainValue);
         const supportsTranslatableToggle = this.translatableToggleViewTypes.includes(mainValue.viewType);
         const isTranslatable = supportsTranslatableToggle
             ? Boolean(mainValue.isTranslatable)
@@ -2966,6 +3010,22 @@ class PropertyForm {
             reject: () => this.submitProperty({ ...payload, addToForm: false }),
         });
     }
+    /**
+     * The flag to persist for the given view type:
+     * - always-calculated types are `true` regardless of what the form holds;
+     * - types that render the toggle use the toggle's value;
+     * - for the rest the toggle is hidden, and DynamicForm clears hidden field
+     *   values, so the loaded property's backend-managed flag is preserved.
+     */
+    resolveIsCalculated(mainValue) {
+        const viewType = mainValue.viewType;
+        if (this.alwaysCalculatedViewTypes.includes(viewType)) {
+            return true;
+        }
+        return this.calculatedToggleViewTypes.includes(viewType)
+            ? Boolean(mainValue.isCalculated)
+            : Boolean(this.facade.selected()?.isCalculated);
+    }
     submitProperty(payload) {
         const request$ = this.propertyId()
             ? this.facade.update(this.propertyId(), payload)
@@ -3043,7 +3103,7 @@ class PropertyForm {
         this.subscriptions.unsubscribe();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PropertyForm, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: PropertyForm, isStandalone: true, selector: "mt-property-form", inputs: { propertyId: { classPropertyName: "propertyId", publicName: "propertyId", isSignal: true, isRequired: false, transformFunction: null }, scope: { classPropertyName: "scope", publicName: "scope", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "statusConfigurationSection", first: true, predicate: ["statusConfigurationSection"], descendants: true, isSignal: true }, { propertyName: "configurationHost", first: true, predicate: ["configurationHost"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<mt-page\r\n  [title]=\"\r\n    propertyId()\r\n      ? ('properties.form.editProperty' | transloco)\r\n      : ('properties.form.createNewProperty' | transloco)\r\n  \"\r\n  avatarIcon=\"custom.products-and-services\"\r\n  [avatarStyle]=\"{\r\n    '--p-avatar-background': 'var(--p-sky-50)',\r\n    '--p-avatar-color': 'var(--p-sky-700)',\r\n  }\"\r\n  (backButtonClick)=\"goBack()\"\r\n  backButton\r\n  class=\"h-full\"\r\n>\r\n  <ng-template #headerEnd>\r\n    <mt-button\r\n      class=\"mx-2\"\r\n      [label]=\"submitLabel()\"\r\n      [icon]=\"isEditing() ? 'custom.pencil' : 'general.plus'\"\r\n      [loading]=\"submitting()\"\r\n      [disabled]=\"submitDisabled() || this.propertyForm.invalid\"\r\n      (click)=\"createOrEditProperty($event)\"\r\n    />\r\n  </ng-template>\r\n  <div\r\n    [formGroup]=\"propertyForm\"\r\n    class=\"h-full py-4 h-full overflow-y-auto flex justify-center\"\r\n  >\r\n    <div class=\"w-2/3 flex flex-col gap-6\">\r\n      @if (loading()) {\r\n        <!-- Skeleton Loading State -->\r\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\r\n          <div class=\"flex justify-between items-center gap-6\">\r\n            <p-skeleton width=\"50%\" height=\"3rem\"></p-skeleton>\r\n            <p-skeleton width=\"8rem\" height=\"2.5rem\"></p-skeleton>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\r\n          <p-skeleton\r\n            width=\"12rem\"\r\n            height=\"1.5rem\"\r\n            styleClass=\"mb-4\"\r\n          ></p-skeleton>\r\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"6rem\" styleClass=\"md:col-span-2\"></p-skeleton>\r\n            <p-skeleton height=\"3rem\" styleClass=\"md:col-span-2\"></p-skeleton>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\r\n          <p-skeleton\r\n            width=\"10rem\"\r\n            height=\"1.5rem\"\r\n            styleClass=\"mb-4\"\r\n          ></p-skeleton>\r\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"8rem\" styleClass=\"md:col-span-2\"></p-skeleton>\r\n          </div>\r\n        </div>\r\n      } @else {\r\n        <mt-dynamic-form\r\n          [formConfig]=\"dynamicFormConfigMain()\"\r\n          [formControlName]=\"'main'\"\r\n        />\r\n        @if (configurationFormConfig()) {\r\n          <mt-dynamic-form\r\n            formControlName=\"configuration\"\r\n            [formConfig]=\"configurationFormConfig()!\"\r\n          />\r\n        } @else {\r\n          <ng-container #configurationHost></ng-container>\r\n          @if (!configurationComponentExists()) {\r\n            @switch (propertyType()) {\r\n              @case (\"User\") {\r\n                <mt-user-configuration />\r\n              }\r\n              @case (\"Percentage\") {\r\n                <mt-percentage-configuration />\r\n              }\r\n              @case (\"Lookup\") {\r\n                <mt-lookup-configuration />\r\n              }\r\n              @case (\"LookupMultiSelect\") {\r\n                <mt-lookup-configuration />\r\n              }\r\n              @case (\"EntityList\") {\r\n                <mt-entity-list-configuration />\r\n              }\r\n              @case (\"API\") {\r\n                <mt-api-configuration formControlName=\"configuration\" />\r\n              }\r\n              @case (\"Status\") {\r\n                <section #statusConfigurationSection>\r\n                  <mt-status-configuration\r\n                    [propertyId]=\"statusPropertyId()\"\r\n                    [contextKey]=\"formulaContextKey()\"\r\n                    [levelSchemaId]=\"formulaSchemaId()\"\r\n                    [moduleId]=\"formulaModuleId()\"\r\n                  />\r\n                </section>\r\n              }\r\n              <!-- @case('ViewList') { REMOVED FOR NOW\r\n                  <mt-view-list-configuration />\r\n                  } -->\r\n              @case (\"Attachment\") {\r\n                <mt-attachment-configuration />\r\n              }\r\n              <!-- @case('ReferenceProperty') { REMOVED FOR NOW\r\n                   } -->\r\n              @case (\"LookupModuleCheckList\") {\r\n                <mt-check-list-form-configuration />\r\n              }\r\n              <!-- @case('LookupMatrix') { REMOVED FOR NOW\r\n                  <mt-lookup-configuration />\r\n                  } -->\r\n              @case (\"Location\") {\r\n                <mt-location-configuration />\r\n              }\r\n            }\r\n          }\r\n        }\r\n        @if (isCalculated() && !hideFormulaBuilder()) {\r\n          <mt-card>\r\n            <ng-template #headless>\r\n              <div\r\n                class=\"flex items-center justify-between px-4 py-5 border-b border-surface\"\r\n              >\r\n                <h3 class=\"text-xl font-semibold\">\r\n                  {{ \"properties.form.formula\" | transloco }}\r\n                  <span class=\"text-red-500\">*</span>\r\n                </h3>\r\n              </div>\r\n              <div class=\"flex-1 min-h-0 p-4\">\r\n                <mt-formula-builder\r\n                  formControlName=\"formula\"\r\n                  [contextKey]=\"formulaContextKey()\"\r\n                  [levelSchemaId]=\"formulaSchemaId()\"\r\n                  [moduleId]=\"formulaModuleId()\"\r\n                />\r\n              </div>\r\n            </ng-template>\r\n          </mt-card>\r\n        }\r\n      }\r\n    </div>\r\n  </div>\r\n</mt-page>\r\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: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig", "forcedHiddenFieldKeys", "forcedDisabledFieldKeys", "preserveForcedHiddenValues", "visibleSectionKeys", "externalValues"], outputs: ["runtimeMessagesChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormulaBuilder, selector: "mt-formula-builder", inputs: ["propertiesByPath", "levelSchemaId", "moduleId", "contextKey", "contextEntityTypeKey", "templateId", "placeholder", "hideToolbar", "hideStatusBar", "toolbarTabs", "codeOnly", "builderOnly", "valueMode", "isProcessBuilder"], outputs: ["validationChange", "tokensChange"] }, { kind: "component", type: ApiConfiguration, selector: "mt-api-configuration" }, { kind: "component", type: CheckListFormConfiguration, selector: "mt-check-list-form-configuration" }, { kind: "component", type: EntityListConfiguration, selector: "mt-entity-list-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: StatusConfiguration, selector: "mt-status-configuration", inputs: ["propertyId", "contextKey", "levelSchemaId", "moduleId"] }, { kind: "component", type: UserConfiguration, selector: "mt-user-configuration" }, { kind: "component", type: AttachmentConfiguration, selector: "mt-attachment-configuration" }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2$1.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: PropertyForm, isStandalone: true, selector: "mt-property-form", inputs: { propertyId: { classPropertyName: "propertyId", publicName: "propertyId", isSignal: true, isRequired: false, transformFunction: null }, scope: { classPropertyName: "scope", publicName: "scope", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "statusConfigurationSection", first: true, predicate: ["statusConfigurationSection"], descendants: true, isSignal: true }, { propertyName: "configurationHost", first: true, predicate: ["configurationHost"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<mt-page\r\n  [title]=\"\r\n    propertyId()\r\n      ? ('properties.form.editProperty' | transloco)\r\n      : ('properties.form.createNewProperty' | transloco)\r\n  \"\r\n  avatarIcon=\"custom.products-and-services\"\r\n  [avatarStyle]=\"{\r\n    '--p-avatar-background': 'var(--p-sky-50)',\r\n    '--p-avatar-color': 'var(--p-sky-700)',\r\n  }\"\r\n  (backButtonClick)=\"goBack()\"\r\n  backButton\r\n  class=\"h-full\"\r\n>\r\n  <ng-template #headerEnd>\r\n    <mt-button\r\n      class=\"mx-2\"\r\n      [label]=\"submitLabel()\"\r\n      [icon]=\"isEditing() ? 'custom.pencil' : 'general.plus'\"\r\n      [loading]=\"submitting()\"\r\n      [disabled]=\"submitDisabled() || this.propertyForm.invalid\"\r\n      (click)=\"createOrEditProperty($event)\"\r\n    />\r\n  </ng-template>\r\n  <div\r\n    [formGroup]=\"propertyForm\"\r\n    class=\"h-full py-4 h-full overflow-y-auto flex justify-center\"\r\n  >\r\n    <div class=\"w-2/3 flex flex-col gap-6\">\r\n      @if (loading()) {\r\n        <!-- Skeleton Loading State -->\r\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\r\n          <div class=\"flex justify-between items-center gap-6\">\r\n            <p-skeleton width=\"50%\" height=\"3rem\"></p-skeleton>\r\n            <p-skeleton width=\"8rem\" height=\"2.5rem\"></p-skeleton>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\r\n          <p-skeleton\r\n            width=\"12rem\"\r\n            height=\"1.5rem\"\r\n            styleClass=\"mb-4\"\r\n          ></p-skeleton>\r\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"6rem\" styleClass=\"md:col-span-2\"></p-skeleton>\r\n            <p-skeleton height=\"3rem\" styleClass=\"md:col-span-2\"></p-skeleton>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\r\n          <p-skeleton\r\n            width=\"10rem\"\r\n            height=\"1.5rem\"\r\n            styleClass=\"mb-4\"\r\n          ></p-skeleton>\r\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"8rem\" styleClass=\"md:col-span-2\"></p-skeleton>\r\n          </div>\r\n        </div>\r\n      } @else {\r\n        <mt-dynamic-form\r\n          [formConfig]=\"dynamicFormConfigMain()\"\r\n          [forcedDisabledFieldKeys]=\"lockedMainFieldKeys()\"\r\n          [formControlName]=\"'main'\"\r\n        />\r\n        @if (configurationFormConfig()) {\r\n          <mt-dynamic-form\r\n            formControlName=\"configuration\"\r\n            [formConfig]=\"configurationFormConfig()!\"\r\n          />\r\n        } @else {\r\n          <ng-container #configurationHost></ng-container>\r\n          @if (!configurationComponentExists()) {\r\n            @switch (propertyType()) {\r\n              @case (\"User\") {\r\n                <mt-user-configuration />\r\n              }\r\n              @case (\"Percentage\") {\r\n                <mt-percentage-configuration />\r\n              }\r\n              @case (\"Lookup\") {\r\n                <mt-lookup-configuration />\r\n              }\r\n              @case (\"LookupMultiSelect\") {\r\n                <mt-lookup-configuration />\r\n              }\r\n              @case (\"EntityList\") {\r\n                <mt-entity-list-configuration />\r\n              }\r\n              @case (\"API\") {\r\n                <mt-api-configuration formControlName=\"configuration\" />\r\n              }\r\n              @case (\"Status\") {\r\n                <section #statusConfigurationSection>\r\n                  <mt-status-configuration\r\n                    [propertyId]=\"statusPropertyId()\"\r\n                    [contextKey]=\"formulaContextKey()\"\r\n                    [levelSchemaId]=\"formulaSchemaId()\"\r\n                    [moduleId]=\"formulaModuleId()\"\r\n                  />\r\n                </section>\r\n              }\r\n              <!-- @case('ViewList') { REMOVED FOR NOW\r\n                  <mt-view-list-configuration />\r\n                  } -->\r\n              @case (\"Attachment\") {\r\n                <mt-attachment-configuration />\r\n              }\r\n              <!-- @case('ReferenceProperty') { REMOVED FOR NOW\r\n                   } -->\r\n              @case (\"LookupModuleCheckList\") {\r\n                <mt-check-list-form-configuration />\r\n              }\r\n              <!-- @case('LookupMatrix') { REMOVED FOR NOW\r\n                  <mt-lookup-configuration />\r\n                  } -->\r\n              @case (\"Location\") {\r\n                <mt-location-configuration />\r\n              }\r\n            }\r\n          }\r\n        }\r\n        @if (isCalculated() && !hideFormulaBuilder()) {\r\n          <mt-card>\r\n            <ng-template #headless>\r\n              <div\r\n                class=\"flex items-center justify-between px-4 py-5 border-b border-surface\"\r\n              >\r\n                <h3 class=\"text-xl font-semibold\">\r\n                  {{ \"properties.form.formula\" | transloco }}\r\n                  <span class=\"text-red-500\">*</span>\r\n                </h3>\r\n              </div>\r\n              <div class=\"flex-1 min-h-0 p-4\">\r\n                <mt-formula-builder\r\n                  formControlName=\"formula\"\r\n                  [contextKey]=\"formulaContextKey()\"\r\n                  [levelSchemaId]=\"formulaSchemaId()\"\r\n                  [moduleId]=\"formulaModuleId()\"\r\n                />\r\n              </div>\r\n            </ng-template>\r\n          </mt-card>\r\n        }\r\n      }\r\n    </div>\r\n  </div>\r\n</mt-page>\r\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: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig", "forcedHiddenFieldKeys", "forcedDisabledFieldKeys", "preserveForcedHiddenValues", "visibleSectionKeys", "externalValues"], outputs: ["runtimeMessagesChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormulaBuilder, selector: "mt-formula-builder", inputs: ["propertiesByPath", "levelSchemaId", "moduleId", "contextKey", "contextEntityTypeKey", "templateId", "placeholder", "hideToolbar", "hideStatusBar", "toolbarTabs", "codeOnly", "builderOnly", "valueMode", "isProcessBuilder"], outputs: ["validationChange", "tokensChange"] }, { kind: "component", type: ApiConfiguration, selector: "mt-api-configuration" }, { kind: "component", type: CheckListFormConfiguration, selector: "mt-check-list-form-configuration" }, { kind: "component", type: EntityListConfiguration, selector: "mt-entity-list-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: StatusConfiguration, selector: "mt-status-configuration", inputs: ["propertyId", "contextKey", "levelSchemaId", "moduleId"] }, { kind: "component", type: UserConfiguration, selector: "mt-user-configuration" }, { kind: "component", type: AttachmentConfiguration, selector: "mt-attachment-configuration" }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2$1.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PropertyForm, decorators: [{
             type: Component,
@@ -3065,7 +3125,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
                         AttachmentConfiguration,
                         SkeletonModule,
                         TranslocoModule,
-                    ], template: "<mt-page\r\n  [title]=\"\r\n    propertyId()\r\n      ? ('properties.form.editProperty' | transloco)\r\n      : ('properties.form.createNewProperty' | transloco)\r\n  \"\r\n  avatarIcon=\"custom.products-and-services\"\r\n  [avatarStyle]=\"{\r\n    '--p-avatar-background': 'var(--p-sky-50)',\r\n    '--p-avatar-color': 'var(--p-sky-700)',\r\n  }\"\r\n  (backButtonClick)=\"goBack()\"\r\n  backButton\r\n  class=\"h-full\"\r\n>\r\n  <ng-template #headerEnd>\r\n    <mt-button\r\n      class=\"mx-2\"\r\n      [label]=\"submitLabel()\"\r\n      [icon]=\"isEditing() ? 'custom.pencil' : 'general.plus'\"\r\n      [loading]=\"submitting()\"\r\n      [disabled]=\"submitDisabled() || this.propertyForm.invalid\"\r\n      (click)=\"createOrEditProperty($event)\"\r\n    />\r\n  </ng-template>\r\n  <div\r\n    [formGroup]=\"propertyForm\"\r\n    class=\"h-full py-4 h-full overflow-y-auto flex justify-center\"\r\n  >\r\n    <div class=\"w-2/3 flex flex-col gap-6\">\r\n      @if (loading()) {\r\n        <!-- Skeleton Loading State -->\r\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\r\n          <div class=\"flex justify-between items-center gap-6\">\r\n            <p-skeleton width=\"50%\" height=\"3rem\"></p-skeleton>\r\n            <p-skeleton width=\"8rem\" height=\"2.5rem\"></p-skeleton>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\r\n          <p-skeleton\r\n            width=\"12rem\"\r\n            height=\"1.5rem\"\r\n            styleClass=\"mb-4\"\r\n          ></p-skeleton>\r\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"6rem\" styleClass=\"md:col-span-2\"></p-skeleton>\r\n            <p-skeleton height=\"3rem\" styleClass=\"md:col-span-2\"></p-skeleton>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\r\n          <p-skeleton\r\n            width=\"10rem\"\r\n            height=\"1.5rem\"\r\n            styleClass=\"mb-4\"\r\n          ></p-skeleton>\r\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"8rem\" styleClass=\"md:col-span-2\"></p-skeleton>\r\n          </div>\r\n        </div>\r\n      } @else {\r\n        <mt-dynamic-form\r\n          [formConfig]=\"dynamicFormConfigMain()\"\r\n          [formControlName]=\"'main'\"\r\n        />\r\n        @if (configurationFormConfig()) {\r\n          <mt-dynamic-form\r\n            formControlName=\"configuration\"\r\n            [formConfig]=\"configurationFormConfig()!\"\r\n          />\r\n        } @else {\r\n          <ng-container #configurationHost></ng-container>\r\n          @if (!configurationComponentExists()) {\r\n            @switch (propertyType()) {\r\n              @case (\"User\") {\r\n                <mt-user-configuration />\r\n              }\r\n              @case (\"Percentage\") {\r\n                <mt-percentage-configuration />\r\n              }\r\n              @case (\"Lookup\") {\r\n                <mt-lookup-configuration />\r\n              }\r\n              @case (\"LookupMultiSelect\") {\r\n                <mt-lookup-configuration />\r\n              }\r\n              @case (\"EntityList\") {\r\n                <mt-entity-list-configuration />\r\n              }\r\n              @case (\"API\") {\r\n                <mt-api-configuration formControlName=\"configuration\" />\r\n              }\r\n              @case (\"Status\") {\r\n                <section #statusConfigurationSection>\r\n                  <mt-status-configuration\r\n                    [propertyId]=\"statusPropertyId()\"\r\n                    [contextKey]=\"formulaContextKey()\"\r\n                    [levelSchemaId]=\"formulaSchemaId()\"\r\n                    [moduleId]=\"formulaModuleId()\"\r\n                  />\r\n                </section>\r\n              }\r\n              <!-- @case('ViewList') { REMOVED FOR NOW\r\n                  <mt-view-list-configuration />\r\n                  } -->\r\n              @case (\"Attachment\") {\r\n                <mt-attachment-configuration />\r\n              }\r\n              <!-- @case('ReferenceProperty') { REMOVED FOR NOW\r\n                   } -->\r\n              @case (\"LookupModuleCheckList\") {\r\n                <mt-check-list-form-configuration />\r\n              }\r\n              <!-- @case('LookupMatrix') { REMOVED FOR NOW\r\n                  <mt-lookup-configuration />\r\n                  } -->\r\n              @case (\"Location\") {\r\n                <mt-location-configuration />\r\n              }\r\n            }\r\n          }\r\n        }\r\n        @if (isCalculated() && !hideFormulaBuilder()) {\r\n          <mt-card>\r\n            <ng-template #headless>\r\n              <div\r\n                class=\"flex items-center justify-between px-4 py-5 border-b border-surface\"\r\n              >\r\n                <h3 class=\"text-xl font-semibold\">\r\n                  {{ \"properties.form.formula\" | transloco }}\r\n                  <span class=\"text-red-500\">*</span>\r\n                </h3>\r\n              </div>\r\n              <div class=\"flex-1 min-h-0 p-4\">\r\n                <mt-formula-builder\r\n                  formControlName=\"formula\"\r\n                  [contextKey]=\"formulaContextKey()\"\r\n                  [levelSchemaId]=\"formulaSchemaId()\"\r\n                  [moduleId]=\"formulaModuleId()\"\r\n                />\r\n              </div>\r\n            </ng-template>\r\n          </mt-card>\r\n        }\r\n      }\r\n    </div>\r\n  </div>\r\n</mt-page>\r\n" }]
+                    ], template: "<mt-page\r\n  [title]=\"\r\n    propertyId()\r\n      ? ('properties.form.editProperty' | transloco)\r\n      : ('properties.form.createNewProperty' | transloco)\r\n  \"\r\n  avatarIcon=\"custom.products-and-services\"\r\n  [avatarStyle]=\"{\r\n    '--p-avatar-background': 'var(--p-sky-50)',\r\n    '--p-avatar-color': 'var(--p-sky-700)',\r\n  }\"\r\n  (backButtonClick)=\"goBack()\"\r\n  backButton\r\n  class=\"h-full\"\r\n>\r\n  <ng-template #headerEnd>\r\n    <mt-button\r\n      class=\"mx-2\"\r\n      [label]=\"submitLabel()\"\r\n      [icon]=\"isEditing() ? 'custom.pencil' : 'general.plus'\"\r\n      [loading]=\"submitting()\"\r\n      [disabled]=\"submitDisabled() || this.propertyForm.invalid\"\r\n      (click)=\"createOrEditProperty($event)\"\r\n    />\r\n  </ng-template>\r\n  <div\r\n    [formGroup]=\"propertyForm\"\r\n    class=\"h-full py-4 h-full overflow-y-auto flex justify-center\"\r\n  >\r\n    <div class=\"w-2/3 flex flex-col gap-6\">\r\n      @if (loading()) {\r\n        <!-- Skeleton Loading State -->\r\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\r\n          <div class=\"flex justify-between items-center gap-6\">\r\n            <p-skeleton width=\"50%\" height=\"3rem\"></p-skeleton>\r\n            <p-skeleton width=\"8rem\" height=\"2.5rem\"></p-skeleton>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\r\n          <p-skeleton\r\n            width=\"12rem\"\r\n            height=\"1.5rem\"\r\n            styleClass=\"mb-4\"\r\n          ></p-skeleton>\r\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"6rem\" styleClass=\"md:col-span-2\"></p-skeleton>\r\n            <p-skeleton height=\"3rem\" styleClass=\"md:col-span-2\"></p-skeleton>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\r\n          <p-skeleton\r\n            width=\"10rem\"\r\n            height=\"1.5rem\"\r\n            styleClass=\"mb-4\"\r\n          ></p-skeleton>\r\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"3rem\"></p-skeleton>\r\n            <p-skeleton height=\"8rem\" styleClass=\"md:col-span-2\"></p-skeleton>\r\n          </div>\r\n        </div>\r\n      } @else {\r\n        <mt-dynamic-form\r\n          [formConfig]=\"dynamicFormConfigMain()\"\r\n          [forcedDisabledFieldKeys]=\"lockedMainFieldKeys()\"\r\n          [formControlName]=\"'main'\"\r\n        />\r\n        @if (configurationFormConfig()) {\r\n          <mt-dynamic-form\r\n            formControlName=\"configuration\"\r\n            [formConfig]=\"configurationFormConfig()!\"\r\n          />\r\n        } @else {\r\n          <ng-container #configurationHost></ng-container>\r\n          @if (!configurationComponentExists()) {\r\n            @switch (propertyType()) {\r\n              @case (\"User\") {\r\n                <mt-user-configuration />\r\n              }\r\n              @case (\"Percentage\") {\r\n                <mt-percentage-configuration />\r\n              }\r\n              @case (\"Lookup\") {\r\n                <mt-lookup-configuration />\r\n              }\r\n              @case (\"LookupMultiSelect\") {\r\n                <mt-lookup-configuration />\r\n              }\r\n              @case (\"EntityList\") {\r\n                <mt-entity-list-configuration />\r\n              }\r\n              @case (\"API\") {\r\n                <mt-api-configuration formControlName=\"configuration\" />\r\n              }\r\n              @case (\"Status\") {\r\n                <section #statusConfigurationSection>\r\n                  <mt-status-configuration\r\n                    [propertyId]=\"statusPropertyId()\"\r\n                    [contextKey]=\"formulaContextKey()\"\r\n                    [levelSchemaId]=\"formulaSchemaId()\"\r\n                    [moduleId]=\"formulaModuleId()\"\r\n                  />\r\n                </section>\r\n              }\r\n              <!-- @case('ViewList') { REMOVED FOR NOW\r\n                  <mt-view-list-configuration />\r\n                  } -->\r\n              @case (\"Attachment\") {\r\n                <mt-attachment-configuration />\r\n              }\r\n              <!-- @case('ReferenceProperty') { REMOVED FOR NOW\r\n                   } -->\r\n              @case (\"LookupModuleCheckList\") {\r\n                <mt-check-list-form-configuration />\r\n              }\r\n              <!-- @case('LookupMatrix') { REMOVED FOR NOW\r\n                  <mt-lookup-configuration />\r\n                  } -->\r\n              @case (\"Location\") {\r\n                <mt-location-configuration />\r\n              }\r\n            }\r\n          }\r\n        }\r\n        @if (isCalculated() && !hideFormulaBuilder()) {\r\n          <mt-card>\r\n            <ng-template #headless>\r\n              <div\r\n                class=\"flex items-center justify-between px-4 py-5 border-b border-surface\"\r\n              >\r\n                <h3 class=\"text-xl font-semibold\">\r\n                  {{ \"properties.form.formula\" | transloco }}\r\n                  <span class=\"text-red-500\">*</span>\r\n                </h3>\r\n              </div>\r\n              <div class=\"flex-1 min-h-0 p-4\">\r\n                <mt-formula-builder\r\n                  formControlName=\"formula\"\r\n                  [contextKey]=\"formulaContextKey()\"\r\n                  [levelSchemaId]=\"formulaSchemaId()\"\r\n                  [moduleId]=\"formulaModuleId()\"\r\n                />\r\n              </div>\r\n            </ng-template>\r\n          </mt-card>\r\n        }\r\n      }\r\n    </div>\r\n  </div>\r\n</mt-page>\r\n" }]
         }], ctorParameters: () => [], propDecorators: { propertyId: [{ type: i0.Input, args: [{ isSignal: true, alias: "propertyId", required: false }] }], scope: [{ type: i0.Input, args: [{ isSignal: true, alias: "scope", required: false }] }], configurationHost: [{
                 type: ViewChild,
                 args: ['configurationHost', { read: ViewContainerRef }]