@cleanweb/oore 1.2.0-alpha.9 → 1.2.1-beta.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/build/slots/hook.js +27 -21
- package/build/slots/types.d.ts +2 -2
- package/package.json +1 -1
package/build/slots/hook.js
CHANGED
|
@@ -23,16 +23,7 @@ var isElementChild = function (child) {
|
|
|
23
23
|
};
|
|
24
24
|
exports.isElementChild = isElementChild;
|
|
25
25
|
var getComponentSlotName = function (TargetComponent, child) {
|
|
26
|
-
if (
|
|
27
|
-
return TargetComponent;
|
|
28
|
-
}
|
|
29
|
-
else if ('slotName' in TargetComponent) {
|
|
30
|
-
return TargetComponent.slotName;
|
|
31
|
-
}
|
|
32
|
-
else if ('displayName' in TargetComponent) {
|
|
33
|
-
return TargetComponent.displayName;
|
|
34
|
-
}
|
|
35
|
-
else if (child) {
|
|
26
|
+
if (child) {
|
|
36
27
|
var keyTypes = ['string', 'number', 'symbol'];
|
|
37
28
|
var slotName = child.props['data-slot-name'];
|
|
38
29
|
if (keyTypes.includes(typeof slotName)) {
|
|
@@ -41,14 +32,20 @@ var getComponentSlotName = function (TargetComponent, child) {
|
|
|
41
32
|
}
|
|
42
33
|
return slotName;
|
|
43
34
|
}
|
|
44
|
-
else
|
|
45
|
-
return undefined;
|
|
46
35
|
}
|
|
47
|
-
|
|
48
|
-
return
|
|
36
|
+
if (typeof TargetComponent === 'string') {
|
|
37
|
+
return TargetComponent;
|
|
38
|
+
}
|
|
39
|
+
else if ('slotName' in TargetComponent) {
|
|
40
|
+
return TargetComponent.slotName;
|
|
41
|
+
}
|
|
42
|
+
else if ('displayName' in TargetComponent) {
|
|
43
|
+
return TargetComponent.displayName;
|
|
44
|
+
}
|
|
45
|
+
return undefined;
|
|
49
46
|
};
|
|
50
47
|
exports.getComponentSlotName = getComponentSlotName;
|
|
51
|
-
var useSlots = function (children, slotComponents,
|
|
48
|
+
var useSlots = function (children, slotComponents, requiredSlotAliases) {
|
|
52
49
|
var useMemo = react_1.default.useMemo;
|
|
53
50
|
var slotsAliasLookup = useMemo(function () {
|
|
54
51
|
var entries = Object.entries(slotComponents);
|
|
@@ -60,7 +57,7 @@ var useSlots = function (children, slotComponents, _requiredSlots) {
|
|
|
60
57
|
(0, errors_1.throwDevError)("A registered slot component did not have a slot name. All components registered as slots must either be a string tag-name or a React component with either \"slotName\" or \"displayName\". The affected component was: ".concat(RegisteredSlotComponent));
|
|
61
58
|
return;
|
|
62
59
|
}
|
|
63
|
-
|
|
60
|
+
aliasLookup[slotName] = alias;
|
|
64
61
|
});
|
|
65
62
|
return aliasLookup;
|
|
66
63
|
}, [slotComponents]);
|
|
@@ -68,7 +65,7 @@ var useSlots = function (children, slotComponents, _requiredSlots) {
|
|
|
68
65
|
var slotNodes = {};
|
|
69
66
|
var unmatchedChildren = [];
|
|
70
67
|
var invalidChildren = [];
|
|
71
|
-
var
|
|
68
|
+
var cachedRequiredSlotAliases = __spreadArray([], (requiredSlotAliases !== null && requiredSlotAliases !== void 0 ? requiredSlotAliases : []), true);
|
|
72
69
|
react_1.default.Children.forEach(children, function (child) {
|
|
73
70
|
if (!child) {
|
|
74
71
|
invalidChildren.push(child);
|
|
@@ -90,15 +87,24 @@ var useSlots = function (children, slotComponents, _requiredSlots) {
|
|
|
90
87
|
})();
|
|
91
88
|
if (slotAlias && (typeof slotComponents[slotAlias] !== 'string')) {
|
|
92
89
|
if (slotComponents[slotAlias].isRequiredSlot) {
|
|
93
|
-
|
|
90
|
+
cachedRequiredSlotAliases.push(slotAlias);
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
if (slotAlias) {
|
|
94
|
+
if (!slotNodes[slotAlias]) {
|
|
95
|
+
slotNodes[slotAlias] = child;
|
|
96
|
+
}
|
|
97
|
+
else if (Array.isArray(slotNodes[slotAlias])) {
|
|
98
|
+
slotNodes[slotAlias].push(child);
|
|
99
|
+
}
|
|
100
|
+
else {
|
|
101
|
+
slotNodes[slotAlias] = [slotNodes[slotAlias], child];
|
|
94
102
|
}
|
|
95
103
|
}
|
|
96
|
-
if (slotAlias)
|
|
97
|
-
slotNodes[slotAlias] = child;
|
|
98
104
|
else
|
|
99
105
|
unmatchedChildren.push(child);
|
|
100
106
|
});
|
|
101
|
-
|
|
107
|
+
cachedRequiredSlotAliases.forEach(function (slotAlias) {
|
|
102
108
|
if (!slotNodes[slotAlias]) {
|
|
103
109
|
(0, errors_1.throwDevError)("Missing required slot \"".concat(String(slotAlias), "\"."));
|
|
104
110
|
}
|
package/build/slots/types.d.ts
CHANGED
|
@@ -18,7 +18,7 @@ export type SlottedComponent<TComponentArg extends TComponent = TComponent, TSlo
|
|
|
18
18
|
Slots: TSlotsRecordArg;
|
|
19
19
|
};
|
|
20
20
|
export type TSlotNodes<TSlotAliasArg extends TSlotAlias> = {
|
|
21
|
-
[Key in TSlotAliasArg]?: ReactElement<any
|
|
21
|
+
[Key in TSlotAliasArg]?: ReactElement<any> | Array<ReactElement<any>>;
|
|
22
22
|
};
|
|
23
23
|
export type TUseSlotsResult<TSlotAliasArg extends TSlotAlias = TSlotAlias> = Readonly<[
|
|
24
24
|
slots: TSlotNodes<TSlotAliasArg>,
|
|
@@ -26,6 +26,6 @@ export type TUseSlotsResult<TSlotAliasArg extends TSlotAlias = TSlotAlias> = Rea
|
|
|
26
26
|
invalidChildren: any[]
|
|
27
27
|
]>;
|
|
28
28
|
export interface IUseSlots {
|
|
29
|
-
<TSlotAliasArg extends TSlotAlias = TSlotAlias>(children: ReactNode, slotComponents: TSlotsRecord<TSlotAliasArg>,
|
|
29
|
+
<TSlotAliasArg extends TSlotAlias = TSlotAlias>(children: ReactNode, slotComponents: TSlotsRecord<TSlotAliasArg>, requiredSlotAliases?: TSlotAliasArg[]): TUseSlotsResult<TSlotAliasArg>;
|
|
30
30
|
}
|
|
31
31
|
export type PotentialSlotComponent = string | SlotComponent | TComponent;
|