@quandis/qbo4.ui 4.0.1-CI-20240429-225952 → 4.0.1-CI-20240501-230003

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 (21) hide show
  1. package/package.json +1 -1
  2. package/src/qbo/Program.js +1 -1
  3. package/src/qbo/Program.ts +1 -1
  4. package/src/qbo/qbo-contact.js +39 -47
  5. package/src/qbo/qbo-contact.ts +39 -47
  6. package/src/qbo/qbo-form-edit.d.ts +6 -0
  7. package/src/qbo/qbo-form-edit.js +35 -5
  8. package/src/qbo/qbo-form-edit.ts +23 -5
  9. package/src/qbo/qbo-form-element.js +2 -0
  10. package/src/qbo/qbo-form-element.ts +1 -0
  11. package/src/qbo/qbo-mainmenu.js +4 -4
  12. package/src/qbo/qbo-mainmenu.ts +4 -4
  13. package/src/qbo/qbo-select.d.ts +4 -2
  14. package/src/qbo/qbo-select.js +14 -2
  15. package/src/qbo/qbo-select.ts +11 -1
  16. package/wwwroot/js/qbo4.ui-code.js +2 -2
  17. package/wwwroot/js/qbo4.ui-code.min.js +1 -1
  18. package/wwwroot/js/qbo4.ui-code.min.js.map +1 -1
  19. package/wwwroot/js/qbo4.ui.js +96 -60
  20. package/wwwroot/js/qbo4.ui.min.js +58 -66
  21. package/wwwroot/js/qbo4.ui.min.js.map +1 -1
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "author": "Quandis, Inc.",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
- "version": "4.0.1-CI-20240429-225952",
6
+ "version": "4.0.1-CI-20240501-230003",
7
7
  "workspaces": [
8
8
  "code"
9
9
  ],
