@kupola/kupola 1.2.0 → 1.3.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/LICENSE +21 -0
- package/README.md +330 -286
- package/adapters/axios.d.ts +34 -0
- package/adapters/axios.js +122 -0
- package/adapters/navios-http.d.ts +110 -0
- package/adapters/navios-http.js +151 -0
- package/dist/css/accessibility.css +119 -0
- package/dist/css/animations.css +224 -0
- package/dist/css/brand-themes.css +300 -0
- package/dist/css/colors_and_type.css +441 -0
- package/dist/css/components-ext.css +4165 -0
- package/dist/css/components.css +1483 -0
- package/dist/css/responsive.css +697 -0
- package/dist/css/scaffold.css +145 -0
- package/dist/css/states.css +316 -0
- package/dist/css/theme-dark.css +296 -0
- package/dist/css/theme-light.css +296 -0
- package/dist/css/utilities.css +171 -0
- package/dist/kupola.cjs.js +219 -161
- package/dist/kupola.cjs.js.map +1 -1
- package/dist/kupola.esm.js +6643 -5709
- package/dist/kupola.esm.js.map +1 -1
- package/dist/kupola.umd.js +219 -161
- package/dist/kupola.umd.js.map +1 -1
- package/dist/plugins/vite-plugin-kupola.js +120 -0
- package/dist/types/kupola.d.ts +421 -323
- package/js/calendar.js +334 -25
- package/js/carousel.js +182 -48
- package/js/collapse.js +148 -34
- package/js/color-picker.js +416 -108
- package/js/component.js +8 -19
- package/js/countdown.js +9 -8
- package/js/data-bind.js +73 -16
- package/js/datepicker.js +488 -110
- package/js/depends.js +710 -0
- package/js/dialog.js +4 -2
- package/js/drawer.js +172 -8
- package/js/dropdown.js +272 -17
- package/js/dynamic-tags.js +156 -40
- package/js/fileupload.js +9 -8
- package/js/form.js +280 -254
- package/js/global-events.js +281 -188
- package/js/heatmap.js +10 -7
- package/js/i18n.js +18 -10
- package/js/icons.js +141 -161
- package/js/image-preview.js +146 -2
- package/js/initializer.js +113 -71
- package/js/kupola-core.js +123 -45
- package/js/kupola-lifecycle.js +13 -11
- package/js/message.js +8 -1
- package/js/modal.js +207 -59
- package/js/notification.js +8 -1
- package/js/numberinput.js +9 -8
- package/js/pagination.js +263 -0
- package/js/registry.js +29 -12
- package/js/select.js +482 -27
- package/js/slide-captcha.js +11 -2
- package/js/slider.js +442 -25
- package/js/statcard.js +9 -7
- package/js/table.js +1210 -0
- package/js/tag.js +268 -14
- package/js/theme.js +14 -43
- package/js/timepicker.js +335 -66
- package/js/tooltip.js +317 -86
- package/js/utils.js +6 -2
- package/js/validation.js +6 -2
- package/js/virtual-list.js +11 -7
- package/js/web-components.js +288 -0
- package/package.json +77 -67
- package/plugins/vite-plugin-kupola.js +120 -0
- package/types/kupola.d.ts +421 -323
- package/CHANGELOG.md +0 -130
- package/INTEGRATION.md +0 -440
- package/PROJECT_SUMMARY.md +0 -312
- package/SKILL.md +0 -572
- package/dist/utils/utils/Kupola.cs +0 -77
- package/dist/utils/utils/Kupola.java +0 -104
- package/dist/utils/utils/kupola.go +0 -120
- package/dist/utils/utils/kupola.js +0 -63
- package/dist/utils/utils/kupola.py +0 -1392
- package/dist/utils/utils/kupola.rb +0 -69
- package/js/composition-api.js +0 -458
- package/js/error-handler.js +0 -181
- package/js/http.js +0 -419
- package/js/kupola-devtools.js +0 -598
- package/js/performance.js +0 -250
- package/js/router.js +0 -396
- package/js/security.js +0 -189
- package/js/test-utils.js +0 -251
- package/templates/base.html +0 -30
- package/templates/base_dashboard.html +0 -99
- package/utils/Kupola.cs +0 -77
- package/utils/Kupola.java +0 -104
- package/utils/kupola.go +0 -120
- package/utils/kupola.js +0 -63
- package/utils/kupola.py +0 -1392
- package/utils/kupola.rb +0 -69
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
module Kupola
|
|
2
|
-
def self.button(label, variant = 'brand', size = 'md')
|
|
3
|
-
"<button class=\"ds-btn ds-btn--#{variant} ds-btn--#{size}\">#{label}</button>"
|
|
4
|
-
end
|
|
5
|
-
|
|
6
|
-
def self.input(label, name, placeholder, validate = '')
|
|
7
|
-
validate_attr = validate.empty? ? '' : " data-validate=\"#{validate}\""
|
|
8
|
-
<<~HTML
|
|
9
|
-
<div class="ds-form-item">
|
|
10
|
-
<label class="ds-form-item__label">#{label}</label>
|
|
11
|
-
<input type="text" class="ds-input" name="#{name}" placeholder="#{placeholder}"#{validate_attr}>
|
|
12
|
-
</div>
|
|
13
|
-
HTML
|
|
14
|
-
end
|
|
15
|
-
|
|
16
|
-
def self.card(title, body, footer = '')
|
|
17
|
-
footer_html = footer.empty? ? '' : "<div class=\"ds-card__footer\">#{footer}</div>"
|
|
18
|
-
<<~HTML
|
|
19
|
-
<div class="ds-card">
|
|
20
|
-
<div class="ds-card__header">
|
|
21
|
-
<h3 class="ds-card__title">#{title}</h3>
|
|
22
|
-
</div>
|
|
23
|
-
<div class="ds-card__body">#{body}</div>
|
|
24
|
-
#{footer_html}
|
|
25
|
-
</div>
|
|
26
|
-
HTML
|
|
27
|
-
end
|
|
28
|
-
|
|
29
|
-
def self.stat_card(title, value, trend = '', trend_type = 'up')
|
|
30
|
-
trend_class = trend_type == 'down' ? 'ds-stat-card__trend--down' : 'ds-stat-card__trend--up'
|
|
31
|
-
trend_html = trend.empty? ? '' : "<span class=\"ds-stat-card__trend #{trend_class}\">#{trend}</span>"
|
|
32
|
-
<<~HTML
|
|
33
|
-
<div class="ds-stat-card">
|
|
34
|
-
<div class="ds-stat-card__title">#{title}</div>
|
|
35
|
-
<div class="ds-stat-card__value">#{value}</div>
|
|
36
|
-
#{trend_html}
|
|
37
|
-
</div>
|
|
38
|
-
HTML
|
|
39
|
-
end
|
|
40
|
-
|
|
41
|
-
def self.badge(text, variant = 'default')
|
|
42
|
-
"<span class=\"ds-badge ds-badge--#{variant}\">#{text}</span>"
|
|
43
|
-
end
|
|
44
|
-
|
|
45
|
-
def self.avatar(initials, size = 'md', variant = 'default')
|
|
46
|
-
"<div class=\"ds-avatar ds-avatar--#{size} ds-avatar--#{variant}\">#{initials}</div>"
|
|
47
|
-
end
|
|
48
|
-
|
|
49
|
-
def self.theme_script(theme = 'dark', brand = 'zengqing')
|
|
50
|
-
<<~HTML
|
|
51
|
-
<script>
|
|
52
|
-
if (typeof setTheme === 'function') setTheme('#{theme}');
|
|
53
|
-
if (typeof setBrand === 'function') setBrand('#{brand}');
|
|
54
|
-
</script>
|
|
55
|
-
HTML
|
|
56
|
-
end
|
|
57
|
-
|
|
58
|
-
def self.data_bind(key, bind_type)
|
|
59
|
-
"data-bind=\"#{key}:#{bind_type}\""
|
|
60
|
-
end
|
|
61
|
-
|
|
62
|
-
def self.data_component(name)
|
|
63
|
-
"data-component=\"#{name}\""
|
|
64
|
-
end
|
|
65
|
-
|
|
66
|
-
def self.data_validate(rules)
|
|
67
|
-
"data-validate=\"#{rules}\""
|
|
68
|
-
end
|
|
69
|
-
end
|
package/js/composition-api.js
DELETED
|
@@ -1,458 +0,0 @@
|
|
|
1
|
-
(function(window) {
|
|
2
|
-
let currentSetupContext = null;
|
|
3
|
-
|
|
4
|
-
class SetupContext {
|
|
5
|
-
constructor(component) {
|
|
6
|
-
this.component = component;
|
|
7
|
-
this.lifecycle = (component && component.lifecycle) || null;
|
|
8
|
-
this._onMountedHandlers = [];
|
|
9
|
-
this._onUnmountedHandlers = [];
|
|
10
|
-
this._onUpdatedHandlers = [];
|
|
11
|
-
this._watches = [];
|
|
12
|
-
this._refs = new Map();
|
|
13
|
-
this._computedDeps = new Map();
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
ref(initialValue = null) {
|
|
17
|
-
if (window.kupolaData) {
|
|
18
|
-
const key = `__ref_${Math.random().toString(36).slice(2, 11)}__`;
|
|
19
|
-
window.kupolaData.set(key, initialValue);
|
|
20
|
-
|
|
21
|
-
return {
|
|
22
|
-
get value() {
|
|
23
|
-
return window.kupolaData.get(key);
|
|
24
|
-
},
|
|
25
|
-
set value(newValue) {
|
|
26
|
-
window.kupolaData.set(key, newValue);
|
|
27
|
-
},
|
|
28
|
-
_key: key
|
|
29
|
-
};
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
const refObj = {
|
|
33
|
-
_value: initialValue,
|
|
34
|
-
_subscribers: new Set()
|
|
35
|
-
};
|
|
36
|
-
|
|
37
|
-
Object.defineProperty(refObj, 'value', {
|
|
38
|
-
get() {
|
|
39
|
-
return refObj._value;
|
|
40
|
-
},
|
|
41
|
-
set(newValue) {
|
|
42
|
-
if (newValue !== refObj._value) {
|
|
43
|
-
refObj._value = newValue;
|
|
44
|
-
refObj._subscribers.forEach(sub => sub(newValue));
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
});
|
|
48
|
-
|
|
49
|
-
return refObj;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
reactive(target) {
|
|
53
|
-
if (window.kupolaData) {
|
|
54
|
-
return window.kupolaData.createReactive(target);
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
const self = this;
|
|
58
|
-
const handler = {
|
|
59
|
-
get(target, key) {
|
|
60
|
-
if (key === '__isReactive') return true;
|
|
61
|
-
if (key === '__raw') return target;
|
|
62
|
-
const result = target[key];
|
|
63
|
-
if (typeof result === 'object' && result !== null && !result.__isReactive) {
|
|
64
|
-
target[key] = self.reactive(result);
|
|
65
|
-
}
|
|
66
|
-
return target[key];
|
|
67
|
-
},
|
|
68
|
-
set(target, key, value) {
|
|
69
|
-
if (target[key] === value) return true;
|
|
70
|
-
target[key] = value;
|
|
71
|
-
self._notifyWatchers(key, value);
|
|
72
|
-
return true;
|
|
73
|
-
},
|
|
74
|
-
deleteProperty(target, key) {
|
|
75
|
-
delete target[key];
|
|
76
|
-
self._notifyWatchers(key, undefined);
|
|
77
|
-
return true;
|
|
78
|
-
}
|
|
79
|
-
};
|
|
80
|
-
|
|
81
|
-
const proxy = new Proxy(target, handler);
|
|
82
|
-
proxy.__isReactive = true;
|
|
83
|
-
return proxy;
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
onMounted(handler) {
|
|
87
|
-
if (this.lifecycle) {
|
|
88
|
-
this.lifecycle.on('mount', handler, { name: 'onMounted' });
|
|
89
|
-
} else {
|
|
90
|
-
this._onMountedHandlers.push(handler);
|
|
91
|
-
}
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
onUnmounted(handler) {
|
|
95
|
-
if (this.lifecycle) {
|
|
96
|
-
this.lifecycle.on('unmount', handler, { name: 'onUnmounted' });
|
|
97
|
-
} else {
|
|
98
|
-
this._onUnmountedHandlers.push(handler);
|
|
99
|
-
}
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
onUpdated(handler) {
|
|
103
|
-
if (this.lifecycle) {
|
|
104
|
-
this.lifecycle.on('update', handler, { name: 'onUpdated' });
|
|
105
|
-
} else {
|
|
106
|
-
this._onUpdatedHandlers.push(handler);
|
|
107
|
-
}
|
|
108
|
-
}
|
|
109
|
-
|
|
110
|
-
watch(source, handler, options = {}) {
|
|
111
|
-
if (typeof source === 'function') {
|
|
112
|
-
const watcher = () => {
|
|
113
|
-
const newValue = source();
|
|
114
|
-
if (newValue !== watcher._oldValue) {
|
|
115
|
-
handler(newValue, watcher._oldValue);
|
|
116
|
-
watcher._oldValue = newValue;
|
|
117
|
-
}
|
|
118
|
-
};
|
|
119
|
-
watcher._oldValue = undefined;
|
|
120
|
-
this._watches.push(watcher);
|
|
121
|
-
watcher();
|
|
122
|
-
|
|
123
|
-
if (window.kupolaData) {
|
|
124
|
-
const trackedPaths = [];
|
|
125
|
-
const originalGet = window.kupolaData.get;
|
|
126
|
-
window.kupolaData.get = function(k) {
|
|
127
|
-
trackedPaths.push(k);
|
|
128
|
-
return originalGet.call(this, k);
|
|
129
|
-
};
|
|
130
|
-
source();
|
|
131
|
-
window.kupolaData.get = originalGet;
|
|
132
|
-
|
|
133
|
-
trackedPaths.forEach(path => {
|
|
134
|
-
window.kupolaData.observe(path, watcher);
|
|
135
|
-
});
|
|
136
|
-
}
|
|
137
|
-
} else if (typeof source === 'object' && source !== null) {
|
|
138
|
-
if (source._subscribers) {
|
|
139
|
-
source._subscribers.add(handler);
|
|
140
|
-
} else if (source._key && window.kupolaData) {
|
|
141
|
-
window.kupolaData.observe(source._key, () => {
|
|
142
|
-
handler(source.value);
|
|
143
|
-
});
|
|
144
|
-
}
|
|
145
|
-
}
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
computed(getter) {
|
|
149
|
-
const result = this.ref();
|
|
150
|
-
const self = this;
|
|
151
|
-
|
|
152
|
-
let update = () => {
|
|
153
|
-
try {
|
|
154
|
-
result.value = getter();
|
|
155
|
-
} catch (e) {
|
|
156
|
-
console.error('Computed property error:', e);
|
|
157
|
-
}
|
|
158
|
-
};
|
|
159
|
-
|
|
160
|
-
const trackedPaths = [];
|
|
161
|
-
if (window.kupolaData) {
|
|
162
|
-
const originalGet = window.kupolaData.get;
|
|
163
|
-
window.kupolaData.get = function(k) {
|
|
164
|
-
trackedPaths.push(k);
|
|
165
|
-
return originalGet.call(this, k);
|
|
166
|
-
};
|
|
167
|
-
|
|
168
|
-
update();
|
|
169
|
-
|
|
170
|
-
window.kupolaData.get = originalGet;
|
|
171
|
-
|
|
172
|
-
trackedPaths.forEach(path => {
|
|
173
|
-
window.kupolaData.observe(path, update);
|
|
174
|
-
});
|
|
175
|
-
|
|
176
|
-
this._computedDeps.set(result, trackedPaths);
|
|
177
|
-
} else {
|
|
178
|
-
update();
|
|
179
|
-
}
|
|
180
|
-
|
|
181
|
-
let computedValue = result._value;
|
|
182
|
-
|
|
183
|
-
Object.defineProperty(result, 'value', {
|
|
184
|
-
get: () => computedValue,
|
|
185
|
-
set: (newValue) => {
|
|
186
|
-
console.warn('Cannot assign to a computed property');
|
|
187
|
-
}
|
|
188
|
-
});
|
|
189
|
-
|
|
190
|
-
const originalUpdate = update;
|
|
191
|
-
update = () => {
|
|
192
|
-
try {
|
|
193
|
-
computedValue = getter();
|
|
194
|
-
} catch (e) {
|
|
195
|
-
console.error('Computed property error:', e);
|
|
196
|
-
}
|
|
197
|
-
};
|
|
198
|
-
|
|
199
|
-
return result;
|
|
200
|
-
}
|
|
201
|
-
|
|
202
|
-
emit(eventName, data) {
|
|
203
|
-
if (this.component) {
|
|
204
|
-
this.component.$emit(eventName, data);
|
|
205
|
-
}
|
|
206
|
-
}
|
|
207
|
-
|
|
208
|
-
_notifyWatchers(key, value) {
|
|
209
|
-
this._watches.forEach(watcher => {
|
|
210
|
-
try { watcher(); } catch (e) { console.error(e); }
|
|
211
|
-
});
|
|
212
|
-
}
|
|
213
|
-
|
|
214
|
-
_executeMounted() {
|
|
215
|
-
this._onMountedHandlers.forEach(handler => {
|
|
216
|
-
try { handler(); } catch (e) { console.error(e); }
|
|
217
|
-
});
|
|
218
|
-
}
|
|
219
|
-
|
|
220
|
-
_executeUnmounted() {
|
|
221
|
-
this._onUnmountedHandlers.forEach(handler => {
|
|
222
|
-
try { handler(); } catch (e) { console.error(e); }
|
|
223
|
-
});
|
|
224
|
-
}
|
|
225
|
-
|
|
226
|
-
_executeUpdated() {
|
|
227
|
-
this._onUpdatedHandlers.forEach(handler => {
|
|
228
|
-
try { handler(); } catch (e) { console.error(e); }
|
|
229
|
-
});
|
|
230
|
-
}
|
|
231
|
-
|
|
232
|
-
destroy() {
|
|
233
|
-
this._watches.forEach(watcher => {
|
|
234
|
-
if (watcher._subscribers) {
|
|
235
|
-
watcher._subscribers.clear();
|
|
236
|
-
}
|
|
237
|
-
});
|
|
238
|
-
this._watches = [];
|
|
239
|
-
|
|
240
|
-
this._computedDeps.forEach((paths, result) => {
|
|
241
|
-
paths.forEach(path => {
|
|
242
|
-
if (window.kupolaData) {
|
|
243
|
-
window.kupolaData.unobserve(path);
|
|
244
|
-
}
|
|
245
|
-
});
|
|
246
|
-
});
|
|
247
|
-
this._computedDeps.clear();
|
|
248
|
-
|
|
249
|
-
this._refs.clear();
|
|
250
|
-
this._onMountedHandlers = [];
|
|
251
|
-
this._onUnmountedHandlers = [];
|
|
252
|
-
this._onUpdatedHandlers = [];
|
|
253
|
-
|
|
254
|
-
this.component = null;
|
|
255
|
-
this.lifecycle = null;
|
|
256
|
-
}
|
|
257
|
-
}
|
|
258
|
-
|
|
259
|
-
function ref(initialValue = null) {
|
|
260
|
-
if (currentSetupContext) {
|
|
261
|
-
return currentSetupContext.ref(initialValue);
|
|
262
|
-
}
|
|
263
|
-
|
|
264
|
-
if (window.kupolaData) {
|
|
265
|
-
const key = `__ref_${Math.random().toString(36).slice(2, 11)}__`;
|
|
266
|
-
window.kupolaData.set(key, initialValue);
|
|
267
|
-
|
|
268
|
-
return {
|
|
269
|
-
get value() {
|
|
270
|
-
return window.kupolaData.get(key);
|
|
271
|
-
},
|
|
272
|
-
set value(newValue) {
|
|
273
|
-
window.kupolaData.set(key, newValue);
|
|
274
|
-
},
|
|
275
|
-
_key: key
|
|
276
|
-
};
|
|
277
|
-
}
|
|
278
|
-
|
|
279
|
-
const refObj = {
|
|
280
|
-
_value: initialValue,
|
|
281
|
-
_subscribers: new Set()
|
|
282
|
-
};
|
|
283
|
-
|
|
284
|
-
Object.defineProperty(refObj, 'value', {
|
|
285
|
-
get() {
|
|
286
|
-
return refObj._value;
|
|
287
|
-
},
|
|
288
|
-
set(newValue) {
|
|
289
|
-
if (newValue !== refObj._value) {
|
|
290
|
-
refObj._value = newValue;
|
|
291
|
-
refObj._subscribers.forEach(sub => sub(newValue));
|
|
292
|
-
}
|
|
293
|
-
}
|
|
294
|
-
});
|
|
295
|
-
|
|
296
|
-
return refObj;
|
|
297
|
-
}
|
|
298
|
-
|
|
299
|
-
function reactive(target) {
|
|
300
|
-
if (currentSetupContext) {
|
|
301
|
-
return currentSetupContext.reactive(target);
|
|
302
|
-
}
|
|
303
|
-
|
|
304
|
-
if (window.kupolaData) {
|
|
305
|
-
return window.kupolaData.createReactive(target);
|
|
306
|
-
}
|
|
307
|
-
|
|
308
|
-
const handler = {
|
|
309
|
-
get(target, key) {
|
|
310
|
-
if (key === '__isReactive') return true;
|
|
311
|
-
if (key === '__raw') return target;
|
|
312
|
-
const result = target[key];
|
|
313
|
-
if (typeof result === 'object' && result !== null && !result.__isReactive) {
|
|
314
|
-
target[key] = new Proxy(result, handler);
|
|
315
|
-
target[key].__isReactive = true;
|
|
316
|
-
}
|
|
317
|
-
return target[key];
|
|
318
|
-
},
|
|
319
|
-
set(target, key, value) {
|
|
320
|
-
if (target[key] === value) return true;
|
|
321
|
-
target[key] = value;
|
|
322
|
-
if (currentSetupContext) {
|
|
323
|
-
currentSetupContext._notifyWatchers(key, value);
|
|
324
|
-
}
|
|
325
|
-
return true;
|
|
326
|
-
},
|
|
327
|
-
deleteProperty(target, key) {
|
|
328
|
-
delete target[key];
|
|
329
|
-
if (currentSetupContext) {
|
|
330
|
-
currentSetupContext._notifyWatchers(key, undefined);
|
|
331
|
-
}
|
|
332
|
-
return true;
|
|
333
|
-
}
|
|
334
|
-
};
|
|
335
|
-
|
|
336
|
-
const proxy = new Proxy(target, handler);
|
|
337
|
-
proxy.__isReactive = true;
|
|
338
|
-
return proxy;
|
|
339
|
-
}
|
|
340
|
-
|
|
341
|
-
function onMounted(handler) {
|
|
342
|
-
if (currentSetupContext) {
|
|
343
|
-
currentSetupContext.onMounted(handler);
|
|
344
|
-
} else {
|
|
345
|
-
console.warn('onMounted called outside of setup()');
|
|
346
|
-
}
|
|
347
|
-
}
|
|
348
|
-
|
|
349
|
-
function onUnmounted(handler) {
|
|
350
|
-
if (currentSetupContext) {
|
|
351
|
-
currentSetupContext.onUnmounted(handler);
|
|
352
|
-
} else {
|
|
353
|
-
console.warn('onUnmounted called outside of setup()');
|
|
354
|
-
}
|
|
355
|
-
}
|
|
356
|
-
|
|
357
|
-
function onUpdated(handler) {
|
|
358
|
-
if (currentSetupContext) {
|
|
359
|
-
currentSetupContext.onUpdated(handler);
|
|
360
|
-
} else {
|
|
361
|
-
console.warn('onUpdated called outside of setup()');
|
|
362
|
-
}
|
|
363
|
-
}
|
|
364
|
-
|
|
365
|
-
function watch(source, handler, options = {}) {
|
|
366
|
-
if (currentSetupContext) {
|
|
367
|
-
currentSetupContext.watch(source, handler, options);
|
|
368
|
-
}
|
|
369
|
-
}
|
|
370
|
-
|
|
371
|
-
function computed(getter) {
|
|
372
|
-
if (currentSetupContext) {
|
|
373
|
-
return currentSetupContext.computed(getter);
|
|
374
|
-
}
|
|
375
|
-
|
|
376
|
-
const result = ref();
|
|
377
|
-
|
|
378
|
-
let update = () => {
|
|
379
|
-
try {
|
|
380
|
-
result.value = getter();
|
|
381
|
-
} catch (e) {
|
|
382
|
-
console.error('Computed property error:', e);
|
|
383
|
-
}
|
|
384
|
-
};
|
|
385
|
-
|
|
386
|
-
if (window.kupolaData) {
|
|
387
|
-
const trackedPaths = [];
|
|
388
|
-
const originalGet = window.kupolaData.get;
|
|
389
|
-
window.kupolaData.get = function(k) {
|
|
390
|
-
trackedPaths.push(k);
|
|
391
|
-
return originalGet.call(this, k);
|
|
392
|
-
};
|
|
393
|
-
|
|
394
|
-
update();
|
|
395
|
-
|
|
396
|
-
window.kupolaData.get = originalGet;
|
|
397
|
-
|
|
398
|
-
trackedPaths.forEach(path => {
|
|
399
|
-
window.kupolaData.observe(path, update);
|
|
400
|
-
});
|
|
401
|
-
} else {
|
|
402
|
-
update();
|
|
403
|
-
}
|
|
404
|
-
|
|
405
|
-
let computedValue = result._value;
|
|
406
|
-
|
|
407
|
-
Object.defineProperty(result, 'value', {
|
|
408
|
-
get: () => computedValue,
|
|
409
|
-
set: (newValue) => {
|
|
410
|
-
console.warn('Cannot assign to a computed property');
|
|
411
|
-
}
|
|
412
|
-
});
|
|
413
|
-
|
|
414
|
-
const originalUpdate = update;
|
|
415
|
-
update = () => {
|
|
416
|
-
try {
|
|
417
|
-
computedValue = getter();
|
|
418
|
-
} catch (e) {
|
|
419
|
-
console.error('Computed property error:', e);
|
|
420
|
-
}
|
|
421
|
-
};
|
|
422
|
-
|
|
423
|
-
return result;
|
|
424
|
-
}
|
|
425
|
-
|
|
426
|
-
function setup(setupFn) {
|
|
427
|
-
if (typeof setupFn !== 'function') {
|
|
428
|
-
console.error('setup() requires a function argument');
|
|
429
|
-
return;
|
|
430
|
-
}
|
|
431
|
-
|
|
432
|
-
const setupContext = new SetupContext();
|
|
433
|
-
const prevContext = currentSetupContext;
|
|
434
|
-
currentSetupContext = setupContext;
|
|
435
|
-
|
|
436
|
-
let result;
|
|
437
|
-
try {
|
|
438
|
-
result = setupFn(setupContext);
|
|
439
|
-
} finally {
|
|
440
|
-
currentSetupContext = prevContext;
|
|
441
|
-
}
|
|
442
|
-
|
|
443
|
-
return result;
|
|
444
|
-
}
|
|
445
|
-
|
|
446
|
-
window.SetupContext = SetupContext;
|
|
447
|
-
window.ref = ref;
|
|
448
|
-
window.reactive = reactive;
|
|
449
|
-
window.onMounted = onMounted;
|
|
450
|
-
window.onUnmounted = onUnmounted;
|
|
451
|
-
window.onUpdated = onUpdated;
|
|
452
|
-
window.watch = watch;
|
|
453
|
-
window.computed = computed;
|
|
454
|
-
window.setup = setup;
|
|
455
|
-
window._getCurrentSetupContext = () => currentSetupContext;
|
|
456
|
-
window._setCurrentSetupContext = (ctx) => { currentSetupContext = ctx; };
|
|
457
|
-
window._clearSetupContext = () => { currentSetupContext = null; };
|
|
458
|
-
})(window);
|
package/js/error-handler.js
DELETED
|
@@ -1,181 +0,0 @@
|
|
|
1
|
-
class KupolaErrorHandler {
|
|
2
|
-
constructor() {
|
|
3
|
-
this.handlers = new Map();
|
|
4
|
-
this.errorLog = [];
|
|
5
|
-
this.maxLogs = 100;
|
|
6
|
-
this.globalHandler = null;
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
init() {
|
|
10
|
-
this._installGlobalHandlers();
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
_installGlobalHandlers() {
|
|
14
|
-
window.addEventListener('error', (event) => {
|
|
15
|
-
this.handleError(event.error || event.message, {
|
|
16
|
-
source: event.filename,
|
|
17
|
-
line: event.lineno,
|
|
18
|
-
column: event.colno,
|
|
19
|
-
type: 'global'
|
|
20
|
-
});
|
|
21
|
-
});
|
|
22
|
-
|
|
23
|
-
window.addEventListener('unhandledrejection', (event) => {
|
|
24
|
-
this.handleError(event.reason, {
|
|
25
|
-
type: 'promise',
|
|
26
|
-
rejection: true
|
|
27
|
-
});
|
|
28
|
-
});
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
setGlobalHandler(handler) {
|
|
32
|
-
if (typeof handler === 'function') {
|
|
33
|
-
this.globalHandler = handler;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
handleError(error, context = {}) {
|
|
38
|
-
const errorInfo = this._normalizeError(error, context);
|
|
39
|
-
|
|
40
|
-
this._logError(errorInfo);
|
|
41
|
-
this._notifyHandlers(errorInfo);
|
|
42
|
-
|
|
43
|
-
if (this.globalHandler) {
|
|
44
|
-
try {
|
|
45
|
-
this.globalHandler(errorInfo);
|
|
46
|
-
} catch (e) {
|
|
47
|
-
console.error('[KupolaErrorHandler] Error in global handler:', e);
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
return errorInfo;
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
_normalizeError(error, context) {
|
|
55
|
-
const errorInfo = {
|
|
56
|
-
id: this._generateId(),
|
|
57
|
-
timestamp: Date.now(),
|
|
58
|
-
message: '',
|
|
59
|
-
stack: '',
|
|
60
|
-
type: context.type || 'unknown',
|
|
61
|
-
source: context.source || '',
|
|
62
|
-
line: context.line || 0,
|
|
63
|
-
column: context.column || 0,
|
|
64
|
-
component: context.component || '',
|
|
65
|
-
hook: context.hook || '',
|
|
66
|
-
args: context.args || [],
|
|
67
|
-
...context
|
|
68
|
-
};
|
|
69
|
-
|
|
70
|
-
if (error instanceof Error) {
|
|
71
|
-
errorInfo.message = error.message;
|
|
72
|
-
errorInfo.stack = error.stack || '';
|
|
73
|
-
errorInfo.name = error.name;
|
|
74
|
-
} else if (typeof error === 'string') {
|
|
75
|
-
errorInfo.message = error;
|
|
76
|
-
} else if (error && typeof error === 'object') {
|
|
77
|
-
errorInfo.message = error.message || JSON.stringify(error);
|
|
78
|
-
errorInfo.stack = error.stack || '';
|
|
79
|
-
errorInfo.name = error.name || '';
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
return errorInfo;
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
_generateId() {
|
|
86
|
-
return `err-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
_logError(errorInfo) {
|
|
90
|
-
this.errorLog.unshift(errorInfo);
|
|
91
|
-
if (this.errorLog.length > this.maxLogs) {
|
|
92
|
-
this.errorLog.pop();
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
console.error(`[KupolaError] [${errorInfo.type}] ${errorInfo.message}`, errorInfo);
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
_notifyHandlers(errorInfo) {
|
|
99
|
-
this.handlers.forEach((handler, key) => {
|
|
100
|
-
try {
|
|
101
|
-
handler(errorInfo);
|
|
102
|
-
} catch (e) {
|
|
103
|
-
console.error(`[KupolaErrorHandler] Error in handler "${key}":`, e);
|
|
104
|
-
}
|
|
105
|
-
});
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
on(type, handler) {
|
|
109
|
-
if (!this.handlers.has(type)) {
|
|
110
|
-
this.handlers.set(type, []);
|
|
111
|
-
}
|
|
112
|
-
this.handlers.get(type).push(handler);
|
|
113
|
-
}
|
|
114
|
-
|
|
115
|
-
off(type, handler) {
|
|
116
|
-
if (!this.handlers.has(type)) return;
|
|
117
|
-
|
|
118
|
-
const handlers = this.handlers.get(type);
|
|
119
|
-
const index = handlers.indexOf(handler);
|
|
120
|
-
if (index > -1) {
|
|
121
|
-
handlers.splice(index, 1);
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
getErrorLog() {
|
|
126
|
-
return [...this.errorLog];
|
|
127
|
-
}
|
|
128
|
-
|
|
129
|
-
clearErrorLog() {
|
|
130
|
-
this.errorLog = [];
|
|
131
|
-
}
|
|
132
|
-
|
|
133
|
-
getErrorCount() {
|
|
134
|
-
return this.errorLog.length;
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
getErrorByType(type) {
|
|
138
|
-
return this.errorLog.filter(err => err.type === type);
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
captureErrors(target, methodNames) {
|
|
142
|
-
if (!target || !methodNames || !Array.isArray(methodNames)) return;
|
|
143
|
-
|
|
144
|
-
methodNames.forEach(methodName => {
|
|
145
|
-
if (typeof target[methodName] === 'function') {
|
|
146
|
-
const originalMethod = target[methodName];
|
|
147
|
-
target[methodName] = function(...args) {
|
|
148
|
-
try {
|
|
149
|
-
const result = originalMethod.apply(this, args);
|
|
150
|
-
if (result instanceof Promise) {
|
|
151
|
-
return result.catch(error => {
|
|
152
|
-
kupolaErrorHandler.handleError(error, {
|
|
153
|
-
type: 'method',
|
|
154
|
-
component: target.constructor?.name || '',
|
|
155
|
-
hook: methodName,
|
|
156
|
-
args
|
|
157
|
-
});
|
|
158
|
-
throw error;
|
|
159
|
-
});
|
|
160
|
-
}
|
|
161
|
-
return result;
|
|
162
|
-
} catch (error) {
|
|
163
|
-
kupolaErrorHandler.handleError(error, {
|
|
164
|
-
type: 'method',
|
|
165
|
-
component: target.constructor?.name || '',
|
|
166
|
-
hook: methodName,
|
|
167
|
-
args
|
|
168
|
-
});
|
|
169
|
-
throw error;
|
|
170
|
-
}
|
|
171
|
-
};
|
|
172
|
-
}
|
|
173
|
-
});
|
|
174
|
-
}
|
|
175
|
-
}
|
|
176
|
-
|
|
177
|
-
const kupolaErrorHandler = new KupolaErrorHandler();
|
|
178
|
-
window.kupolaErrorHandler = kupolaErrorHandler;
|
|
179
|
-
window.KupolaErrorHandler = KupolaErrorHandler;
|
|
180
|
-
|
|
181
|
-
export default KupolaErrorHandler;
|