@journeyapps-labs/reactor-mod 1.0.0

package/dist/forms/controls/ImageInput.js

@@ -0,0 +1,59 @@
+import { __classPrivateFieldGet, __classPrivateFieldSet, __esDecorate, __runInitializers } from "tslib";
+import * as React from 'react';
+import { FormInput } from '../FormInput';
+import { MediaEngine } from '../../media-engine';
+import { styled } from '../../stores/themes/reactor-theme-fragment';
+import { inject } from '../../inversify.config';
+import { UploadImagePreviewWidget } from '../../media-engine/types/images/UploadImagePreviewWidget';
+let ImageInput = (() => {
+    var _a, _ImageInput_mediaEngine_accessor_storage;
+    let _classSuper = FormInput;
+    let _mediaEngine_decorators;
+    let _mediaEngine_initializers = [];
+    let _mediaEngine_extraInitializers = [];
+    return _a = class ImageInput extends _classSuper {
+            get mediaEngine() { return __classPrivateFieldGet(this, _ImageInput_mediaEngine_accessor_storage, "f"); }
+            set mediaEngine(value) { __classPrivateFieldSet(this, _ImageInput_mediaEngine_accessor_storage, value, "f"); }
+            renderControl(options) {
+                return (React.createElement(UploadImagePreviewWidget, { media: this.value, onUpload: (media) => {
+                        this.setValue(media);
+                    } }));
+            }
+            constructor() {
+                super(...arguments);
+                _ImageInput_mediaEngine_accessor_storage.set(this, __runInitializers(this, _mediaEngine_initializers, void 0));
+                __runInitializers(this, _mediaEngine_extraInitializers);
+            }
+        },
+        _ImageInput_mediaEngine_accessor_storage = new WeakMap(),
+        (() => {
+            var _b;
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create((_b = _classSuper[Symbol.metadata]) !== null && _b !== void 0 ? _b : null) : void 0;
+            _mediaEngine_decorators = [inject(MediaEngine)];
+            __esDecorate(_a, null, _mediaEngine_decorators, { kind: "accessor", name: "mediaEngine", static: false, private: false, access: { has: obj => "mediaEngine" in obj, get: obj => obj.mediaEngine, set: (obj, value) => { obj.mediaEngine = value; } }, metadata: _metadata }, _mediaEngine_initializers, _mediaEngine_extraInitializers);
+            if (_metadata) Object.defineProperty(_a, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        })(),
+        _a;
+})();
+export { ImageInput };
+var S;
+(function (S) {
+    S.Text = styled.div `
+    position: absolute;
+    color: ${(p) => p.theme.forms.inputForeground};
+    top: 50%;
+    left: 50%;
+    transform: translateX(-50%) translateY(-50%);
+    font-size: 14px;
+    font-family: 'Open Sans';
+  `;
+    S.Preview = styled.div `
+    width: 200px;
+    height: 200px;
+    border-radius: 5px;
+    position: relative;
+    background: ${(p) => p.theme.forms.inputBackground};
+    cursor: pointer;
+  `;
+})(S || (S = {}));
+//# sourceMappingURL=ImageInput.js.map

package/dist/forms/controls/ImageInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageInput.js","sourceRoot":"","sources":["../../../src/forms/controls/ImageInput.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,SAAS,EAA6C,MAAM,cAAc,CAAC;AACpF,OAAO,EAAc,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC7D,OAAO,EAAE,MAAM,EAAE,MAAM,4CAA4C,CAAC;AACpE,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,wBAAwB,EAAE,MAAM,0DAA0D,CAAC;IAMvF,UAAU;;sBAAS,SAAS;;;;sBAA5B,UAAW,SAAQ,WAAsB;YAEpD,IAAS,WAAW,0FAAc;YAAlC,IAAS,WAAW,+FAAc;YAElC,aAAa,CAAC,OAA+B;gBAC3C,OAAO,CACL,oBAAC,wBAAwB,IACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;wBAClB,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;oBACvB,CAAC,GACD,CACH,CAAC;YACJ,CAAC;;;gBAXQ,+GAAyB;;;;;;;;uCADjC,MAAM,CAAC,WAAW,CAAC;YACpB,oLAAS,WAAW,6BAAX,WAAW,iGAAc;;;;;SAFvB,UAAU;AAgBvB,IAAU,CAAC,CAmBV;AAnBD,WAAU,CAAC;IACI,MAAI,GAAG,MAAM,CAAC,GAAG,CAAA;;aAEnB,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,eAAe;;;;;;GAM9C,CAAC;IAEW,SAAO,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;kBAKjB,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,eAAe;;GAEnD,CAAC;AACJ,CAAC,EAnBS,CAAC,KAAD,CAAC,QAmBV"}

package/dist/forms/controls/NumberInput.js

@@ -0,0 +1,73 @@
+import { __classPrivateFieldGet, __classPrivateFieldSet, __esDecorate, __runInitializers } from "tslib";
+import * as React from 'react';
+import { FormInput } from '../FormInput';
+import { Input } from '../../widgets';
+import { Observer } from 'mobx-react';
+import { observable } from 'mobx';
+let NumberInput = (() => {
+    var _a, _NumberInput_interemediateValue_accessor_storage;
+    let _classSuper = FormInput;
+    let _interemediateValue_decorators;
+    let _interemediateValue_initializers = [];
+    let _interemediateValue_extraInitializers = [];
+    return _a = class NumberInput extends _classSuper {
+            get interemediateValue() { return __classPrivateFieldGet(this, _NumberInput_interemediateValue_accessor_storage, "f"); }
+            set interemediateValue(value) { __classPrivateFieldSet(this, _NumberInput_interemediateValue_accessor_storage, value, "f"); }
+            constructor(options) {
+                super(options);
+                _NumberInput_interemediateValue_accessor_storage.set(this, __runInitializers(this, _interemediateValue_initializers, void 0));
+                __runInitializers(this, _interemediateValue_extraInitializers);
+                this.locked = false;
+                this.interemediateValue = options.value == null ? `` : `${options.value}`;
+            }
+            validate() {
+                if (this.options.required) {
+                    if (isNaN(this.value)) {
+                        return this.setError('Not valid');
+                    }
+                    if (this.options.min != null && this.value < this.options.min) {
+                        return this.setError(`Value must be greater than ${this.options.min}`);
+                    }
+                    if (this.options.max != null && this.value > this.options.max) {
+                        return this.setError(`Value must be less than ${this.options.max}`);
+                    }
+                }
+                super.validate();
+            }
+            setValue(value) {
+                if (!this.locked) {
+                    this.interemediateValue = value === null ? '' : `${value}`;
+                }
+                super.setValue(value);
+            }
+            setIntermediate(value) {
+                this.locked = true;
+                this.interemediateValue = value;
+                if (value.trim() === '') {
+                    this.setValue(null);
+                }
+                else {
+                    this.setValue(Number(value.trim()));
+                }
+                this.locked = false;
+            }
+            renderControl(options) {
+                return (React.createElement(Observer, { render: () => {
+                        return (React.createElement(Input, { "data-1p-ignore": "true", type: "text", autoComplete: "off", name: this.name, value: this.interemediateValue || '', onChange: (event) => {
+                                this.setIntermediate(event.target.value);
+                            } }));
+                    } }));
+            }
+        },
+        _NumberInput_interemediateValue_accessor_storage = new WeakMap(),
+        (() => {
+            var _b;
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create((_b = _classSuper[Symbol.metadata]) !== null && _b !== void 0 ? _b : null) : void 0;
+            _interemediateValue_decorators = [observable];
+            __esDecorate(_a, null, _interemediateValue_decorators, { kind: "accessor", name: "interemediateValue", static: false, private: false, access: { has: obj => "interemediateValue" in obj, get: obj => obj.interemediateValue, set: (obj, value) => { obj.interemediateValue = value; } }, metadata: _metadata }, _interemediateValue_initializers, _interemediateValue_extraInitializers);
+            if (_metadata) Object.defineProperty(_a, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        })(),
+        _a;
+})();
+export { NumberInput };
+//# sourceMappingURL=NumberInput.js.map

package/dist/forms/controls/NumberInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../../src/forms/controls/NumberInput.tsx"],"names":[],"mappings":"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"}

package/dist/forms/controls/ProviderInput.js

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { FormInput } from '../FormInput';
+import { ProviderButtonWidget } from '../../widgets';
+/**
+ * @deprecated
+ */
+export class ProviderInput extends FormInput {
+    renderControl(options) {
+        return (React.createElement(ProviderButtonWidget, { value: this.value, entityType: this.options.entityType, onChange: (item) => {
+                this.setValue(item);
+            } }));
+    }
+}
+//# sourceMappingURL=ProviderInput.js.map

package/dist/forms/controls/ProviderInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProviderInput.js","sourceRoot":"","sources":["../../../src/forms/controls/ProviderInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAA+D,MAAM,cAAc,CAAC;AACtG,OAAO,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAOrD;;GAEG;AACH,MAAM,OAAO,aAAc,SAAQ,SAKlC;IACC,aAAa,CAAC,OAA+B;QAC3C,OAAO,CACL,oBAAC,oBAAoB,IACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,UAAU,EAAE,IAAI,CAAC,OAAO,CAAC,UAAU,EACnC,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE;gBACjB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;YACtB,CAAC,GACD,CACH,CAAC;IACJ,CAAC;CACF"}

package/dist/forms/controls/SelectInput.js

@@ -0,0 +1,32 @@
+import { SetControl } from '../../controls/SetControl';
+import { ControlInput } from './ControlInput';
+export class SelectInput extends ControlInput {
+    constructor(options) {
+        super(options, new SetControl({
+            initialValue: options.value,
+            options: Object.keys(options.options).map((key) => {
+                return {
+                    key: key,
+                    label: options.options[key]
+                };
+            }),
+            disabled: options.disabled
+        }));
+        this.registerListener({
+            optionsUpdated: () => {
+                this.control.updateOptions({
+                    options: this.getOptions()
+                });
+            }
+        });
+    }
+    getOptions() {
+        return Object.keys(this.options.options).map((key) => {
+            return {
+                key: key,
+                label: this.options.options[key]
+            };
+        });
+    }
+}
+//# sourceMappingURL=SelectInput.js.map

package/dist/forms/controls/SelectInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInput.js","sourceRoot":"","sources":["../../../src/forms/controls/SelectInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAEvD,OAAO,EAAE,YAAY,EAAwB,MAAM,gBAAgB,CAAC;AAOpE,MAAM,OAAO,WAAuC,SAAQ,YAI3D;IACC,YAAY,OAA8B;QACxC,KAAK,CACH,OAAO,EACP,IAAI,UAAU,CAAC;YACb,YAAY,EAAE,OAAO,CAAC,KAAK;YAC3B,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE;gBAChD,OAAO;oBACL,GAAG,EAAE,GAAG;oBACR,KAAK,EAAE,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC;iBAC5B,CAAC;YACJ,CAAC,CAAC;YACF,QAAQ,EAAE,OAAO,CAAC,QAAQ;SAC3B,CAAC,CACH,CAAC;QACF,IAAI,CAAC,gBAAgB,CAAC;YACpB,cAAc,EAAE,GAAG,EAAE;gBACnB,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;oBACzB,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE;iBAC3B,CAAC,CAAC;YACL,CAAC;SACF,CAAC,CAAC;IACL,CAAC;IAED,UAAU;QACR,OAAO,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE;YACnD,OAAO;gBACL,GAAG,EAAE,GAAG;gBACR,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC;aACjC,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC;CACF"}

package/dist/forms/controls/collection/ArrayInput.js

@@ -0,0 +1,107 @@
+import * as React from 'react';
+import { useEffect } from 'react';
+import { FormInput } from '../../FormInput';
+import { FloatingPanelButtonWidget } from '../../../widgets/floating/FloatingPanelButtonWidget';
+import { styled } from '../../../stores/themes/reactor-theme-fragment';
+import { useForceUpdate } from '../../../hooks/useForceUpdate';
+import { LoadingPanelWidget } from '../../../widgets/panel/panel/LoadingPanelWidget';
+import { v4 } from 'uuid';
+import { PanelButtonWidget } from '../../../widgets/forms/PanelButtonWidget';
+export class ArrayInput extends FormInput {
+    constructor(options) {
+        super(Object.assign(Object.assign({}, options), { value: options.value || [] }));
+        this.entries = new Map();
+        this.entryListeners = new Set();
+        this.loading = false;
+    }
+    setLoading(loading = this.loading) {
+        if (this.loading === loading) {
+            return;
+        }
+        this.loading = loading;
+    }
+    setValue(values) {
+        if (values.length !== this.entries.size) {
+            this.entryListeners.forEach((e) => {
+                e();
+            });
+            this.entryListeners.clear();
+            this.entries.clear();
+            values.map((value) => {
+                const item = this.options.generate();
+                const listener = item.registerListener({
+                    valueChanged: () => {
+                        super.setValue(Array.from(this.entries.values()).map((v) => v.value));
+                    }
+                });
+                this.entryListeners.add(listener);
+                this.entries.set(v4(), item);
+            });
+        }
+        values.forEach((v, index) => {
+            Array.from(this.entries.values())[index].setValue(v);
+        });
+        super.setValue(values);
+    }
+    updateValue() {
+        this.setValue(Array.from(this.entries.values()).map((v) => v.value));
+    }
+    renderControl(options) {
+        return React.createElement(ArrayInputWidget, { input: this });
+    }
+}
+export const ArrayInputWidget = (props) => {
+    const input = props.input;
+    const forceUpdate = useForceUpdate();
+    useEffect(() => {
+        return props.input.registerListener({
+            loadingChanged: () => {
+                forceUpdate();
+            }
+        });
+    }, []);
+    if (props.input.loading) {
+        return (React.createElement(S.Container, null,
+            React.createElement(LoadingPanelWidget, { loading: true, children: () => null })));
+    }
+    return (React.createElement(S.Container, null,
+        React.createElement(S.Entries, null, Array.from(input.entries.keys()).map((key, index) => {
+            return (React.createElement(S.Entry, { key: key },
+                React.createElement(S.Display, null, input.entries.get(key).renderControl({ inline: true })),
+                React.createElement(FloatingPanelButtonWidget, { btn: {
+                        icon: 'close',
+                        action: () => {
+                            let value = [...input.value];
+                            value.splice(index, 1);
+                            input.setValue(value);
+                        }
+                    } })));
+        })),
+        React.createElement(PanelButtonWidget, { icon: "plus", action: () => {
+                input.setValue([...input.value, null]);
+            } })));
+};
+var S;
+(function (S) {
+    S.Container = styled.div ``;
+    S.Display = styled.div `
+    flex-grow: 1;
+  `;
+    S.Entries = styled.div `
+    padding-bottom: 5px;
+  `;
+    S.Entry = styled.div `
+    padding: 5px;
+    border-radius: 4px;
+    border: solid 1px ${(p) => p.theme.forms.groupBorder};
+    margin-bottom: 3px;
+    display: flex;
+    align-items: center;
+    column-gap: 5px;
+
+    &:last-of-type {
+      margin-bottom: 0;
+    }
+  `;
+})(S || (S = {}));
+//# sourceMappingURL=ArrayInput.js.map

package/dist/forms/controls/collection/ArrayInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArrayInput.js","sourceRoot":"","sources":["../../../../src/forms/controls/collection/ArrayInput.tsx"],"names":[],"mappings":"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"}

package/dist/forms/controls/collection/ArraySetInput.js

@@ -0,0 +1,127 @@
+import * as React from 'react';
+import { useEffect } from 'react';
+import { FormInput } from '../../FormInput';
+import { PanelDropdownWidget } from '../../../widgets/forms/PanelDropdownWidget';
+import { styled } from '../../../stores/themes/reactor-theme-fragment';
+import * as _ from 'lodash';
+import { useForceUpdate } from '../../../hooks/useForceUpdate';
+import { LoadingPanelWidget } from '../../../widgets/panel/panel/LoadingPanelWidget';
+import { PanelButtonMode, PanelButtonWidget } from '../../../widgets';
+export class ArraySetInput extends FormInput {
+    constructor(options) {
+        super(Object.assign(Object.assign({}, options), { value: options.value || {}, layout: options.layout || {
+                scrollLength: null
+            } }));
+        this.entries = new Map();
+        this.entryListeners = new Map();
+        this.loading = false;
+    }
+    setLoading(loading = this.loading) {
+        if (this.loading === loading) {
+            return;
+        }
+        this.loading = loading;
+    }
+    setValue(value) {
+        // to generate
+        _.difference(Object.keys(value), Array.from(this.entries.keys())).forEach((key) => {
+            const item = this.options.generate(key);
+            if (value[key]) {
+                item.setValue(value[key]);
+            }
+            const listener = item.registerListener({
+                valueChanged: () => {
+                    this.updateValue();
+                }
+            });
+            this.entryListeners.set(key, listener);
+            this.entries.set(key, item);
+        });
+        // inputs to remove
+        _.difference(Array.from(this.entries.keys()), Object.keys(value)).forEach((r) => {
+            this.entryListeners.get(r)();
+            this.entryListeners.delete(r);
+            this.entries.delete(r);
+        });
+        super.setValue(value);
+    }
+    updateValue() {
+        this.setValue(Array.from(this.entries.entries()).reduce((prev, cur) => {
+            prev[cur[0]] = cur[1].value;
+            return prev;
+        }, {}));
+    }
+    availableEntries() {
+        return this.options.entries.filter((i) => {
+            return !this.entries.has(i.key);
+        });
+    }
+    renderControl(options) {
+        return React.createElement(ArraySetInputWidget, { input: this });
+    }
+}
+export const ArraySetInputWidget = (props) => {
+    const input = props.input;
+    const forceUpdate = useForceUpdate();
+    useEffect(() => {
+        return props.input.registerListener({
+            loadingChanged: () => {
+                forceUpdate();
+            }
+        });
+    }, []);
+    if (props.input.loading) {
+        return (React.createElement(S.Container, null,
+            React.createElement(LoadingPanelWidget, { loading: true, children: () => null })));
+    }
+    return (React.createElement(S.Container, null,
+        React.createElement(S.Entries, { scroll: props.input.options.layout.scrollLength }, Array.from(input.entries.keys()).map((key) => {
+            return (React.createElement(ArraySetInputEntryWidget, { key: key, input: input.entries.get(key), label: input.options.entries.find((i) => i.key === key).title, remove: () => {
+                    let value = Object.assign({}, input.value);
+                    delete value[key];
+                    input.setValue(value);
+                } }));
+        })),
+        React.createElement(PanelDropdownWidget, Object.assign({ icon: "plus" }, (props.input.options.addbutton || {}), { disabled: input.availableEntries().length === 0, selected: null, items: input.availableEntries(), onChange: ({ key }) => {
+                input.setValue(Object.assign(Object.assign({}, input.value), { [key]: null }));
+            } }))));
+};
+export const ArraySetInputEntryWidget = (props) => {
+    return (React.createElement(S.Entry, null,
+        React.createElement(S.EntryTop, null,
+            React.createElement(S.EntryLabel, null, props.label),
+            React.createElement(PanelButtonWidget, { icon: "close", mode: PanelButtonMode.LINK, action: props.remove })),
+        React.createElement(S.Display, null, props.input.renderControl({ inline: true }))));
+};
+var S;
+(function (S) {
+    S.Container = styled.div ``;
+    // !----------- entry ----------
+    S.Display = styled.div `
+    padding: 10px;
+  `;
+    S.Entries = styled.div `
+    margin-bottom: 5px;
+    display: flex;
+    flex-direction: column;
+    row-gap: 8px;
+    overflow: auto;
+    ${(p) => (p.scroll ? `max-height: ${p.scroll}px` : '')};
+  `;
+    S.EntryLabel = styled.div `
+    flex-grow: 1;
+    color: ${(p) => p.theme.forms.groupLabelForeground};
+    font-size: 12px;
+  `;
+    S.Entry = styled.div `
+    border-radius: 4px;
+    border: solid 2px ${(p) => p.theme.forms.groupBorder};
+  `;
+    S.EntryTop = styled.div `
+    display: flex;
+    align-items: center;
+    background: ${(p) => p.theme.forms.groupBorder};
+    padding-left: 5px;
+  `;
+})(S || (S = {}));
+//# sourceMappingURL=ArraySetInput.js.map

package/dist/forms/controls/collection/ArraySetInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArraySetInput.js","sourceRoot":"","sources":["../../../../src/forms/controls/collection/ArraySetInput.tsx"],"names":[],"mappings":"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"}

package/dist/forms/controls/collection/GroupInput.js

@@ -0,0 +1,124 @@
+import { FormInput } from '../../FormInput';
+import { styled } from '../../../stores/themes/reactor-theme-fragment';
+import * as React from 'react';
+import { useEffect } from 'react';
+const calculateValue = (inputs) => {
+    if (!inputs) {
+        return {};
+    }
+    return inputs.reduce((prev, cur) => {
+        prev[cur.name] = cur.value;
+        return prev;
+    }, {});
+};
+export class GroupInput extends FormInput {
+    constructor(options) {
+        super(Object.assign(Object.assign({}, options), { layout: options.layout || {
+                horizontal: true,
+                border: false
+            } }));
+        this.setValueLock = false;
+        this.setInputs(options.inputs || []);
+    }
+    setInputs(inputs) {
+        var _a, _b;
+        (_a = this.disposeListeners) === null || _a === void 0 ? void 0 : _a.call(this);
+        this.inputs = inputs;
+        this.setValue(calculateValue(inputs));
+        const listeners = inputs.map((i) => {
+            return i.registerListener({
+                valueChanged: () => {
+                    this.setValueLock = true;
+                    this.setValue(calculateValue(inputs));
+                    this.setValueLock = false;
+                }
+            });
+        });
+        this.disposeListeners = () => {
+            listeners.forEach((l) => l());
+        };
+        if (this.value) {
+            for (let k in this.value) {
+                (_b = inputs.find((i) => i.name === k)) === null || _b === void 0 ? void 0 : _b.setValue(this.value[k]);
+            }
+        }
+    }
+    getInput(input) {
+        return this.inputs.find((i) => i.name === input);
+    }
+    setValue(value) {
+        super.setValue(value);
+        if (this.setValueLock) {
+            return;
+        }
+        for (let key in value) {
+            this.inputs.find((o) => o.name === key).setValue(value[key]);
+        }
+    }
+    dispose() {
+        this.disposeListeners();
+        this.disposeListeners = null;
+    }
+    renderInputWidget(options) {
+        if (this.options.layout.border) {
+            return React.createElement(GroupWidget, { input: this });
+        }
+        return super.renderInputWidget(options);
+    }
+    renderControl(options) {
+        const items = this.inputs.map((i) => {
+            return React.createElement(React.Fragment, { key: i.name }, i.renderInputWidget({ inline: true }));
+        });
+        return this.options.layout.horizontal ? React.createElement(S.HContainer, null, items) : React.createElement(S.VContainer, null, items);
+    }
+}
+export const GroupWidget = (props) => {
+    const [, updateState] = React.useState();
+    const forceUpdate = React.useCallback(() => updateState({}), []);
+    useEffect(() => {
+        return props.input.registerListener({
+            valueChanged: () => {
+                forceUpdate();
+            },
+            optionsUpdated: () => {
+                forceUpdate();
+            }
+        });
+    }, []);
+    if (!props.input.visible) {
+        return null;
+    }
+    return (React.createElement(S.Entry, null,
+        React.createElement(S.EntryTop, null, props.input.label),
+        React.createElement(S.Display, null, props.input.renderControl({ inline: false }))));
+};
+var S;
+(function (S) {
+    S.Display = styled.div `
+    padding: 10px;
+  `;
+    S.HContainer = styled.div `
+    display: flex;
+    align-items: flex-start;
+    column-gap: 10px;
+  `;
+    S.VContainer = styled.div `
+    display: flex;
+    flex-direction: column;
+    row-gap: 4px;
+  `;
+    S.Entry = styled.div `
+    border-radius: 4px;
+    border: solid 2px ${(p) => p.theme.forms.groupBorder};
+    margin-bottom: 3px;
+  `;
+    S.EntryTop = styled.div `
+    display: flex;
+    align-items: center;
+    background: ${(p) => p.theme.forms.groupBorder};
+    color: ${(p) => p.theme.forms.groupLabelForeground};
+    padding: 4px;
+    padding-left: 10px;
+  `;
+})(S || (S = {}));
+//# sourceMappingURL=GroupInput.js.map

package/dist/forms/controls/collection/GroupInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GroupInput.js","sourceRoot":"","sources":["../../../../src/forms/controls/collection/GroupInput.tsx"],"names":[],"mappings":"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"}

package/dist/forms/controls/text/AbstractTextInput.js

@@ -0,0 +1,19 @@
+import { FormInput } from '../../FormInput';
+export class AbstractTextInput extends FormInput {
+    setValue(value) {
+        if ((value === null || value === void 0 ? void 0 : value.trim()) === '') {
+            value = null;
+        }
+        super.setValue(value);
+        if (this.options.validator) {
+            if (!this.options.required && !value) {
+                return;
+            }
+            let validated = this.options.validator(value);
+            if (validated !== true) {
+                this.setError(validated || 'Not valid');
+            }
+        }
+    }
+}
+//# sourceMappingURL=AbstractTextInput.js.map

package/dist/forms/controls/text/AbstractTextInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AbstractTextInput.js","sourceRoot":"","sources":["../../../../src/forms/controls/text/AbstractTextInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAuC,MAAM,iBAAiB,CAAC;AAWjF,MAAM,OAAgB,iBAEpB,SAAQ,SAAmB;IAC3B,QAAQ,CAAC,KAAoB;QAC3B,IAAI,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,EAAE,MAAK,EAAE,EAAE,CAAC;YACzB,KAAK,GAAG,IAAI,CAAC;QACf,CAAC;QACD,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;QAEtB,IAAI,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE,CAAC;YAC3B,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,IAAI,CAAC,KAAK,EAAE,CAAC;gBACrC,OAAO;YACT,CAAC;YACD,IAAI,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;YAC9C,IAAI,SAAS,KAAK,IAAI,EAAE,CAAC;gBACvB,IAAI,CAAC,QAAQ,CAAE,SAAoB,IAAI,WAAW,CAAC,CAAC;YACtD,CAAC;QACH,CAAC;IACH,CAAC;CACF"}

package/dist/forms/controls/text/TextAreaInput.js

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { TextArea } from '../../../widgets';
+import { AbstractTextInput } from './AbstractTextInput';
+export class TextAreaInput extends AbstractTextInput {
+    renderControl(options) {
+        return (React.createElement(TextArea, { "data-1p-ignore": "true", autoComplete: "off", name: this.name, value: this.value || '', onChange: (event) => {
+                this.setValue(event.target.value);
+            } }));
+    }
+}
+//# sourceMappingURL=TextAreaInput.js.map

package/dist/forms/controls/text/TextAreaInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAreaInput.js","sourceRoot":"","sources":["../../../../src/forms/controls/text/TextAreaInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAE5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,MAAM,OAAO,aAAc,SAAQ,iBAAiB;IAClD,aAAa,CAAC,OAA+B;QAC3C,OAAO,CACL,oBAAC,QAAQ,sBACQ,MAAM,EACrB,YAAY,EAAC,KAAK,EAClB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,EAAE,EACvB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;gBAClB,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACpC,CAAC,GACD,CACH,CAAC;IACJ,CAAC;CACF"}

package/dist/forms/controls/text/TextInput.js

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { Input } from '../../../widgets';
+import { AbstractTextInput } from './AbstractTextInput';
+export var TextInputType;
+(function (TextInputType) {
+    TextInputType["TEXT"] = "text";
+    TextInputType["PASSWORD"] = "password";
+})(TextInputType || (TextInputType = {}));
+export class TextInput extends AbstractTextInput {
+    renderControl(options) {
+        return (React.createElement(Input, { "data-1p-ignore": "true", type: this.options.inputType || TextInputType.TEXT, autoComplete: "off", name: this.name, value: this.value || '', onChange: (event) => {
+                this.setValue(event.target.value);
+            } }));
+    }
+}
+//# sourceMappingURL=TextInput.js.map