package/src/qbo/Program.js CHANGED
@@ -112,7 +112,7 @@ export function elementData(element) {
112
112
  export function getApiService(url) {
113
113
  const parts = url.match(/api:\/\/([^/]+)/);
114
114
  const name = parts ? parts[1] : url;
115
- const relativePath = parts ? url.substring(`api://${name}`.length) : '';
115
+ const relativePath = parts ? url.substring(`api://${name}`.length + 1) : '';
116
116
  const service = services.container.isRegistered(name)
117
117
  ? services.container.resolve(name)
118
118
  : new RestApiService(url);
package/src/qbo/Program.ts CHANGED
@@ -120,7 +120,7 @@ export function elementData(element: HTMLElement) {
120
120
  export function getApiService(url: string) {
121
121
  const parts = url.match(/api:\/\/([^/]+)/);
122
122
  const name = parts ? parts[1] : url;
123
- const relativePath = parts ? url.substring(`api://${name}`.length) : '';
123
+ const relativePath = parts ? url.substring(`api://${name}`.length+1) : '';
124
124
  const service: IApiService = services.container.isRegistered(name)
125
125
  ? services.container.resolve<IApiService>(name)
126
126
  : new RestApiService(url);
package/src/qbo/qbo-contact.js CHANGED
@@ -36,158 +36,150 @@ let QboContact = class QboContact extends LitElement {
36
36
  async connectedCallback() {
37
37
  super.connectedCallback();
38
38
  const service = services.container.isRegistered(this.apiEndpoint) ? services.container.resolve(this.apiEndpoint) : new RestApiService(this.apiEndpoint);
39
- this.jsonData = await service.fetch('contact/summary.json', { ID: `${this.contactId}` });
39
+ this.jsonData = await service.fetch('contact/summary', { ID: `${this.contactId}` });
40
40
  }
41
41
  render() {
42
- if (this.jsonData == undefined || (this.jsonData.ContactItem == undefined && this.contactId != null))
42
+ if (this.jsonData == undefined || this.jsonData.Root == undefined || (this.jsonData.Root.ContactItem == undefined && this.contactId != null))
43
43
  return html `<p>Loading...</p>`;
44
44
  return html `<slot>
45
45
  <div class="${this.colSixClass}">
46
46
  <label for="${this.contactName}" class="${this.formLabelSmallClass}">${this.contactLabel}</label>
47
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="${this.contactName}" value="${this.jsonData?.ContactItem?.Contact}"/>
47
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="${this.contactName}" value="${this.jsonData?.Root?.ContactItem?.Contact}"/>
48
48
  </div>
49
49
  <div class="${this.colSixClass}">
50
50
  <label for="ContactTemplateID" class="${this.formLabelSmallClass}">Template</label>
51
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="ContactTemplateID" apiEndpoint="/ui/contacttemplate/listwhere.json?appliesto=${this.jsonData?.ContactItem?.Object}" defaultValue="${this.jsonData?.ContactItem?.ContactTemplateID}"></qbo-select>
51
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="ContactTemplateID" apiEndpoint="api://qbo/contacttemplate/listwhere?appliesto=${this.jsonData?.Root?.ContactItem?.Object}" defaultValue="${this.jsonData?.Root?.ContactItem?.ContactTemplateID}"></qbo-select>
52
52
  </div>
53
53
  <div class="${this.colSixClass}">
54
54
  <label for="Status" class="${this.formLabelSmallClass}">Status</label>
55
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="Status" apiEndpoint="/ui/objectstatus/customlist.json?object=Contact&objectid=${this.jsonData?.ContactItem?.ContactTemplateID}" optionValue="ObjectStatus" defaultValue="${this.jsonData?.ContactItem?.Status}"></qbo-select>
55
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="Status" apiEndpoint="api://qbo/objectstatus/customlist?object=Contact&objectid=${this.jsonData?.Root?.ContactItem?.ContactTemplateID}" optionValue="ObjectStatus" defaultValue="${this.jsonData?.Root?.ContactItem?.Status}"></qbo-select>
56
56
  </div>
57
57
  <div class="${this.colSixClass}">
58
58
  <label for="ContactType" class="${this.formLabelSmallClass}">Type</label>
59
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="ContactType" apiEndpoint="/ui/objecttype/customlist.json?object=Contact&objectid=${this.jsonData?.ContactItem?.ContactTemplateID}" optionValue="ObjectType" defaultValue="${this.jsonData?.ContactItem?.ContactType}"></qbo-select>
60
- </div>
61
- <div class="${this.colFourClass}">
62
- <label for="Phone" class="${this.formLabelSmallClass}">Phone</label>
63
- <input type="tel" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Phone" value="${this.jsonData?.ContactItem?.Phone}"/>
64
- </div>
65
- <div class="${this.colFourClass}">
66
- <label for="Email" class="${this.formLabelSmallClass}">Email</label>
67
- <input type="email" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Email" value="${this.jsonData?.ContactItem?.Email}"/>
68
- </div>
69
- <div class="${this.colFourClass}">
70
- <label for="Title" class="${this.formLabelSmallClass}">Title</label>
71
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Title" value="${this.jsonData?.ContactItem?.Title}"/>
59
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="ContactType" apiEndpoint="api://qbo/objecttype/customlist?object=Contact&objectid=${this.jsonData?.Root?.ContactItem?.ContactTemplateID}" optionValue="ObjectType" defaultValue="${this.jsonData?.Root?.ContactItem?.ContactType}"></qbo-select>
72
60
  </div>
73
61
  <div class="${this.divSectionHeaderClass}">
74
62
  <h5>Location</h5>
75
63
  </div>
76
- <div class="${this.colTwelveClass}">
64
+ <div class="${this.colSixClass}">
77
65
  <label for="Company" class="${this.formLabelSmallClass}">Company</label>
78
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Company" value="${this.jsonData?.ContactItem?.Company}"/>
66
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Company" value="${this.jsonData?.Root?.ContactItem?.Company}"/>
67
+ </div>
68
+ <div class="${this.colSixClass}">
69
+ <label for="Title" class="${this.formLabelSmallClass}">Title</label>
70
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Title" value="${this.jsonData?.Root?.ContactItem?.Title}"/>
79
71
  </div>
80
72
  <div class="${this.colTwelveClass}">
81
73
  <label for="Address" class="${this.formLabelSmallClass}">Address</label>
82
- <textarea ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Address">${this.jsonData?.ContactItem?.Address}</textarea>
74
+ <textarea ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Address">${this.jsonData?.Root?.ContactItem?.Address}</textarea>
83
75
  </div>
84
76
  <div class="${this.colSixClass}">
85
77
  <label for="City" class="${this.formLabelSmallClass}">City</label>
86
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="City" value="${this.jsonData?.ContactItem?.City}"/>
78
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="City" value="${this.jsonData?.Root?.ContactItem?.City}"/>
87
79
  </div>
88
80
  <div class="${this.colThreeClass}">
89
81
  <label for="State" class="${this.formLabelSmallClass}">State</label>
90
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="State" apiEndpoint="/ui/state/list" optionValue="State" defaultValue="${this.jsonData?.ContactItem?.State}"></qbo-select>
82
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="State" apiEndpoint="api://qbo/state/list" optionValue="State" defaultValue="${this.jsonData?.Root?.ContactItem?.State}"></qbo-select>
91
83
  </div>
92
84
  <div class="${this.colThreeClass}">
93
85
  <label for="PostalCode" class="${this.formLabelSmallClass}">Postal Code</label>
94
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="PostalCode" pattern="\d{5}-?(\d{4})?" value="${this.jsonData?.ContactItem?.PostalCode}"/>
86
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="PostalCode" pattern="\d{5}-?(\d{4})?" value="${this.jsonData?.Root?.ContactItem?.PostalCode}"/>
95
87
  </div>
96
88
  <div class="${this.colSixClass}">
97
89
  <label for="Country" class="${this.formLabelSmallClass}">Country</label>
98
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Country" value="${this.jsonData?.ContactItem?.Country}"/>
90
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Country" value="${this.jsonData?.Root?.ContactItem?.Country}"/>
99
91
  </div>
100
92
  <div class="${this.colThreeClass}">
101
93
  <label for="Latitude" class="${this.formLabelSmallClass}">Latitude</label>
102
- <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Latitude" value="${this.jsonData?.ContactItem?.Latitude}"/>
94
+ <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Latitude" value="${this.jsonData?.Root?.ContactItem?.Latitude}"/>
103
95
  </div>
104
96
  <div class="${this.colThreeClass}">
105
97
  <label for="Longitude" class="${this.formLabelSmallClass}">Longitude</label>
106
- <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Longitude" value="${this.jsonData?.ContactItem?.Longitude}"/>
98
+ <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Longitude" value="${this.jsonData?.Root?.ContactItem?.Longitude}"/>
107
99
  </div>
108
100
  <div class="${this.divSectionHeaderClass}">
109
101
  <h5>Identity</h5>
110
102
  </div>
111
103
  <div class="${this.colThreeClass}">
112
104
  <label for="USSSN" class="${this.formLabelSmallClass}">SSN</label>
113
- <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="USSSN" value="${this.jsonData?.ContactItem?.USSSN}"/>
105
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="USSSN" value="${this.jsonData?.Root?.ContactItem?.USSSN}"/>
114
106
  </div>
115
107
  <div class="${this.colThreeClass}">
116
108
  <label for="TIN" class="${this.formLabelSmallClass}">TIN</label>
117
- <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="TIN" value="${this.jsonData?.ContactItem?.TIN}"/>
109
+ <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="TIN" value="${this.jsonData?.Root?.ContactItem?.TIN}"/>
118
110
  </div>
119
111
  <div class="${this.colThreeClass}">
120
112
  <label for="Nationality" class="${this.formLabelSmallClass}">Nationality</label>
121
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="Nationality" apiEndpoint="/ui/objecttype/list.json?object=Contact.Nationality" optionValue="ObjectType" defaultValue="${this.jsonData?.ContactItem?.Nationality}"></qbo-select>
113
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="Nationality" apiEndpoint="api://qbo/objecttype/list?object=Contact.Nationality" optionValue="ObjectType" defaultValue="${this.jsonData?.Root?.ContactItem?.Nationality}"></qbo-select>
122
114
  </div>
123
115
  <div class="${this.colThreeClass}">
124
116
  <label for="SpokenLanguage" class="${this.formLabelSmallClass}">Spoken Language</label>
125
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="SpokenLanguage" apiEndpoint="/ui/objecttype/list.json?object=Contact.SpokenLanguage" optionValue="ObjectType" defaultValue="${this.jsonData?.ContactItem?.SpokenLanguage}"></qbo-select>
117
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="SpokenLanguage" apiEndpoint="api://qbo/objecttype/list?object=Contact.SpokenLanguage" optionValue="ObjectType" defaultValue="${this.jsonData?.Root?.ContactItem?.SpokenLanguage}"></qbo-select>
126
118
  </div>
127
119
  <div class="${this.colThreeClass}">
128
120
  <label for="BirthDate" class="${this.formLabelSmallClass}">Birth Date</label>
129
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="BirthDate" value="${this.jsonData?.ContactItem?.BirthDate}"/>
121
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="BirthDate" value="${!this.jsonData.Root.ContactItem.BirthDate ? '' : new Date(this.jsonData.Root.ContactItem.BirthDate).toISOString().slice(0, 10)}"/>
130
122
  </div>
131
123
  <div class="${this.colThreeClass}">
132
124
  <label for="DeathDate" class="${this.formLabelSmallClass}">Death Date</label>
133
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="DeathDate" value="${this.jsonData?.ContactItem?.DeathDate}"/>
125
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="DeathDate" value="${!this.jsonData.Root.ContactItem.DeathDate ? '' : new Date(this.jsonData.Root.ContactItem.DeathDate).toISOString().slice(0, 10)}"/>
134
126
  </div>
135
127
  <div class="${this.colThreeClass}">
136
128
  <label for="ValidStart" class="${this.formLabelSmallClass}">Valid Start</label>
137
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="ValidStart" value="${this.jsonData?.ContactItem?.ValidStart}"/>
129
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="ValidStart" value="${!this.jsonData.Root.ContactItem.ValidStart ? '' : new Date(this.jsonData.Root.ContactItem.ValidStart).toISOString().slice(0, 10)}"/>
138
130
  </div>
139
131
  <div class="${this.colThreeClass}">
140
132
  <label for="ValidEnd" class="${this.formLabelSmallClass}">Valid End</label>
141
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="ValidEnd" value="${this.jsonData?.ContactItem?.ValidEnd}"/>
133
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="ValidEnd" value="${!this.jsonData.Root.ContactItem.ValidEnd ? '' : new Date(this.jsonData.Root.ContactItem.ValidEnd).toISOString().slice(0, 10)}"/>
142
134
  </div>
143
135
  <div class="${this.colSixClass}">
144
136
  <label for="VerifiedSource" class="${this.formLabelSmallClass}">Verified Source</label>
145
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="VerifiedSource" value="${this.jsonData?.ContactItem?.VerifiedSource}"/>
137
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="VerifiedSource" value="${this.jsonData?.Root?.ContactItem?.VerifiedSource}"/>
146
138
  </div>
147
139
  <div class="${this.colThreeClass}">
148
140
  <label for="VerifiedDate" class="${this.formLabelSmallClass}">Verified Date</label>
149
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="VerifiedDate" value="${this.jsonData?.ContactItem?.VerifiedDate}"/>
141
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="VerifiedDate" value="${!this.jsonData.Root.ContactItem.VerifiedDate ? '' : new Date(this.jsonData.Root.ContactItem.VerifiedDate).toISOString().slice(0, 10)}"/>
150
142
  </div>
151
143
  <div class="${this.colThreeClass}">
152
144
  <label for="VerifiedConfidence" class="${this.formLabelSmallClass}">Verified Confidence</label>
153
- <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="VerifiedConfidence" value="${this.jsonData?.ContactItem?.VerifiedConfidence}"/>
145
+ <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="VerifiedConfidence" value="${this.jsonData?.Root?.ContactItem?.VerifiedConfidence}"/>
154
146
  </div>
155
147
  <div class="${this.divSectionHeaderClass}">
156
148
  <h5>SCRA</h5>
157
149
  </div>
158
150
  <div class="${this.colThreeClass}">
159
151
  <label for="SCRAStatus" class="${this.formLabelSmallClass}">SCRA Status</label>
160
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="SCRAStatus" apiEndpoint="/ui/objecttype/list.json?object=Contact.SCRAStatus" optionValue="ObjectType" defaultValue="${this.jsonData?.ContactItem?.SCRAStatus}"></qbo-select>
152
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="SCRAStatus" apiEndpoint="api://qbo/objecttype/list?object=Contact.SCRAStatus" optionValue="ObjectType" defaultValue="${this.jsonData?.Root?.ContactItem?.SCRAStatus}"></qbo-select>
161
153
  </div>
162
154
  <div class="${this.colThreeClass}">
163
155
  <label for="SCRAStatusAsOf" class="${this.formLabelSmallClass}">SCRA Status As Of</label>
164
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAStatusAsOf" value="${this.jsonData?.ContactItem?.SCRAStatusAsOf}"/>
156
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAStatusAsOf" value="${!this.jsonData.Root.ContactItem.SCRAStatusAsOf ? '' : new Date(this.jsonData.Root.ContactItem.SCRAStatusAsOf).toISOString().slice(0, 10)}"/>
165
157
  </div>
166
158
  <div class="${this.colThreeClass}">
167
159
  <label for="SCRAStartDate" class="${this.formLabelSmallClass}">SCRA Start Date</label>
168
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAStartDate" value="${this.jsonData?.ContactItem?.SCRAStartDate}"/>
160
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAStartDate" value="${!this.jsonData.Root.ContactItem.SCRAStartDate ? '' : new Date(this.jsonData.Root.ContactItem.SCRAStartDate).toISOString().slice(0, 10)}"/>
169
161
  </div>
170
162
  <div class="${this.colThreeClass}">
171
163
  <label for="SCRADischargeDate" class="${this.formLabelSmallClass}">SCRA Discharge Date</label>
172
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRADischargeDate" value="${this.jsonData?.ContactItem?.SCRADischargeDate}"/>
164
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRADischargeDate" value="${!this.jsonData.Root.ContactItem.SCRADischargeDate ? '' : new Date(this.jsonData.Root.ContactItem.SCRADischargeDate).toISOString().slice(0, 10)}"/>
173
165
  </div>
174
166
  <div class="${this.colThreeClass}">
175
167
  <label for="SCRAVerified" class="${this.formLabelSmallClass}">SCRA Verified</label>
176
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAVerified" value="${this.jsonData?.ContactItem?.SCRAVerified}"/>
168
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAVerified" value="${this.jsonData?.Root?.ContactItem?.SCRAVerified}"/>
177
169
  </div>
178
170
  <div class="${this.colThreeClass}">
179
171
  <label for="SCRAVerifiedDate" class="${this.formLabelSmallClass}">SCRA Verified Date</label>
180
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAVerifiedDate" value="${this.jsonData?.ContactItem?.SCRAVerifiedDate}"/>
172
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAVerifiedDate" value="${!this.jsonData.Root.ContactItem.SCRAVerifiedDate ? '' : new Date(this.jsonData.Root.ContactItem.SCRAVerifiedDate).toISOString().slice(0, 10)}"/>
181
173
  </div>
182
174
  <div class="${this.colThreeClass}">
183
175
  <label for="SCRASource" class="${this.formLabelSmallClass}">SCRA Source</label>
184
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRASource" value="${this.jsonData?.ContactItem?.SCRASource}"/>
176
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRASource" value="${this.jsonData?.Root?.ContactItem?.SCRASource}"/>
185
177
  </div>
186
178
  <div class="${this.colThreeClass}">
187
179
  <label for="SCRAID" class="${this.formLabelSmallClass}">SCRA ID</label>
188
- <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAID" value="${this.jsonData?.ContactItem?.SCRAID}"/>
180
+ <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAID" value="${this.jsonData?.Root?.ContactItem?.SCRAID}"/>
189
181
  </div>
190
- <qbo-form-edit createdDate="${this.jsonData?.ContactItem?.CreatedDate}" createdPerson="${this.jsonData?.ContactItem?.CreatedPerson}" updatedDate="${this.jsonData?.ContactItem?.UpdatedDate}" updatedPerson="${this.jsonData?.ContactItem?.UpdatedPerson}"></qbo-select>
182
+ <qbo-form-edit createdDate="${!this.jsonData.Root.ContactItem.CreatedDate ? '' : new Date(this.jsonData.Root.ContactItem.CreatedDate).toLocaleString()}" createdPerson="${this.jsonData?.Root?.ContactItem?.CreatedPerson}" updatedDate="${!this.jsonData.Root.ContactItem.UpdatedDate ? '' : new Date(this.jsonData.Root.ContactItem.UpdatedDate).toLocaleString()}" updatedPerson="${this.jsonData?.Root?.ContactItem?.UpdatedPerson}"></qbo-select>
191
183
  </slot>`;
192
184
  }
193
185
  };
package/src/qbo/qbo-contact.ts CHANGED
@@ -60,159 +60,151 @@ export class QboContact extends LitElement {
60
60
  super.connectedCallback();
61
61
 
62
62
  const service: IApiService = services.container.isRegistered(this.apiEndpoint) ? services.container.resolve<IApiService>(this.apiEndpoint) : new RestApiService(this.apiEndpoint);
63
- this.jsonData = await service.fetch('contact/summary.json', { ID: `${this.contactId}` });
63
+ this.jsonData = await service.fetch('contact/summary', { ID: `${this.contactId}` });
64
64
  }
65
65
 
66
66
  render() {
67
- if (this.jsonData == undefined || (this.jsonData.ContactItem == undefined && this.contactId != null)) return html`<p>Loading...</p>`;
67
+ if (this.jsonData == undefined || this.jsonData.Root == undefined || (this.jsonData.Root.ContactItem == undefined && this.contactId != null)) return html`<p>Loading...</p>`;
68
68
 
69
69
  return html`<slot>
70
70
  <div class="${this.colSixClass}">
71
71
  <label for="${this.contactName}" class="${this.formLabelSmallClass}">${this.contactLabel}</label>
72
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="${this.contactName}" value="${this.jsonData?.ContactItem?.Contact}"/>
72
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="${this.contactName}" value="${this.jsonData?.Root?.ContactItem?.Contact}"/>
73
73
  </div>
74
74
  <div class="${this.colSixClass}">
75
75
  <label for="ContactTemplateID" class="${this.formLabelSmallClass}">Template</label>
76
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="ContactTemplateID" apiEndpoint="/ui/contacttemplate/listwhere.json?appliesto=${this.jsonData?.ContactItem?.Object}" defaultValue="${this.jsonData?.ContactItem?.ContactTemplateID}"></qbo-select>
76
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="ContactTemplateID" apiEndpoint="api://qbo/contacttemplate/listwhere?appliesto=${this.jsonData?.Root?.ContactItem?.Object}" defaultValue="${this.jsonData?.Root?.ContactItem?.ContactTemplateID}"></qbo-select>
77
77
  </div>
78
78
  <div class="${this.colSixClass}">
79
79
  <label for="Status" class="${this.formLabelSmallClass}">Status</label>
80
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="Status" apiEndpoint="/ui/objectstatus/customlist.json?object=Contact&objectid=${this.jsonData?.ContactItem?.ContactTemplateID}" optionValue="ObjectStatus" defaultValue="${this.jsonData?.ContactItem?.Status}"></qbo-select>
80
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="Status" apiEndpoint="api://qbo/objectstatus/customlist?object=Contact&objectid=${this.jsonData?.Root?.ContactItem?.ContactTemplateID}" optionValue="ObjectStatus" defaultValue="${this.jsonData?.Root?.ContactItem?.Status}"></qbo-select>
81
81
  </div>
82
82
  <div class="${this.colSixClass}">
83
83
  <label for="ContactType" class="${this.formLabelSmallClass}">Type</label>
84
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="ContactType" apiEndpoint="/ui/objecttype/customlist.json?object=Contact&objectid=${this.jsonData?.ContactItem?.ContactTemplateID}" optionValue="ObjectType" defaultValue="${this.jsonData?.ContactItem?.ContactType}"></qbo-select>
85
- </div>
86
- <div class="${this.colFourClass}">
87
- <label for="Phone" class="${this.formLabelSmallClass}">Phone</label>
88
- <input type="tel" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Phone" value="${this.jsonData?.ContactItem?.Phone}"/>
89
- </div>
90
- <div class="${this.colFourClass}">
91
- <label for="Email" class="${this.formLabelSmallClass}">Email</label>
92
- <input type="email" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Email" value="${this.jsonData?.ContactItem?.Email}"/>
93
- </div>
94
- <div class="${this.colFourClass}">
95
- <label for="Title" class="${this.formLabelSmallClass}">Title</label>
96
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Title" value="${this.jsonData?.ContactItem?.Title}"/>
84
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="ContactType" apiEndpoint="api://qbo/objecttype/customlist?object=Contact&objectid=${this.jsonData?.Root?.ContactItem?.ContactTemplateID}" optionValue="ObjectType" defaultValue="${this.jsonData?.Root?.ContactItem?.ContactType}"></qbo-select>
97
85
  </div>
98
86
  <div class="${this.divSectionHeaderClass}">
99
87
  <h5>Location</h5>
100
88
  </div>
101
- <div class="${this.colTwelveClass}">
89
+ <div class="${this.colSixClass}">
102
90
  <label for="Company" class="${this.formLabelSmallClass}">Company</label>
103
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Company" value="${this.jsonData?.ContactItem?.Company}"/>
91
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Company" value="${this.jsonData?.Root?.ContactItem?.Company}"/>
92
+ </div>
93
+ <div class="${this.colSixClass}">
94
+ <label for="Title" class="${this.formLabelSmallClass}">Title</label>
95
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Title" value="${this.jsonData?.Root?.ContactItem?.Title}"/>
104
96
  </div>
105
97
  <div class="${this.colTwelveClass}">
106
98
  <label for="Address" class="${this.formLabelSmallClass}">Address</label>
107
- <textarea ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Address">${this.jsonData?.ContactItem?.Address}</textarea>
99
+ <textarea ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Address">${this.jsonData?.Root?.ContactItem?.Address}</textarea>
108
100
  </div>
109
101
  <div class="${this.colSixClass}">
110
102
  <label for="City" class="${this.formLabelSmallClass}">City</label>
111
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="City" value="${this.jsonData?.ContactItem?.City}"/>
103
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="City" value="${this.jsonData?.Root?.ContactItem?.City}"/>
112
104
  </div>
113
105
  <div class="${this.colThreeClass}">
114
106
  <label for="State" class="${this.formLabelSmallClass}">State</label>
115
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="State" apiEndpoint="/ui/state/list" optionValue="State" defaultValue="${this.jsonData?.ContactItem?.State}"></qbo-select>
107
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="State" apiEndpoint="api://qbo/state/list" optionValue="State" defaultValue="${this.jsonData?.Root?.ContactItem?.State}"></qbo-select>
116
108
  </div>
117
109
  <div class="${this.colThreeClass}">
118
110
  <label for="PostalCode" class="${this.formLabelSmallClass}">Postal Code</label>
119
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="PostalCode" pattern="\d{5}-?(\d{4})?" value="${this.jsonData?.ContactItem?.PostalCode}"/>
111
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="PostalCode" pattern="\d{5}-?(\d{4})?" value="${this.jsonData?.Root?.ContactItem?.PostalCode}"/>
120
112
  </div>
121
113
  <div class="${this.colSixClass}">
122
114
  <label for="Country" class="${this.formLabelSmallClass}">Country</label>
123
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Country" value="${this.jsonData?.ContactItem?.Country}"/>
115
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Country" value="${this.jsonData?.Root?.ContactItem?.Country}"/>
124
116
  </div>
125
117
  <div class="${this.colThreeClass}">
126
118
  <label for="Latitude" class="${this.formLabelSmallClass}">Latitude</label>
127
- <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Latitude" value="${this.jsonData?.ContactItem?.Latitude}"/>
119
+ <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Latitude" value="${this.jsonData?.Root?.ContactItem?.Latitude}"/>
128
120
  </div>
129
121
  <div class="${this.colThreeClass}">
130
122
  <label for="Longitude" class="${this.formLabelSmallClass}">Longitude</label>
131
- <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Longitude" value="${this.jsonData?.ContactItem?.Longitude}"/>
123
+ <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="Longitude" value="${this.jsonData?.Root?.ContactItem?.Longitude}"/>
132
124
  </div>
133
125
  <div class="${this.divSectionHeaderClass}">
134
126
  <h5>Identity</h5>
135
127
  </div>
136
128
  <div class="${this.colThreeClass}">
137
129
  <label for="USSSN" class="${this.formLabelSmallClass}">SSN</label>
138
- <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="USSSN" value="${this.jsonData?.ContactItem?.USSSN}"/>
130
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="USSSN" value="${this.jsonData?.Root?.ContactItem?.USSSN}"/>
139
131
  </div>
140
132
  <div class="${this.colThreeClass}">
141
133
  <label for="TIN" class="${this.formLabelSmallClass}">TIN</label>
142
- <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="TIN" value="${this.jsonData?.ContactItem?.TIN}"/>
134
+ <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="TIN" value="${this.jsonData?.Root?.ContactItem?.TIN}"/>
143
135
  </div>
144
136
  <div class="${this.colThreeClass}">
145
137
  <label for="Nationality" class="${this.formLabelSmallClass}">Nationality</label>
146
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="Nationality" apiEndpoint="/ui/objecttype/list.json?object=Contact.Nationality" optionValue="ObjectType" defaultValue="${this.jsonData?.ContactItem?.Nationality}"></qbo-select>
138
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="Nationality" apiEndpoint="api://qbo/objecttype/list?object=Contact.Nationality" optionValue="ObjectType" defaultValue="${this.jsonData?.Root?.ContactItem?.Nationality}"></qbo-select>
147
139
  </div>
148
140
  <div class="${this.colThreeClass}">
149
141
  <label for="SpokenLanguage" class="${this.formLabelSmallClass}">Spoken Language</label>
150
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="SpokenLanguage" apiEndpoint="/ui/objecttype/list.json?object=Contact.SpokenLanguage" optionValue="ObjectType" defaultValue="${this.jsonData?.ContactItem?.SpokenLanguage}"></qbo-select>
142
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="SpokenLanguage" apiEndpoint="api://qbo/objecttype/list?object=Contact.SpokenLanguage" optionValue="ObjectType" defaultValue="${this.jsonData?.Root?.ContactItem?.SpokenLanguage}"></qbo-select>
151
143
  </div>
152
144
  <div class="${this.colThreeClass}">
153
145
  <label for="BirthDate" class="${this.formLabelSmallClass}">Birth Date</label>
154
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="BirthDate" value="${this.jsonData?.ContactItem?.BirthDate}"/>
146
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="BirthDate" value="${!this.jsonData.Root.ContactItem.BirthDate ? '' : new Date(this.jsonData.Root.ContactItem.BirthDate).toISOString().slice(0,10)}"/>
155
147
  </div>
156
148
  <div class="${this.colThreeClass}">
157
149
  <label for="DeathDate" class="${this.formLabelSmallClass}">Death Date</label>
158
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="DeathDate" value="${this.jsonData?.ContactItem?.DeathDate}"/>
150
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="DeathDate" value="${!this.jsonData.Root.ContactItem.DeathDate ? '' : new Date(this.jsonData.Root.ContactItem.DeathDate).toISOString().slice(0, 10)}"/>
159
151
  </div>
160
152
  <div class="${this.colThreeClass}">
161
153
  <label for="ValidStart" class="${this.formLabelSmallClass}">Valid Start</label>
162
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="ValidStart" value="${this.jsonData?.ContactItem?.ValidStart}"/>
154
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="ValidStart" value="${!this.jsonData.Root.ContactItem.ValidStart ? '' : new Date(this.jsonData.Root.ContactItem.ValidStart).toISOString().slice(0, 10)}"/>
163
155
  </div>
164
156
  <div class="${this.colThreeClass}">
165
157
  <label for="ValidEnd" class="${this.formLabelSmallClass}">Valid End</label>
166
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="ValidEnd" value="${this.jsonData?.ContactItem?.ValidEnd}"/>
158
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="ValidEnd" value="${!this.jsonData.Root.ContactItem.ValidEnd ? '' : new Date(this.jsonData.Root.ContactItem.ValidEnd).toISOString().slice(0, 10)}"/>
167
159
  </div>
168
160
  <div class="${this.colSixClass}">
169
161
  <label for="VerifiedSource" class="${this.formLabelSmallClass}">Verified Source</label>
170
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="VerifiedSource" value="${this.jsonData?.ContactItem?.VerifiedSource}"/>
162
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="VerifiedSource" value="${this.jsonData?.Root?.ContactItem?.VerifiedSource}"/>
171
163
  </div>
172
164
  <div class="${this.colThreeClass}">
173
165
  <label for="VerifiedDate" class="${this.formLabelSmallClass}">Verified Date</label>
174
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="VerifiedDate" value="${this.jsonData?.ContactItem?.VerifiedDate}"/>
166
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="VerifiedDate" value="${!this.jsonData.Root.ContactItem.VerifiedDate ? '' : new Date(this.jsonData.Root.ContactItem.VerifiedDate).toISOString().slice(0, 10)}"/>
175
167
  </div>
176
168
  <div class="${this.colThreeClass}">
177
169
  <label for="VerifiedConfidence" class="${this.formLabelSmallClass}">Verified Confidence</label>
178
- <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="VerifiedConfidence" value="${this.jsonData?.ContactItem?.VerifiedConfidence}"/>
170
+ <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="VerifiedConfidence" value="${this.jsonData?.Root?.ContactItem?.VerifiedConfidence}"/>
179
171
  </div>
180
172
  <div class="${this.divSectionHeaderClass}">
181
173
  <h5>SCRA</h5>
182
174
  </div>
183
175
  <div class="${this.colThreeClass}">
184
176
  <label for="SCRAStatus" class="${this.formLabelSmallClass}">SCRA Status</label>
185
- <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="SCRAStatus" apiEndpoint="/ui/objecttype/list.json?object=Contact.SCRAStatus" optionValue="ObjectType" defaultValue="${this.jsonData?.ContactItem?.SCRAStatus}"></qbo-select>
177
+ <qbo-select ?disabled=${this.disabled} class="${this.formSelectSmallClass}" name="SCRAStatus" apiEndpoint="api://qbo/objecttype/list?object=Contact.SCRAStatus" optionValue="ObjectType" defaultValue="${this.jsonData?.Root?.ContactItem?.SCRAStatus}"></qbo-select>
186
178
  </div>
187
179
  <div class="${this.colThreeClass}">
188
180
  <label for="SCRAStatusAsOf" class="${this.formLabelSmallClass}">SCRA Status As Of</label>
189
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAStatusAsOf" value="${this.jsonData?.ContactItem?.SCRAStatusAsOf}"/>
181
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAStatusAsOf" value="${!this.jsonData.Root.ContactItem.SCRAStatusAsOf ? '' : new Date(this.jsonData.Root.ContactItem.SCRAStatusAsOf).toISOString().slice(0, 10)}"/>
190
182
  </div>
191
183
  <div class="${this.colThreeClass}">
192
184
  <label for="SCRAStartDate" class="${this.formLabelSmallClass}">SCRA Start Date</label>
193
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAStartDate" value="${this.jsonData?.ContactItem?.SCRAStartDate}"/>
185
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAStartDate" value="${!this.jsonData.Root.ContactItem.SCRAStartDate ? '' : new Date(this.jsonData.Root.ContactItem.SCRAStartDate).toISOString().slice(0, 10)}"/>
194
186
  </div>
195
187
  <div class="${this.colThreeClass}">
196
188
  <label for="SCRADischargeDate" class="${this.formLabelSmallClass}">SCRA Discharge Date</label>
197
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRADischargeDate" value="${this.jsonData?.ContactItem?.SCRADischargeDate}"/>
189
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRADischargeDate" value="${!this.jsonData.Root.ContactItem.SCRADischargeDate ? '' : new Date(this.jsonData.Root.ContactItem.SCRADischargeDate).toISOString().slice(0, 10)}"/>
198
190
  </div>
199
191
  <div class="${this.colThreeClass}">
200
192
  <label for="SCRAVerified" class="${this.formLabelSmallClass}">SCRA Verified</label>
201
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAVerified" value="${this.jsonData?.ContactItem?.SCRAVerified}"/>
193
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAVerified" value="${this.jsonData?.Root?.ContactItem?.SCRAVerified}"/>
202
194
  </div>
203
195
  <div class="${this.colThreeClass}">
204
196
  <label for="SCRAVerifiedDate" class="${this.formLabelSmallClass}">SCRA Verified Date</label>
205
- <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAVerifiedDate" value="${this.jsonData?.ContactItem?.SCRAVerifiedDate}"/>
197
+ <input type="date" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAVerifiedDate" value="${!this.jsonData.Root.ContactItem.SCRAVerifiedDate ? '' : new Date(this.jsonData.Root.ContactItem.SCRAVerifiedDate).toISOString().slice(0, 10)}"/>
206
198
  </div>
207
199
  <div class="${this.colThreeClass}">
208
200
  <label for="SCRASource" class="${this.formLabelSmallClass}">SCRA Source</label>
209
- <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRASource" value="${this.jsonData?.ContactItem?.SCRASource}"/>
201
+ <input type="text" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRASource" value="${this.jsonData?.Root?.ContactItem?.SCRASource}"/>
210
202
  </div>
211
203
  <div class="${this.colThreeClass}">
212
204
  <label for="SCRAID" class="${this.formLabelSmallClass}">SCRA ID</label>
213
- <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAID" value="${this.jsonData?.ContactItem?.SCRAID}"/>
205
+ <input type="number" ?disabled=${this.disabled} class="${this.formControlSmallClass}" name="SCRAID" value="${this.jsonData?.Root?.ContactItem?.SCRAID}"/>
214
206
  </div>
215
- <qbo-form-edit createdDate="${this.jsonData?.ContactItem?.CreatedDate}" createdPerson="${this.jsonData?.ContactItem?.CreatedPerson}" updatedDate="${this.jsonData?.ContactItem?.UpdatedDate}" updatedPerson="${this.jsonData?.ContactItem?.UpdatedPerson}"></qbo-select>
207
+ <qbo-form-edit createdDate="${!this.jsonData.Root.ContactItem.CreatedDate ? '' : new Date(this.jsonData.Root.ContactItem.CreatedDate).toLocaleString()}" createdPerson="${this.jsonData?.Root?.ContactItem?.CreatedPerson}" updatedDate="${!this.jsonData.Root.ContactItem.UpdatedDate ? '' : new Date(this.jsonData.Root.ContactItem.UpdatedDate).toLocaleString()}" updatedPerson="${this.jsonData?.Root?.ContactItem?.UpdatedPerson}"></qbo-select>
216
208
  </slot>`;
217
209
  }
218
210
  }
package/src/qbo/qbo-form-edit.d.ts CHANGED
@@ -1,7 +1,13 @@
1
1
  import { LitElement } from 'lit';
2
2
  export declare class QboFormEdit extends LitElement {
3
+ buttonPrimaryClass: String | null;
3
4
  createdDate: null;
4
5
  createdPerson: null;
6
+ divButtonGroupClass: String | null;
7
+ divFormActionClass: String | null;
8
+ divSectionHeaderClass: String | null;
9
+ editLabel: String | null;
10
+ spanEditClass: String | null;
5
11
  updatedDate: null;
6
12
  updatedPerson: null;
7
13
  renderInHost: boolean;
package/src/qbo/qbo-form-edit.js CHANGED
@@ -12,8 +12,14 @@ import { customElement, property } from 'lit/decorators.js';
12
12
  let QboFormEdit = class QboFormEdit extends LitElement {
13
13
  constructor() {
14
14
  super(...arguments);
15
+ this.buttonPrimaryClass = 'qbo-primary';
15
16
  this.createdDate = null;
16
17
  this.createdPerson = null;
18
+ this.divButtonGroupClass = 'qbo-btn-group';
19
+ this.divFormActionClass = 'qbo-form-actions';
20
+ this.divSectionHeaderClass = 'qbo-header';
21
+ this.editLabel = 'Edit';
22
+ this.spanEditClass = 'qbo-icon-edit';
17
23
  this.updatedDate = null;
18
24
  this.updatedPerson = null;
19
25
  this.renderInHost = true;
@@ -23,13 +29,13 @@ let QboFormEdit = class QboFormEdit extends LitElement {
23
29
  }
24
30
  render() {
25
31
  return html `<slot>
26
- <div class="col-md-12 mt-3">
32
+ <div class="${this.divSectionHeaderClass}">
27
33
  <hr />
28
34
  </div>
29
- <div class="col-md-12 mt-2">
30
- <div class="btn-group">
31
- <button type="button" class="btn btn-primary">
32
- <span class="bi-pencil-square"> Edit</span>
35
+ <div class="${this.divFormActionClass}">
36
+ <div class="${this.divButtonGroupClass}">
37
+ <button type="button" class="${this.buttonPrimaryClass}">
38
+ <span class="${this.spanEditClass}"> ${this.editLabel}</span>
33
39
  </button>
34
40
  <button type="button" class="btn btn-primary dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown"></button>
35
41
  <ul class="dropdown-menu">
@@ -56,6 +62,10 @@ let QboFormEdit = class QboFormEdit extends LitElement {
56
62
  </slot>`;
57
63
  }
58
64
  };
65
+ __decorate([
66
+ property({ type: String }),
67
+ __metadata("design:type", Object)
68
+ ], QboFormEdit.prototype, "buttonPrimaryClass", void 0);
59
69
  __decorate([
60
70
  property({ type: Date }),
61
71
  __metadata("design:type", Object)
@@ -64,6 +74,26 @@ __decorate([
64
74
  property({ type: String }),
65
75
  __metadata("design:type", Object)
66
76
  ], QboFormEdit.prototype, "createdPerson", void 0);
77
+ __decorate([
78
+ property({ type: String }),
79
+ __metadata("design:type", Object)
80
+ ], QboFormEdit.prototype, "divButtonGroupClass", void 0);
81
+ __decorate([
82
+ property({ type: String }),
83
+ __metadata("design:type", Object)
84
+ ], QboFormEdit.prototype, "divFormActionClass", void 0);
85
+ __decorate([
86
+ property({ type: String }),
87
+ __metadata("design:type", Object)
88
+ ], QboFormEdit.prototype, "divSectionHeaderClass", void 0);
89
+ __decorate([
90
+ property({ type: String }),
91
+ __metadata("design:type", Object)
92
+ ], QboFormEdit.prototype, "editLabel", void 0);
93
+ __decorate([
94
+ property({ type: String }),
95
+ __metadata("design:type", Object)
96
+ ], QboFormEdit.prototype, "spanEditClass", void 0);
67
97
  __decorate([
68
98
  property({ type: Date }),
69
99
  __metadata("design:type", Object)
package/src/qbo/qbo-form-edit.ts CHANGED
@@ -4,12 +4,30 @@ import { customElement, property } from 'lit/decorators.js';
4
4
  @customElement('qbo-form-edit')
5
5
  export class QboFormEdit extends LitElement {
6
6
 
7
+ @property({ type: String })
8
+ buttonPrimaryClass: String | null = 'qbo-primary';
9
+
7
10
  @property({ type: Date })
8
11
  createdDate = null;
9
12
 
10
13
  @property({ type: String })
11
14
  createdPerson = null;
12
15
 
16
+ @property({ type: String })
17
+ divButtonGroupClass: String | null = 'qbo-btn-group';
18
+
19
+ @property({ type: String })
20
+ divFormActionClass: String | null = 'qbo-form-actions';
21
+
22
+ @property({ type: String })
23
+ divSectionHeaderClass: String | null = 'qbo-header';
24
+
25
+ @property({ type: String })
26
+ editLabel: String | null = 'Edit';
27
+
28
+ @property({ type: String })
29
+ spanEditClass: String | null = 'qbo-icon-edit';
30
+
13
31
  @property({ type: Date })
14
32
  updatedDate = null;
15
33
 
@@ -25,13 +43,13 @@ export class QboFormEdit extends LitElement {
25
43
 
26
44
  render() {
27
45
  return html`<slot>
28
- <div class="col-md-12 mt-3">
46
+ <div class="${this.divSectionHeaderClass}">
29
47
  <hr />
30
48
  </div>
31
- <div class="col-md-12 mt-2">
32
- <div class="btn-group">
33
- <button type="button" class="btn btn-primary">
34
- <span class="bi-pencil-square"> Edit</span>
49
+ <div class="${this.divFormActionClass}">
50
+ <div class="${this.divButtonGroupClass}">
51
+ <button type="button" class="${this.buttonPrimaryClass}">
52
+ <span class="${this.spanEditClass}"> ${this.editLabel}</span>
35
53
  </button>
36
54
  <button type="button" class="btn btn-primary dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown"></button>
37
55
  <ul class="dropdown-menu">