@common-stack/components-pro 0.1.21 → 0.1.24
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/lib/index.d.ts +1 -0
- package/lib/index.js +10 -0
- package/lib/index.js.map +1 -0
- package/lib/index.native.d.ts +1 -0
- package/lib/index.native.js +9 -0
- package/lib/index.native.js.map +1 -0
- package/lib/slot-fill/__tests__/filler-slot.test.d.ts +1 -0
- package/lib/slot-fill/__tests__/filler-slot.test.js +63 -0
- package/lib/slot-fill/__tests__/filler-slot.test.js.map +1 -0
- package/lib/slot-fill/__tests__/slot-features.test.d.ts +1 -0
- package/lib/slot-fill/__tests__/slot-features.test.js +230 -0
- package/lib/slot-fill/__tests__/slot-features.test.js.map +1 -0
- package/lib/slot-fill/base/context.d.ts +6 -0
- package/lib/slot-fill/base/context.js +38 -0
- package/lib/slot-fill/base/context.js.map +1 -0
- package/lib/slot-fill/base/fill.d.ts +10 -0
- package/lib/slot-fill/base/fill.js +65 -0
- package/lib/slot-fill/base/fill.js.map +1 -0
- package/lib/slot-fill/base/provider.d.ts +21 -0
- package/lib/slot-fill/base/provider.js +117 -0
- package/lib/slot-fill/base/provider.js.map +1 -0
- package/lib/slot-fill/base/slot.d.ts +8 -0
- package/lib/slot-fill/base/slot.js +83 -0
- package/lib/slot-fill/base/slot.js.map +1 -0
- package/lib/slot-fill/base/use-slot.d.ts +7 -0
- package/lib/slot-fill/base/use-slot.js +28 -0
- package/lib/slot-fill/base/use-slot.js.map +1 -0
- package/lib/slot-fill/bubbles-virtually/fill.d.ts +5 -0
- package/lib/slot-fill/bubbles-virtually/fill.js +54 -0
- package/lib/slot-fill/bubbles-virtually/fill.js.map +1 -0
- package/lib/slot-fill/bubbles-virtually/slot-fill-context.d.ts +4 -0
- package/lib/slot-fill/bubbles-virtually/slot-fill-context.js +21 -0
- package/lib/slot-fill/bubbles-virtually/slot-fill-context.js.map +1 -0
- package/lib/slot-fill/bubbles-virtually/slot-fill-provider.d.ts +4 -0
- package/lib/slot-fill/bubbles-virtually/slot-fill-provider.js +112 -0
- package/lib/slot-fill/bubbles-virtually/slot-fill-provider.js.map +1 -0
- package/lib/slot-fill/bubbles-virtually/slot.d.ts +6 -0
- package/lib/slot-fill/bubbles-virtually/slot.js +61 -0
- package/lib/slot-fill/bubbles-virtually/slot.js.map +1 -0
- package/lib/slot-fill/bubbles-virtually/use-slot.d.ts +2 -0
- package/lib/slot-fill/bubbles-virtually/use-slot.js +32 -0
- package/lib/slot-fill/bubbles-virtually/use-slot.js.map +1 -0
- package/lib/slot-fill/index.d.ts +30 -0
- package/lib/slot-fill/index.js +81 -0
- package/lib/slot-fill/index.js.map +1 -0
- package/lib/slot-fill/index.native.d.ts +16 -0
- package/lib/slot-fill/index.native.js +48 -0
- package/lib/slot-fill/index.native.js.map +1 -0
- package/lib/slot-fill/interfaces/index.d.ts +79 -0
- package/lib/slot-fill/interfaces/index.js +3 -0
- package/lib/slot-fill/interfaces/index.js.map +1 -0
- package/lib/slot-fill/utils/index.d.ts +1 -0
- package/lib/slot-fill/utils/index.js +14 -0
- package/lib/slot-fill/utils/index.js.map +1 -0
- package/lib/slot-fill/utils/isEmptyElement.d.ts +8 -0
- package/lib/slot-fill/utils/isEmptyElement.js +21 -0
- package/lib/slot-fill/utils/isEmptyElement.js.map +1 -0
- package/package.json +5 -4
- package/esm/index.js +0 -2
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
5
|
+
}) : (function(o, m, k, k2) {
|
|
6
|
+
if (k2 === undefined) k2 = k;
|
|
7
|
+
o[k2] = m[k];
|
|
8
|
+
}));
|
|
9
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
10
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
11
|
+
}) : function(o, v) {
|
|
12
|
+
o["default"] = v;
|
|
13
|
+
});
|
|
14
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
15
|
+
if (mod && mod.__esModule) return mod;
|
|
16
|
+
var result = {};
|
|
17
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
18
|
+
__setModuleDefault(result, mod);
|
|
19
|
+
return result;
|
|
20
|
+
};
|
|
21
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
22
|
+
const lodash_1 = require("lodash");
|
|
23
|
+
const react_1 = __importStar(require("react"));
|
|
24
|
+
const context_1 = require("./context");
|
|
25
|
+
const isEmptyElement_1 = require("../utils/isEmptyElement");
|
|
26
|
+
class SlotComponent extends react_1.Component {
|
|
27
|
+
constructor(props) {
|
|
28
|
+
super(props);
|
|
29
|
+
this.isUnmounted = false;
|
|
30
|
+
this.bindNode = this.bindNode.bind(this);
|
|
31
|
+
}
|
|
32
|
+
componentDidMount() {
|
|
33
|
+
const { registerSlot } = this.props;
|
|
34
|
+
registerSlot(this.props.name, this);
|
|
35
|
+
}
|
|
36
|
+
componentWillUnmount() {
|
|
37
|
+
const { unregisterSlot } = this.props;
|
|
38
|
+
this.isUnmounted = true;
|
|
39
|
+
unregisterSlot(this.props.name, this);
|
|
40
|
+
}
|
|
41
|
+
componentDidUpdate(prevProps) {
|
|
42
|
+
const { name, unregisterSlot, registerSlot } = this.props;
|
|
43
|
+
// Commented following as we need the Slot to render at multiple places
|
|
44
|
+
// if (prevProps.name !== name) {
|
|
45
|
+
// unregisterSlot(prevProps.name);
|
|
46
|
+
// registerSlot(name, this);
|
|
47
|
+
// }
|
|
48
|
+
}
|
|
49
|
+
bindNode(node) {
|
|
50
|
+
this.node = node;
|
|
51
|
+
}
|
|
52
|
+
forceUpdate() {
|
|
53
|
+
if (this.isUnmounted) {
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
super.forceUpdate();
|
|
57
|
+
}
|
|
58
|
+
render() {
|
|
59
|
+
const { children, name, fillProps = {}, getFills, className, } = this.props;
|
|
60
|
+
const fills = lodash_1.map(getFills(name, this), fill => {
|
|
61
|
+
const fillChildren = lodash_1.isFunction(fill.children)
|
|
62
|
+
? fill.children(fillProps)
|
|
63
|
+
: fill.children;
|
|
64
|
+
return react_1.Children.map(fillChildren, (child, childIndex) => {
|
|
65
|
+
if (!child || lodash_1.isString(child)) {
|
|
66
|
+
return child;
|
|
67
|
+
}
|
|
68
|
+
const childKey = child.key || childIndex;
|
|
69
|
+
return react_1.cloneElement(child, { key: childKey });
|
|
70
|
+
});
|
|
71
|
+
}).filter(
|
|
72
|
+
// In some cases fills are rendered only when some conditions apply.
|
|
73
|
+
// This ensures that we only use non-empty fills when rendering, i.e.,
|
|
74
|
+
// it allows us to render wrappers only when the fills are actually present.
|
|
75
|
+
lodash_1.negate(isEmptyElement_1.isEmptyElement));
|
|
76
|
+
return react_1.default.createElement(react_1.default.Fragment, null, lodash_1.isFunction(children) ? children(fills) : fills);
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
const Slot = props => {
|
|
80
|
+
return (react_1.default.createElement(context_1.Consumer, null, ({ registerSlot, unregisterSlot, getFills }) => (react_1.default.createElement(SlotComponent, Object.assign({}, props, { getFills: getFills, registerSlot: registerSlot, unregisterSlot: unregisterSlot })))));
|
|
81
|
+
};
|
|
82
|
+
exports.default = Slot;
|
|
83
|
+
//# sourceMappingURL=slot.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"slot.js","sourceRoot":"","sources":["../../../src/slot-fill/base/slot.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.useSlot = void 0;
|
|
7
|
+
const react_1 = require("react");
|
|
8
|
+
const context_1 = __importDefault(require("./context"));
|
|
9
|
+
/**
|
|
10
|
+
* React hook returning the active slot given a name.
|
|
11
|
+
*
|
|
12
|
+
* @param {string} name Slot name.
|
|
13
|
+
* @return {Object} Slot object.
|
|
14
|
+
*/
|
|
15
|
+
const useSlot = (name) => {
|
|
16
|
+
const { getSlot, subscribe } = react_1.useContext(context_1.default);
|
|
17
|
+
const [slot, setSlot] = react_1.useState(getSlot(name));
|
|
18
|
+
react_1.useEffect(() => {
|
|
19
|
+
setSlot(getSlot(name));
|
|
20
|
+
const unsubscribe = subscribe(() => {
|
|
21
|
+
setSlot(getSlot(name));
|
|
22
|
+
});
|
|
23
|
+
return unsubscribe;
|
|
24
|
+
}, [name]);
|
|
25
|
+
return slot;
|
|
26
|
+
};
|
|
27
|
+
exports.useSlot = useSlot;
|
|
28
|
+
//# sourceMappingURL=use-slot.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-slot.js","sourceRoot":"","sources":["../../../src/slot-fill/base/use-slot.ts"],"names":[],"mappings":";;;;;;AAAA,iCAAwD;AACxD,wDAAwC;AAExC;;;;;GAKG;AACI,MAAM,OAAO,GAAG,CAAC,IAAI,EAAE,EAAE;IAC9B,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,kBAAU,CAAC,iBAAe,CAAC,CAAC;IAC3D,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,gBAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;IAEhD,iBAAS,CAAC,GAAG,EAAE;QACb,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;QACvB,MAAM,WAAW,GAAG,SAAS,CAAC,GAAG,EAAE;YACjC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;QACzB,CAAC,CAAC,CAAC;QACH,OAAO,WAAW,CAAC;IACrB,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IACX,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAZW,QAAA,OAAO,WAYlB"}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
const react_1 = require("react");
|
|
7
|
+
const react_dom_1 = require("react-dom");
|
|
8
|
+
const use_slot_1 = __importDefault(require("./use-slot"));
|
|
9
|
+
function useForceUpdate() {
|
|
10
|
+
const [, setState] = react_1.useState({});
|
|
11
|
+
const mounted = react_1.useRef(true);
|
|
12
|
+
react_1.useEffect(() => {
|
|
13
|
+
return () => {
|
|
14
|
+
mounted.current = false;
|
|
15
|
+
};
|
|
16
|
+
}, []);
|
|
17
|
+
return () => {
|
|
18
|
+
if (mounted.current) {
|
|
19
|
+
setState({});
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
}
|
|
23
|
+
function Fill({ name, children }) {
|
|
24
|
+
const slot = use_slot_1.default(name);
|
|
25
|
+
const ref = react_1.useRef({ rerender: useForceUpdate() });
|
|
26
|
+
react_1.useEffect(() => {
|
|
27
|
+
// We register fills so we can keep track of their existance.
|
|
28
|
+
// Some Slot implementations need to know if there're already fills
|
|
29
|
+
// registered so they can choose to render themselves or not.
|
|
30
|
+
slot.registerFill(ref);
|
|
31
|
+
return () => {
|
|
32
|
+
slot.unregisterFill(ref);
|
|
33
|
+
};
|
|
34
|
+
}, [slot.registerFill, slot.unregisterFill]);
|
|
35
|
+
if (!slot.ref || !slot.ref.current) {
|
|
36
|
+
return null;
|
|
37
|
+
}
|
|
38
|
+
if (typeof children === 'function') {
|
|
39
|
+
children = children(slot.fillProps);
|
|
40
|
+
}
|
|
41
|
+
// NOT USING WRAPPER https://github.com/WordPress/gutenberg/pull/38237/files
|
|
42
|
+
// When using a `Fill`, the `children` will be rendered in the document of the
|
|
43
|
+
// `Slot`. This means that we need to wrap the `children` in a `StyleProvider`
|
|
44
|
+
// to make sure we're referencing the right document/iframe (instead of the
|
|
45
|
+
// context of the `Fill`'s parent).
|
|
46
|
+
// const wrappedChildren = (
|
|
47
|
+
// <StyleProvider document={ slot.ref.current.ownerDocument }>
|
|
48
|
+
// { children }
|
|
49
|
+
// </StyleProvider>
|
|
50
|
+
// );
|
|
51
|
+
return react_dom_1.createPortal(children, slot.ref.current);
|
|
52
|
+
}
|
|
53
|
+
exports.default = Fill;
|
|
54
|
+
//# sourceMappingURL=fill.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fill.js","sourceRoot":"","sources":["../../../src/slot-fill/bubbles-virtually/fill.ts"],"names":[],"mappings":";;;;;AAAA,iCAAoD;AACpD,yCAAyC;AACzC,0DAAiC;AAEjC,SAAS,cAAc;IACtB,MAAM,CAAE,AAAD,EAAG,QAAQ,CAAE,GAAG,gBAAQ,CAAE,EAAE,CAAE,CAAC;IACtC,MAAM,OAAO,GAAG,cAAM,CAAE,IAAI,CAAE,CAAC;IAE/B,iBAAS,CAAE,GAAG,EAAE;QACf,OAAO,GAAG,EAAE;YACX,OAAO,CAAC,OAAO,GAAG,KAAK,CAAC;QACzB,CAAC,CAAC;IACH,CAAC,EAAE,EAAE,CAAE,CAAC;IAER,OAAO,GAAG,EAAE;QACX,IAAK,OAAO,CAAC,OAAO,EAAG;YACtB,QAAQ,CAAE,EAAE,CAAE,CAAC;SACf;IACF,CAAC,CAAC;AACH,CAAC;AAED,SAAwB,IAAI,CAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;IAC/C,MAAM,IAAI,GAAG,kBAAO,CAAE,IAAI,CAAE,CAAC;IAC7B,MAAM,GAAG,GAAG,cAAM,CAAE,EAAE,QAAQ,EAAE,cAAc,EAAE,EAAE,CAAE,CAAC;IAErD,iBAAS,CAAE,GAAG,EAAE;QACf,6DAA6D;QAC7D,mEAAmE;QACnE,6DAA6D;QAC7D,IAAI,CAAC,YAAY,CAAE,GAAG,CAAE,CAAC;QACzB,OAAO,GAAG,EAAE;YACX,IAAI,CAAC,cAAc,CAAE,GAAG,CAAE,CAAC;QAC5B,CAAC,CAAC;IACH,CAAC,EAAE,CAAE,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,cAAc,CAAE,CAAE,CAAC;IAEhD,IAAK,CAAE,IAAI,CAAC,GAAG,IAAI,CAAE,IAAI,CAAC,GAAG,CAAC,OAAO,EAAG;QACvC,OAAO,IAAI,CAAC;KACZ;IAED,IAAK,OAAO,QAAQ,KAAK,UAAU,EAAG;QACrC,QAAQ,GAAG,QAAQ,CAAE,IAAI,CAAC,SAAS,CAAE,CAAC;KACtC;IAEE,4EAA4E;IAC/E,8EAA8E;IAC9E,8EAA8E;IAC9E,2EAA2E;IAC3E,mCAAmC;IACnC,4BAA4B;IAC5B,+DAA+D;IAC/D,iBAAiB;IACjB,oBAAoB;IACpB,KAAK;IAEL,OAAO,wBAAY,CAAE,QAAQ,EAAE,IAAI,CAAC,GAAG,CAAC,OAAO,CAAE,CAAC;AACnD,CAAC;AAlCD,uBAkCC"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
const react_1 = require("react");
|
|
7
|
+
const warning_1 = __importDefault(require("@wordpress/warning"));
|
|
8
|
+
const SlotFillContext = react_1.createContext({
|
|
9
|
+
slots: {},
|
|
10
|
+
fills: {},
|
|
11
|
+
registerSlot: () => {
|
|
12
|
+
warning_1.default('Components must be wrapped within `SlotFillProvider`. ' +
|
|
13
|
+
'See https://developer.wordpress.org/block-editor/components/slot-fill/');
|
|
14
|
+
},
|
|
15
|
+
updateSlot: () => { },
|
|
16
|
+
unregisterSlot: () => { },
|
|
17
|
+
registerFill: () => { },
|
|
18
|
+
unregisterFill: () => { },
|
|
19
|
+
});
|
|
20
|
+
exports.default = SlotFillContext;
|
|
21
|
+
//# sourceMappingURL=slot-fill-context.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"slot-fill-context.js","sourceRoot":"","sources":["../../../src/slot-fill/bubbles-virtually/slot-fill-context.ts"],"names":[],"mappings":";;;;;AAAA,iCAAsC;AACtC,iEAAyC;AAGzC,MAAM,eAAe,GAAG,qBAAa,CAAwB;IAC5D,KAAK,EAAE,EAAE;IACT,KAAK,EAAE,EAAE;IACT,YAAY,EAAE,GAAG,EAAE;QAClB,iBAAO,CACN,wDAAwD;YACvD,wEAAwE,CACzE,CAAC;IACH,CAAC;IACD,UAAU,EAAE,GAAG,EAAE,GAAE,CAAC;IACpB,cAAc,EAAE,GAAG,EAAE,GAAE,CAAC;IACxB,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;IACtB,cAAc,EAAE,GAAG,EAAE,GAAE,CAAC;CACxB,CAAE,CAAC;AAEJ,kBAAe,eAAe,CAAC"}
|
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
5
|
+
}) : (function(o, m, k, k2) {
|
|
6
|
+
if (k2 === undefined) k2 = k;
|
|
7
|
+
o[k2] = m[k];
|
|
8
|
+
}));
|
|
9
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
10
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
11
|
+
}) : function(o, v) {
|
|
12
|
+
o["default"] = v;
|
|
13
|
+
});
|
|
14
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
15
|
+
if (mod && mod.__esModule) return mod;
|
|
16
|
+
var result = {};
|
|
17
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
18
|
+
__setModuleDefault(result, mod);
|
|
19
|
+
return result;
|
|
20
|
+
};
|
|
21
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
22
|
+
var t = {};
|
|
23
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
24
|
+
t[p] = s[p];
|
|
25
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
26
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
27
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
28
|
+
t[p[i]] = s[p[i]];
|
|
29
|
+
}
|
|
30
|
+
return t;
|
|
31
|
+
};
|
|
32
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
33
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
34
|
+
};
|
|
35
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
|
+
const react_1 = __importStar(require("react"));
|
|
37
|
+
const is_shallow_equal_1 = __importDefault(require("@wordpress/is-shallow-equal"));
|
|
38
|
+
/**
|
|
39
|
+
* Internal dependencies
|
|
40
|
+
*/
|
|
41
|
+
const slot_fill_context_1 = __importDefault(require("./slot-fill-context"));
|
|
42
|
+
function useSlotRegistry() {
|
|
43
|
+
const [slots, setSlots] = react_1.useState({});
|
|
44
|
+
const [fills, setFills] = react_1.useState({});
|
|
45
|
+
const registerSlot = react_1.useCallback((name, ref, fillProps) => {
|
|
46
|
+
setSlots((prevSlots) => {
|
|
47
|
+
const slot = prevSlots[name] || {};
|
|
48
|
+
return Object.assign(Object.assign({}, prevSlots), { [name]: Object.assign(Object.assign({}, slot), { ref: ref || slot.ref, fillProps: fillProps || slot.fillProps || {} }) });
|
|
49
|
+
});
|
|
50
|
+
}, []);
|
|
51
|
+
const unregisterSlot = react_1.useCallback((name, ref) => {
|
|
52
|
+
setSlots((prevSlots) => {
|
|
53
|
+
const _a = prevSlots, _b = name, slot = _a[_b], nextSlots = __rest(_a, [typeof _b === "symbol" ? _b : _b + ""]);
|
|
54
|
+
// Make sure we're not unregistering a slot registered by another element
|
|
55
|
+
// See https://github.com/WordPress/gutenberg/pull/19242#issuecomment-590295412
|
|
56
|
+
if ((slot === null || slot === void 0 ? void 0 : slot.ref) === ref) {
|
|
57
|
+
return nextSlots;
|
|
58
|
+
}
|
|
59
|
+
return prevSlots;
|
|
60
|
+
});
|
|
61
|
+
}, []);
|
|
62
|
+
const updateSlot = react_1.useCallback((name, fillProps) => {
|
|
63
|
+
const slot = slots[name];
|
|
64
|
+
if (!slot) {
|
|
65
|
+
return;
|
|
66
|
+
}
|
|
67
|
+
if (!is_shallow_equal_1.default(slot.fillProps, fillProps)) {
|
|
68
|
+
slot.fillProps = fillProps;
|
|
69
|
+
const slotFills = fills[name];
|
|
70
|
+
if (slotFills) {
|
|
71
|
+
// Force update fills.
|
|
72
|
+
slotFills.map((fill) => fill.current.rerender());
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
}, [slots, fills]);
|
|
76
|
+
const registerFill = react_1.useCallback((name, ref) => {
|
|
77
|
+
setFills((prevFills) => (Object.assign(Object.assign({}, prevFills), { [name]: [...(prevFills[name] || []), ref] })));
|
|
78
|
+
}, []);
|
|
79
|
+
const unregisterFill = react_1.useCallback((name, ref) => {
|
|
80
|
+
setFills((prevFills) => {
|
|
81
|
+
if (prevFills[name]) {
|
|
82
|
+
return Object.assign(Object.assign({}, prevFills), { [name]: prevFills[name].filter((fillRef) => fillRef !== ref) });
|
|
83
|
+
}
|
|
84
|
+
return prevFills;
|
|
85
|
+
});
|
|
86
|
+
}, []);
|
|
87
|
+
// Memoizing the return value so it can be directly passed to Provider value
|
|
88
|
+
const registry = react_1.useMemo(() => ({
|
|
89
|
+
slots,
|
|
90
|
+
fills,
|
|
91
|
+
registerSlot,
|
|
92
|
+
updateSlot,
|
|
93
|
+
unregisterSlot,
|
|
94
|
+
registerFill,
|
|
95
|
+
unregisterFill,
|
|
96
|
+
}), [
|
|
97
|
+
slots,
|
|
98
|
+
fills,
|
|
99
|
+
registerSlot,
|
|
100
|
+
updateSlot,
|
|
101
|
+
unregisterSlot,
|
|
102
|
+
registerFill,
|
|
103
|
+
unregisterFill,
|
|
104
|
+
]);
|
|
105
|
+
return registry;
|
|
106
|
+
}
|
|
107
|
+
function SlotFillProvider({ children }) {
|
|
108
|
+
const registry = useSlotRegistry();
|
|
109
|
+
return (react_1.default.createElement(slot_fill_context_1.default.Provider, { value: registry }, children));
|
|
110
|
+
}
|
|
111
|
+
exports.default = SlotFillProvider;
|
|
112
|
+
//# sourceMappingURL=slot-fill-provider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"slot-fill-provider.js","sourceRoot":"","sources":["../../../src/slot-fill/bubbles-virtually/slot-fill-provider.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
5
|
+
}) : (function(o, m, k, k2) {
|
|
6
|
+
if (k2 === undefined) k2 = k;
|
|
7
|
+
o[k2] = m[k];
|
|
8
|
+
}));
|
|
9
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
10
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
11
|
+
}) : function(o, v) {
|
|
12
|
+
o["default"] = v;
|
|
13
|
+
});
|
|
14
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
15
|
+
if (mod && mod.__esModule) return mod;
|
|
16
|
+
var result = {};
|
|
17
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
18
|
+
__setModuleDefault(result, mod);
|
|
19
|
+
return result;
|
|
20
|
+
};
|
|
21
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
22
|
+
var t = {};
|
|
23
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
24
|
+
t[p] = s[p];
|
|
25
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
26
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
27
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
28
|
+
t[p[i]] = s[p[i]];
|
|
29
|
+
}
|
|
30
|
+
return t;
|
|
31
|
+
};
|
|
32
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
33
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
34
|
+
};
|
|
35
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
|
+
const react_1 = __importStar(require("react"));
|
|
37
|
+
const compose_1 = require("@wordpress/compose");
|
|
38
|
+
const slot_fill_context_1 = __importDefault(require("./slot-fill-context"));
|
|
39
|
+
function Slot(_a, forwardedRef) {
|
|
40
|
+
var { name, fillProps = {}, as: Component = 'div' } = _a, props = __rest(_a, ["name", "fillProps", "as"]);
|
|
41
|
+
const registry = react_1.useContext(slot_fill_context_1.default);
|
|
42
|
+
const ref = react_1.useRef();
|
|
43
|
+
react_1.useLayoutEffect(() => {
|
|
44
|
+
registry.registerSlot(name, ref, fillProps);
|
|
45
|
+
return () => {
|
|
46
|
+
registry.unregisterSlot(name, ref);
|
|
47
|
+
};
|
|
48
|
+
// We are not including fillProps in the deps because we don't want to
|
|
49
|
+
// unregister and register the slot whenever fillProps change, which would
|
|
50
|
+
// cause the fill to be re-mounted. We are only considering the initial value
|
|
51
|
+
// of fillProps.
|
|
52
|
+
}, [registry.registerSlot, registry.unregisterSlot, name]);
|
|
53
|
+
// fillProps may be an update that interacts with the layout, so we
|
|
54
|
+
// useLayoutEffect.
|
|
55
|
+
react_1.useLayoutEffect(() => {
|
|
56
|
+
registry.updateSlot(name, fillProps);
|
|
57
|
+
});
|
|
58
|
+
return (react_1.default.createElement(Component, Object.assign({ ref: compose_1.useMergeRefs([forwardedRef, ref]) }, props)));
|
|
59
|
+
}
|
|
60
|
+
exports.default = react_1.forwardRef(Slot);
|
|
61
|
+
//# sourceMappingURL=slot.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"slot.js","sourceRoot":"","sources":["../../../src/slot-fill/bubbles-virtually/slot.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAKe;AACf,gDAAkD;AAClD,4EAAkD;AAGlD,SAAS,IAAI,CACZ,EAAmF,EACnF,YAAY;QADZ,EAAE,IAAI,EAAE,SAAS,GAAG,EAAE,EAAE,EAAE,EAAE,SAAS,GAAG,KAAK,OAAsC,EAAjC,KAAK,cAAvD,2BAAyD,CAAF;IAGvD,MAAM,QAAQ,GAAG,kBAAU,CAAC,2BAAe,CAAC,CAAC;IAC7C,MAAM,GAAG,GAAG,cAAM,EAAE,CAAC;IAErB,uBAAe,CAAC,GAAG,EAAE;QACpB,QAAQ,CAAC,YAAY,CAAC,IAAI,EAAE,GAAG,EAAE,SAAS,CAAC,CAAC;QAC5C,OAAO,GAAG,EAAE;YACX,QAAQ,CAAC,cAAc,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;QACpC,CAAC,CAAC;QACF,sEAAsE;QACtE,0EAA0E;QAC1E,6EAA6E;QAC7E,gBAAgB;IACjB,CAAC,EAAE,CAAC,QAAQ,CAAC,YAAY,EAAE,QAAQ,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC,CAAC;IAC3D,mEAAmE;IACnE,mBAAmB;IACnB,uBAAe,CAAC,GAAG,EAAE;QACpB,QAAQ,CAAC,UAAU,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,OAAO,CACN,8BAAC,SAAS,kBAAC,GAAG,EAAE,sBAAY,CAAC,CAAC,YAAY,EAAE,GAAG,CAAC,CAAC,IAAM,KAAK,EAAI,CAChE,CAAC;AACH,CAAC;AAED,kBAAe,kBAAU,CAAC,IAAI,CAAC,CAAC"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
const react_1 = require("react");
|
|
7
|
+
const slot_fill_context_1 = __importDefault(require("./slot-fill-context"));
|
|
8
|
+
function useSlot(name) {
|
|
9
|
+
const registry = react_1.useContext(slot_fill_context_1.default);
|
|
10
|
+
const slot = registry.slots[name] || {};
|
|
11
|
+
const slotFills = registry.fills[name];
|
|
12
|
+
const fills = react_1.useMemo(() => slotFills || [], [slotFills]);
|
|
13
|
+
const updateSlot = react_1.useCallback((fillProps) => {
|
|
14
|
+
registry.updateSlot(name, fillProps);
|
|
15
|
+
}, [name, registry.updateSlot]);
|
|
16
|
+
const unregisterSlot = react_1.useCallback((slotRef) => {
|
|
17
|
+
registry.unregisterSlot(name, slotRef);
|
|
18
|
+
}, [name, registry.unregisterSlot]);
|
|
19
|
+
const registerFill = react_1.useCallback((fillRef) => {
|
|
20
|
+
registry.registerFill(name, fillRef);
|
|
21
|
+
}, [name, registry.registerFill]);
|
|
22
|
+
const unregisterFill = react_1.useCallback((fillRef) => {
|
|
23
|
+
registry.unregisterFill(name, fillRef);
|
|
24
|
+
}, [name, registry.unregisterFill]);
|
|
25
|
+
return Object.assign(Object.assign({}, slot), { updateSlot,
|
|
26
|
+
unregisterSlot,
|
|
27
|
+
fills,
|
|
28
|
+
registerFill,
|
|
29
|
+
unregisterFill });
|
|
30
|
+
}
|
|
31
|
+
exports.default = useSlot;
|
|
32
|
+
//# sourceMappingURL=use-slot.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-slot.js","sourceRoot":"","sources":["../../../src/slot-fill/bubbles-virtually/use-slot.tsx"],"names":[],"mappings":";;;;;AAAA,iCAAyD;AAEzD,4EAAkD;AAElD,SAAwB,OAAO,CAAC,IAAU;IACtC,MAAM,QAAQ,GAAG,kBAAU,CAAC,2BAAe,CAAC,CAAC;IAE7C,MAAM,IAAI,GAAG,QAAQ,CAAC,KAAK,CAAC,IAAc,CAAC,IAAI,EAAE,CAAC;IAClD,MAAM,SAAS,GAAG,QAAQ,CAAC,KAAK,CAAC,IAAc,CAAC,CAAC;IACjD,MAAM,KAAK,GAAG,eAAO,CAAC,GAAG,EAAE,CAAC,SAAS,IAAI,EAAE,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAE1D,MAAM,UAAU,GAAG,mBAAW,CAC1B,CAAC,SAAS,EAAE,EAAE;QACV,QAAQ,CAAC,UAAU,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;IACzC,CAAC,EACD,CAAC,IAAI,EAAE,QAAQ,CAAC,UAAU,CAAC,CAC9B,CAAC;IAEF,MAAM,cAAc,GAAG,mBAAW,CAC9B,CAAC,OAAO,EAAE,EAAE;QACR,QAAQ,CAAC,cAAc,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;IAC3C,CAAC,EACD,CAAC,IAAI,EAAE,QAAQ,CAAC,cAAc,CAAC,CAClC,CAAC;IAEF,MAAM,YAAY,GAAG,mBAAW,CAC5B,CAAC,OAAO,EAAE,EAAE;QACR,QAAQ,CAAC,YAAY,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;IACzC,CAAC,EACD,CAAC,IAAI,EAAE,QAAQ,CAAC,YAAY,CAAC,CAChC,CAAC;IAEF,MAAM,cAAc,GAAG,mBAAW,CAC9B,CAAC,OAAO,EAAE,EAAE;QACR,QAAQ,CAAC,cAAc,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;IAC3C,CAAC,EACD,CAAC,IAAI,EAAE,QAAQ,CAAC,cAAc,CAAC,CAClC,CAAC;IAEF,uCACO,IAAI,KACP,UAAU;QACV,cAAc;QACd,KAAK;QACL,YAAY;QACZ,cAAc,IAChB;AACN,CAAC;AA3CD,0BA2CC"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import React, { ReactNode } from 'react';
|
|
2
|
+
import SlotFillProvider from './base/provider';
|
|
3
|
+
import useSlot from './bubbles-virtually/use-slot';
|
|
4
|
+
import { IFillProps, ISlotProps } from './interfaces';
|
|
5
|
+
declare type RenderProps<T> = {
|
|
6
|
+
children: (api: T) => ReactNode;
|
|
7
|
+
} | {
|
|
8
|
+
render: (api: T) => ReactNode;
|
|
9
|
+
};
|
|
10
|
+
export declare function Fill(props: any): JSX.Element;
|
|
11
|
+
export declare const Slot: React.ForwardRefExoticComponent<ISlotProps & React.RefAttributes<unknown>>;
|
|
12
|
+
export declare function Provider({ children, ...props }: {
|
|
13
|
+
[x: string]: any;
|
|
14
|
+
children: any;
|
|
15
|
+
}): JSX.Element;
|
|
16
|
+
export declare function createSlotFill<T = Exclude<IFillProps, 'name'>>(name: string): {
|
|
17
|
+
Fill: {
|
|
18
|
+
(props: RenderProps<T> | T): JSX.Element;
|
|
19
|
+
displayName: string;
|
|
20
|
+
};
|
|
21
|
+
Slot: {
|
|
22
|
+
(props: {
|
|
23
|
+
fillProps: T;
|
|
24
|
+
}): JSX.Element;
|
|
25
|
+
displayName: string;
|
|
26
|
+
__unstableName: string;
|
|
27
|
+
};
|
|
28
|
+
};
|
|
29
|
+
export { SlotFillProvider };
|
|
30
|
+
export { useSlot };
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
5
|
+
}) : (function(o, m, k, k2) {
|
|
6
|
+
if (k2 === undefined) k2 = k;
|
|
7
|
+
o[k2] = m[k];
|
|
8
|
+
}));
|
|
9
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
10
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
11
|
+
}) : function(o, v) {
|
|
12
|
+
o["default"] = v;
|
|
13
|
+
});
|
|
14
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
15
|
+
if (mod && mod.__esModule) return mod;
|
|
16
|
+
var result = {};
|
|
17
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
18
|
+
__setModuleDefault(result, mod);
|
|
19
|
+
return result;
|
|
20
|
+
};
|
|
21
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
22
|
+
var t = {};
|
|
23
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
24
|
+
t[p] = s[p];
|
|
25
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
26
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
27
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
28
|
+
t[p[i]] = s[p[i]];
|
|
29
|
+
}
|
|
30
|
+
return t;
|
|
31
|
+
};
|
|
32
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
33
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
34
|
+
};
|
|
35
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
|
+
exports.useSlot = exports.SlotFillProvider = exports.createSlotFill = exports.Provider = exports.Slot = exports.Fill = void 0;
|
|
37
|
+
const react_1 = __importStar(require("react"));
|
|
38
|
+
const fill_1 = __importDefault(require("./base/fill"));
|
|
39
|
+
const slot_1 = __importDefault(require("./base/slot"));
|
|
40
|
+
const fill_2 = __importDefault(require("./bubbles-virtually/fill"));
|
|
41
|
+
const slot_2 = __importDefault(require("./bubbles-virtually/slot"));
|
|
42
|
+
const slot_fill_provider_1 = __importDefault(require("./bubbles-virtually/slot-fill-provider"));
|
|
43
|
+
const provider_1 = __importDefault(require("./base/provider"));
|
|
44
|
+
exports.SlotFillProvider = provider_1.default;
|
|
45
|
+
const use_slot_1 = __importDefault(require("./bubbles-virtually/use-slot"));
|
|
46
|
+
exports.useSlot = use_slot_1.default;
|
|
47
|
+
function Fill(props) {
|
|
48
|
+
// We're adding both Fills here so they can register themselves before
|
|
49
|
+
// their respective slot has been registered. Only the Fill that has a slot
|
|
50
|
+
// will render. The other one will return null.
|
|
51
|
+
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
52
|
+
react_1.default.createElement(fill_1.default, Object.assign({}, props)),
|
|
53
|
+
react_1.default.createElement(fill_2.default, Object.assign({}, props))));
|
|
54
|
+
}
|
|
55
|
+
exports.Fill = Fill;
|
|
56
|
+
exports.Slot = react_1.forwardRef((_a, ref) => {
|
|
57
|
+
var { bubblesVirtually } = _a, props = __rest(_a, ["bubblesVirtually"]);
|
|
58
|
+
if (bubblesVirtually) {
|
|
59
|
+
return react_1.default.createElement(slot_2.default, Object.assign({}, props, { ref: ref }));
|
|
60
|
+
}
|
|
61
|
+
return react_1.default.createElement(slot_1.default, Object.assign({}, props));
|
|
62
|
+
});
|
|
63
|
+
function Provider(_a) {
|
|
64
|
+
var { children } = _a, props = __rest(_a, ["children"]);
|
|
65
|
+
return (react_1.default.createElement(provider_1.default, Object.assign({}, props),
|
|
66
|
+
react_1.default.createElement(slot_fill_provider_1.default, null, children)));
|
|
67
|
+
}
|
|
68
|
+
exports.Provider = Provider;
|
|
69
|
+
function createSlotFill(name) {
|
|
70
|
+
const FillComponent = (props) => react_1.default.createElement(Fill, Object.assign({ name: name }, props));
|
|
71
|
+
FillComponent.displayName = name + 'Fill';
|
|
72
|
+
const SlotComponent = (props) => react_1.default.createElement(exports.Slot, Object.assign({ name: name }, props));
|
|
73
|
+
SlotComponent.displayName = name + 'Slot';
|
|
74
|
+
SlotComponent.__unstableName = name;
|
|
75
|
+
return {
|
|
76
|
+
Fill: FillComponent,
|
|
77
|
+
Slot: SlotComponent,
|
|
78
|
+
};
|
|
79
|
+
}
|
|
80
|
+
exports.createSlotFill = createSlotFill;
|
|
81
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/slot-fill/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAqD;AACrD,uDAAmC;AACnC,uDAAmC;AACnC,oEAA4D;AAC5D,oEAA4D;AAC5D,gGAAsF;AACtF,+DAA+C;AAqDtC,2BArDF,kBAAgB,CAqDE;AApDzB,4EAAmD;AAsD1C,kBAtDF,kBAAO,CAsDE;AA7ChB,SAAgB,IAAI,CAAC,KAAK;IACxB,sEAAsE;IACtE,2EAA2E;IAC3E,+CAA+C;IAC/C,OAAO,CACL;QACE,8BAAC,cAAQ,oBAAK,KAAK,EAAI;QACvB,8BAAC,cAAoB,oBAAK,KAAK,EAAI,CAClC,CACJ,CAAC;AACJ,CAAC;AAVD,oBAUC;AAEY,QAAA,IAAI,GAAG,kBAAU,CAAC,CAAC,EAA0C,EAAE,GAAG,EAAE,EAAE;QAAnD,EAAE,gBAAgB,OAAwB,EAAnB,KAAK,cAA5B,oBAA8B,CAAF;IAC1D,IAAI,gBAAgB,EAAE;QACpB,OAAO,8BAAC,cAAoB,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAAC;KACtD;IACD,OAAO,8BAAC,cAAQ,oBAAK,KAAK,EAAI,CAAC;AACjC,CAAC,CAAC,CAAC;AAEH,SAAgB,QAAQ,CAAC,EAAsB;QAAtB,EAAE,QAAQ,OAAY,EAAP,KAAK,cAApB,YAAsB,CAAF;IAC3C,OAAO,CACL,8BAAC,kBAAgB,oBAAK,KAAK;QACzB,8BAAC,4BAAgC,QAC9B,QAAQ,CACwB,CAClB,CACpB,CAAC;AACJ,CAAC;AARD,4BAQC;AAED,SAAgB,cAAc,CAAkC,IAAY;IAC1E,MAAM,aAAa,GAAG,CAAC,KAAyB,EAAE,EAAE,CAAC,8BAAC,IAAI,kBAAC,IAAI,EAAE,IAAI,IAAM,KAAK,EAAI,CAAC;IACrF,aAAa,CAAC,WAAW,GAAG,IAAI,GAAG,MAAM,CAAC;IAE1C,MAAM,aAAa,GAAG,CAAC,KAAuB,EAAE,EAAE,CAAC,8BAAC,YAAI,kBAAC,IAAI,EAAE,IAAI,IAAM,KAAK,EAAI,CAAC;IACnF,aAAa,CAAC,WAAW,GAAG,IAAI,GAAG,MAAM,CAAC;IAC1C,aAAa,CAAC,cAAc,GAAG,IAAI,CAAC;IAEpC,OAAO;QACL,IAAI,EAAE,aAAa;QACnB,IAAI,EAAE,aAAa;KACpB,CAAC;AACJ,CAAC;AAZD,wCAYC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import Fill from './base/fill';
|
|
3
|
+
import Provider from './base/provider';
|
|
4
|
+
import { ISlotProps } from './interfaces';
|
|
5
|
+
export { Fill, Provider };
|
|
6
|
+
export declare function Slot(props: ISlotProps): JSX.Element;
|
|
7
|
+
export declare function createSlotFill(name: any): {
|
|
8
|
+
Fill: {
|
|
9
|
+
(props: any): JSX.Element;
|
|
10
|
+
displayName: string;
|
|
11
|
+
};
|
|
12
|
+
Slot: {
|
|
13
|
+
(props: any): JSX.Element;
|
|
14
|
+
displayName: string;
|
|
15
|
+
};
|
|
16
|
+
};
|