@golemui/lit 0.16.2 → 1.0.0-rc.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.
- package/CHANGELOG.md +14 -0
- package/index.js +69 -63
- package/index.umd.cjs +2 -2
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,17 @@
|
|
|
1
|
+
## 0.17.0 (2026-06-08)
|
|
2
|
+
|
|
3
|
+
### 🚀 Features
|
|
4
|
+
|
|
5
|
+
- **core:** validation-aware submit buttons ([#167](https://github.com/golemui/golemui/pull/167))
|
|
6
|
+
|
|
7
|
+
### ❤️ Thank You
|
|
8
|
+
|
|
9
|
+
- Mud Scientist @mudscientist
|
|
10
|
+
|
|
11
|
+
## 0.16.2 (2026-05-30)
|
|
12
|
+
|
|
13
|
+
This was a version bump only for lit to align it with other projects, there were no code changes.
|
|
14
|
+
|
|
1
15
|
## 0.16.1 (2026-05-30)
|
|
2
16
|
|
|
3
17
|
This was a version bump only for lit to align it with other projects, there were no code changes.
|
package/index.js
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { createContext as h, consume as m, provide as I, ContextProvider as S } from "@lit/context";
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import { LitElement as f, nothing as
|
|
5
|
-
import { property as d, customElement as y, state as
|
|
6
|
-
import { when as
|
|
2
|
+
import { Subject as w, takeUntil as p, map as W, distinctUntilChanged as A, combineLatest as O } from "rxjs";
|
|
3
|
+
import { FormContext as N, calculatedWidgetsByUid$ as R, assertNoPropCollisions as L, dataByPath$ as P, validationByPath$ as F, injectedValidationByPath$ as M, touchedControlsByPath$ as U, calculatedLayoutChildrenByUid$ as V, makeRepeaterItemConfig as D, cloneObject as _, errorCodes as $, shortUUID as j, getDirectionFromLanguage as E, formHealth as B } from "@golemui/core";
|
|
4
|
+
import { LitElement as f, nothing as H, html as b } from "lit";
|
|
5
|
+
import { property as d, customElement as y, state as z } from "lit/decorators.js";
|
|
6
|
+
import { when as G } from "lit/directives/when.js";
|
|
7
7
|
const v = h("guiFormContext");
|
|
8
|
-
class
|
|
8
|
+
class k extends N {
|
|
9
9
|
// Just a subclass to make Core.FormContext Injectable
|
|
10
10
|
}
|
|
11
11
|
class g {
|
|
12
12
|
constructor() {
|
|
13
|
-
this.templateData = {}, this.destroy$ = new
|
|
13
|
+
this.templateData = {}, this.destroy$ = new w(), this.templateDataChanged$ = new w();
|
|
14
14
|
}
|
|
15
15
|
setTemplateData(t) {
|
|
16
16
|
this.templateData = { ...this.templateData, ...t }, this.templateDataChanged$.next();
|
|
@@ -23,13 +23,13 @@ class g {
|
|
|
23
23
|
}
|
|
24
24
|
// Listen to the calculated props stream and keep all widget props merged in a flattened object
|
|
25
25
|
templateDataUpdater() {
|
|
26
|
-
this.context.store.state$.pipe(p(this.destroy$),
|
|
26
|
+
this.context.store.state$.pipe(p(this.destroy$), R(this.widget.uid)).subscribe((t) => {
|
|
27
27
|
const o = {
|
|
28
28
|
...t,
|
|
29
29
|
lang: this.context.store.getState().lang,
|
|
30
30
|
deps: this.context.dependencies
|
|
31
31
|
};
|
|
32
|
-
|
|
32
|
+
L(t.uid, t.props, o), this.setTemplateData({
|
|
33
33
|
...o,
|
|
34
34
|
...t.props
|
|
35
35
|
});
|
|
@@ -42,8 +42,8 @@ class g {
|
|
|
42
42
|
}), this.destroy$.next();
|
|
43
43
|
}
|
|
44
44
|
}
|
|
45
|
-
const
|
|
46
|
-
class
|
|
45
|
+
const pt = h("guiActionWidgetAdapter");
|
|
46
|
+
class ht extends g {
|
|
47
47
|
constructor() {
|
|
48
48
|
super(...arguments), this.templateData = {};
|
|
49
49
|
}
|
|
@@ -52,14 +52,20 @@ class dt extends g {
|
|
|
52
52
|
label: this.widget.label,
|
|
53
53
|
icon: this.widget.props?.icon,
|
|
54
54
|
iconPosition: this.widget.props?.iconPosition
|
|
55
|
-
}), this.addWidgetToTheStore(t), this.templateDataUpdater(), this.context.
|
|
55
|
+
}), this.addWidgetToTheStore(t), this.templateDataUpdater(), this.context.store.state$.pipe(
|
|
56
|
+
p(this.destroy$),
|
|
57
|
+
W((o) => o.touched && !o.isFormValid),
|
|
58
|
+
A()
|
|
59
|
+
).subscribe((o) => {
|
|
60
|
+
this.setTemplateData({ invalid: o });
|
|
61
|
+
}), this.context.emitEvent("load", this.widget);
|
|
56
62
|
}
|
|
57
63
|
click() {
|
|
58
64
|
this.context.emitEvent("click", this.widget);
|
|
59
65
|
}
|
|
60
66
|
}
|
|
61
|
-
const
|
|
62
|
-
class
|
|
67
|
+
const ct = h("guiDisplayWidgetAdapter");
|
|
68
|
+
class lt extends g {
|
|
63
69
|
constructor() {
|
|
64
70
|
super(...arguments), this.templateData = {};
|
|
65
71
|
}
|
|
@@ -69,8 +75,8 @@ class ht extends g {
|
|
|
69
75
|
}), this.addWidgetToTheStore(t), this.templateDataUpdater();
|
|
70
76
|
}
|
|
71
77
|
}
|
|
72
|
-
const
|
|
73
|
-
class
|
|
78
|
+
const ut = h("guiInputWidgetAdapter");
|
|
79
|
+
class mt extends g {
|
|
74
80
|
constructor() {
|
|
75
81
|
super(...arguments), this.templateData = {};
|
|
76
82
|
}
|
|
@@ -78,21 +84,21 @@ class lt extends g {
|
|
|
78
84
|
this.widget = t, this.addWidgetToTheStore(t), this.templateDataUpdater(), this.context.store.dispatch({
|
|
79
85
|
type: "SET_WIDGET_INITIAL_DATA",
|
|
80
86
|
payload: { data: t.defaultValue, path: t.path }
|
|
81
|
-
}), this.context.store.state$.pipe(p(this.destroy$),
|
|
87
|
+
}), this.context.store.state$.pipe(p(this.destroy$), P(t.path)).subscribe((i) => this.setTemplateData({ value: i }));
|
|
82
88
|
const o = this.context.store.state$.pipe(
|
|
83
89
|
p(this.destroy$),
|
|
84
|
-
|
|
90
|
+
F(t.path)
|
|
85
91
|
), r = this.context.store.state$.pipe(
|
|
86
92
|
p(this.destroy$),
|
|
87
|
-
|
|
93
|
+
M(t.path)
|
|
88
94
|
);
|
|
89
|
-
|
|
95
|
+
O([o, r]).subscribe(
|
|
90
96
|
([i, s]) => {
|
|
91
97
|
this.setTemplateData({
|
|
92
98
|
errors: [...i ?? [], ...s ?? []]
|
|
93
99
|
});
|
|
94
100
|
}
|
|
95
|
-
), this.context.store.state$.pipe(p(this.destroy$),
|
|
101
|
+
), this.context.store.state$.pipe(p(this.destroy$), U(t.path)).subscribe((i) => this.setTemplateData({ touched: i })), this.context.emitEvent("load", this.widget);
|
|
96
102
|
}
|
|
97
103
|
valueChanged(t) {
|
|
98
104
|
this.context.store.dispatch({
|
|
@@ -122,15 +128,15 @@ class lt extends g {
|
|
|
122
128
|
}), this.context.emitEvent("blur", this.widget);
|
|
123
129
|
}
|
|
124
130
|
}
|
|
125
|
-
const
|
|
126
|
-
class
|
|
131
|
+
const gt = h("guiLayoutWidgetAdapter");
|
|
132
|
+
class bt extends g {
|
|
127
133
|
constructor() {
|
|
128
134
|
super(...arguments), this.templateData = {};
|
|
129
135
|
}
|
|
130
136
|
init(t) {
|
|
131
137
|
this.widget = t, this.setTemplateData({
|
|
132
138
|
...this.widget.props
|
|
133
|
-
}), this.context.store.state$.pipe(
|
|
139
|
+
}), this.context.store.state$.pipe(V(this.widget.uid)).pipe(p(this.destroy$)).subscribe((o) => {
|
|
134
140
|
this.setTemplateData({
|
|
135
141
|
children: o
|
|
136
142
|
});
|
|
@@ -141,12 +147,12 @@ class mt extends g {
|
|
|
141
147
|
}
|
|
142
148
|
}
|
|
143
149
|
const x = h("guiRepeaterIndexesContext");
|
|
144
|
-
var
|
|
150
|
+
var q = Object.defineProperty, l = (e, t, o, r) => {
|
|
145
151
|
for (var i = void 0, s = e.length - 1, a; s >= 0; s--)
|
|
146
152
|
(a = e[s]) && (i = a(t, o, i) || i);
|
|
147
|
-
return i &&
|
|
153
|
+
return i && q(t, o, i), i;
|
|
148
154
|
};
|
|
149
|
-
const
|
|
155
|
+
const J = (e) => {
|
|
150
156
|
class t extends e {
|
|
151
157
|
constructor() {
|
|
152
158
|
super(...arguments), this.repeaterIndexes = [];
|
|
@@ -159,7 +165,7 @@ const k = (e) => {
|
|
|
159
165
|
try {
|
|
160
166
|
const r = await this.formContext.widgetRegistry.loadWidget(this.widget.type), i = new r(), s = this.repeaterIndexes ?? [];
|
|
161
167
|
let a;
|
|
162
|
-
this.repeaterIndex !== void 0 ? a = [...s, this.repeaterIndex] : a = s, i.widget = a.length > 0 ?
|
|
168
|
+
this.repeaterIndex !== void 0 ? a = [...s, this.repeaterIndex] : a = s, i.widget = a.length > 0 ? D(_(this.widget), a) : this.widget, i.id = `host-${this.widget.uid}`, this.replaceWith(i);
|
|
163
169
|
} catch (r) {
|
|
164
170
|
console.error(`Widget "${this.widget.type}" could not be loaded`, r);
|
|
165
171
|
const i = $.widgetCouldNotBeLoaded;
|
|
@@ -192,25 +198,25 @@ const k = (e) => {
|
|
|
192
198
|
d({ attribute: !1 })
|
|
193
199
|
], t.prototype, "repeaterIndexes"), t;
|
|
194
200
|
};
|
|
195
|
-
var
|
|
196
|
-
for (var i = r > 1 ? void 0 : r ?
|
|
201
|
+
var Z = Object.getOwnPropertyDescriptor, Q = (e, t, o, r) => {
|
|
202
|
+
for (var i = r > 1 ? void 0 : r ? Z(t, o) : t, s = e.length - 1, a; s >= 0; s--)
|
|
197
203
|
(a = e[s]) && (i = a(i) || i);
|
|
198
204
|
return i;
|
|
199
205
|
};
|
|
200
|
-
let T = class extends
|
|
206
|
+
let T = class extends J(f) {
|
|
201
207
|
};
|
|
202
|
-
T =
|
|
208
|
+
T = Q([
|
|
203
209
|
y("gui-widget")
|
|
204
210
|
], T);
|
|
205
|
-
var
|
|
206
|
-
for (var i = r > 1 ? void 0 : r ?
|
|
211
|
+
var X = Object.defineProperty, Y = Object.getOwnPropertyDescriptor, c = (e, t, o, r) => {
|
|
212
|
+
for (var i = r > 1 ? void 0 : r ? Y(t, o) : t, s = e.length - 1, a; s >= 0; s--)
|
|
207
213
|
(a = e[s]) && (i = (r ? a(t, o, i) : a(i)) || i);
|
|
208
|
-
return r && i &&
|
|
214
|
+
return r && i && X(t, o, i), i;
|
|
209
215
|
};
|
|
210
216
|
let n = class extends f {
|
|
211
217
|
constructor() {
|
|
212
|
-
super(...arguments), this.context = new
|
|
213
|
-
}, this._defaultFormName =
|
|
218
|
+
super(...arguments), this.context = new k(), this.autocomplete = void 0, this.direction = "ltr", this.eventSub = [], this.unsubscribeI18n = () => {
|
|
219
|
+
}, this._defaultFormName = j();
|
|
214
220
|
}
|
|
215
221
|
connectedCallback() {
|
|
216
222
|
super.connectedCallback(), this.classList.add("gui-form"), this.configureLongLivedEvents();
|
|
@@ -249,9 +255,9 @@ let n = class extends f {
|
|
|
249
255
|
e.itemRenderers ?? {},
|
|
250
256
|
e.localization,
|
|
251
257
|
e.dependencies ?? {}
|
|
252
|
-
), this.direction =
|
|
258
|
+
), this.direction = E(this.context.localization.lang), this.stateSub = this.context.store.state$.subscribe((t) => {
|
|
253
259
|
this.formState = t, this.requestUpdate();
|
|
254
|
-
}), this.healthSub =
|
|
260
|
+
}), this.healthSub = B(this.context.store.state$).subscribe((t) => {
|
|
255
261
|
this.dispatchEvent(
|
|
256
262
|
new CustomEvent(n.FORM_HEALTH_EVENT, {
|
|
257
263
|
detail: t,
|
|
@@ -262,7 +268,7 @@ let n = class extends f {
|
|
|
262
268
|
type: "INITIALIZE",
|
|
263
269
|
payload: { formName: e.formName ?? this._defaultFormName, formDef: e.formDef }
|
|
264
270
|
}), this.context.store.dispatch({ type: "SET_DATA", payload: { data: e.data ?? {} } }), this.context.store.dispatch({ type: "SET_META", payload: { meta: e.meta ?? {} } }), this.unsubscribeI18n = this.context.localization.subscribe((t) => {
|
|
265
|
-
this.direction =
|
|
271
|
+
this.direction = E(t), this.context.store.dispatch({ type: "SET_LANGUAGE", payload: { lang: t } });
|
|
266
272
|
});
|
|
267
273
|
}
|
|
268
274
|
createRenderRoot() {
|
|
@@ -275,10 +281,10 @@ let n = class extends f {
|
|
|
275
281
|
id=${t}
|
|
276
282
|
novalidate
|
|
277
283
|
dir=${this.direction}
|
|
278
|
-
autocomplete=${this.autocomplete ||
|
|
284
|
+
autocomplete=${this.autocomplete || H}
|
|
279
285
|
@submit=${this.onFormSubmit}
|
|
280
286
|
>
|
|
281
|
-
${
|
|
287
|
+
${G(
|
|
282
288
|
e,
|
|
283
289
|
() => b` <gui-widget .widget=${this.formState?.formDef.form}></gui-widget>`,
|
|
284
290
|
() => b` <div>Loading form...</div>`
|
|
@@ -315,17 +321,17 @@ c([
|
|
|
315
321
|
d({ type: String })
|
|
316
322
|
], n.prototype, "autocomplete", 2);
|
|
317
323
|
c([
|
|
318
|
-
|
|
324
|
+
z()
|
|
319
325
|
], n.prototype, "direction", 2);
|
|
320
326
|
n = c([
|
|
321
327
|
y("gui-core-form")
|
|
322
328
|
], n);
|
|
323
|
-
var
|
|
329
|
+
var K = Object.defineProperty, u = (e, t, o, r) => {
|
|
324
330
|
for (var i = void 0, s = e.length - 1, a; s >= 0; s--)
|
|
325
331
|
(a = e[s]) && (i = a(t, o, i) || i);
|
|
326
|
-
return i &&
|
|
332
|
+
return i && K(t, o, i), i;
|
|
327
333
|
};
|
|
328
|
-
const
|
|
334
|
+
const tt = (e) => {
|
|
329
335
|
class t extends e {
|
|
330
336
|
constructor() {
|
|
331
337
|
super(...arguments), this.repeaterIndex = -1, this.parentRepeaterIndexes = [];
|
|
@@ -340,8 +346,8 @@ const Y = (e) => {
|
|
|
340
346
|
new S(s, {
|
|
341
347
|
context: x,
|
|
342
348
|
initialValue: a
|
|
343
|
-
}), s.widget =
|
|
344
|
-
|
|
349
|
+
}), s.widget = D(
|
|
350
|
+
_(this.widget),
|
|
345
351
|
a
|
|
346
352
|
), s.id = `host-${this.widget.uid}`, this.replaceWith(s);
|
|
347
353
|
} catch (i) {
|
|
@@ -376,30 +382,30 @@ const Y = (e) => {
|
|
|
376
382
|
d({ attribute: !1 })
|
|
377
383
|
], t.prototype, "parentRepeaterIndexes"), t;
|
|
378
384
|
};
|
|
379
|
-
var
|
|
380
|
-
for (var i = r > 1 ? void 0 : r ?
|
|
385
|
+
var et = Object.getOwnPropertyDescriptor, it = (e, t, o, r) => {
|
|
386
|
+
for (var i = r > 1 ? void 0 : r ? et(t, o) : t, s = e.length - 1, a; s >= 0; s--)
|
|
381
387
|
(a = e[s]) && (i = a(i) || i);
|
|
382
388
|
return i;
|
|
383
389
|
};
|
|
384
|
-
let
|
|
390
|
+
let C = class extends tt(f) {
|
|
385
391
|
};
|
|
386
|
-
|
|
392
|
+
C = it([
|
|
387
393
|
y("gui-repeater-widget")
|
|
388
|
-
],
|
|
394
|
+
], C);
|
|
389
395
|
export {
|
|
390
|
-
|
|
396
|
+
ht as ActionWidgetAdapter,
|
|
391
397
|
g as BaseWidgetAdapter,
|
|
392
|
-
|
|
398
|
+
lt as DisplayWidgetAdapter,
|
|
393
399
|
n as FormElement,
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
400
|
+
mt as InputWidgetAdapter,
|
|
401
|
+
bt as LayoutWidgetAdapter,
|
|
402
|
+
k as LitFormContext,
|
|
403
|
+
C as RepeaterWidgetElement,
|
|
398
404
|
T as WidgetElement,
|
|
399
|
-
|
|
400
|
-
|
|
405
|
+
pt as actionContext,
|
|
406
|
+
ct as displayWidgetContext,
|
|
401
407
|
v as formContext,
|
|
402
|
-
|
|
403
|
-
|
|
408
|
+
ut as inputContext,
|
|
409
|
+
gt as layoutContext,
|
|
404
410
|
x as repeaterIndexesContext
|
|
405
411
|
};
|
package/index.umd.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(i,p){typeof exports=="object"&&typeof module<"u"?p(exports,require("@lit/context"),require("
|
|
1
|
+
(function(i,p){typeof exports=="object"&&typeof module<"u"?p(exports,require("@lit/context"),require("rxjs"),require("@golemui/core"),require("lit"),require("lit/decorators.js"),require("lit/directives/when.js")):typeof define=="function"&&define.amd?define(["exports","@lit/context","rxjs","@golemui/core","lit","lit/decorators.js","lit/directives/when.js"],p):(i=typeof globalThis<"u"?globalThis:i||self,p(i.lit={},i.context,i.rxjs,i.core,i.lit,i.decorators_js,i.when_js))})(this,(function(i,p,l,d,u,h,v){"use strict";const g=p.createContext("guiFormContext");class E extends d.FormContext{}class m{constructor(){this.templateData={},this.destroy$=new l.Subject,this.templateDataChanged$=new l.Subject}setTemplateData(t){this.templateData={...this.templateData,...t},this.templateDataChanged$.next()}addWidgetToTheStore(t){this.context.store.dispatch({type:"ADD_WIDGET",payload:{widget:t}})}templateDataUpdater(){this.context.store.state$.pipe(l.takeUntil(this.destroy$),d.calculatedWidgetsByUid$(this.widget.uid)).subscribe(t=>{const s={...t,lang:this.context.store.getState().lang,deps:this.context.dependencies};d.assertNoPropCollisions(t.uid,t.props,s),this.setTemplateData({...s,...t.props})})}destroy(){this.context.store.dispatch({type:"REMOVE_WIDGET",payload:{uid:this.widget.uid}}),this.destroy$.next()}}const C=p.createContext("guiActionWidgetAdapter");class w extends m{constructor(){super(...arguments),this.templateData={}}init(t){this.widget=t,this.setTemplateData({label:this.widget.label,icon:this.widget.props?.icon,iconPosition:this.widget.props?.iconPosition}),this.addWidgetToTheStore(t),this.templateDataUpdater(),this.context.store.state$.pipe(l.takeUntil(this.destroy$),l.map(s=>s.touched&&!s.isFormValid),l.distinctUntilChanged()).subscribe(s=>{this.setTemplateData({invalid:s})}),this.context.emitEvent("load",this.widget)}click(){this.context.emitEvent("click",this.widget)}}const x=p.createContext("guiDisplayWidgetAdapter");class T extends m{constructor(){super(...arguments),this.templateData={}}init(t){this.widget=t,this.setTemplateData({...this.widget.props}),this.addWidgetToTheStore(t),this.templateDataUpdater()}}const D=p.createContext("guiInputWidgetAdapter");class $ extends m{constructor(){super(...arguments),this.templateData={}}init(t){this.widget=t,this.addWidgetToTheStore(t),this.templateDataUpdater(),this.context.store.dispatch({type:"SET_WIDGET_INITIAL_DATA",payload:{data:t.defaultValue,path:t.path}}),this.context.store.state$.pipe(l.takeUntil(this.destroy$),d.dataByPath$(t.path)).subscribe(e=>this.setTemplateData({value:e}));const s=this.context.store.state$.pipe(l.takeUntil(this.destroy$),d.validationByPath$(t.path)),r=this.context.store.state$.pipe(l.takeUntil(this.destroy$),d.injectedValidationByPath$(t.path));l.combineLatest([s,r]).subscribe(([e,n])=>{this.setTemplateData({errors:[...e??[],...n??[]]})}),this.context.store.state$.pipe(l.takeUntil(this.destroy$),d.touchedControlsByPath$(t.path)).subscribe(e=>this.setTemplateData({touched:e})),this.context.emitEvent("load",this.widget)}valueChanged(t){this.context.store.dispatch({type:"SET_WIDGET_DATA",payload:{path:this.widget.path,data:t}}),this.context.emitEvent("change",this.widget)}filterChanged(t){this.context.emitEvent("filter",this.widget,t)}injectValidationIssues(t){this.context.store.dispatch({type:"INJECT_VALIDATION_ISSUES",payload:{path:this.widget.path,issues:t}})}getItemRenderer(t,s){return t?this.context.itemRenderers[t]:s}onBlur(){this.context.store.dispatch({type:"ATTEMPT_VALIDATION",payload:{reason:"blur",path:this.widget.path,uid:this.widget.uid}}),this.context.emitEvent("blur",this.widget)}}const I=p.createContext("guiLayoutWidgetAdapter");class W extends m{constructor(){super(...arguments),this.templateData={}}init(t){this.widget=t,this.setTemplateData({...this.widget.props}),this.context.store.state$.pipe(d.calculatedLayoutChildrenByUid$(this.widget.uid)).pipe(l.takeUntil(this.destroy$)).subscribe(s=>{this.setTemplateData({children:s})}),this.addWidgetToTheStore(t),this.templateDataUpdater()}change(t){this.context.emitEvent("change",this.widget,t)}}const b=p.createContext("guiRepeaterIndexesContext");var S=Object.defineProperty,y=(a,t,s,r)=>{for(var e=void 0,n=a.length-1,o;n>=0;n--)(o=a[n])&&(e=o(t,s,e)||e);return e&&S(t,s,e),e};const _=a=>{class t extends a{constructor(){super(...arguments),this.repeaterIndexes=[]}connectedCallback(){super.connectedCallback?.(),this.loadWidgetComponent()}async loadWidgetComponent(){if(this.widget)try{const r=await this.formContext.widgetRegistry.loadWidget(this.widget.type),e=new r,n=this.repeaterIndexes??[];let o;this.repeaterIndex!==void 0?o=[...n,this.repeaterIndex]:o=n,e.widget=o.length>0?d.makeRepeaterItemConfig(d.cloneObject(this.widget),o):this.widget,e.id=`host-${this.widget.uid}`,this.replaceWith(e)}catch(r){console.error(`Widget "${this.widget.type}" could not be loaded`,r);const e=d.errorCodes.widgetCouldNotBeLoaded;this.dispatchEvent(new CustomEvent("formHealth",{detail:{status:"errored",message:`[${e}] Widget "${this.widget.type}" could not be loaded`,code:e},bubbles:!0,composed:!0}))}}render(){return null}}return y([p.consume({context:g}),h.property({attribute:!1})],t.prototype,"formContext"),y([h.property({type:Object})],t.prototype,"widget"),y([h.property({type:Number})],t.prototype,"repeaterIndex"),y([p.consume({context:b,subscribe:!0}),h.property({attribute:!1})],t.prototype,"repeaterIndexes"),t};var A=Object.getOwnPropertyDescriptor,F=(a,t,s,r)=>{for(var e=r>1?void 0:r?A(t,s):t,n=a.length-1,o;n>=0;n--)(o=a[n])&&(e=o(e)||e);return e};i.WidgetElement=class extends _(u.LitElement){},i.WidgetElement=F([h.customElement("gui-widget")],i.WidgetElement);var L=Object.defineProperty,R=Object.getOwnPropertyDescriptor,c=(a,t,s,r)=>{for(var e=r>1?void 0:r?R(t,s):t,n=a.length-1,o;n>=0;n--)(o=a[n])&&(e=(r?o(t,s,e):o(e))||e);return r&&e&&L(t,s,e),e};i.FormElement=class extends u.LitElement{constructor(){super(...arguments),this.context=new E,this.autocomplete=void 0,this.direction="ltr",this.eventSub=[],this.unsubscribeI18n=()=>{},this._defaultFormName=d.shortUUID()}connectedCallback(){super.connectedCallback(),this.classList.add("gui-form"),this.configureLongLivedEvents()}configureLongLivedEvents(){this.eventSub.push(this.context.events$.subscribe(t=>this.dispatchEvent(new CustomEvent(i.FormElement.FORM_EVENT,{detail:t,bubbles:!0})))),this.eventSub.push(this.context.submit$.subscribe(t=>this.dispatchEvent(new CustomEvent(i.FormElement.FORM_SUBMIT_EVENT,{detail:t,bubbles:!0}))))}updated(t){super.updated(t),t.has("config")&&this.config&&this._reinitialize(this.config)}_reinitialize(t){this.unsubscribeI18n(),this.stateSub?.unsubscribe(),this.healthSub?.unsubscribe(),this.context.initialize(t.widgetLoaders,t.middlewares??[],this.validators,t.validateOn??"eager",t.itemRenderers??{},t.localization,t.dependencies??{}),this.direction=d.getDirectionFromLanguage(this.context.localization.lang),this.stateSub=this.context.store.state$.subscribe(s=>{this.formState=s,this.requestUpdate()}),this.healthSub=d.formHealth(this.context.store.state$).subscribe(s=>{this.dispatchEvent(new CustomEvent(i.FormElement.FORM_HEALTH_EVENT,{detail:s,bubbles:!0}))}),this.context.store.dispatch({type:"INITIALIZE",payload:{formName:t.formName??this._defaultFormName,formDef:t.formDef}}),this.context.store.dispatch({type:"SET_DATA",payload:{data:t.data??{}}}),this.context.store.dispatch({type:"SET_META",payload:{meta:t.meta??{}}}),this.unsubscribeI18n=this.context.localization.subscribe(s=>{this.direction=d.getDirectionFromLanguage(s),this.context.store.dispatch({type:"SET_LANGUAGE",payload:{lang:s}})})}createRenderRoot(){return this}render(){const t=this.formState?.formDef&&this.context.widgetRegistry.ready,s=this.config?.formName??this._defaultFormName;return u.html`
|
|
2
2
|
<form
|
|
3
3
|
id=${s}
|
|
4
4
|
novalidate
|
|
@@ -8,4 +8,4 @@
|
|
|
8
8
|
>
|
|
9
9
|
${v.when(t,()=>u.html` <gui-widget .widget=${this.formState?.formDef.form}></gui-widget>`,()=>u.html` <div>Loading form...</div>`)}
|
|
10
10
|
</form>
|
|
11
|
-
`}onFormSubmit(t){t.preventDefault(),this.context.emitSubmitEvent()}setData(t){this.context.store.dispatch({type:"SET_DATA",payload:{data:t}})}setMeta(t){this.context.store.dispatch({type:"SET_META",payload:{meta:t}})}disconnectedCallback(){super.disconnectedCallback(),this.stateSub?.unsubscribe(),this.healthSub?.unsubscribe(),this.eventSub.map(t=>t.unsubscribe()),this.unsubscribeI18n()}},i.FormElement.FORM_SUBMIT_EVENT="formSubmit",i.FormElement.FORM_HEALTH_EVENT="formHealth",i.FormElement.FORM_EVENT="formEvent",c([p.provide({context:g})],i.FormElement.prototype,"context",2),c([h.property({attribute:!1})],i.FormElement.prototype,"config",2),c([h.property({attribute:!1})],i.FormElement.prototype,"validators",2),c([h.property({type:String})],i.FormElement.prototype,"autocomplete",2),c([h.state()],i.FormElement.prototype,"direction",2),i.FormElement=c([h.customElement("gui-core-form")],i.FormElement);var O=Object.defineProperty,f=(a,t,s,r)=>{for(var e=void 0,n=a.length-1,o;n>=0;n--)(o=a[n])&&(e=o(t,s,e)||e);return e&&O(t,s,e),e};const N=a=>{class t extends a{constructor(){super(...arguments),this.repeaterIndex=-1,this.parentRepeaterIndexes=[]}connectedCallback(){super.connectedCallback(),this.loadWidgetComponent(this.repeaterIndex)}async loadWidgetComponent(r){if(this.widget)try{const e=await this.formContext.widgetRegistry.loadWidget(this.widget.type),n=new e,o=[...this.parentRepeaterIndexes??[],r];new p.ContextProvider(n,{context:b,initialValue:o}),n.widget=d.makeRepeaterItemConfig(d.cloneObject(this.widget),o),n.id=`host-${this.widget.uid}`,this.replaceWith(n)}catch(e){console.error(`Widget "${this.widget.type}" could not be loaded`,e);const n=d.errorCodes.widgetCouldNotBeLoaded;this.dispatchEvent(new CustomEvent("formHealth",{detail:{status:"errored",message:`[${n}] Widget "${this.widget.type}" could not be loaded`,code:n},bubbles:!0,composed:!0}))}}render(){return null}}return f([p.consume({context:g}),h.property({attribute:!1})],t.prototype,"formContext"),f([h.property({type:Object})],t.prototype,"widget"),f([h.property({type:Number})],t.prototype,"repeaterIndex"),f([p.consume({context:b,subscribe:!0}),h.property({attribute:!1})],t.prototype,"parentRepeaterIndexes"),t};var P=Object.getOwnPropertyDescriptor,U=(a,t,s,r)=>{for(var e=r>1?void 0:r?P(t,s):t,n=a.length-1,o;n>=0;n--)(o=a[n])&&(e=o(e)||e);return e};i.RepeaterWidgetElement=class extends N(u.LitElement){},i.RepeaterWidgetElement=U([h.customElement("gui-repeater-widget")],i.RepeaterWidgetElement),i.ActionWidgetAdapter=
|
|
11
|
+
`}onFormSubmit(t){t.preventDefault(),this.context.emitSubmitEvent()}setData(t){this.context.store.dispatch({type:"SET_DATA",payload:{data:t}})}setMeta(t){this.context.store.dispatch({type:"SET_META",payload:{meta:t}})}disconnectedCallback(){super.disconnectedCallback(),this.stateSub?.unsubscribe(),this.healthSub?.unsubscribe(),this.eventSub.map(t=>t.unsubscribe()),this.unsubscribeI18n()}},i.FormElement.FORM_SUBMIT_EVENT="formSubmit",i.FormElement.FORM_HEALTH_EVENT="formHealth",i.FormElement.FORM_EVENT="formEvent",c([p.provide({context:g})],i.FormElement.prototype,"context",2),c([h.property({attribute:!1})],i.FormElement.prototype,"config",2),c([h.property({attribute:!1})],i.FormElement.prototype,"validators",2),c([h.property({type:String})],i.FormElement.prototype,"autocomplete",2),c([h.state()],i.FormElement.prototype,"direction",2),i.FormElement=c([h.customElement("gui-core-form")],i.FormElement);var O=Object.defineProperty,f=(a,t,s,r)=>{for(var e=void 0,n=a.length-1,o;n>=0;n--)(o=a[n])&&(e=o(t,s,e)||e);return e&&O(t,s,e),e};const N=a=>{class t extends a{constructor(){super(...arguments),this.repeaterIndex=-1,this.parentRepeaterIndexes=[]}connectedCallback(){super.connectedCallback(),this.loadWidgetComponent(this.repeaterIndex)}async loadWidgetComponent(r){if(this.widget)try{const e=await this.formContext.widgetRegistry.loadWidget(this.widget.type),n=new e,o=[...this.parentRepeaterIndexes??[],r];new p.ContextProvider(n,{context:b,initialValue:o}),n.widget=d.makeRepeaterItemConfig(d.cloneObject(this.widget),o),n.id=`host-${this.widget.uid}`,this.replaceWith(n)}catch(e){console.error(`Widget "${this.widget.type}" could not be loaded`,e);const n=d.errorCodes.widgetCouldNotBeLoaded;this.dispatchEvent(new CustomEvent("formHealth",{detail:{status:"errored",message:`[${n}] Widget "${this.widget.type}" could not be loaded`,code:n},bubbles:!0,composed:!0}))}}render(){return null}}return f([p.consume({context:g}),h.property({attribute:!1})],t.prototype,"formContext"),f([h.property({type:Object})],t.prototype,"widget"),f([h.property({type:Number})],t.prototype,"repeaterIndex"),f([p.consume({context:b,subscribe:!0}),h.property({attribute:!1})],t.prototype,"parentRepeaterIndexes"),t};var P=Object.getOwnPropertyDescriptor,U=(a,t,s,r)=>{for(var e=r>1?void 0:r?P(t,s):t,n=a.length-1,o;n>=0;n--)(o=a[n])&&(e=o(e)||e);return e};i.RepeaterWidgetElement=class extends N(u.LitElement){},i.RepeaterWidgetElement=U([h.customElement("gui-repeater-widget")],i.RepeaterWidgetElement),i.ActionWidgetAdapter=w,i.BaseWidgetAdapter=m,i.DisplayWidgetAdapter=T,i.InputWidgetAdapter=$,i.LayoutWidgetAdapter=W,i.LitFormContext=E,i.actionContext=C,i.displayWidgetContext=x,i.formContext=g,i.inputContext=D,i.layoutContext=I,i.repeaterIndexesContext=b,Object.defineProperty(i,Symbol.toStringTag,{value:"Module"})}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@golemui/lit",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.0-rc.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./index.umd.cjs",
|
|
6
6
|
"module": "./index.js",
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
"*.md"
|
|
21
21
|
],
|
|
22
22
|
"peerDependencies": {
|
|
23
|
-
"@golemui/core": "0.
|
|
23
|
+
"@golemui/core": "1.0.0-rc.0",
|
|
24
24
|
"@lit/context": "^1.1.6",
|
|
25
25
|
"lit": "^3.3.1",
|
|
26
26
|
"rxjs": "^7.8.0"
|