@masterteam/properties 0.0.13 → 0.0.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, Injectable, computed, signal, Component, DestroyRef, effect, forwardRef, ChangeDetectionStrategy,
|
|
2
|
+
import { inject, Injectable, computed, input, signal, linkedSignal, Component, DestroyRef, effect, forwardRef, ChangeDetectionStrategy, EnvironmentInjector, ViewContainerRef, ViewChild } from '@angular/core';
|
|
3
3
|
import { CommonModule } from '@angular/common';
|
|
4
4
|
import { Table } from '@masterteam/components/table';
|
|
5
5
|
import { Router, ActivatedRoute } from '@angular/router';
|
|
@@ -10,13 +10,12 @@ import { tap, catchError, finalize, switchMap } from 'rxjs/operators';
|
|
|
10
10
|
import { Breadcrumb } from '@masterteam/components/breadcrumb';
|
|
11
11
|
import { Card } from '@masterteam/components/card';
|
|
12
12
|
import { Avatar } from '@masterteam/components/avatar';
|
|
13
|
-
import
|
|
14
|
-
import { DividerModule } from 'primeng/divider';
|
|
13
|
+
import { Divider } from 'primeng/divider';
|
|
15
14
|
import { Button } from '@masterteam/components/button';
|
|
16
15
|
import { toSignal } from '@angular/core/rxjs-interop';
|
|
17
16
|
import { DynamicForm } from '@masterteam/forms/dynamic-form';
|
|
18
17
|
import { PickListFieldConfig, ValidatorConfig } from '@masterteam/components';
|
|
19
|
-
import * as i1
|
|
18
|
+
import * as i1 from '@angular/forms';
|
|
20
19
|
import { FormGroup, FormControl, FormArray, Validators, ReactiveFormsModule, NG_VALUE_ACCESSOR, ControlContainer, FormGroupDirective } from '@angular/forms';
|
|
21
20
|
import * as i2 from 'primeng/skeleton';
|
|
22
21
|
import { SkeletonModule } from 'primeng/skeleton';
|
|
@@ -760,12 +759,16 @@ class PropertiesList {
|
|
|
760
759
|
facade = inject(PropertiesFacade);
|
|
761
760
|
router = inject(Router);
|
|
762
761
|
route = inject(ActivatedRoute);
|
|
762
|
+
defaultTab = 'all';
|
|
763
|
+
tab = input(...(ngDevMode ? [undefined, { debugName: "tab" }] : []));
|
|
763
764
|
tabs = signal([
|
|
764
765
|
{ label: 'All', value: 'all' },
|
|
765
766
|
{ label: 'System', value: 'system' },
|
|
766
767
|
{ label: 'Custom', value: 'custom' },
|
|
767
768
|
], ...(ngDevMode ? [{ debugName: "tabs" }] : []));
|
|
768
|
-
activeTab =
|
|
769
|
+
activeTab = linkedSignal(() => {
|
|
770
|
+
return this.tab() || this.defaultTab;
|
|
771
|
+
});
|
|
769
772
|
tableColumns = signal([
|
|
770
773
|
{ key: 'title', label: 'Name' },
|
|
771
774
|
{ key: 'viewType', label: 'Type' },
|
|
@@ -854,9 +857,7 @@ class PropertiesList {
|
|
|
854
857
|
if (!row?.id) {
|
|
855
858
|
return;
|
|
856
859
|
}
|
|
857
|
-
this.
|
|
858
|
-
relativeTo: this.route,
|
|
859
|
-
});
|
|
860
|
+
this.navigatePreservingTab(['../properties-form', row.id]);
|
|
860
861
|
}
|
|
861
862
|
deleteRow(row) {
|
|
862
863
|
if (!row?.id) {
|
|
@@ -865,28 +866,39 @@ class PropertiesList {
|
|
|
865
866
|
this.facade.delete(row.id);
|
|
866
867
|
}
|
|
867
868
|
createProperty() {
|
|
868
|
-
this.
|
|
869
|
-
relativeTo: this.route,
|
|
870
|
-
});
|
|
869
|
+
this.navigatePreservingTab(['../properties-form']);
|
|
871
870
|
}
|
|
872
871
|
createPropertyWithType(viewType) {
|
|
873
872
|
this.facade.setDefaultViewType(viewType);
|
|
874
873
|
this.createProperty();
|
|
875
874
|
}
|
|
875
|
+
onTabChange(tab) {
|
|
876
|
+
const currentTab = tab;
|
|
877
|
+
if (currentTab != this.tab()) {
|
|
878
|
+
this.updateTabQueryParam(currentTab);
|
|
879
|
+
}
|
|
880
|
+
}
|
|
881
|
+
updateTabQueryParam(tab) {
|
|
882
|
+
this.router.navigate([], {
|
|
883
|
+
relativeTo: this.route,
|
|
884
|
+
queryParams: { tab },
|
|
885
|
+
queryParamsHandling: 'merge',
|
|
886
|
+
replaceUrl: true,
|
|
887
|
+
});
|
|
888
|
+
}
|
|
889
|
+
navigatePreservingTab(commands) {
|
|
890
|
+
this.router.navigate(commands, {
|
|
891
|
+
relativeTo: this.route,
|
|
892
|
+
queryParams: { tab: this.activeTab() },
|
|
893
|
+
queryParamsHandling: 'merge',
|
|
894
|
+
});
|
|
895
|
+
}
|
|
876
896
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: PropertiesList, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
877
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: PropertiesList, isStandalone: true, selector: "mt-properties-list", ngImport: i0, template: "<div class=\"space-y-3\">\n <div class=\"flex items-center justify-between\">\n <div class=\"space-y-1\">\n <h1 class=\"text-xl font-semibold text-slate-900 tracking-tight\">\n All Properties\n </h1>\n <mt-breadcrumb\n [items]=\"breadcrumbItems()\"\n [styleClass]=\"'flex justify-center'\"\n >\n </mt-breadcrumb>\n </div>\n </div>\n <mt-table\n [tabs]=\"tabs()\"\n [(activeTab)]=\"activeTab\"\n [data]=\"tableData()\"\n [actions]=\"tableActions()\"\n [columns]=\"tableColumns()\"\n [rowActions]=\"rowActions()\"\n [generalSearch]=\"true\"\n [loading]=\"loading()\"\n >\n <ng-template #empty>\n <div headless class=\"flex-col justify-center items-center w-full p-5\">\n <div class=\"content flex flex-col gap-5 items-center text-center mb-5\">\n <svg\n width=\"152\"\n height=\"120\"\n viewBox=\"0 0 152 120\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle cx=\"76\" cy=\"52\" r=\"52\" fill=\"#E9EAEB\" />\n <g filter=\"url(#filter0_ddd_2474_28277)\">\n <path\n d=\"M77.6 16C66.8273 16 57.2978 21.3233 51.4987 29.4829C49.605 29.0363 47.6301 28.8 45.6 28.8C31.4615 28.8 20 40.2615 20 54.4C20 68.5385 31.4615 80 45.6 80L109.6 80C121.971 80 132 69.9712 132 57.6C132 45.2288 121.971 35.2 109.6 35.2C108.721 35.2 107.854 35.2506 107.002 35.349C102.098 23.9677 90.7797 16 77.6 16Z\"\n fill=\"#FAFAFA\"\n />\n <ellipse\n cx=\"45.6\"\n cy=\"54.3998\"\n rx=\"25.6\"\n ry=\"25.6\"\n fill=\"url(#paint0_linear_2474_28277)\"\n />\n <circle\n cx=\"77.6016\"\n cy=\"48\"\n r=\"32\"\n fill=\"url(#paint1_linear_2474_28277)\"\n />\n <ellipse\n cx=\"109.599\"\n cy=\"57.6002\"\n rx=\"22.4\"\n ry=\"22.4\"\n fill=\"url(#paint2_linear_2474_28277)\"\n />\n </g>\n <circle cx=\"21\" cy=\"19\" r=\"5\" fill=\"#F5F5F5\" />\n <circle cx=\"18\" cy=\"109\" r=\"7\" fill=\"#F5F5F5\" />\n <circle cx=\"145\" cy=\"35\" r=\"7\" fill=\"#F5F5F5\" />\n <circle cx=\"134\" cy=\"8\" r=\"4\" fill=\"#F5F5F5\" />\n <foreignObject x=\"44\" y=\"54\" width=\"64\" height=\"64\">\n <div\n xmlns=\"http://www.w3.org/1999/xhtml\"\n style=\"\n backdrop-filter: blur(4px);\n clip-path: url(#bgblur_0_2474_28277_clip_path);\n height: 100%;\n width: 100%;\n \"\n ></div>\n </foreignObject>\n <g data-figma-bg-blur-radius=\"8\">\n <path\n d=\"M52 86C52 72.7452 62.7452 62 76 62C89.2548 62 100 72.7452 100 86C100 99.2548 89.2548 110 76 110C62.7452 110 52 99.2548 52 86Z\"\n fill=\"#344054\"\n fill-opacity=\"0.4\"\n />\n <path\n d=\"M85 95L81.5001 91.5M84 85.5C84 90.1944 80.1944 94 75.5 94C70.8056 94 67 90.1944 67 85.5C67 80.8056 70.8056 77 75.5 77C80.1944 77 84 80.8056 84 85.5Z\"\n stroke=\"white\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </g>\n <defs>\n <filter\n id=\"filter0_ddd_2474_28277\"\n x=\"0\"\n y=\"16\"\n width=\"152\"\n height=\"104\"\n filterUnits=\"userSpaceOnUse\"\n color-interpolation-filters=\"sRGB\"\n >\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\n <feColorMatrix\n in=\"SourceAlpha\"\n type=\"matrix\"\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n result=\"hardAlpha\"\n />\n <feMorphology\n radius=\"1.5\"\n operator=\"erode\"\n in=\"SourceAlpha\"\n result=\"effect1_dropShadow_2474_28277\"\n />\n <feOffset dy=\"3\" />\n <feGaussianBlur stdDeviation=\"1.5\" />\n <feComposite in2=\"hardAlpha\" operator=\"out\" />\n <feColorMatrix\n type=\"matrix\"\n values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.04 0\"\n />\n <feBlend\n mode=\"normal\"\n in2=\"BackgroundImageFix\"\n result=\"effect1_dropShadow_2474_28277\"\n />\n <feColorMatrix\n in=\"SourceAlpha\"\n type=\"matrix\"\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n result=\"hardAlpha\"\n />\n <feMorphology\n radius=\"4\"\n operator=\"erode\"\n in=\"SourceAlpha\"\n result=\"effect2_dropShadow_2474_28277\"\n />\n <feOffset dy=\"8\" />\n <feGaussianBlur stdDeviation=\"4\" />\n <feComposite in2=\"hardAlpha\" operator=\"out\" />\n <feColorMatrix\n type=\"matrix\"\n values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.03 0\"\n />\n <feBlend\n mode=\"normal\"\n in2=\"effect1_dropShadow_2474_28277\"\n result=\"effect2_dropShadow_2474_28277\"\n />\n <feColorMatrix\n in=\"SourceAlpha\"\n type=\"matrix\"\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n result=\"hardAlpha\"\n />\n <feMorphology\n radius=\"4\"\n operator=\"erode\"\n in=\"SourceAlpha\"\n result=\"effect3_dropShadow_2474_28277\"\n />\n <feOffset dy=\"20\" />\n <feGaussianBlur stdDeviation=\"12\" />\n <feComposite in2=\"hardAlpha\" operator=\"out\" />\n <feColorMatrix\n type=\"matrix\"\n values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.08 0\"\n />\n <feBlend\n mode=\"normal\"\n in2=\"effect2_dropShadow_2474_28277\"\n result=\"effect3_dropShadow_2474_28277\"\n />\n <feBlend\n mode=\"normal\"\n in=\"SourceGraphic\"\n in2=\"effect3_dropShadow_2474_28277\"\n result=\"shape\"\n />\n </filter>\n <clipPath\n id=\"bgblur_0_2474_28277_clip_path\"\n transform=\"translate(-44 -54)\"\n >\n <path\n d=\"M52 86C52 72.7452 62.7452 62 76 62C89.2548 62 100 72.7452 100 86C100 99.2548 89.2548 110 76 110C62.7452 110 52 99.2548 52 86Z\"\n />\n </clipPath>\n <linearGradient\n id=\"paint0_linear_2474_28277\"\n x1=\"25.9429\"\n y1=\"37.4855\"\n x2=\"71.2\"\n y2=\"79.9998\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stop-color=\"#D0D5DD\" />\n <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n </linearGradient>\n <linearGradient\n id=\"paint1_linear_2474_28277\"\n x1=\"53.0301\"\n y1=\"26.8571\"\n x2=\"109.602\"\n y2=\"80\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stop-color=\"#D0D5DD\" />\n <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n </linearGradient>\n <linearGradient\n id=\"paint2_linear_2474_28277\"\n x1=\"92.3992\"\n y1=\"42.8002\"\n x2=\"131.999\"\n y2=\"80.0002\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stop-color=\"#D0D5DD\" />\n <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n </linearGradient>\n </defs>\n </svg>\n\n <div class=\"flex flex-col gap-1\">\n <div class=\"text-md text-surface-600\">{{ \"No data to show\" }}</div>\n </div>\n <div>\n <mt-button\n label=\"Add New Property\"\n icon=\"general.plus\"\n (click)=\"createProperty()\"\n />\n </div>\n </div>\n <p-divider type=\"solid\">\n <div class=\"text-lg text-surface-600\">Create from Type Template</div>\n </p-divider>\n <div class=\"flex gap-3 mt-5 justify-center\">\n @for (card of propertyTypes(); track card.label) {\n <mt-card\n headless\n class=\"w-25 tailwind-4 cursor-pointer\"\n style=\"background-color: #fafafa\"\n (click)=\"createPropertyWithType(card.value)\"\n >\n <div class=\"content flex flex-col gap-3 items-center text-center\">\n <mt-avatar\n [style.--p-avatar-background]=\"\n 'var(--p-' + card.color + '-100)'\n \"\n [style.--p-avatar-color]=\"'var(--p-' + card.color + '-600)'\"\n [icon]=\"card.icon\"\n shape=\"square\"\n ></mt-avatar>\n <div class=\"flex flex-col gap-1\">\n <div class=\"text-xs font-normal\">{{ card.label }}</div>\n </div>\n </div>\n </mt-card>\n }\n </div>\n </div>\n </ng-template>\n </mt-table>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Table, selector: "mt-table", inputs: ["data", "columns", "rowActions", "size", "showGridlines", "stripedRows", "selectableRows", "generalSearch", "showFilters", "loading", "tabs", "tabsOptionLabel", "tabsOptionValue", "activeTab", "actions", "paginatorPosition", "pageSize", "currentPage", "first", "filterTerm"], outputs: ["selectionChange", "cellChange", "activeTabChange", "onTabChange", "pageSizeChange", "currentPageChange", "firstChange", "filterTermChange"] }, { kind: "component", type: Breadcrumb, selector: "mt-breadcrumb", inputs: ["items", "styleClass"], outputs: ["onItemClick"] }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: Avatar, selector: "mt-avatar", inputs: ["label", "icon", "image", "styleClass", "size", "shape", "badge", "badgeSize", "badgeSeverity"], outputs: ["onImageError"] }, { kind: "ngmodule", type: DividerModule }, { kind: "component", type: i1.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"] }] });
|
|
897
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: PropertiesList, isStandalone: true, selector: "mt-properties-list", inputs: { tab: { classPropertyName: "tab", publicName: "tab", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"space-y-3\">\n <div class=\"flex items-center justify-between\">\n <div class=\"space-y-1\">\n <h1 class=\"text-xl font-semibold text-slate-900 tracking-tight\">\n All Properties\n </h1>\n <mt-breadcrumb\n [items]=\"breadcrumbItems()\"\n [styleClass]=\"'flex justify-center'\"\n >\n </mt-breadcrumb>\n </div>\n </div>\n <mt-table\n [tabs]=\"tabs()\"\n [(activeTab)]=\"activeTab\"\n (onTabChange)=\"onTabChange($event)\"\n [data]=\"tableData()\"\n [actions]=\"tableActions()\"\n [columns]=\"tableColumns()\"\n [rowActions]=\"rowActions()\"\n [generalSearch]=\"true\"\n [loading]=\"loading()\"\n >\n <ng-template #empty>\n <div headless class=\"flex-col justify-center items-center w-full p-5\">\n <div class=\"content flex flex-col gap-5 items-center text-center mb-5\">\n <svg\n width=\"152\"\n height=\"120\"\n viewBox=\"0 0 152 120\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle cx=\"76\" cy=\"52\" r=\"52\" fill=\"#E9EAEB\" />\n <g filter=\"url(#filter0_ddd_2474_28277)\">\n <path\n d=\"M77.6 16C66.8273 16 57.2978 21.3233 51.4987 29.4829C49.605 29.0363 47.6301 28.8 45.6 28.8C31.4615 28.8 20 40.2615 20 54.4C20 68.5385 31.4615 80 45.6 80L109.6 80C121.971 80 132 69.9712 132 57.6C132 45.2288 121.971 35.2 109.6 35.2C108.721 35.2 107.854 35.2506 107.002 35.349C102.098 23.9677 90.7797 16 77.6 16Z\"\n fill=\"#FAFAFA\"\n />\n <ellipse\n cx=\"45.6\"\n cy=\"54.3998\"\n rx=\"25.6\"\n ry=\"25.6\"\n fill=\"url(#paint0_linear_2474_28277)\"\n />\n <circle\n cx=\"77.6016\"\n cy=\"48\"\n r=\"32\"\n fill=\"url(#paint1_linear_2474_28277)\"\n />\n <ellipse\n cx=\"109.599\"\n cy=\"57.6002\"\n rx=\"22.4\"\n ry=\"22.4\"\n fill=\"url(#paint2_linear_2474_28277)\"\n />\n </g>\n <circle cx=\"21\" cy=\"19\" r=\"5\" fill=\"#F5F5F5\" />\n <circle cx=\"18\" cy=\"109\" r=\"7\" fill=\"#F5F5F5\" />\n <circle cx=\"145\" cy=\"35\" r=\"7\" fill=\"#F5F5F5\" />\n <circle cx=\"134\" cy=\"8\" r=\"4\" fill=\"#F5F5F5\" />\n <foreignObject x=\"44\" y=\"54\" width=\"64\" height=\"64\">\n <div\n xmlns=\"http://www.w3.org/1999/xhtml\"\n style=\"\n backdrop-filter: blur(4px);\n clip-path: url(#bgblur_0_2474_28277_clip_path);\n height: 100%;\n width: 100%;\n \"\n ></div>\n </foreignObject>\n <g data-figma-bg-blur-radius=\"8\">\n <path\n d=\"M52 86C52 72.7452 62.7452 62 76 62C89.2548 62 100 72.7452 100 86C100 99.2548 89.2548 110 76 110C62.7452 110 52 99.2548 52 86Z\"\n fill=\"#344054\"\n fill-opacity=\"0.4\"\n />\n <path\n d=\"M85 95L81.5001 91.5M84 85.5C84 90.1944 80.1944 94 75.5 94C70.8056 94 67 90.1944 67 85.5C67 80.8056 70.8056 77 75.5 77C80.1944 77 84 80.8056 84 85.5Z\"\n stroke=\"white\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </g>\n <defs>\n <filter\n id=\"filter0_ddd_2474_28277\"\n x=\"0\"\n y=\"16\"\n width=\"152\"\n height=\"104\"\n filterUnits=\"userSpaceOnUse\"\n color-interpolation-filters=\"sRGB\"\n >\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\n <feColorMatrix\n in=\"SourceAlpha\"\n type=\"matrix\"\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n result=\"hardAlpha\"\n />\n <feMorphology\n radius=\"1.5\"\n operator=\"erode\"\n in=\"SourceAlpha\"\n result=\"effect1_dropShadow_2474_28277\"\n />\n <feOffset dy=\"3\" />\n <feGaussianBlur stdDeviation=\"1.5\" />\n <feComposite in2=\"hardAlpha\" operator=\"out\" />\n <feColorMatrix\n type=\"matrix\"\n values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.04 0\"\n />\n <feBlend\n mode=\"normal\"\n in2=\"BackgroundImageFix\"\n result=\"effect1_dropShadow_2474_28277\"\n />\n <feColorMatrix\n in=\"SourceAlpha\"\n type=\"matrix\"\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n result=\"hardAlpha\"\n />\n <feMorphology\n radius=\"4\"\n operator=\"erode\"\n in=\"SourceAlpha\"\n result=\"effect2_dropShadow_2474_28277\"\n />\n <feOffset dy=\"8\" />\n <feGaussianBlur stdDeviation=\"4\" />\n <feComposite in2=\"hardAlpha\" operator=\"out\" />\n <feColorMatrix\n type=\"matrix\"\n values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.03 0\"\n />\n <feBlend\n mode=\"normal\"\n in2=\"effect1_dropShadow_2474_28277\"\n result=\"effect2_dropShadow_2474_28277\"\n />\n <feColorMatrix\n in=\"SourceAlpha\"\n type=\"matrix\"\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n result=\"hardAlpha\"\n />\n <feMorphology\n radius=\"4\"\n operator=\"erode\"\n in=\"SourceAlpha\"\n result=\"effect3_dropShadow_2474_28277\"\n />\n <feOffset dy=\"20\" />\n <feGaussianBlur stdDeviation=\"12\" />\n <feComposite in2=\"hardAlpha\" operator=\"out\" />\n <feColorMatrix\n type=\"matrix\"\n values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.08 0\"\n />\n <feBlend\n mode=\"normal\"\n in2=\"effect2_dropShadow_2474_28277\"\n result=\"effect3_dropShadow_2474_28277\"\n />\n <feBlend\n mode=\"normal\"\n in=\"SourceGraphic\"\n in2=\"effect3_dropShadow_2474_28277\"\n result=\"shape\"\n />\n </filter>\n <clipPath\n id=\"bgblur_0_2474_28277_clip_path\"\n transform=\"translate(-44 -54)\"\n >\n <path\n d=\"M52 86C52 72.7452 62.7452 62 76 62C89.2548 62 100 72.7452 100 86C100 99.2548 89.2548 110 76 110C62.7452 110 52 99.2548 52 86Z\"\n />\n </clipPath>\n <linearGradient\n id=\"paint0_linear_2474_28277\"\n x1=\"25.9429\"\n y1=\"37.4855\"\n x2=\"71.2\"\n y2=\"79.9998\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stop-color=\"#D0D5DD\" />\n <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n </linearGradient>\n <linearGradient\n id=\"paint1_linear_2474_28277\"\n x1=\"53.0301\"\n y1=\"26.8571\"\n x2=\"109.602\"\n y2=\"80\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stop-color=\"#D0D5DD\" />\n <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n </linearGradient>\n <linearGradient\n id=\"paint2_linear_2474_28277\"\n x1=\"92.3992\"\n y1=\"42.8002\"\n x2=\"131.999\"\n y2=\"80.0002\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stop-color=\"#D0D5DD\" />\n <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n </linearGradient>\n </defs>\n </svg>\n\n <div class=\"flex flex-col gap-1\">\n <div class=\"text-md text-surface-600\">{{ \"No data to show\" }}</div>\n </div>\n <div>\n <mt-button\n label=\"Add New Property\"\n icon=\"general.plus\"\n (click)=\"createProperty()\"\n />\n </div>\n </div>\n <p-divider type=\"solid\">\n <div class=\"text-lg text-surface-600\">Create from Type Template</div>\n </p-divider>\n <div class=\"flex gap-3 mt-5 justify-center\">\n @for (card of propertyTypes(); track card.label) {\n <mt-card\n headless\n class=\"w-25 tailwind-4 cursor-pointer\"\n style=\"background-color: #fafafa\"\n (click)=\"createPropertyWithType(card.value)\"\n >\n <div class=\"content flex flex-col gap-3 items-center text-center\">\n <mt-avatar\n [style.--p-avatar-background]=\"\n 'var(--p-' + card.color + '-100)'\n \"\n [style.--p-avatar-color]=\"'var(--p-' + card.color + '-600)'\"\n [icon]=\"card.icon\"\n shape=\"square\"\n ></mt-avatar>\n <div class=\"flex flex-col gap-1\">\n <div class=\"text-xs font-normal\">{{ card.label }}</div>\n </div>\n </div>\n </mt-card>\n }\n </div>\n </div>\n </ng-template>\n </mt-table>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Table, selector: "mt-table", inputs: ["data", "columns", "rowActions", "size", "showGridlines", "stripedRows", "selectableRows", "generalSearch", "showFilters", "loading", "tabs", "tabsOptionLabel", "tabsOptionValue", "activeTab", "actions", "paginatorPosition", "pageSize", "currentPage", "first", "filterTerm"], outputs: ["selectionChange", "cellChange", "activeTabChange", "onTabChange", "pageSizeChange", "currentPageChange", "firstChange", "filterTermChange"] }, { kind: "component", type: Breadcrumb, selector: "mt-breadcrumb", inputs: ["items", "styleClass"], outputs: ["onItemClick"] }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: Avatar, selector: "mt-avatar", inputs: ["label", "icon", "image", "styleClass", "size", "shape", "badge", "badgeSize", "badgeSeverity"], outputs: ["onImageError"] }, { kind: "component", type: Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }] });
|
|
878
898
|
}
|
|
879
899
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: PropertiesList, decorators: [{
|
|
880
900
|
type: Component,
|
|
881
|
-
args: [{ selector: 'mt-properties-list', standalone: true, imports: [
|
|
882
|
-
CommonModule,
|
|
883
|
-
Table,
|
|
884
|
-
Breadcrumb,
|
|
885
|
-
Card,
|
|
886
|
-
Avatar,
|
|
887
|
-
DividerModule,
|
|
888
|
-
Button,
|
|
889
|
-
], template: "<div class=\"space-y-3\">\n <div class=\"flex items-center justify-between\">\n <div class=\"space-y-1\">\n <h1 class=\"text-xl font-semibold text-slate-900 tracking-tight\">\n All Properties\n </h1>\n <mt-breadcrumb\n [items]=\"breadcrumbItems()\"\n [styleClass]=\"'flex justify-center'\"\n >\n </mt-breadcrumb>\n </div>\n </div>\n <mt-table\n [tabs]=\"tabs()\"\n [(activeTab)]=\"activeTab\"\n [data]=\"tableData()\"\n [actions]=\"tableActions()\"\n [columns]=\"tableColumns()\"\n [rowActions]=\"rowActions()\"\n [generalSearch]=\"true\"\n [loading]=\"loading()\"\n >\n <ng-template #empty>\n <div headless class=\"flex-col justify-center items-center w-full p-5\">\n <div class=\"content flex flex-col gap-5 items-center text-center mb-5\">\n <svg\n width=\"152\"\n height=\"120\"\n viewBox=\"0 0 152 120\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle cx=\"76\" cy=\"52\" r=\"52\" fill=\"#E9EAEB\" />\n <g filter=\"url(#filter0_ddd_2474_28277)\">\n <path\n d=\"M77.6 16C66.8273 16 57.2978 21.3233 51.4987 29.4829C49.605 29.0363 47.6301 28.8 45.6 28.8C31.4615 28.8 20 40.2615 20 54.4C20 68.5385 31.4615 80 45.6 80L109.6 80C121.971 80 132 69.9712 132 57.6C132 45.2288 121.971 35.2 109.6 35.2C108.721 35.2 107.854 35.2506 107.002 35.349C102.098 23.9677 90.7797 16 77.6 16Z\"\n fill=\"#FAFAFA\"\n />\n <ellipse\n cx=\"45.6\"\n cy=\"54.3998\"\n rx=\"25.6\"\n ry=\"25.6\"\n fill=\"url(#paint0_linear_2474_28277)\"\n />\n <circle\n cx=\"77.6016\"\n cy=\"48\"\n r=\"32\"\n fill=\"url(#paint1_linear_2474_28277)\"\n />\n <ellipse\n cx=\"109.599\"\n cy=\"57.6002\"\n rx=\"22.4\"\n ry=\"22.4\"\n fill=\"url(#paint2_linear_2474_28277)\"\n />\n </g>\n <circle cx=\"21\" cy=\"19\" r=\"5\" fill=\"#F5F5F5\" />\n <circle cx=\"18\" cy=\"109\" r=\"7\" fill=\"#F5F5F5\" />\n <circle cx=\"145\" cy=\"35\" r=\"7\" fill=\"#F5F5F5\" />\n <circle cx=\"134\" cy=\"8\" r=\"4\" fill=\"#F5F5F5\" />\n <foreignObject x=\"44\" y=\"54\" width=\"64\" height=\"64\">\n <div\n xmlns=\"http://www.w3.org/1999/xhtml\"\n style=\"\n backdrop-filter: blur(4px);\n clip-path: url(#bgblur_0_2474_28277_clip_path);\n height: 100%;\n width: 100%;\n \"\n ></div>\n </foreignObject>\n <g data-figma-bg-blur-radius=\"8\">\n <path\n d=\"M52 86C52 72.7452 62.7452 62 76 62C89.2548 62 100 72.7452 100 86C100 99.2548 89.2548 110 76 110C62.7452 110 52 99.2548 52 86Z\"\n fill=\"#344054\"\n fill-opacity=\"0.4\"\n />\n <path\n d=\"M85 95L81.5001 91.5M84 85.5C84 90.1944 80.1944 94 75.5 94C70.8056 94 67 90.1944 67 85.5C67 80.8056 70.8056 77 75.5 77C80.1944 77 84 80.8056 84 85.5Z\"\n stroke=\"white\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </g>\n <defs>\n <filter\n id=\"filter0_ddd_2474_28277\"\n x=\"0\"\n y=\"16\"\n width=\"152\"\n height=\"104\"\n filterUnits=\"userSpaceOnUse\"\n color-interpolation-filters=\"sRGB\"\n >\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\n <feColorMatrix\n in=\"SourceAlpha\"\n type=\"matrix\"\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n result=\"hardAlpha\"\n />\n <feMorphology\n radius=\"1.5\"\n operator=\"erode\"\n in=\"SourceAlpha\"\n result=\"effect1_dropShadow_2474_28277\"\n />\n <feOffset dy=\"3\" />\n <feGaussianBlur stdDeviation=\"1.5\" />\n <feComposite in2=\"hardAlpha\" operator=\"out\" />\n <feColorMatrix\n type=\"matrix\"\n values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.04 0\"\n />\n <feBlend\n mode=\"normal\"\n in2=\"BackgroundImageFix\"\n result=\"effect1_dropShadow_2474_28277\"\n />\n <feColorMatrix\n in=\"SourceAlpha\"\n type=\"matrix\"\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n result=\"hardAlpha\"\n />\n <feMorphology\n radius=\"4\"\n operator=\"erode\"\n in=\"SourceAlpha\"\n result=\"effect2_dropShadow_2474_28277\"\n />\n <feOffset dy=\"8\" />\n <feGaussianBlur stdDeviation=\"4\" />\n <feComposite in2=\"hardAlpha\" operator=\"out\" />\n <feColorMatrix\n type=\"matrix\"\n values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.03 0\"\n />\n <feBlend\n mode=\"normal\"\n in2=\"effect1_dropShadow_2474_28277\"\n result=\"effect2_dropShadow_2474_28277\"\n />\n <feColorMatrix\n in=\"SourceAlpha\"\n type=\"matrix\"\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n result=\"hardAlpha\"\n />\n <feMorphology\n radius=\"4\"\n operator=\"erode\"\n in=\"SourceAlpha\"\n result=\"effect3_dropShadow_2474_28277\"\n />\n <feOffset dy=\"20\" />\n <feGaussianBlur stdDeviation=\"12\" />\n <feComposite in2=\"hardAlpha\" operator=\"out\" />\n <feColorMatrix\n type=\"matrix\"\n values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.08 0\"\n />\n <feBlend\n mode=\"normal\"\n in2=\"effect2_dropShadow_2474_28277\"\n result=\"effect3_dropShadow_2474_28277\"\n />\n <feBlend\n mode=\"normal\"\n in=\"SourceGraphic\"\n in2=\"effect3_dropShadow_2474_28277\"\n result=\"shape\"\n />\n </filter>\n <clipPath\n id=\"bgblur_0_2474_28277_clip_path\"\n transform=\"translate(-44 -54)\"\n >\n <path\n d=\"M52 86C52 72.7452 62.7452 62 76 62C89.2548 62 100 72.7452 100 86C100 99.2548 89.2548 110 76 110C62.7452 110 52 99.2548 52 86Z\"\n />\n </clipPath>\n <linearGradient\n id=\"paint0_linear_2474_28277\"\n x1=\"25.9429\"\n y1=\"37.4855\"\n x2=\"71.2\"\n y2=\"79.9998\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stop-color=\"#D0D5DD\" />\n <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n </linearGradient>\n <linearGradient\n id=\"paint1_linear_2474_28277\"\n x1=\"53.0301\"\n y1=\"26.8571\"\n x2=\"109.602\"\n y2=\"80\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stop-color=\"#D0D5DD\" />\n <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n </linearGradient>\n <linearGradient\n id=\"paint2_linear_2474_28277\"\n x1=\"92.3992\"\n y1=\"42.8002\"\n x2=\"131.999\"\n y2=\"80.0002\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stop-color=\"#D0D5DD\" />\n <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n </linearGradient>\n </defs>\n </svg>\n\n <div class=\"flex flex-col gap-1\">\n <div class=\"text-md text-surface-600\">{{ \"No data to show\" }}</div>\n </div>\n <div>\n <mt-button\n label=\"Add New Property\"\n icon=\"general.plus\"\n (click)=\"createProperty()\"\n />\n </div>\n </div>\n <p-divider type=\"solid\">\n <div class=\"text-lg text-surface-600\">Create from Type Template</div>\n </p-divider>\n <div class=\"flex gap-3 mt-5 justify-center\">\n @for (card of propertyTypes(); track card.label) {\n <mt-card\n headless\n class=\"w-25 tailwind-4 cursor-pointer\"\n style=\"background-color: #fafafa\"\n (click)=\"createPropertyWithType(card.value)\"\n >\n <div class=\"content flex flex-col gap-3 items-center text-center\">\n <mt-avatar\n [style.--p-avatar-background]=\"\n 'var(--p-' + card.color + '-100)'\n \"\n [style.--p-avatar-color]=\"'var(--p-' + card.color + '-600)'\"\n [icon]=\"card.icon\"\n shape=\"square\"\n ></mt-avatar>\n <div class=\"flex flex-col gap-1\">\n <div class=\"text-xs font-normal\">{{ card.label }}</div>\n </div>\n </div>\n </mt-card>\n }\n </div>\n </div>\n </ng-template>\n </mt-table>\n</div>\n" }]
|
|
901
|
+
args: [{ selector: 'mt-properties-list', standalone: true, imports: [CommonModule, Table, Breadcrumb, Card, Avatar, Divider, Button], template: "<div class=\"space-y-3\">\n <div class=\"flex items-center justify-between\">\n <div class=\"space-y-1\">\n <h1 class=\"text-xl font-semibold text-slate-900 tracking-tight\">\n All Properties\n </h1>\n <mt-breadcrumb\n [items]=\"breadcrumbItems()\"\n [styleClass]=\"'flex justify-center'\"\n >\n </mt-breadcrumb>\n </div>\n </div>\n <mt-table\n [tabs]=\"tabs()\"\n [(activeTab)]=\"activeTab\"\n (onTabChange)=\"onTabChange($event)\"\n [data]=\"tableData()\"\n [actions]=\"tableActions()\"\n [columns]=\"tableColumns()\"\n [rowActions]=\"rowActions()\"\n [generalSearch]=\"true\"\n [loading]=\"loading()\"\n >\n <ng-template #empty>\n <div headless class=\"flex-col justify-center items-center w-full p-5\">\n <div class=\"content flex flex-col gap-5 items-center text-center mb-5\">\n <svg\n width=\"152\"\n height=\"120\"\n viewBox=\"0 0 152 120\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle cx=\"76\" cy=\"52\" r=\"52\" fill=\"#E9EAEB\" />\n <g filter=\"url(#filter0_ddd_2474_28277)\">\n <path\n d=\"M77.6 16C66.8273 16 57.2978 21.3233 51.4987 29.4829C49.605 29.0363 47.6301 28.8 45.6 28.8C31.4615 28.8 20 40.2615 20 54.4C20 68.5385 31.4615 80 45.6 80L109.6 80C121.971 80 132 69.9712 132 57.6C132 45.2288 121.971 35.2 109.6 35.2C108.721 35.2 107.854 35.2506 107.002 35.349C102.098 23.9677 90.7797 16 77.6 16Z\"\n fill=\"#FAFAFA\"\n />\n <ellipse\n cx=\"45.6\"\n cy=\"54.3998\"\n rx=\"25.6\"\n ry=\"25.6\"\n fill=\"url(#paint0_linear_2474_28277)\"\n />\n <circle\n cx=\"77.6016\"\n cy=\"48\"\n r=\"32\"\n fill=\"url(#paint1_linear_2474_28277)\"\n />\n <ellipse\n cx=\"109.599\"\n cy=\"57.6002\"\n rx=\"22.4\"\n ry=\"22.4\"\n fill=\"url(#paint2_linear_2474_28277)\"\n />\n </g>\n <circle cx=\"21\" cy=\"19\" r=\"5\" fill=\"#F5F5F5\" />\n <circle cx=\"18\" cy=\"109\" r=\"7\" fill=\"#F5F5F5\" />\n <circle cx=\"145\" cy=\"35\" r=\"7\" fill=\"#F5F5F5\" />\n <circle cx=\"134\" cy=\"8\" r=\"4\" fill=\"#F5F5F5\" />\n <foreignObject x=\"44\" y=\"54\" width=\"64\" height=\"64\">\n <div\n xmlns=\"http://www.w3.org/1999/xhtml\"\n style=\"\n backdrop-filter: blur(4px);\n clip-path: url(#bgblur_0_2474_28277_clip_path);\n height: 100%;\n width: 100%;\n \"\n ></div>\n </foreignObject>\n <g data-figma-bg-blur-radius=\"8\">\n <path\n d=\"M52 86C52 72.7452 62.7452 62 76 62C89.2548 62 100 72.7452 100 86C100 99.2548 89.2548 110 76 110C62.7452 110 52 99.2548 52 86Z\"\n fill=\"#344054\"\n fill-opacity=\"0.4\"\n />\n <path\n d=\"M85 95L81.5001 91.5M84 85.5C84 90.1944 80.1944 94 75.5 94C70.8056 94 67 90.1944 67 85.5C67 80.8056 70.8056 77 75.5 77C80.1944 77 84 80.8056 84 85.5Z\"\n stroke=\"white\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </g>\n <defs>\n <filter\n id=\"filter0_ddd_2474_28277\"\n x=\"0\"\n y=\"16\"\n width=\"152\"\n height=\"104\"\n filterUnits=\"userSpaceOnUse\"\n color-interpolation-filters=\"sRGB\"\n >\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\n <feColorMatrix\n in=\"SourceAlpha\"\n type=\"matrix\"\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n result=\"hardAlpha\"\n />\n <feMorphology\n radius=\"1.5\"\n operator=\"erode\"\n in=\"SourceAlpha\"\n result=\"effect1_dropShadow_2474_28277\"\n />\n <feOffset dy=\"3\" />\n <feGaussianBlur stdDeviation=\"1.5\" />\n <feComposite in2=\"hardAlpha\" operator=\"out\" />\n <feColorMatrix\n type=\"matrix\"\n values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.04 0\"\n />\n <feBlend\n mode=\"normal\"\n in2=\"BackgroundImageFix\"\n result=\"effect1_dropShadow_2474_28277\"\n />\n <feColorMatrix\n in=\"SourceAlpha\"\n type=\"matrix\"\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n result=\"hardAlpha\"\n />\n <feMorphology\n radius=\"4\"\n operator=\"erode\"\n in=\"SourceAlpha\"\n result=\"effect2_dropShadow_2474_28277\"\n />\n <feOffset dy=\"8\" />\n <feGaussianBlur stdDeviation=\"4\" />\n <feComposite in2=\"hardAlpha\" operator=\"out\" />\n <feColorMatrix\n type=\"matrix\"\n values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.03 0\"\n />\n <feBlend\n mode=\"normal\"\n in2=\"effect1_dropShadow_2474_28277\"\n result=\"effect2_dropShadow_2474_28277\"\n />\n <feColorMatrix\n in=\"SourceAlpha\"\n type=\"matrix\"\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n result=\"hardAlpha\"\n />\n <feMorphology\n radius=\"4\"\n operator=\"erode\"\n in=\"SourceAlpha\"\n result=\"effect3_dropShadow_2474_28277\"\n />\n <feOffset dy=\"20\" />\n <feGaussianBlur stdDeviation=\"12\" />\n <feComposite in2=\"hardAlpha\" operator=\"out\" />\n <feColorMatrix\n type=\"matrix\"\n values=\"0 0 0 0 0.0392157 0 0 0 0 0.0496732 0 0 0 0 0.0705882 0 0 0 0.08 0\"\n />\n <feBlend\n mode=\"normal\"\n in2=\"effect2_dropShadow_2474_28277\"\n result=\"effect3_dropShadow_2474_28277\"\n />\n <feBlend\n mode=\"normal\"\n in=\"SourceGraphic\"\n in2=\"effect3_dropShadow_2474_28277\"\n result=\"shape\"\n />\n </filter>\n <clipPath\n id=\"bgblur_0_2474_28277_clip_path\"\n transform=\"translate(-44 -54)\"\n >\n <path\n d=\"M52 86C52 72.7452 62.7452 62 76 62C89.2548 62 100 72.7452 100 86C100 99.2548 89.2548 110 76 110C62.7452 110 52 99.2548 52 86Z\"\n />\n </clipPath>\n <linearGradient\n id=\"paint0_linear_2474_28277\"\n x1=\"25.9429\"\n y1=\"37.4855\"\n x2=\"71.2\"\n y2=\"79.9998\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stop-color=\"#D0D5DD\" />\n <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n </linearGradient>\n <linearGradient\n id=\"paint1_linear_2474_28277\"\n x1=\"53.0301\"\n y1=\"26.8571\"\n x2=\"109.602\"\n y2=\"80\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stop-color=\"#D0D5DD\" />\n <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n </linearGradient>\n <linearGradient\n id=\"paint2_linear_2474_28277\"\n x1=\"92.3992\"\n y1=\"42.8002\"\n x2=\"131.999\"\n y2=\"80.0002\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stop-color=\"#D0D5DD\" />\n <stop offset=\"0.350715\" stop-color=\"white\" stop-opacity=\"0\" />\n </linearGradient>\n </defs>\n </svg>\n\n <div class=\"flex flex-col gap-1\">\n <div class=\"text-md text-surface-600\">{{ \"No data to show\" }}</div>\n </div>\n <div>\n <mt-button\n label=\"Add New Property\"\n icon=\"general.plus\"\n (click)=\"createProperty()\"\n />\n </div>\n </div>\n <p-divider type=\"solid\">\n <div class=\"text-lg text-surface-600\">Create from Type Template</div>\n </p-divider>\n <div class=\"flex gap-3 mt-5 justify-center\">\n @for (card of propertyTypes(); track card.label) {\n <mt-card\n headless\n class=\"w-25 tailwind-4 cursor-pointer\"\n style=\"background-color: #fafafa\"\n (click)=\"createPropertyWithType(card.value)\"\n >\n <div class=\"content flex flex-col gap-3 items-center text-center\">\n <mt-avatar\n [style.--p-avatar-background]=\"\n 'var(--p-' + card.color + '-100)'\n \"\n [style.--p-avatar-color]=\"'var(--p-' + card.color + '-600)'\"\n [icon]=\"card.icon\"\n shape=\"square\"\n ></mt-avatar>\n <div class=\"flex flex-col gap-1\">\n <div class=\"text-xs font-normal\">{{ card.label }}</div>\n </div>\n </div>\n </mt-card>\n }\n </div>\n </div>\n </ng-template>\n </mt-table>\n</div>\n" }]
|
|
890
902
|
}] });
|
|
891
903
|
|
|
892
904
|
class ApiConfiguration {
|
|
@@ -1047,7 +1059,7 @@ class ApiConfiguration {
|
|
|
1047
1059
|
useExisting: forwardRef(() => ApiConfiguration),
|
|
1048
1060
|
multi: true,
|
|
1049
1061
|
},
|
|
1050
|
-
], ngImport: i0, template: "<div [formGroup]=\"form\" class=\"space-y-6\">\n <div class=\"space-y-4 rounded-xl bg-white px-6 py-4 shadow-sm\">\n <div class=\"grid items-end gap-3 md:grid-cols-[minmax(0,1fr)_auto]\">\n <mt-text-field\n formControlName=\"endpoint\"\n label=\"Endpoint\"\n placeholder=\"https://api.example.com/items\"\n />\n <div class=\"flex justify-end gap-2\">\n <mt-button\n type=\"button\"\n [text]=\"true\"\n icon=\"general.plus\"\n label=\"Add Header\"\n (click)=\"addHeader()\"\n />\n <mt-button\n type=\"button\"\n label=\"Test API\"\n [loading]=\"isTesting()\"\n (click)=\"testApi()\"\n />\n </div>\n </div>\n\n @if (headers.controls.length) {\n <div class=\"space-y-3\">\n <div class=\"text-sm font-medium text-surface-500\">Headers</div>\n <div class=\"space-y-3\">\n @for (\n headerCtrl of headers.controls;\n track headerCtrl;\n let i = $index\n ) {\n <div\n [formGroup]=\"headerCtrl\"\n class=\"grid items-end gap-3 md:grid-cols-[minmax(0,1fr)_minmax(0,1fr)_auto]\"\n >\n <mt-text-field formControlName=\"key\" label=\"Key\" />\n <mt-text-field formControlName=\"value\" label=\"Value\" />\n <mt-button\n type=\"button\"\n [text]=\"true\"\n icon=\"general.trash-01\"\n (click)=\"removeHeader(i)\"\n />\n </div>\n }\n </div>\n </div>\n } @else {\n <p class=\"text-xs text-surface-400\">\n No headers added. Use \u201CAdd Header\u201D to include authentication or custom\n headers.\n </p>\n }\n </div>\n\n <div class=\"space-y-4 rounded-xl bg-white px-6 py-4 shadow-sm\">\n @if (hasDetectedSchema()) {\n <div class=\"grid gap-4 md:grid-cols-2\">\n <mt-select-field\n formControlName=\"key\"\n [options]=\"apiProperties()\"\n [showClear]=\"true\"\n optionLabel=\"name\"\n optionValue=\"key\"\n label=\"Key field\"\n />\n <mt-select-field\n formControlName=\"value\"\n [options]=\"apiProperties()\"\n [showClear]=\"true\"\n optionLabel=\"name\"\n optionValue=\"key\"\n label=\"Value field\"\n />\n </div>\n } @else {\n <p class=\"text-xs text-surface-400\">\n Run \u201CTest API\u201D to detect available fields.\n </p>\n }\n\n <div class=\"flex items-center justify-between gap-4\">\n <mt-toggle-field\n formControlName=\"supportMultiSelect\"\n label=\"Support multiple select\"\n />\n @if (isTesting()) {\n <span class=\"text-xs text-surface-400\">Testing...</span>\n }\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1
|
|
1062
|
+
], ngImport: i0, template: "<div [formGroup]=\"form\" class=\"space-y-6\">\n <div class=\"space-y-4 rounded-xl bg-white px-6 py-4 shadow-sm\">\n <div class=\"grid items-end gap-3 md:grid-cols-[minmax(0,1fr)_auto]\">\n <mt-text-field\n formControlName=\"endpoint\"\n label=\"Endpoint\"\n placeholder=\"https://api.example.com/items\"\n />\n <div class=\"flex justify-end gap-2\">\n <mt-button\n type=\"button\"\n [text]=\"true\"\n icon=\"general.plus\"\n label=\"Add Header\"\n (click)=\"addHeader()\"\n />\n <mt-button\n type=\"button\"\n label=\"Test API\"\n [loading]=\"isTesting()\"\n (click)=\"testApi()\"\n />\n </div>\n </div>\n\n @if (headers.controls.length) {\n <div class=\"space-y-3\">\n <div class=\"text-sm font-medium text-surface-500\">Headers</div>\n <div class=\"space-y-3\">\n @for (\n headerCtrl of headers.controls;\n track headerCtrl;\n let i = $index\n ) {\n <div\n [formGroup]=\"headerCtrl\"\n class=\"grid items-end gap-3 md:grid-cols-[minmax(0,1fr)_minmax(0,1fr)_auto]\"\n >\n <mt-text-field formControlName=\"key\" label=\"Key\" />\n <mt-text-field formControlName=\"value\" label=\"Value\" />\n <mt-button\n type=\"button\"\n [text]=\"true\"\n icon=\"general.trash-01\"\n (click)=\"removeHeader(i)\"\n />\n </div>\n }\n </div>\n </div>\n } @else {\n <p class=\"text-xs text-surface-400\">\n No headers added. Use \u201CAdd Header\u201D to include authentication or custom\n headers.\n </p>\n }\n </div>\n\n <div class=\"space-y-4 rounded-xl bg-white px-6 py-4 shadow-sm\">\n @if (hasDetectedSchema()) {\n <div class=\"grid gap-4 md:grid-cols-2\">\n <mt-select-field\n formControlName=\"key\"\n [options]=\"apiProperties()\"\n [showClear]=\"true\"\n optionLabel=\"name\"\n optionValue=\"key\"\n label=\"Key field\"\n />\n <mt-select-field\n formControlName=\"value\"\n [options]=\"apiProperties()\"\n [showClear]=\"true\"\n optionLabel=\"name\"\n optionValue=\"key\"\n label=\"Value field\"\n />\n </div>\n } @else {\n <p class=\"text-xs text-surface-400\">\n Run \u201CTest API\u201D to detect available fields.\n </p>\n }\n\n <div class=\"flex items-center justify-between gap-4\">\n <mt-toggle-field\n formControlName=\"supportMultiSelect\"\n label=\"Support multiple select\"\n />\n @if (isTesting()) {\n <span class=\"text-xs text-surface-400\">Testing...</span>\n }\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],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: TextField, selector: "mt-text-field", inputs: ["field", "hint", "label", "placeholder", "class", "type", "readonly", "pInputs", "required", "icon", "iconPosition"] }, { kind: "component", type: SelectField, selector: "mt-select-field", inputs: ["field", "label", "placeholder", "hasPlaceholderPrefix", "class", "readonly", "pInputs", "options", "optionValue", "optionLabel", "filter", "filterBy", "dataKey", "showClear", "clearAfterSelect", "required"], outputs: ["onChange"] }, { kind: "component", type: ToggleField, selector: "mt-toggle-field", inputs: ["label", "labelPosition", "placeholder", "readonly", "pInputs", "required"], outputs: ["onChange"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1051
1063
|
}
|
|
1052
1064
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ApiConfiguration, decorators: [{
|
|
1053
1065
|
type: Component,
|
|
@@ -1141,7 +1153,7 @@ class CheckListFormConfiguration {
|
|
|
1141
1153
|
this.propertiesFacade.resetConfigProperties();
|
|
1142
1154
|
}
|
|
1143
1155
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: CheckListFormConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1144
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: CheckListFormConfiguration, isStandalone: true, selector: "mt-check-list-form-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1
|
|
1156
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: CheckListFormConfiguration, isStandalone: true, selector: "mt-check-list-form-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
|
|
1145
1157
|
{ provide: ControlContainer, useExisting: FormGroupDirective },
|
|
1146
1158
|
] });
|
|
1147
1159
|
}
|
|
@@ -1217,7 +1229,7 @@ class DynamicListConfiguration {
|
|
|
1217
1229
|
this.propertiesFacade.resetConfigProperties();
|
|
1218
1230
|
}
|
|
1219
1231
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DynamicListConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1220
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: DynamicListConfiguration, isStandalone: true, selector: "mt-dynamic-list-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1
|
|
1232
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: DynamicListConfiguration, isStandalone: true, selector: "mt-dynamic-list-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
|
|
1221
1233
|
{ provide: ControlContainer, useExisting: FormGroupDirective },
|
|
1222
1234
|
] });
|
|
1223
1235
|
}
|
|
@@ -1296,7 +1308,7 @@ class EditableListViewConfiguration {
|
|
|
1296
1308
|
this.propertiesFacade.resetConfigProperties();
|
|
1297
1309
|
}
|
|
1298
1310
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: EditableListViewConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1299
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: EditableListViewConfiguration, isStandalone: true, selector: "mt-editable-list-view-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1
|
|
1311
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: EditableListViewConfiguration, isStandalone: true, selector: "mt-editable-list-view-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
|
|
1300
1312
|
{ provide: ControlContainer, useExisting: FormGroupDirective },
|
|
1301
1313
|
] });
|
|
1302
1314
|
}
|
|
@@ -1399,7 +1411,7 @@ class InternalModuleConfiguration {
|
|
|
1399
1411
|
this.propertiesFacade.resetConfigProperties();
|
|
1400
1412
|
}
|
|
1401
1413
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: InternalModuleConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1402
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: InternalModuleConfiguration, isStandalone: true, selector: "mt-internal-module-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1
|
|
1414
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: InternalModuleConfiguration, isStandalone: true, selector: "mt-internal-module-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
|
|
1403
1415
|
{ provide: ControlContainer, useExisting: FormGroupDirective },
|
|
1404
1416
|
] });
|
|
1405
1417
|
}
|
|
@@ -1445,7 +1457,7 @@ class LocationConfiguration {
|
|
|
1445
1457
|
});
|
|
1446
1458
|
}
|
|
1447
1459
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: LocationConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1448
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: LocationConfiguration, isStandalone: true, selector: "mt-location-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1
|
|
1460
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: LocationConfiguration, isStandalone: true, selector: "mt-location-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
|
|
1449
1461
|
{ provide: ControlContainer, useExisting: FormGroupDirective },
|
|
1450
1462
|
] });
|
|
1451
1463
|
}
|
|
@@ -1491,7 +1503,7 @@ class LookupConfiguration {
|
|
|
1491
1503
|
});
|
|
1492
1504
|
}
|
|
1493
1505
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: LookupConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1494
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: LookupConfiguration, isStandalone: true, selector: "mt-lookup-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1
|
|
1506
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: LookupConfiguration, isStandalone: true, selector: "mt-lookup-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
|
|
1495
1507
|
{ provide: ControlContainer, useExisting: FormGroupDirective },
|
|
1496
1508
|
] });
|
|
1497
1509
|
}
|
|
@@ -1524,7 +1536,7 @@ class PercentageConfiguration {
|
|
|
1524
1536
|
],
|
|
1525
1537
|
}, ...(ngDevMode ? [{ debugName: "formConfig" }] : []));
|
|
1526
1538
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: PercentageConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1527
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: PercentageConfiguration, isStandalone: true, selector: "mt-percentage-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1
|
|
1539
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: PercentageConfiguration, isStandalone: true, selector: "mt-percentage-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
|
|
1528
1540
|
{ provide: ControlContainer, useExisting: FormGroupDirective },
|
|
1529
1541
|
] });
|
|
1530
1542
|
}
|
|
@@ -1570,7 +1582,7 @@ class UserConfiguration {
|
|
|
1570
1582
|
});
|
|
1571
1583
|
}
|
|
1572
1584
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: UserConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1573
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: UserConfiguration, isStandalone: true, selector: "mt-user-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1
|
|
1585
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: UserConfiguration, isStandalone: true, selector: "mt-user-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
|
|
1574
1586
|
{ provide: ControlContainer, useExisting: FormGroupDirective },
|
|
1575
1587
|
] });
|
|
1576
1588
|
}
|
|
@@ -1722,7 +1734,7 @@ class AttachmentConfiguration {
|
|
|
1722
1734
|
],
|
|
1723
1735
|
}, ...(ngDevMode ? [{ debugName: "formConfig" }] : []));
|
|
1724
1736
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AttachmentConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1725
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: AttachmentConfiguration, isStandalone: true, selector: "mt-attachment-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1
|
|
1737
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: AttachmentConfiguration, isStandalone: true, selector: "mt-attachment-configuration", ngImport: i0, template: "<mt-dynamic-form formControlName=\"configuration\" [formConfig]=\"formConfig()\" />\n", styles: [""], dependencies: [{ kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], viewProviders: [
|
|
1726
1738
|
{ provide: ControlContainer, useExisting: FormGroupDirective },
|
|
1727
1739
|
] });
|
|
1728
1740
|
}
|
|
@@ -2060,7 +2072,10 @@ class PropertyForm {
|
|
|
2060
2072
|
const path = this.isEditing()
|
|
2061
2073
|
? '../../properties-list'
|
|
2062
2074
|
: '../properties-list';
|
|
2063
|
-
this.router.navigate([path], {
|
|
2075
|
+
this.router.navigate([path], {
|
|
2076
|
+
relativeTo: this.route,
|
|
2077
|
+
queryParamsHandling: 'preserve',
|
|
2078
|
+
});
|
|
2064
2079
|
}
|
|
2065
2080
|
ngOnDestroy() {
|
|
2066
2081
|
this.facade.resetSelectedProperty();
|
|
@@ -2068,7 +2083,7 @@ class PropertyForm {
|
|
|
2068
2083
|
this.destroyConfigurationComponent();
|
|
2069
2084
|
}
|
|
2070
2085
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: PropertyForm, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2071
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: PropertyForm, isStandalone: true, selector: "mt-property-form", inputs: { propertyId: { classPropertyName: "propertyId", publicName: "propertyId", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "configurationHost", first: true, predicate: ["configurationHost"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<mt-card class=\"h-full\">\n <ng-template #headless>\n <div class=\"flex justify-between items-center p-3 border-b border-surface\">\n <div class=\"flex gap-2 items-center\">\n <mt-button\n [text]=\"true\"\n icon=\"arrow.arrow-narrow-left\"\n size=\"large\"\n (click)=\"goBack()\"\n ></mt-button>\n <mt-avatar size=\"normal\" icon=\"custom.user-pp\" />\n <h3 class=\"font-bold text-lg\">\n {{ propertyId() ? \"Edit Property\" : \"Create New Property\" }}\n </h3>\n </div>\n <mt-button\n class=\"mx-2\"\n [label]=\"submitLabel()\"\n [icon]=\"isEditing() ? 'custom.pencil' : 'general.plus'\"\n [loading]=\"submitting()\"\n [disabled]=\"submitDisabled() || this.propertyForm.invalid\"\n (click)=\"createOrEditProperty()\"\n />\n </div>\n <div\n [formGroup]=\"propertyForm\"\n class=\"h-full py-4 bg-[radial-gradient(120%_80%_at_100%_0%,_#EBEFFF_0%,_#F6F8FC_45%,_#F6F8FC_100%)] h-full overflow-y-auto flex justify-center\"\n >\n <div class=\"w-1/2 flex flex-col gap-6\">\n @if (loading()) {\n <!-- Skeleton Loading State -->\n <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\n <div class=\"flex justify-between items-center gap-6\">\n <p-skeleton width=\"50%\" height=\"3rem\"></p-skeleton>\n <p-skeleton width=\"8rem\" height=\"2.5rem\"></p-skeleton>\n </div>\n </div>\n\n <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\n <p-skeleton\n width=\"12rem\"\n height=\"1.5rem\"\n styleClass=\"mb-4\"\n ></p-skeleton>\n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n <p-skeleton height=\"3rem\"></p-skeleton>\n <p-skeleton height=\"3rem\"></p-skeleton>\n <p-skeleton height=\"6rem\" styleClass=\"md:col-span-2\"></p-skeleton>\n <p-skeleton height=\"3rem\" styleClass=\"md:col-span-2\"></p-skeleton>\n </div>\n </div>\n\n <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\n <p-skeleton\n width=\"10rem\"\n height=\"1.5rem\"\n styleClass=\"mb-4\"\n ></p-skeleton>\n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n <p-skeleton height=\"3rem\"></p-skeleton>\n <p-skeleton height=\"3rem\"></p-skeleton>\n <p-skeleton height=\"8rem\" styleClass=\"md:col-span-2\"></p-skeleton>\n </div>\n </div>\n } @else {\n <mt-dynamic-form\n [formConfig]=\"dynamicFormConfigMain()\"\n [formControlName]=\"'main'\"\n />\n @if (configurationFormConfig()) {\n <mt-dynamic-form\n formControlName=\"configuration\"\n [formConfig]=\"configurationFormConfig()!\"\n />\n } @else {\n <ng-container #configurationHost></ng-container>\n @if (!configurationComponentExists()) {\n @switch (propertyType()) {\n @case (\"User\") {\n <mt-user-configuration />\n }\n @case (\"Percentage\") {\n <mt-percentage-configuration />\n }\n @case (\"Lookup\") {\n <mt-lookup-configuration />\n }\n @case (\"LookupMultiSelect\") {\n <mt-lookup-configuration />\n }\n @case (\"InternalModule\") {\n <mt-internal-module-configuration />\n }\n @case (\"DynamicList\") {\n <mt-dynamic-list-configuration />\n }\n @case (\"API\") {\n <mt-api-configuration formControlName=\"configuration\" />\n }\n <!-- @case('ViewList') { REMOVED FOR NOW\n <mt-view-list-configuration />\n } -->\n @case (\"Attachment\") {\n <mt-attachment-configuration />\n }\n <!-- @case('ReferenceProperty') { REMOVED FOR NOW\n } -->\n @case (\"EditableListView\") {\n <mt-editable-list-view-configuration />\n }\n @case (\"LookupLog\") {\n <mt-check-list-form-configuration />\n }\n <!-- @case('LookupMatrix') { REMOVED FOR NOW\n <mt-lookup-configuration />\n } -->\n @case (\"Location\") {\n <mt-location-configuration />\n }\n }\n }\n }\n }\n </div>\n </div>\n </ng-template>\n</mt-card>\n", styles: [""], dependencies: [{ 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: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1
|
|
2086
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: PropertyForm, isStandalone: true, selector: "mt-property-form", inputs: { propertyId: { classPropertyName: "propertyId", publicName: "propertyId", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "configurationHost", first: true, predicate: ["configurationHost"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<mt-card class=\"h-full\">\n <ng-template #headless>\n <div class=\"flex justify-between items-center p-3 border-b border-surface\">\n <div class=\"flex gap-2 items-center\">\n <mt-button\n [text]=\"true\"\n icon=\"arrow.arrow-narrow-left\"\n size=\"large\"\n (click)=\"goBack()\"\n ></mt-button>\n <mt-avatar size=\"normal\" icon=\"custom.user-pp\" />\n <h3 class=\"font-bold text-lg\">\n {{ propertyId() ? \"Edit Property\" : \"Create New Property\" }}\n </h3>\n </div>\n <mt-button\n class=\"mx-2\"\n [label]=\"submitLabel()\"\n [icon]=\"isEditing() ? 'custom.pencil' : 'general.plus'\"\n [loading]=\"submitting()\"\n [disabled]=\"submitDisabled() || this.propertyForm.invalid\"\n (click)=\"createOrEditProperty()\"\n />\n </div>\n <div\n [formGroup]=\"propertyForm\"\n class=\"h-full py-4 bg-[radial-gradient(120%_80%_at_100%_0%,_#EBEFFF_0%,_#F6F8FC_45%,_#F6F8FC_100%)] h-full overflow-y-auto flex justify-center\"\n >\n <div class=\"w-1/2 flex flex-col gap-6\">\n @if (loading()) {\n <!-- Skeleton Loading State -->\n <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\n <div class=\"flex justify-between items-center gap-6\">\n <p-skeleton width=\"50%\" height=\"3rem\"></p-skeleton>\n <p-skeleton width=\"8rem\" height=\"2.5rem\"></p-skeleton>\n </div>\n </div>\n\n <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\n <p-skeleton\n width=\"12rem\"\n height=\"1.5rem\"\n styleClass=\"mb-4\"\n ></p-skeleton>\n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n <p-skeleton height=\"3rem\"></p-skeleton>\n <p-skeleton height=\"3rem\"></p-skeleton>\n <p-skeleton height=\"6rem\" styleClass=\"md:col-span-2\"></p-skeleton>\n <p-skeleton height=\"3rem\" styleClass=\"md:col-span-2\"></p-skeleton>\n </div>\n </div>\n\n <div class=\"rounded-xl bg-white shadow-sm p-6 space-y-4\">\n <p-skeleton\n width=\"10rem\"\n height=\"1.5rem\"\n styleClass=\"mb-4\"\n ></p-skeleton>\n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n <p-skeleton height=\"3rem\"></p-skeleton>\n <p-skeleton height=\"3rem\"></p-skeleton>\n <p-skeleton height=\"8rem\" styleClass=\"md:col-span-2\"></p-skeleton>\n </div>\n </div>\n } @else {\n <mt-dynamic-form\n [formConfig]=\"dynamicFormConfigMain()\"\n [formControlName]=\"'main'\"\n />\n @if (configurationFormConfig()) {\n <mt-dynamic-form\n formControlName=\"configuration\"\n [formConfig]=\"configurationFormConfig()!\"\n />\n } @else {\n <ng-container #configurationHost></ng-container>\n @if (!configurationComponentExists()) {\n @switch (propertyType()) {\n @case (\"User\") {\n <mt-user-configuration />\n }\n @case (\"Percentage\") {\n <mt-percentage-configuration />\n }\n @case (\"Lookup\") {\n <mt-lookup-configuration />\n }\n @case (\"LookupMultiSelect\") {\n <mt-lookup-configuration />\n }\n @case (\"InternalModule\") {\n <mt-internal-module-configuration />\n }\n @case (\"DynamicList\") {\n <mt-dynamic-list-configuration />\n }\n @case (\"API\") {\n <mt-api-configuration formControlName=\"configuration\" />\n }\n <!-- @case('ViewList') { REMOVED FOR NOW\n <mt-view-list-configuration />\n } -->\n @case (\"Attachment\") {\n <mt-attachment-configuration />\n }\n <!-- @case('ReferenceProperty') { REMOVED FOR NOW\n } -->\n @case (\"EditableListView\") {\n <mt-editable-list-view-configuration />\n }\n @case (\"LookupLog\") {\n <mt-check-list-form-configuration />\n }\n <!-- @case('LookupMatrix') { REMOVED FOR NOW\n <mt-lookup-configuration />\n } -->\n @case (\"Location\") {\n <mt-location-configuration />\n }\n }\n }\n }\n }\n </div>\n </div>\n </ng-template>\n</mt-card>\n", styles: [""], dependencies: [{ 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: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],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: ApiConfiguration, selector: "mt-api-configuration" }, { kind: "component", type: CheckListFormConfiguration, selector: "mt-check-list-form-configuration" }, { kind: "component", type: DynamicListConfiguration, selector: "mt-dynamic-list-configuration" }, { kind: "component", type: EditableListViewConfiguration, selector: "mt-editable-list-view-configuration" }, { kind: "component", type: InternalModuleConfiguration, selector: "mt-internal-module-configuration" }, { kind: "component", type: LocationConfiguration, selector: "mt-location-configuration" }, { kind: "component", type: LookupConfiguration, selector: "mt-lookup-configuration" }, { kind: "component", type: PercentageConfiguration, selector: "mt-percentage-configuration" }, { kind: "component", type: UserConfiguration, selector: "mt-user-configuration" }, { kind: "component", type: AttachmentConfiguration, selector: "mt-attachment-configuration" }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }] });
|
|
2072
2087
|
}
|
|
2073
2088
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: PropertyForm, decorators: [{
|
|
2074
2089
|
type: Component,
|