retold-data-service 2.1.1 → 2.1.2

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 (22) hide show
  1. package/package.json +15 -15
  2. package/source/services/comprehension-loader/pict-app/providers/Pict-Provider-ComprehensionLoader.js +2 -2
  3. package/source/services/comprehension-loader/pict-app/views/PictView-ComprehensionLoader-Layout.js +43 -43
  4. package/source/services/comprehension-loader/pict-app/views/PictView-ComprehensionLoader-Load.js +14 -14
  5. package/source/services/comprehension-loader/pict-app/views/PictView-ComprehensionLoader-Schema.js +3 -3
  6. package/source/services/comprehension-loader/pict-app/views/PictView-ComprehensionLoader-Session.js +2 -2
  7. package/source/services/comprehension-loader/pict-app/views/PictView-ComprehensionLoader-Source.js +7 -7
  8. package/source/services/comprehension-loader/web/comprehension-loader.js +77 -77
  9. package/source/services/comprehension-loader/web/comprehension-loader.min.js +1 -1
  10. package/source/services/data-cloner/pict-app/providers/Pict-Provider-DataCloner.js +3 -3
  11. package/source/services/data-cloner/pict-app/views/PictView-DataCloner-Connection.js +1 -1
  12. package/source/services/data-cloner/pict-app/views/PictView-DataCloner-Deploy.js +5 -5
  13. package/source/services/data-cloner/pict-app/views/PictView-DataCloner-Export.js +11 -11
  14. package/source/services/data-cloner/pict-app/views/PictView-DataCloner-Layout.js +53 -53
  15. package/source/services/data-cloner/pict-app/views/PictView-DataCloner-Schema.js +3 -3
  16. package/source/services/data-cloner/pict-app/views/PictView-DataCloner-Session.js +2 -2
  17. package/source/services/data-cloner/pict-app/views/PictView-DataCloner-Sync.js +22 -22
  18. package/source/services/data-cloner/pict-app/views/PictView-DataCloner-ViewData.js +4 -4
  19. package/source/services/data-cloner/web/data-cloner.js +110 -108
  20. package/source/services/data-cloner/web/data-cloner.js.map +1 -1
  21. package/source/services/data-cloner/web/data-cloner.min.js +1 -1
  22. package/source/services/data-cloner/web/data-cloner.min.js.map +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "retold-data-service",
3
- "version": "2.1.1",
3
+ "version": "2.1.2",
4
4
  "description": "Serve up a whole model!",
5
5
  "main": "source/Retold-Data-Service.js",
6
6
  "bin": {
@@ -71,26 +71,26 @@
71
71
  "meadow-connection-sqlite": "^1.0.19",
72
72
  "pict-docuserve": "^0.1.5",
73
73
  "puppeteer": "^24.40.0",
74
- "quackage": "^1.2.0",
74
+ "quackage": "^1.2.3",
75
75
  "stricture": "^4.0.2",
76
76
  "supertest": "^7.2.2"
77
77
  },
