@design.estate/wcctools 5.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (55) hide show
  1. package/.smartconfig.json +65 -0
  2. package/changelog.md +414 -0
  3. package/dist_bundle/bundle.js +92419 -0
  4. package/dist_bundle/bundle.js.map +1 -0
  5. package/dist_ts_web/00_commitinfo_data.d.ts +8 -0
  6. package/dist_ts_web/00_commitinfo_data.js +9 -0
  7. package/dist_ts_web/elements/wcc-contextmenu.d.ts +41 -0
  8. package/dist_ts_web/elements/wcc-contextmenu.js +329 -0
  9. package/dist_ts_web/elements/wcc-dashboard.d.ts +119 -0
  10. package/dist_ts_web/elements/wcc-dashboard.js +700 -0
  11. package/dist_ts_web/elements/wcc-frame.d.ts +22 -0
  12. package/dist_ts_web/elements/wcc-frame.js +256 -0
  13. package/dist_ts_web/elements/wcc-properties.d.ts +43 -0
  14. package/dist_ts_web/elements/wcc-properties.js +1147 -0
  15. package/dist_ts_web/elements/wcc-record-button.d.ts +12 -0
  16. package/dist_ts_web/elements/wcc-record-button.js +165 -0
  17. package/dist_ts_web/elements/wcc-recording-panel.d.ts +44 -0
  18. package/dist_ts_web/elements/wcc-recording-panel.js +1103 -0
  19. package/dist_ts_web/elements/wcc-sidebar.d.ts +91 -0
  20. package/dist_ts_web/elements/wcc-sidebar.js +1497 -0
  21. package/dist_ts_web/elements/wcctools.helpers.d.ts +46 -0
  22. package/dist_ts_web/elements/wcctools.helpers.js +106 -0
  23. package/dist_ts_web/index.d.ts +18 -0
  24. package/dist_ts_web/index.js +30 -0
  25. package/dist_ts_web/pages/index.d.ts +1 -0
  26. package/dist_ts_web/pages/index.js +2 -0
  27. package/dist_ts_web/services/recorder.service.d.ts +55 -0
  28. package/dist_ts_web/services/recorder.service.js +353 -0
  29. package/dist_ts_web/wcctools.interfaces.d.ts +29 -0
  30. package/dist_ts_web/wcctools.interfaces.js +2 -0
  31. package/dist_ts_web/wcctools.plugins.d.ts +2 -0
  32. package/dist_ts_web/wcctools.plugins.js +3 -0
  33. package/license.md +19 -0
  34. package/package.json +64 -0
  35. package/readme.md +568 -0
  36. package/ts_web/00_commitinfo_data.ts +8 -0
  37. package/ts_web/elements/wcc-contextmenu.ts +291 -0
  38. package/ts_web/elements/wcc-dashboard.ts +672 -0
  39. package/ts_web/elements/wcc-frame.ts +189 -0
  40. package/ts_web/elements/wcc-properties.ts +1089 -0
  41. package/ts_web/elements/wcc-record-button.ts +108 -0
  42. package/ts_web/elements/wcc-recording-panel.ts +1010 -0
  43. package/ts_web/elements/wcc-sidebar.ts +1470 -0
  44. package/ts_web/elements/wcctools.helpers.ts +153 -0
  45. package/ts_web/index.ts +38 -0
  46. package/ts_web/pages/index.ts +1 -0
  47. package/ts_web/readme.md +177 -0
  48. package/ts_web/services/recorder.service.ts +451 -0
  49. package/ts_web/tspublish.json +3 -0
  50. package/ts_web/types/dom-mediacapture-stub/index.d.ts +12 -0
  51. package/ts_web/types/dom-mediacapture-stub/package.json +6 -0
  52. package/ts_web/types/dom-webcodecs-stub/index.d.ts +2 -0
  53. package/ts_web/types/dom-webcodecs-stub/package.json +6 -0
  54. package/ts_web/wcctools.interfaces.ts +31 -0
  55. package/ts_web/wcctools.plugins.ts +5 -0
