@memberjunction/ng-skip-chat 2.103.0 → 2.104.0
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.
- package/dist/lib/artifacts/skip-artifact-viewer.component.d.ts +33 -3
- package/dist/lib/artifacts/skip-artifact-viewer.component.d.ts.map +1 -1
- package/dist/lib/artifacts/skip-artifact-viewer.component.js +166 -22
- package/dist/lib/artifacts/skip-artifact-viewer.component.js.map +1 -1
- package/dist/lib/artifacts/skip-component-feedback-panel.component.d.ts +120 -0
- package/dist/lib/artifacts/skip-component-feedback-panel.component.d.ts.map +1 -0
- package/dist/lib/artifacts/skip-component-feedback-panel.component.js +473 -0
- package/dist/lib/artifacts/skip-component-feedback-panel.component.js.map +1 -0
- package/dist/lib/dynamic-report/dynamic-ui-component.d.ts +3 -1
- package/dist/lib/dynamic-report/dynamic-ui-component.d.ts.map +1 -1
- package/dist/lib/dynamic-report/dynamic-ui-component.js +211 -179
- package/dist/lib/dynamic-report/dynamic-ui-component.js.map +1 -1
- package/dist/lib/dynamic-report/linear-report.d.ts +3 -1
- package/dist/lib/dynamic-report/linear-report.d.ts.map +1 -1
- package/dist/lib/dynamic-report/linear-report.js +10 -4
- package/dist/lib/dynamic-report/linear-report.js.map +1 -1
- package/dist/lib/dynamic-report/skip-dynamic-report-wrapper.d.ts +10 -0
- package/dist/lib/dynamic-report/skip-dynamic-report-wrapper.d.ts.map +1 -1
- package/dist/lib/dynamic-report/skip-dynamic-report-wrapper.js +41 -9
- package/dist/lib/dynamic-report/skip-dynamic-report-wrapper.js.map +1 -1
- package/dist/lib/module.d.ts +22 -21
- package/dist/lib/module.d.ts.map +1 -1
- package/dist/lib/module.js +6 -2
- package/dist/lib/module.js.map +1 -1
- package/dist/lib/skip-chat/skip-chat.component.d.ts.map +1 -1
- package/dist/lib/skip-chat/skip-chat.component.js +3 -3
- package/dist/lib/skip-chat/skip-chat.component.js.map +1 -1
- package/dist/lib/skip-single-message/skip-single-message.component.d.ts.map +1 -1
- package/dist/lib/skip-single-message/skip-single-message.component.js +3 -3
- package/dist/lib/skip-single-message/skip-single-message.component.js.map +1 -1
- package/package.json +13 -13
|
@@ -28,10 +28,10 @@ function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_1_Templ
|
|
|
28
28
|
i0.ɵɵtextInterpolate1(" ", ctx_r1.getTabTitle(ɵ$index_4_r3), " ");
|
|
29
29
|
} }
|
|
30
30
|
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_button_4_Template(rf, ctx) { if (rf & 1) {
|
|
31
|
-
const
|
|
32
|
-
i0.ɵɵelementStart(0, "button",
|
|
33
|
-
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_button_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(
|
|
34
|
-
i0.ɵɵelement(1, "i",
|
|
31
|
+
const _r5 = i0.ɵɵgetCurrentView();
|
|
32
|
+
i0.ɵɵelementStart(0, "button", 17);
|
|
33
|
+
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_button_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const ɵ$index_4_r3 = i0.ɵɵnextContext(2).$index; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.createReportForOption(ɵ$index_4_r3)); });
|
|
34
|
+
i0.ɵɵelement(1, "i", 18);
|
|
35
35
|
i0.ɵɵelementStart(2, "span");
|
|
36
36
|
i0.ɵɵtext(3, "Save Report");
|
|
37
37
|
i0.ɵɵelementEnd()();
|
|
@@ -40,42 +40,42 @@ function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_butto
|
|
|
40
40
|
i0.ɵɵproperty("disabled", ctx_r1.isCreatingReport);
|
|
41
41
|
} }
|
|
42
42
|
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_button_5_Template(rf, ctx) { if (rf & 1) {
|
|
43
|
-
const
|
|
44
|
-
i0.ɵɵelementStart(0, "button",
|
|
45
|
-
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_button_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(
|
|
46
|
-
i0.ɵɵelement(1, "i",
|
|
43
|
+
const _r6 = i0.ɵɵgetCurrentView();
|
|
44
|
+
i0.ɵɵelementStart(0, "button", 19);
|
|
45
|
+
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_button_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const ɵ$index_4_r3 = i0.ɵɵnextContext(2).$index; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.openReportForOption(ɵ$index_4_r3)); });
|
|
46
|
+
i0.ɵɵelement(1, "i", 20);
|
|
47
47
|
i0.ɵɵelementStart(2, "span");
|
|
48
48
|
i0.ɵɵtext(3, "Open Saved Report");
|
|
49
49
|
i0.ɵɵelementEnd()();
|
|
50
50
|
} }
|
|
51
51
|
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_button_6_Template(rf, ctx) { if (rf & 1) {
|
|
52
|
-
const
|
|
53
|
-
i0.ɵɵelementStart(0, "button",
|
|
54
|
-
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_button_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(
|
|
55
|
-
i0.ɵɵelement(1, "i",
|
|
52
|
+
const _r7 = i0.ɵɵgetCurrentView();
|
|
53
|
+
i0.ɵɵelementStart(0, "button", 21);
|
|
54
|
+
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_button_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.PrintReport()); });
|
|
55
|
+
i0.ɵɵelement(1, "i", 22);
|
|
56
56
|
i0.ɵɵelementStart(2, "span");
|
|
57
57
|
i0.ɵɵtext(3, "Print Report");
|
|
58
58
|
i0.ɵɵelementEnd()();
|
|
59
59
|
} }
|
|
60
|
-
function
|
|
61
|
-
i0.ɵɵelement(0, "i",
|
|
60
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_14_Template(rf, ctx) { if (rf & 1) {
|
|
61
|
+
i0.ɵɵelement(0, "i", 23);
|
|
62
62
|
i0.ɵɵtext(1, " Component ");
|
|
63
63
|
} }
|
|
64
|
-
function
|
|
65
|
-
const
|
|
66
|
-
i0.ɵɵelementStart(0, "mj-react-component",
|
|
67
|
-
i0.ɵɵlistener("stateChange", function
|
|
64
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_mj_react_component_1_Template(rf, ctx) { if (rf & 1) {
|
|
65
|
+
const _r8 = i0.ɵɵgetCurrentView();
|
|
66
|
+
i0.ɵɵelementStart(0, "mj-react-component", 27);
|
|
67
|
+
i0.ɵɵlistener("stateChange", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_mj_react_component_1_Template_mj_react_component_stateChange_0_listener($event) { i0.ɵɵrestoreView(_r8); const ɵ$index_4_r3 = i0.ɵɵnextContext(3).$index; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onStateChange(ɵ$index_4_r3, $event)); })("componentEvent", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_mj_react_component_1_Template_mj_react_component_componentEvent_0_listener($event) { i0.ɵɵrestoreView(_r8); const ɵ$index_4_r3 = i0.ɵɵnextContext(3).$index; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onComponentEvent(ɵ$index_4_r3, $event)); })("refreshData", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_mj_react_component_1_Template_mj_react_component_refreshData_0_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.handleRefreshData()); })("openEntityRecord", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_mj_react_component_1_Template_mj_react_component_openEntityRecord_0_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.onOpenEntityRecord($event)); });
|
|
68
68
|
i0.ɵɵelementEnd();
|
|
69
69
|
} if (rf & 2) {
|
|
70
70
|
const ɵ$index_4_r3 = i0.ɵɵnextContext(3).$index;
|
|
71
71
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
72
72
|
i0.ɵɵproperty("component", ctx_r1.componentOptions[ɵ$index_4_r3].option)("styles", ctx_r1.componentStyles || undefined);
|
|
73
73
|
} }
|
|
74
|
-
function
|
|
75
|
-
i0.ɵɵelementStart(0, "details",
|
|
74
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_Conditional_2_Conditional_19_Template(rf, ctx) { if (rf & 1) {
|
|
75
|
+
i0.ɵɵelementStart(0, "details", 36)(1, "summary", 42);
|
|
76
76
|
i0.ɵɵtext(2, "Technical Details (click to expand)");
|
|
77
77
|
i0.ɵɵelementEnd();
|
|
78
|
-
i0.ɵɵelementStart(3, "pre",
|
|
78
|
+
i0.ɵɵelementStart(3, "pre", 43);
|
|
79
79
|
i0.ɵɵtext(4);
|
|
80
80
|
i0.ɵɵelementEnd()();
|
|
81
81
|
} if (rf & 2) {
|
|
@@ -83,21 +83,21 @@ function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_te
|
|
|
83
83
|
i0.ɵɵadvance(4);
|
|
84
84
|
i0.ɵɵtextInterpolate(ctx_r1.formatTechnicalDetails(ctx_r1.currentError.technicalDetails));
|
|
85
85
|
} }
|
|
86
|
-
function
|
|
87
|
-
const
|
|
88
|
-
i0.ɵɵelementStart(0, "div",
|
|
89
|
-
i0.ɵɵlistener("click", function
|
|
90
|
-
i0.ɵɵelement(4, "span",
|
|
86
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_Conditional_2_Template(rf, ctx) { if (rf & 1) {
|
|
87
|
+
const _r9 = i0.ɵɵgetCurrentView();
|
|
88
|
+
i0.ɵɵelementStart(0, "div", 26)(1, "div", 28)(2, "div", 29)(3, "button", 30);
|
|
89
|
+
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_Conditional_2_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.copyErrorToClipboard()); });
|
|
90
|
+
i0.ɵɵelement(4, "span", 31);
|
|
91
91
|
i0.ɵɵtext(5, " Copy Error Details ");
|
|
92
92
|
i0.ɵɵelementEnd();
|
|
93
|
-
i0.ɵɵelementStart(6, "h3",
|
|
94
|
-
i0.ɵɵelement(7, "span",
|
|
93
|
+
i0.ɵɵelementStart(6, "h3", 32);
|
|
94
|
+
i0.ɵɵelement(7, "span", 33);
|
|
95
95
|
i0.ɵɵtext(8, " Component Rendering Error ");
|
|
96
96
|
i0.ɵɵelementEnd()();
|
|
97
|
-
i0.ɵɵelementStart(9, "p",
|
|
97
|
+
i0.ɵɵelementStart(9, "p", 34);
|
|
98
98
|
i0.ɵɵtext(10, " The selected component option could not be rendered due to the following error: ");
|
|
99
99
|
i0.ɵɵelementEnd();
|
|
100
|
-
i0.ɵɵelementStart(11, "div",
|
|
100
|
+
i0.ɵɵelementStart(11, "div", 35)(12, "strong");
|
|
101
101
|
i0.ɵɵtext(13, "Error Type:");
|
|
102
102
|
i0.ɵɵelementEnd();
|
|
103
103
|
i0.ɵɵtext(14);
|
|
@@ -106,12 +106,12 @@ function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_te
|
|
|
106
106
|
i0.ɵɵtext(17, "Details:");
|
|
107
107
|
i0.ɵɵelementEnd();
|
|
108
108
|
i0.ɵɵtext(18);
|
|
109
|
-
i0.ɵɵtemplate(19,
|
|
109
|
+
i0.ɵɵtemplate(19, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_Conditional_2_Conditional_19_Template, 5, 1, "details", 36);
|
|
110
110
|
i0.ɵɵelementEnd();
|
|
111
|
-
i0.ɵɵelementStart(20, "div",
|
|
111
|
+
i0.ɵɵelementStart(20, "div", 37)(21, "strong", 38);
|
|
112
112
|
i0.ɵɵtext(22, "What to do:");
|
|
113
113
|
i0.ɵɵelementEnd();
|
|
114
|
-
i0.ɵɵelementStart(23, "ol",
|
|
114
|
+
i0.ɵɵelementStart(23, "ol", 39)(24, "li");
|
|
115
115
|
i0.ɵɵtext(25, "Try selecting a different report option from the tabs above");
|
|
116
116
|
i0.ɵɵelementEnd();
|
|
117
117
|
i0.ɵɵelementStart(26, "li");
|
|
@@ -120,9 +120,9 @@ function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_te
|
|
|
120
120
|
i0.ɵɵelementStart(28, "li");
|
|
121
121
|
i0.ɵɵtext(29, "Contact your IT department if the issue persists");
|
|
122
122
|
i0.ɵɵelementEnd()()();
|
|
123
|
-
i0.ɵɵelementStart(30, "button",
|
|
124
|
-
i0.ɵɵlistener("click", function
|
|
125
|
-
i0.ɵɵelement(31, "span",
|
|
123
|
+
i0.ɵɵelementStart(30, "button", 40);
|
|
124
|
+
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_Conditional_2_Template_button_click_30_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.retryCurrentOption()); });
|
|
125
|
+
i0.ɵɵelement(31, "span", 41);
|
|
126
126
|
i0.ɵɵtext(32, " Retry ");
|
|
127
127
|
i0.ɵɵelementEnd()()();
|
|
128
128
|
} if (rf & 2) {
|
|
@@ -134,9 +134,9 @@ function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_te
|
|
|
134
134
|
i0.ɵɵadvance();
|
|
135
135
|
i0.ɵɵconditional(ctx_r1.currentError.technicalDetails ? 19 : -1);
|
|
136
136
|
} }
|
|
137
|
-
function
|
|
138
|
-
i0.ɵɵelementStart(0, "div",
|
|
139
|
-
i0.ɵɵtemplate(1,
|
|
137
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_Template(rf, ctx) { if (rf & 1) {
|
|
138
|
+
i0.ɵɵelementStart(0, "div", 24);
|
|
139
|
+
i0.ɵɵtemplate(1, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_mj_react_component_1_Template, 1, 2, "mj-react-component", 25)(2, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_Conditional_2_Template, 33, 3, "div", 26);
|
|
140
140
|
i0.ɵɵelementEnd();
|
|
141
141
|
} if (rf & 2) {
|
|
142
142
|
const ɵ$index_4_r3 = i0.ɵɵnextContext(2).$index;
|
|
@@ -146,101 +146,107 @@ function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_te
|
|
|
146
146
|
i0.ɵɵadvance();
|
|
147
147
|
i0.ɵɵconditional(ctx_r1.currentError && ctx_r1.selectedReportOptionIndex === ɵ$index_4_r3 ? 2 : -1);
|
|
148
148
|
} }
|
|
149
|
-
function
|
|
150
|
-
i0.ɵɵelement(0, "i",
|
|
149
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_17_Template(rf, ctx) { if (rf & 1) {
|
|
150
|
+
i0.ɵɵelement(0, "i", 44);
|
|
151
151
|
i0.ɵɵtext(1, " Functional ");
|
|
152
152
|
} }
|
|
153
|
-
function
|
|
154
|
-
i0.ɵɵelementStart(0, "div",
|
|
155
|
-
i0.ɵɵelement(1, "div",
|
|
153
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_18_Template(rf, ctx) { if (rf & 1) {
|
|
154
|
+
i0.ɵɵelementStart(0, "div", 45);
|
|
155
|
+
i0.ɵɵelement(1, "div", 46);
|
|
156
156
|
i0.ɵɵelementEnd();
|
|
157
157
|
} if (rf & 2) {
|
|
158
|
-
const
|
|
158
|
+
const option_r10 = i0.ɵɵnextContext(2).$implicit;
|
|
159
159
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
160
160
|
i0.ɵɵadvance();
|
|
161
|
-
i0.ɵɵproperty("innerHTML", ctx_r1.getFormattedFunctionalRequirements(
|
|
161
|
+
i0.ɵɵproperty("innerHTML", ctx_r1.getFormattedFunctionalRequirements(option_r10), i0.ɵɵsanitizeHtml);
|
|
162
162
|
} }
|
|
163
|
-
function
|
|
164
|
-
i0.ɵɵelement(0, "i",
|
|
163
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_20_Template(rf, ctx) { if (rf & 1) {
|
|
164
|
+
i0.ɵɵelement(0, "i", 47);
|
|
165
165
|
i0.ɵɵtext(1, " Technical ");
|
|
166
166
|
} }
|
|
167
|
-
function
|
|
168
|
-
i0.ɵɵelementStart(0, "div",
|
|
169
|
-
i0.ɵɵelement(1, "div",
|
|
167
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_21_Template(rf, ctx) { if (rf & 1) {
|
|
168
|
+
i0.ɵɵelementStart(0, "div", 45);
|
|
169
|
+
i0.ɵɵelement(1, "div", 46);
|
|
170
170
|
i0.ɵɵelementEnd();
|
|
171
171
|
} if (rf & 2) {
|
|
172
|
-
const
|
|
172
|
+
const option_r10 = i0.ɵɵnextContext(2).$implicit;
|
|
173
173
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
174
174
|
i0.ɵɵadvance();
|
|
175
|
-
i0.ɵɵproperty("innerHTML", ctx_r1.getFormattedTechnicalDesign(
|
|
175
|
+
i0.ɵɵproperty("innerHTML", ctx_r1.getFormattedTechnicalDesign(option_r10), i0.ɵɵsanitizeHtml);
|
|
176
176
|
} }
|
|
177
|
-
function
|
|
178
|
-
i0.ɵɵelement(0, "i",
|
|
177
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_23_Template(rf, ctx) { if (rf & 1) {
|
|
178
|
+
i0.ɵɵelement(0, "i", 48);
|
|
179
179
|
i0.ɵɵtext(1, " Data Spec ");
|
|
180
180
|
} }
|
|
181
|
-
function
|
|
182
|
-
i0.ɵɵelementStart(0, "div",
|
|
183
|
-
i0.ɵɵelement(1, "div",
|
|
181
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_24_Template(rf, ctx) { if (rf & 1) {
|
|
182
|
+
i0.ɵɵelementStart(0, "div", 45);
|
|
183
|
+
i0.ɵɵelement(1, "div", 46);
|
|
184
184
|
i0.ɵɵelementEnd();
|
|
185
185
|
} if (rf & 2) {
|
|
186
|
-
const
|
|
186
|
+
const option_r10 = i0.ɵɵnextContext(2).$implicit;
|
|
187
187
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
188
188
|
i0.ɵɵadvance();
|
|
189
|
-
i0.ɵɵproperty("innerHTML", ctx_r1.getFormattedDataRequirements(
|
|
189
|
+
i0.ɵɵproperty("innerHTML", ctx_r1.getFormattedDataRequirements(option_r10), i0.ɵɵsanitizeHtml);
|
|
190
190
|
} }
|
|
191
|
-
function
|
|
192
|
-
i0.ɵɵelement(0, "i",
|
|
191
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_26_Template(rf, ctx) { if (rf & 1) {
|
|
192
|
+
i0.ɵɵelement(0, "i", 49);
|
|
193
193
|
i0.ɵɵtext(1, " Code ");
|
|
194
194
|
} }
|
|
195
|
-
function
|
|
196
|
-
const
|
|
197
|
-
i0.ɵɵelementStart(0, "div",
|
|
198
|
-
i0.ɵɵlistener("toolbarAction", function
|
|
195
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_27_Template(rf, ctx) { if (rf & 1) {
|
|
196
|
+
const _r11 = i0.ɵɵgetCurrentView();
|
|
197
|
+
i0.ɵɵelementStart(0, "div", 50)(1, "mj-code-editor", 51);
|
|
198
|
+
i0.ɵɵlistener("toolbarAction", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_27_Template_mj_code_editor_toolbarAction_1_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.handleCodeToolbarAction($event)); });
|
|
199
199
|
i0.ɵɵelementEnd()();
|
|
200
200
|
} if (rf & 2) {
|
|
201
|
-
const
|
|
201
|
+
const option_r10 = i0.ɵɵnextContext(2).$implicit;
|
|
202
202
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
203
203
|
i0.ɵɵadvance();
|
|
204
|
-
i0.ɵɵproperty("value", ctx_r1.getComponentCode(
|
|
204
|
+
i0.ɵɵproperty("value", ctx_r1.getComponentCode(option_r10))("language", "javascript")("autoFocus", false)("indentWithTab", true)("readonly", true)("toolbar", ctx_r1.codeToolbarConfig);
|
|
205
205
|
} }
|
|
206
|
-
function
|
|
207
|
-
i0.ɵɵelement(0, "i",
|
|
206
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_29_Template(rf, ctx) { if (rf & 1) {
|
|
207
|
+
i0.ɵɵelement(0, "i", 52);
|
|
208
208
|
i0.ɵɵtext(1, " Spec ");
|
|
209
209
|
} }
|
|
210
|
-
function
|
|
211
|
-
const
|
|
212
|
-
i0.ɵɵelementStart(0, "div",
|
|
213
|
-
i0.ɵɵlistener("toolbarAction", function
|
|
210
|
+
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_30_Template(rf, ctx) { if (rf & 1) {
|
|
211
|
+
const _r12 = i0.ɵɵgetCurrentView();
|
|
212
|
+
i0.ɵɵelementStart(0, "div", 50)(1, "mj-code-editor", 51);
|
|
213
|
+
i0.ɵɵlistener("toolbarAction", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_30_Template_mj_code_editor_toolbarAction_1_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.handleCodeToolbarAction($event)); });
|
|
214
214
|
i0.ɵɵelementEnd()();
|
|
215
215
|
} if (rf & 2) {
|
|
216
|
-
const
|
|
216
|
+
const option_r10 = i0.ɵɵnextContext(2).$implicit;
|
|
217
217
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
218
218
|
i0.ɵɵadvance();
|
|
219
|
-
i0.ɵɵproperty("value", ctx_r1.getComponentSpec(
|
|
219
|
+
i0.ɵɵproperty("value", ctx_r1.getComponentSpec(option_r10))("language", "json")("autoFocus", false)("indentWithTab", true)("readonly", true)("toolbar", ctx_r1.codeToolbarConfig);
|
|
220
220
|
} }
|
|
221
221
|
function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_Template(rf, ctx) { if (rf & 1) {
|
|
222
|
+
const _r4 = i0.ɵɵgetCurrentView();
|
|
222
223
|
i0.ɵɵelementStart(0, "div", 1)(1, "div", 7);
|
|
223
224
|
i0.ɵɵelement(2, "div", 8);
|
|
224
225
|
i0.ɵɵelementStart(3, "div", 9);
|
|
225
226
|
i0.ɵɵtemplate(4, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_button_4_Template, 4, 1, "button", 10)(5, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_button_5_Template, 4, 0, "button", 11)(6, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_button_6_Template, 4, 0, "button", 12);
|
|
226
|
-
i0.ɵɵ
|
|
227
|
-
i0.ɵɵ
|
|
228
|
-
i0.ɵɵ
|
|
227
|
+
i0.ɵɵelementStart(7, "button", 13);
|
|
228
|
+
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.toggleFeedbackPanel()); });
|
|
229
|
+
i0.ɵɵelement(8, "i", 14);
|
|
230
|
+
i0.ɵɵelementStart(9, "span");
|
|
231
|
+
i0.ɵɵtext(10);
|
|
232
|
+
i0.ɵɵelementEnd()()()();
|
|
233
|
+
i0.ɵɵelementStart(11, "div", 15)(12, "kendo-tabstrip", 16)(13, "kendo-tabstrip-tab", 3);
|
|
234
|
+
i0.ɵɵtemplate(14, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_14_Template, 2, 0, "ng-template", 4)(15, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_15_Template, 3, 2, "ng-template", 5);
|
|
229
235
|
i0.ɵɵelementEnd();
|
|
230
|
-
i0.ɵɵelementStart(
|
|
231
|
-
i0.ɵɵtemplate(
|
|
236
|
+
i0.ɵɵelementStart(16, "kendo-tabstrip-tab");
|
|
237
|
+
i0.ɵɵtemplate(17, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_17_Template, 2, 0, "ng-template", 4)(18, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_18_Template, 2, 1, "ng-template", 5);
|
|
232
238
|
i0.ɵɵelementEnd();
|
|
233
|
-
i0.ɵɵelementStart(
|
|
234
|
-
i0.ɵɵtemplate(
|
|
239
|
+
i0.ɵɵelementStart(19, "kendo-tabstrip-tab");
|
|
240
|
+
i0.ɵɵtemplate(20, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_20_Template, 2, 0, "ng-template", 4)(21, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_21_Template, 2, 1, "ng-template", 5);
|
|
235
241
|
i0.ɵɵelementEnd();
|
|
236
|
-
i0.ɵɵelementStart(
|
|
237
|
-
i0.ɵɵtemplate(
|
|
242
|
+
i0.ɵɵelementStart(22, "kendo-tabstrip-tab");
|
|
243
|
+
i0.ɵɵtemplate(23, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_23_Template, 2, 0, "ng-template", 4)(24, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_24_Template, 2, 1, "ng-template", 5);
|
|
238
244
|
i0.ɵɵelementEnd();
|
|
239
|
-
i0.ɵɵelementStart(
|
|
240
|
-
i0.ɵɵtemplate(
|
|
245
|
+
i0.ɵɵelementStart(25, "kendo-tabstrip-tab");
|
|
246
|
+
i0.ɵɵtemplate(26, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_26_Template, 2, 0, "ng-template", 4)(27, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_27_Template, 2, 6, "ng-template", 5);
|
|
241
247
|
i0.ɵɵelementEnd();
|
|
242
|
-
i0.ɵɵelementStart(
|
|
243
|
-
i0.ɵɵtemplate(
|
|
248
|
+
i0.ɵɵelementStart(28, "kendo-tabstrip-tab");
|
|
249
|
+
i0.ɵɵtemplate(29, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_29_Template, 2, 0, "ng-template", 4)(30, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_ng_template_30_Template, 2, 6, "ng-template", 5);
|
|
244
250
|
i0.ɵɵelementEnd()()()();
|
|
245
251
|
} if (rf & 2) {
|
|
246
252
|
const ctx_r1 = i0.ɵɵnextContext(3);
|
|
@@ -250,12 +256,19 @@ function SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_Templ
|
|
|
250
256
|
i0.ɵɵproperty("ngIf", ctx_r1.ShowOpenSavedReportButton && ctx_r1.matchingReportID);
|
|
251
257
|
i0.ɵɵadvance();
|
|
252
258
|
i0.ɵɵproperty("ngIf", ctx_r1.ShowPrintReport);
|
|
259
|
+
i0.ɵɵadvance();
|
|
260
|
+
i0.ɵɵclassProp("active", ctx_r1.showFeedbackPanel);
|
|
261
|
+
i0.ɵɵproperty("title", ctx_r1.showFeedbackPanel ? "Close Feedback Panel" : "Provide Component Feedback");
|
|
262
|
+
i0.ɵɵadvance();
|
|
263
|
+
i0.ɵɵclassProp("fa-comment-dots", !ctx_r1.showFeedbackPanel)("fa-times", ctx_r1.showFeedbackPanel);
|
|
264
|
+
i0.ɵɵadvance(2);
|
|
265
|
+
i0.ɵɵtextInterpolate(ctx_r1.showFeedbackPanel ? "Close" : "Feedback");
|
|
253
266
|
i0.ɵɵadvance(3);
|
|
254
267
|
i0.ɵɵproperty("selected", true);
|
|
255
268
|
} }
|
|
256
269
|
function SkipDynamicUIComponentComponent_Conditional_0_For_2_Template(rf, ctx) { if (rf & 1) {
|
|
257
270
|
i0.ɵɵelementStart(0, "kendo-tabstrip-tab", 3);
|
|
258
|
-
i0.ɵɵtemplate(1, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_1_Template, 2, 2, "ng-template", 4)(2, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_Template,
|
|
271
|
+
i0.ɵɵtemplate(1, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_1_Template, 2, 2, "ng-template", 4)(2, SkipDynamicUIComponentComponent_Conditional_0_For_2_ng_template_2_Template, 31, 12, "ng-template", 5);
|
|
259
272
|
i0.ɵɵelementEnd();
|
|
260
273
|
} if (rf & 2) {
|
|
261
274
|
const ɵ$index_4_r3 = ctx.$index;
|
|
@@ -275,10 +288,10 @@ function SkipDynamicUIComponentComponent_Conditional_0_Template(rf, ctx) { if (r
|
|
|
275
288
|
i0.ɵɵrepeater(ctx_r1.componentOptions);
|
|
276
289
|
} }
|
|
277
290
|
function SkipDynamicUIComponentComponent_Conditional_1_button_4_Template(rf, ctx) { if (rf & 1) {
|
|
278
|
-
const
|
|
279
|
-
i0.ɵɵelementStart(0, "button",
|
|
280
|
-
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_1_button_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(
|
|
281
|
-
i0.ɵɵelement(1, "i",
|
|
291
|
+
const _r14 = i0.ɵɵgetCurrentView();
|
|
292
|
+
i0.ɵɵelementStart(0, "button", 17);
|
|
293
|
+
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_1_button_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.createReportForOption(0)); });
|
|
294
|
+
i0.ɵɵelement(1, "i", 18);
|
|
282
295
|
i0.ɵɵelementStart(2, "span");
|
|
283
296
|
i0.ɵɵtext(3, "Save Report");
|
|
284
297
|
i0.ɵɵelementEnd()();
|
|
@@ -287,41 +300,41 @@ function SkipDynamicUIComponentComponent_Conditional_1_button_4_Template(rf, ctx
|
|
|
287
300
|
i0.ɵɵproperty("disabled", ctx_r1.isCreatingReport);
|
|
288
301
|
} }
|
|
289
302
|
function SkipDynamicUIComponentComponent_Conditional_1_button_5_Template(rf, ctx) { if (rf & 1) {
|
|
290
|
-
const
|
|
291
|
-
i0.ɵɵelementStart(0, "button",
|
|
292
|
-
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_1_button_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(
|
|
293
|
-
i0.ɵɵelement(1, "i",
|
|
303
|
+
const _r15 = i0.ɵɵgetCurrentView();
|
|
304
|
+
i0.ɵɵelementStart(0, "button", 19);
|
|
305
|
+
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_1_button_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.openReportForOption(0)); });
|
|
306
|
+
i0.ɵɵelement(1, "i", 20);
|
|
294
307
|
i0.ɵɵelementStart(2, "span");
|
|
295
308
|
i0.ɵɵtext(3, "Open Saved Report");
|
|
296
309
|
i0.ɵɵelementEnd()();
|
|
297
310
|
} }
|
|
298
311
|
function SkipDynamicUIComponentComponent_Conditional_1_button_6_Template(rf, ctx) { if (rf & 1) {
|
|
299
|
-
const
|
|
300
|
-
i0.ɵɵelementStart(0, "button",
|
|
301
|
-
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_1_button_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(
|
|
302
|
-
i0.ɵɵelement(1, "i",
|
|
312
|
+
const _r16 = i0.ɵɵgetCurrentView();
|
|
313
|
+
i0.ɵɵelementStart(0, "button", 21);
|
|
314
|
+
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_1_button_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.PrintReport()); });
|
|
315
|
+
i0.ɵɵelement(1, "i", 22);
|
|
303
316
|
i0.ɵɵelementStart(2, "span");
|
|
304
317
|
i0.ɵɵtext(3, "Print Report");
|
|
305
318
|
i0.ɵɵelementEnd()();
|
|
306
319
|
} }
|
|
307
|
-
function
|
|
308
|
-
i0.ɵɵelement(0, "i",
|
|
320
|
+
function SkipDynamicUIComponentComponent_Conditional_1_ng_template_14_Template(rf, ctx) { if (rf & 1) {
|
|
321
|
+
i0.ɵɵelement(0, "i", 23);
|
|
309
322
|
i0.ɵɵtext(1, " Component ");
|
|
310
323
|
} }
|
|
311
|
-
function
|
|
312
|
-
const
|
|
313
|
-
i0.ɵɵelementStart(0, "mj-react-component",
|
|
314
|
-
i0.ɵɵlistener("stateChange", function
|
|
324
|
+
function SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Conditional_1_Template(rf, ctx) { if (rf & 1) {
|
|
325
|
+
const _r17 = i0.ɵɵgetCurrentView();
|
|
326
|
+
i0.ɵɵelementStart(0, "mj-react-component", 27);
|
|
327
|
+
i0.ɵɵlistener("stateChange", function SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Conditional_1_Template_mj_react_component_stateChange_0_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onStateChange(0, $event)); })("componentEvent", function SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Conditional_1_Template_mj_react_component_componentEvent_0_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onComponentEvent(0, $event)); })("refreshData", function SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Conditional_1_Template_mj_react_component_refreshData_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.handleRefreshData()); })("openEntityRecord", function SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Conditional_1_Template_mj_react_component_openEntityRecord_0_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onOpenEntityRecord($event)); });
|
|
315
328
|
i0.ɵɵelementEnd();
|
|
316
329
|
} if (rf & 2) {
|
|
317
330
|
const ctx_r1 = i0.ɵɵnextContext(3);
|
|
318
331
|
i0.ɵɵproperty("component", ctx_r1.componentOptions[0].option)("styles", ctx_r1.componentStyles || undefined);
|
|
319
332
|
} }
|
|
320
|
-
function
|
|
321
|
-
i0.ɵɵelementStart(0, "details",
|
|
333
|
+
function SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Conditional_2_Conditional_19_Template(rf, ctx) { if (rf & 1) {
|
|
334
|
+
i0.ɵɵelementStart(0, "details", 36)(1, "summary", 42);
|
|
322
335
|
i0.ɵɵtext(2, "Technical Details (click to expand)");
|
|
323
336
|
i0.ɵɵelementEnd();
|
|
324
|
-
i0.ɵɵelementStart(3, "pre",
|
|
337
|
+
i0.ɵɵelementStart(3, "pre", 43);
|
|
325
338
|
i0.ɵɵtext(4);
|
|
326
339
|
i0.ɵɵelementEnd()();
|
|
327
340
|
} if (rf & 2) {
|
|
@@ -329,21 +342,21 @@ function SkipDynamicUIComponentComponent_Conditional_1_ng_template_11_Conditiona
|
|
|
329
342
|
i0.ɵɵadvance(4);
|
|
330
343
|
i0.ɵɵtextInterpolate(ctx_r1.formatTechnicalDetails(ctx_r1.currentError.technicalDetails));
|
|
331
344
|
} }
|
|
332
|
-
function
|
|
333
|
-
const
|
|
334
|
-
i0.ɵɵelementStart(0, "div",
|
|
335
|
-
i0.ɵɵlistener("click", function
|
|
336
|
-
i0.ɵɵelement(4, "span",
|
|
345
|
+
function SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Conditional_2_Template(rf, ctx) { if (rf & 1) {
|
|
346
|
+
const _r18 = i0.ɵɵgetCurrentView();
|
|
347
|
+
i0.ɵɵelementStart(0, "div", 26)(1, "div", 28)(2, "div", 29)(3, "button", 30);
|
|
348
|
+
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Conditional_2_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.copyErrorToClipboard()); });
|
|
349
|
+
i0.ɵɵelement(4, "span", 31);
|
|
337
350
|
i0.ɵɵtext(5, " Copy Error Details ");
|
|
338
351
|
i0.ɵɵelementEnd();
|
|
339
|
-
i0.ɵɵelementStart(6, "h3",
|
|
340
|
-
i0.ɵɵelement(7, "span",
|
|
352
|
+
i0.ɵɵelementStart(6, "h3", 32);
|
|
353
|
+
i0.ɵɵelement(7, "span", 33);
|
|
341
354
|
i0.ɵɵtext(8, " Component Rendering Error ");
|
|
342
355
|
i0.ɵɵelementEnd()();
|
|
343
|
-
i0.ɵɵelementStart(9, "p",
|
|
356
|
+
i0.ɵɵelementStart(9, "p", 34);
|
|
344
357
|
i0.ɵɵtext(10, " The selected component option could not be rendered due to the following error: ");
|
|
345
358
|
i0.ɵɵelementEnd();
|
|
346
|
-
i0.ɵɵelementStart(11, "div",
|
|
359
|
+
i0.ɵɵelementStart(11, "div", 35)(12, "strong");
|
|
347
360
|
i0.ɵɵtext(13, "Error Type:");
|
|
348
361
|
i0.ɵɵelementEnd();
|
|
349
362
|
i0.ɵɵtext(14);
|
|
@@ -352,20 +365,20 @@ function SkipDynamicUIComponentComponent_Conditional_1_ng_template_11_Conditiona
|
|
|
352
365
|
i0.ɵɵtext(17, "Details:");
|
|
353
366
|
i0.ɵɵelementEnd();
|
|
354
367
|
i0.ɵɵtext(18);
|
|
355
|
-
i0.ɵɵtemplate(19,
|
|
368
|
+
i0.ɵɵtemplate(19, SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Conditional_2_Conditional_19_Template, 5, 1, "details", 36);
|
|
356
369
|
i0.ɵɵelementEnd();
|
|
357
|
-
i0.ɵɵelementStart(20, "div",
|
|
370
|
+
i0.ɵɵelementStart(20, "div", 37)(21, "strong", 38);
|
|
358
371
|
i0.ɵɵtext(22, "What to do:");
|
|
359
372
|
i0.ɵɵelementEnd();
|
|
360
|
-
i0.ɵɵelementStart(23, "ol",
|
|
373
|
+
i0.ɵɵelementStart(23, "ol", 39)(24, "li");
|
|
361
374
|
i0.ɵɵtext(25, "Copy the error details and send them back to Skip in the chat to get a corrected version");
|
|
362
375
|
i0.ɵɵelementEnd();
|
|
363
376
|
i0.ɵɵelementStart(26, "li");
|
|
364
377
|
i0.ɵɵtext(27, "Contact your IT department if the issue persists");
|
|
365
378
|
i0.ɵɵelementEnd()()();
|
|
366
|
-
i0.ɵɵelementStart(28, "button",
|
|
367
|
-
i0.ɵɵlistener("click", function
|
|
368
|
-
i0.ɵɵelement(29, "span",
|
|
379
|
+
i0.ɵɵelementStart(28, "button", 40);
|
|
380
|
+
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Conditional_2_Template_button_click_28_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.retryCurrentOption()); });
|
|
381
|
+
i0.ɵɵelement(29, "span", 41);
|
|
369
382
|
i0.ɵɵtext(30, " Retry ");
|
|
370
383
|
i0.ɵɵelementEnd()()();
|
|
371
384
|
} if (rf & 2) {
|
|
@@ -377,9 +390,9 @@ function SkipDynamicUIComponentComponent_Conditional_1_ng_template_11_Conditiona
|
|
|
377
390
|
i0.ɵɵadvance();
|
|
378
391
|
i0.ɵɵconditional(ctx_r1.currentError.technicalDetails ? 19 : -1);
|
|
379
392
|
} }
|
|
380
|
-
function
|
|
381
|
-
i0.ɵɵelementStart(0, "div",
|
|
382
|
-
i0.ɵɵtemplate(1,
|
|
393
|
+
function SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Template(rf, ctx) { if (rf & 1) {
|
|
394
|
+
i0.ɵɵelementStart(0, "div", 24);
|
|
395
|
+
i0.ɵɵtemplate(1, SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Conditional_1_Template, 1, 2, "mj-react-component", 53)(2, SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Conditional_2_Template, 31, 3, "div", 26);
|
|
383
396
|
i0.ɵɵelementEnd();
|
|
384
397
|
} if (rf & 2) {
|
|
385
398
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
@@ -388,108 +401,114 @@ function SkipDynamicUIComponentComponent_Conditional_1_ng_template_11_Template(r
|
|
|
388
401
|
i0.ɵɵadvance();
|
|
389
402
|
i0.ɵɵconditional(ctx_r1.currentError ? 2 : -1);
|
|
390
403
|
} }
|
|
391
|
-
function
|
|
392
|
-
i0.ɵɵelement(0, "i",
|
|
404
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_16_ng_template_1_Template(rf, ctx) { if (rf & 1) {
|
|
405
|
+
i0.ɵɵelement(0, "i", 44);
|
|
393
406
|
i0.ɵɵtext(1, " Functional ");
|
|
394
407
|
} }
|
|
395
|
-
function
|
|
396
|
-
i0.ɵɵelementStart(0, "div",
|
|
397
|
-
i0.ɵɵelement(1, "div",
|
|
408
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_16_ng_template_2_Template(rf, ctx) { if (rf & 1) {
|
|
409
|
+
i0.ɵɵelementStart(0, "div", 45);
|
|
410
|
+
i0.ɵɵelement(1, "div", 46);
|
|
398
411
|
i0.ɵɵelementEnd();
|
|
399
412
|
} if (rf & 2) {
|
|
400
413
|
const ctx_r1 = i0.ɵɵnextContext(3);
|
|
401
414
|
i0.ɵɵadvance();
|
|
402
415
|
i0.ɵɵproperty("innerHTML", ctx_r1.getFormattedFunctionalRequirements(ctx_r1.componentOptions[0]), i0.ɵɵsanitizeHtml);
|
|
403
416
|
} }
|
|
404
|
-
function
|
|
417
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_16_Template(rf, ctx) { if (rf & 1) {
|
|
405
418
|
i0.ɵɵelementStart(0, "kendo-tabstrip-tab");
|
|
406
|
-
i0.ɵɵtemplate(1,
|
|
419
|
+
i0.ɵɵtemplate(1, SkipDynamicUIComponentComponent_Conditional_1_Conditional_16_ng_template_1_Template, 2, 0, "ng-template", 4)(2, SkipDynamicUIComponentComponent_Conditional_1_Conditional_16_ng_template_2_Template, 2, 1, "ng-template", 5);
|
|
407
420
|
i0.ɵɵelementEnd();
|
|
408
421
|
} }
|
|
409
|
-
function
|
|
410
|
-
i0.ɵɵelement(0, "i",
|
|
422
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_17_ng_template_1_Template(rf, ctx) { if (rf & 1) {
|
|
423
|
+
i0.ɵɵelement(0, "i", 47);
|
|
411
424
|
i0.ɵɵtext(1, " Technical ");
|
|
412
425
|
} }
|
|
413
|
-
function
|
|
414
|
-
i0.ɵɵelementStart(0, "div",
|
|
415
|
-
i0.ɵɵelement(1, "div",
|
|
426
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_17_ng_template_2_Template(rf, ctx) { if (rf & 1) {
|
|
427
|
+
i0.ɵɵelementStart(0, "div", 45);
|
|
428
|
+
i0.ɵɵelement(1, "div", 46);
|
|
416
429
|
i0.ɵɵelementEnd();
|
|
417
430
|
} if (rf & 2) {
|
|
418
431
|
const ctx_r1 = i0.ɵɵnextContext(3);
|
|
419
432
|
i0.ɵɵadvance();
|
|
420
433
|
i0.ɵɵproperty("innerHTML", ctx_r1.getFormattedTechnicalDesign(ctx_r1.componentOptions[0]), i0.ɵɵsanitizeHtml);
|
|
421
434
|
} }
|
|
422
|
-
function
|
|
435
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_17_Template(rf, ctx) { if (rf & 1) {
|
|
423
436
|
i0.ɵɵelementStart(0, "kendo-tabstrip-tab");
|
|
424
|
-
i0.ɵɵtemplate(1,
|
|
437
|
+
i0.ɵɵtemplate(1, SkipDynamicUIComponentComponent_Conditional_1_Conditional_17_ng_template_1_Template, 2, 0, "ng-template", 4)(2, SkipDynamicUIComponentComponent_Conditional_1_Conditional_17_ng_template_2_Template, 2, 1, "ng-template", 5);
|
|
425
438
|
i0.ɵɵelementEnd();
|
|
426
439
|
} }
|
|
427
|
-
function
|
|
428
|
-
i0.ɵɵelement(0, "i",
|
|
440
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_18_ng_template_1_Template(rf, ctx) { if (rf & 1) {
|
|
441
|
+
i0.ɵɵelement(0, "i", 48);
|
|
429
442
|
i0.ɵɵtext(1, " Data Spec ");
|
|
430
443
|
} }
|
|
431
|
-
function
|
|
432
|
-
i0.ɵɵelementStart(0, "div",
|
|
433
|
-
i0.ɵɵelement(1, "div",
|
|
444
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_18_ng_template_2_Template(rf, ctx) { if (rf & 1) {
|
|
445
|
+
i0.ɵɵelementStart(0, "div", 45);
|
|
446
|
+
i0.ɵɵelement(1, "div", 46);
|
|
434
447
|
i0.ɵɵelementEnd();
|
|
435
448
|
} if (rf & 2) {
|
|
436
449
|
const ctx_r1 = i0.ɵɵnextContext(3);
|
|
437
450
|
i0.ɵɵadvance();
|
|
438
451
|
i0.ɵɵproperty("innerHTML", ctx_r1.getFormattedDataRequirements(ctx_r1.componentOptions[0]), i0.ɵɵsanitizeHtml);
|
|
439
452
|
} }
|
|
440
|
-
function
|
|
453
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_18_Template(rf, ctx) { if (rf & 1) {
|
|
441
454
|
i0.ɵɵelementStart(0, "kendo-tabstrip-tab");
|
|
442
|
-
i0.ɵɵtemplate(1,
|
|
455
|
+
i0.ɵɵtemplate(1, SkipDynamicUIComponentComponent_Conditional_1_Conditional_18_ng_template_1_Template, 2, 0, "ng-template", 4)(2, SkipDynamicUIComponentComponent_Conditional_1_Conditional_18_ng_template_2_Template, 2, 1, "ng-template", 5);
|
|
443
456
|
i0.ɵɵelementEnd();
|
|
444
457
|
} }
|
|
445
|
-
function
|
|
446
|
-
i0.ɵɵelement(0, "i",
|
|
458
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_19_ng_template_1_Template(rf, ctx) { if (rf & 1) {
|
|
459
|
+
i0.ɵɵelement(0, "i", 49);
|
|
447
460
|
i0.ɵɵtext(1, " Code ");
|
|
448
461
|
} }
|
|
449
|
-
function
|
|
450
|
-
const
|
|
451
|
-
i0.ɵɵelementStart(0, "div",
|
|
452
|
-
i0.ɵɵlistener("toolbarAction", function
|
|
462
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_19_ng_template_2_Template(rf, ctx) { if (rf & 1) {
|
|
463
|
+
const _r19 = i0.ɵɵgetCurrentView();
|
|
464
|
+
i0.ɵɵelementStart(0, "div", 50)(1, "mj-code-editor", 51);
|
|
465
|
+
i0.ɵɵlistener("toolbarAction", function SkipDynamicUIComponentComponent_Conditional_1_Conditional_19_ng_template_2_Template_mj_code_editor_toolbarAction_1_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.handleCodeToolbarAction($event)); });
|
|
453
466
|
i0.ɵɵelementEnd()();
|
|
454
467
|
} if (rf & 2) {
|
|
455
468
|
const ctx_r1 = i0.ɵɵnextContext(3);
|
|
456
469
|
i0.ɵɵadvance();
|
|
457
470
|
i0.ɵɵproperty("value", ctx_r1.getComponentCode(ctx_r1.componentOptions[0]))("language", "javascript")("autoFocus", false)("indentWithTab", true)("readonly", true)("toolbar", ctx_r1.codeToolbarConfig);
|
|
458
471
|
} }
|
|
459
|
-
function
|
|
472
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_19_Template(rf, ctx) { if (rf & 1) {
|
|
460
473
|
i0.ɵɵelementStart(0, "kendo-tabstrip-tab");
|
|
461
|
-
i0.ɵɵtemplate(1,
|
|
474
|
+
i0.ɵɵtemplate(1, SkipDynamicUIComponentComponent_Conditional_1_Conditional_19_ng_template_1_Template, 2, 0, "ng-template", 4)(2, SkipDynamicUIComponentComponent_Conditional_1_Conditional_19_ng_template_2_Template, 2, 6, "ng-template", 5);
|
|
462
475
|
i0.ɵɵelementEnd();
|
|
463
476
|
} }
|
|
464
|
-
function
|
|
465
|
-
i0.ɵɵelement(0, "i",
|
|
477
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_20_ng_template_1_Template(rf, ctx) { if (rf & 1) {
|
|
478
|
+
i0.ɵɵelement(0, "i", 52);
|
|
466
479
|
i0.ɵɵtext(1, " Spec ");
|
|
467
480
|
} }
|
|
468
|
-
function
|
|
469
|
-
const
|
|
470
|
-
i0.ɵɵelementStart(0, "div",
|
|
471
|
-
i0.ɵɵlistener("toolbarAction", function
|
|
481
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_20_ng_template_2_Template(rf, ctx) { if (rf & 1) {
|
|
482
|
+
const _r20 = i0.ɵɵgetCurrentView();
|
|
483
|
+
i0.ɵɵelementStart(0, "div", 50)(1, "mj-code-editor", 51);
|
|
484
|
+
i0.ɵɵlistener("toolbarAction", function SkipDynamicUIComponentComponent_Conditional_1_Conditional_20_ng_template_2_Template_mj_code_editor_toolbarAction_1_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.handleCodeToolbarAction($event)); });
|
|
472
485
|
i0.ɵɵelementEnd()();
|
|
473
486
|
} if (rf & 2) {
|
|
474
487
|
const ctx_r1 = i0.ɵɵnextContext(3);
|
|
475
488
|
i0.ɵɵadvance();
|
|
476
489
|
i0.ɵɵproperty("value", ctx_r1.getComponentSpec(ctx_r1.componentOptions[0]))("language", "json")("autoFocus", false)("indentWithTab", true)("readonly", true)("toolbar", ctx_r1.codeToolbarConfig);
|
|
477
490
|
} }
|
|
478
|
-
function
|
|
491
|
+
function SkipDynamicUIComponentComponent_Conditional_1_Conditional_20_Template(rf, ctx) { if (rf & 1) {
|
|
479
492
|
i0.ɵɵelementStart(0, "kendo-tabstrip-tab");
|
|
480
|
-
i0.ɵɵtemplate(1,
|
|
493
|
+
i0.ɵɵtemplate(1, SkipDynamicUIComponentComponent_Conditional_1_Conditional_20_ng_template_1_Template, 2, 0, "ng-template", 4)(2, SkipDynamicUIComponentComponent_Conditional_1_Conditional_20_ng_template_2_Template, 2, 6, "ng-template", 5);
|
|
481
494
|
i0.ɵɵelementEnd();
|
|
482
495
|
} }
|
|
483
496
|
function SkipDynamicUIComponentComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
|
|
497
|
+
const _r13 = i0.ɵɵgetCurrentView();
|
|
484
498
|
i0.ɵɵelementStart(0, "div", 1)(1, "div", 7);
|
|
485
499
|
i0.ɵɵelement(2, "div", 8);
|
|
486
500
|
i0.ɵɵelementStart(3, "div", 9);
|
|
487
501
|
i0.ɵɵtemplate(4, SkipDynamicUIComponentComponent_Conditional_1_button_4_Template, 4, 1, "button", 10)(5, SkipDynamicUIComponentComponent_Conditional_1_button_5_Template, 4, 0, "button", 11)(6, SkipDynamicUIComponentComponent_Conditional_1_button_6_Template, 4, 0, "button", 12);
|
|
488
|
-
i0.ɵɵ
|
|
489
|
-
i0.ɵɵ
|
|
490
|
-
i0.ɵɵ
|
|
502
|
+
i0.ɵɵelementStart(7, "button", 13);
|
|
503
|
+
i0.ɵɵlistener("click", function SkipDynamicUIComponentComponent_Conditional_1_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleFeedbackPanel()); });
|
|
504
|
+
i0.ɵɵelement(8, "i", 14);
|
|
505
|
+
i0.ɵɵelementStart(9, "span");
|
|
506
|
+
i0.ɵɵtext(10);
|
|
507
|
+
i0.ɵɵelementEnd()()()();
|
|
508
|
+
i0.ɵɵelementStart(11, "div", 15)(12, "kendo-tabstrip", 16)(13, "kendo-tabstrip-tab", 3);
|
|
509
|
+
i0.ɵɵtemplate(14, SkipDynamicUIComponentComponent_Conditional_1_ng_template_14_Template, 2, 0, "ng-template", 4)(15, SkipDynamicUIComponentComponent_Conditional_1_ng_template_15_Template, 3, 2, "ng-template", 5);
|
|
491
510
|
i0.ɵɵelementEnd();
|
|
492
|
-
i0.ɵɵtemplate(
|
|
511
|
+
i0.ɵɵtemplate(16, SkipDynamicUIComponentComponent_Conditional_1_Conditional_16_Template, 3, 0, "kendo-tabstrip-tab")(17, SkipDynamicUIComponentComponent_Conditional_1_Conditional_17_Template, 3, 0, "kendo-tabstrip-tab")(18, SkipDynamicUIComponentComponent_Conditional_1_Conditional_18_Template, 3, 0, "kendo-tabstrip-tab")(19, SkipDynamicUIComponentComponent_Conditional_1_Conditional_19_Template, 3, 0, "kendo-tabstrip-tab")(20, SkipDynamicUIComponentComponent_Conditional_1_Conditional_20_Template, 3, 0, "kendo-tabstrip-tab");
|
|
493
512
|
i0.ɵɵelementEnd()()();
|
|
494
513
|
} if (rf & 2) {
|
|
495
514
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
@@ -499,18 +518,25 @@ function SkipDynamicUIComponentComponent_Conditional_1_Template(rf, ctx) { if (r
|
|
|
499
518
|
i0.ɵɵproperty("ngIf", ctx_r1.ShowOpenSavedReportButton && ctx_r1.matchingReportID);
|
|
500
519
|
i0.ɵɵadvance();
|
|
501
520
|
i0.ɵɵproperty("ngIf", ctx_r1.ShowPrintReport);
|
|
521
|
+
i0.ɵɵadvance();
|
|
522
|
+
i0.ɵɵclassProp("active", ctx_r1.showFeedbackPanel);
|
|
523
|
+
i0.ɵɵproperty("title", ctx_r1.showFeedbackPanel ? "Close Feedback Panel" : "Provide Component Feedback");
|
|
524
|
+
i0.ɵɵadvance();
|
|
525
|
+
i0.ɵɵclassProp("fa-comment-dots", !ctx_r1.showFeedbackPanel)("fa-times", ctx_r1.showFeedbackPanel);
|
|
526
|
+
i0.ɵɵadvance(2);
|
|
527
|
+
i0.ɵɵtextInterpolate(ctx_r1.showFeedbackPanel ? "Close" : "Feedback");
|
|
502
528
|
i0.ɵɵadvance(3);
|
|
503
529
|
i0.ɵɵproperty("selected", true);
|
|
504
530
|
i0.ɵɵadvance(3);
|
|
505
|
-
i0.ɵɵconditional(ctx_r1.componentOptions[0] ?
|
|
531
|
+
i0.ɵɵconditional(ctx_r1.componentOptions[0] ? 16 : -1);
|
|
506
532
|
i0.ɵɵadvance();
|
|
507
|
-
i0.ɵɵconditional(ctx_r1.componentOptions[0] ?
|
|
533
|
+
i0.ɵɵconditional(ctx_r1.componentOptions[0] ? 17 : -1);
|
|
508
534
|
i0.ɵɵadvance();
|
|
509
|
-
i0.ɵɵconditional(ctx_r1.componentOptions[0] ?
|
|
535
|
+
i0.ɵɵconditional(ctx_r1.componentOptions[0] ? 18 : -1);
|
|
510
536
|
i0.ɵɵadvance();
|
|
511
|
-
i0.ɵɵconditional(ctx_r1.componentOptions[0] ?
|
|
537
|
+
i0.ɵɵconditional(ctx_r1.componentOptions[0] ? 19 : -1);
|
|
512
538
|
i0.ɵɵadvance();
|
|
513
|
-
i0.ɵɵconditional(ctx_r1.componentOptions[0] ?
|
|
539
|
+
i0.ɵɵconditional(ctx_r1.componentOptions[0] ? 20 : -1);
|
|
514
540
|
} }
|
|
515
541
|
export class SkipDynamicUIComponentComponent {
|
|
516
542
|
sanitizer;
|
|
@@ -524,6 +550,8 @@ export class SkipDynamicUIComponentComponent {
|
|
|
524
550
|
ShowCreateReportButton = false;
|
|
525
551
|
ShowOpenSavedReportButton = true;
|
|
526
552
|
matchingReportID = null;
|
|
553
|
+
showFeedbackPanel = false;
|
|
554
|
+
toggleFeedbackPanel = () => { };
|
|
527
555
|
DrillDownEvent = new EventEmitter();
|
|
528
556
|
CreateReportRequested = new EventEmitter();
|
|
529
557
|
NavigateToMatchingReportRequested = new EventEmitter();
|
|
@@ -1216,15 +1244,15 @@ Component Name: ${this.ComponentObjectName || 'Unknown'}`;
|
|
|
1216
1244
|
} if (rf & 2) {
|
|
1217
1245
|
let _t;
|
|
1218
1246
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.reactComponents = _t);
|
|
1219
|
-
} }, inputs: { UIComponentCode: "UIComponentCode", ComponentObjectName: "ComponentObjectName", ShowPrintReport: "ShowPrintReport", ShowReportOptionsToggle: "ShowReportOptionsToggle", ShowCreateReportButton: "ShowCreateReportButton", ShowOpenSavedReportButton: "ShowOpenSavedReportButton", matchingReportID: "matchingReportID", SkipData: "SkipData" }, outputs: { DrillDownEvent: "DrillDownEvent", CreateReportRequested: "CreateReportRequested", NavigateToMatchingReportRequested: "NavigateToMatchingReportRequested" }, features: [i0.ɵɵNgOnChangesFeature], decls: 2, vars: 1, consts: [[2, "height", "100%", "display", "flex", "flex-direction", "column", 3, "keepTabContent"], [2, "height", "100%", "display", "flex", "flex-direction", "column"], [2, "height", "100%", "display", "flex", "flex-direction", "column", 3, "tabSelect", "keepTabContent"], [3, "selected"], ["kendoTabTitle", ""], ["kendoTabContent", ""], [1, "fa-solid", "fa-star", "star-icon"], [1, "tab-action-bar"], [1, "tab-actions-left"], [1, "tab-actions-right"], ["class", "tab-action-button create-button", 3, "disabled", "click", 4, "ngIf"], ["class", "tab-action-button create-button", 3, "click", 4, "ngIf"], ["class", "tab-action-button print-button", "title", "Print Report", 3, "click", 4, "ngIf"], [1, "inner-tabstrip-container", 2, "flex", "1", "display", "flex", "flex-direction", "column", "min-height", "0", "overflow", "hidden"], [1, "inner-tabs", 2, "height", "100%", "display", "flex", "flex-direction", "column"], [1, "tab-action-button", "create-button", 3, "click", "disabled"], [1, "fa-solid", "fa-save"], [1, "tab-action-button", "create-button", 3, "click"], [1, "fa-solid", "fa-folder-open"], ["title", "Print Report", 1, "tab-action-button", "print-button", 3, "click"], [1, "fa-solid", "fa-print"], [1, "fa-solid", "fa-chart-line"], [2, "height", "100%", "position", "relative", "overflow", "auto"], ["style", "width: 100%; height: 100%;", 3, "component", "styles", "stateChange", "componentEvent", "refreshData", "openEntityRecord", 4, "ngIf"], [2, "top", "0", "left", "0", "right", "0", "bottom", "0", "display", "flex", "align-items", "flex-start", "justify-content", "center", "padding-top", "20px", "background", "rgba(255, 255, 255, 0.95)", "z-index", "10"], [2, "width", "100%", "height", "100%", 3, "stateChange", "componentEvent", "refreshData", "openEntityRecord", "component", "styles"], [2, "width", "90%", "max-width", "600px", "height", "500px", "background-color", "#f8f9fa", "border", "2px solid #dc3545", "border-radius", "8px", "padding", "20px", "overflow-y", "auto", "box-shadow", "0 4px 6px rgba(0, 0, 0, 0.1)"], [2, "position", "relative"], ["kendoButton", "", 2, "position", "absolute", "top", "0", "right", "0", "font-size", "12px", 3, "click"], [1, "fa-solid", "fa-copy"], [2, "color", "#dc3545", "margin-top", "0", "margin-right", "150px", "font-size", "18px"], [1, "fa-solid", "fa-exclamation-triangle"], [2, "margin-bottom", "10px", "font-size", "14px"], [2, "background-color", "#fff", "border", "1px solid #dee2e6", "border-radius", "4px", "padding", "12px", "margin-bottom", "12px", "font-family", "'Courier New', monospace", "font-size", "12px"], [2, "margin-top", "8px"], [2, "background-color", "#e7f3ff", "border", "1px solid #b3d9ff", "border-radius", "4px", "padding", "12px", "margin-bottom", "12px"], [2, "font-size", "14px"], [2, "margin", "8px 0 0 20px", "padding", "0", "font-size", "13px"], ["kendoButton", "", 2, "font-size", "13px", 3, "click"], [1, "fa-solid", "fa-rotate"], [2, "cursor", "pointer", "color", "#0056b3"], [2, "margin-top", "8px", "white-space", "pre-wrap", "word-break", "break-word", "font-size", "11px"], [1, "fa-solid", "fa-list-check"], [1, "details-content", 2, "height", "100%", "overflow", "auto", "padding", "20px"], [3, "innerHTML"], [1, "fa-solid", "fa-cogs"], [1, "fa-solid", "fa-database"], [1, "fa-solid", "fa-code"], [1, "details-content", "code-content", 2, "height", "100%", "overflow", "hidden"], [2, "height", "100%", 3, "toolbarAction", "value", "language", "autoFocus", "indentWithTab", "readonly", "toolbar"], [1, "fa-solid", "fa-file-code"], [2, "width", "100%", "height", "100%", 3, "component", "styles"]], template: function SkipDynamicUIComponentComponent_Template(rf, ctx) { if (rf & 1) {
|
|
1220
|
-
i0.ɵɵtemplate(0, SkipDynamicUIComponentComponent_Conditional_0_Template, 3, 1, "kendo-tabstrip", 0)(1, SkipDynamicUIComponentComponent_Conditional_1_Template,
|
|
1247
|
+
} }, inputs: { UIComponentCode: "UIComponentCode", ComponentObjectName: "ComponentObjectName", ShowPrintReport: "ShowPrintReport", ShowReportOptionsToggle: "ShowReportOptionsToggle", ShowCreateReportButton: "ShowCreateReportButton", ShowOpenSavedReportButton: "ShowOpenSavedReportButton", matchingReportID: "matchingReportID", showFeedbackPanel: "showFeedbackPanel", toggleFeedbackPanel: "toggleFeedbackPanel", SkipData: "SkipData" }, outputs: { DrillDownEvent: "DrillDownEvent", CreateReportRequested: "CreateReportRequested", NavigateToMatchingReportRequested: "NavigateToMatchingReportRequested" }, features: [i0.ɵɵNgOnChangesFeature], decls: 2, vars: 1, consts: [[2, "height", "100%", "display", "flex", "flex-direction", "column", 3, "keepTabContent"], [2, "height", "100%", "display", "flex", "flex-direction", "column"], [2, "height", "100%", "display", "flex", "flex-direction", "column", 3, "tabSelect", "keepTabContent"], [3, "selected"], ["kendoTabTitle", ""], ["kendoTabContent", ""], [1, "fa-solid", "fa-star", "star-icon"], [1, "tab-action-bar"], [1, "tab-actions-left"], [1, "tab-actions-right"], ["class", "tab-action-button create-button", 3, "disabled", "click", 4, "ngIf"], ["class", "tab-action-button create-button", 3, "click", 4, "ngIf"], ["class", "tab-action-button print-button", "title", "Print Report", 3, "click", 4, "ngIf"], [1, "tab-action-button", "feedback-button", 3, "click", "title"], [1, "fa-solid"], [1, "inner-tabstrip-container", 2, "flex", "1", "display", "flex", "flex-direction", "column", "min-height", "0", "overflow", "hidden"], [1, "inner-tabs", 2, "height", "100%", "display", "flex", "flex-direction", "column"], [1, "tab-action-button", "create-button", 3, "click", "disabled"], [1, "fa-solid", "fa-save"], [1, "tab-action-button", "create-button", 3, "click"], [1, "fa-solid", "fa-folder-open"], ["title", "Print Report", 1, "tab-action-button", "print-button", 3, "click"], [1, "fa-solid", "fa-print"], [1, "fa-solid", "fa-chart-line"], [2, "height", "100%", "position", "relative", "overflow", "auto"], ["style", "width: 100%; height: 100%;", 3, "component", "styles", "stateChange", "componentEvent", "refreshData", "openEntityRecord", 4, "ngIf"], [2, "top", "0", "left", "0", "right", "0", "bottom", "0", "display", "flex", "align-items", "flex-start", "justify-content", "center", "padding-top", "20px", "background", "rgba(255, 255, 255, 0.95)", "z-index", "10"], [2, "width", "100%", "height", "100%", 3, "stateChange", "componentEvent", "refreshData", "openEntityRecord", "component", "styles"], [2, "width", "90%", "max-width", "600px", "height", "500px", "background-color", "#f8f9fa", "border", "2px solid #dc3545", "border-radius", "8px", "padding", "20px", "overflow-y", "auto", "box-shadow", "0 4px 6px rgba(0, 0, 0, 0.1)"], [2, "position", "relative"], ["kendoButton", "", 2, "position", "absolute", "top", "0", "right", "0", "font-size", "12px", 3, "click"], [1, "fa-solid", "fa-copy"], [2, "color", "#dc3545", "margin-top", "0", "margin-right", "150px", "font-size", "18px"], [1, "fa-solid", "fa-exclamation-triangle"], [2, "margin-bottom", "10px", "font-size", "14px"], [2, "background-color", "#fff", "border", "1px solid #dee2e6", "border-radius", "4px", "padding", "12px", "margin-bottom", "12px", "font-family", "'Courier New', monospace", "font-size", "12px"], [2, "margin-top", "8px"], [2, "background-color", "#e7f3ff", "border", "1px solid #b3d9ff", "border-radius", "4px", "padding", "12px", "margin-bottom", "12px"], [2, "font-size", "14px"], [2, "margin", "8px 0 0 20px", "padding", "0", "font-size", "13px"], ["kendoButton", "", 2, "font-size", "13px", 3, "click"], [1, "fa-solid", "fa-rotate"], [2, "cursor", "pointer", "color", "#0056b3"], [2, "margin-top", "8px", "white-space", "pre-wrap", "word-break", "break-word", "font-size", "11px"], [1, "fa-solid", "fa-list-check"], [1, "details-content", 2, "height", "100%", "overflow", "auto", "padding", "20px"], [3, "innerHTML"], [1, "fa-solid", "fa-cogs"], [1, "fa-solid", "fa-database"], [1, "fa-solid", "fa-code"], [1, "details-content", "code-content", 2, "height", "100%", "overflow", "hidden"], [2, "height", "100%", 3, "toolbarAction", "value", "language", "autoFocus", "indentWithTab", "readonly", "toolbar"], [1, "fa-solid", "fa-file-code"], [2, "width", "100%", "height", "100%", 3, "component", "styles"]], template: function SkipDynamicUIComponentComponent_Template(rf, ctx) { if (rf & 1) {
|
|
1248
|
+
i0.ɵɵtemplate(0, SkipDynamicUIComponentComponent_Conditional_0_Template, 3, 1, "kendo-tabstrip", 0)(1, SkipDynamicUIComponentComponent_Conditional_1_Template, 21, 17, "div", 1);
|
|
1221
1249
|
} if (rf & 2) {
|
|
1222
1250
|
i0.ɵɵconditional(ctx.componentOptions.length > 1 ? 0 : 1);
|
|
1223
|
-
} }, dependencies: [i3.NgIf, i4.TabStripComponent, i4.TabStripTabComponent, i4.TabContentDirective, i4.TabTitleDirective, i5.ButtonComponent, i6.CodeEditorComponent, i2.MJReactComponent], styles: ["[_nghost-%COMP%] {\n display: block;\n height: 100%;\n position: relative;\n}\n\n\n\n.tab-action-bar[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 8px 12px;\n background-color: #fafafa;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.tab-actions-left[_ngcontent-%COMP%], \n.tab-actions-right[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n\n\n.tab-action-button[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 6px 14px;\n background-color: transparent;\n border: 1px solid #e0e0e0;\n border-radius: 6px;\n cursor: pointer;\n font-size: 13px;\n font-weight: 500;\n color: #333;\n transition: all 0.15s ease;\n white-space: nowrap;\n}\n\n.tab-action-button[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #f5f5f5;\n border-color: #d0d0d0;\n}\n\n.tab-action-button[_ngcontent-%COMP%]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.tab-action-button[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n\n\n\n.tab-action-button.create-button[_ngcontent-%COMP%], \n.tab-action-button.print-button[_ngcontent-%COMP%] {\n background-color: white;\n color: #333;\n border-color: #e0e0e0;\n}\n\n.tab-action-button.create-button[_ngcontent-%COMP%]:hover:not(:disabled), \n.tab-action-button.print-button[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #f5f5f5;\n border-color: #d0d0d0;\n}\n\n\n\n.tab-action-button.toggle-button[_ngcontent-%COMP%] {\n background-color: white;\n color: #666;\n border-color: #e0e0e0;\n}\n\n.tab-action-button.toggle-button[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #f5f5f5;\n border-color: #d0d0d0;\n color: #333;\n}\n\n.tab-action-button.toggle-button.active[_ngcontent-%COMP%] {\n background-color: #5B4FE9;\n color: white;\n border-color: #5B4FE9;\n}\n\n.tab-action-button.toggle-button.active[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #4940D4;\n border-color: #4940D4;\n}\n\n\n\n.details-panel[_ngcontent-%COMP%] {\n border-bottom: 1px solid #e0e0e0;\n background-color: #fafafa;\n overflow: hidden;\n transition: height 0.3s ease;\n}\n\n.details-content[_ngcontent-%COMP%] {\n padding: 16px;\n overflow-y: auto;\n height: 100%;\n font-size: 14px;\n line-height: 1.6;\n}\n\n.details-content.code-content[_ngcontent-%COMP%] {\n padding: 0;\n}\n\n\n\n.panel-resizer[_ngcontent-%COMP%] {\n height: 4px;\n background-color: #e0e0e0;\n cursor: ns-resize;\n position: relative;\n transition: background-color 0.2s ease;\n}\n\n.panel-resizer[_ngcontent-%COMP%]:hover {\n background-color: #d0d0d0;\n}\n\n.resizer-handle[_ngcontent-%COMP%] {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 40px;\n height: 2px;\n background-color: #999;\n border-radius: 1px;\n}\n\n\n\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(h1) { font-size: 1.5em; margin-top: 0; margin-bottom: 0.5em; }\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(h2) { font-size: 1.3em; margin-top: 1em; margin-bottom: 0.5em; }\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(h3) { font-size: 1.1em; margin-top: 1em; margin-bottom: 0.5em; }\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(ul), .details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(ol) { margin-left: 1.5em; }\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(code) { \n background-color: #f4f4f4; \n padding: 2px 4px; \n border-radius: 3px; \n font-family: 'Courier New', monospace; \n font-size: 0.9em;\n}\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(pre) { \n background-color: #f4f4f4; \n padding: 12px; \n border-radius: 4px; \n overflow-x: auto; \n}\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(blockquote) { \n border-left: 4px solid #e0e0e0; \n padding-left: 16px; \n margin-left: 0; \n color: #666; \n}\n\n\n\n .k-tabstrip {\n border: none;\n height: 100%;\n display: flex;\n flex-direction: column;\n margin: 0;\n}\n\n .k-tabstrip-items {\n background: #f8f9fa;\n border: none;\n border-bottom: 1px solid #e0e0e0;\n flex: 0 0 auto;\n padding: 4px 8px 0 8px;\n gap: 2px;\n display: flex;\n min-height: auto;\n height: auto;\n}\n\n .k-tabstrip-items-wrapper {\n height: auto;\n min-height: auto;\n}\n\n .k-content {\n flex: 1;\n overflow: hidden;\n padding: 0;\n background: white;\n border: none;\n min-height: 0;\n}\n\n .k-tabstrip .k-item {\n margin-right: 2px;\n border: none;\n background: transparent;\n border-radius: 4px 4px 0 0;\n padding: 0;\n transition: all 0.2s ease;\n height: auto;\n min-height: auto;\n}\n\n .k-tabstrip .k-item.k-selected {\n background: white;\n border: 1px solid #e0e0e0;\n border-bottom: 1px solid white;\n margin-bottom: -1px;\n z-index: 1;\n}\n\n .k-tabstrip .k-link {\n padding: 6px 12px;\n font-weight: 500;\n font-size: 13px;\n color: #666;\n transition: all 0.15s ease;\n border-radius: 4px 4px 0 0;\n background: transparent;\n border: none;\n display: flex;\n align-items: center;\n gap: 3px;\n line-height: 1.2;\n min-height: auto;\n height: auto;\n}\n\n .k-tabstrip .k-link i {\n font-size: 12px;\n}\n\n .k-tabstrip .k-item:hover:not(.k-selected) .k-link {\n color: #333;\n background: rgba(0, 0, 0, 0.04);\n}\n\n .k-tabstrip .k-item.k-selected .k-link {\n color: #1976d2;\n font-weight: 600;\n background: white;\n}\n\n\n\n .k-tabstrip .k-link .star-icon {\n display: inline-block;\n margin-right: 4px;\n color: #ffd700;\n font-size: 12px;\n vertical-align: middle;\n}\n\n\n\n .k-tabstrip-items::before, \n .k-tabstrip-items::after {\n display: none;\n}\n\n .k-tabstrip .k-item::before, \n .k-tabstrip .k-item::after {\n display: none;\n}\n\n\n\n .k-tabstrip .k-link:focus {\n outline: none;\n box-shadow: none;\n}\n\n\n\n .k-tabstrip .k-content.k-state-active {\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n\n\n\n.react-host-container[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n}\n\n\n\n .inner-tabs .k-tabstrip-items-wrapper {\n overflow-x: auto !important;\n overflow-y: hidden !important;\n max-width: 100%;\n}\n\n .inner-tabs .k-tabstrip-items {\n display: inline-flex !important;\n flex-wrap: nowrap !important;\n width: max-content !important;\n padding: 4px 8px 0 8px;\n background: #fff;\n border-bottom: 1px solid #e8e8e8;\n}\n\n .inner-tabs .k-tabstrip-item {\n flex: 0 0 auto !important;\n display: inline-block !important;\n float: none !important;\n}\n\n .inner-tabs .k-link {\n padding: 6px 12px;\n font-size: 12px;\n white-space: nowrap !important;\n display: inline-flex !important;\n align-items: center;\n gap: 4px;\n}\n\n\n\n .inner-tabstrip-container .k-tabstrip-items {\n min-width: max-content !important;\n}\n\n\n\n .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar {\n height: 6px;\n}\n\n .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar-track {\n background: #f1f1f1;\n}\n\n .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar-thumb {\n background: #888;\n border-radius: 3px;\n}\n\n .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar-thumb:hover {\n background: #555;\n}\n\n\n\n .k-tabstrip .k-tabstrip {\n margin: 0;\n}\n\n .k-tabstrip .k-tabstrip .k-tabstrip-items {\n display: inline-flex !important;\n flex-wrap: nowrap !important;\n width: max-content !important;\n}\n\n .k-tabstrip .k-tabstrip .k-tabstrip-items-wrapper {\n overflow-x: auto !important;\n overflow-y: hidden !important;\n}\n\n\n\n .k-tabstrip .k-tabstrip .k-content {\n border: none;\n background: transparent;\n}"], changeDetection: 0 });
|
|
1251
|
+
} }, dependencies: [i3.NgIf, i4.TabStripComponent, i4.TabStripTabComponent, i4.TabContentDirective, i4.TabTitleDirective, i5.ButtonComponent, i6.CodeEditorComponent, i2.MJReactComponent], styles: ["[_nghost-%COMP%] {\n display: block;\n height: 100%;\n position: relative;\n}\n\n\n\n.tab-action-bar[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 8px 12px;\n background-color: #fafafa;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.tab-actions-left[_ngcontent-%COMP%], \n.tab-actions-right[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n\n\n.tab-action-button[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 6px 14px;\n background-color: transparent;\n border: 1px solid #e0e0e0;\n border-radius: 6px;\n cursor: pointer;\n font-size: 13px;\n font-weight: 500;\n color: #333;\n transition: all 0.15s ease;\n white-space: nowrap;\n}\n\n.tab-action-button[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #f5f5f5;\n border-color: #d0d0d0;\n}\n\n.tab-action-button[_ngcontent-%COMP%]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.tab-action-button[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n\n\n\n.tab-action-button.create-button[_ngcontent-%COMP%], \n.tab-action-button.print-button[_ngcontent-%COMP%], \n.tab-action-button.feedback-button[_ngcontent-%COMP%] {\n background-color: white;\n color: #333;\n border-color: #e0e0e0;\n}\n\n.tab-action-button.create-button[_ngcontent-%COMP%]:hover:not(:disabled), \n.tab-action-button.print-button[_ngcontent-%COMP%]:hover:not(:disabled), \n.tab-action-button.feedback-button[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #f5f5f5;\n border-color: #d0d0d0;\n}\n\n\n\n.tab-action-button.feedback-button.active[_ngcontent-%COMP%] {\n background-color: #3B82F6;\n color: white;\n border-color: #3B82F6;\n}\n\n.tab-action-button.feedback-button.active[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #2563EB;\n border-color: #2563EB;\n}\n\n\n\n.tab-action-button.toggle-button[_ngcontent-%COMP%] {\n background-color: white;\n color: #666;\n border-color: #e0e0e0;\n}\n\n.tab-action-button.toggle-button[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #f5f5f5;\n border-color: #d0d0d0;\n color: #333;\n}\n\n.tab-action-button.toggle-button.active[_ngcontent-%COMP%] {\n background-color: #5B4FE9;\n color: white;\n border-color: #5B4FE9;\n}\n\n.tab-action-button.toggle-button.active[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #4940D4;\n border-color: #4940D4;\n}\n\n\n\n.details-panel[_ngcontent-%COMP%] {\n border-bottom: 1px solid #e0e0e0;\n background-color: #fafafa;\n overflow: hidden;\n transition: height 0.3s ease;\n}\n\n.details-content[_ngcontent-%COMP%] {\n padding: 16px;\n overflow-y: auto;\n height: 100%;\n font-size: 14px;\n line-height: 1.6;\n}\n\n.details-content.code-content[_ngcontent-%COMP%] {\n padding: 0;\n}\n\n\n\n.panel-resizer[_ngcontent-%COMP%] {\n height: 4px;\n background-color: #e0e0e0;\n cursor: ns-resize;\n position: relative;\n transition: background-color 0.2s ease;\n}\n\n.panel-resizer[_ngcontent-%COMP%]:hover {\n background-color: #d0d0d0;\n}\n\n.resizer-handle[_ngcontent-%COMP%] {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 40px;\n height: 2px;\n background-color: #999;\n border-radius: 1px;\n}\n\n\n\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(h1) { font-size: 1.5em; margin-top: 0; margin-bottom: 0.5em; }\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(h2) { font-size: 1.3em; margin-top: 1em; margin-bottom: 0.5em; }\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(h3) { font-size: 1.1em; margin-top: 1em; margin-bottom: 0.5em; }\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(ul), .details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(ol) { margin-left: 1.5em; }\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(code) { \n background-color: #f4f4f4; \n padding: 2px 4px; \n border-radius: 3px; \n font-family: 'Courier New', monospace; \n font-size: 0.9em;\n}\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(pre) { \n background-color: #f4f4f4; \n padding: 12px; \n border-radius: 4px; \n overflow-x: auto; \n}\n.details-content[_ngcontent-%COMP%] [_ngcontent-%COMP%]:deep(blockquote) { \n border-left: 4px solid #e0e0e0; \n padding-left: 16px; \n margin-left: 0; \n color: #666; \n}\n\n\n\n .k-tabstrip {\n border: none;\n height: 100%;\n display: flex;\n flex-direction: column;\n margin: 0;\n}\n\n .k-tabstrip-items {\n background: #f8f9fa;\n border: none;\n border-bottom: 1px solid #e0e0e0;\n flex: 0 0 auto;\n padding: 4px 8px 0 8px;\n gap: 2px;\n display: flex;\n min-height: auto;\n height: auto;\n}\n\n .k-tabstrip-items-wrapper {\n height: auto;\n min-height: auto;\n}\n\n .k-content {\n flex: 1;\n overflow: hidden;\n padding: 0;\n background: white;\n border: none;\n min-height: 0;\n}\n\n .k-tabstrip .k-item {\n margin-right: 2px;\n border: none;\n background: transparent;\n border-radius: 4px 4px 0 0;\n padding: 0;\n transition: all 0.2s ease;\n height: auto;\n min-height: auto;\n}\n\n .k-tabstrip .k-item.k-selected {\n background: white;\n border: 1px solid #e0e0e0;\n border-bottom: 1px solid white;\n margin-bottom: -1px;\n z-index: 1;\n}\n\n .k-tabstrip .k-link {\n padding: 6px 12px;\n font-weight: 500;\n font-size: 13px;\n color: #666;\n transition: all 0.15s ease;\n border-radius: 4px 4px 0 0;\n background: transparent;\n border: none;\n display: flex;\n align-items: center;\n gap: 3px;\n line-height: 1.2;\n min-height: auto;\n height: auto;\n}\n\n .k-tabstrip .k-link i {\n font-size: 12px;\n}\n\n .k-tabstrip .k-item:hover:not(.k-selected) .k-link {\n color: #333;\n background: rgba(0, 0, 0, 0.04);\n}\n\n .k-tabstrip .k-item.k-selected .k-link {\n color: #1976d2;\n font-weight: 600;\n background: white;\n}\n\n\n\n .k-tabstrip .k-link .star-icon {\n display: inline-block;\n margin-right: 4px;\n color: #ffd700;\n font-size: 12px;\n vertical-align: middle;\n}\n\n\n\n .k-tabstrip-items::before, \n .k-tabstrip-items::after {\n display: none;\n}\n\n .k-tabstrip .k-item::before, \n .k-tabstrip .k-item::after {\n display: none;\n}\n\n\n\n .k-tabstrip .k-link:focus {\n outline: none;\n box-shadow: none;\n}\n\n\n\n .k-tabstrip .k-content.k-state-active {\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n\n\n\n.react-host-container[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n}\n\n\n\n .inner-tabs .k-tabstrip-items-wrapper {\n overflow-x: auto !important;\n overflow-y: hidden !important;\n max-width: 100%;\n}\n\n .inner-tabs .k-tabstrip-items {\n display: inline-flex !important;\n flex-wrap: nowrap !important;\n width: max-content !important;\n padding: 4px 8px 0 8px;\n background: #fff;\n border-bottom: 1px solid #e8e8e8;\n}\n\n .inner-tabs .k-tabstrip-item {\n flex: 0 0 auto !important;\n display: inline-block !important;\n float: none !important;\n}\n\n .inner-tabs .k-link {\n padding: 6px 12px;\n font-size: 12px;\n white-space: nowrap !important;\n display: inline-flex !important;\n align-items: center;\n gap: 4px;\n}\n\n\n\n .inner-tabstrip-container .k-tabstrip-items {\n min-width: max-content !important;\n}\n\n\n\n .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar {\n height: 6px;\n}\n\n .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar-track {\n background: #f1f1f1;\n}\n\n .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar-thumb {\n background: #888;\n border-radius: 3px;\n}\n\n .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar-thumb:hover {\n background: #555;\n}\n\n\n\n .k-tabstrip .k-tabstrip {\n margin: 0;\n}\n\n .k-tabstrip .k-tabstrip .k-tabstrip-items {\n display: inline-flex !important;\n flex-wrap: nowrap !important;\n width: max-content !important;\n}\n\n .k-tabstrip .k-tabstrip .k-tabstrip-items-wrapper {\n overflow-x: auto !important;\n overflow-y: hidden !important;\n}\n\n\n\n .k-tabstrip .k-tabstrip .k-content {\n border: none;\n background: transparent;\n}"], changeDetection: 0 });
|
|
1224
1252
|
}
|
|
1225
1253
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SkipDynamicUIComponentComponent, [{
|
|
1226
1254
|
type: Component,
|
|
1227
|
-
args: [{ selector: 'skip-dynamic-ui-component', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (componentOptions.length > 1) {\n <!-- Multiple options: show tabs -->\n <kendo-tabstrip \n (tabSelect)=\"onTabSelect($event)\"\n [keepTabContent]=\"true\"\n style=\"height: 100%; display: flex; flex-direction: column;\">\n @for (option of componentOptions; track option; let i = $index) {\n <kendo-tabstrip-tab [selected]=\"i === selectedReportOptionIndex\">\n <ng-template kendoTabTitle>\n @if (isTopRanked(i)) {\n <i class=\"fa-solid fa-star star-icon\"></i>\n }\n {{ getTabTitle(i) }}\n </ng-template>\n <ng-template kendoTabContent>\n <div style=\"height: 100%; display: flex; flex-direction: column;\">\n <!-- Tab Action Bar -->\n <div class=\"tab-action-bar\">\n <div class=\"tab-actions-left\">\n <!-- Empty for now - actions moved to individual tabs -->\n </div>\n <div class=\"tab-actions-right\">\n <button class=\"tab-action-button create-button\" \n *ngIf=\"ShowCreateReportButton && !matchingReportID\"\n (click)=\"createReportForOption(i)\"\n [disabled]=\"isCreatingReport\">\n <i class=\"fa-solid fa-save\"></i>\n <span>Save Report</span>\n </button>\n <button class=\"tab-action-button create-button\" \n *ngIf=\"ShowOpenSavedReportButton && matchingReportID\"\n (click)=\"openReportForOption(i)\">\n <i class=\"fa-solid fa-folder-open\"></i>\n <span>Open Saved Report</span>\n </button>\n <button class=\"tab-action-button print-button\" \n *ngIf=\"ShowPrintReport\" \n (click)=\"PrintReport()\"\n title=\"Print Report\">\n <i class=\"fa-solid fa-print\"></i>\n <span>Print Report</span>\n </button>\n </div>\n </div>\n \n <!-- Inner tab strip for Component, Functional, Technical, Data, Code tabs -->\n <div class=\"inner-tabstrip-container\" style=\"flex: 1; display: flex; flex-direction: column; min-height: 0; overflow: hidden;\">\n <kendo-tabstrip class=\"inner-tabs\" style=\"height: 100%; display: flex; flex-direction: column;\">\n <!-- Component Tab (always first) -->\n <kendo-tabstrip-tab [selected]=\"true\">\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-chart-line\"></i> Component\n </ng-template>\n <ng-template kendoTabContent>\n <div style=\"height: 100%; position: relative; overflow: auto;\">\n <mj-react-component\n *ngIf=\"!currentError && componentOptions[i] && i === selectedReportOptionIndex\"\n [component]=\"componentOptions[i].option\"\n [styles]=\"componentStyles || undefined\"\n (stateChange)=\"onStateChange(i, $event)\"\n (componentEvent)=\"onComponentEvent(i, $event)\"\n (refreshData)=\"handleRefreshData()\"\n (openEntityRecord)=\"onOpenEntityRecord($event)\"\n style=\"width: 100%; height: 100%;\">\n </mj-react-component>\n \n <!-- Error overlay for this tab (shown on top of content when needed) -->\n @if (currentError && selectedReportOptionIndex === i) {\n <div style=\"top: 0; \n left: 0; \n right: 0; \n bottom: 0; \n display: flex;\n align-items: flex-start;\n justify-content: center;\n padding-top: 20px;\n background: rgba(255, 255, 255, 0.95);\n z-index: 10;\">\n <div style=\"width: 90%; \n max-width: 600px; \n height: 500px;\n background-color: #f8f9fa; \n border: 2px solid #dc3545; \n border-radius: 8px; \n padding: 20px;\n overflow-y: auto;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\">\n <div style=\"position: relative;\">\n <button kendoButton (click)=\"copyErrorToClipboard()\" \n style=\"position: absolute; top: 0; right: 0; font-size: 12px;\">\n <span class=\"fa-solid fa-copy\"></span>\n Copy Error Details\n </button>\n <h3 style=\"color: #dc3545; margin-top: 0; margin-right: 150px; font-size: 18px;\">\n <span class=\"fa-solid fa-exclamation-triangle\"></span>\n Component Rendering Error\n </h3>\n </div>\n <p style=\"margin-bottom: 10px; font-size: 14px;\">\n The selected component option could not be rendered due to the following error:\n </p>\n <div style=\"background-color: #fff; border: 1px solid #dee2e6; \n border-radius: 4px; padding: 12px; margin-bottom: 12px;\n font-family: 'Courier New', monospace; font-size: 12px;\">\n <strong>Error Type:</strong> {{ currentError.type }}<br>\n <strong>Details:</strong> {{ currentError.message }}\n @if (currentError.technicalDetails) {\n <details style=\"margin-top: 8px;\">\n <summary style=\"cursor: pointer; color: #0056b3;\">Technical Details (click to expand)</summary>\n <pre style=\"margin-top: 8px; white-space: pre-wrap; word-break: break-word; font-size: 11px;\">{{ formatTechnicalDetails(currentError.technicalDetails) }}</pre>\n </details>\n }\n </div>\n <div style=\"background-color: #e7f3ff; border: 1px solid #b3d9ff; \n border-radius: 4px; padding: 12px; margin-bottom: 12px;\">\n <strong style=\"font-size: 14px;\">What to do:</strong>\n <ol style=\"margin: 8px 0 0 20px; padding: 0; font-size: 13px;\">\n <li>Try selecting a different report option from the tabs above</li>\n <li>Copy the error details and send them back to Skip in the chat to get a corrected version</li>\n <li>Contact your IT department if the issue persists</li>\n </ol>\n </div>\n <button kendoButton (click)=\"retryCurrentOption()\" style=\"font-size: 13px;\">\n <span class=\"fa-solid fa-rotate\"></span>\n Retry\n </button>\n </div>\n </div>\n }\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n \n <!-- Functional Requirements Tab -->\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-list-check\"></i> Functional\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content\" style=\"height: 100%; overflow: auto; padding: 20px;\">\n <div [innerHTML]=\"getFormattedFunctionalRequirements(option)\"></div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n \n <!-- Technical Design Tab -->\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-cogs\"></i> Technical\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content\" style=\"height: 100%; overflow: auto; padding: 20px;\">\n <div [innerHTML]=\"getFormattedTechnicalDesign(option)\"></div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n \n <!-- Data Requirements Tab -->\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-database\"></i> Data Spec\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content\" style=\"height: 100%; overflow: auto; padding: 20px;\">\n <div [innerHTML]=\"getFormattedDataRequirements(option)\"></div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n \n <!-- Code Tab -->\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-code\"></i> Code\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content code-content\" style=\"height: 100%; overflow: hidden;\">\n <mj-code-editor\n [value]=\"getComponentCode(option)\"\n [language]=\"'javascript'\"\n [autoFocus]=\"false\"\n [indentWithTab]=\"true\"\n [readonly]=\"true\"\n [toolbar]=\"codeToolbarConfig\"\n (toolbarAction)=\"handleCodeToolbarAction($event)\"\n style=\"height: 100%;\">\n </mj-code-editor>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n \n <!-- Spec Tab -->\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-file-code\"></i> Spec\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content code-content\" style=\"height: 100%; overflow: hidden;\">\n <mj-code-editor\n [value]=\"getComponentSpec(option)\"\n [language]=\"'json'\"\n [autoFocus]=\"false\"\n [indentWithTab]=\"true\"\n [readonly]=\"true\"\n [toolbar]=\"codeToolbarConfig\"\n (toolbarAction)=\"handleCodeToolbarAction($event)\"\n style=\"height: 100%;\">\n </mj-code-editor>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n </kendo-tabstrip>\n </div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n </kendo-tabstrip>\n} @else {\n <!-- Single option: simplified tab structure -->\n <div style=\"height: 100%; display: flex; flex-direction: column;\">\n <!-- Tab Action Bar -->\n <div class=\"tab-action-bar\">\n <div class=\"tab-actions-left\">\n <!-- Empty for now - actions moved to tabs -->\n </div>\n <div class=\"tab-actions-right\">\n <button class=\"tab-action-button create-button\" \n *ngIf=\"ShowCreateReportButton && !matchingReportID\"\n (click)=\"createReportForOption(0)\"\n [disabled]=\"isCreatingReport\">\n <i class=\"fa-solid fa-save\"></i>\n <span>Save Report</span>\n </button>\n <button class=\"tab-action-button create-button\" \n *ngIf=\"ShowOpenSavedReportButton && matchingReportID\"\n (click)=\"openReportForOption(0)\">\n <i class=\"fa-solid fa-folder-open\"></i>\n <span>Open Saved Report</span>\n </button>\n <button class=\"tab-action-button print-button\" \n *ngIf=\"ShowPrintReport\" \n (click)=\"PrintReport()\"\n title=\"Print Report\">\n <i class=\"fa-solid fa-print\"></i>\n <span>Print Report</span>\n </button>\n </div>\n </div>\n \n <!-- Tab strip for Component, Functional, Technical, Data, Code tabs -->\n <div class=\"inner-tabstrip-container\" style=\"flex: 1; display: flex; flex-direction: column; min-height: 0; overflow: hidden;\">\n <kendo-tabstrip class=\"inner-tabs\" style=\"height: 100%; display: flex; flex-direction: column;\">\n <!-- Component Tab (always first) -->\n <kendo-tabstrip-tab [selected]=\"true\">\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-chart-line\"></i> Component\n </ng-template>\n <ng-template kendoTabContent>\n <div style=\"height: 100%; position: relative; overflow: auto;\">\n @if (!currentError && componentOptions[0]) {\n <mj-react-component\n [component]=\"componentOptions[0].option\"\n [styles]=\"componentStyles || undefined\"\n (stateChange)=\"onStateChange(0, $event)\"\n (componentEvent)=\"onComponentEvent(0, $event)\"\n (refreshData)=\"handleRefreshData()\"\n (openEntityRecord)=\"onOpenEntityRecord($event)\"\n style=\"width: 100%; height: 100%;\">\n </mj-react-component>\n }\n \n <!-- Error overlay for this tab (shown on top of content when needed) -->\n @if (currentError) {\n <div style=\"top: 0; \n left: 0; \n right: 0; \n bottom: 0; \n display: flex;\n align-items: flex-start;\n justify-content: center;\n padding-top: 20px;\n background: rgba(255, 255, 255, 0.95);\n z-index: 10;\">\n <div style=\"width: 90%; \n max-width: 600px; \n height: 500px;\n background-color: #f8f9fa; \n border: 2px solid #dc3545; \n border-radius: 8px; \n padding: 20px;\n overflow-y: auto;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\">\n <div style=\"position: relative;\">\n <button kendoButton (click)=\"copyErrorToClipboard()\" \n style=\"position: absolute; top: 0; right: 0; font-size: 12px;\">\n <span class=\"fa-solid fa-copy\"></span>\n Copy Error Details\n </button>\n <h3 style=\"color: #dc3545; margin-top: 0; margin-right: 150px; font-size: 18px;\">\n <span class=\"fa-solid fa-exclamation-triangle\"></span>\n Component Rendering Error\n </h3>\n </div>\n <p style=\"margin-bottom: 10px; font-size: 14px;\">\n The selected component option could not be rendered due to the following error:\n </p>\n <div style=\"background-color: #fff; border: 1px solid #dee2e6; \n border-radius: 4px; padding: 12px; margin-bottom: 12px;\n font-family: 'Courier New', monospace; font-size: 12px;\">\n <strong>Error Type:</strong> {{ currentError.type }}<br>\n <strong>Details:</strong> {{ currentError.message }}\n @if (currentError.technicalDetails) {\n <details style=\"margin-top: 8px;\">\n <summary style=\"cursor: pointer; color: #0056b3;\">Technical Details (click to expand)</summary>\n <pre style=\"margin-top: 8px; white-space: pre-wrap; word-break: break-word; font-size: 11px;\">{{ formatTechnicalDetails(currentError.technicalDetails) }}</pre>\n </details>\n }\n </div>\n <div style=\"background-color: #e7f3ff; border: 1px solid #b3d9ff; \n border-radius: 4px; padding: 12px; margin-bottom: 12px;\">\n <strong style=\"font-size: 14px;\">What to do:</strong>\n <ol style=\"margin: 8px 0 0 20px; padding: 0; font-size: 13px;\">\n <li>Copy the error details and send them back to Skip in the chat to get a corrected version</li>\n <li>Contact your IT department if the issue persists</li>\n </ol>\n </div>\n <button kendoButton (click)=\"retryCurrentOption()\" style=\"font-size: 13px;\">\n <span class=\"fa-solid fa-rotate\"></span>\n Retry\n </button>\n </div>\n </div>\n }\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n \n <!-- Functional Requirements Tab -->\n @if (componentOptions[0]) {\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-list-check\"></i> Functional\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content\" style=\"height: 100%; overflow: auto; padding: 20px;\">\n <div [innerHTML]=\"getFormattedFunctionalRequirements(componentOptions[0])\"></div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n \n <!-- Technical Design Tab -->\n @if (componentOptions[0]) {\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-cogs\"></i> Technical\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content\" style=\"height: 100%; overflow: auto; padding: 20px;\">\n <div [innerHTML]=\"getFormattedTechnicalDesign(componentOptions[0])\"></div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n \n <!-- Data Requirements Tab -->\n @if (componentOptions[0]) {\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-database\"></i> Data Spec\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content\" style=\"height: 100%; overflow: auto; padding: 20px;\">\n <div [innerHTML]=\"getFormattedDataRequirements(componentOptions[0])\"></div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n \n <!-- Code Tab -->\n @if (componentOptions[0]) {\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-code\"></i> Code\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content code-content\" style=\"height: 100%; overflow: hidden;\">\n <mj-code-editor\n [value]=\"getComponentCode(componentOptions[0])\"\n [language]=\"'javascript'\"\n [autoFocus]=\"false\"\n [indentWithTab]=\"true\"\n [readonly]=\"true\"\n [toolbar]=\"codeToolbarConfig\"\n (toolbarAction)=\"handleCodeToolbarAction($event)\"\n style=\"height: 100%;\">\n </mj-code-editor>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n \n <!-- Spec Tab -->\n @if (componentOptions[0]) {\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-file-code\"></i> Spec\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content code-content\" style=\"height: 100%; overflow: hidden;\">\n <mj-code-editor\n [value]=\"getComponentSpec(componentOptions[0])\"\n [language]=\"'json'\"\n [autoFocus]=\"false\"\n [indentWithTab]=\"true\"\n [readonly]=\"true\"\n [toolbar]=\"codeToolbarConfig\"\n (toolbarAction)=\"handleCodeToolbarAction($event)\"\n style=\"height: 100%;\">\n </mj-code-editor>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n </kendo-tabstrip>\n </div>\n </div>\n}", styles: [":host {\n display: block;\n height: 100%;\n position: relative;\n}\n\n/* Tab Action Bar */\n.tab-action-bar {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 8px 12px;\n background-color: #fafafa;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.tab-actions-left,\n.tab-actions-right {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n/* Tab Action Buttons */\n.tab-action-button {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 6px 14px;\n background-color: transparent;\n border: 1px solid #e0e0e0;\n border-radius: 6px;\n cursor: pointer;\n font-size: 13px;\n font-weight: 500;\n color: #333;\n transition: all 0.15s ease;\n white-space: nowrap;\n}\n\n.tab-action-button:hover:not(:disabled) {\n background-color: #f5f5f5;\n border-color: #d0d0d0;\n}\n\n.tab-action-button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.tab-action-button i {\n font-size: 12px;\n}\n\n/* Both buttons use the same white/secondary style */\n.tab-action-button.create-button,\n.tab-action-button.print-button {\n background-color: white;\n color: #333;\n border-color: #e0e0e0;\n}\n\n.tab-action-button.create-button:hover:not(:disabled),\n.tab-action-button.print-button:hover:not(:disabled) {\n background-color: #f5f5f5;\n border-color: #d0d0d0;\n}\n\n/* Toggle buttons styling */\n.tab-action-button.toggle-button {\n background-color: white;\n color: #666;\n border-color: #e0e0e0;\n}\n\n.tab-action-button.toggle-button:hover:not(:disabled) {\n background-color: #f5f5f5;\n border-color: #d0d0d0;\n color: #333;\n}\n\n.tab-action-button.toggle-button.active {\n background-color: #5B4FE9;\n color: white;\n border-color: #5B4FE9;\n}\n\n.tab-action-button.toggle-button.active:hover:not(:disabled) {\n background-color: #4940D4;\n border-color: #4940D4;\n}\n\n/* Details panel styling */\n.details-panel {\n border-bottom: 1px solid #e0e0e0;\n background-color: #fafafa;\n overflow: hidden;\n transition: height 0.3s ease;\n}\n\n.details-content {\n padding: 16px;\n overflow-y: auto;\n height: 100%;\n font-size: 14px;\n line-height: 1.6;\n}\n\n.details-content.code-content {\n padding: 0;\n}\n\n/* Panel resizer */\n.panel-resizer {\n height: 4px;\n background-color: #e0e0e0;\n cursor: ns-resize;\n position: relative;\n transition: background-color 0.2s ease;\n}\n\n.panel-resizer:hover {\n background-color: #d0d0d0;\n}\n\n.resizer-handle {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 40px;\n height: 2px;\n background-color: #999;\n border-radius: 1px;\n}\n\n/* Markdown content styling */\n.details-content :deep(h1) { font-size: 1.5em; margin-top: 0; margin-bottom: 0.5em; }\n.details-content :deep(h2) { font-size: 1.3em; margin-top: 1em; margin-bottom: 0.5em; }\n.details-content :deep(h3) { font-size: 1.1em; margin-top: 1em; margin-bottom: 0.5em; }\n.details-content :deep(ul), .details-content :deep(ol) { margin-left: 1.5em; }\n.details-content :deep(code) { \n background-color: #f4f4f4; \n padding: 2px 4px; \n border-radius: 3px; \n font-family: 'Courier New', monospace; \n font-size: 0.9em;\n}\n.details-content :deep(pre) { \n background-color: #f4f4f4; \n padding: 12px; \n border-radius: 4px; \n overflow-x: auto; \n}\n.details-content :deep(blockquote) { \n border-left: 4px solid #e0e0e0; \n padding-left: 16px; \n margin-left: 0; \n color: #666; \n}\n\n/* Tab styling - improved for better formatting */\n::ng-deep .k-tabstrip {\n border: none;\n height: 100%;\n display: flex;\n flex-direction: column;\n margin: 0;\n}\n\n::ng-deep .k-tabstrip-items {\n background: #f8f9fa;\n border: none;\n border-bottom: 1px solid #e0e0e0;\n flex: 0 0 auto;\n padding: 4px 8px 0 8px;\n gap: 2px;\n display: flex;\n min-height: auto;\n height: auto;\n}\n\n::ng-deep .k-tabstrip-items-wrapper {\n height: auto;\n min-height: auto;\n}\n\n::ng-deep .k-content {\n flex: 1;\n overflow: hidden;\n padding: 0;\n background: white;\n border: none;\n min-height: 0;\n}\n\n::ng-deep .k-tabstrip .k-item {\n margin-right: 2px;\n border: none;\n background: transparent;\n border-radius: 4px 4px 0 0;\n padding: 0;\n transition: all 0.2s ease;\n height: auto;\n min-height: auto;\n}\n\n::ng-deep .k-tabstrip .k-item.k-selected {\n background: white;\n border: 1px solid #e0e0e0;\n border-bottom: 1px solid white;\n margin-bottom: -1px;\n z-index: 1;\n}\n\n::ng-deep .k-tabstrip .k-link {\n padding: 6px 12px;\n font-weight: 500;\n font-size: 13px;\n color: #666;\n transition: all 0.15s ease;\n border-radius: 4px 4px 0 0;\n background: transparent;\n border: none;\n display: flex;\n align-items: center;\n gap: 3px;\n line-height: 1.2;\n min-height: auto;\n height: auto;\n}\n\n::ng-deep .k-tabstrip .k-link i {\n font-size: 12px;\n}\n\n::ng-deep .k-tabstrip .k-item:hover:not(.k-selected) .k-link {\n color: #333;\n background: rgba(0, 0, 0, 0.04);\n}\n\n::ng-deep .k-tabstrip .k-item.k-selected .k-link {\n color: #1976d2;\n font-weight: 600;\n background: white;\n}\n\n/* Star icon styling */\n::ng-deep .k-tabstrip .k-link .star-icon {\n display: inline-block;\n margin-right: 4px;\n color: #ffd700;\n font-size: 12px;\n vertical-align: middle;\n}\n\n/* Hide default Kendo tab styling */\n::ng-deep .k-tabstrip-items::before,\n::ng-deep .k-tabstrip-items::after {\n display: none;\n}\n\n::ng-deep .k-tabstrip .k-item::before,\n::ng-deep .k-tabstrip .k-item::after {\n display: none;\n}\n\n/* Remove focus outline */\n::ng-deep .k-tabstrip .k-link:focus {\n outline: none;\n box-shadow: none;\n}\n\n/* Make sure tab content fills available space */\n::ng-deep .k-tabstrip .k-content.k-state-active {\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n\n/* React host container */\n.react-host-container {\n width: 100%;\n height: 100%;\n}\n\n/* Inner tabs specific styling with horizontal scroll */\n::ng-deep .inner-tabs .k-tabstrip-items-wrapper {\n overflow-x: auto !important;\n overflow-y: hidden !important;\n max-width: 100%;\n}\n\n::ng-deep .inner-tabs .k-tabstrip-items {\n display: inline-flex !important;\n flex-wrap: nowrap !important;\n width: max-content !important;\n padding: 4px 8px 0 8px;\n background: #fff;\n border-bottom: 1px solid #e8e8e8;\n}\n\n::ng-deep .inner-tabs .k-tabstrip-item {\n flex: 0 0 auto !important;\n display: inline-block !important;\n float: none !important;\n}\n\n::ng-deep .inner-tabs .k-link {\n padding: 6px 12px;\n font-size: 12px;\n white-space: nowrap !important;\n display: inline-flex !important;\n align-items: center;\n gap: 4px;\n}\n\n/* Force single row for inner tabs */\n::ng-deep .inner-tabstrip-container .k-tabstrip-items {\n min-width: max-content !important;\n}\n\n/* Custom scrollbar for inner tabs */\n::ng-deep .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar {\n height: 6px;\n}\n\n::ng-deep .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar-track {\n background: #f1f1f1;\n}\n\n::ng-deep .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar-thumb {\n background: #888;\n border-radius: 3px;\n}\n\n::ng-deep .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar-thumb:hover {\n background: #555;\n}\n\n/* Nested tab styling - for tabs within tabs (fallback) */\n::ng-deep .k-tabstrip .k-tabstrip {\n margin: 0;\n}\n\n::ng-deep .k-tabstrip .k-tabstrip .k-tabstrip-items {\n display: inline-flex !important;\n flex-wrap: nowrap !important;\n width: max-content !important;\n}\n\n::ng-deep .k-tabstrip .k-tabstrip .k-tabstrip-items-wrapper {\n overflow-x: auto !important;\n overflow-y: hidden !important;\n}\n\n/* Ensure proper content area in nested tabs */\n::ng-deep .k-tabstrip .k-tabstrip .k-content {\n border: none;\n background: transparent;\n}\n\n"] }]
|
|
1255
|
+
args: [{ selector: 'skip-dynamic-ui-component', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (componentOptions.length > 1) {\n <!-- Multiple options: show tabs -->\n <kendo-tabstrip \n (tabSelect)=\"onTabSelect($event)\"\n [keepTabContent]=\"true\"\n style=\"height: 100%; display: flex; flex-direction: column;\">\n @for (option of componentOptions; track option; let i = $index) {\n <kendo-tabstrip-tab [selected]=\"i === selectedReportOptionIndex\">\n <ng-template kendoTabTitle>\n @if (isTopRanked(i)) {\n <i class=\"fa-solid fa-star star-icon\"></i>\n }\n {{ getTabTitle(i) }}\n </ng-template>\n <ng-template kendoTabContent>\n <div style=\"height: 100%; display: flex; flex-direction: column;\">\n <!-- Tab Action Bar -->\n <div class=\"tab-action-bar\">\n <div class=\"tab-actions-left\">\n <!-- Empty for now - actions moved to individual tabs -->\n </div>\n <div class=\"tab-actions-right\">\n <button class=\"tab-action-button create-button\"\n *ngIf=\"ShowCreateReportButton && !matchingReportID\"\n (click)=\"createReportForOption(i)\"\n [disabled]=\"isCreatingReport\">\n <i class=\"fa-solid fa-save\"></i>\n <span>Save Report</span>\n </button>\n <button class=\"tab-action-button create-button\"\n *ngIf=\"ShowOpenSavedReportButton && matchingReportID\"\n (click)=\"openReportForOption(i)\">\n <i class=\"fa-solid fa-folder-open\"></i>\n <span>Open Saved Report</span>\n </button>\n <button class=\"tab-action-button print-button\"\n *ngIf=\"ShowPrintReport\"\n (click)=\"PrintReport()\"\n title=\"Print Report\">\n <i class=\"fa-solid fa-print\"></i>\n <span>Print Report</span>\n </button>\n <button class=\"tab-action-button feedback-button\"\n [class.active]=\"showFeedbackPanel\"\n (click)=\"toggleFeedbackPanel()\"\n [title]=\"showFeedbackPanel ? 'Close Feedback Panel' : 'Provide Component Feedback'\">\n <i class=\"fa-solid\" [class.fa-comment-dots]=\"!showFeedbackPanel\" [class.fa-times]=\"showFeedbackPanel\"></i>\n <span>{{ showFeedbackPanel ? 'Close' : 'Feedback' }}</span>\n </button>\n </div>\n </div>\n \n <!-- Inner tab strip for Component, Functional, Technical, Data, Code tabs -->\n <div class=\"inner-tabstrip-container\" style=\"flex: 1; display: flex; flex-direction: column; min-height: 0; overflow: hidden;\">\n <kendo-tabstrip class=\"inner-tabs\" style=\"height: 100%; display: flex; flex-direction: column;\">\n <!-- Component Tab (always first) -->\n <kendo-tabstrip-tab [selected]=\"true\">\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-chart-line\"></i> Component\n </ng-template>\n <ng-template kendoTabContent>\n <div style=\"height: 100%; position: relative; overflow: auto;\">\n <mj-react-component\n *ngIf=\"!currentError && componentOptions[i] && i === selectedReportOptionIndex\"\n [component]=\"componentOptions[i].option\"\n [styles]=\"componentStyles || undefined\"\n (stateChange)=\"onStateChange(i, $event)\"\n (componentEvent)=\"onComponentEvent(i, $event)\"\n (refreshData)=\"handleRefreshData()\"\n (openEntityRecord)=\"onOpenEntityRecord($event)\"\n style=\"width: 100%; height: 100%;\">\n </mj-react-component>\n \n <!-- Error overlay for this tab (shown on top of content when needed) -->\n @if (currentError && selectedReportOptionIndex === i) {\n <div style=\"top: 0; \n left: 0; \n right: 0; \n bottom: 0; \n display: flex;\n align-items: flex-start;\n justify-content: center;\n padding-top: 20px;\n background: rgba(255, 255, 255, 0.95);\n z-index: 10;\">\n <div style=\"width: 90%; \n max-width: 600px; \n height: 500px;\n background-color: #f8f9fa; \n border: 2px solid #dc3545; \n border-radius: 8px; \n padding: 20px;\n overflow-y: auto;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\">\n <div style=\"position: relative;\">\n <button kendoButton (click)=\"copyErrorToClipboard()\" \n style=\"position: absolute; top: 0; right: 0; font-size: 12px;\">\n <span class=\"fa-solid fa-copy\"></span>\n Copy Error Details\n </button>\n <h3 style=\"color: #dc3545; margin-top: 0; margin-right: 150px; font-size: 18px;\">\n <span class=\"fa-solid fa-exclamation-triangle\"></span>\n Component Rendering Error\n </h3>\n </div>\n <p style=\"margin-bottom: 10px; font-size: 14px;\">\n The selected component option could not be rendered due to the following error:\n </p>\n <div style=\"background-color: #fff; border: 1px solid #dee2e6; \n border-radius: 4px; padding: 12px; margin-bottom: 12px;\n font-family: 'Courier New', monospace; font-size: 12px;\">\n <strong>Error Type:</strong> {{ currentError.type }}<br>\n <strong>Details:</strong> {{ currentError.message }}\n @if (currentError.technicalDetails) {\n <details style=\"margin-top: 8px;\">\n <summary style=\"cursor: pointer; color: #0056b3;\">Technical Details (click to expand)</summary>\n <pre style=\"margin-top: 8px; white-space: pre-wrap; word-break: break-word; font-size: 11px;\">{{ formatTechnicalDetails(currentError.technicalDetails) }}</pre>\n </details>\n }\n </div>\n <div style=\"background-color: #e7f3ff; border: 1px solid #b3d9ff; \n border-radius: 4px; padding: 12px; margin-bottom: 12px;\">\n <strong style=\"font-size: 14px;\">What to do:</strong>\n <ol style=\"margin: 8px 0 0 20px; padding: 0; font-size: 13px;\">\n <li>Try selecting a different report option from the tabs above</li>\n <li>Copy the error details and send them back to Skip in the chat to get a corrected version</li>\n <li>Contact your IT department if the issue persists</li>\n </ol>\n </div>\n <button kendoButton (click)=\"retryCurrentOption()\" style=\"font-size: 13px;\">\n <span class=\"fa-solid fa-rotate\"></span>\n Retry\n </button>\n </div>\n </div>\n }\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n \n <!-- Functional Requirements Tab -->\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-list-check\"></i> Functional\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content\" style=\"height: 100%; overflow: auto; padding: 20px;\">\n <div [innerHTML]=\"getFormattedFunctionalRequirements(option)\"></div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n \n <!-- Technical Design Tab -->\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-cogs\"></i> Technical\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content\" style=\"height: 100%; overflow: auto; padding: 20px;\">\n <div [innerHTML]=\"getFormattedTechnicalDesign(option)\"></div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n \n <!-- Data Requirements Tab -->\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-database\"></i> Data Spec\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content\" style=\"height: 100%; overflow: auto; padding: 20px;\">\n <div [innerHTML]=\"getFormattedDataRequirements(option)\"></div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n \n <!-- Code Tab -->\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-code\"></i> Code\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content code-content\" style=\"height: 100%; overflow: hidden;\">\n <mj-code-editor\n [value]=\"getComponentCode(option)\"\n [language]=\"'javascript'\"\n [autoFocus]=\"false\"\n [indentWithTab]=\"true\"\n [readonly]=\"true\"\n [toolbar]=\"codeToolbarConfig\"\n (toolbarAction)=\"handleCodeToolbarAction($event)\"\n style=\"height: 100%;\">\n </mj-code-editor>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n \n <!-- Spec Tab -->\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-file-code\"></i> Spec\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content code-content\" style=\"height: 100%; overflow: hidden;\">\n <mj-code-editor\n [value]=\"getComponentSpec(option)\"\n [language]=\"'json'\"\n [autoFocus]=\"false\"\n [indentWithTab]=\"true\"\n [readonly]=\"true\"\n [toolbar]=\"codeToolbarConfig\"\n (toolbarAction)=\"handleCodeToolbarAction($event)\"\n style=\"height: 100%;\">\n </mj-code-editor>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n </kendo-tabstrip>\n </div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n </kendo-tabstrip>\n} @else {\n <!-- Single option: simplified tab structure -->\n <div style=\"height: 100%; display: flex; flex-direction: column;\">\n <!-- Tab Action Bar -->\n <div class=\"tab-action-bar\">\n <div class=\"tab-actions-left\">\n <!-- Empty for now - actions moved to tabs -->\n </div>\n <div class=\"tab-actions-right\">\n <button class=\"tab-action-button create-button\"\n *ngIf=\"ShowCreateReportButton && !matchingReportID\"\n (click)=\"createReportForOption(0)\"\n [disabled]=\"isCreatingReport\">\n <i class=\"fa-solid fa-save\"></i>\n <span>Save Report</span>\n </button>\n <button class=\"tab-action-button create-button\"\n *ngIf=\"ShowOpenSavedReportButton && matchingReportID\"\n (click)=\"openReportForOption(0)\">\n <i class=\"fa-solid fa-folder-open\"></i>\n <span>Open Saved Report</span>\n </button>\n <button class=\"tab-action-button print-button\"\n *ngIf=\"ShowPrintReport\"\n (click)=\"PrintReport()\"\n title=\"Print Report\">\n <i class=\"fa-solid fa-print\"></i>\n <span>Print Report</span>\n </button>\n <button class=\"tab-action-button feedback-button\"\n [class.active]=\"showFeedbackPanel\"\n (click)=\"toggleFeedbackPanel()\"\n [title]=\"showFeedbackPanel ? 'Close Feedback Panel' : 'Provide Component Feedback'\">\n <i class=\"fa-solid\" [class.fa-comment-dots]=\"!showFeedbackPanel\" [class.fa-times]=\"showFeedbackPanel\"></i>\n <span>{{ showFeedbackPanel ? 'Close' : 'Feedback' }}</span>\n </button>\n </div>\n </div>\n \n <!-- Tab strip for Component, Functional, Technical, Data, Code tabs -->\n <div class=\"inner-tabstrip-container\" style=\"flex: 1; display: flex; flex-direction: column; min-height: 0; overflow: hidden;\">\n <kendo-tabstrip class=\"inner-tabs\" style=\"height: 100%; display: flex; flex-direction: column;\">\n <!-- Component Tab (always first) -->\n <kendo-tabstrip-tab [selected]=\"true\">\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-chart-line\"></i> Component\n </ng-template>\n <ng-template kendoTabContent>\n <div style=\"height: 100%; position: relative; overflow: auto;\">\n @if (!currentError && componentOptions[0]) {\n <mj-react-component\n [component]=\"componentOptions[0].option\"\n [styles]=\"componentStyles || undefined\"\n (stateChange)=\"onStateChange(0, $event)\"\n (componentEvent)=\"onComponentEvent(0, $event)\"\n (refreshData)=\"handleRefreshData()\"\n (openEntityRecord)=\"onOpenEntityRecord($event)\"\n style=\"width: 100%; height: 100%;\">\n </mj-react-component>\n }\n \n <!-- Error overlay for this tab (shown on top of content when needed) -->\n @if (currentError) {\n <div style=\"top: 0; \n left: 0; \n right: 0; \n bottom: 0; \n display: flex;\n align-items: flex-start;\n justify-content: center;\n padding-top: 20px;\n background: rgba(255, 255, 255, 0.95);\n z-index: 10;\">\n <div style=\"width: 90%; \n max-width: 600px; \n height: 500px;\n background-color: #f8f9fa; \n border: 2px solid #dc3545; \n border-radius: 8px; \n padding: 20px;\n overflow-y: auto;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\">\n <div style=\"position: relative;\">\n <button kendoButton (click)=\"copyErrorToClipboard()\" \n style=\"position: absolute; top: 0; right: 0; font-size: 12px;\">\n <span class=\"fa-solid fa-copy\"></span>\n Copy Error Details\n </button>\n <h3 style=\"color: #dc3545; margin-top: 0; margin-right: 150px; font-size: 18px;\">\n <span class=\"fa-solid fa-exclamation-triangle\"></span>\n Component Rendering Error\n </h3>\n </div>\n <p style=\"margin-bottom: 10px; font-size: 14px;\">\n The selected component option could not be rendered due to the following error:\n </p>\n <div style=\"background-color: #fff; border: 1px solid #dee2e6; \n border-radius: 4px; padding: 12px; margin-bottom: 12px;\n font-family: 'Courier New', monospace; font-size: 12px;\">\n <strong>Error Type:</strong> {{ currentError.type }}<br>\n <strong>Details:</strong> {{ currentError.message }}\n @if (currentError.technicalDetails) {\n <details style=\"margin-top: 8px;\">\n <summary style=\"cursor: pointer; color: #0056b3;\">Technical Details (click to expand)</summary>\n <pre style=\"margin-top: 8px; white-space: pre-wrap; word-break: break-word; font-size: 11px;\">{{ formatTechnicalDetails(currentError.technicalDetails) }}</pre>\n </details>\n }\n </div>\n <div style=\"background-color: #e7f3ff; border: 1px solid #b3d9ff; \n border-radius: 4px; padding: 12px; margin-bottom: 12px;\">\n <strong style=\"font-size: 14px;\">What to do:</strong>\n <ol style=\"margin: 8px 0 0 20px; padding: 0; font-size: 13px;\">\n <li>Copy the error details and send them back to Skip in the chat to get a corrected version</li>\n <li>Contact your IT department if the issue persists</li>\n </ol>\n </div>\n <button kendoButton (click)=\"retryCurrentOption()\" style=\"font-size: 13px;\">\n <span class=\"fa-solid fa-rotate\"></span>\n Retry\n </button>\n </div>\n </div>\n }\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n \n <!-- Functional Requirements Tab -->\n @if (componentOptions[0]) {\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-list-check\"></i> Functional\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content\" style=\"height: 100%; overflow: auto; padding: 20px;\">\n <div [innerHTML]=\"getFormattedFunctionalRequirements(componentOptions[0])\"></div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n \n <!-- Technical Design Tab -->\n @if (componentOptions[0]) {\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-cogs\"></i> Technical\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content\" style=\"height: 100%; overflow: auto; padding: 20px;\">\n <div [innerHTML]=\"getFormattedTechnicalDesign(componentOptions[0])\"></div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n \n <!-- Data Requirements Tab -->\n @if (componentOptions[0]) {\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-database\"></i> Data Spec\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content\" style=\"height: 100%; overflow: auto; padding: 20px;\">\n <div [innerHTML]=\"getFormattedDataRequirements(componentOptions[0])\"></div>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n \n <!-- Code Tab -->\n @if (componentOptions[0]) {\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-code\"></i> Code\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content code-content\" style=\"height: 100%; overflow: hidden;\">\n <mj-code-editor\n [value]=\"getComponentCode(componentOptions[0])\"\n [language]=\"'javascript'\"\n [autoFocus]=\"false\"\n [indentWithTab]=\"true\"\n [readonly]=\"true\"\n [toolbar]=\"codeToolbarConfig\"\n (toolbarAction)=\"handleCodeToolbarAction($event)\"\n style=\"height: 100%;\">\n </mj-code-editor>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n \n <!-- Spec Tab -->\n @if (componentOptions[0]) {\n <kendo-tabstrip-tab>\n <ng-template kendoTabTitle>\n <i class=\"fa-solid fa-file-code\"></i> Spec\n </ng-template>\n <ng-template kendoTabContent>\n <div class=\"details-content code-content\" style=\"height: 100%; overflow: hidden;\">\n <mj-code-editor\n [value]=\"getComponentSpec(componentOptions[0])\"\n [language]=\"'json'\"\n [autoFocus]=\"false\"\n [indentWithTab]=\"true\"\n [readonly]=\"true\"\n [toolbar]=\"codeToolbarConfig\"\n (toolbarAction)=\"handleCodeToolbarAction($event)\"\n style=\"height: 100%;\">\n </mj-code-editor>\n </div>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n </kendo-tabstrip>\n </div>\n </div>\n}", styles: [":host {\n display: block;\n height: 100%;\n position: relative;\n}\n\n/* Tab Action Bar */\n.tab-action-bar {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 8px 12px;\n background-color: #fafafa;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.tab-actions-left,\n.tab-actions-right {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n/* Tab Action Buttons */\n.tab-action-button {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 6px 14px;\n background-color: transparent;\n border: 1px solid #e0e0e0;\n border-radius: 6px;\n cursor: pointer;\n font-size: 13px;\n font-weight: 500;\n color: #333;\n transition: all 0.15s ease;\n white-space: nowrap;\n}\n\n.tab-action-button:hover:not(:disabled) {\n background-color: #f5f5f5;\n border-color: #d0d0d0;\n}\n\n.tab-action-button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.tab-action-button i {\n font-size: 12px;\n}\n\n/* Both buttons use the same white/secondary style */\n.tab-action-button.create-button,\n.tab-action-button.print-button,\n.tab-action-button.feedback-button {\n background-color: white;\n color: #333;\n border-color: #e0e0e0;\n}\n\n.tab-action-button.create-button:hover:not(:disabled),\n.tab-action-button.print-button:hover:not(:disabled),\n.tab-action-button.feedback-button:hover:not(:disabled) {\n background-color: #f5f5f5;\n border-color: #d0d0d0;\n}\n\n/* Feedback button active state */\n.tab-action-button.feedback-button.active {\n background-color: #3B82F6;\n color: white;\n border-color: #3B82F6;\n}\n\n.tab-action-button.feedback-button.active:hover:not(:disabled) {\n background-color: #2563EB;\n border-color: #2563EB;\n}\n\n/* Toggle buttons styling */\n.tab-action-button.toggle-button {\n background-color: white;\n color: #666;\n border-color: #e0e0e0;\n}\n\n.tab-action-button.toggle-button:hover:not(:disabled) {\n background-color: #f5f5f5;\n border-color: #d0d0d0;\n color: #333;\n}\n\n.tab-action-button.toggle-button.active {\n background-color: #5B4FE9;\n color: white;\n border-color: #5B4FE9;\n}\n\n.tab-action-button.toggle-button.active:hover:not(:disabled) {\n background-color: #4940D4;\n border-color: #4940D4;\n}\n\n/* Details panel styling */\n.details-panel {\n border-bottom: 1px solid #e0e0e0;\n background-color: #fafafa;\n overflow: hidden;\n transition: height 0.3s ease;\n}\n\n.details-content {\n padding: 16px;\n overflow-y: auto;\n height: 100%;\n font-size: 14px;\n line-height: 1.6;\n}\n\n.details-content.code-content {\n padding: 0;\n}\n\n/* Panel resizer */\n.panel-resizer {\n height: 4px;\n background-color: #e0e0e0;\n cursor: ns-resize;\n position: relative;\n transition: background-color 0.2s ease;\n}\n\n.panel-resizer:hover {\n background-color: #d0d0d0;\n}\n\n.resizer-handle {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 40px;\n height: 2px;\n background-color: #999;\n border-radius: 1px;\n}\n\n/* Markdown content styling */\n.details-content :deep(h1) { font-size: 1.5em; margin-top: 0; margin-bottom: 0.5em; }\n.details-content :deep(h2) { font-size: 1.3em; margin-top: 1em; margin-bottom: 0.5em; }\n.details-content :deep(h3) { font-size: 1.1em; margin-top: 1em; margin-bottom: 0.5em; }\n.details-content :deep(ul), .details-content :deep(ol) { margin-left: 1.5em; }\n.details-content :deep(code) { \n background-color: #f4f4f4; \n padding: 2px 4px; \n border-radius: 3px; \n font-family: 'Courier New', monospace; \n font-size: 0.9em;\n}\n.details-content :deep(pre) { \n background-color: #f4f4f4; \n padding: 12px; \n border-radius: 4px; \n overflow-x: auto; \n}\n.details-content :deep(blockquote) { \n border-left: 4px solid #e0e0e0; \n padding-left: 16px; \n margin-left: 0; \n color: #666; \n}\n\n/* Tab styling - improved for better formatting */\n::ng-deep .k-tabstrip {\n border: none;\n height: 100%;\n display: flex;\n flex-direction: column;\n margin: 0;\n}\n\n::ng-deep .k-tabstrip-items {\n background: #f8f9fa;\n border: none;\n border-bottom: 1px solid #e0e0e0;\n flex: 0 0 auto;\n padding: 4px 8px 0 8px;\n gap: 2px;\n display: flex;\n min-height: auto;\n height: auto;\n}\n\n::ng-deep .k-tabstrip-items-wrapper {\n height: auto;\n min-height: auto;\n}\n\n::ng-deep .k-content {\n flex: 1;\n overflow: hidden;\n padding: 0;\n background: white;\n border: none;\n min-height: 0;\n}\n\n::ng-deep .k-tabstrip .k-item {\n margin-right: 2px;\n border: none;\n background: transparent;\n border-radius: 4px 4px 0 0;\n padding: 0;\n transition: all 0.2s ease;\n height: auto;\n min-height: auto;\n}\n\n::ng-deep .k-tabstrip .k-item.k-selected {\n background: white;\n border: 1px solid #e0e0e0;\n border-bottom: 1px solid white;\n margin-bottom: -1px;\n z-index: 1;\n}\n\n::ng-deep .k-tabstrip .k-link {\n padding: 6px 12px;\n font-weight: 500;\n font-size: 13px;\n color: #666;\n transition: all 0.15s ease;\n border-radius: 4px 4px 0 0;\n background: transparent;\n border: none;\n display: flex;\n align-items: center;\n gap: 3px;\n line-height: 1.2;\n min-height: auto;\n height: auto;\n}\n\n::ng-deep .k-tabstrip .k-link i {\n font-size: 12px;\n}\n\n::ng-deep .k-tabstrip .k-item:hover:not(.k-selected) .k-link {\n color: #333;\n background: rgba(0, 0, 0, 0.04);\n}\n\n::ng-deep .k-tabstrip .k-item.k-selected .k-link {\n color: #1976d2;\n font-weight: 600;\n background: white;\n}\n\n/* Star icon styling */\n::ng-deep .k-tabstrip .k-link .star-icon {\n display: inline-block;\n margin-right: 4px;\n color: #ffd700;\n font-size: 12px;\n vertical-align: middle;\n}\n\n/* Hide default Kendo tab styling */\n::ng-deep .k-tabstrip-items::before,\n::ng-deep .k-tabstrip-items::after {\n display: none;\n}\n\n::ng-deep .k-tabstrip .k-item::before,\n::ng-deep .k-tabstrip .k-item::after {\n display: none;\n}\n\n/* Remove focus outline */\n::ng-deep .k-tabstrip .k-link:focus {\n outline: none;\n box-shadow: none;\n}\n\n/* Make sure tab content fills available space */\n::ng-deep .k-tabstrip .k-content.k-state-active {\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n\n/* React host container */\n.react-host-container {\n width: 100%;\n height: 100%;\n}\n\n/* Inner tabs specific styling with horizontal scroll */\n::ng-deep .inner-tabs .k-tabstrip-items-wrapper {\n overflow-x: auto !important;\n overflow-y: hidden !important;\n max-width: 100%;\n}\n\n::ng-deep .inner-tabs .k-tabstrip-items {\n display: inline-flex !important;\n flex-wrap: nowrap !important;\n width: max-content !important;\n padding: 4px 8px 0 8px;\n background: #fff;\n border-bottom: 1px solid #e8e8e8;\n}\n\n::ng-deep .inner-tabs .k-tabstrip-item {\n flex: 0 0 auto !important;\n display: inline-block !important;\n float: none !important;\n}\n\n::ng-deep .inner-tabs .k-link {\n padding: 6px 12px;\n font-size: 12px;\n white-space: nowrap !important;\n display: inline-flex !important;\n align-items: center;\n gap: 4px;\n}\n\n/* Force single row for inner tabs */\n::ng-deep .inner-tabstrip-container .k-tabstrip-items {\n min-width: max-content !important;\n}\n\n/* Custom scrollbar for inner tabs */\n::ng-deep .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar {\n height: 6px;\n}\n\n::ng-deep .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar-track {\n background: #f1f1f1;\n}\n\n::ng-deep .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar-thumb {\n background: #888;\n border-radius: 3px;\n}\n\n::ng-deep .inner-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar-thumb:hover {\n background: #555;\n}\n\n/* Nested tab styling - for tabs within tabs (fallback) */\n::ng-deep .k-tabstrip .k-tabstrip {\n margin: 0;\n}\n\n::ng-deep .k-tabstrip .k-tabstrip .k-tabstrip-items {\n display: inline-flex !important;\n flex-wrap: nowrap !important;\n width: max-content !important;\n}\n\n::ng-deep .k-tabstrip .k-tabstrip .k-tabstrip-items-wrapper {\n overflow-x: auto !important;\n overflow-y: hidden !important;\n}\n\n/* Ensure proper content area in nested tabs */\n::ng-deep .k-tabstrip .k-tabstrip .k-content {\n border: none;\n background: transparent;\n}\n\n"] }]
|
|
1228
1256
|
}], () => [{ type: i1.DomSanitizer }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i2.AngularAdapterService }], { UIComponentCode: [{
|
|
1229
1257
|
type: Input
|
|
1230
1258
|
}], ComponentObjectName: [{
|
|
@@ -1239,6 +1267,10 @@ Component Name: ${this.ComponentObjectName || 'Unknown'}`;
|
|
|
1239
1267
|
type: Input
|
|
1240
1268
|
}], matchingReportID: [{
|
|
1241
1269
|
type: Input
|
|
1270
|
+
}], showFeedbackPanel: [{
|
|
1271
|
+
type: Input
|
|
1272
|
+
}], toggleFeedbackPanel: [{
|
|
1273
|
+
type: Input
|
|
1242
1274
|
}], DrillDownEvent: [{
|
|
1243
1275
|
type: Output
|
|
1244
1276
|
}], CreateReportRequested: [{
|