@webiny/react-properties 0.0.0-unstable.3386f66516 → 0.0.0-unstable.3bc8100a7f
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/Properties.d.ts +16 -3
- package/Properties.js +172 -181
- package/Properties.js.map +1 -1
- package/createConfigurableComponent.d.ts +15 -0
- package/createConfigurableComponent.js +85 -0
- package/createConfigurableComponent.js.map +1 -0
- package/index.d.ts +3 -0
- package/index.js +6 -30
- package/index.js.map +1 -1
- package/package.json +11 -13
- package/useDebugConfig.d.ts +7 -0
- package/useDebugConfig.js +19 -0
- package/useDebugConfig.js.map +1 -0
- package/useIdGenerator.d.ts +1 -0
- package/useIdGenerator.js +14 -0
- package/useIdGenerator.js.map +1 -0
- package/utils.d.ts +2 -2
- package/utils.js +36 -43
- package/utils.js.map +1 -1
package/Properties.d.ts
CHANGED
|
@@ -1,17 +1,26 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
export interface ConnectToPropertiesProps {
|
|
3
|
+
name: string;
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
}
|
|
6
|
+
export declare const ConnectToProperties: ({ name, children }: ConnectToPropertiesProps) => React.JSX.Element;
|
|
2
7
|
export interface Property {
|
|
3
8
|
id: string;
|
|
4
9
|
parent: string;
|
|
5
10
|
name: string;
|
|
6
|
-
value
|
|
11
|
+
value?: unknown;
|
|
7
12
|
array?: boolean;
|
|
13
|
+
$isFirst?: boolean;
|
|
14
|
+
$isLast?: boolean;
|
|
8
15
|
}
|
|
9
16
|
interface AddPropertyOptions {
|
|
10
17
|
after?: string;
|
|
11
18
|
before?: string;
|
|
12
19
|
}
|
|
13
20
|
interface PropertiesContext {
|
|
21
|
+
name?: string;
|
|
14
22
|
properties: Property[];
|
|
23
|
+
getAncestor(name: string): PropertiesContext | undefined;
|
|
15
24
|
getObject<T = unknown>(): T;
|
|
16
25
|
addProperty(property: Property, options?: AddPropertyOptions): void;
|
|
17
26
|
removeProperty(id: string): void;
|
|
@@ -19,10 +28,13 @@ interface PropertiesContext {
|
|
|
19
28
|
}
|
|
20
29
|
declare const PropertiesContext: React.Context<PropertiesContext | undefined>;
|
|
21
30
|
interface PropertiesProps {
|
|
31
|
+
name?: string;
|
|
22
32
|
onChange?(properties: Property[]): void;
|
|
33
|
+
children: React.ReactNode;
|
|
23
34
|
}
|
|
24
|
-
export declare const Properties: React.
|
|
35
|
+
export declare const Properties: ({ name, onChange, children }: PropertiesProps) => React.JSX.Element;
|
|
25
36
|
export declare function useProperties(): PropertiesContext;
|
|
37
|
+
export declare function useAncestorByName(name: string | undefined): PropertiesContext | undefined;
|
|
26
38
|
interface PropertyProps {
|
|
27
39
|
id?: string;
|
|
28
40
|
name: string;
|
|
@@ -34,11 +46,12 @@ interface PropertyProps {
|
|
|
34
46
|
remove?: boolean;
|
|
35
47
|
parent?: string;
|
|
36
48
|
root?: boolean;
|
|
49
|
+
children?: React.ReactNode;
|
|
37
50
|
}
|
|
38
51
|
export declare function useParentProperty(): Property | undefined;
|
|
39
52
|
interface AncestorMatch {
|
|
40
53
|
[key: string]: string | boolean | number | null | undefined;
|
|
41
54
|
}
|
|
42
55
|
export declare function useAncestor(params: AncestorMatch): Property | undefined;
|
|
43
|
-
export declare const Property: React.
|
|
56
|
+
export declare const Property: ({ id, name, value, children, after, before, replace, remove, array, root, parent }: PropertyProps) => React.JSX.Element | null;
|
|
44
57
|
export {};
|
package/Properties.js
CHANGED
|
@@ -1,233 +1,224 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
exports.useParentProperty = useParentProperty;
|
|
13
|
-
exports.useProperties = useProperties;
|
|
14
|
-
|
|
15
|
-
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
16
|
-
|
|
17
|
-
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
18
|
-
|
|
19
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
20
|
-
|
|
21
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
22
|
-
|
|
23
|
-
var _utils = require("./utils");
|
|
24
|
-
|
|
1
|
+
import React, { createContext, useContext, useEffect, useMemo, useState } from "react";
|
|
2
|
+
import { getUniqueId, toObject } from "./utils";
|
|
3
|
+
const PropertiesTargetContext = /*#__PURE__*/createContext(undefined);
|
|
4
|
+
export const ConnectToProperties = ({
|
|
5
|
+
name,
|
|
6
|
+
children
|
|
7
|
+
}) => {
|
|
8
|
+
return /*#__PURE__*/React.createElement(PropertiesTargetContext.Provider, {
|
|
9
|
+
value: name
|
|
10
|
+
}, children);
|
|
11
|
+
};
|
|
25
12
|
function removeByParent(id, properties) {
|
|
26
|
-
return properties.filter(
|
|
27
|
-
return prop.
|
|
28
|
-
}).reduce(function (acc, item) {
|
|
29
|
-
return removeByParent(item.id, acc.filter(function (prop) {
|
|
30
|
-
return prop.id !== item.id;
|
|
31
|
-
}));
|
|
13
|
+
return properties.filter(prop => prop.parent === id).reduce((acc, item) => {
|
|
14
|
+
return removeByParent(item.id, acc.filter(prop => prop.id !== item.id));
|
|
32
15
|
}, properties);
|
|
33
16
|
}
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
17
|
+
function putPropertyBefore(properties, property, before) {
|
|
18
|
+
const existingIndex = properties.findIndex(prop => prop.id === property.id);
|
|
19
|
+
if (existingIndex > -1) {
|
|
20
|
+
const existingProperty = properties[existingIndex];
|
|
21
|
+
const newProperties = properties.filter(p => p.id !== property.id);
|
|
22
|
+
const targetIndex = before.endsWith("$first") ? 0 : newProperties.findIndex(prop => prop.id === before);
|
|
23
|
+
return [...newProperties.slice(0, targetIndex), existingProperty, ...newProperties.slice(targetIndex)];
|
|
24
|
+
}
|
|
25
|
+
const targetIndex = properties.findIndex(prop => prop.id === before);
|
|
26
|
+
return [...properties.slice(0, targetIndex), property, ...properties.slice(targetIndex)];
|
|
27
|
+
}
|
|
28
|
+
function putPropertyAfter(properties, property, after) {
|
|
29
|
+
const existingIndex = properties.findIndex(prop => prop.id === property.id);
|
|
30
|
+
if (existingIndex > -1) {
|
|
31
|
+
const [removedProperty] = properties.splice(existingIndex, 1);
|
|
32
|
+
const targetIndex = after.endsWith("$last") ? properties.length - 1 : properties.findIndex(prop => prop.id === after);
|
|
33
|
+
return [...properties.slice(0, targetIndex + 1), removedProperty, ...properties.slice(targetIndex + 1)];
|
|
34
|
+
}
|
|
35
|
+
const targetIndex = properties.findIndex(prop => prop.id === after);
|
|
36
|
+
return [...properties.slice(0, targetIndex + 1), property, ...properties.slice(targetIndex + 1)];
|
|
37
|
+
}
|
|
38
|
+
function mergeProperty(properties, property) {
|
|
39
|
+
const index = properties.findIndex(prop => prop.id === property.id);
|
|
40
|
+
if (index > -1) {
|
|
41
|
+
return [...properties.slice(0, index), {
|
|
42
|
+
...properties[index],
|
|
43
|
+
...property
|
|
44
|
+
}, ...properties.slice(index + 1)];
|
|
45
|
+
}
|
|
46
|
+
return properties;
|
|
47
|
+
}
|
|
48
|
+
const PropertiesContext = /*#__PURE__*/createContext(undefined);
|
|
49
|
+
export const Properties = ({
|
|
50
|
+
name,
|
|
51
|
+
onChange,
|
|
52
|
+
children
|
|
53
|
+
}) => {
|
|
54
|
+
const [properties, setProperties] = useState([]);
|
|
55
|
+
let parent;
|
|
56
|
+
try {
|
|
57
|
+
parent = useProperties();
|
|
58
|
+
} catch {
|
|
59
|
+
// Do nothing, if there's no parent.
|
|
60
|
+
}
|
|
61
|
+
useEffect(() => {
|
|
47
62
|
if (onChange) {
|
|
48
63
|
onChange(properties);
|
|
49
64
|
}
|
|
50
65
|
}, [properties]);
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
66
|
+
const context = useMemo(() => ({
|
|
67
|
+
name,
|
|
68
|
+
properties,
|
|
69
|
+
getAncestor(ancestorName) {
|
|
70
|
+
if (!parent) {
|
|
71
|
+
return undefined;
|
|
72
|
+
}
|
|
73
|
+
return parent && parent.name === ancestorName ? parent : parent.getAncestor(ancestorName);
|
|
74
|
+
},
|
|
75
|
+
getObject() {
|
|
76
|
+
return toObject(properties);
|
|
77
|
+
},
|
|
78
|
+
addProperty(property, options = {}) {
|
|
79
|
+
setProperties(properties => {
|
|
80
|
+
const index = properties.findIndex(prop => prop.id === property.id);
|
|
81
|
+
if (index > -1) {
|
|
82
|
+
const newProperties = mergeProperty(properties, property);
|
|
69
83
|
if (options.after) {
|
|
70
|
-
|
|
71
|
-
return prop.id === options.after;
|
|
72
|
-
});
|
|
73
|
-
|
|
74
|
-
if (_index > -1) {
|
|
75
|
-
return [].concat((0, _toConsumableArray2.default)(properties.slice(0, _index + 1)), [property], (0, _toConsumableArray2.default)(properties.slice(_index + 1)));
|
|
76
|
-
}
|
|
84
|
+
return putPropertyAfter(newProperties, property, options.after);
|
|
77
85
|
}
|
|
78
|
-
|
|
79
86
|
if (options.before) {
|
|
80
|
-
|
|
81
|
-
return prop.id === options.before;
|
|
82
|
-
});
|
|
83
|
-
|
|
84
|
-
if (_index2 > -1) {
|
|
85
|
-
return [].concat((0, _toConsumableArray2.default)(properties.slice(0, _index2)), [property], (0, _toConsumableArray2.default)(properties.slice(_index2)));
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
return [].concat((0, _toConsumableArray2.default)(properties), [property]);
|
|
90
|
-
});
|
|
91
|
-
},
|
|
92
|
-
removeProperty: function removeProperty(id) {
|
|
93
|
-
setProperties(function (properties) {
|
|
94
|
-
return removeByParent(id, properties.filter(function (prop) {
|
|
95
|
-
return prop.id !== id;
|
|
96
|
-
}));
|
|
97
|
-
});
|
|
98
|
-
},
|
|
99
|
-
replaceProperty: function replaceProperty(id, property) {
|
|
100
|
-
setProperties(function (properties) {
|
|
101
|
-
var toReplace = properties.findIndex(function (prop) {
|
|
102
|
-
return prop.id === id;
|
|
103
|
-
});
|
|
104
|
-
|
|
105
|
-
if (toReplace > -1) {
|
|
106
|
-
// Replace the property and remove all remaining child properties.
|
|
107
|
-
return removeByParent(id, [].concat((0, _toConsumableArray2.default)(properties.slice(0, toReplace)), [property], (0, _toConsumableArray2.default)(properties.slice(toReplace + 1))));
|
|
87
|
+
return putPropertyBefore(newProperties, property, options.before);
|
|
108
88
|
}
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
89
|
+
return newProperties;
|
|
90
|
+
}
|
|
91
|
+
if (options.after) {
|
|
92
|
+
return putPropertyAfter(properties, property, options.after);
|
|
93
|
+
}
|
|
94
|
+
if (options.before) {
|
|
95
|
+
return putPropertyBefore(properties, property, options.before);
|
|
96
|
+
}
|
|
97
|
+
return [...properties, property];
|
|
98
|
+
});
|
|
99
|
+
},
|
|
100
|
+
removeProperty(id) {
|
|
101
|
+
setProperties(properties => {
|
|
102
|
+
return removeByParent(id, properties.filter(prop => prop.id !== id));
|
|
103
|
+
});
|
|
104
|
+
},
|
|
105
|
+
replaceProperty(id, property) {
|
|
106
|
+
setProperties(properties => {
|
|
107
|
+
const toReplace = properties.findIndex(prop => prop.id === id);
|
|
108
|
+
if (toReplace > -1) {
|
|
109
|
+
// Replace the property and remove all remaining child properties.
|
|
110
|
+
return removeByParent(id, [...properties.slice(0, toReplace), property, ...properties.slice(toReplace + 1)]);
|
|
111
|
+
}
|
|
112
|
+
return properties;
|
|
113
|
+
});
|
|
114
|
+
}
|
|
115
|
+
}), [properties]);
|
|
116
|
+
return /*#__PURE__*/React.createElement(PropertiesContext.Provider, {
|
|
116
117
|
value: context
|
|
117
118
|
}, children);
|
|
118
119
|
};
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
function useProperties() {
|
|
123
|
-
var properties = (0, _react.useContext)(PropertiesContext);
|
|
124
|
-
|
|
120
|
+
export function useProperties() {
|
|
121
|
+
const properties = useContext(PropertiesContext);
|
|
125
122
|
if (!properties) {
|
|
126
123
|
throw Error("Properties context provider is missing!");
|
|
127
124
|
}
|
|
128
|
-
|
|
129
125
|
return properties;
|
|
130
126
|
}
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
127
|
+
export function useAncestorByName(name) {
|
|
128
|
+
const parent = useProperties();
|
|
129
|
+
return useMemo(() => {
|
|
130
|
+
if (!name) {
|
|
131
|
+
return undefined;
|
|
132
|
+
}
|
|
133
|
+
if (parent.name === name) {
|
|
134
|
+
return parent;
|
|
135
|
+
}
|
|
136
|
+
return parent.getAncestor(name);
|
|
137
|
+
}, [name]);
|
|
136
138
|
}
|
|
137
|
-
|
|
138
|
-
function
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
return prop.name in params && prop.value === params[prop.name];
|
|
149
|
-
});
|
|
150
|
-
|
|
139
|
+
const PropertyContext = /*#__PURE__*/createContext(undefined);
|
|
140
|
+
export function useParentProperty() {
|
|
141
|
+
return useContext(PropertyContext);
|
|
142
|
+
}
|
|
143
|
+
export function useAncestor(params) {
|
|
144
|
+
const property = useParentProperty();
|
|
145
|
+
const {
|
|
146
|
+
properties
|
|
147
|
+
} = useProperties();
|
|
148
|
+
const matchOrGetAncestor = (property, params) => {
|
|
149
|
+
const matchedProps = properties.filter(prop => prop.parent === property.id).filter(prop => prop.name in params && prop.value === params[prop.name]);
|
|
151
150
|
if (matchedProps.length === Object.keys(params).length) {
|
|
152
151
|
return property;
|
|
153
152
|
}
|
|
154
|
-
|
|
155
|
-
var newParent = property.parent ? properties.find(function (prop) {
|
|
156
|
-
return prop.id === property.parent;
|
|
157
|
-
}) : undefined;
|
|
153
|
+
const newParent = property.parent ? properties.find(prop => prop.id === property.parent) : undefined;
|
|
158
154
|
return newParent ? matchOrGetAncestor(newParent, params) : undefined;
|
|
159
155
|
};
|
|
160
|
-
|
|
161
156
|
return property ? matchOrGetAncestor(property, params) : undefined;
|
|
162
157
|
}
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
parent = _ref2$parent === void 0 ? undefined : _ref2$parent;
|
|
183
|
-
var uniqueId = (0, _react.useMemo)(function () {
|
|
184
|
-
return id || (0, _utils.getUniqueId)();
|
|
185
|
-
}, []);
|
|
186
|
-
var parentProperty = useParentProperty();
|
|
187
|
-
var properties = useProperties();
|
|
188
|
-
|
|
158
|
+
export const Property = ({
|
|
159
|
+
id,
|
|
160
|
+
name,
|
|
161
|
+
value,
|
|
162
|
+
children,
|
|
163
|
+
after = undefined,
|
|
164
|
+
before = undefined,
|
|
165
|
+
replace = undefined,
|
|
166
|
+
remove = false,
|
|
167
|
+
array = false,
|
|
168
|
+
root = false,
|
|
169
|
+
parent = undefined
|
|
170
|
+
}) => {
|
|
171
|
+
const targetName = useContext(PropertiesTargetContext);
|
|
172
|
+
const uniqueId = useMemo(() => id || getUniqueId(), []);
|
|
173
|
+
const parentProperty = useParentProperty();
|
|
174
|
+
const immediateProperties = useProperties();
|
|
175
|
+
const ancestorByName = useAncestorByName(targetName);
|
|
176
|
+
const properties = targetName ? ancestorByName : immediateProperties;
|
|
189
177
|
if (!properties) {
|
|
190
178
|
throw Error("<Properties> provider is missing higher in the hierarchy!");
|
|
191
179
|
}
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
180
|
+
const {
|
|
181
|
+
addProperty,
|
|
182
|
+
removeProperty,
|
|
183
|
+
replaceProperty
|
|
184
|
+
} = properties;
|
|
185
|
+
const parentId = parent ? parent : root ? "" : parentProperty?.id || "";
|
|
186
|
+
const property = {
|
|
198
187
|
id: uniqueId,
|
|
199
|
-
name
|
|
200
|
-
value
|
|
188
|
+
name,
|
|
189
|
+
value,
|
|
201
190
|
parent: parentId,
|
|
202
|
-
array
|
|
191
|
+
array
|
|
203
192
|
};
|
|
204
|
-
|
|
193
|
+
useEffect(() => {
|
|
205
194
|
if (remove) {
|
|
206
195
|
removeProperty(uniqueId);
|
|
207
196
|
return;
|
|
208
197
|
}
|
|
209
|
-
|
|
210
198
|
if (replace) {
|
|
211
199
|
replaceProperty(replace, property);
|
|
212
200
|
return;
|
|
213
201
|
}
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
202
|
+
const $isFirst = before === "$first";
|
|
203
|
+
const $isLast = after === "$last";
|
|
204
|
+
addProperty({
|
|
205
|
+
...property,
|
|
206
|
+
$isFirst,
|
|
207
|
+
$isLast
|
|
208
|
+
}, {
|
|
209
|
+
after,
|
|
210
|
+
before
|
|
218
211
|
});
|
|
219
|
-
return
|
|
212
|
+
return () => {
|
|
220
213
|
removeProperty(uniqueId);
|
|
221
214
|
};
|
|
222
215
|
}, []);
|
|
223
|
-
|
|
224
216
|
if (children) {
|
|
225
|
-
return /*#__PURE__*/
|
|
217
|
+
return /*#__PURE__*/React.createElement(PropertyContext.Provider, {
|
|
226
218
|
value: property
|
|
227
219
|
}, children);
|
|
228
220
|
}
|
|
229
|
-
|
|
230
221
|
return null;
|
|
231
222
|
};
|
|
232
223
|
|
|
233
|
-
|
|
224
|
+
//# sourceMappingURL=Properties.js.map
|
package/Properties.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["removeByParent","id","properties","filter","prop","parent","reduce","acc","item","PropertiesContext","createContext","undefined","Properties","onChange","children","useState","setProperties","useEffect","context","useMemo","getObject","toObject","addProperty","property","options","index","findIndex","slice","after","before","removeProperty","replaceProperty","toReplace","useProperties","useContext","Error","PropertyContext","useParentProperty","useAncestor","params","matchOrGetAncestor","matchedProps","name","value","length","Object","keys","newParent","find","Property","replace","remove","array","root","uniqueId","getUniqueId","parentProperty","parentId"],"sources":["Properties.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useMemo, useState } from \"react\";\nimport { getUniqueId, toObject } from \"./utils\";\n\nexport interface Property {\n id: string;\n parent: string;\n name: string;\n value: unknown;\n array?: boolean;\n}\n\nfunction removeByParent(id: string, properties: Property[]): Property[] {\n return properties\n .filter(prop => prop.parent === id)\n .reduce((acc, item) => {\n return removeByParent(\n item.id,\n acc.filter(prop => prop.id !== item.id)\n );\n }, properties);\n}\n\ninterface AddPropertyOptions {\n after?: string;\n before?: string;\n}\n\ninterface PropertiesContext {\n properties: Property[];\n getObject<T = unknown>(): T;\n addProperty(property: Property, options?: AddPropertyOptions): void;\n removeProperty(id: string): void;\n replaceProperty(id: string, property: Property): void;\n}\n\nconst PropertiesContext = createContext<PropertiesContext | undefined>(undefined);\n\ninterface PropertiesProps {\n onChange?(properties: Property[]): void;\n}\n\nexport const Properties: React.FC<PropertiesProps> = ({ onChange, children }) => {\n const [properties, setProperties] = useState<Property[]>([]);\n\n useEffect(() => {\n if (onChange) {\n onChange(properties);\n }\n }, [properties]);\n\n const context: PropertiesContext = useMemo(\n () => ({\n properties,\n getObject<T>() {\n return toObject(properties) as T;\n },\n addProperty(property, options = {}) {\n setProperties(properties => {\n // If a property with this ID already exists, merge the two properties.\n const index = properties.findIndex(prop => prop.id === property.id);\n if (index > -1) {\n return [\n ...properties.slice(0, index),\n { ...properties[index], ...property },\n ...properties.slice(index + 1)\n ];\n }\n\n if (options.after) {\n const index = properties.findIndex(prop => prop.id === options.after);\n if (index > -1) {\n return [\n ...properties.slice(0, index + 1),\n property,\n ...properties.slice(index + 1)\n ];\n }\n }\n\n if (options.before) {\n const index = properties.findIndex(prop => prop.id === options.before);\n if (index > -1) {\n return [\n ...properties.slice(0, index),\n property,\n ...properties.slice(index)\n ];\n }\n }\n\n return [...properties, property];\n });\n },\n removeProperty(id) {\n setProperties(properties => {\n return removeByParent(\n id,\n properties.filter(prop => prop.id !== id)\n );\n });\n },\n replaceProperty(id, property) {\n setProperties(properties => {\n const toReplace = properties.findIndex(prop => prop.id === id);\n\n if (toReplace > -1) {\n // Replace the property and remove all remaining child properties.\n return removeByParent(id, [\n ...properties.slice(0, toReplace),\n property,\n ...properties.slice(toReplace + 1)\n ]);\n }\n return properties;\n });\n }\n }),\n [properties]\n );\n\n return <PropertiesContext.Provider value={context}>{children}</PropertiesContext.Provider>;\n};\n\nexport function useProperties() {\n const properties = useContext(PropertiesContext);\n if (!properties) {\n throw Error(\"Properties context provider is missing!\");\n }\n\n return properties;\n}\n\ninterface PropertyProps {\n id?: string;\n name: string;\n value?: unknown;\n array?: boolean;\n after?: string;\n before?: string;\n replace?: string;\n remove?: boolean;\n parent?: string;\n root?: boolean;\n}\n\nconst PropertyContext = createContext<Property | undefined>(undefined);\n\nexport function useParentProperty() {\n return useContext(PropertyContext);\n}\n\ninterface AncestorMatch {\n [key: string]: string | boolean | number | null | undefined;\n}\n\nexport function useAncestor(params: AncestorMatch) {\n const property = useParentProperty();\n const { properties } = useProperties();\n\n const matchOrGetAncestor = (\n property: Property,\n params: AncestorMatch\n ): Property | undefined => {\n const matchedProps = properties\n .filter(prop => prop.parent === property.id)\n .filter(prop => prop.name in params && prop.value === params[prop.name]);\n\n if (matchedProps.length === Object.keys(params).length) {\n return property;\n }\n\n const newParent = property.parent\n ? properties.find(prop => prop.id === property.parent)\n : undefined;\n\n return newParent ? matchOrGetAncestor(newParent, params) : undefined;\n };\n\n return property ? matchOrGetAncestor(property, params) : undefined;\n}\n\nexport const Property: React.FC<PropertyProps> = ({\n id,\n name,\n value,\n children,\n after = undefined,\n before = undefined,\n replace = undefined,\n remove = false,\n array = false,\n root = false,\n parent = undefined\n}) => {\n const uniqueId = useMemo(() => id || getUniqueId(), []);\n const parentProperty = useParentProperty();\n const properties = useProperties();\n\n if (!properties) {\n throw Error(\"<Properties> provider is missing higher in the hierarchy!\");\n }\n\n const { addProperty, removeProperty, replaceProperty } = properties;\n const parentId = parent ? parent : root ? \"\" : parentProperty?.id || \"\";\n const property = { id: uniqueId, name, value, parent: parentId, array };\n\n useEffect(() => {\n if (remove) {\n removeProperty(uniqueId);\n return;\n }\n\n if (replace) {\n replaceProperty(replace, property);\n return;\n }\n\n addProperty(property, { after, before });\n\n return () => {\n removeProperty(uniqueId);\n };\n }, []);\n\n if (children) {\n return <PropertyContext.Provider value={property}>{children}</PropertyContext.Provider>;\n }\n\n return null;\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["React","createContext","useContext","useEffect","useMemo","useState","getUniqueId","toObject","PropertiesTargetContext","undefined","ConnectToProperties","name","children","createElement","Provider","value","removeByParent","id","properties","filter","prop","parent","reduce","acc","item","putPropertyBefore","property","before","existingIndex","findIndex","existingProperty","newProperties","p","targetIndex","endsWith","slice","putPropertyAfter","after","removedProperty","splice","length","mergeProperty","index","PropertiesContext","Properties","onChange","setProperties","useProperties","context","getAncestor","ancestorName","getObject","addProperty","options","removeProperty","replaceProperty","toReplace","Error","useAncestorByName","PropertyContext","useParentProperty","useAncestor","params","matchOrGetAncestor","matchedProps","Object","keys","newParent","find","Property","replace","remove","array","root","targetName","uniqueId","parentProperty","immediateProperties","ancestorByName","parentId","$isFirst","$isLast"],"sources":["Properties.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useMemo, useState } from \"react\";\nimport { getUniqueId, toObject } from \"./utils\";\n\nconst PropertiesTargetContext = createContext<string | undefined>(undefined);\n\nexport interface ConnectToPropertiesProps {\n name: string;\n children: React.ReactNode;\n}\n\nexport const ConnectToProperties = ({ name, children }: ConnectToPropertiesProps) => {\n return (\n <PropertiesTargetContext.Provider value={name}>{children}</PropertiesTargetContext.Provider>\n );\n};\n\nexport interface Property {\n id: string;\n parent: string;\n name: string;\n value?: unknown;\n array?: boolean;\n $isFirst?: boolean;\n $isLast?: boolean;\n}\n\nfunction removeByParent(id: string, properties: Property[]): Property[] {\n return properties\n .filter(prop => prop.parent === id)\n .reduce((acc, item) => {\n return removeByParent(\n item.id,\n acc.filter(prop => prop.id !== item.id)\n );\n }, properties);\n}\n\ninterface AddPropertyOptions {\n after?: string;\n before?: string;\n}\n\ninterface PropertiesContext {\n name?: string;\n properties: Property[];\n getAncestor(name: string): PropertiesContext | undefined;\n getObject<T = unknown>(): T;\n addProperty(property: Property, options?: AddPropertyOptions): void;\n removeProperty(id: string): void;\n replaceProperty(id: string, property: Property): void;\n}\n\nfunction putPropertyBefore(properties: Property[], property: Property, before: string) {\n const existingIndex = properties.findIndex(prop => prop.id === property.id);\n if (existingIndex > -1) {\n const existingProperty = properties[existingIndex];\n const newProperties = properties.filter(p => p.id !== property.id);\n const targetIndex = before.endsWith(\"$first\")\n ? 0\n : newProperties.findIndex(prop => prop.id === before);\n return [\n ...newProperties.slice(0, targetIndex),\n existingProperty,\n ...newProperties.slice(targetIndex)\n ];\n }\n\n const targetIndex = properties.findIndex(prop => prop.id === before);\n\n return [...properties.slice(0, targetIndex), property, ...properties.slice(targetIndex)];\n}\n\nfunction putPropertyAfter(properties: Property[], property: Property, after: string) {\n const existingIndex = properties.findIndex(prop => prop.id === property.id);\n\n if (existingIndex > -1) {\n const [removedProperty] = properties.splice(existingIndex, 1);\n const targetIndex = after.endsWith(\"$last\")\n ? properties.length - 1\n : properties.findIndex(prop => prop.id === after);\n return [\n ...properties.slice(0, targetIndex + 1),\n removedProperty,\n ...properties.slice(targetIndex + 1)\n ];\n }\n\n const targetIndex = properties.findIndex(prop => prop.id === after);\n\n return [\n ...properties.slice(0, targetIndex + 1),\n property,\n ...properties.slice(targetIndex + 1)\n ];\n}\n\nfunction mergeProperty(properties: Property[], property: Property) {\n const index = properties.findIndex(prop => prop.id === property.id);\n if (index > -1) {\n return [\n ...properties.slice(0, index),\n { ...properties[index], ...property },\n ...properties.slice(index + 1)\n ];\n }\n return properties;\n}\n\nconst PropertiesContext = createContext<PropertiesContext | undefined>(undefined);\n\ninterface PropertiesProps {\n name?: string;\n onChange?(properties: Property[]): void;\n children: React.ReactNode;\n}\n\nexport const Properties = ({ name, onChange, children }: PropertiesProps) => {\n const [properties, setProperties] = useState<Property[]>([]);\n let parent: PropertiesContext;\n\n try {\n parent = useProperties();\n } catch {\n // Do nothing, if there's no parent.\n }\n\n useEffect(() => {\n if (onChange) {\n onChange(properties);\n }\n }, [properties]);\n\n const context: PropertiesContext = useMemo(\n () => ({\n name,\n properties,\n getAncestor(ancestorName: string) {\n if (!parent) {\n return undefined;\n }\n\n return parent && parent.name === ancestorName\n ? parent\n : parent.getAncestor(ancestorName);\n },\n getObject<T>() {\n return toObject(properties) as T;\n },\n addProperty(property, options = {}) {\n setProperties(properties => {\n const index = properties.findIndex(prop => prop.id === property.id);\n\n if (index > -1) {\n const newProperties = mergeProperty(properties, property);\n if (options.after) {\n return putPropertyAfter(newProperties, property, options.after);\n }\n if (options.before) {\n return putPropertyBefore(newProperties, property, options.before);\n }\n\n return newProperties;\n }\n\n if (options.after) {\n return putPropertyAfter(properties, property, options.after);\n }\n\n if (options.before) {\n return putPropertyBefore(properties, property, options.before);\n }\n\n return [...properties, property];\n });\n },\n removeProperty(id) {\n setProperties(properties => {\n return removeByParent(\n id,\n properties.filter(prop => prop.id !== id)\n );\n });\n },\n replaceProperty(id, property) {\n setProperties(properties => {\n const toReplace = properties.findIndex(prop => prop.id === id);\n\n if (toReplace > -1) {\n // Replace the property and remove all remaining child properties.\n return removeByParent(id, [\n ...properties.slice(0, toReplace),\n property,\n ...properties.slice(toReplace + 1)\n ]);\n }\n return properties;\n });\n }\n }),\n [properties]\n );\n\n return <PropertiesContext.Provider value={context}>{children}</PropertiesContext.Provider>;\n};\n\nexport function useProperties() {\n const properties = useContext(PropertiesContext);\n if (!properties) {\n throw Error(\"Properties context provider is missing!\");\n }\n\n return properties;\n}\n\nexport function useAncestorByName(name: string | undefined) {\n const parent = useProperties();\n\n return useMemo(() => {\n if (!name) {\n return undefined;\n }\n\n if (parent.name === name) {\n return parent;\n }\n\n return parent.getAncestor(name);\n }, [name]);\n}\n\ninterface PropertyProps {\n id?: string;\n name: string;\n value?: unknown;\n array?: boolean;\n after?: string;\n before?: string;\n replace?: string;\n remove?: boolean;\n parent?: string;\n root?: boolean;\n children?: React.ReactNode;\n}\n\nconst PropertyContext = createContext<Property | undefined>(undefined);\n\nexport function useParentProperty() {\n return useContext(PropertyContext);\n}\n\ninterface AncestorMatch {\n [key: string]: string | boolean | number | null | undefined;\n}\n\nexport function useAncestor(params: AncestorMatch) {\n const property = useParentProperty();\n const { properties } = useProperties();\n\n const matchOrGetAncestor = (\n property: Property,\n params: AncestorMatch\n ): Property | undefined => {\n const matchedProps = properties\n .filter(prop => prop.parent === property.id)\n .filter(prop => prop.name in params && prop.value === params[prop.name]);\n\n if (matchedProps.length === Object.keys(params).length) {\n return property;\n }\n\n const newParent = property.parent\n ? properties.find(prop => prop.id === property.parent)\n : undefined;\n\n return newParent ? matchOrGetAncestor(newParent, params) : undefined;\n };\n\n return property ? matchOrGetAncestor(property, params) : undefined;\n}\n\nexport const Property = ({\n id,\n name,\n value,\n children,\n after = undefined,\n before = undefined,\n replace = undefined,\n remove = false,\n array = false,\n root = false,\n parent = undefined\n}: PropertyProps) => {\n const targetName = useContext(PropertiesTargetContext);\n const uniqueId = useMemo(() => id || getUniqueId(), []);\n const parentProperty = useParentProperty();\n const immediateProperties = useProperties();\n const ancestorByName = useAncestorByName(targetName);\n\n const properties = targetName ? ancestorByName : immediateProperties;\n\n if (!properties) {\n throw Error(\"<Properties> provider is missing higher in the hierarchy!\");\n }\n\n const { addProperty, removeProperty, replaceProperty } = properties;\n const parentId = parent ? parent : root ? \"\" : parentProperty?.id || \"\";\n const property = { id: uniqueId, name, value, parent: parentId, array };\n\n useEffect(() => {\n if (remove) {\n removeProperty(uniqueId);\n return;\n }\n\n if (replace) {\n replaceProperty(replace, property);\n return;\n }\n\n const $isFirst = before === \"$first\";\n const $isLast = after === \"$last\";\n\n addProperty({ ...property, $isFirst, $isLast }, { after, before });\n\n return () => {\n removeProperty(uniqueId);\n };\n }, []);\n\n if (children) {\n return <PropertyContext.Provider value={property}>{children}</PropertyContext.Provider>;\n }\n\n return null;\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import type { Property } from "./index";
|
|
3
|
+
export interface WithConfigProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
onProperties?(properties: Property[]): void;
|
|
6
|
+
}
|
|
7
|
+
export interface ConfigProps {
|
|
8
|
+
children: React.ReactNode;
|
|
9
|
+
priority?: "primary" | "secondary";
|
|
10
|
+
}
|
|
11
|
+
export declare function createConfigurableComponent<TConfig>(name: string): {
|
|
12
|
+
WithConfig: ({ onProperties, children }: WithConfigProps) => React.JSX.Element;
|
|
13
|
+
Config: ({ priority, children }: ConfigProps) => React.JSX.Element;
|
|
14
|
+
useConfig: <TExtra extends object>() => TConfig & TExtra;
|
|
15
|
+
};
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
import React, { useContext, useEffect, useMemo, useState } from "react";
|
|
2
|
+
import { Compose, makeDecoratable } from "@webiny/react-composition";
|
|
3
|
+
import { Properties, toObject } from "./index";
|
|
4
|
+
import { useDebugConfig } from "./useDebugConfig";
|
|
5
|
+
const createHOC = newChildren => BaseComponent => {
|
|
6
|
+
return function ConfigHOC({
|
|
7
|
+
children
|
|
8
|
+
}) {
|
|
9
|
+
return /*#__PURE__*/React.createElement(BaseComponent, null, newChildren, children);
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
export function createConfigurableComponent(name) {
|
|
13
|
+
/**
|
|
14
|
+
* This component is used when we want to mount all composed configs.
|
|
15
|
+
*/
|
|
16
|
+
const ConfigApplyPrimary = makeDecoratable(`${name}ConfigApply<Primary>`, ({
|
|
17
|
+
children
|
|
18
|
+
}) => {
|
|
19
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, children);
|
|
20
|
+
});
|
|
21
|
+
const ConfigApplySecondary = makeDecoratable(`${name}ConfigApply<Secondary>`, ({
|
|
22
|
+
children
|
|
23
|
+
}) => {
|
|
24
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, children);
|
|
25
|
+
});
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* This component is used to configure the component (it can be mounted many times).
|
|
29
|
+
*/
|
|
30
|
+
const Config = ({
|
|
31
|
+
priority = "primary",
|
|
32
|
+
children
|
|
33
|
+
}) => {
|
|
34
|
+
if (priority === "primary") {
|
|
35
|
+
return /*#__PURE__*/React.createElement(Compose, {
|
|
36
|
+
component: ConfigApplyPrimary,
|
|
37
|
+
with: createHOC(children)
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
return /*#__PURE__*/React.createElement(Compose, {
|
|
41
|
+
component: ConfigApplySecondary,
|
|
42
|
+
with: createHOC(children)
|
|
43
|
+
});
|
|
44
|
+
};
|
|
45
|
+
const defaultContext = {
|
|
46
|
+
properties: []
|
|
47
|
+
};
|
|
48
|
+
const ViewContext = /*#__PURE__*/React.createContext(defaultContext);
|
|
49
|
+
const WithConfig = ({
|
|
50
|
+
onProperties,
|
|
51
|
+
children
|
|
52
|
+
}) => {
|
|
53
|
+
const [properties, setProperties] = useState([]);
|
|
54
|
+
useDebugConfig(name, properties);
|
|
55
|
+
const context = {
|
|
56
|
+
properties
|
|
57
|
+
};
|
|
58
|
+
useEffect(() => {
|
|
59
|
+
if (typeof onProperties === "function") {
|
|
60
|
+
onProperties(properties);
|
|
61
|
+
}
|
|
62
|
+
}, [properties]);
|
|
63
|
+
const stateUpdater = properties => {
|
|
64
|
+
setProperties(properties);
|
|
65
|
+
};
|
|
66
|
+
return /*#__PURE__*/React.createElement(ViewContext.Provider, {
|
|
67
|
+
value: context
|
|
68
|
+
}, /*#__PURE__*/React.createElement(Properties, {
|
|
69
|
+
onChange: stateUpdater
|
|
70
|
+
}, /*#__PURE__*/React.createElement(ConfigApplyPrimary, null), /*#__PURE__*/React.createElement(ConfigApplySecondary, null), children));
|
|
71
|
+
};
|
|
72
|
+
function useConfig() {
|
|
73
|
+
const {
|
|
74
|
+
properties
|
|
75
|
+
} = useContext(ViewContext);
|
|
76
|
+
return useMemo(() => toObject(properties), [properties]);
|
|
77
|
+
}
|
|
78
|
+
return {
|
|
79
|
+
WithConfig,
|
|
80
|
+
Config,
|
|
81
|
+
useConfig
|
|
82
|
+
};
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
//# sourceMappingURL=createConfigurableComponent.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useContext","useEffect","useMemo","useState","Compose","makeDecoratable","Properties","toObject","useDebugConfig","createHOC","newChildren","BaseComponent","ConfigHOC","children","createElement","createConfigurableComponent","name","ConfigApplyPrimary","Fragment","ConfigApplySecondary","Config","priority","component","with","defaultContext","properties","ViewContext","createContext","WithConfig","onProperties","setProperties","context","stateUpdater","Provider","value","onChange","useConfig"],"sources":["createConfigurableComponent.tsx"],"sourcesContent":["import React, { useContext, useEffect, useMemo, useState } from \"react\";\nimport type { Decorator } from \"@webiny/react-composition\";\nimport { Compose, makeDecoratable } from \"@webiny/react-composition\";\nimport type { GenericComponent } from \"@webiny/react-composition/types\";\nimport type { Property } from \"~/index\";\nimport { Properties, toObject } from \"~/index\";\nimport { useDebugConfig } from \"./useDebugConfig\";\n\nconst createHOC =\n (newChildren: React.ReactNode): Decorator<GenericComponent<{ children?: React.ReactNode }>> =>\n BaseComponent => {\n return function ConfigHOC({ children }) {\n return (\n <BaseComponent>\n {newChildren}\n {children}\n </BaseComponent>\n );\n };\n };\n\nexport interface WithConfigProps {\n children: React.ReactNode;\n onProperties?(properties: Property[]): void;\n}\n\ninterface ConfigApplyProps {\n children?: React.ReactNode;\n}\n\nexport interface ConfigProps {\n children: React.ReactNode;\n priority?: \"primary\" | \"secondary\";\n}\n\nexport function createConfigurableComponent<TConfig>(name: string) {\n /**\n * This component is used when we want to mount all composed configs.\n */\n const ConfigApplyPrimary = makeDecoratable(\n `${name}ConfigApply<Primary>`,\n ({ children }: ConfigApplyProps) => {\n return <>{children}</>;\n }\n );\n\n const ConfigApplySecondary = makeDecoratable(\n `${name}ConfigApply<Secondary>`,\n ({ children }: ConfigApplyProps) => {\n return <>{children}</>;\n }\n );\n\n /**\n * This component is used to configure the component (it can be mounted many times).\n */\n const Config = ({ priority = \"primary\", children }: ConfigProps) => {\n if (priority === \"primary\") {\n return <Compose component={ConfigApplyPrimary} with={createHOC(children)} />;\n }\n return <Compose component={ConfigApplySecondary} with={createHOC(children)} />;\n };\n\n interface ViewContext {\n properties: Property[];\n }\n\n const defaultContext = { properties: [] };\n\n const ViewContext = React.createContext<ViewContext>(defaultContext);\n\n const WithConfig = ({ onProperties, children }: WithConfigProps) => {\n const [properties, setProperties] = useState<Property[]>([]);\n useDebugConfig(name, properties);\n const context = { properties };\n\n useEffect(() => {\n if (typeof onProperties === \"function\") {\n onProperties(properties);\n }\n }, [properties]);\n\n const stateUpdater = (properties: Property[]) => {\n setProperties(properties);\n };\n\n return (\n <ViewContext.Provider value={context}>\n <Properties onChange={stateUpdater}>\n <ConfigApplyPrimary />\n <ConfigApplySecondary />\n {children}\n </Properties>\n </ViewContext.Provider>\n );\n };\n\n function useConfig<TExtra extends object>(): TConfig & TExtra {\n const { properties } = useContext(ViewContext);\n return useMemo(() => toObject<TConfig & TExtra>(properties), [properties]);\n }\n\n return {\n WithConfig,\n Config,\n useConfig\n };\n}\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAEvE,SAASC,OAAO,EAAEC,eAAe,QAAQ,2BAA2B;AAGpE,SAASC,UAAU,EAAEC,QAAQ;AAC7B,SAASC,cAAc;AAEvB,MAAMC,SAAS,GACVC,WAA4B,IAC7BC,aAAa,IAAI;EACb,OAAO,SAASC,SAASA,CAAC;IAAEC;EAAS,CAAC,EAAE;IACpC,oBACId,KAAA,CAAAe,aAAA,CAACH,aAAa,QACTD,WAAW,EACXG,QACU,CAAC;EAExB,CAAC;AACL,CAAC;AAgBL,OAAO,SAASE,2BAA2BA,CAAUC,IAAY,EAAE;EAC/D;AACJ;AACA;EACI,MAAMC,kBAAkB,GAAGZ,eAAe,CACtC,GAAGW,IAAI,sBAAsB,EAC7B,CAAC;IAAEH;EAA2B,CAAC,KAAK;IAChC,oBAAOd,KAAA,CAAAe,aAAA,CAAAf,KAAA,CAAAmB,QAAA,QAAGL,QAAW,CAAC;EAC1B,CACJ,CAAC;EAED,MAAMM,oBAAoB,GAAGd,eAAe,CACxC,GAAGW,IAAI,wBAAwB,EAC/B,CAAC;IAAEH;EAA2B,CAAC,KAAK;IAChC,oBAAOd,KAAA,CAAAe,aAAA,CAAAf,KAAA,CAAAmB,QAAA,QAAGL,QAAW,CAAC;EAC1B,CACJ,CAAC;;EAED;AACJ;AACA;EACI,MAAMO,MAAM,GAAGA,CAAC;IAAEC,QAAQ,GAAG,SAAS;IAAER;EAAsB,CAAC,KAAK;IAChE,IAAIQ,QAAQ,KAAK,SAAS,EAAE;MACxB,oBAAOtB,KAAA,CAAAe,aAAA,CAACV,OAAO;QAACkB,SAAS,EAAEL,kBAAmB;QAACM,IAAI,EAAEd,SAAS,CAACI,QAAQ;MAAE,CAAE,CAAC;IAChF;IACA,oBAAOd,KAAA,CAAAe,aAAA,CAACV,OAAO;MAACkB,SAAS,EAAEH,oBAAqB;MAACI,IAAI,EAAEd,SAAS,CAACI,QAAQ;IAAE,CAAE,CAAC;EAClF,CAAC;EAMD,MAAMW,cAAc,GAAG;IAAEC,UAAU,EAAE;EAAG,CAAC;EAEzC,MAAMC,WAAW,gBAAG3B,KAAK,CAAC4B,aAAa,CAAcH,cAAc,CAAC;EAEpE,MAAMI,UAAU,GAAGA,CAAC;IAAEC,YAAY;IAAEhB;EAA0B,CAAC,KAAK;IAChE,MAAM,CAACY,UAAU,EAAEK,aAAa,CAAC,GAAG3B,QAAQ,CAAa,EAAE,CAAC;IAC5DK,cAAc,CAACQ,IAAI,EAAES,UAAU,CAAC;IAChC,MAAMM,OAAO,GAAG;MAAEN;IAAW,CAAC;IAE9BxB,SAAS,CAAC,MAAM;MACZ,IAAI,OAAO4B,YAAY,KAAK,UAAU,EAAE;QACpCA,YAAY,CAACJ,UAAU,CAAC;MAC5B;IACJ,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;IAEhB,MAAMO,YAAY,GAAIP,UAAsB,IAAK;MAC7CK,aAAa,CAACL,UAAU,CAAC;IAC7B,CAAC;IAED,oBACI1B,KAAA,CAAAe,aAAA,CAACY,WAAW,CAACO,QAAQ;MAACC,KAAK,EAAEH;IAAQ,gBACjChC,KAAA,CAAAe,aAAA,CAACR,UAAU;MAAC6B,QAAQ,EAAEH;IAAa,gBAC/BjC,KAAA,CAAAe,aAAA,CAACG,kBAAkB,MAAE,CAAC,eACtBlB,KAAA,CAAAe,aAAA,CAACK,oBAAoB,MAAE,CAAC,EACvBN,QACO,CACM,CAAC;EAE/B,CAAC;EAED,SAASuB,SAASA,CAAA,EAA4C;IAC1D,MAAM;MAAEX;IAAW,CAAC,GAAGzB,UAAU,CAAC0B,WAAW,CAAC;IAC9C,OAAOxB,OAAO,CAAC,MAAMK,QAAQ,CAAmBkB,UAAU,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAC9E;EAEA,OAAO;IACHG,UAAU;IACVR,MAAM;IACNgB;EACJ,CAAC;AACL","ignoreList":[]}
|
package/index.d.ts
CHANGED
package/index.js
CHANGED
|
@@ -1,31 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
export * from "./utils";
|
|
2
|
+
export * from "./Properties";
|
|
3
|
+
export * from "./useDebugConfig";
|
|
4
|
+
export * from "./useIdGenerator";
|
|
5
|
+
export * from "./createConfigurableComponent";
|
|
2
6
|
|
|
3
|
-
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
|
|
7
|
-
var _utils = require("./utils");
|
|
8
|
-
|
|
9
|
-
Object.keys(_utils).forEach(function (key) {
|
|
10
|
-
if (key === "default" || key === "__esModule") return;
|
|
11
|
-
if (key in exports && exports[key] === _utils[key]) return;
|
|
12
|
-
Object.defineProperty(exports, key, {
|
|
13
|
-
enumerable: true,
|
|
14
|
-
get: function get() {
|
|
15
|
-
return _utils[key];
|
|
16
|
-
}
|
|
17
|
-
});
|
|
18
|
-
});
|
|
19
|
-
|
|
20
|
-
var _Properties = require("./Properties");
|
|
21
|
-
|
|
22
|
-
Object.keys(_Properties).forEach(function (key) {
|
|
23
|
-
if (key === "default" || key === "__esModule") return;
|
|
24
|
-
if (key in exports && exports[key] === _Properties[key]) return;
|
|
25
|
-
Object.defineProperty(exports, key, {
|
|
26
|
-
enumerable: true,
|
|
27
|
-
get: function get() {
|
|
28
|
-
return _Properties[key];
|
|
29
|
-
}
|
|
30
|
-
});
|
|
31
|
-
});
|
|
7
|
+
//# sourceMappingURL=index.js.map
|
package/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./utils\";\nexport * from \"./Properties\";\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./utils\";\nexport * from \"./Properties\";\nexport * from \"./useDebugConfig\";\nexport * from \"./useIdGenerator\";\nexport * from \"./createConfigurableComponent\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webiny/react-properties",
|
|
3
|
-
"version": "0.0.0-unstable.
|
|
3
|
+
"version": "0.0.0-unstable.3bc8100a7f",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -10,25 +10,23 @@
|
|
|
10
10
|
"author": "Webiny Ltd",
|
|
11
11
|
"license": "MIT",
|
|
12
12
|
"dependencies": {
|
|
13
|
-
"@
|
|
14
|
-
"@
|
|
15
|
-
"nanoid": "3.3.
|
|
16
|
-
"react": "
|
|
13
|
+
"@types/react": "18.2.79",
|
|
14
|
+
"@webiny/react-composition": "0.0.0-unstable.3bc8100a7f",
|
|
15
|
+
"nanoid": "3.3.8",
|
|
16
|
+
"react": "18.2.0"
|
|
17
17
|
},
|
|
18
18
|
"devDependencies": {
|
|
19
|
-
"@testing-library/react": "
|
|
20
|
-
"@webiny/
|
|
21
|
-
"
|
|
22
|
-
"@webiny/react-composition": "^0.0.0-unstable.3386f66516",
|
|
23
|
-
"prettier": "^2.8.3"
|
|
19
|
+
"@testing-library/react": "15.0.7",
|
|
20
|
+
"@webiny/project-utils": "0.0.0-unstable.3bc8100a7f",
|
|
21
|
+
"prettier": "2.8.8"
|
|
24
22
|
},
|
|
25
23
|
"publishConfig": {
|
|
26
24
|
"access": "public",
|
|
27
25
|
"directory": "dist"
|
|
28
26
|
},
|
|
29
27
|
"scripts": {
|
|
30
|
-
"build": "
|
|
31
|
-
"watch": "
|
|
28
|
+
"build": "node ../cli/bin.js run build",
|
|
29
|
+
"watch": "node ../cli/bin.js run watch"
|
|
32
30
|
},
|
|
33
|
-
"gitHead": "
|
|
31
|
+
"gitHead": "3bc8100a7f1fb3a8d6a3454a2765f8ef377c279e"
|
|
34
32
|
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { useEffect } from "react";
|
|
2
|
+
import { toObject } from "./utils";
|
|
3
|
+
export function useDebugConfig(name, properties) {
|
|
4
|
+
useEffect(() => {
|
|
5
|
+
if (process.env.NODE_ENV !== "development") {
|
|
6
|
+
return;
|
|
7
|
+
}
|
|
8
|
+
const configs = window.__debugConfigs ?? {};
|
|
9
|
+
configs[name] = () => console.log(toObject(properties));
|
|
10
|
+
window.__debugConfigs = configs;
|
|
11
|
+
return () => {
|
|
12
|
+
const configs = window.__debugConfigs ?? {};
|
|
13
|
+
delete configs[name];
|
|
14
|
+
window.__debugConfigs = configs;
|
|
15
|
+
};
|
|
16
|
+
}, [properties]);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
//# sourceMappingURL=useDebugConfig.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useEffect","toObject","useDebugConfig","name","properties","process","env","NODE_ENV","configs","window","__debugConfigs","console","log"],"sources":["useDebugConfig.ts"],"sourcesContent":["import { useEffect } from \"react\";\nimport type { Property } from \"./Properties\";\nimport { toObject } from \"./utils\";\n\ndeclare global {\n interface Window {\n __debugConfigs: Record<string, () => void>;\n }\n}\n\nexport function useDebugConfig(name: string, properties: Property[]) {\n useEffect(() => {\n if (process.env.NODE_ENV !== \"development\") {\n return;\n }\n\n const configs = window.__debugConfigs ?? {};\n configs[name] = () => console.log(toObject(properties));\n window.__debugConfigs = configs;\n\n return () => {\n const configs = window.__debugConfigs ?? {};\n delete configs[name];\n window.__debugConfigs = configs;\n };\n }, [properties]);\n}\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,OAAO;AAEjC,SAASC,QAAQ;AAQjB,OAAO,SAASC,cAAcA,CAACC,IAAY,EAAEC,UAAsB,EAAE;EACjEJ,SAAS,CAAC,MAAM;IACZ,IAAIK,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,aAAa,EAAE;MACxC;IACJ;IAEA,MAAMC,OAAO,GAAGC,MAAM,CAACC,cAAc,IAAI,CAAC,CAAC;IAC3CF,OAAO,CAACL,IAAI,CAAC,GAAG,MAAMQ,OAAO,CAACC,GAAG,CAACX,QAAQ,CAACG,UAAU,CAAC,CAAC;IACvDK,MAAM,CAACC,cAAc,GAAGF,OAAO;IAE/B,OAAO,MAAM;MACT,MAAMA,OAAO,GAAGC,MAAM,CAACC,cAAc,IAAI,CAAC,CAAC;MAC3C,OAAOF,OAAO,CAACL,IAAI,CAAC;MACpBM,MAAM,CAACC,cAAc,GAAGF,OAAO;IACnC,CAAC;EACL,CAAC,EAAE,CAACJ,UAAU,CAAC,CAAC;AACpB","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function useIdGenerator(name: string): (...parts: string[]) => string;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { useCallback } from "react";
|
|
2
|
+
import { useParentProperty } from "./Properties";
|
|
3
|
+
const keywords = ["$first", "$last"];
|
|
4
|
+
export function useIdGenerator(name) {
|
|
5
|
+
const parentProperty = useParentProperty();
|
|
6
|
+
return useCallback((...parts) => {
|
|
7
|
+
if (keywords.includes(parts[0])) {
|
|
8
|
+
return parts[0];
|
|
9
|
+
}
|
|
10
|
+
return [parentProperty?.id, name, ...parts].filter(Boolean).join(":");
|
|
11
|
+
}, [name, parentProperty]);
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
//# sourceMappingURL=useIdGenerator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useCallback","useParentProperty","keywords","useIdGenerator","name","parentProperty","parts","includes","id","filter","Boolean","join"],"sources":["useIdGenerator.ts"],"sourcesContent":["import { useCallback } from \"react\";\nimport { useParentProperty } from \"~/Properties\";\n\nconst keywords = [\"$first\", \"$last\"];\n\nexport function useIdGenerator(name: string) {\n const parentProperty = useParentProperty();\n\n return useCallback(\n (...parts: string[]) => {\n if (keywords.includes(parts[0])) {\n return parts[0];\n }\n return [parentProperty?.id, name, ...parts].filter(Boolean).join(\":\");\n },\n [name, parentProperty]\n );\n}\n"],"mappings":"AAAA,SAASA,WAAW,QAAQ,OAAO;AACnC,SAASC,iBAAiB;AAE1B,MAAMC,QAAQ,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAC;AAEpC,OAAO,SAASC,cAAcA,CAACC,IAAY,EAAE;EACzC,MAAMC,cAAc,GAAGJ,iBAAiB,CAAC,CAAC;EAE1C,OAAOD,WAAW,CACd,CAAC,GAAGM,KAAe,KAAK;IACpB,IAAIJ,QAAQ,CAACK,QAAQ,CAACD,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE;MAC7B,OAAOA,KAAK,CAAC,CAAC,CAAC;IACnB;IACA,OAAO,CAACD,cAAc,EAAEG,EAAE,EAAEJ,IAAI,EAAE,GAAGE,KAAK,CAAC,CAACG,MAAM,CAACC,OAAO,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC;EACzE,CAAC,EACD,CAACP,IAAI,EAAEC,cAAc,CACzB,CAAC;AACL","ignoreList":[]}
|
package/utils.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { Property } from "./Properties";
|
|
1
|
+
import type { Property } from "./Properties";
|
|
2
2
|
export declare function toObject<T = unknown>(properties: Property[]): T;
|
|
3
|
-
export declare function getUniqueId(): string;
|
|
3
|
+
export declare function getUniqueId(length?: number): string;
|
package/utils.js
CHANGED
|
@@ -1,54 +1,47 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
var nanoid = (0, _nanoid.customAlphabet)("1234567890abcdef", 6);
|
|
20
|
-
|
|
1
|
+
import { customAlphabet } from "nanoid";
|
|
2
|
+
const nanoid = customAlphabet("1234567890abcdef");
|
|
3
|
+
const sortPropertiesToTheTop = (a, b) => {
|
|
4
|
+
if (a.$isFirst && b.$isFirst) {
|
|
5
|
+
return -1;
|
|
6
|
+
}
|
|
7
|
+
return Number(b.$isFirst) - Number(a.$isFirst);
|
|
8
|
+
};
|
|
9
|
+
const sortPropertiesToTheBottom = (a, b) => {
|
|
10
|
+
if (a.$isLast && b.$isLast) {
|
|
11
|
+
return 1;
|
|
12
|
+
}
|
|
13
|
+
return Number(a.$isLast) - Number(b.$isLast);
|
|
14
|
+
};
|
|
15
|
+
const sortProperties = properties => {
|
|
16
|
+
return properties.sort(sortPropertiesToTheTop).sort(sortPropertiesToTheBottom);
|
|
17
|
+
};
|
|
21
18
|
function buildRoots(roots, properties) {
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
19
|
+
const sortedRoots = sortProperties(roots);
|
|
20
|
+
const obj = sortedRoots.reduce((acc, item) => {
|
|
21
|
+
const isArray = item.array === true || sortedRoots.filter(r => r.name === item.name).length > 1;
|
|
22
|
+
return {
|
|
23
|
+
...acc,
|
|
24
|
+
[item.name]: isArray ? [] : {}
|
|
25
|
+
};
|
|
27
26
|
}, {});
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
27
|
+
sortedRoots.forEach(root => {
|
|
28
|
+
const isArray = root.array === true || Array.isArray(obj[root.name]);
|
|
31
29
|
if (root.value !== undefined) {
|
|
32
|
-
obj[root.name] = isArray ? [
|
|
30
|
+
obj[root.name] = isArray ? [...obj[root.name], root.value] : root.value;
|
|
33
31
|
return;
|
|
34
32
|
}
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
});
|
|
39
|
-
var value = buildRoots(nextRoots, properties);
|
|
40
|
-
obj[root.name] = isArray ? [].concat((0, _toConsumableArray2.default)(obj[root.name]), [value]) : value;
|
|
33
|
+
const nextRoots = properties.filter(p => p.parent === root.id);
|
|
34
|
+
const value = buildRoots(nextRoots, properties);
|
|
35
|
+
obj[root.name] = isArray ? [...obj[root.name], value] : value;
|
|
41
36
|
});
|
|
42
37
|
return obj;
|
|
43
38
|
}
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
var roots = properties.filter(function (prop) {
|
|
47
|
-
return prop.parent === "";
|
|
48
|
-
});
|
|
39
|
+
export function toObject(properties) {
|
|
40
|
+
const roots = properties.filter(prop => prop.parent === "");
|
|
49
41
|
return buildRoots(roots, properties);
|
|
50
42
|
}
|
|
43
|
+
export function getUniqueId(length = 12) {
|
|
44
|
+
return nanoid(length);
|
|
45
|
+
}
|
|
51
46
|
|
|
52
|
-
|
|
53
|
-
return nanoid();
|
|
54
|
-
}
|
|
47
|
+
//# sourceMappingURL=utils.js.map
|
package/utils.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["nanoid","
|
|
1
|
+
{"version":3,"names":["customAlphabet","nanoid","sortPropertiesToTheTop","a","b","$isFirst","Number","sortPropertiesToTheBottom","$isLast","sortProperties","properties","sort","buildRoots","roots","sortedRoots","obj","reduce","acc","item","isArray","array","filter","r","name","length","forEach","root","Array","value","undefined","nextRoots","p","parent","id","toObject","prop","getUniqueId"],"sources":["utils.ts"],"sourcesContent":["import { customAlphabet } from \"nanoid\";\nconst nanoid = customAlphabet(\"1234567890abcdef\");\nimport type { Property } from \"./Properties\";\n\nconst sortPropertiesToTheTop = (a: Property, b: Property) => {\n if (a.$isFirst && b.$isFirst) {\n return -1;\n }\n\n return Number(b.$isFirst) - Number(a.$isFirst);\n};\n\nconst sortPropertiesToTheBottom = (a: Property, b: Property) => {\n if (a.$isLast && b.$isLast) {\n return 1;\n }\n\n return Number(a.$isLast) - Number(b.$isLast);\n};\n\nconst sortProperties = (properties: Property[]) => {\n return properties.sort(sortPropertiesToTheTop).sort(sortPropertiesToTheBottom);\n};\n\nfunction buildRoots(roots: Property[], properties: Property[]) {\n const sortedRoots = sortProperties(roots);\n const obj: Record<string, unknown> = sortedRoots.reduce((acc, item) => {\n const isArray =\n item.array === true || sortedRoots.filter(r => r.name === item.name).length > 1;\n return { ...acc, [item.name]: isArray ? [] : {} };\n }, {});\n\n sortedRoots.forEach(root => {\n const isArray = root.array === true || Array.isArray(obj[root.name]);\n if (root.value !== undefined) {\n obj[root.name] = isArray ? [...(obj[root.name] as Array<any>), root.value] : root.value;\n return;\n }\n\n const nextRoots = properties.filter(p => p.parent === root.id);\n const value = buildRoots(nextRoots, properties);\n obj[root.name] = isArray ? [...(obj[root.name] as Property[]), value] : value;\n });\n\n return obj;\n}\n\nexport function toObject<T = unknown>(properties: Property[]): T {\n const roots = properties.filter(prop => prop.parent === \"\");\n return buildRoots(roots, properties) as T;\n}\n\nexport function getUniqueId(length = 12) {\n return nanoid(length);\n}\n"],"mappings":"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","ignoreList":[]}
|