cx 23.4.4 → 23.5.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/src/ui/Restate.js CHANGED
@@ -1,158 +1,158 @@
1
- import { PureContainer } from "./PureContainer";
2
- import { Store } from "../data/Store";
3
- import { Cx } from "./Cx";
4
- import { isString } from "../util/isString";
5
- import { VDOM } from "./VDOM";
6
- import { isFunction } from "../util/isFunction";
7
- import { isObject } from "../util/isObject";
8
- import { isUndefined } from "../util/isUndefined";
9
- import { Binding } from "../data/Binding";
10
- import { StructuredSelector } from "../data/StructuredSelector";
11
-
12
- let persistenceCache = {};
13
-
14
- export class Restate extends PureContainer {
15
- declareData() {
16
- return super.declareData(...arguments, {
17
- deferredUntilIdle: undefined,
18
- idleTimeout: undefined,
19
- cacheKey: undefined,
20
- });
21
- }
22
-
23
- init() {
24
- this.container = PureContainer.create({
25
- type: PureContainer,
26
- items: this.children || this.items,
27
- layout: this.layout,
28
- controller: this.controller,
29
- outerLayout: this.outerLayout,
30
- useParentLayout: !this.detached,
31
- ws: this.ws,
32
- });
33
- this.privateDataSelector = new StructuredSelector({
34
- props: this.data || {},
35
- values: this.data,
36
- });
37
- delete this.items;
38
- delete this.children;
39
- delete this.controller;
40
- delete this.outerLayout;
41
- delete this.layout;
42
- if (this.useParentLayout == null) this.useParentLayout = !this.detached;
43
- super.init();
44
- }
45
-
46
- initSubStore(context, instance) {
47
- let { cacheKey } = instance.data;
48
- this.privateDataSelector.init(instance.store);
49
- instance.subStore = new RestateStore({
50
- store: instance.store,
51
- detached: this.detached,
52
- privateData: this.data || {},
53
- data: cacheKey ? persistenceCache[cacheKey] || {} : {},
54
- dataSelector: this.privateDataSelector.create(),
55
- onSet: (path, value) => instance.nestedDataSet(path, value, this.data),
56
- });
57
-
58
- instance.setStore = (store) => {
59
- instance.store = store;
60
- instance.subStore.setStore(store);
61
- };
62
-
63
- if (cacheKey) {
64
- instance.subscribeOnDestroy(() => {
65
- persistenceCache[cacheKey] = instance.subStore.getData();
66
- });
67
- }
68
- }
69
-
70
- explore(context, instance) {
71
- if (!instance.subStore) this.initSubStore(context, instance);
72
- if (instance.subStore.parentDataCheck()) instance.markShouldUpdate();
73
- super.explore(context, instance);
74
- }
75
-
76
- exploreItems(context, instance, items) {
77
- if (!this.detached) {
78
- instance.container = instance.getChild(context, this.container, "container", instance.subStore);
79
- instance.container.scheduleExploreIfVisible(context);
80
- instance.children = [instance.container];
81
- }
82
- }
83
-
84
- render(context, instance, key) {
85
- if (!this.detached) return instance.container.render(context);
86
-
87
- return (
88
- <Cx
89
- key={key}
90
- widget={this.container}
91
- parentInstance={instance}
92
- store={instance.subStore}
93
- subscribe
94
- options={this.options}
95
- onError={this.onError}
96
- deferredUntilIdle={instance.data.deferredUntilIdle}
97
- idleTimeout={instance.data.idleTimeout}
98
- />
99
- );
100
- }
101
- }
102
-
103
- Restate.prototype.detached = false;
104
- Restate.prototype.waitForIdle = false;
105
-
106
- export const PrivateStore = Restate;
107
-
108
- class RestateStore extends Store {
109
- constructor(config) {
110
- super(config);
111
- this.parentDataVersion = -1;
112
- }
113
-
114
- getData() {
115
- this.silently(() => {
116
- this.parentDataCheck();
117
- });
118
- return super.getData();
119
- }
120
-
121
- parentDataCheck() {
122
- if (this.parentDataVersion == this.store.meta.version) return false;
123
- this.parentDataVersion = this.store.meta.version;
124
- this.parentData = this.dataSelector(this.store.getData());
125
- return this.batch(() => {
126
- for (let key in this.parentData) {
127
- super.setItem(key, this.parentData[key]);
128
- }
129
- });
130
- }
131
-
132
- setItem(path, value) {
133
- let binding = Binding.get(path);
134
- let bindingRoot = binding.parts[0];
135
- if (!isObject(this.privateData) || !this.privateData.hasOwnProperty(bindingRoot)) {
136
- let changed = isUndefined(value) ? super.deleteItem(path) : super.setItem(path, value);
137
- return changed;
138
- }
139
-
140
- let newValue = value;
141
- if (binding.parts.length > 1) newValue = binding.set(this.getData(), value)[bindingRoot];
142
- this.onSet(bindingRoot, newValue);
143
- this.batch(() => {
144
- super.setItem(bindingRoot, newValue);
145
- this.parentDataCheck();
146
- });
147
- return true;
148
- }
149
-
150
- deleteItem(path) {
151
- return this.setItem(path, undefined);
152
- }
153
-
154
- doNotify() {
155
- if (!this.detached) this.store.notify();
156
- super.doNotify();
157
- }
158
- }
1
+ import { PureContainer } from "./PureContainer";
2
+ import { Store } from "../data/Store";
3
+ import { Cx } from "./Cx";
4
+ import { isString } from "../util/isString";
5
+ import { VDOM } from "./VDOM";
6
+ import { isFunction } from "../util/isFunction";
7
+ import { isObject } from "../util/isObject";
8
+ import { isUndefined } from "../util/isUndefined";
9
+ import { Binding } from "../data/Binding";
10
+ import { StructuredSelector } from "../data/StructuredSelector";
11
+
12
+ let persistenceCache = {};
13
+
14
+ export class Restate extends PureContainer {
15
+ declareData() {
16
+ return super.declareData(...arguments, {
17
+ deferredUntilIdle: undefined,
18
+ idleTimeout: undefined,
19
+ cacheKey: undefined,
20
+ });
21
+ }
22
+
23
+ init() {
24
+ this.container = PureContainer.create({
25
+ type: PureContainer,
26
+ items: this.children || this.items,
27
+ layout: this.layout,
28
+ controller: this.controller,
29
+ outerLayout: this.outerLayout,
30
+ useParentLayout: !this.detached,
31
+ ws: this.ws,
32
+ });
33
+ this.privateDataSelector = new StructuredSelector({
34
+ props: this.data || {},
35
+ values: this.data,
36
+ });
37
+ delete this.items;
38
+ delete this.children;
39
+ delete this.controller;
40
+ delete this.outerLayout;
41
+ delete this.layout;
42
+ if (this.useParentLayout == null) this.useParentLayout = !this.detached;
43
+ super.init();
44
+ }
45
+
46
+ initSubStore(context, instance) {
47
+ let { cacheKey } = instance.data;
48
+ this.privateDataSelector.init(instance.store);
49
+ instance.subStore = new RestateStore({
50
+ store: instance.store,
51
+ detached: this.detached,
52
+ privateData: this.data || {},
53
+ data: cacheKey ? persistenceCache[cacheKey] || {} : {},
54
+ dataSelector: this.privateDataSelector.create(),
55
+ onSet: (path, value) => instance.nestedDataSet(path, value, this.data),
56
+ });
57
+
58
+ instance.setStore = (store) => {
59
+ instance.store = store;
60
+ instance.subStore.setStore(store);
61
+ };
62
+
63
+ if (cacheKey) {
64
+ instance.subscribeOnDestroy(() => {
65
+ persistenceCache[cacheKey] = instance.subStore.getData();
66
+ });
67
+ }
68
+ }
69
+
70
+ explore(context, instance) {
71
+ if (!instance.subStore) this.initSubStore(context, instance);
72
+ if (instance.subStore.parentDataCheck()) instance.markShouldUpdate();
73
+ super.explore(context, instance);
74
+ }
75
+
76
+ exploreItems(context, instance, items) {
77
+ if (!this.detached) {
78
+ instance.container = instance.getChild(context, this.container, "container", instance.subStore);
79
+ instance.container.scheduleExploreIfVisible(context);
80
+ instance.children = [instance.container];
81
+ }
82
+ }
83
+
84
+ render(context, instance, key) {
85
+ if (!this.detached) return instance.container.render(context);
86
+
87
+ return (
88
+ <Cx
89
+ key={key}
90
+ widget={this.container}
91
+ parentInstance={instance}
92
+ store={instance.subStore}
93
+ subscribe
94
+ options={this.options}
95
+ onError={this.onError}
96
+ deferredUntilIdle={instance.data.deferredUntilIdle}
97
+ idleTimeout={instance.data.idleTimeout}
98
+ />
99
+ );
100
+ }
101
+ }
102
+
103
+ Restate.prototype.detached = false;
104
+ Restate.prototype.waitForIdle = false;
105
+
106
+ export const PrivateStore = Restate;
107
+
108
+ class RestateStore extends Store {
109
+ constructor(config) {
110
+ super(config);
111
+ this.parentDataVersion = -1;
112
+ }
113
+
114
+ getData() {
115
+ this.silently(() => {
116
+ this.parentDataCheck();
117
+ });
118
+ return super.getData();
119
+ }
120
+
121
+ parentDataCheck() {
122
+ if (this.parentDataVersion == this.store.meta.version) return false;
123
+ this.parentDataVersion = this.store.meta.version;
124
+ this.parentData = this.dataSelector(this.store.getData());
125
+ return this.batch(() => {
126
+ for (let key in this.parentData) {
127
+ super.setItem(key, this.parentData[key]);
128
+ }
129
+ });
130
+ }
131
+
132
+ setItem(path, value) {
133
+ let binding = Binding.get(path);
134
+ let bindingRoot = binding.parts[0];
135
+ if (!isObject(this.privateData) || !this.privateData.hasOwnProperty(bindingRoot)) {
136
+ let changed = isUndefined(value) ? super.deleteItem(path) : super.setItem(path, value);
137
+ return changed;
138
+ }
139
+
140
+ let newValue = value;
141
+ if (binding.parts.length > 1) newValue = binding.set(this.getData(), value)[bindingRoot];
142
+ this.onSet(bindingRoot, newValue);
143
+ this.batch(() => {
144
+ super.setItem(bindingRoot, newValue);
145
+ this.parentDataCheck();
146
+ });
147
+ return true;
148
+ }
149
+
150
+ deleteItem(path) {
151
+ return this.setItem(path, undefined);
152
+ }
153
+
154
+ doNotify() {
155
+ if (!this.detached) this.store.notify();
156
+ super.doNotify();
157
+ }
158
+ }
@@ -1,83 +1,86 @@
1
- import * as Cx from "../../core";
2
- import { FieldProps } from "./Field";
3
-
4
- export interface DateTimeFieldProps extends FieldProps {
5
- /** Selected date. This should be a Date object or a valid date string consumable by Date.parse function. */
6
- value?: Cx.Prop<string | Date>;
7
-
8
- /** Defaults to false. Used to make the field read-only. */
9
- readOnly?: Cx.BooleanProp;
10
-
11
- /** The opposite of `disabled`. */
12
- enabled?: Cx.BooleanProp;
13
-
14
- /** Default text displayed when the field is empty. */
15
- placeholder?: Cx.StringProp;
16
-
17
- /** Minimum date value. This should be a Date object or a valid date string consumable by Date.parse function. */
18
- minValue?: Cx.Prop<string | Date>;
19
-
20
- /** Set to `true` to disallow the `minValue`. Default value is `false`. */
21
- minExclusive?: Cx.BooleanProp;
22
-
23
- /** Maximum date value. This should be a Date object or a valid date string consumable by Date.parse function. */
24
- maxValue?: Cx.Prop<string | Date>;
25
-
26
- /** Set to `true` to disallow the `maxValue`. Default value is `false`. */
27
- maxExclusive?: Cx.BooleanProp;
28
-
29
- /** Date format used to display the selected date. See Formatting for more details. */
30
- format?: Cx.StringProp;
31
-
32
- /** Base CSS class to be applied to the field. Defaults to `datefield`. */
33
- baseClass?: string;
34
-
35
- /** Maximum value error text. */
36
- maxValueErrorText?: string;
37
-
38
- /** Maximum exclusive value error text. */
39
- maxExclusiveErrorText?: string;
40
-
41
- /** Minimum value error text. */
42
- minValueErrorText?: string;
43
-
44
- /** Minimum exclusive value error text. */
45
- minExclusiveErrorText?: string;
46
-
47
- /** Error message used to indicate wrong user input, e.g. invalid date entered. */
48
- inputErrorText?: string;
49
-
50
- /** Name of the icon to be put on the left side of the input. */
51
- icon?: string;
52
-
53
- /** Set to false to hide the clear button. It can be used interchangeably with the hideClear property. Default value is true. */
54
- showClear?: boolean;
55
-
56
- /**
57
- * Set to `true` to display the clear button even if `required` is set. Default is `false`.
58
- */
59
- alwaysShowClear?: boolean;
60
-
61
- /** Set to true to hide the clear button. It can be used interchangeably with the showClear property. Default value is false. */
62
- hideClear?: boolean;
63
-
64
- /** Determines which segment of date/time is used. Default value is `datetime`. */
65
- segment?: "date" | "time" | "datetime";
66
-
67
- /** Set to `true` to indicate that only one segment of the selected date is affected. */
68
- partial?: boolean;
69
-
70
- /** The function that will be used to convert Date objects before writing data to the store.
71
- * Default implementation is Date.toISOString.
72
- * See also Culture.setDefaultDateEncoding.
73
- */
74
- encoding?: (date: Date) => any;
75
-
76
- /** Defines which days of week should be displayed as disabled, i.e. `[0, 6]` will make Sunday and Saturday unselectable. */
77
- disabledDaysOfWeek?: number[];
78
-
79
- /** Set to true to focus the input field instead of the picker first. */
80
- focusInputFirst?: boolean;
81
- }
82
-
83
- export class DateTimeField extends Cx.Widget<DateTimeFieldProps> {}
1
+ import * as Cx from "../../core";
2
+ import { FieldProps } from "./Field";
3
+
4
+ export interface DateTimeFieldProps extends FieldProps {
5
+ /** Selected date. This should be a Date object or a valid date string consumable by Date.parse function. */
6
+ value?: Cx.Prop<string | Date>;
7
+
8
+ /** Defaults to false. Used to make the field read-only. */
9
+ readOnly?: Cx.BooleanProp;
10
+
11
+ /** The opposite of `disabled`. */
12
+ enabled?: Cx.BooleanProp;
13
+
14
+ /** Default text displayed when the field is empty. */
15
+ placeholder?: Cx.StringProp;
16
+
17
+ /** Minimum date value. This should be a Date object or a valid date string consumable by Date.parse function. */
18
+ minValue?: Cx.Prop<string | Date>;
19
+
20
+ /** Set to `true` to disallow the `minValue`. Default value is `false`. */
21
+ minExclusive?: Cx.BooleanProp;
22
+
23
+ /** Maximum date value. This should be a Date object or a valid date string consumable by Date.parse function. */
24
+ maxValue?: Cx.Prop<string | Date>;
25
+
26
+ /** Set to `true` to disallow the `maxValue`. Default value is `false`. */
27
+ maxExclusive?: Cx.BooleanProp;
28
+
29
+ /** Date format used to display the selected date. See Formatting for more details. */
30
+ format?: Cx.StringProp;
31
+
32
+ /** Base CSS class to be applied to the field. Defaults to `datefield`. */
33
+ baseClass?: string;
34
+
35
+ /** Maximum value error text. */
36
+ maxValueErrorText?: string;
37
+
38
+ /** Maximum exclusive value error text. */
39
+ maxExclusiveErrorText?: string;
40
+
41
+ /** Minimum value error text. */
42
+ minValueErrorText?: string;
43
+
44
+ /** Minimum exclusive value error text. */
45
+ minExclusiveErrorText?: string;
46
+
47
+ /** Error message used to indicate wrong user input, e.g. invalid date entered. */
48
+ inputErrorText?: string;
49
+
50
+ /** Name of the icon to be put on the left side of the input. */
51
+ icon?: string;
52
+
53
+ /** Set to false to hide the clear button. It can be used interchangeably with the hideClear property. Default value is true. */
54
+ showClear?: boolean;
55
+
56
+ /**
57
+ * Set to `true` to display the clear button even if `required` is set. Default is `false`.
58
+ */
59
+ alwaysShowClear?: boolean;
60
+
61
+ /** Set to true to hide the clear button. It can be used interchangeably with the showClear property. Default value is false. */
62
+ hideClear?: boolean;
63
+
64
+ /** Determines which segment of date/time is used. Default value is `datetime`. */
65
+ segment?: "date" | "time" | "datetime";
66
+
67
+ /** Set to `true` to indicate that only one segment of the selected date is affected. */
68
+ partial?: boolean;
69
+
70
+ /** The function that will be used to convert Date objects before writing data to the store.
71
+ * Default implementation is Date.toISOString.
72
+ * See also Culture.setDefaultDateEncoding.
73
+ */
74
+ encoding?: (date: Date) => any;
75
+
76
+ /** Defines which days of week should be displayed as disabled, i.e. `[0, 6]` will make Sunday and Saturday unselectable. */
77
+ disabledDaysOfWeek?: number[];
78
+
79
+ /** Set to true to focus the input field instead of the picker first. */
80
+ focusInputFirst?: boolean;
81
+
82
+ /** Set to true to enable seconds segment in the picker. */
83
+ showSeconds?: boolean;
84
+ }
85
+
86
+ export class DateTimeField extends Cx.Widget<DateTimeFieldProps> {}