78
78
  "dependencies": {
79
- "bibliograph": "^0.1.6",
80
- "fable": "^3.1.71",
79
+ "bibliograph": "^0.1.7",
80
+ "fable": "^3.1.72",
81
81
  "fable-serviceproviderbase": "^3.0.19",
82
- "meadow": "^2.0.37",
83
- "meadow-connection-manager": "^1.1.0",
84
- "pict-section-connection-form": "^0.0.1",
85
- "meadow-connection-mysql": "^1.0.18",
86
- "meadow-endpoints": "^4.0.17",
87
- "meadow-integration": "^1.0.38",
88
- "meadow-migrationmanager": "^0.0.14",
89
- "orator": "^6.1.1",
82
+ "meadow": "^2.0.38",
83
+ "meadow-connection-manager": "^1.1.2",
84
+ "pict-section-connection-form": "^0.0.2",
85
+ "meadow-connection-mysql": "^1.0.19",
86
+ "meadow-endpoints": "^4.0.20",
87
+ "meadow-integration": "^1.0.40",
88
+ "meadow-migrationmanager": "^0.0.16",
89
+ "orator": "^6.1.2",
90
90
  "orator-http-proxy": "^1.0.5",
91
- "orator-serviceserver-restify": "^2.0.10",
92
- "orator-static-server": "^2.1.3",
93
- "pict": "^1.0.365",
91
+ "orator-serviceserver-restify": "^2.0.11",
92
+ "orator-static-server": "^2.1.4",
93
+ "pict": "^1.0.366",
94
94
  "pict-section-histogram": "^1.0.0",
95
95
  "pict-sessionmanager": "^1.0.2",
96
96
  "stricture": "^4.0.2"
@@ -580,11 +580,11 @@ class ComprehensionLoaderProvider extends libPictProvider
580
580
  {
581
581
  if (tmpIsLive)
582
582
  {
583
- tmpHtml = '<div style="font-size:0.9em; color:#888; padding:8px 0">Load in progress, waiting for entity data\u2026</div>';
583
+ tmpHtml = '<div style="font-size:0.9em; color:var(--theme-color-text-muted, #888); padding:8px 0">Load in progress, waiting for entity data\u2026</div>';
584
584
  }
585
585
  else
586
586
  {
587
- tmpHtml = '<div style="font-size:0.9em; color:#888; padding:8px 0">No load data available. Run a load to see operation details here.</div>';
587
+ tmpHtml = '<div style="font-size:0.9em; color:var(--theme-color-text-muted, #888); padding:8px 0">No load data available. Run a load to see operation details here.</div>';
588
588
  }
589
589
  }
590
590
 
@@ -84,11 +84,11 @@ module.exports.default_configuration =
84
84
  DefaultDestinationAddress: '#ComprehensionLoader-Application-Container',
85
85
  CSS: /*css*/`
86
86
  * { box-sizing: border-box; margin: 0; padding: 0; }
87
- body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #f5f5f5; color: #333; padding: 20px; }
88
- h1 { margin-bottom: 20px; color: #1a1a1a; }
89
- h2 { margin-bottom: 12px; color: #444; font-size: 1.2em; border-bottom: 2px solid #ddd; padding-bottom: 6px; }
87
+ body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: var(--theme-color-background-secondary, #f5f5f5); color: var(--theme-color-text-primary, #333); padding: 20px; }
88
+ h1 { margin-bottom: 20px; color: var(--theme-color-text-primary, #1a1a1a); }
89
+ h2 { margin-bottom: 12px; color: var(--theme-color-text-secondary, #444); font-size: 1.2em; border-bottom: 2px solid var(--theme-color-border-default, #ddd); padding-bottom: 6px; }
90
90
 
91
- .section { background: #fff; border-radius: 8px; padding: 20px; margin-bottom: 16px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
91
+ .section { background: var(--theme-color-background-panel, #fff); border-radius: 8px; padding: 20px; margin-bottom: 16px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
92
92
 
93
93
  /* Accordion layout */
94
94
  .accordion-row { display: flex; gap: 0; margin-bottom: 16px; align-items: stretch; }
@@ -98,25 +98,25 @@ h2 { margin-bottom: 12px; color: #444; font-size: 1.2em; border-bottom: 2px soli
98
98
  user-select: none;
99
99
  }
100
100
  .accordion-card {
101
- flex: 1; background: #fff; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1);
101
+ flex: 1; background: var(--theme-color-background-panel, #fff); border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1);
102
102
  overflow: hidden; min-width: 0;
103
103
  }
104
104
  .accordion-header {
105
105
  display: flex; align-items: center; padding: 14px 20px; cursor: pointer;
106
106
  user-select: none; gap: 12px; transition: background 0.15s; line-height: 1.4;
107
107
  }
108
- .accordion-header:hover { background: #fafafa; }
109
- .accordion-title { font-weight: 600; color: #333; font-size: 1.05em; white-space: nowrap; }
110
- .accordion-preview { flex: 1; font-style: italic; color: #888; font-size: 0.9em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
108
+ .accordion-header:hover { background: var(--theme-color-background-secondary, #fafafa); }
109
+ .accordion-title { font-weight: 600; color: var(--theme-color-text-primary, #333); font-size: 1.05em; white-space: nowrap; }
110
+ .accordion-preview { flex: 1; font-style: italic; color: var(--theme-color-text-muted, #888); font-size: 0.9em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
111
111
  .accordion-toggle {
112
112
  flex: 0 0 20px; display: flex; align-items: center; justify-content: center;
113
- border-radius: 4px; transition: background 0.15s, transform 0.25s; font-size: 0.7em; color: #888;
113
+ border-radius: 4px; transition: background 0.15s, transform 0.25s; font-size: 0.7em; color: var(--theme-color-text-muted, #888);
114
114
  }
115
- .accordion-header:hover .accordion-toggle { background: #eee; color: #555; }
115
+ .accordion-header:hover .accordion-toggle { background: var(--theme-color-border-light, #eee); color: var(--theme-color-text-secondary, #555); }
116
116
  .accordion-card.open .accordion-toggle { transform: rotate(180deg); }
117
117
  .accordion-body { padding: 0 20px 20px; display: none; }
118
118
  .accordion-card.open .accordion-body { display: block; }
119
- .accordion-card.open .accordion-header { border-bottom: 1px solid #eee; }
119
+ .accordion-card.open .accordion-header { border-bottom: 1px solid var(--theme-color-border-light, #eee); }
120
120
  .accordion-card.open .accordion-preview { display: none; }
121
121
 
122
122
  /* Action controls (go link + auto checkbox) */
@@ -129,13 +129,13 @@ h2 { margin-bottom: 12px; color: #444; font-size: 1.2em; border-bottom: 2px soli
129
129
  }
130
130
  .accordion-go:hover { background: #e8f0fe; text-decoration: underline; }
131
131
  .accordion-auto {
132
- font-size: 0.82em; color: #999; white-space: nowrap; cursor: pointer;
132
+ font-size: 0.82em; color: var(--theme-color-text-muted, #999); white-space: nowrap; cursor: pointer;
133
133
  }
134
134
  .accordion-auto .auto-label { display: none; }
135
135
  .accordion-auto:hover .auto-label { display: inline; }
136
136
  .accordion-auto input[type="checkbox"] { width: auto; margin: 0; cursor: pointer; vertical-align: middle; position: relative; top: 0px; opacity: 0.75; transition: opacity 0.15s; }
137
137
  .accordion-auto:hover input[type="checkbox"] { opacity: 1; }
138
- .accordion-auto:hover { color: #666; }
138
+ .accordion-auto:hover { color: var(--theme-color-text-secondary, #666); }
139
139
 
140
140
  /* Phase status indicator */
141
141
  .accordion-phase {
@@ -143,12 +143,12 @@ h2 { margin-bottom: 12px; color: #444; font-size: 1.2em; border-bottom: 2px soli
143
143
  font-size: 0.85em; line-height: 1;
144
144
  }
145
145
  .accordion-phase.visible { display: flex; }
146
- .accordion-phase-ok { color: #28a745; }
146
+ .accordion-phase-ok { color: var(--theme-color-status-success, #28a745); }
147
147
  .accordion-phase-error { color: #dc3545; }
148
- .accordion-phase-busy { color: #28a745; }
148
+ .accordion-phase-busy { color: var(--theme-color-status-success, #28a745); }
149
149
  .accordion-phase-busy .phase-spinner {
150
150
  display: inline-block; width: 14px; height: 14px;
151
- border: 2px solid #28a745; border-top-color: transparent; border-radius: 50%;
151
+ border: 2px solid var(--theme-color-status-success, #28a745); border-top-color: transparent; border-radius: 50%;
152
152
  animation: phase-spin 0.8s linear infinite; vertical-align: middle;
153
153
  }
154
154
  @keyframes phase-spin {
@@ -160,13 +160,13 @@ h2 { margin-bottom: 12px; color: #444; font-size: 1.2em; border-bottom: 2px soli
160
160
  }
161
161
  .accordion-controls button {
162
162
  padding: 4px 10px; font-size: 0.82em; font-weight: 500; background: none;
163
- border: 1px solid #ccc; border-radius: 4px; color: #666; cursor: pointer; margin: 0;
163
+ border: 1px solid var(--theme-color-border-default, #ccc); border-radius: 4px; color: var(--theme-color-text-secondary, #666); cursor: pointer; margin: 0;
164
164
  }
165
- .accordion-controls button:hover { background: #f0f0f0; border-color: #aaa; color: #333; }
165
+ .accordion-controls button:hover { background: var(--theme-color-background-tertiary, #f0f0f0); border-color: var(--theme-color-text-muted, #aaa); color: var(--theme-color-text-primary, #333); }
166
166
 
167
167
  label { display: block; font-weight: 600; margin-bottom: 4px; font-size: 0.9em; }
168
168
  input[type="text"], input[type="password"], input[type="number"] {
169
- width: 100%; padding: 8px 12px; border: 1px solid #ccc; border-radius: 4px;
169
+ width: 100%; padding: 8px 12px; border: 1px solid var(--theme-color-border-default, #ccc); border-radius: 4px;
170
170
  font-size: 0.95em; margin-bottom: 10px;
171
171
  }
172
172
  input[type="text"]:focus, input[type="password"]:focus, input[type="number"]:focus {
@@ -177,13 +177,13 @@ button {
177
177
  padding: 8px 16px; border: none; border-radius: 4px; cursor: pointer;
178
178
  font-size: 0.9em; font-weight: 600; margin-right: 8px; margin-bottom: 8px;
179
179
  }
180
- button.primary { background: #4a90d9; color: #fff; }
180
+ button.primary { background: #4a90d9; color: var(--theme-color-background-panel, #fff); }
181
181
  button.primary:hover { background: #357abd; }
182
- button.secondary { background: #6c757d; color: #fff; }
182
+ button.secondary { background: #6c757d; color: var(--theme-color-background-panel, #fff); }
183
183
  button.secondary:hover { background: #5a6268; }
184
- button.danger { background: #dc3545; color: #fff; }
184
+ button.danger { background: #dc3545; color: var(--theme-color-background-panel, #fff); }
185
185
  button.danger:hover { background: #c82333; }
186
- button.success { background: #28a745; color: #fff; }
186
+ button.success { background: var(--theme-color-status-success, #28a745); color: var(--theme-color-background-panel, #fff); }
187
187
  button.success:hover { background: #218838; }
188
188
  button:disabled { opacity: 0.5; cursor: not-allowed; }
189
189
 
@@ -198,7 +198,7 @@ button:disabled { opacity: 0.5; cursor: not-allowed; }
198
198
 
199
199
  a { color: #4a90d9; }
200
200
 
201
- select { background: #fff; width: 100%; padding: 8px 12px; border: 1px solid #ccc; border-radius: 4px; font-size: 0.95em; margin-bottom: 10px; }
201
+ select { background: var(--theme-color-background-panel, #fff); width: 100%; padding: 8px 12px; border: 1px solid var(--theme-color-border-default, #ccc); border-radius: 4px; font-size: 0.95em; margin-bottom: 10px; }
202
202
 
203
203
  .checkbox-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
204
204
  .checkbox-row input[type="checkbox"] { width: auto; margin: 0; }
@@ -206,16 +206,16 @@ select { background: #fff; width: 100%; padding: 8px 12px; border: 1px solid #cc
206
206
 
207
207
  /* Live Status Bar */
208
208
  .live-status-bar {
209
- background: #fff; border-radius: 8px; margin-bottom: 16px;
209
+ background: var(--theme-color-background-panel, #fff); border-radius: 8px; margin-bottom: 16px;
210
210
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
211
211
  position: sticky; top: 0; z-index: 100; border-left: 4px solid #6c757d;
212
212
  }
213
213
  .live-status-bar.phase-idle { border-left-color: #6c757d; }
214
214
  .live-status-bar.phase-disconnected { border-left-color: #dc3545; }
215
215
  .live-status-bar.phase-ready { border-left-color: #4a90d9; }
216
- .live-status-bar.phase-loading { border-left-color: #28a745; }
216
+ .live-status-bar.phase-loading { border-left-color: var(--theme-color-status-success, #28a745); }
217
217
  .live-status-bar.phase-stopping { border-left-color: #ffc107; }
218
- .live-status-bar.phase-complete { border-left-color: #28a745; }
218
+ .live-status-bar.phase-complete { border-left-color: var(--theme-color-status-success, #28a745); }
219
219
 
220
220
  .live-status-dot {
221
221
  width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0;
@@ -225,34 +225,34 @@ select { background: #fff; width: 100%; padding: 8px 12px; border: 1px solid #cc
225
225
  .live-status-bar.phase-disconnected .live-status-dot { background: #dc3545; }
226
226
  .live-status-bar.phase-ready .live-status-dot { background: #4a90d9; }
227
227
  .live-status-bar.phase-loading .live-status-dot {
228
- background: #28a745;
228
+ background: var(--theme-color-status-success, #28a745);
229
229
  animation: live-pulse 1.5s ease-in-out infinite;
230
230
  }
231
231
  .live-status-bar.phase-stopping .live-status-dot {
232
232
  background: #ffc107;
233
233
  animation: live-pulse 0.8s ease-in-out infinite;
234
234
  }
235
- .live-status-bar.phase-complete .live-status-dot { background: #28a745; }
235
+ .live-status-bar.phase-complete .live-status-dot { background: var(--theme-color-status-success, #28a745); }
236
236
 
237
237
  @keyframes live-pulse {
238
238
  0%, 100% { opacity: 1; transform: scale(1); }
239
239
  50% { opacity: 0.4; transform: scale(0.8); }
240
240
  }
241
241
 
242
- .live-status-message { flex: 1; font-size: 0.92em; color: #333; line-height: 1.4; }
242
+ .live-status-message { flex: 1; font-size: 0.92em; color: var(--theme-color-text-primary, #333); line-height: 1.4; }
243
243
 
244
244
  .live-status-meta {
245
- display: flex; gap: 16px; flex-shrink: 0; font-size: 0.82em; color: #666;
245
+ display: flex; gap: 16px; flex-shrink: 0; font-size: 0.82em; color: var(--theme-color-text-secondary, #666);
246
246
  }
247
247
  .live-status-meta-item { white-space: nowrap; }
248
- .live-status-meta-item strong { color: #333; }
248
+ .live-status-meta-item strong { color: var(--theme-color-text-primary, #333); }
249
249
 
250
250
  .live-status-progress-bar {
251
251
  height: 3px; background: #e9ecef; border-radius: 2px; overflow: hidden;
252
252
  position: absolute; bottom: 0; left: 0; right: 0;
253
253
  }
254
254
  .live-status-progress-fill {
255
- height: 100%; background: #28a745; transition: width 1s ease;
255
+ height: 100%; background: var(--theme-color-status-success, #28a745); transition: width 1s ease;
256
256
  }
257
257
  /* Expandable status bar */
258
258
  .live-status-header {
@@ -264,7 +264,7 @@ select { background: #fff; width: 100%; padding: 8px 12px; border: 1px solid #cc
264
264
  }
265
265
  .live-status-expand-toggle {
266
266
  flex: 0 0 20px; display: flex; align-items: center; justify-content: center;
267
- font-size: 0.7em; color: #888; transition: transform 0.25s;
267
+ font-size: 0.7em; color: var(--theme-color-text-muted, #888); transition: transform 0.25s;
268
268
  }
269
269
  .live-status-bar.expanded .live-status-expand-toggle { transform: rotate(180deg); }
270
270
 
@@ -276,9 +276,9 @@ select { background: #fff; width: 100%; padding: 8px 12px; border: 1px solid #cc
276
276
  .status-detail-section { margin-bottom: 14px; }
277
277
  .status-detail-section:last-child { margin-bottom: 0; }
278
278
  .status-detail-section-title {
279
- font-size: 0.85em; font-weight: 600; color: #555; text-transform: uppercase;
279
+ font-size: 0.85em; font-weight: 600; color: var(--theme-color-text-secondary, #555); text-transform: uppercase;
280
280
  letter-spacing: 0.5px; margin-bottom: 8px; padding-bottom: 4px;
281
- border-bottom: 1px solid #eee;
281
+ border-bottom: 1px solid var(--theme-color-border-light, #eee);
282
282
  }
283
283
 
284
284
  /* Running Operations */
@@ -292,26 +292,26 @@ select { background: #fff; width: 100%; padding: 8px 12px; border: 1px solid #cc
292
292
  min-width: 120px;
293
293
  }
294
294
  .running-op-bar-fill { height: 100%; background: #4a90d9; transition: width 0.5s ease; }
295
- .running-op-count { font-size: 0.85em; color: #666; white-space: nowrap; }
296
- .running-op-pending { color: #888; font-size: 0.85em; font-style: italic; padding: 4px 0; }
295
+ .running-op-count { font-size: 0.85em; color: var(--theme-color-text-secondary, #666); white-space: nowrap; }
296
+ .running-op-pending { color: var(--theme-color-text-muted, #888); font-size: 0.85em; font-style: italic; padding: 4px 0; }
297
297
 
298
298
  /* Completed Operations */
299
- .completed-op-row { padding: 8px 0; border-bottom: 1px solid #f0f0f0; }
299
+ .completed-op-row { padding: 8px 0; border-bottom: 1px solid var(--theme-color-background-tertiary, #f0f0f0); }
300
300
  .completed-op-row:last-child { border-bottom: none; }
301
301
  .completed-op-header {
302
302
  display: flex; align-items: center; gap: 10px; font-size: 0.9em; margin-bottom: 4px;
303
303
  }
304
304
  .completed-op-name { font-weight: 600; }
305
- .completed-op-stats { color: #666; font-size: 0.85em; }
306
- .completed-op-checkmark { color: #28a745; }
305
+ .completed-op-stats { color: var(--theme-color-text-secondary, #666); font-size: 0.85em; }
306
+ .completed-op-checkmark { color: var(--theme-color-status-success, #28a745); }
307
307
 
308
308
  /* Error Operations */
309
- .error-op-row { padding: 6px 0; border-bottom: 1px solid #f0f0f0; font-size: 0.9em; }
309
+ .error-op-row { padding: 6px 0; border-bottom: 1px solid var(--theme-color-background-tertiary, #f0f0f0); font-size: 0.9em; }
310
310
  .error-op-row:last-child { border-bottom: none; }
311
311
  .error-op-header { display: flex; align-items: center; gap: 8px; }
312
312
  .error-op-name { font-weight: 600; color: #dc3545; }
313
313
  .error-op-status { font-size: 0.82em; color: #dc3545; }
314
- .error-op-message { font-size: 0.82em; color: #888; margin-top: 2px; padding-left: 18px; }
314
+ .error-op-message { font-size: 0.82em; color: var(--theme-color-text-muted, #888); margin-top: 2px; padding-left: 18px; }
315
315
  `,
316
316
  Templates:
317
317
  [
@@ -162,14 +162,14 @@ class ComprehensionLoaderLoadView extends libPictView
162
162
  + '<div class="report-card">'
163
163
  + ' <div class="card-label">Records Pushed</div>'
164
164
  + ' <div class="card-value">' + tmpTotalPushed + '</div>'
165
- + ' <div style="font-size:0.75em; color:#888">of ' + tmpTotalRecords + '</div>'
165
+ + ' <div style="font-size:0.75em; color:var(--theme-color-text-muted, #888)">of ' + tmpTotalRecords + '</div>'
166
166
  + '</div>';
167
167
 
168
168
  // Anomalies
169
169
  let tmpAnomalyContainer = document.getElementById('reportAnomalies');
170
170
  if (pReport.Anomalies.length === 0)
171
171
  {
172
- tmpAnomalyContainer.innerHTML = '<div style="color:#28a745; font-weight:600; font-size:0.9em">No anomalies detected.</div>';
172
+ tmpAnomalyContainer.innerHTML = '<div style="color:var(--theme-color-status-success, #28a745); font-weight:600; font-size:0.9em">No anomalies detected.</div>';
173
173
  }
174
174
  else
175
175
  {
@@ -194,7 +194,7 @@ class ComprehensionLoaderLoadView extends libPictView
194
194
  let tmpEntityContainer = document.getElementById('reportEntityDetails');
195
195
  if (pReport.Entities && pReport.Entities.length > 0)
196
196
  {
197
- let tmpHtml = '<h4 style="margin:0 0 8px; font-size:0.95em; color:#444">Entity Details</h4>';
197
+ let tmpHtml = '<h4 style="margin:0 0 8px; font-size:0.95em; color:var(--theme-color-text-secondary, #444)">Entity Details</h4>';
198
198
  tmpHtml += '<table class="progress-table">';
199
199
  tmpHtml += '<tr><th>Entity</th><th>Duration</th><th>Records</th><th>Status</th></tr>';
200
200
  for (let i = 0; i < pReport.Entities.length; i++)
@@ -394,22 +394,22 @@ module.exports.default_configuration =
394
394
  DefaultDestinationAddress: '#ComprehensionLoader-Section-Load',
395
395
  CSS: /*css*/`
396
396
  .progress-table { width: 100%; border-collapse: collapse; margin-top: 4px; margin-bottom: 4px; }
397
- .progress-table th, .progress-table td { text-align: left; padding: 6px 12px; border-bottom: 1px solid #eee; font-size: 0.9em; }
397
+ .progress-table th, .progress-table td { text-align: left; padding: 6px 12px; border-bottom: 1px solid var(--theme-color-border-light, #eee); font-size: 0.9em; }
398
398
  .progress-table th { background: #f8f9fa; font-weight: 600; }
399
- .progress-table-muted td { color: #888; padding: 3px 12px; font-size: 0.85em; border-bottom: 1px solid #f4f5f6; }
399
+ .progress-table-muted td { color: var(--theme-color-text-muted, #888); padding: 3px 12px; font-size: 0.85em; border-bottom: 1px solid #f4f5f6; }
400
400
  .progress-bar-container { width: 120px; height: 16px; background: #e9ecef; border-radius: 8px; overflow: hidden; display: inline-block; vertical-align: middle; }
401
- .progress-bar-fill { height: 100%; background: #28a745; transition: width 0.3s; }
402
- .sync-section-header { font-size: 0.8em; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; color: #4a90d9; padding: 10px 0 2px 0; margin-top: 6px; border-top: 1px solid #e0e0e0; }
401
+ .progress-bar-fill { height: 100%; background: var(--theme-color-status-success, #28a745); transition: width 0.3s; }
402
+ .sync-section-header { font-size: 0.8em; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; color: #4a90d9; padding: 10px 0 2px 0; margin-top: 6px; border-top: 1px solid var(--theme-color-border-default, #e0e0e0); }
403
403
  .sync-section-header:first-child { border-top: none; margin-top: 10px; }
404
404
  .sync-section-header-error { color: #dc3545; }
405
- .sync-section-header-ok { color: #28a745; }
406
- .sync-section-count { font-weight: 400; color: #999; font-size: 0.95em; }
407
- .sync-section-overflow { font-size: 0.8em; color: #aaa; padding: 2px 12px 6px; }
408
- .sync-pending-count { text-align: right; color: #aaa; font-size: 0.85em; }
405
+ .sync-section-header-ok { color: var(--theme-color-status-success, #28a745); }
406
+ .sync-section-count { font-weight: 400; color: var(--theme-color-text-muted, #999); font-size: 0.95em; }
407
+ .sync-section-overflow { font-size: 0.8em; color: var(--theme-color-text-muted, #aaa); padding: 2px 12px 6px; }
408
+ .sync-pending-count { text-align: right; color: var(--theme-color-text-muted, #aaa); font-size: 0.85em; }
409
409
  .report-card { background: #f8f9fa; border-radius: 8px; padding: 12px 16px; min-width: 140px; text-align: center; border: 1px solid #e9ecef; }
410
- .report-card .card-label { font-size: 0.8em; color: #666; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 4px; }
410
+ .report-card .card-label { font-size: 0.8em; color: var(--theme-color-text-secondary, #666); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 4px; }
411
411
  .report-card .card-value { font-size: 1.4em; font-weight: 700; }
412
- .report-card.outcome-success { border-left: 4px solid #28a745; }
412
+ .report-card.outcome-success { border-left: 4px solid var(--theme-color-status-success, #28a745); }
413
413
  .report-card.outcome-partial { border-left: 4px solid #ffc107; }
414
414
  .report-card.outcome-error { border-left: 4px solid #dc3545; }
415
415
  .report-card.outcome-stopped { border-left: 4px solid #6c757d; }
@@ -442,7 +442,7 @@ module.exports.default_configuration =
442
442
  <div id="loadProgress"></div>
443
443
 
444
444
  <!-- Load Report (appears after load completes) -->
445
- <div id="loadReportSection" style="display:none; margin-top:16px; padding-top:16px; border-top:2px solid #ddd">
445
+ <div id="loadReportSection" style="display:none; margin-top:16px; padding-top:16px; border-top:2px solid var(--theme-color-border-default, #ddd)">
446
446
  <h3 style="margin:0 0 12px; font-size:1.1em">Load Report</h3>
447
447
 
448
448
  <div id="reportSummaryCards" style="display:flex; gap:12px; flex-wrap:wrap; margin-bottom:16px"></div>
@@ -53,14 +53,14 @@ class ComprehensionLoaderSchemaView extends libPictView
53
53
 
54
54
  if (tmpEntities.length === 0)
55
55
  {
56
- tmpContainer.innerHTML = '<div style="color:#888; font-size:0.9em">No entities found.</div>';
56
+ tmpContainer.innerHTML = '<div style="color:var(--theme-color-text-muted, #888); font-size:0.9em">No entities found.</div>';
57
57
  return;
58
58
  }
59
59
 
60
- let tmpHtml = '<div style="font-size:0.9em; color:#555">';
60
+ let tmpHtml = '<div style="font-size:0.9em; color:var(--theme-color-text-secondary, #555)">';
61
61
  for (let i = 0; i < tmpEntities.length; i++)
62
62
  {
63
- tmpHtml += '<span style="display:inline-block; background:#f0f0f0; border-radius:4px; padding:2px 8px; margin:2px 4px 2px 0; font-size:0.9em">';
63
+ tmpHtml += '<span style="display:inline-block; background:var(--theme-color-background-tertiary, #f0f0f0); border-radius:4px; padding:2px 8px; margin:2px 4px 2px 0; font-size:0.9em">';
64
64
  tmpHtml += this.pict.providers.ComprehensionLoader.escapeHtml(tmpEntities[i]);
65
65
  tmpHtml += '</span>';
66
66
  }
@@ -215,7 +215,7 @@ module.exports.default_configuration =
215
215
  </div>
216
216
 
217
217
  <details style="margin-bottom:10px">
218
- <summary style="cursor:pointer; font-size:0.9em; color:#666">Advanced Session Options</summary>
218
+ <summary style="cursor:pointer; font-size:0.9em; color:var(--theme-color-text-secondary, #666)">Advanced Session Options</summary>
219
219
  <div style="padding:10px 0">
220
220
  <label for="authURI">Authentication URI Template (leave blank for default)</label>
221
221
  <input type="text" id="authURI" placeholder="Authenticate/{~D:Record.UserName~}/{~D:Record.Password~}">
@@ -235,7 +235,7 @@ module.exports.default_configuration =
235
235
  <button class="primary" onclick="pict.views['ComprehensionLoader-Session'].configureSession()">Configure Session</button>
236
236
  <div id="sessionConfigStatus"></div>
237
237
 
238
- <hr style="margin:16px 0; border:none; border-top:1px solid #eee">
238
+ <hr style="margin:16px 0; border:none; border-top:1px solid var(--theme-color-border-light, #eee)">
239
239
 
240
240
  <div class="inline-group">
241
241
  <div>
@@ -189,8 +189,8 @@ class ComprehensionLoaderSourceView extends libPictView
189
189
  if (!tmpContainer) return;
190
190
 
191
191
  let tmpHtml = '<table style="width:100%; border-collapse:collapse; margin-top:8px; font-size:0.9em">';
192
- tmpHtml += '<thead><tr><th style="text-align:left; padding:6px 12px; border-bottom:2px solid #ddd">Entity</th>';
193
- tmpHtml += '<th style="text-align:right; padding:6px 12px; border-bottom:2px solid #ddd">Records</th></tr></thead>';
192
+ tmpHtml += '<thead><tr><th style="text-align:left; padding:6px 12px; border-bottom:2px solid var(--theme-color-border-default, #ddd)">Entity</th>';
193
+ tmpHtml += '<th style="text-align:right; padding:6px 12px; border-bottom:2px solid var(--theme-color-border-default, #ddd)">Records</th></tr></thead>';
194
194
  tmpHtml += '<tbody>';
195
195
 
196
196
  let tmpEntityList = pResult.EntityList || [];
@@ -200,8 +200,8 @@ class ComprehensionLoaderSourceView extends libPictView
200
200
  let tmpName = tmpEntityList[i];
201
201
  let tmpCount = tmpRecordCounts[tmpName] || 0;
202
202
  tmpHtml += '<tr>';
203
- tmpHtml += '<td style="padding:4px 12px; border-bottom:1px solid #f0f0f0">' + this.pict.providers.ComprehensionLoader.escapeHtml(tmpName) + '</td>';
204
- tmpHtml += '<td style="padding:4px 12px; border-bottom:1px solid #f0f0f0; text-align:right; font-variant-numeric:tabular-nums">' + this.pict.providers.ComprehensionLoader.formatNumber(tmpCount) + '</td>';
203
+ tmpHtml += '<td style="padding:4px 12px; border-bottom:1px solid var(--theme-color-background-tertiary, #f0f0f0)">' + this.pict.providers.ComprehensionLoader.escapeHtml(tmpName) + '</td>';
204
+ tmpHtml += '<td style="padding:4px 12px; border-bottom:1px solid var(--theme-color-background-tertiary, #f0f0f0); text-align:right; font-variant-numeric:tabular-nums">' + this.pict.providers.ComprehensionLoader.formatNumber(tmpCount) + '</td>';
205
205
  tmpHtml += '</tr>';
206
206
  }
207
207
 
@@ -287,11 +287,11 @@ module.exports.default_configuration =
287
287
  <div style="display:flex; gap:16px; align-items:center">
288
288
  <label style="font-weight:normal; margin:0; cursor:pointer">
289
289
  <input type="radio" name="comprehensionSourceMode" id="sourceMode_url" value="url" checked onchange="pict.views['ComprehensionLoader-Source'].onSourceModeChange()"> URL
290
- <span style="color:#888; font-size:0.85em">(fetch from a URL)</span>
290
+ <span style="color:var(--theme-color-text-muted, #888); font-size:0.85em">(fetch from a URL)</span>
291
291
  </label>
292
292
  <label style="font-weight:normal; margin:0; cursor:pointer">
293
293
  <input type="radio" name="comprehensionSourceMode" id="sourceMode_file" value="file" onchange="pict.views['ComprehensionLoader-Source'].onSourceModeChange()"> File Upload
294
- <span style="color:#888; font-size:0.85em">(load JSON from local files)</span>
294
+ <span style="color:var(--theme-color-text-muted, #888); font-size:0.85em">(load JSON from local files)</span>
295
295
  </label>
296
296
  </div>
297
297
  </div>
@@ -305,7 +305,7 @@ module.exports.default_configuration =
305
305
  <div id="sourceFileSection" style="display:none">
306
306
  <label for="comprehensionFiles">Comprehension JSON File(s)</label>
307
307
  <input type="file" id="comprehensionFiles" multiple accept=".json" style="margin-bottom:10px">
308
- <div style="font-size:0.8em; color:#888; margin-bottom:10px">Multiple files will be merged (entity keys combined).</div>
308
+ <div style="font-size:0.8em; color:var(--theme-color-text-muted, #888); margin-bottom:10px">Multiple files will be merged (entity keys combined).</div>
309
309
  <button class="primary" onclick="pict.views['ComprehensionLoader-Source'].loadFromFiles()">Load Files</button>
310
310
  </div>
311
311