@genexus/genexus-ide-ui 0.0.36 → 0.0.38

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.
Files changed (80) hide show
  1. package/dist/cjs/ch-alert.cjs.entry.js +120 -0
  2. package/dist/cjs/ch-suggest_4.cjs.entry.js +46 -11
  3. package/dist/cjs/ch-timer.cjs.entry.js +45 -0
  4. package/dist/cjs/genexus-ide-ui.cjs.js +1 -1
  5. package/dist/cjs/gx-ide-entity-selector.cjs.entry.js +87 -0
  6. package/dist/cjs/gx-ide-new-environment.cjs.entry.js +3 -2
  7. package/dist/cjs/gx-ide-new-object.cjs.entry.js +147 -0
  8. package/dist/cjs/gx-ide-references.cjs.entry.js +15 -35
  9. package/dist/cjs/gx-ide-team-dev-update-partial-selection.cjs.entry.js +5 -7
  10. package/dist/cjs/{gx-ide-entity-selector_2.cjs.entry.js → gxg-date-picker.cjs.entry.js} +0 -81
  11. package/dist/cjs/gxg-list-box_2.cjs.entry.js +2 -2
  12. package/dist/cjs/loader.cjs.js +1 -1
  13. package/dist/collection/collection-manifest.json +3 -0
  14. package/dist/collection/common/render-suggest.js +4 -1
  15. package/dist/collection/components/new-environment/new-environment.js +24 -3
  16. package/dist/collection/components/new-object/gx-ide-assets/new-object/langs/new-object.lang.en.json +13 -0
  17. package/dist/collection/components/new-object/gx-ide-assets/new-object/langs/new-object.lang.ja.json +11 -0
  18. package/dist/collection/components/new-object/gx-ide-assets/new-object/langs/new-object.lang.zh.json +11 -0
  19. package/dist/collection/components/new-object/new-object.css +143 -0
  20. package/dist/collection/components/new-object/new-object.js +380 -0
  21. package/dist/collection/components/references/helpers.js +0 -22
  22. package/dist/collection/components/references/references.js +12 -13
  23. package/dist/collection/components/team-dev-update-partial-selection/gx-ide-assets/team-dev-update-partial-selection/langs/team-dev-update-partial-selection.lang.en.json +3 -3
  24. package/dist/collection/components/team-dev-update-partial-selection/team-dev-update-partial-selection.js +5 -7
  25. package/dist/components/ch-alert.js +150 -0
  26. package/dist/components/ch-suggest-list-item2.js +41 -4
  27. package/dist/components/ch-suggest2.js +5 -9
  28. package/dist/components/ch-timer.js +6 -0
  29. package/dist/components/gx-ide-new-environment.js +4 -2
  30. package/dist/components/gx-ide-new-object.d.ts +11 -0
  31. package/dist/components/gx-ide-new-object.js +247 -0
  32. package/dist/components/gx-ide-references.js +15 -35
  33. package/dist/components/gx-ide-team-dev-update-partial-selection.js +5 -7
  34. package/dist/components/index.d.ts +1 -0
  35. package/dist/components/index.js +3 -0
  36. package/dist/components/list-box-item.js +2 -2
  37. package/dist/components/timer.js +61 -0
  38. package/dist/esm/ch-alert.entry.js +116 -0
  39. package/dist/esm/ch-suggest_4.entry.js +46 -11
  40. package/dist/esm/ch-timer.entry.js +41 -0
  41. package/dist/esm/genexus-ide-ui.js +1 -1
  42. package/dist/esm/gx-ide-entity-selector.entry.js +83 -0
  43. package/dist/esm/gx-ide-new-environment.entry.js +3 -2
  44. package/dist/esm/gx-ide-new-object.entry.js +143 -0
  45. package/dist/esm/gx-ide-references.entry.js +15 -35
  46. package/dist/esm/gx-ide-team-dev-update-partial-selection.entry.js +5 -7
  47. package/dist/esm/{gx-ide-entity-selector_2.entry.js → gxg-date-picker.entry.js} +1 -81
  48. package/dist/esm/gxg-list-box_2.entry.js +2 -2
  49. package/dist/esm/loader.js +1 -1
  50. package/dist/genexus-ide-ui/genexus-ide-ui.esm.js +1 -1
  51. package/dist/genexus-ide-ui/gx-ide-assets/new-object/langs/new-object.lang.en.json +13 -0
  52. package/dist/genexus-ide-ui/gx-ide-assets/new-object/langs/new-object.lang.ja.json +11 -0
  53. package/dist/genexus-ide-ui/gx-ide-assets/new-object/langs/new-object.lang.zh.json +11 -0
  54. package/dist/genexus-ide-ui/gx-ide-assets/team-dev-update-partial-selection/langs/team-dev-update-partial-selection.lang.en.json +3 -3
  55. package/dist/genexus-ide-ui/p-04df38d0.entry.js +1 -0
  56. package/dist/genexus-ide-ui/{p-06ddf2a3.entry.js → p-37ecffdc.entry.js} +1 -1
  57. package/dist/genexus-ide-ui/p-48412811.entry.js +1 -0
  58. package/dist/genexus-ide-ui/p-4f02b7bf.entry.js +1 -0
  59. package/dist/genexus-ide-ui/p-532bf5cb.entry.js +1 -0
  60. package/dist/genexus-ide-ui/p-5fe59458.entry.js +1 -0
  61. package/dist/genexus-ide-ui/p-6be805a0.entry.js +1 -0
  62. package/dist/genexus-ide-ui/p-9be97571.entry.js +1 -0
  63. package/dist/genexus-ide-ui/p-a82042ee.entry.js +1 -0
  64. package/dist/genexus-ide-ui/p-db4f2732.entry.js +1 -0
  65. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/alert/alert.css +46 -0
  66. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/alert/timer/timer.css +13 -0
  67. package/dist/node_modules/@genexus/gemini/dist/collection/components/list-box-item/list-box-item.css +13 -5
  68. package/dist/types/common/render-suggest.d.ts +1 -1
  69. package/dist/types/components/new-environment/new-environment.d.ts +5 -1
  70. package/dist/types/components/new-object/new-object.d.ts +107 -0
  71. package/dist/types/components/references/helpers.d.ts +1 -6
  72. package/dist/types/components/references/references.d.ts +6 -6
  73. package/dist/types/components/team-dev-update-partial-selection/team-dev-update-partial-selection.d.ts +2 -2
  74. package/dist/types/components.d.ts +110 -4
  75. package/package.json +3 -3
  76. package/dist/genexus-ide-ui/p-1b6b11e1.entry.js +0 -1
  77. package/dist/genexus-ide-ui/p-35bc6e3a.entry.js +0 -1
  78. package/dist/genexus-ide-ui/p-4aa2885b.entry.js +0 -1
  79. package/dist/genexus-ide-ui/p-714bd8ea.entry.js +0 -1
  80. package/dist/genexus-ide-ui/p-74a88934.entry.js +0 -1
