@allternit/ix 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +6 -6
- package/dist/adapters/json-render.d.ts +5 -5
- package/dist/adapters/json-render.js +12 -12
- package/dist/collab/visual-editor.d.ts +1 -1
- package/dist/collab/visual-editor.js +4 -4
- package/dist/collab/visual-editor.js.map +1 -1
- package/dist/collab/yjs-adapter.d.ts +1 -1
- package/dist/collab/yjs-adapter.js +2 -2
- package/dist/collab/yjs-adapter.js.map +1 -1
- package/dist/collab/yjs-client.js +1 -1
- package/dist/collab/yjs-client.js.map +1 -1
- package/dist/collab/yjs-types.js +1 -1
- package/dist/collab/yjs-types.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/pipeline/llm-to-ix.d.ts +5 -5
- package/dist/pipeline/llm-to-ix.d.ts.map +1 -1
- package/dist/pipeline/llm-to-ix.js +6 -6
- package/dist/react/renderer.d.ts +2 -2
- package/dist/react/renderer.js +3 -3
- package/dist/react/renderer.js.map +1 -1
- package/dist/renderer/renderer.d.ts +1 -1
- package/dist/renderer/renderer.js +1 -1
- package/dist/runtime/capsule-runtime.d.ts +1 -1
- package/dist/runtime/capsule-runtime.js +1 -1
- package/dist/sdk/api.d.ts +3 -3
- package/dist/sdk/api.js +3 -3
- package/dist/sdk/index.d.ts +2 -2
- package/dist/sdk/index.js +2 -2
- package/dist/sdk/react.d.ts +2 -2
- package/dist/sdk/react.js +2 -2
- package/dist/state/index.d.ts +1 -1
- package/dist/state/index.js +1 -1
- package/dist/state/store.d.ts +1 -1
- package/dist/state/store.js +3 -3
- package/dist/state/store.js.map +1 -1
- package/dist/svelte/index.d.ts +1 -1
- package/dist/svelte/index.js +1 -1
- package/dist/svelte/renderer.d.ts +3 -3
- package/dist/svelte/renderer.js +4 -4
- package/dist/svelte/renderer.js.map +1 -1
- package/dist/types/index.d.ts +1 -1
- package/dist/types/index.js +1 -1
- package/dist/vue/renderer.d.ts +3 -3
- package/dist/vue/renderer.js +5 -5
- package/dist/vue/renderer.js.map +1 -1
- package/package.json +8 -8
- package/dist/adapters/json-render.d.ts.bak +0 -211
- package/dist/adapters/json-render.js.bak +0 -576
- package/dist/catalog/registry.d.ts.bak +0 -65
- package/dist/catalog/registry.js.bak +0 -388
- package/dist/collab/capsule-registry.d.ts.bak +0 -114
- package/dist/collab/capsule-registry.js.bak +0 -271
- package/dist/collab/index.d.ts.bak +0 -21
- package/dist/collab/index.js.bak +0 -32
- package/dist/collab/visual-editor.d.ts.bak +0 -199
- package/dist/collab/visual-editor.js.bak +0 -259
- package/dist/collab/yjs-adapter.d.ts.bak +0 -95
- package/dist/collab/yjs-adapter.js.bak +0 -282
- package/dist/collab/yjs-client.d.ts.bak +0 -101
- package/dist/collab/yjs-client.js.bak +0 -193
- package/dist/collab/yjs-protocols.d.ts.bak +0 -128
- package/dist/collab/yjs-protocols.js.bak +0 -245
- package/dist/collab/yjs-types.d.ts.bak +0 -201
- package/dist/collab/yjs-types.js.bak +0 -45
- package/dist/index.d.ts.bak +0 -38
- package/dist/index.js.bak +0 -48
- package/dist/pipeline/llm-to-ix.d.ts.bak +0 -249
- package/dist/pipeline/llm-to-ix.js.bak +0 -992
- package/dist/react/index.d.ts.bak +0 -18
- package/dist/react/index.js.bak +0 -18
- package/dist/react/renderer.d.ts.bak +0 -47
- package/dist/react/renderer.js.bak +0 -420
- package/dist/renderer/renderer.d.ts.bak +0 -55
- package/dist/renderer/renderer.js.bak +0 -232
- package/dist/runtime/capsule-runtime.d.ts.bak +0 -227
- package/dist/runtime/capsule-runtime.js.bak +0 -563
- package/dist/runtime/policy-gates.d.ts.bak +0 -116
- package/dist/runtime/policy-gates.js.bak +0 -317
- package/dist/schema/ui-ir.d.ts.bak +0 -26
- package/dist/schema/ui-ir.js.bak +0 -51
- package/dist/sdk/api.d.ts.bak +0 -101
- package/dist/sdk/api.js.bak +0 -177
- package/dist/sdk/index.d.ts.bak +0 -9
- package/dist/sdk/index.js.bak +0 -10
- package/dist/sdk/react.d.ts.bak +0 -63
- package/dist/sdk/react.js.bak +0 -161
- package/dist/state/index.d.ts.bak +0 -8
- package/dist/state/index.js.bak +0 -8
- package/dist/state/patch.d.ts.bak +0 -73
- package/dist/state/patch.js.bak +0 -437
- package/dist/state/store.d.ts.bak +0 -50
- package/dist/state/store.js.bak +0 -246
- package/dist/svelte/index.d.ts.bak +0 -15
- package/dist/svelte/index.js.bak +0 -15
- package/dist/svelte/renderer.d.ts.bak +0 -35
- package/dist/svelte/renderer.js.bak +0 -317
- package/dist/types/index.d.ts.bak +0 -349
- package/dist/types/index.js.bak +0 -152
- package/dist/vue/index.d.ts.bak +0 -18
- package/dist/vue/index.js.bak +0 -18
- package/dist/vue/renderer.d.ts.bak +0 -46
- package/dist/vue/renderer.js.bak +0 -302
|
@@ -1,271 +0,0 @@
|
|
|
1
|
-
// OWNER: T2-A5
|
|
2
|
-
/**
|
|
3
|
-
* Capsule Registry - GAP-69, 70, 71
|
|
4
|
-
*
|
|
5
|
-
* Track subscribers and broadcast capsule events
|
|
6
|
-
*/
|
|
7
|
-
import { EventEmitter } from 'events';
|
|
8
|
-
/**
|
|
9
|
-
* Capsule Registry - GAP-69, 70, 71
|
|
10
|
-
*
|
|
11
|
-
* Track subscribers and broadcast events
|
|
12
|
-
*/
|
|
13
|
-
export class CapsuleRegistry extends EventEmitter {
|
|
14
|
-
subscribers;
|
|
15
|
-
subscriberById;
|
|
16
|
-
capsuleSubscribers;
|
|
17
|
-
constructor() {
|
|
18
|
-
super();
|
|
19
|
-
this.subscribers = new Map();
|
|
20
|
-
this.subscriberById = new Map();
|
|
21
|
-
this.capsuleSubscribers = new Map();
|
|
22
|
-
}
|
|
23
|
-
/**
|
|
24
|
-
* Subscribe to a capsule
|
|
25
|
-
*/
|
|
26
|
-
subscribe(capsuleId, ws, subscriberId) {
|
|
27
|
-
const id = subscriberId || this.generateSubscriberId();
|
|
28
|
-
const subscriber = {
|
|
29
|
-
id,
|
|
30
|
-
ws,
|
|
31
|
-
capsuleIds: new Set([capsuleId]),
|
|
32
|
-
connectedAt: new Date(),
|
|
33
|
-
lastActivity: new Date(),
|
|
34
|
-
};
|
|
35
|
-
// Add to subscriber map
|
|
36
|
-
this.subscriberById.set(id, subscriber);
|
|
37
|
-
// Add to capsule subscribers
|
|
38
|
-
if (!this.subscribers.has(capsuleId)) {
|
|
39
|
-
this.subscribers.set(capsuleId, new Set());
|
|
40
|
-
}
|
|
41
|
-
this.subscribers.get(capsuleId).add(subscriber);
|
|
42
|
-
// Track capsule subscription
|
|
43
|
-
if (!this.capsuleSubscribers.has(capsuleId)) {
|
|
44
|
-
this.capsuleSubscribers.set(capsuleId, new Set());
|
|
45
|
-
}
|
|
46
|
-
this.capsuleSubscribers.get(capsuleId).add(id);
|
|
47
|
-
// Setup WebSocket message handler
|
|
48
|
-
ws.addEventListener('message', (event) => {
|
|
49
|
-
this.handleSubscriberMessage(id, event);
|
|
50
|
-
});
|
|
51
|
-
// Setup close handler
|
|
52
|
-
ws.addEventListener('close', () => {
|
|
53
|
-
this.unsubscribe(id);
|
|
54
|
-
});
|
|
55
|
-
this.emit('subscribe', { subscriberId: id, capsuleId });
|
|
56
|
-
return id;
|
|
57
|
-
}
|
|
58
|
-
/**
|
|
59
|
-
* Unsubscribe from a capsule
|
|
60
|
-
*/
|
|
61
|
-
unsubscribe(subscriberId, capsuleId) {
|
|
62
|
-
const subscriber = this.subscriberById.get(subscriberId);
|
|
63
|
-
if (!subscriber)
|
|
64
|
-
return;
|
|
65
|
-
const capsules = capsuleId ? [capsuleId] : Array.from(subscriber.capsuleIds);
|
|
66
|
-
for (const capsule of capsules) {
|
|
67
|
-
const capsuleSubs = this.subscribers.get(capsule);
|
|
68
|
-
if (capsuleSubs) {
|
|
69
|
-
capsuleSubs.delete(subscriber);
|
|
70
|
-
if (capsuleSubs.size === 0) {
|
|
71
|
-
this.subscribers.delete(capsule);
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
const capSubs = this.capsuleSubscribers.get(capsule);
|
|
75
|
-
if (capSubs) {
|
|
76
|
-
capSubs.delete(subscriberId);
|
|
77
|
-
if (capSubs.size === 0) {
|
|
78
|
-
this.capsuleSubscribers.delete(capsule);
|
|
79
|
-
}
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
if (!capsuleId) {
|
|
83
|
-
this.subscriberById.delete(subscriberId);
|
|
84
|
-
}
|
|
85
|
-
else {
|
|
86
|
-
subscriber.capsuleIds.delete(capsuleId);
|
|
87
|
-
if (subscriber.capsuleIds.size === 0) {
|
|
88
|
-
this.subscriberById.delete(subscriberId);
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
this.emit('unsubscribe', { subscriberId, capsuleId });
|
|
92
|
-
}
|
|
93
|
-
/**
|
|
94
|
-
* Broadcast event to all capsule subscribers
|
|
95
|
-
*/
|
|
96
|
-
broadcast(capsuleId, event) {
|
|
97
|
-
const capsuleSubs = this.subscribers.get(capsuleId);
|
|
98
|
-
if (!capsuleSubs || capsuleSubs.size === 0)
|
|
99
|
-
return;
|
|
100
|
-
const message = JSON.stringify({
|
|
101
|
-
type: 'capsule-event',
|
|
102
|
-
event,
|
|
103
|
-
});
|
|
104
|
-
const failed = [];
|
|
105
|
-
capsuleSubs.forEach(subscriber => {
|
|
106
|
-
try {
|
|
107
|
-
if (subscriber.ws.readyState === WebSocket.OPEN) {
|
|
108
|
-
subscriber.ws.send(message);
|
|
109
|
-
subscriber.lastActivity = new Date();
|
|
110
|
-
}
|
|
111
|
-
else {
|
|
112
|
-
failed.push(subscriber.id);
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
-
catch (error) {
|
|
116
|
-
console.error('Failed to send to subscriber:', error);
|
|
117
|
-
failed.push(subscriber.id);
|
|
118
|
-
}
|
|
119
|
-
});
|
|
120
|
-
// Remove failed subscribers
|
|
121
|
-
failed.forEach(id => this.unsubscribe(id, capsuleId));
|
|
122
|
-
this.emit('broadcast', { capsuleId, event, subscriberCount: capsuleSubs.size - failed.length });
|
|
123
|
-
}
|
|
124
|
-
/**
|
|
125
|
-
* Broadcast to all capsules
|
|
126
|
-
*/
|
|
127
|
-
broadcastAll(event) {
|
|
128
|
-
const capsuleIds = Array.from(this.subscribers.keys());
|
|
129
|
-
for (const capsuleId of capsuleIds) {
|
|
130
|
-
this.broadcast(capsuleId, {
|
|
131
|
-
...event,
|
|
132
|
-
capsuleId,
|
|
133
|
-
});
|
|
134
|
-
}
|
|
135
|
-
}
|
|
136
|
-
/**
|
|
137
|
-
* Send event to specific subscriber
|
|
138
|
-
*/
|
|
139
|
-
sendToSubscriber(subscriberId, event) {
|
|
140
|
-
const subscriber = this.subscriberById.get(subscriberId);
|
|
141
|
-
if (!subscriber)
|
|
142
|
-
return false;
|
|
143
|
-
try {
|
|
144
|
-
if (subscriber.ws.readyState === WebSocket.OPEN) {
|
|
145
|
-
subscriber.ws.send(JSON.stringify({
|
|
146
|
-
type: 'capsule-event',
|
|
147
|
-
event,
|
|
148
|
-
}));
|
|
149
|
-
subscriber.lastActivity = new Date();
|
|
150
|
-
return true;
|
|
151
|
-
}
|
|
152
|
-
}
|
|
153
|
-
catch (error) {
|
|
154
|
-
console.error('Failed to send to subscriber:', error);
|
|
155
|
-
}
|
|
156
|
-
return false;
|
|
157
|
-
}
|
|
158
|
-
/**
|
|
159
|
-
* Get subscribers for a capsule
|
|
160
|
-
*/
|
|
161
|
-
getCapsuleSubscribers(capsuleId) {
|
|
162
|
-
const subs = this.subscribers.get(capsuleId);
|
|
163
|
-
return subs ? Array.from(subs) : [];
|
|
164
|
-
}
|
|
165
|
-
/**
|
|
166
|
-
* Get subscriber count for a capsule
|
|
167
|
-
*/
|
|
168
|
-
getSubscriberCount(capsuleId) {
|
|
169
|
-
return this.subscribers.get(capsuleId)?.size || 0;
|
|
170
|
-
}
|
|
171
|
-
/**
|
|
172
|
-
* Get all capsules
|
|
173
|
-
*/
|
|
174
|
-
getAllCapsules() {
|
|
175
|
-
return Array.from(this.subscribers.keys());
|
|
176
|
-
}
|
|
177
|
-
/**
|
|
178
|
-
* Get subscriber by ID
|
|
179
|
-
*/
|
|
180
|
-
getSubscriber(subscriberId) {
|
|
181
|
-
return this.subscriberById.get(subscriberId);
|
|
182
|
-
}
|
|
183
|
-
/**
|
|
184
|
-
* Get all subscribers
|
|
185
|
-
*/
|
|
186
|
-
getAllSubscribers() {
|
|
187
|
-
return Array.from(this.subscriberById.values());
|
|
188
|
-
}
|
|
189
|
-
/**
|
|
190
|
-
* Get capsules for a subscriber
|
|
191
|
-
*/
|
|
192
|
-
getSubscriberCapsules(subscriberId) {
|
|
193
|
-
const subscriber = this.subscriberById.get(subscriberId);
|
|
194
|
-
return subscriber ? Array.from(subscriber.capsuleIds) : [];
|
|
195
|
-
}
|
|
196
|
-
/**
|
|
197
|
-
* Handle message from subscriber
|
|
198
|
-
*/
|
|
199
|
-
handleSubscriberMessage(subscriberId, event) {
|
|
200
|
-
const subscriber = this.subscriberById.get(subscriberId);
|
|
201
|
-
if (!subscriber)
|
|
202
|
-
return;
|
|
203
|
-
subscriber.lastActivity = new Date();
|
|
204
|
-
try {
|
|
205
|
-
const data = JSON.parse(event.data);
|
|
206
|
-
this.emit('message', {
|
|
207
|
-
subscriberId,
|
|
208
|
-
data,
|
|
209
|
-
});
|
|
210
|
-
}
|
|
211
|
-
catch (error) {
|
|
212
|
-
console.error('Failed to parse subscriber message:', error);
|
|
213
|
-
}
|
|
214
|
-
}
|
|
215
|
-
/**
|
|
216
|
-
* Generate unique subscriber ID
|
|
217
|
-
*/
|
|
218
|
-
generateSubscriberId() {
|
|
219
|
-
return `sub_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
|
|
220
|
-
}
|
|
221
|
-
/**
|
|
222
|
-
* Get registry statistics
|
|
223
|
-
*/
|
|
224
|
-
getStats() {
|
|
225
|
-
const capsules = new Map();
|
|
226
|
-
this.subscribers.forEach((subs, id) => {
|
|
227
|
-
capsules.set(id, subs.size);
|
|
228
|
-
});
|
|
229
|
-
return {
|
|
230
|
-
totalSubscribers: this.subscriberById.size,
|
|
231
|
-
totalCapsules: this.subscribers.size,
|
|
232
|
-
capsules,
|
|
233
|
-
};
|
|
234
|
-
}
|
|
235
|
-
/**
|
|
236
|
-
* Clean up inactive subscribers
|
|
237
|
-
*/
|
|
238
|
-
cleanupInactive(timeoutMs = 60000) {
|
|
239
|
-
const now = Date.now();
|
|
240
|
-
let cleaned = 0;
|
|
241
|
-
this.subscriberById.forEach((subscriber, id) => {
|
|
242
|
-
const inactiveTime = now - subscriber.lastActivity.getTime();
|
|
243
|
-
if (inactiveTime > timeoutMs) {
|
|
244
|
-
this.unsubscribe(id);
|
|
245
|
-
cleaned++;
|
|
246
|
-
}
|
|
247
|
-
});
|
|
248
|
-
return cleaned;
|
|
249
|
-
}
|
|
250
|
-
/**
|
|
251
|
-
* Destroy registry
|
|
252
|
-
*/
|
|
253
|
-
destroy() {
|
|
254
|
-
this.subscribers.forEach((subs) => {
|
|
255
|
-
subs.forEach(sub => {
|
|
256
|
-
sub.ws.close();
|
|
257
|
-
});
|
|
258
|
-
});
|
|
259
|
-
this.subscribers.clear();
|
|
260
|
-
this.subscriberById.clear();
|
|
261
|
-
this.capsuleSubscribers.clear();
|
|
262
|
-
this.removeAllListeners();
|
|
263
|
-
}
|
|
264
|
-
}
|
|
265
|
-
/**
|
|
266
|
-
* Create capsule registry
|
|
267
|
-
*/
|
|
268
|
-
export function createCapsuleRegistry() {
|
|
269
|
-
return new CapsuleRegistry();
|
|
270
|
-
}
|
|
271
|
-
//# sourceMappingURL=capsule-registry.js.map
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Real-time Collaboration
|
|
3
|
-
*
|
|
4
|
-
* Yjs/CRDT integration for collaborative UI editing.
|
|
5
|
-
*
|
|
6
|
-
* @example
|
|
7
|
-
* ```typescript
|
|
8
|
-
* import { YjsClient, AwarenessManager, CapsuleRegistry } from '@allternit/ix/collab';
|
|
9
|
-
*
|
|
10
|
-
* const client = new YjsClient('room-123', config);
|
|
11
|
-
* const text = client.getText('document');
|
|
12
|
-
* text.insert(0, 'Hello collaborative world!');
|
|
13
|
-
* ```
|
|
14
|
-
*/
|
|
15
|
-
export { type YjsConfig, type CollaborationSession, type Participant, type CursorPosition, type Range, type UserState, type AwarenessChanges, type DocType, type OperationType, type DocChangeEvent, type SyncState, type CursorStyle, type CollabConfig, defaultCollabConfig, } from './yjs-types';
|
|
16
|
-
export { YjsClient, createYjsClient, defaultConfig, } from './yjs-client';
|
|
17
|
-
export { BroadcastProtocol, SyncProtocol, AwarenessManager, createAwarenessManager, } from './yjs-protocols';
|
|
18
|
-
export { CapsuleRegistry, createCapsuleRegistry, type CapsuleEvent, type CapsuleSubscriber, } from './capsule-registry';
|
|
19
|
-
export { createYjsAdapter, createCollaborativeStore, type YjsAdapter, type YjsAdapterConfig, type AwarenessState, } from './yjs-adapter';
|
|
20
|
-
export { createVisualEditor, ui, type VisualEditor, type UIRootBuilder, type UIComponentBuilder, } from './visual-editor';
|
|
21
|
-
//# sourceMappingURL=index.d.ts.map
|
package/dist/collab/index.js.bak
DELETED
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
// OWNER: T2-A4
|
|
2
|
-
/**
|
|
3
|
-
* Real-time Collaboration
|
|
4
|
-
*
|
|
5
|
-
* Yjs/CRDT integration for collaborative UI editing.
|
|
6
|
-
*
|
|
7
|
-
* @example
|
|
8
|
-
* ```typescript
|
|
9
|
-
* import { YjsClient, AwarenessManager, CapsuleRegistry } from '@allternit/ix/collab';
|
|
10
|
-
*
|
|
11
|
-
* const client = new YjsClient('room-123', config);
|
|
12
|
-
* const text = client.getText('document');
|
|
13
|
-
* text.insert(0, 'Hello collaborative world!');
|
|
14
|
-
* ```
|
|
15
|
-
*/
|
|
16
|
-
export { defaultCollabConfig, } from './yjs-types';
|
|
17
|
-
export {
|
|
18
|
-
// YJS Client
|
|
19
|
-
YjsClient, createYjsClient, defaultConfig, } from './yjs-client';
|
|
20
|
-
export {
|
|
21
|
-
// YJS Protocols
|
|
22
|
-
BroadcastProtocol, SyncProtocol, AwarenessManager, createAwarenessManager, } from './yjs-protocols';
|
|
23
|
-
export {
|
|
24
|
-
// Capsule Registry
|
|
25
|
-
CapsuleRegistry, createCapsuleRegistry, } from './capsule-registry';
|
|
26
|
-
export {
|
|
27
|
-
// YJS Adapter
|
|
28
|
-
createYjsAdapter, createCollaborativeStore, } from './yjs-adapter';
|
|
29
|
-
export {
|
|
30
|
-
// Visual Editor
|
|
31
|
-
createVisualEditor, ui, } from './visual-editor';
|
|
32
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1,199 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Visual Editor for A2R-IX
|
|
3
|
-
*
|
|
4
|
-
* Declarative API for building UI IR visually.
|
|
5
|
-
*/
|
|
6
|
-
import type { UIRoot, UIComponent, UIAction, StateVariable } from '../types';
|
|
7
|
-
export interface VisualEditor {
|
|
8
|
-
/** Create new UI document */
|
|
9
|
-
create(version?: string): UIRootBuilder;
|
|
10
|
-
/** Load existing UI */
|
|
11
|
-
load(root: UIRoot): UIRootBuilder;
|
|
12
|
-
}
|
|
13
|
-
export interface UIRootBuilder {
|
|
14
|
-
/** Set document metadata */
|
|
15
|
-
metadata(meta: {
|
|
16
|
-
title?: string;
|
|
17
|
-
description?: string;
|
|
18
|
-
author?: string;
|
|
19
|
-
}): UIRootBuilder;
|
|
20
|
-
/** Add component to root */
|
|
21
|
-
add(component: UIComponentBuilder | UIComponent): UIRootBuilder;
|
|
22
|
-
/** Add state variable */
|
|
23
|
-
state(path: string, type: StateVariable['type'], defaultValue?: unknown): UIRootBuilder;
|
|
24
|
-
/** Add computed value */
|
|
25
|
-
computed(name: string, deps: string[], compute: string): UIRootBuilder;
|
|
26
|
-
/** Add action */
|
|
27
|
-
action(id: string, type: UIAction['type'], handler: UIAction['handler']): UIRootBuilder;
|
|
28
|
-
/** Add custom CSS */
|
|
29
|
-
css(styles: string): UIRootBuilder;
|
|
30
|
-
/** Build final UIRoot */
|
|
31
|
-
build(): UIRoot;
|
|
32
|
-
}
|
|
33
|
-
export interface UIComponentBuilder {
|
|
34
|
-
/** Set component ID */
|
|
35
|
-
id(id: string): UIComponentBuilder;
|
|
36
|
-
/** Set component props */
|
|
37
|
-
props(props: Record<string, unknown>): UIComponentBuilder;
|
|
38
|
-
/** Add prop */
|
|
39
|
-
prop(key: string, value: unknown): UIComponentBuilder;
|
|
40
|
-
/** Add binding */
|
|
41
|
-
bind(prop: string, statePath: string, direction?: 'one-way' | 'two-way'): UIComponentBuilder;
|
|
42
|
-
/** Add event handler */
|
|
43
|
-
on(event: string, action: string, params?: Record<string, unknown>): UIComponentBuilder;
|
|
44
|
-
/** Add child component */
|
|
45
|
-
child(component: UIComponentBuilder | UIComponent): UIComponentBuilder;
|
|
46
|
-
/** Set conditional render */
|
|
47
|
-
when(condition: string): UIComponentBuilder;
|
|
48
|
-
/** Set repeat/for loop */
|
|
49
|
-
repeat(items: string, as: string, options?: {
|
|
50
|
-
indexAs?: string;
|
|
51
|
-
filter?: string;
|
|
52
|
-
sort?: string;
|
|
53
|
-
}): UIComponentBuilder;
|
|
54
|
-
/** Set style */
|
|
55
|
-
style(styles: Record<string, string | number>): UIComponentBuilder;
|
|
56
|
-
/** Set CSS class */
|
|
57
|
-
className(className: string): UIComponentBuilder;
|
|
58
|
-
/** Build final component */
|
|
59
|
-
build(): UIComponent;
|
|
60
|
-
}
|
|
61
|
-
/**
|
|
62
|
-
* Create visual editor
|
|
63
|
-
*/
|
|
64
|
-
export declare function createVisualEditor(): VisualEditor;
|
|
65
|
-
/**
|
|
66
|
-
* Component type builders
|
|
67
|
-
*/
|
|
68
|
-
export declare const components: {
|
|
69
|
-
/** Layout components */
|
|
70
|
-
layout: {
|
|
71
|
-
Box: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
72
|
-
Stack: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
73
|
-
Grid: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
74
|
-
Flex: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
75
|
-
Container: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
76
|
-
};
|
|
77
|
-
/** Typography components */
|
|
78
|
-
typography: {
|
|
79
|
-
Text: (text: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
80
|
-
Heading: (text: string, level?: number, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
81
|
-
Paragraph: (text: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
82
|
-
Label: (text: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
83
|
-
};
|
|
84
|
-
/** Input components */
|
|
85
|
-
input: {
|
|
86
|
-
Button: (text: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
87
|
-
Input: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
88
|
-
TextArea: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
89
|
-
Select: (options: Array<{
|
|
90
|
-
value: string;
|
|
91
|
-
label: string;
|
|
92
|
-
}>, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
93
|
-
Checkbox: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
94
|
-
Radio: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
95
|
-
Switch: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
96
|
-
};
|
|
97
|
-
/** Display components */
|
|
98
|
-
display: {
|
|
99
|
-
Image: (src: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
100
|
-
Icon: (name: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
101
|
-
Badge: (text: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
102
|
-
Card: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
103
|
-
List: (items: unknown[], renderItem: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
104
|
-
Table: (data: unknown[], columns: unknown[], props?: Record<string, unknown>) => UIComponentBuilder;
|
|
105
|
-
};
|
|
106
|
-
};
|
|
107
|
-
/**
|
|
108
|
-
* Fluent API for common patterns
|
|
109
|
-
*/
|
|
110
|
-
export declare const patterns: {
|
|
111
|
-
/** Create a form with inputs */
|
|
112
|
-
form: (fields: Array<{
|
|
113
|
-
name: string;
|
|
114
|
-
label: string;
|
|
115
|
-
type: string;
|
|
116
|
-
}>, submitAction: string) => UIRootBuilder;
|
|
117
|
-
/** Create a data table */
|
|
118
|
-
dataTable: (dataPath: string, columns: Array<{
|
|
119
|
-
key: string;
|
|
120
|
-
title: string;
|
|
121
|
-
}>) => UIComponentBuilder;
|
|
122
|
-
/** Create a modal/dialog */
|
|
123
|
-
modal: (title: string, content: UIComponentBuilder, onClose: string) => UIComponentBuilder;
|
|
124
|
-
/** Create a navigation menu */
|
|
125
|
-
navMenu: (items: Array<{
|
|
126
|
-
label: string;
|
|
127
|
-
action: string;
|
|
128
|
-
icon?: string;
|
|
129
|
-
}>) => UIComponentBuilder;
|
|
130
|
-
};
|
|
131
|
-
export declare const ui: {
|
|
132
|
-
/** Create new UI */
|
|
133
|
-
create: (version?: string) => UIRootBuilder;
|
|
134
|
-
/** Load existing UI */
|
|
135
|
-
load: (root: UIRoot) => UIRootBuilder;
|
|
136
|
-
/** Component builders */
|
|
137
|
-
components: {
|
|
138
|
-
/** Layout components */
|
|
139
|
-
layout: {
|
|
140
|
-
Box: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
141
|
-
Stack: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
142
|
-
Grid: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
143
|
-
Flex: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
144
|
-
Container: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
145
|
-
};
|
|
146
|
-
/** Typography components */
|
|
147
|
-
typography: {
|
|
148
|
-
Text: (text: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
149
|
-
Heading: (text: string, level?: number, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
150
|
-
Paragraph: (text: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
151
|
-
Label: (text: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
152
|
-
};
|
|
153
|
-
/** Input components */
|
|
154
|
-
input: {
|
|
155
|
-
Button: (text: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
156
|
-
Input: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
157
|
-
TextArea: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
158
|
-
Select: (options: Array<{
|
|
159
|
-
value: string;
|
|
160
|
-
label: string;
|
|
161
|
-
}>, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
162
|
-
Checkbox: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
163
|
-
Radio: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
164
|
-
Switch: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
165
|
-
};
|
|
166
|
-
/** Display components */
|
|
167
|
-
display: {
|
|
168
|
-
Image: (src: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
169
|
-
Icon: (name: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
170
|
-
Badge: (text: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
171
|
-
Card: (props?: Record<string, unknown>) => UIComponentBuilder;
|
|
172
|
-
List: (items: unknown[], renderItem: string, props?: Record<string, unknown>) => UIComponentBuilder;
|
|
173
|
-
Table: (data: unknown[], columns: unknown[], props?: Record<string, unknown>) => UIComponentBuilder;
|
|
174
|
-
};
|
|
175
|
-
};
|
|
176
|
-
/** Pattern builders */
|
|
177
|
-
patterns: {
|
|
178
|
-
/** Create a form with inputs */
|
|
179
|
-
form: (fields: Array<{
|
|
180
|
-
name: string;
|
|
181
|
-
label: string;
|
|
182
|
-
type: string;
|
|
183
|
-
}>, submitAction: string) => UIRootBuilder;
|
|
184
|
-
/** Create a data table */
|
|
185
|
-
dataTable: (dataPath: string, columns: Array<{
|
|
186
|
-
key: string;
|
|
187
|
-
title: string;
|
|
188
|
-
}>) => UIComponentBuilder;
|
|
189
|
-
/** Create a modal/dialog */
|
|
190
|
-
modal: (title: string, content: UIComponentBuilder, onClose: string) => UIComponentBuilder;
|
|
191
|
-
/** Create a navigation menu */
|
|
192
|
-
navMenu: (items: Array<{
|
|
193
|
-
label: string;
|
|
194
|
-
action: string;
|
|
195
|
-
icon?: string;
|
|
196
|
-
}>) => UIComponentBuilder;
|
|
197
|
-
};
|
|
198
|
-
};
|
|
199
|
-
//# sourceMappingURL=visual-editor.d.ts.map
|