@@ -0,0 +1,1147 @@
1
+ var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
2
+ function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
3
+ var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
4
+ var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
5
+ var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
6
+ var _, done = false;
7
+ for (var i = decorators.length - 1; i >= 0; i--) {
8
+ var context = {};
9
+ for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
10
+ for (var p in contextIn.access) context.access[p] = contextIn.access[p];
11
+ context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
12
+ var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
13
+ if (kind === "accessor") {
14
+ if (result === void 0) continue;
15
+ if (result === null || typeof result !== "object") throw new TypeError("Object expected");
16
+ if (_ = accept(result.get)) descriptor.get = _;
17
+ if (_ = accept(result.set)) descriptor.set = _;
18
+ if (_ = accept(result.init)) initializers.unshift(_);
19
+ }
20
+ else if (_ = accept(result)) {
21
+ if (kind === "field") initializers.unshift(_);
22
+ else descriptor[key] = _;
23
+ }
24
+ }
25
+ if (target) Object.defineProperty(target, contextIn.name, descriptor);
26
+ done = true;
27
+ };
28
+ var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
29
+ var useValue = arguments.length > 2;
30
+ for (var i = 0; i < initializers.length; i++) {
31
+ value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
32
+ }
33
+ return useValue ? value : void 0;
34
+ };
35
+ import { DeesElement, property, html, customElement, state } from '@design.estate/dees-element';
36
+ import { WccDashboard } from './wcc-dashboard.js';
37
+ import { determinePropertyType, findElementInstance } from './wcctools.helpers.js';
38
+ import './wcc-record-button.js';
39
+ import './wcc-recording-panel.js';
40
+ let environment = 'native';
41
+ export const setEnvironment = (envArg) => {
42
+ environment = envArg;
43
+ };
44
+ let WccProperties = (() => {
45
+ let _classDecorators = [customElement('wcc-properties')];
46
+ let _classDescriptor;
47
+ let _classExtraInitializers = [];
48
+ let _classThis;
49
+ let _classSuper = DeesElement;
50
+ let _dashboardRef_decorators;
51
+ let _dashboardRef_initializers = [];
52
+ let _dashboardRef_extraInitializers = [];
53
+ let _selectedItem_decorators;
54
+ let _selectedItem_initializers = [];
55
+ let _selectedItem_extraInitializers = [];
56
+ let _selectedViewport_decorators;
57
+ let _selectedViewport_initializers = [];
58
+ let _selectedViewport_extraInitializers = [];
59
+ let _selectedTheme_decorators;
60
+ let _selectedTheme_initializers = [];
61
+ let _selectedTheme_extraInitializers = [];
62
+ let _warning_decorators;
63
+ let _warning_initializers = [];
64
+ let _warning_extraInitializers = [];
65
+ let _isNative_decorators;
66
+ let _isNative_initializers = [];
67
+ let _isNative_extraInitializers = [];
68
+ let _sidebarWidth_decorators;
69
+ let _sidebarWidth_initializers = [];
70
+ let _sidebarWidth_extraInitializers = [];
71
+ let _propertyContent_decorators;
72
+ let _propertyContent_initializers = [];
73
+ let _propertyContent_extraInitializers = [];
74
+ let _editingProperties_decorators;
75
+ let _editingProperties_initializers = [];
76
+ let _editingProperties_extraInitializers = [];
77
+ let _showRecordingPanel_decorators;
78
+ let _showRecordingPanel_initializers = [];
79
+ let _showRecordingPanel_extraInitializers = [];
80
+ let _isRecording_decorators;
81
+ let _isRecording_initializers = [];
82
+ let _isRecording_extraInitializers = [];
83
+ let _recordingDuration_decorators;
84
+ let _recordingDuration_initializers = [];
85
+ let _recordingDuration_extraInitializers = [];
86
+ let _isHidden_decorators;
87
+ let _isHidden_initializers = [];
88
+ let _isHidden_extraInitializers = [];
89
+ var WccProperties = class extends _classSuper {
90
+ static { _classThis = this; }
91
+ static {
92
+ const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
93
+ _dashboardRef_decorators = [property({
94
+ type: WccDashboard
95
+ })];
96
+ _selectedItem_decorators = [property()];
97
+ _selectedViewport_decorators = [property()];
98
+ _selectedTheme_decorators = [property()];
99
+ _warning_decorators = [property()];
100
+ _isNative_decorators = [property()];
101
+ _sidebarWidth_decorators = [property({ type: Number })];
102
+ _propertyContent_decorators = [state()];
103
+ _editingProperties_decorators = [state()];
104
+ _showRecordingPanel_decorators = [state()];
105
+ _isRecording_decorators = [state()];
106
+ _recordingDuration_decorators = [state()];
107
+ _isHidden_decorators = [state()];
108
+ __esDecorate(this, null, _dashboardRef_decorators, { kind: "accessor", name: "dashboardRef", static: false, private: false, access: { has: obj => "dashboardRef" in obj, get: obj => obj.dashboardRef, set: (obj, value) => { obj.dashboardRef = value; } }, metadata: _metadata }, _dashboardRef_initializers, _dashboardRef_extraInitializers);
109
+ __esDecorate(this, null, _selectedItem_decorators, { kind: "accessor", name: "selectedItem", static: false, private: false, access: { has: obj => "selectedItem" in obj, get: obj => obj.selectedItem, set: (obj, value) => { obj.selectedItem = value; } }, metadata: _metadata }, _selectedItem_initializers, _selectedItem_extraInitializers);
110
+ __esDecorate(this, null, _selectedViewport_decorators, { kind: "accessor", name: "selectedViewport", static: false, private: false, access: { has: obj => "selectedViewport" in obj, get: obj => obj.selectedViewport, set: (obj, value) => { obj.selectedViewport = value; } }, metadata: _metadata }, _selectedViewport_initializers, _selectedViewport_extraInitializers);
111
+ __esDecorate(this, null, _selectedTheme_decorators, { kind: "accessor", name: "selectedTheme", static: false, private: false, access: { has: obj => "selectedTheme" in obj, get: obj => obj.selectedTheme, set: (obj, value) => { obj.selectedTheme = value; } }, metadata: _metadata }, _selectedTheme_initializers, _selectedTheme_extraInitializers);
112
+ __esDecorate(this, null, _warning_decorators, { kind: "accessor", name: "warning", static: false, private: false, access: { has: obj => "warning" in obj, get: obj => obj.warning, set: (obj, value) => { obj.warning = value; } }, metadata: _metadata }, _warning_initializers, _warning_extraInitializers);
113
+ __esDecorate(this, null, _isNative_decorators, { kind: "accessor", name: "isNative", static: false, private: false, access: { has: obj => "isNative" in obj, get: obj => obj.isNative, set: (obj, value) => { obj.isNative = value; } }, metadata: _metadata }, _isNative_initializers, _isNative_extraInitializers);
114
+ __esDecorate(this, null, _sidebarWidth_decorators, { kind: "accessor", name: "sidebarWidth", static: false, private: false, access: { has: obj => "sidebarWidth" in obj, get: obj => obj.sidebarWidth, set: (obj, value) => { obj.sidebarWidth = value; } }, metadata: _metadata }, _sidebarWidth_initializers, _sidebarWidth_extraInitializers);
115
+ __esDecorate(this, null, _propertyContent_decorators, { kind: "accessor", name: "propertyContent", static: false, private: false, access: { has: obj => "propertyContent" in obj, get: obj => obj.propertyContent, set: (obj, value) => { obj.propertyContent = value; } }, metadata: _metadata }, _propertyContent_initializers, _propertyContent_extraInitializers);
116
+ __esDecorate(this, null, _editingProperties_decorators, { kind: "accessor", name: "editingProperties", static: false, private: false, access: { has: obj => "editingProperties" in obj, get: obj => obj.editingProperties, set: (obj, value) => { obj.editingProperties = value; } }, metadata: _metadata }, _editingProperties_initializers, _editingProperties_extraInitializers);
117
+ __esDecorate(this, null, _showRecordingPanel_decorators, { kind: "accessor", name: "showRecordingPanel", static: false, private: false, access: { has: obj => "showRecordingPanel" in obj, get: obj => obj.showRecordingPanel, set: (obj, value) => { obj.showRecordingPanel = value; } }, metadata: _metadata }, _showRecordingPanel_initializers, _showRecordingPanel_extraInitializers);
118
+ __esDecorate(this, null, _isRecording_decorators, { kind: "accessor", name: "isRecording", static: false, private: false, access: { has: obj => "isRecording" in obj, get: obj => obj.isRecording, set: (obj, value) => { obj.isRecording = value; } }, metadata: _metadata }, _isRecording_initializers, _isRecording_extraInitializers);
119
+ __esDecorate(this, null, _recordingDuration_decorators, { kind: "accessor", name: "recordingDuration", static: false, private: false, access: { has: obj => "recordingDuration" in obj, get: obj => obj.recordingDuration, set: (obj, value) => { obj.recordingDuration = value; } }, metadata: _metadata }, _recordingDuration_initializers, _recordingDuration_extraInitializers);
120
+ __esDecorate(this, null, _isHidden_decorators, { kind: "accessor", name: "isHidden", static: false, private: false, access: { has: obj => "isHidden" in obj, get: obj => obj.isHidden, set: (obj, value) => { obj.isHidden = value; } }, metadata: _metadata }, _isHidden_initializers, _isHidden_extraInitializers);
121
+ __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
122
+ WccProperties = _classThis = _classDescriptor.value;
123
+ if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
124
+ __runInitializers(_classThis, _classExtraInitializers);
125
+ }
126
+ #dashboardRef_accessor_storage = __runInitializers(this, _dashboardRef_initializers, void 0);
127
+ get dashboardRef() { return this.#dashboardRef_accessor_storage; }
128
+ set dashboardRef(value) { this.#dashboardRef_accessor_storage = value; }
129
+ #selectedItem_accessor_storage = (__runInitializers(this, _dashboardRef_extraInitializers), __runInitializers(this, _selectedItem_initializers, void 0));
130
+ get selectedItem() { return this.#selectedItem_accessor_storage; }
131
+ set selectedItem(value) { this.#selectedItem_accessor_storage = value; }
132
+ #selectedViewport_accessor_storage = (__runInitializers(this, _selectedItem_extraInitializers), __runInitializers(this, _selectedViewport_initializers, 'native'));
133
+ get selectedViewport() { return this.#selectedViewport_accessor_storage; }
134
+ set selectedViewport(value) { this.#selectedViewport_accessor_storage = value; }
135
+ #selectedTheme_accessor_storage = (__runInitializers(this, _selectedViewport_extraInitializers), __runInitializers(this, _selectedTheme_initializers, 'dark'));
136
+ get selectedTheme() { return this.#selectedTheme_accessor_storage; }
137
+ set selectedTheme(value) { this.#selectedTheme_accessor_storage = value; }
138
+ #warning_accessor_storage = (__runInitializers(this, _selectedTheme_extraInitializers), __runInitializers(this, _warning_initializers, null));
139
+ get warning() { return this.#warning_accessor_storage; }
140
+ set warning(value) { this.#warning_accessor_storage = value; }
141
+ #isNative_accessor_storage = (__runInitializers(this, _warning_extraInitializers), __runInitializers(this, _isNative_initializers, false));
142
+ get isNative() { return this.#isNative_accessor_storage; }
143
+ set isNative(value) { this.#isNative_accessor_storage = value; }
144
+ #sidebarWidth_accessor_storage = (__runInitializers(this, _isNative_extraInitializers), __runInitializers(this, _sidebarWidth_initializers, 200));
145
+ get sidebarWidth() { return this.#sidebarWidth_accessor_storage; }
146
+ set sidebarWidth(value) { this.#sidebarWidth_accessor_storage = value; }
147
+ #propertyContent_accessor_storage = (__runInitializers(this, _sidebarWidth_extraInitializers), __runInitializers(this, _propertyContent_initializers, []));
148
+ get propertyContent() { return this.#propertyContent_accessor_storage; }
149
+ set propertyContent(value) { this.#propertyContent_accessor_storage = value; }
150
+ #editingProperties_accessor_storage = (__runInitializers(this, _propertyContent_extraInitializers), __runInitializers(this, _editingProperties_initializers, []));
151
+ get editingProperties() { return this.#editingProperties_accessor_storage; }
152
+ set editingProperties(value) { this.#editingProperties_accessor_storage = value; }
153
+ #showRecordingPanel_accessor_storage = (__runInitializers(this, _editingProperties_extraInitializers), __runInitializers(this, _showRecordingPanel_initializers, false));
154
+ // Recording coordination state
155
+ get showRecordingPanel() { return this.#showRecordingPanel_accessor_storage; }
156
+ set showRecordingPanel(value) { this.#showRecordingPanel_accessor_storage = value; }
157
+ #isRecording_accessor_storage = (__runInitializers(this, _showRecordingPanel_extraInitializers), __runInitializers(this, _isRecording_initializers, false));
158
+ get isRecording() { return this.#isRecording_accessor_storage; }
159
+ set isRecording(value) { this.#isRecording_accessor_storage = value; }
160
+ #recordingDuration_accessor_storage = (__runInitializers(this, _isRecording_extraInitializers), __runInitializers(this, _recordingDuration_initializers, 0));
161
+ get recordingDuration() { return this.#recordingDuration_accessor_storage; }
162
+ set recordingDuration(value) { this.#recordingDuration_accessor_storage = value; }
163
+ #isHidden_accessor_storage = (__runInitializers(this, _recordingDuration_extraInitializers), __runInitializers(this, _isHidden_initializers, false));
164
+ // Delayed hide for native mode transition
165
+ get isHidden() { return this.#isHidden_accessor_storage; }
166
+ set isHidden(value) { this.#isHidden_accessor_storage = value; }
167
+ editorHeight = (__runInitializers(this, _isHidden_extraInitializers), 300);
168
+ render() {
169
+ return html `
170
+ <style>
171
+ :host {
172
+ /* CSS Variables - Always dark theme */
173
+ --background: #0a0a0a;
174
+ --foreground: #e5e5e5;
175
+ --card: #0f0f0f;
176
+ --card-foreground: #f0f0f0;
177
+ --muted: #1a1a1a;
178
+ --muted-foreground: #666;
179
+ --accent: #222;
180
+ --accent-foreground: #fff;
181
+ --border: rgba(255, 255, 255, 0.06);
182
+ --input: #141414;
183
+ --primary: #3b82f6;
184
+ --primary-foreground: #fff;
185
+ --ring: #3b82f6;
186
+ --radius: 4px;
187
+ --radius-sm: 2px;
188
+ --radius-md: 4px;
189
+ --radius-lg: 6px;
190
+
191
+ /* Base styles */
192
+ font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
193
+ box-sizing: border-box;
194
+ position: absolute;
195
+ left: ${this.sidebarWidth}px;
196
+ height: ${this.editingProperties.length > 0 ? 100 + this.editorHeight : 100}px;
197
+ bottom: 0px;
198
+ right: 0px;
199
+ overflow: hidden;
200
+ background: var(--background);
201
+ color: var(--foreground);
202
+ display: ${this.isHidden ? 'none' : 'block'};
203
+ }
204
+ .grid {
205
+ display: grid;
206
+ grid-template-columns: 1fr 150px 350px 100px;
207
+ height: 100%;
208
+ }
209
+ .properties {
210
+ background: transparent;
211
+ overflow-y: auto;
212
+ display: grid;
213
+ grid-template-columns: repeat(3, 1fr);
214
+ border-right: 1px solid var(--border);
215
+ align-content: start;
216
+ }
217
+
218
+ .material-symbols-outlined {
219
+ font-family: 'Material Symbols Outlined';
220
+ font-weight: normal;
221
+ font-style: normal;
222
+ font-size: 24px; /* Preferred icon size */
223
+ display: inline-block;
224
+ line-height: 1;
225
+ text-transform: none;
226
+ letter-spacing: normal;
227
+ word-wrap: normal;
228
+ white-space: nowrap;
229
+ direction: ltr;
230
+ font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 48;
231
+ }
232
+
233
+ .properties .property {
234
+ padding: 0.4rem;
235
+ background: transparent;
236
+ border-right: 1px solid var(--border);
237
+ border-bottom: 1px solid var(--border);
238
+ transition: all 0.15s ease;
239
+ }
240
+
241
+ .properties .property:hover {
242
+ background: rgba(255, 255, 255, 0.02);
243
+ }
244
+
245
+ .properties .property-label {
246
+ font-size: 0.65rem;
247
+ font-weight: 400;
248
+ color: #888;
249
+ margin-bottom: 0.2rem;
250
+ text-transform: capitalize;
251
+ white-space: nowrap;
252
+ overflow: hidden;
253
+ text-overflow: ellipsis;
254
+ }
255
+
256
+ .properties input[type="text"],
257
+ .properties input[type="number"],
258
+ .properties select {
259
+ display: block;
260
+ width: 100%;
261
+ padding: 0.25rem 0.4rem;
262
+ background: var(--input);
263
+ border: 1px solid transparent;
264
+ color: var(--foreground);
265
+ border-radius: var(--radius-sm);
266
+ font-size: 0.7rem;
267
+ transition: all 0.15s ease;
268
+ outline: none;
269
+ }
270
+
271
+ .properties input[type="text"]:focus,
272
+ .properties input[type="number"]:focus,
273
+ .properties select:focus {
274
+ border-color: var(--primary);
275
+ background: rgba(59, 130, 246, 0.1);
276
+ }
277
+
278
+ .properties input[type="checkbox"] {
279
+ width: 1rem;
280
+ height: 1rem;
281
+ cursor: pointer;
282
+ accent-color: var(--primary);
283
+ }
284
+
285
+ .properties .editor-button {
286
+ padding: 0.25rem 0.5rem;
287
+ background: var(--input);
288
+ border: 1px solid transparent;
289
+ border-radius: var(--radius-sm);
290
+ color: var(--foreground);
291
+ font-size: 0.7rem;
292
+ cursor: pointer;
293
+ transition: all 0.15s ease;
294
+ text-align: center;
295
+ }
296
+
297
+ .properties .editor-button:hover {
298
+ border-color: var(--primary);
299
+ background: rgba(59, 130, 246, 0.1);
300
+ }
301
+
302
+ .viewportSelector,
303
+ .themeSelector,
304
+ .shareSelector {
305
+ user-select: none;
306
+ background: transparent;
307
+ display: flex;
308
+ flex-direction: column;
309
+ border-right: 1px solid var(--border);
310
+ }
311
+ .selectorButtons2 {
312
+ display: grid;
313
+ grid-template-columns: repeat(2, minmax(0, 1fr));
314
+ flex: 1;
315
+ }
316
+ .selectorButtons4 {
317
+ display: grid;
318
+ grid-template-columns: repeat(4, minmax(0, 1fr));
319
+ flex: 1;
320
+ }
321
+ .selectorButtons5 {
322
+ display: grid;
323
+ grid-template-columns: repeat(5, minmax(0, 1fr));
324
+ flex: 1;
325
+ }
326
+ .selectorButtons1 {
327
+ display: grid;
328
+ grid-template-columns: minmax(0, 1fr);
329
+ flex: 1;
330
+ }
331
+ .button {
332
+ appearance: none;
333
+ margin: 0;
334
+ font-family: inherit;
335
+ line-height: 1.2;
336
+ display: flex;
337
+ flex-direction: column;
338
+ align-items: center;
339
+ justify-content: center;
340
+ padding: 0.5rem 0.25rem;
341
+ text-align: center;
342
+ background: transparent;
343
+ border: 1px solid var(--border);
344
+ transition: all 0.15s ease;
345
+ cursor: pointer;
346
+ font-size: 0.65rem;
347
+ gap: 0.2rem;
348
+ color: #999;
349
+ }
350
+
351
+ .button:hover {
352
+ background: rgba(59, 130, 246, 0.05);
353
+ color: #bbb;
354
+ }
355
+
356
+ .button.selected {
357
+ background: rgba(59, 130, 246, 0.15);
358
+ color: var(--primary);
359
+ border-color: rgba(59, 130, 246, 0.3);
360
+ }
361
+
362
+ .button.selected:hover {
363
+ background: rgba(59, 130, 246, 0.2);
364
+ }
365
+
366
+ .button:focus-visible,
367
+ .properties .editor-button:focus-visible,
368
+ .editor-close-all:focus-visible {
369
+ outline: 2px solid var(--ring);
370
+ outline-offset: -2px;
371
+ }
372
+
373
+ .properties input:focus-visible,
374
+ .properties select:focus-visible {
375
+ outline: 2px solid var(--ring);
376
+ outline-offset: 1px;
377
+ }
378
+
379
+ .button .material-symbols-outlined {
380
+ font-size: 18px;
381
+ font-variation-settings: 'FILL' 0, 'wght' 300;
382
+ min-width: 18px;
383
+ min-height: 18px;
384
+ display: inline-flex;
385
+ align-items: center;
386
+ justify-content: center;
387
+ }
388
+
389
+ .button.selected .material-symbols-outlined {
390
+ font-variation-settings: 'FILL' 1, 'wght' 400;
391
+ }
392
+
393
+ .panelheading {
394
+ padding: 0.3rem 0.5rem;
395
+ font-weight: 500;
396
+ font-size: 0.65rem;
397
+ background: rgba(59, 130, 246, 0.03);
398
+ border-bottom: 1px solid var(--border);
399
+ color: #888;
400
+ text-transform: uppercase;
401
+ letter-spacing: 0.08em;
402
+ }
403
+ .docs {
404
+ display: flex;
405
+ align-items: center;
406
+ justify-content: center;
407
+ text-transform: uppercase;
408
+ background: transparent;
409
+ cursor: pointer;
410
+ font-size: 0.65rem;
411
+ font-weight: 500;
412
+ letter-spacing: 0.08em;
413
+ transition: all 0.15s ease;
414
+ color: #666;
415
+ }
416
+
417
+ .docs:hover {
418
+ background: rgba(59, 130, 246, 0.05);
419
+ color: #999;
420
+ }
421
+
422
+ .warning {
423
+ position: absolute;
424
+ background: rgba(20, 20, 20, 0.8);
425
+ color: #888;
426
+ top: 0.5rem;
427
+ bottom: 0.5rem;
428
+ left: 0.5rem;
429
+ right: calc(600px + 0.5rem);
430
+ display: flex;
431
+ align-items: center;
432
+ justify-content: center;
433
+ padding: 1.5rem;
434
+ font-size: 0.85rem;
435
+ border-radius: var(--radius-md);
436
+ border: 1px solid var(--border);
437
+ backdrop-filter: blur(8px);
438
+ }
439
+
440
+ .advanced-editor-container {
441
+ position: absolute;
442
+ left: 0;
443
+ right: 0;
444
+ top: 0;
445
+ height: ${this.editorHeight}px;
446
+ background: #050505;
447
+ border-bottom: 1px solid rgba(255, 255, 255, 0.1);
448
+ display: flex;
449
+ flex-direction: column;
450
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
451
+ box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
452
+ }
453
+
454
+ .editor-header-bar {
455
+ padding: 0.5rem 0.75rem;
456
+ background: transparent;
457
+ border-bottom: 1px solid rgba(255, 255, 255, 0.05);
458
+ display: flex;
459
+ justify-content: space-between;
460
+ align-items: center;
461
+ height: 36px;
462
+ }
463
+
464
+ .editor-header-title {
465
+ font-size: 0.7rem;
466
+ font-weight: 500;
467
+ color: #666;
468
+ text-transform: uppercase;
469
+ letter-spacing: 0.08em;
470
+ }
471
+
472
+ .editor-close-all {
473
+ padding: 0.25rem 0.5rem;
474
+ background: transparent;
475
+ border: 1px solid rgba(255, 255, 255, 0.08);
476
+ border-radius: var(--radius-sm);
477
+ color: #999;
478
+ font-size: 0.65rem;
479
+ font-weight: 500;
480
+ cursor: pointer;
481
+ transition: all 0.15s ease;
482
+ }
483
+
484
+ .editor-close-all:hover {
485
+ background: rgba(255, 255, 255, 0.05);
486
+ border-color: rgba(255, 255, 255, 0.12);
487
+ color: #f87171;
488
+ }
489
+
490
+ .editors-container {
491
+ flex: 1;
492
+ display: flex;
493
+ overflow-x: auto;
494
+ overflow-y: hidden;
495
+ gap: 0;
496
+ background: rgba(255, 255, 255, 0.02);
497
+ padding: 0.75rem;
498
+ }
499
+
500
+ .editors-container::-webkit-scrollbar {
501
+ height: 8px;
502
+ }
503
+
504
+ .editors-container::-webkit-scrollbar-track {
505
+ background: rgba(255, 255, 255, 0.02);
506
+ border-radius: 4px;
507
+ }
508
+
509
+ .editors-container::-webkit-scrollbar-thumb {
510
+ background: rgba(255, 255, 255, 0.08);
511
+ border-radius: 4px;
512
+ }
513
+
514
+ .editors-container::-webkit-scrollbar-thumb:hover {
515
+ background: rgba(255, 255, 255, 0.12);
516
+ }
517
+
518
+ .editor-instance {
519
+ min-width: 320px;
520
+ flex: 1;
521
+ max-width: 480px;
522
+ background: rgba(10, 10, 10, 0.6);
523
+ display: flex;
524
+ flex-direction: column;
525
+ border-radius: var(--radius);
526
+ overflow: hidden;
527
+ margin-right: 0.75rem;
528
+ border: 1px solid rgba(255, 255, 255, 0.06);
529
+ transition: all 0.2s ease;
530
+ }
531
+
532
+ .editor-instance:hover {
533
+ border-color: rgba(255, 255, 255, 0.1);
534
+ }
535
+
536
+ .editor-instance:last-child {
537
+ margin-right: 0;
538
+ }
539
+
540
+ .editor-header {
541
+ padding: 0.5rem 0.75rem;
542
+ background: rgba(255, 255, 255, 0.02);
543
+ border-bottom: 1px solid rgba(255, 255, 255, 0.05);
544
+ display: flex;
545
+ justify-content: space-between;
546
+ align-items: center;
547
+ height: 36px;
548
+ }
549
+
550
+ .editor-title {
551
+ font-size: 0.75rem;
552
+ font-weight: 500;
553
+ color: #999;
554
+ overflow: hidden;
555
+ text-overflow: ellipsis;
556
+ white-space: nowrap;
557
+ font-family: 'Consolas', 'Monaco', monospace;
558
+ }
559
+
560
+ .editor-actions {
561
+ display: flex;
562
+ gap: 0.25rem;
563
+ }
564
+
565
+ .editor-button {
566
+ width: 24px;
567
+ height: 24px;
568
+ padding: 0;
569
+ background: transparent;
570
+ border: none;
571
+ color: #666;
572
+ font-size: 1rem;
573
+ cursor: pointer;
574
+ transition: all 0.15s ease;
575
+ border-radius: var(--radius-sm);
576
+ display: flex;
577
+ align-items: center;
578
+ justify-content: center;
579
+ }
580
+
581
+ .editor-button:hover {
582
+ background: rgba(255, 255, 255, 0.05);
583
+ color: #999;
584
+ }
585
+
586
+ .editor-button.primary {
587
+ color: #4ade80;
588
+ }
589
+
590
+ .editor-button.primary:hover {
591
+ background: rgba(74, 222, 128, 0.1);
592
+ }
593
+
594
+ .editor-content {
595
+ flex: 1;
596
+ display: flex;
597
+ flex-direction: column;
598
+ overflow: hidden;
599
+ min-height: 0;
600
+ position: relative;
601
+ }
602
+
603
+ .editor-textarea {
604
+ width: 100%;
605
+ height: 100%;
606
+ background: transparent;
607
+ border: none;
608
+ color: #d0d0d0;
609
+ font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
610
+ font-size: 0.8125rem;
611
+ line-height: 1.6;
612
+ padding: 0.75rem;
613
+ resize: none;
614
+ outline: none;
615
+ transition: all 0.15s ease;
616
+ overflow: auto;
617
+ }
618
+
619
+ .editor-textarea:focus {
620
+ background: rgba(255, 255, 255, 0.01);
621
+ }
622
+
623
+ .editor-textarea::selection {
624
+ background: rgba(59, 130, 246, 0.3);
625
+ }
626
+
627
+ .editor-error {
628
+ position: absolute;
629
+ bottom: 0;
630
+ left: 0;
631
+ right: 0;
632
+ padding: 0.5rem 0.75rem;
633
+ background: rgba(239, 68, 68, 0.9);
634
+ backdrop-filter: blur(4px);
635
+ color: #fff;
636
+ font-size: 0.7rem;
637
+ font-weight: 500;
638
+ display: flex;
639
+ align-items: center;
640
+ gap: 0.375rem;
641
+ border-top: 1px solid rgba(239, 68, 68, 0.5);
642
+ }
643
+
644
+ .editor-error::before {
645
+ content: '!';
646
+ display: inline-flex;
647
+ width: 16px;
648
+ height: 16px;
649
+ align-items: center;
650
+ justify-content: center;
651
+ background: rgba(255, 255, 255, 0.2);
652
+ border-radius: 50%;
653
+ font-size: 0.65rem;
654
+ font-weight: bold;
655
+ }
656
+
657
+ .main-content {
658
+ position: absolute;
659
+ left: 0;
660
+ right: 0;
661
+ bottom: 0;
662
+ height: 100px;
663
+ }
664
+
665
+ @container wccDashboard (max-width: 600px) {
666
+ :host {
667
+ left: 0;
668
+ height: ${this.editingProperties.length > 0 ? 160 + this.editorHeight : 160}px;
669
+ }
670
+
671
+ .main-content {
672
+ height: 160px;
673
+ }
674
+
675
+ .grid {
676
+ grid-template-columns: minmax(90px, 2fr) minmax(0, 5fr) minmax(52px, 1fr);
677
+ grid-template-rows: 60px 100px;
678
+ }
679
+
680
+ .properties {
681
+ grid-column: 1 / -1;
682
+ grid-row: 1;
683
+ display: flex;
684
+ overflow-x: auto;
685
+ overflow-y: hidden;
686
+ border-right: 0;
687
+ border-bottom: 1px solid var(--border);
688
+ }
689
+
690
+ .properties .property {
691
+ flex: 0 0 120px;
692
+ min-width: 0;
693
+ }
694
+
695
+ .themeSelector {
696
+ grid-column: 1;
697
+ grid-row: 2;
698
+ }
699
+
700
+ .viewportSelector {
701
+ grid-column: 2;
702
+ grid-row: 2;
703
+ }
704
+
705
+ .shareSelector {
706
+ grid-column: 3;
707
+ grid-row: 2;
708
+ }
709
+
710
+ .themeSelector,
711
+ .viewportSelector,
712
+ .shareSelector {
713
+ min-width: 0;
714
+ }
715
+
716
+ .button {
717
+ min-width: 0;
718
+ overflow: hidden;
719
+ padding: 0.25rem 0.1rem;
720
+ font-size: 0.55rem;
721
+ }
722
+
723
+ .panelheading {
724
+ overflow: hidden;
725
+ padding: 0.3rem 0.25rem;
726
+ text-overflow: ellipsis;
727
+ white-space: nowrap;
728
+ }
729
+
730
+ .warning {
731
+ top: 0.25rem;
732
+ right: 0.25rem;
733
+ bottom: calc(100px + 0.25rem);
734
+ left: 0.25rem;
735
+ padding: 0.5rem;
736
+ }
737
+ }
738
+ </style>
739
+ ${this.editingProperties.length > 0 ? html `
740
+ <div class="advanced-editor-container">
741
+ <div class="editor-header-bar">
742
+ <div class="editor-header-title">Property Editors</div>
743
+ <button class="editor-close-all" @click=${this.closeAllEditors}>
744
+ Close All
745
+ </button>
746
+ </div>
747
+ <div class="editors-container">
748
+ ${this.editingProperties.length === 0 ? html `
749
+ <div style="
750
+ flex: 1;
751
+ display: flex;
752
+ align-items: center;
753
+ justify-content: center;
754
+ color: #666;
755
+ font-size: 0.875rem;
756
+ text-align: center;
757
+ padding: 2rem;
758
+ ">
759
+ <div>
760
+ <div style="margin-bottom: 0.5rem; font-size: 1.5rem; opacity: 0.5;">{ }</div>
761
+ <div>No properties being edited</div>
762
+ <div style="font-size: 0.75rem; margin-top: 0.25rem; opacity: 0.7;">Click "Edit Object/Array" buttons to start editing</div>
763
+ </div>
764
+ </div>
765
+ ` : null}
766
+ ${this.editingProperties.map(prop => html `
767
+ <div class="editor-instance">
768
+ <div class="editor-header">
769
+ <div class="editor-title">${prop.name}</div>
770
+ <div class="editor-actions">
771
+ <button class="editor-button" @click=${() => this.handleEditorCancel(prop.id)}>✕</button>
772
+ <button class="editor-button primary" @click=${() => this.handleEditorSave(prop.id)}>✓</button>
773
+ </div>
774
+ </div>
775
+ <div class="editor-content">
776
+ <textarea
777
+ class="editor-textarea"
778
+ .value=${prop.editorValue}
779
+ @input=${(e) => {
780
+ const editor = this.editingProperties.find(p => p.id === prop.id);
781
+ if (editor) {
782
+ editor.editorValue = e.target.value;
783
+ editor.editorError = '';
784
+ this.requestUpdate();
785
+ }
786
+ }}
787
+ @keydown=${(e) => {
788
+ if (e.key === 'Tab') {
789
+ e.preventDefault();
790
+ const target = e.target;
791
+ const start = target.selectionStart;
792
+ const end = target.selectionEnd;
793
+ const value = target.value;
794
+ target.value = value.substring(0, start) + ' ' + value.substring(end);
795
+ target.selectionStart = target.selectionEnd = start + 2;
796
+ }
797
+ }}
798
+ ></textarea>
799
+ ${prop.editorError ? html `
800
+ <div class="editor-error">${prop.editorError}</div>
801
+ ` : null}
802
+ </div>
803
+ </div>
804
+ `)}
805
+ </div>
806
+ </div>
807
+ ` : null}
808
+ <div class="main-content">
809
+ <div class="grid">
810
+ <div class="properties" role="group" aria-label="Properties">
811
+ ${this.propertyContent}
812
+ </div>
813
+ <div class="themeSelector" role="group" aria-labelledby="wcc-theme-heading">
814
+ <div class="panelheading" id="wcc-theme-heading">Theme</div>
815
+ <div class="selectorButtons2">
816
+ ${[
817
+ ['dark', 'Dark', 'brightness_3'],
818
+ ['bright', 'Bright', 'flare'],
819
+ ].map(([theme, label, icon]) => html `
820
+ <button
821
+ type="button"
822
+ class="button ${this.selectedTheme === theme ? 'selected' : ''}"
823
+ aria-pressed=${this.selectedTheme === theme ? 'true' : 'false'}
824
+ @click=${() => this.selectTheme(theme)}
825
+ >
826
+ ${label}<i class="material-symbols-outlined" aria-hidden="true">${icon}</i>
827
+ </button>
828
+ `)}
829
+ </div>
830
+ </div>
831
+ <div class="viewportSelector" role="group" aria-labelledby="wcc-viewport-heading">
832
+ <div class="panelheading" id="wcc-viewport-heading">Viewport</div>
833
+ <div class="selectorButtons5">
834
+ ${[
835
+ ['phone', 'Phone', 'smartphone'],
836
+ ['phablet', 'Phablet', 'smartphone'],
837
+ ['tablet', 'Tablet', 'tablet'],
838
+ ['desktop', 'Desktop', 'desktop_windows'],
839
+ ['native', 'Native', 'fullscreen'],
840
+ ].map(([viewport, label, icon]) => html `
841
+ <button
842
+ type="button"
843
+ class="button ${this.selectedViewport === viewport ? 'selected' : ''}"
844
+ aria-pressed=${this.selectedViewport === viewport ? 'true' : 'false'}
845
+ @click=${() => this.selectViewport(viewport)}
846
+ >
847
+ ${label}<i class="material-symbols-outlined" aria-hidden="true">${icon}</i>
848
+ </button>
849
+ `)}
850
+ </div>
851
+ </div>
852
+ <div class="shareSelector" role="group" aria-labelledby="wcc-share-heading">
853
+ <div class="panelheading" id="wcc-share-heading">Share</div>
854
+ <div class="selectorButtons1">
855
+ <button
856
+ type="button"
857
+ class="button ${this.isRecording ? 'selected' : ''}"
858
+ aria-expanded=${this.showRecordingPanel ? 'true' : 'false'}
859
+ @click=${() => this.handleRecordButtonClick()}
860
+ >
861
+ ${this.isRecording ? 'Stop' : 'Record'}<i class="material-symbols-outlined" aria-hidden="true">${this.isRecording ? 'stop_circle' : 'videocam'}</i>
862
+ </button>
863
+ </div>
864
+ </div>
865
+ </div>
866
+ ${this.warning ? html `<div class="warning">${this.warning}</div>` : null}
867
+ </div>
868
+
869
+ <!-- Recording Panel (options + preview) -->
870
+ ${this.showRecordingPanel ? html `
871
+ <wcc-recording-panel
872
+ .dashboardRef=${this.dashboardRef}
873
+ @recording-start=${() => { this.isRecording = true; }}
874
+ @recording-stop=${() => { this.isRecording = false; }}
875
+ @duration-update=${(e) => { this.recordingDuration = e.detail.duration; }}
876
+ @close=${() => { this.showRecordingPanel = false; this.isRecording = false; this.recordingDuration = 0; }}
877
+ ></wcc-recording-panel>
878
+ ` : null}
879
+ `;
880
+ }
881
+ async createProperties() {
882
+ // Clear any previous warnings
883
+ this.warning = null;
884
+ if (!this.selectedItem) {
885
+ this.propertyContent = [];
886
+ return;
887
+ }
888
+ const getEnumValues = (propertyArg) => {
889
+ const enumValues = [];
890
+ Object.keys(propertyArg.type).forEach((valueArg) => {
891
+ enumValues.push(valueArg);
892
+ });
893
+ return enumValues;
894
+ };
895
+ if (this.selectedItem && this.selectedItem.demo) {
896
+ const anonItem = this.selectedItem;
897
+ if (!anonItem) {
898
+ this.warning = 'no element selected';
899
+ return;
900
+ }
901
+ const wccFrame = await this.dashboardRef.wccFrame;
902
+ // Wait for render to complete and any demo wrappers to run
903
+ await new Promise(resolve => setTimeout(resolve, 200));
904
+ // Try to find the element with recursive search
905
+ const viewport = await wccFrame.getViewportElement();
906
+ let firstFoundInstantiatedElement = findElementInstance(viewport, this.selectedItem);
907
+ // Retry logic if element not found
908
+ let retries = 0;
909
+ while (!firstFoundInstantiatedElement && retries < 5) {
910
+ await new Promise(resolve => setTimeout(resolve, 200));
911
+ try {
912
+ firstFoundInstantiatedElement = findElementInstance(viewport, this.selectedItem);
913
+ }
914
+ catch (error) {
915
+ console.error('Error during element search retry:', error);
916
+ }
917
+ retries++;
918
+ }
919
+ if (!firstFoundInstantiatedElement) {
920
+ this.warning = `no first instantiated element found for >>${anonItem.name}<< after ${retries} retries`;
921
+ this.propertyContent = [];
922
+ return;
923
+ }
924
+ const classProperties = anonItem.elementProperties;
925
+ if (!classProperties) {
926
+ this.warning = `selected element >>${anonItem.name}<< does not expose element properties`;
927
+ return;
928
+ }
929
+ this.warning = null;
930
+ const propertyArray = [];
931
+ for (const [key, property] of classProperties) {
932
+ if (typeof key !== 'string' || key.startsWith('#') || key === 'goBright' || key === 'domtools') {
933
+ continue;
934
+ }
935
+ const propertyTypeString = determinePropertyType(property);
936
+ if (!propertyTypeString) {
937
+ continue;
938
+ }
939
+ propertyArray.push(html `
940
+ <div class="property">
941
+ <div class="property-label">${key} (${propertyTypeString})</div>
942
+ ${(() => {
943
+ switch (propertyTypeString) {
944
+ case 'Boolean':
945
+ return html `<input
946
+ aria-label=${key}
947
+ type="checkbox"
948
+ ?checked=${firstFoundInstantiatedElement[key]}
949
+ @input="${(eventArg) => {
950
+ firstFoundInstantiatedElement[key] = eventArg.target.checked;
951
+ }}"
952
+ />`;
953
+ case 'String':
954
+ return html `<input
955
+ aria-label=${key}
956
+ type="text"
957
+ .value=${firstFoundInstantiatedElement[key] || ''}
958
+ @input="${(eventArg) => {
959
+ firstFoundInstantiatedElement[key] = eventArg.target.value;
960
+ }}"
961
+ />`;
962
+ case 'Number':
963
+ return html `<input
964
+ aria-label=${key}
965
+ type="number"
966
+ .value=${firstFoundInstantiatedElement[key] ?? ''}
967
+ @input="${(eventArg) => {
968
+ firstFoundInstantiatedElement[key] = parseFloat(eventArg.target.value) || 0;
969
+ }}"
970
+ />`;
971
+ case 'Enum':
972
+ const enumValues = getEnumValues(property);
973
+ return html `<select
974
+ aria-label=${key}
975
+ .value=${firstFoundInstantiatedElement[key] || ''}
976
+ @change="${(eventArg) => {
977
+ firstFoundInstantiatedElement[key] = eventArg.target.value;
978
+ }}"
979
+ >
980
+ ${enumValues.map((valueArg) => {
981
+ return html `
982
+ <option
983
+ value="${valueArg}"
984
+ >
985
+ ${valueArg}
986
+ </option>
987
+ `;
988
+ })}
989
+ </select>`;
990
+ case 'Object':
991
+ case 'Array':
992
+ return html `<button
993
+ type="button"
994
+ aria-label=${`Edit ${key}`}
995
+ class="editor-button"
996
+ style="width: 100%; margin-top: 0.25rem;"
997
+ @click="${() => this.openAdvancedEditor(key, firstFoundInstantiatedElement[key], firstFoundInstantiatedElement)}"
998
+ >
999
+ Edit ${propertyTypeString}
1000
+ </button>`;
1001
+ default:
1002
+ return html `<div style="color: #666; font-size: 0.7rem;">Unsupported type</div>`;
1003
+ }
1004
+ })()}
1005
+ </div>
1006
+ `);
1007
+ }
1008
+ this.propertyContent = propertyArray;
1009
+ }
1010
+ else {
1011
+ this.propertyContent = [];
1012
+ this.warning = `You selected a page.`;
1013
+ return null;
1014
+ }
1015
+ }
1016
+ selectTheme(themeArg) {
1017
+ this.selectedTheme = themeArg;
1018
+ this.dispatchEvent(new CustomEvent('selectedTheme', {
1019
+ detail: themeArg,
1020
+ }));
1021
+ this.dashboardRef.buildUrl();
1022
+ }
1023
+ updated(changedProperties) {
1024
+ super.updated(changedProperties);
1025
+ // Handle delayed hide for native mode transition
1026
+ if (changedProperties.has('isNative')) {
1027
+ if (this.isNative) {
1028
+ // Delay hiding until frame animation completes
1029
+ setTimeout(() => {
1030
+ this.isHidden = true;
1031
+ }, 300);
1032
+ }
1033
+ else {
1034
+ // Show immediately when exiting native mode
1035
+ this.isHidden = false;
1036
+ }
1037
+ }
1038
+ // Only recreate properties when selectedItem changes
1039
+ if (changedProperties.has('selectedItem')) {
1040
+ this.createProperties().catch(error => {
1041
+ console.error('Error creating properties:', error);
1042
+ this.propertyContent = [];
1043
+ });
1044
+ }
1045
+ }
1046
+ selectViewport(viewport) {
1047
+ this.selectedViewport = viewport;
1048
+ setEnvironment(viewport);
1049
+ this.dispatchEvent(new CustomEvent('selectedViewport', {
1050
+ detail: viewport,
1051
+ }));
1052
+ this.dashboardRef.buildUrl();
1053
+ }
1054
+ openAdvancedEditor(propertyName, value, element) {
1055
+ // Check if this property is already being edited
1056
+ const existingEditor = this.editingProperties.find(p => p.name === propertyName && p.element === element);
1057
+ if (existingEditor) {
1058
+ return; // Property is already open for editing
1059
+ }
1060
+ const newEditor = {
1061
+ id: `${propertyName}-${Date.now()}`,
1062
+ name: propertyName,
1063
+ value: value,
1064
+ element: element,
1065
+ editorValue: JSON.stringify(value, null, 2),
1066
+ editorError: ''
1067
+ };
1068
+ this.editingProperties = [...this.editingProperties, newEditor];
1069
+ // Notify parent to resize frame if this is the first editor
1070
+ if (this.editingProperties.length === 1) {
1071
+ this.dispatchEvent(new CustomEvent('editorStateChanged', {
1072
+ detail: { isOpen: true },
1073
+ bubbles: true
1074
+ }));
1075
+ }
1076
+ }
1077
+ handleEditorSave(editorId) {
1078
+ const editor = this.editingProperties.find(p => p.id === editorId);
1079
+ if (!editor)
1080
+ return;
1081
+ try {
1082
+ const parsedValue = JSON.parse(editor.editorValue);
1083
+ editor.element[editor.name] = parsedValue;
1084
+ // Remove this editor from the list
1085
+ this.editingProperties = this.editingProperties.filter(p => p.id !== editorId);
1086
+ // If no more editors, notify parent to resize frame
1087
+ if (this.editingProperties.length === 0) {
1088
+ this.dispatchEvent(new CustomEvent('editorStateChanged', {
1089
+ detail: { isOpen: false },
1090
+ bubbles: true
1091
+ }));
1092
+ }
1093
+ // Refresh properties display
1094
+ this.createProperties();
1095
+ }
1096
+ catch (error) {
1097
+ // Update error for this specific editor
1098
+ const editorIndex = this.editingProperties.findIndex(p => p.id === editorId);
1099
+ if (editorIndex !== -1) {
1100
+ this.editingProperties[editorIndex].editorError = `Invalid JSON: ${error.message}`;
1101
+ this.requestUpdate();
1102
+ }
1103
+ }
1104
+ }
1105
+ handleEditorCancel(editorId) {
1106
+ // Remove this editor from the list
1107
+ this.editingProperties = this.editingProperties.filter(p => p.id !== editorId);
1108
+ // If no more editors, notify parent to resize frame
1109
+ if (this.editingProperties.length === 0) {
1110
+ this.dispatchEvent(new CustomEvent('editorStateChanged', {
1111
+ detail: { isOpen: false },
1112
+ bubbles: true
1113
+ }));
1114
+ }
1115
+ }
1116
+ closeAllEditors() {
1117
+ this.editingProperties = [];
1118
+ // Notify parent to resize frame back
1119
+ this.dispatchEvent(new CustomEvent('editorStateChanged', {
1120
+ detail: { isOpen: false },
1121
+ bubbles: true
1122
+ }));
1123
+ }
1124
+ toggleNative() {
1125
+ this.dispatchEvent(new CustomEvent('toggleNative', {
1126
+ bubbles: true
1127
+ }));
1128
+ }
1129
+ // ==================== Recording Methods ====================
1130
+ handleRecordButtonClick() {
1131
+ if (this.isRecording) {
1132
+ // Stop recording by calling the panel's stopRecording method
1133
+ const panel = this.shadowRoot?.querySelector('wcc-recording-panel');
1134
+ if (panel && panel.stopRecording) {
1135
+ panel.stopRecording();
1136
+ }
1137
+ }
1138
+ else {
1139
+ // Toggle the recording panel
1140
+ this.showRecordingPanel = !this.showRecordingPanel;
1141
+ }
1142
+ }
1143
+ };
1144
+ return WccProperties = _classThis;
1145
+ })();
1146
+ export { WccProperties };
1147
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2NjLXByb3BlcnRpZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi90c193ZWIvZWxlbWVudHMvd2NjLXByb3BlcnRpZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUFBLE9BQU8sRUFBRSxXQUFXLEVBQUUsUUFBUSxFQUFFLElBQUksRUFBRSxhQUFhLEVBQXVCLEtBQUssRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBQ3JILE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUNsRCxPQUFPLEVBQUUscUJBQXFCLEVBQUUsbUJBQW1CLEVBQTZDLE1BQU0sdUJBQXVCLENBQUM7QUFDOUgsT0FBTyx3QkFBd0IsQ0FBQztBQUNoQyxPQUFPLDBCQUEwQixDQUFDO0FBT2xDLElBQUksV0FBVyxHQUFpQixRQUFRLENBQUM7QUFFekMsTUFBTSxDQUFDLE1BQU0sY0FBYyxHQUFHLENBQUMsTUFBTSxFQUFFLEVBQUU7SUFDdkMsV0FBVyxHQUFHLE1BQU0sQ0FBQztBQUN2QixDQUFDLENBQUM7SUFHVyxhQUFhOzRCQUR6QixhQUFhLENBQUMsZ0JBQWdCLENBQUM7Ozs7c0JBQ0csV0FBVzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs2QkFBbkIsU0FBUSxXQUFXOzs7O3dDQUMzQyxRQUFRLENBQUM7b0JBQ1IsSUFBSSxFQUFFLFlBQVk7aUJBQ25CLENBQUM7d0NBR0QsUUFBUSxFQUFFOzRDQUdWLFFBQVEsRUFBRTt5Q0FHVixRQUFRLEVBQUU7bUNBR1YsUUFBUSxFQUFFO29DQUdWLFFBQVEsRUFBRTt3Q0FHVixRQUFRLENBQUMsRUFBRSxJQUFJLEVBQUUsTUFBTSxFQUFFLENBQUM7MkNBRzFCLEtBQUssRUFBRTs2Q0FHUCxLQUFLLEVBQUU7OENBV1AsS0FBSyxFQUFFO3VDQUdQLEtBQUssRUFBRTs2Q0FHUCxLQUFLLEVBQUU7b0NBSVAsS0FB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