@@ -0,0 +1,143 @@
1
+ /*Gemini*/
2
+ /*Gx Ide*/
3
+ /* Helper Classes */
4
+ .gxi-hidden {
5
+ display: none !important;
6
+ }
7
+
8
+ .gxi-full-height {
9
+ height: 100%;
10
+ }
11
+
12
+ .align-start {
13
+ display: flex;
14
+ align-items: start;
15
+ }
16
+
17
+ .align-center {
18
+ display: flex;
19
+ align-items: center;
20
+ }
21
+
22
+ .align-end {
23
+ display: flex;
24
+ align-items: end;
25
+ }
26
+
27
+ /* Grids */
28
+ .grid {
29
+ display: grid;
30
+ grid-row-gap: var(--gx-ide-grid-row-gap);
31
+ grid-column-gap: var(--gx-ide-grid-column-gap);
32
+ grid-template-rows: auto;
33
+ }
34
+
35
+ /*All components Host should have this class set. !important is set on every rule, since this styles could be overridden by the host user, since they are applied on the host component*/
36
+ :host(.gx-ide-component) {
37
+ box-shadow: var(--box-shadow-01) !important;
38
+ height: 100% !important;
39
+ display: flex !important;
40
+ flex-direction: column !important;
41
+ }
42
+
43
+ /*stylize the top bar*/
44
+ :host(:focus-within) gx-ide-top-bar::part(wrapper) {
45
+ background-color: var(--color-secondary-enabled);
46
+ }
47
+
48
+ /* Main wrapper (should be the first element inside the host. Everything should be inside .gx-ide-main-wrapper) */
49
+ .gx-ide-main-wrapper {
50
+ color: var(--gx-ide-component-text-color);
51
+ font-weight: var(--font-weight-regular);
52
+ font-size: var(--font-size-lg);
53
+ line-height: 1.6em;
54
+ height: 100%;
55
+ background-color: var(--gx-ide-component-background-color);
56
+ display: flex;
57
+ flex-direction: column;
58
+ flex-grow: 1;
59
+ }
60
+
61
+ /*This is the main element. This is the one that take the remaining vertical space*/
62
+ .gx-ide-main {
63
+ flex-grow: 1;
64
+ overflow-y: auto;
65
+ /* Track */
66
+ /* Handle */
67
+ /* Handle on hover */
68
+ }
69
+ .gx-ide-main::-webkit-scrollbar {
70
+ width: 6px;
71
+ height: 6px;
72
+ }
73
+ .gx-ide-main::-webkit-scrollbar-track {
74
+ background-color: var(--gray-02);
75
+ border-radius: 10px;
76
+ }
77
+ .gx-ide-main::-webkit-scrollbar-thumb {
78
+ background: var(--gray-05);
79
+ border-radius: 10px;
80
+ }
81
+ .gx-ide-main::-webkit-scrollbar-thumb:hover {
82
+ background: var(--gray-04);
83
+ cursor: pointer;
84
+ }
85
+ .gx-ide-main .gxg-scroll {
86
+ display: block;
87
+ overflow-y: auto;
88
+ padding-inline-end: 2px;
89
+ }
90
+
91
+ .gx-ide-overflow {
92
+ overflow-y: auto;
93
+ /* Track */
94
+ /* Handle */
95
+ /* Handle on hover */
96
+ }
97
+ .gx-ide-overflow::-webkit-scrollbar {
98
+ width: 6px;
99
+ height: 6px;
100
+ }
101
+ .gx-ide-overflow::-webkit-scrollbar-track {
102
+ background-color: var(--gray-02);
103
+ border-radius: 10px;
104
+ }
105
+ .gx-ide-overflow::-webkit-scrollbar-thumb {
106
+ background: var(--gray-05);
107
+ border-radius: 10px;
108
+ }
109
+ .gx-ide-overflow::-webkit-scrollbar-thumb:hover {
110
+ background: var(--gray-04);
111
+ cursor: pointer;
112
+ }
113
+ .gx-ide-overflow .gxg-scroll {
114
+ display: block;
115
+ overflow-y: auto;
116
+ padding-inline-end: 2px;
117
+ }
118
+
119
+ /*Gemini*/
120
+ /*Gx Ide*/
121
+ :host {
122
+ display: block;
123
+ border: 1px solid var(--gxg-border-color--regular);
124
+ background-color: var(--color-background);
125
+ }
126
+
127
+ :host(.gxi-new-object--shadow) {
128
+ border: none;
129
+ box-shadow: var(--box-shadow-01);
130
+ }
131
+
132
+ /*HEADER*/
133
+ .header {
134
+ grid-template-columns: auto 1fr;
135
+ }
136
+
137
+ .first-row {
138
+ grid-template-columns: 1fr 3fr;
139
+ grid-template-rows: 1fr;
140
+ }
141
+ .first-row *:nth-child(3) {
142
+ grid-column: 1/3;
143
+ }
@@ -0,0 +1,380 @@
1
+ /* STENCIL IMPORTS */
2
+ import { Host, h } from "@stencil/core";
3
+ /* OTHER LIBRARIES IMPORTS */
4
+ /* CUSTOM IMPORTS */
5
+ import { Locale } from "../../common/locale";
6
+ export class GxIdeNewObject {
7
+ constructor() {
8
+ this.descriptionModifiedByUser = false;
9
+ // 7.LISTENERS //
10
+ // 8.PUBLIC METHODS API //
11
+ // 9.LOCAL METHODS //
12
+ this.renderModuleFolder = () => {
13
+ if (this.selectedType.hasModule || this.selectedType.hasFolder) {
14
+ let labelDescription = this._componentLocale.moduleFolder;
15
+ if (!this.selectedType.hasFolder) {
16
+ labelDescription = this._componentLocale.moduleOnly;
17
+ }
18
+ else if (!this.selectedType.hasModule) {
19
+ labelDescription = this._componentLocale.folderOnly;
20
+ }
21
+ return [
22
+ h("gxg-label", { labelPosition: "start" }, labelDescription),
23
+ h("gx-ide-entity-selector", { value: this.parent, defaultValue: this.defaultParent, selectEntityCallback: this.selectModuleCallback, ref: (el) => (this.parentEl = el), part: "module" })
24
+ ];
25
+ }
26
+ return null;
27
+ };
28
+ /**
29
+ * This method initializes tha name value. It depends on 'this.selectedType'
30
+ */
31
+ this.init = () => {
32
+ if (this.selectedType && this.selectedType.name.length > 0) {
33
+ this.name = this.selectedType.name;
34
+ this.description = this.selectedType.name;
35
+ }
36
+ };
37
+ this.onInputNameHandler = (e) => {
38
+ const name = e.detail;
39
+ if (!this.descriptionModifiedByUser) {
40
+ // description should be equal to name, unless the description was already modified by the user.
41
+ this.descriptionEl.value = name;
42
+ }
43
+ this.processName(name);
44
+ };
45
+ this.onBlurNameHandler = () => {
46
+ this.validateNameHandler(this.nameEl.value);
47
+ };
48
+ this.onInputDescriptionHandler = (e) => {
49
+ this.description = e.detail;
50
+ this.descriptionModifiedByUser = true;
51
+ };
52
+ this.processName = (name) => {
53
+ if (this.validateNameTimeoutRef) {
54
+ clearTimeout(this.validateNameTimeoutRef);
55
+ }
56
+ this.validateNameTimeoutRef = setTimeout(() => {
57
+ this.validateNameHandler(name);
58
+ }, 300);
59
+ };
60
+ this.validateNameHandler = async (name) => {
61
+ const result = await this.validateNameCallback(name);
62
+ if (result !== undefined) {
63
+ // the name is not valid. display message
64
+ this.nameEl.validationMessage = result;
65
+ this.nameEl.validationStatus = "error";
66
+ this.nameIsValid = false;
67
+ }
68
+ else {
69
+ // valid name
70
+ this.nameEl.validationMessage = null;
71
+ this.nameEl.validationStatus = "indeterminate";
72
+ this.nameIsValid = true;
73
+ }
74
+ };
75
+ this.createCallbackHandler = async () => {
76
+ var _a;
77
+ const data = {
78
+ typeId: (_a = this.selectedType) === null || _a === void 0 ? void 0 : _a.id,
79
+ name: this.nameEl.value,
80
+ description: this.descriptionEl.value,
81
+ moduleId: this.parentEl.value.id
82
+ };
83
+ await this.createCallback(data);
84
+ };
85
+ this.cancelCallbackHandler = async () => {
86
+ await this.cancelCallback();
87
+ };
88
+ this.categoryOnClickHandler = (category) => {
89
+ this.selectedCategory = category;
90
+ if (category.types[0]) {
91
+ this.selectedType = category.types[0];
92
+ }
93
+ };
94
+ this.typeOnClickHandler = (type) => {
95
+ this.selectedType = type;
96
+ };
97
+ this.selectedCategory = undefined;
98
+ this.selectedType = undefined;
99
+ this.nameIsValid = false;
100
+ this.name = undefined;
101
+ this.description = undefined;
102
+ this.shadow = false;
103
+ this.typeCategories = undefined;
104
+ this.parent = undefined;
105
+ this.defaultParent = undefined;
106
+ this.selectModuleCallback = undefined;
107
+ this.validateNameCallback = undefined;
108
+ this.createCallback = undefined;
109
+ this.cancelCallback = undefined;
110
+ }
111
+ // 6.COMPONENT LIFECYCLE EVENTS //
112
+ async componentWillLoad() {
113
+ this.selectedCategory = this.typeCategories[0];
114
+ this.selectedType = this.typeCategories[0].types[0];
115
+ this.init();
116
+ this._componentLocale = await Locale.getComponentStrings(this.el);
117
+ }
118
+ componentDidLoad() {
119
+ this.nameEl.focus();
120
+ this.validateNameHandler(this.name);
121
+ this.componentDidLoadEvent.emit(true);
122
+ }
123
+ // 10.LOCAL METHODS (RENDER) //
124
+ // 11.RENDER() FUNCTION //
125
+ render() {
126
+ return (h(Host, { class: {
127
+ "gxi-new-kb": true,
128
+ "gxi-new-object--shadow": this.shadow
129
+ } }, h("div", { class: "gx-ide-main-wrapper gx-ide-overflow" }, h("main", { class: "main" }, h("gxg-container", { fieldset: true, displayBorderBottom: true }, h("div", { class: "grid first-row" }, this.typeCategories.length > 1 ? (h("gxg-list-box", { "single-selection": true, id: "list-box-category", "the-title": this._componentLocale.categorySelection, height: "100%" }, this.typeCategories.map(category => (h("gxg-list-box-item", { index: Number(category.id), icon: category.icon, part: `${category}-${category.id}`, onClick: () => this.categoryOnClickHandler(category) }, category.name))))) : null, h("gxg-list-box", { "single-selection": true, id: "list-box-type", "the-title": this._componentLocale.typeSelection, height: "100%" }, this.selectedCategory.types
130
+ ? this.selectedCategory.types.map(type => (h("gxg-list-box-item", { index: Number(type.id), icon: type.icon, selected: this.selectedType.id === type.id, part: `${type}-${type.id}`, onClick: () => this.typeOnClickHandler(type) }, type.name)))
131
+ : null), h("gxg-title", { type: "title-05" }, "Text about the ", this.selectedType.name))), h("gxg-container", { fieldset: true }, h("div", { class: "grid" }, h("header", { class: "header grid" }, h("gxg-label", { labelPosition: "start" }, this._componentLocale.name), h("gxg-form-text", { "label-position": "start", placeholder: "Name", "max-width": "100%", value: this.name, ref: (el) => (this.nameEl = el), onInput: this.onInputNameHandler, onBlur: this.onBlurNameHandler, part: "name", "display-validation-styles": true, "display-validation-message": true }), h("gxg-label", { labelPosition: "start" }, this._componentLocale.description), h("gxg-form-text", { "label-position": "start", placeholder: "Description", "max-width": "100%", value: this.description, ref: (el) => (this.descriptionEl = el), onInput: this.onInputDescriptionHandler, part: "description", "display-validation-styles": true, "display-validation-message": true }), this.renderModuleFolder()))), h("gxg-container", { fieldset: true, displayBorderTop: true }, h("gxg-button", { id: "button-create", slot: "footer", type: "primary-text-only", onClick: this.createCallbackHandler, disabled: !this.nameIsValid, part: "gxg-button gxg-button--create" }, this._componentLocale.footer.btnCreate), h("gxg-button", { id: "button-cancel", slot: "footer", type: "outlined", onClick: this.cancelCallbackHandler, part: "gxg-button gxg-button--cancel" }, this._componentLocale.footer.btnCancel))))));
132
+ }
133
+ static get is() { return "gx-ide-new-object"; }
134
+ static get encapsulation() { return "shadow"; }
135
+ static get originalStyleUrls() {
136
+ return {
137
+ "$": ["new-object.scss"]
138
+ };
139
+ }
140
+ static get styleUrls() {
141
+ return {
142
+ "$": ["new-object.css"]
143
+ };
144
+ }
145
+ static get assetsDirs() { return ["gx-ide-assets/new-object"]; }
146
+ static get properties() {
147
+ return {
148
+ "shadow": {
149
+ "type": "boolean",
150
+ "mutable": false,
151
+ "complexType": {
152
+ "original": "false",
153
+ "resolved": "boolean",
154
+ "references": {}
155
+ },
156
+ "required": false,
157
+ "optional": false,
158
+ "docs": {
159
+ "tags": [],
160
+ "text": "Applies a shadow all around"
161
+ },
162
+ "attribute": "shadow",
163
+ "reflect": false,
164
+ "defaultValue": "false"
165
+ },
166
+ "typeCategories": {
167
+ "type": "unknown",
168
+ "mutable": false,
169
+ "complexType": {
170
+ "original": "TypeCategoryData[]",
171
+ "resolved": "TypeCategoryData[]",
172
+ "references": {
173
+ "TypeCategoryData": {
174
+ "location": "local"
175
+ }
176
+ }
177
+ },
178
+ "required": true,
179
+ "optional": false,
180
+ "docs": {
181
+ "tags": [],
182
+ "text": "Array containing category list and its corresponding types"
183
+ }
184
+ },
185
+ "parent": {
186
+ "type": "unknown",
187
+ "mutable": false,
188
+ "complexType": {
189
+ "original": "EntityData",
190
+ "resolved": "{ id: string; name: string; iconSrc?: string; iconColor?: Color; }",
191
+ "references": {
192
+ "EntityData": {
193
+ "location": "import",
194
+ "path": "../entity-selector/entity-selector"
195
+ }
196
+ }
197
+ },
198
+ "required": false,
199
+ "optional": false,
200
+ "docs": {
201
+ "tags": [],
202
+ "text": "Current value for Module/Folder"
203
+ }
204
+ },
205
+ "defaultParent": {
206
+ "type": "unknown",
207
+ "mutable": false,
208
+ "complexType": {
209
+ "original": "EntityData",
210
+ "resolved": "{ id: string; name: string; iconSrc?: string; iconColor?: Color; }",
211
+ "references": {
212
+ "EntityData": {
213
+ "location": "import",
214
+ "path": "../entity-selector/entity-selector"
215
+ }
216
+ }
217
+ },
218
+ "required": false,
219
+ "optional": false,
220
+ "docs": {
221
+ "tags": [],
222
+ "text": "Default value for the Module/Folder field."
223
+ }
224
+ },
225
+ "selectModuleCallback": {
226
+ "type": "unknown",
227
+ "mutable": false,
228
+ "complexType": {
229
+ "original": "SelectModuleCallback",
230
+ "resolved": "() => Promise<EntityData>",
231
+ "references": {
232
+ "SelectModuleCallback": {
233
+ "location": "local"
234
+ }
235
+ }
236
+ },
237
+ "required": false,
238
+ "optional": false,
239
+ "docs": {
240
+ "tags": [],
241
+ "text": "Callback invoked when the action is executed on the Module/Folder filter (button '...'). It returns the information of the selected object (id and name) or 'undefined' if it was canceled."
242
+ }
243
+ },
244
+ "validateNameCallback": {
245
+ "type": "unknown",
246
+ "mutable": false,
247
+ "complexType": {
248
+ "original": "ValidateNameCallback",
249
+ "resolved": "(name: string) => Promise<string>",
250
+ "references": {
251
+ "ValidateNameCallback": {
252
+ "location": "local"
253
+ }
254
+ }
255
+ },
256
+ "required": false,
257
+ "optional": false,
258
+ "docs": {
259
+ "tags": [],
260
+ "text": "Callback invoked when you must validate a name. Returns error message or 'undefined' if name is not valid."
261
+ }
262
+ },
263
+ "createCallback": {
264
+ "type": "unknown",
265
+ "mutable": false,
266
+ "complexType": {
267
+ "original": "CreateCallback",
268
+ "resolved": "(data: NewObjectData) => Promise<boolean>",
269
+ "references": {
270
+ "CreateCallback": {
271
+ "location": "local"
272
+ }
273
+ }
274
+ },
275
+ "required": false,
276
+ "optional": false,
277
+ "docs": {
278
+ "tags": [],
279
+ "text": "Callback invoked when user wants to cancel object creation"
280
+ }
281
+ },
282
+ "cancelCallback": {
283
+ "type": "unknown",
284
+ "mutable": false,
285
+ "complexType": {
286
+ "original": "CancelCallback",
287
+ "resolved": "() => Promise<void>",
288
+ "references": {
289
+ "CancelCallback": {
290
+ "location": "local"
291
+ }
292
+ }
293
+ },
294
+ "required": false,
295
+ "optional": false,
296
+ "docs": {
297
+ "tags": [],
298
+ "text": "Callback invoked when user wants to confirm object creation"
299
+ }
300
+ }
301
+ };
302
+ }
303
+ static get states() {
304
+ return {
305
+ "selectedCategory": {},
306
+ "selectedType": {},
307
+ "nameIsValid": {},
308
+ "name": {},
309
+ "description": {}
310
+ };
311
+ }
312
+ static get events() {
313
+ return [{
314
+ "method": "create",
315
+ "name": "create",
316
+ "bubbles": true,
317
+ "cancelable": true,
318
+ "composed": true,
319
+ "docs": {
320
+ "tags": [],
321
+ "text": "This event emm=its the data needed to create a new object"
322
+ },
323
+ "complexType": {
324
+ "original": "NewObjectData",
325
+ "resolved": "NewObjectData",
326
+ "references": {
327
+ "NewObjectData": {
328
+ "location": "local"
329
+ }
330
+ }
331
+ }
332
+ }, {
333
+ "method": "validateName",
334
+ "name": "validateName",
335
+ "bubbles": true,
336
+ "cancelable": true,
337
+ "composed": true,
338
+ "docs": {
339
+ "tags": [],
340
+ "text": "This event is trigger after a validation of the object name is made. Returns undefined if its valid, otherwise an error message"
341
+ },
342
+ "complexType": {
343
+ "original": "string | undefined",
344
+ "resolved": "string",
345
+ "references": {}
346
+ }
347
+ }, {
348
+ "method": "cancel",
349
+ "name": "cancel",
350
+ "bubbles": true,
351
+ "cancelable": true,
352
+ "composed": true,
353
+ "docs": {
354
+ "tags": [],
355
+ "text": "This event emits the 'cancel' event"
356
+ },
357
+ "complexType": {
358
+ "original": "boolean",
359
+ "resolved": "boolean",
360
+ "references": {}
361
+ }
362
+ }, {
363
+ "method": "componentDidLoadEvent",
364
+ "name": "componentDidLoadEvent",
365
+ "bubbles": true,
366
+ "cancelable": true,
367
+ "composed": true,
368
+ "docs": {
369
+ "tags": [],
370
+ "text": "This event is emited once just after the component is fully loaded and the first render() occurs."
371
+ },
372
+ "complexType": {
373
+ "original": "boolean",
374
+ "resolved": "boolean",
375
+ "references": {}
376
+ }
377
+ }];
378
+ }
379
+ static get elementRef() { return "el"; }
380
+ }
@@ -15,7 +15,6 @@ export const convertObjectDataToSuggestData = (selectorCategoriesData) => {
15
15
  selectorCategory.items.forEach((objectData) => {
16
16
  const suggestItem = {
17
17
  value: objectData.id,
18
- caption: objectData.name,
19
18
  description: objectData.description,
20
19
  icon: objectData.icon
21
20
  };
@@ -26,27 +25,6 @@ export const convertObjectDataToSuggestData = (selectorCategoriesData) => {
26
25
  }
27
26
  return suggestData;
28
27
  };
29
- /**
30
- * @description Keeps an updated state of the last suggested categories objects passed by the host.
31
- */
32
- export const updateSuggestedObjects = (selectorCategoryData) => {
33
- const suggestedObjects = [];
34
- if (selectorCategoryData === null || selectorCategoryData === void 0 ? void 0 : selectorCategoryData.length) {
35
- selectorCategoryData.forEach(category => {
36
- if (category.items) {
37
- category.items.forEach(object => {
38
- suggestedObjects.push({
39
- id: object.id,
40
- icon: object.icon,
41
- name: object.name,
42
- description: object.description
43
- });
44
- });
45
- }
46
- });
47
- }
48
- return suggestedObjects;
49
- };
50
28
  /**
51
29
  * @description This function converts ReferenceData[] data to GxgTreeItemData[]
52
30
  */
@@ -5,17 +5,17 @@ import { Locale } from "../../common/locale";
5
5
  import { renderTreeItems } from "../../common/render-tree";
6
6
  import { updateTreeModel } from "../../common/update-tree-model";
7
7
  import { renderSuggestLists } from "../../common/render-suggest";
8
- import { convertObjectDataToSuggestData, convertReferenceDataToTreeData, updateSuggestedObjects } from "./helpers";
8
+ import { convertObjectDataToSuggestData, convertReferenceDataToTreeData } from "./helpers";
9
9
  export class GxIdeReferences {
10
10
  constructor() {
11
- /**
12
- * Keeps an array of the last suggested objects, returned by selectorSourceCallback
13
- */
14
- this.suggestedObjects = [];
15
11
  /**
16
12
  * The references messages max. width that appear if the tree is empty or could not be retrieved.
17
13
  */
18
14
  this.referencesMessagesMaxWidth = "200px";
15
+ /**
16
+ * The last SelectorCategoryData[] returned by selectorSourceCallback
17
+ */
18
+ this.selectorCategoryData = [];
19
19
  // 7.LISTENERS //
20
20
  // 8.PUBLIC METHODS API //
21
21
  // 9.LOCAL METHODS //
@@ -24,21 +24,20 @@ export class GxIdeReferences {
24
24
  */
25
25
  this.attachSelectObjectListener = () => {
26
26
  this.selectObjectSuggestEl.addEventListener("itemSelected", (e) => {
27
- const itemValue = e.detail.value;
28
- this.selectedObject = this.suggestedObjects.find(item => {
29
- return item.id === itemValue;
30
- });
27
+ const categoryIndex = e.detail.indexes.listIndex;
28
+ const itemIndex = e.detail.indexes.itemIndex;
29
+ this.selectedObject =
30
+ this.selectorCategoryData[categoryIndex].items[itemIndex];
31
31
  });
32
32
  };
33
33
  /**
34
- * This handler gets fired every time the value of the 'Select Object' ch-suggest changes. Then, it calls the 'updateSuggestedObjects' method, that keeps the state of the last suggested objects that were passed bu the host. Also, it shows the suggested objects on the ch-suggest box.
34
+ * This handler gets fired every time the value of the 'Select Object' ch-suggest changes.
35
35
  */
36
36
  this.selectObjectValueChangedHandler = async (e) => {
37
37
  const value = e.detail;
38
38
  this.selectorSourceCallback(value)
39
39
  .then(result => {
40
- /* update selected objects state*/
41
- this.suggestedObjects = updateSuggestedObjects(result);
40
+ this.selectorCategoryData = result;
42
41
  /* show suggestions*/
43
42
  this.objectsSuggestions = convertObjectDataToSuggestData(result);
44
43
  })
@@ -205,7 +204,7 @@ export class GxIdeReferences {
205
204
  // 10.RENDER() FUNCTION //
206
205
  render() {
207
206
  var _a, _b, _c, _d, _e, _f;
208
- return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper gx-ide-overflow" }, h("gx-ide-container", { displayBorderBottom: true }, h("header", { class: "header" }, h("div", { class: "header__top grid" }, h("gxg-button", { icon: "navigation/arrow-down", type: "secondary-icon-only", class: "hide-bar-button", onClick: this.hideBarButtonClickedHandler, part: "toggle-bar-button" }), h("gxg-label", { labelPosition: "start", class: "suggest-label", part: "select-object-label" }, this._componentLocale.header.selectObject), h("gxg-suggest", null, h("ch-suggest", { value: this.selectedObject.id, onInputChanged: this.selectObjectValueChangedHandler, ref: el => (this.selectObjectSuggestEl = el), part: "object-selector-suggest", exportparts: "dropdown:select-object-dropdown" }, renderSuggestLists(this.objectsSuggestions))), h("gxg-button", { type: "secondary-icon-only", icon: "gemini-tools/show-more-horizontal", onClick: this.openSelectorDialogCallbackHandler, class: "selector-dialog-button", part: "open-selector-dialog-button" })), h("div", { class: {
207
+ return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper gx-ide-overflow" }, h("gx-ide-container", { displayBorderBottom: true }, h("header", { class: "header" }, h("div", { class: "header__top grid" }, h("gxg-button", { icon: "navigation/arrow-down", type: "secondary-icon-only", class: "hide-bar-button", onClick: this.hideBarButtonClickedHandler, part: "toggle-bar-button" }), h("gxg-label", { labelPosition: "start", class: "suggest-label", part: "select-object-label" }, this._componentLocale.header.selectObject), h("gxg-suggest", null, h("ch-suggest", { value: this.selectedObject.name, onValueChanged: this.selectObjectValueChangedHandler, ref: el => (this.selectObjectSuggestEl = el), part: "object-selector-suggest", exportparts: "dropdown:select-object-dropdown" }, renderSuggestLists(this.objectsSuggestions))), h("gxg-button", { type: "secondary-icon-only", icon: "gemini-tools/show-more-horizontal", onClick: this.openSelectorDialogCallbackHandler, class: "selector-dialog-button", part: "open-selector-dialog-button" })), h("div", { class: {
209
208
  "header__bottom": true,
210
209
  "header__bottom--hidden": this.barHidden
211
210
  } }, h("div", { class: "outer-wrapper" }, h("div", { class: "inner-wrapper" }, h("div", { class: "inner-wrapper__left" }, h("gxg-icon", { type: this.selectedObject.icon, color: "auto" }), h("gxg-text", { padding: "s", type: "text-link", part: "open-object-text-link", onClick: this.openObjectCallbackHandler }, `${this.selectedObject.name} : ${this.selectedObject.description}`)), h("div", { class: "inner-wrapper__right gxi-hidden" }, h("gxg-form-checkbox", { id: "references-by-type", label: "Group references by type", required: true, "display-validation-styles": true, part: "references-type-checkbox" }))))))), h("main", { class: "main grid" }, h("gx-ide-container", { containerTitle: this._componentLocale.main.isReferencedBy, justifyContent: "center", fullHeight: true, part: "referenced-by-container" }, h("gxg-tree", { class: { "gxi-hidden": !((_a = this.referencedByTreeData) === null || _a === void 0 ? void 0 : _a.length) }, checkbox: false, onTreeItemStateChanged: this.referencesPanelStateChangedHandler(false), part: "referenced-by-tree" }, renderTreeItems(this.referencedByTreeData)), !((_b = this.referencedByTreeData) === null || _b === void 0 ? void 0 : _b.length) && (h("gxg-text", { textAlign: "center", padding: "m", type: "text-regular", maxWidth: this.referencesMessagesMaxWidth, part: "referenced-by-text" }, ((_c = this.referencedByTreeData) === null || _c === void 0 ? void 0 : _c.length) === 0
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "name": "Name",
3
3
  "title": "Partial Selection",
4
- "addObject": "Add",
5
- "removeObject": "Remove",
4
+ "btnAddObject": "Add",
5
+ "btnRemoveSelectedObjects": "Remove Selected",
6
6
  "tableHead": {
7
7
  "name": "Name",
8
8
  "type": "Type",
@@ -10,7 +10,7 @@
10
10
  "modifiedOn": "Modified On"
11
11
  },
12
12
  "footer": {
13
- "btnDeselectAll": "Deselect All",
13
+ "btnRemoveAll": "Remove All",
14
14
  "btnConfirm": "Confirm",
15
15
  "btnCancel": "Cancel"
16
16
  }