@niibase/bottom-sheet-manager 1.1.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/LICENSE +21 -0
- package/README.md +147 -0
- package/lib/commonjs/events.js +35 -0
- package/lib/commonjs/events.js.map +1 -0
- package/lib/commonjs/index.js +85 -0
- package/lib/commonjs/index.js.map +1 -0
- package/lib/commonjs/manager.js +171 -0
- package/lib/commonjs/manager.js.map +1 -0
- package/lib/commonjs/provider.js +229 -0
- package/lib/commonjs/provider.js.map +1 -0
- package/lib/commonjs/router/index.js +100 -0
- package/lib/commonjs/router/index.js.map +1 -0
- package/lib/commonjs/router/router.js +72 -0
- package/lib/commonjs/router/router.js.map +1 -0
- package/lib/commonjs/router/types.js +6 -0
- package/lib/commonjs/router/types.js.map +1 -0
- package/lib/commonjs/router/view.js +180 -0
- package/lib/commonjs/router/view.js.map +1 -0
- package/lib/commonjs/sheet.js +240 -0
- package/lib/commonjs/sheet.js.map +1 -0
- package/lib/commonjs/types.js +6 -0
- package/lib/commonjs/types.js.map +1 -0
- package/lib/module/events.js +29 -0
- package/lib/module/events.js.map +1 -0
- package/lib/module/index.js +6 -0
- package/lib/module/index.js.map +1 -0
- package/lib/module/manager.js +165 -0
- package/lib/module/manager.js.map +1 -0
- package/lib/module/provider.js +210 -0
- package/lib/module/provider.js.map +1 -0
- package/lib/module/router/index.js +79 -0
- package/lib/module/router/index.js.map +1 -0
- package/lib/module/router/router.js +65 -0
- package/lib/module/router/router.js.map +1 -0
- package/lib/module/router/types.js +2 -0
- package/lib/module/router/types.js.map +1 -0
- package/lib/module/router/view.js +173 -0
- package/lib/module/router/view.js.map +1 -0
- package/lib/module/sheet.js +232 -0
- package/lib/module/sheet.js.map +1 -0
- package/lib/module/types.js +2 -0
- package/lib/module/types.js.map +1 -0
- package/lib/typescript/events.d.ts +16 -0
- package/lib/typescript/events.d.ts.map +1 -0
- package/lib/typescript/index.d.ts +6 -0
- package/lib/typescript/index.d.ts.map +1 -0
- package/lib/typescript/manager.d.ts +78 -0
- package/lib/typescript/manager.d.ts.map +1 -0
- package/lib/typescript/provider.d.ts +69 -0
- package/lib/typescript/provider.d.ts.map +1 -0
- package/lib/typescript/router/index.d.ts +59 -0
- package/lib/typescript/router/index.d.ts.map +1 -0
- package/lib/typescript/router/router.d.ts +47 -0
- package/lib/typescript/router/router.d.ts.map +1 -0
- package/lib/typescript/router/types.d.ts +46 -0
- package/lib/typescript/router/types.d.ts.map +1 -0
- package/lib/typescript/router/view.d.ts +11 -0
- package/lib/typescript/router/view.d.ts.map +1 -0
- package/lib/typescript/sheet.d.ts +19 -0
- package/lib/typescript/sheet.d.ts.map +1 -0
- package/lib/typescript/types.d.ts +125 -0
- package/lib/typescript/types.d.ts.map +1 -0
- package/package.json +102 -0
- package/src/events.ts +40 -0
- package/src/index.ts +11 -0
- package/src/manager.ts +223 -0
- package/src/provider.tsx +293 -0
- package/src/router/index.tsx +130 -0
- package/src/router/router.ts +94 -0
- package/src/router/types.ts +117 -0
- package/src/router/view.tsx +265 -0
- package/src/sheet.tsx +350 -0
- package/src/types.ts +153 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2025 Divine Niiquaye Ibok
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
# Bottom Sheet Router & Manager
|
|
2
|
+
|
|
3
|
+
A bottom sheet manager inspired by package [react-native-actions-sheet](https://github.com/ammarahm-ed/@repo/bottom-sheet) and adapted to package [@gorhom/bottom-sheet](https://github.com/gorhom/react-native-bottom-sheet).
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
## Installation
|
|
7
|
+
|
|
8
|
+
Add it to your project with package.json:
|
|
9
|
+
|
|
10
|
+
```bash
|
|
11
|
+
npm install @niibase/bottom-sheet-manager
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
## Usage
|
|
15
|
+
|
|
16
|
+
`SheetManager` is great because it helps you save lots of development time. One great feature is that you can reuse the same modal sheet in the app and don't have to create or define it in multiple places. Another is that you don't have to write boilerplate for every component. Everything just works.
|
|
17
|
+
|
|
18
|
+
```tsx
|
|
19
|
+
import { BottomSheet } from '@niibase/bottom-sheet-manager';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
Create your BottomSheet component and export it.
|
|
23
|
+
|
|
24
|
+
```tsx
|
|
25
|
+
function ExampleSheet({ id }: SheetProps<"example">) {
|
|
26
|
+
return (
|
|
27
|
+
<BottomSheet id={id}>
|
|
28
|
+
<View>
|
|
29
|
+
<Text>Hello World</Text>
|
|
30
|
+
</View>
|
|
31
|
+
</BottomSheet>
|
|
32
|
+
);
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
export default ExampleSheet;
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
Create a `sheets.ts` file and import your sheet then register it.
|
|
39
|
+
|
|
40
|
+
```ts
|
|
41
|
+
import {registerSheet} from '@niibase/bottom-sheet-manager';
|
|
42
|
+
import ExampleSheet from 'example-sheet';
|
|
43
|
+
|
|
44
|
+
registerSheet('example-sheet', ExampleSheet);
|
|
45
|
+
|
|
46
|
+
// We extend some of the types here to give us great intellisense
|
|
47
|
+
// across the app for all registered sheets.
|
|
48
|
+
declare module '@niibase/bottom-sheet-manager' {
|
|
49
|
+
interface Sheets {
|
|
50
|
+
'example-sheet': SheetDefinition;
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
export {};
|
|
55
|
+
```
|
|
56
|
+
|
|
57
|
+
In `App.js` import `sheets.ts` and wrap your app in `SheetProvider`.
|
|
58
|
+
|
|
59
|
+
```tsx
|
|
60
|
+
import { SheetProvider } from '@niibase/bottom-sheet-manager';
|
|
61
|
+
import 'sheets.tsx';
|
|
62
|
+
|
|
63
|
+
function App() {
|
|
64
|
+
return (
|
|
65
|
+
<SheetProvider>
|
|
66
|
+
{
|
|
67
|
+
// your app components
|
|
68
|
+
}
|
|
69
|
+
</SheetProvider>
|
|
70
|
+
);
|
|
71
|
+
}
|
|
72
|
+
```
|
|
73
|
+
|
|
74
|
+
Open the modal sheet from anywhere in the app.
|
|
75
|
+
|
|
76
|
+
```jsx
|
|
77
|
+
SheetManager.show('example-sheet');
|
|
78
|
+
```
|
|
79
|
+
|
|
80
|
+
Hide the modal sheet
|
|
81
|
+
|
|
82
|
+
```jsx
|
|
83
|
+
SheetManager.hide('example-sheet');
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
### As a React Navigation Screen
|
|
87
|
+
|
|
88
|
+
Support for React Navigation v6 and v7 is available including expo router support.
|
|
89
|
+
|
|
90
|
+
```tsx
|
|
91
|
+
import {
|
|
92
|
+
createBottomSheetNavigator,
|
|
93
|
+
BottomSheetNavigationOptions,
|
|
94
|
+
BottomSheetNavigationEventMap,
|
|
95
|
+
BottomSheetNavigationState,
|
|
96
|
+
} from "@repo/bottom-sheet";
|
|
97
|
+
import { Slot, withLayoutContext } from "expo-router";
|
|
98
|
+
|
|
99
|
+
const { Navigator } = createBottomSheetNavigator();
|
|
100
|
+
const BottomSheet = withLayoutContext<
|
|
101
|
+
BottomSheetNavigationOptions,
|
|
102
|
+
typeof Navigator,
|
|
103
|
+
BottomSheetNavigationState<any>,
|
|
104
|
+
BottomSheetNavigationEventMap
|
|
105
|
+
>(Navigator);
|
|
106
|
+
|
|
107
|
+
export const unstable_settings = {
|
|
108
|
+
initialRouteName: "index",
|
|
109
|
+
};
|
|
110
|
+
|
|
111
|
+
export default function Layout() {
|
|
112
|
+
if (typeof window === "undefined") return <Slot />;
|
|
113
|
+
return (
|
|
114
|
+
<BottomSheet
|
|
115
|
+
screenOptions={
|
|
116
|
+
{
|
|
117
|
+
// API Reference: `@niibase/bottom-sheet-manager/router/types.ts`
|
|
118
|
+
// And: https://gorhom.github.io/react-native-bottom-sheet/modal/props/
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
/>
|
|
122
|
+
);
|
|
123
|
+
}
|
|
124
|
+
```
|
|
125
|
+
|
|
126
|
+
## Examples
|
|
127
|
+
|
|
128
|
+
The source code for the example (showcase) app is under the [/example](/example/) directory.
|
|
129
|
+
|
|
130
|
+
## Contributing
|
|
131
|
+
|
|
132
|
+
Contributions are welcome! Please feel free to submit a Pull Request.
|
|
133
|
+
|
|
134
|
+
## License
|
|
135
|
+
|
|
136
|
+
[MIT](./LICENSE)
|
|
137
|
+
|
|
138
|
+
---
|
|
139
|
+
|
|
140
|
+
<div align="center">
|
|
141
|
+
|
|
142
|
+
**Built with ❤️ by [@divineniiquaye](https://github.com/divineniiquaye) using React Native and [@gorhom/bottom-sheet](https://github.com/gorhom/react-native-bottom-sheet).**
|
|
143
|
+
|
|
144
|
+
[⬆ Back to Top](#-installation)
|
|
145
|
+
|
|
146
|
+
</div>
|
|
147
|
+
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.eventManager = exports.default = void 0;
|
|
7
|
+
var _reactNative = require("react-native");
|
|
8
|
+
/* eslint-disable curly */
|
|
9
|
+
|
|
10
|
+
class EventManager {
|
|
11
|
+
constructor() {
|
|
12
|
+
this._registry = _reactNative.Platform.select({
|
|
13
|
+
ios: _reactNative.NativeAppEventEmitter,
|
|
14
|
+
android: _reactNative.DeviceEventEmitter
|
|
15
|
+
});
|
|
16
|
+
}
|
|
17
|
+
subscribe(name, handler) {
|
|
18
|
+
if (!name || !handler) throw new Error("name and handler are required.");
|
|
19
|
+
const event = this._registry?.addListener(name, handler);
|
|
20
|
+
return {
|
|
21
|
+
unsubscribe: () => event?.remove()
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
publish(name, ...args) {
|
|
25
|
+
this._registry?.emit(name, ...args);
|
|
26
|
+
}
|
|
27
|
+
remove(...names) {
|
|
28
|
+
for (const eventType of names) {
|
|
29
|
+
this._registry?.removeAllListeners(eventType);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
exports.default = EventManager;
|
|
34
|
+
const eventManager = exports.eventManager = new EventManager();
|
|
35
|
+
//# sourceMappingURL=events.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_reactNative","require","EventManager","constructor","_registry","Platform","select","ios","NativeAppEventEmitter","android","DeviceEventEmitter","subscribe","name","handler","Error","event","addListener","unsubscribe","remove","publish","args","emit","names","eventType","removeAllListeners","exports","default","eventManager"],"sourceRoot":"../../src","sources":["events.ts"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AAOA;;AAMe,MAAMC,YAAY,CAAC;EAE9BC,WAAWA,CAAA,EAAG;IACV,IAAI,CAACC,SAAS,GAAGC,qBAAQ,CAACC,MAAM,CAAC;MAC7BC,GAAG,EAAEC,kCAAqB;MAC1BC,OAAO,EAAEC;IACb,CAAC,CAAC;EACN;EAEAC,SAASA,CAACC,IAAY,EAAEC,OAAqB,EAAE;IAC3C,IAAI,CAACD,IAAI,IAAI,CAACC,OAAO,EAAE,MAAM,IAAIC,KAAK,CAAC,gCAAgC,CAAC;IACxE,MAAMC,KAAK,GAAG,IAAI,CAACX,SAAS,EAAEY,WAAW,CAACJ,IAAI,EAAEC,OAAO,CAAC;IACxD,OAAO;MAAEI,WAAW,EAAEA,CAAA,KAAMF,KAAK,EAAEG,MAAM,CAAC;IAAE,CAAC;EACjD;EAEAC,OAAOA,CAACP,IAAY,EAAE,GAAGQ,IAAW,EAAE;IAClC,IAAI,CAAChB,SAAS,EAAEiB,IAAI,CAACT,IAAI,EAAE,GAAGQ,IAAI,CAAC;EACvC;EAEAF,MAAMA,CAAC,GAAGI,KAAe,EAAE;IACvB,KAAK,MAAMC,SAAS,IAAID,KAAK,EAAE;MAC3B,IAAI,CAAClB,SAAS,EAAEoB,kBAAkB,CAACD,SAAS,CAAC;IACjD;EACJ;AACJ;AAACE,OAAA,CAAAC,OAAA,GAAAxB,YAAA;AAEM,MAAMyB,YAAY,GAAAF,OAAA,CAAAE,YAAA,GAAG,IAAIzB,YAAY,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
var _exportNames = {
|
|
7
|
+
BottomSheet: true,
|
|
8
|
+
SheetManager: true,
|
|
9
|
+
SheetProvider: true,
|
|
10
|
+
useSheetPayload: true,
|
|
11
|
+
useSheetRef: true,
|
|
12
|
+
useOnSheet: true,
|
|
13
|
+
registerSheet: true
|
|
14
|
+
};
|
|
15
|
+
Object.defineProperty(exports, "BottomSheet", {
|
|
16
|
+
enumerable: true,
|
|
17
|
+
get: function () {
|
|
18
|
+
return _sheet.default;
|
|
19
|
+
}
|
|
20
|
+
});
|
|
21
|
+
Object.defineProperty(exports, "SheetManager", {
|
|
22
|
+
enumerable: true,
|
|
23
|
+
get: function () {
|
|
24
|
+
return _manager.SheetManager;
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
Object.defineProperty(exports, "SheetProvider", {
|
|
28
|
+
enumerable: true,
|
|
29
|
+
get: function () {
|
|
30
|
+
return _provider.SheetProvider;
|
|
31
|
+
}
|
|
32
|
+
});
|
|
33
|
+
Object.defineProperty(exports, "registerSheet", {
|
|
34
|
+
enumerable: true,
|
|
35
|
+
get: function () {
|
|
36
|
+
return _provider.registerSheet;
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
Object.defineProperty(exports, "useOnSheet", {
|
|
40
|
+
enumerable: true,
|
|
41
|
+
get: function () {
|
|
42
|
+
return _provider.useOnSheet;
|
|
43
|
+
}
|
|
44
|
+
});
|
|
45
|
+
Object.defineProperty(exports, "useSheetPayload", {
|
|
46
|
+
enumerable: true,
|
|
47
|
+
get: function () {
|
|
48
|
+
return _provider.useSheetPayload;
|
|
49
|
+
}
|
|
50
|
+
});
|
|
51
|
+
Object.defineProperty(exports, "useSheetRef", {
|
|
52
|
+
enumerable: true,
|
|
53
|
+
get: function () {
|
|
54
|
+
return _provider.useSheetRef;
|
|
55
|
+
}
|
|
56
|
+
});
|
|
57
|
+
var _sheet = _interopRequireDefault(require("./sheet"));
|
|
58
|
+
var _manager = require("./manager");
|
|
59
|
+
var _router = require("./router");
|
|
60
|
+
Object.keys(_router).forEach(function (key) {
|
|
61
|
+
if (key === "default" || key === "__esModule") return;
|
|
62
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
63
|
+
if (key in exports && exports[key] === _router[key]) return;
|
|
64
|
+
Object.defineProperty(exports, key, {
|
|
65
|
+
enumerable: true,
|
|
66
|
+
get: function () {
|
|
67
|
+
return _router[key];
|
|
68
|
+
}
|
|
69
|
+
});
|
|
70
|
+
});
|
|
71
|
+
var _types = require("./types");
|
|
72
|
+
Object.keys(_types).forEach(function (key) {
|
|
73
|
+
if (key === "default" || key === "__esModule") return;
|
|
74
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
75
|
+
if (key in exports && exports[key] === _types[key]) return;
|
|
76
|
+
Object.defineProperty(exports, key, {
|
|
77
|
+
enumerable: true,
|
|
78
|
+
get: function () {
|
|
79
|
+
return _types[key];
|
|
80
|
+
}
|
|
81
|
+
});
|
|
82
|
+
});
|
|
83
|
+
var _provider = require("./provider");
|
|
84
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
85
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_sheet","_interopRequireDefault","require","_manager","_router","Object","keys","forEach","key","prototype","hasOwnProperty","call","_exportNames","exports","defineProperty","enumerable","get","_types","_provider","e","__esModule","default"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AAAAG,MAAA,CAAAC,IAAA,CAAAF,OAAA,EAAAG,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAJ,OAAA,CAAAI,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAZ,OAAA,CAAAI,GAAA;IAAA;EAAA;AAAA;AACA,IAAAS,MAAA,GAAAf,OAAA;AAAAG,MAAA,CAAAC,IAAA,CAAAW,MAAA,EAAAV,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAS,MAAA,CAAAT,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAC,MAAA,CAAAT,GAAA;IAAA;EAAA;AAAA;AACA,IAAAU,SAAA,GAAAhB,OAAA;AAMoB,SAAAD,uBAAAkB,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA","ignoreList":[]}
|
|
@@ -0,0 +1,171 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.SheetManager = exports.PrivateManager = void 0;
|
|
7
|
+
var _events = require("./events");
|
|
8
|
+
var _provider = require("./provider");
|
|
9
|
+
// Array of all the ids of Sheets currently rendered in the app.
|
|
10
|
+
const ids = [];
|
|
11
|
+
const keys = [];
|
|
12
|
+
const refs = {};
|
|
13
|
+
const DEFAULT_Z_INDEX = 999;
|
|
14
|
+
const makeKey = (id, context) => `${id}:${context}`;
|
|
15
|
+
const PrivateManager = exports.PrivateManager = {
|
|
16
|
+
// Return to the previous sheet when the current sheet is closed.
|
|
17
|
+
history: [],
|
|
18
|
+
context(options) {
|
|
19
|
+
if (!options) options = {};
|
|
20
|
+
if (!options?.context) {
|
|
21
|
+
// If no context is provided, use to current top most context
|
|
22
|
+
// to render the sheet.
|
|
23
|
+
for (const context of _provider.providerRegistryStack.slice().reverse()) {
|
|
24
|
+
// We only automatically select nested sheet providers.
|
|
25
|
+
if (context.startsWith("$$-auto") && !context.includes(options?.id)) {
|
|
26
|
+
options.context = context;
|
|
27
|
+
break;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
return options.context;
|
|
32
|
+
},
|
|
33
|
+
registerRef: (id, context, instance) => {
|
|
34
|
+
const key = makeKey(id, context);
|
|
35
|
+
refs[key] = instance;
|
|
36
|
+
keys.push(key);
|
|
37
|
+
},
|
|
38
|
+
/**
|
|
39
|
+
*
|
|
40
|
+
* Get internal ref of a sheet by the given id.
|
|
41
|
+
*
|
|
42
|
+
* @param id Id of the sheet
|
|
43
|
+
* @param context Context in which the sheet is rendered. Normally this function returns the top most rendered sheet ref automatically.
|
|
44
|
+
*/
|
|
45
|
+
get: (id, context) => {
|
|
46
|
+
if (!context) {
|
|
47
|
+
for (let ctx of _provider.providerRegistryStack.slice().reverse()) {
|
|
48
|
+
for (let _id in _provider.sheetsRegistry[ctx]) {
|
|
49
|
+
if (_id === id) {
|
|
50
|
+
context = ctx;
|
|
51
|
+
break;
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
return refs[makeKey(id, context)];
|
|
57
|
+
},
|
|
58
|
+
add: (id, context) => {
|
|
59
|
+
if (ids.indexOf(id) < 0) {
|
|
60
|
+
ids[ids.length] = makeKey(id, context);
|
|
61
|
+
}
|
|
62
|
+
},
|
|
63
|
+
remove: (id, context) => {
|
|
64
|
+
if (ids.indexOf(makeKey(id, context)) > -1) {
|
|
65
|
+
ids.splice(ids.indexOf(makeKey(id, context)));
|
|
66
|
+
}
|
|
67
|
+
},
|
|
68
|
+
zIndex: (id, context = "global") => {
|
|
69
|
+
const index = keys.indexOf(makeKey(id, context));
|
|
70
|
+
return index > -1 ? DEFAULT_Z_INDEX + index + 1 : DEFAULT_Z_INDEX;
|
|
71
|
+
},
|
|
72
|
+
stack: () => ids.map(id => {
|
|
73
|
+
return {
|
|
74
|
+
id: id.split(":")[0],
|
|
75
|
+
context: id.split(":")?.[1] || "global"
|
|
76
|
+
};
|
|
77
|
+
})
|
|
78
|
+
};
|
|
79
|
+
class _SheetManager {
|
|
80
|
+
/**
|
|
81
|
+
* Show the Modal Sheet with an id.
|
|
82
|
+
*
|
|
83
|
+
* @param id id of the Sheet to show
|
|
84
|
+
* @param options
|
|
85
|
+
*/
|
|
86
|
+
async show(id, options) {
|
|
87
|
+
return new Promise(resolve => {
|
|
88
|
+
const currentContext = PrivateManager.context({
|
|
89
|
+
...options,
|
|
90
|
+
id: id
|
|
91
|
+
});
|
|
92
|
+
const handler = (data, context = "global") => {
|
|
93
|
+
if (context !== "global" && currentContext && currentContext !== context) return;
|
|
94
|
+
options?.onClose?.(data);
|
|
95
|
+
sub?.unsubscribe();
|
|
96
|
+
resolve(data);
|
|
97
|
+
};
|
|
98
|
+
var sub = _events.eventManager.subscribe(`onclose_${id}`, handler);
|
|
99
|
+
PrivateManager.stack().forEach(({
|
|
100
|
+
id,
|
|
101
|
+
context
|
|
102
|
+
}) => {
|
|
103
|
+
_events.eventManager.publish(`hide_${id}`, undefined, context, true);
|
|
104
|
+
});
|
|
105
|
+
|
|
106
|
+
// Check if the sheet is registered with any `SheetProviders`.
|
|
107
|
+
let isRegisteredWithSheetProvider = false;
|
|
108
|
+
for (let ctx in _provider.sheetsRegistry) {
|
|
109
|
+
for (let _id in _provider.sheetsRegistry[ctx]) {
|
|
110
|
+
if (_id === id) {
|
|
111
|
+
isRegisteredWithSheetProvider = true;
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
_events.eventManager.publish(isRegisteredWithSheetProvider ? `show_wrap_${id}` : `show_${id}`, options?.payload, currentContext || "global");
|
|
116
|
+
});
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
/**
|
|
120
|
+
* An async hide function. This is useful when you want to show one Sheet after closing another.
|
|
121
|
+
*
|
|
122
|
+
* @param id id of the Sheet to show
|
|
123
|
+
* @param data
|
|
124
|
+
*/
|
|
125
|
+
async hide(id, options) {
|
|
126
|
+
let currentContext = PrivateManager.context({
|
|
127
|
+
...options,
|
|
128
|
+
id: id
|
|
129
|
+
});
|
|
130
|
+
return new Promise(resolve => {
|
|
131
|
+
let isRegisteredWithSheetProvider = false;
|
|
132
|
+
// Check if the sheet is registered with any `SheetProviders`
|
|
133
|
+
// and select the nearest context where sheet is registered.
|
|
134
|
+
|
|
135
|
+
for (const _id of ids) {
|
|
136
|
+
if (_id === `${id}:${currentContext}`) {
|
|
137
|
+
isRegisteredWithSheetProvider = true;
|
|
138
|
+
break;
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
const hideHandler = (data, context = "global") => {
|
|
142
|
+
if (context !== "global" && currentContext && currentContext !== context) return;
|
|
143
|
+
sub?.unsubscribe();
|
|
144
|
+
resolve(data);
|
|
145
|
+
};
|
|
146
|
+
var sub = _events.eventManager.subscribe(`onclose_${id}`, hideHandler);
|
|
147
|
+
_events.eventManager.publish(isRegisteredWithSheetProvider ? `hide_wrap_${id}` : `hide_${id}`, options?.payload, !isRegisteredWithSheetProvider ? "global" : currentContext);
|
|
148
|
+
});
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
/**
|
|
152
|
+
* Hide all the opened Sheets.
|
|
153
|
+
*
|
|
154
|
+
* @param id Hide all sheets for the specific id.
|
|
155
|
+
*/
|
|
156
|
+
hideAll(id) {
|
|
157
|
+
PrivateManager.stack().forEach(({
|
|
158
|
+
id: _id,
|
|
159
|
+
context
|
|
160
|
+
}) => {
|
|
161
|
+
if (id && !_id.startsWith(id)) return;
|
|
162
|
+
_events.eventManager.publish(`hide_${_id}`, undefined, context);
|
|
163
|
+
});
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
/**
|
|
168
|
+
* SheetManager is used to imperatively show/hide any sheet with a unique id prop.
|
|
169
|
+
*/
|
|
170
|
+
const SheetManager = exports.SheetManager = new _SheetManager();
|
|
171
|
+
//# sourceMappingURL=manager.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_events","require","_provider","ids","keys","refs","DEFAULT_Z_INDEX","makeKey","id","context","PrivateManager","exports","history","options","providerRegistryStack","slice","reverse","startsWith","includes","registerRef","instance","key","push","get","ctx","_id","sheetsRegistry","add","indexOf","length","remove","splice","zIndex","index","stack","map","split","_SheetManager","show","Promise","resolve","currentContext","handler","data","onClose","sub","unsubscribe","eventManager","subscribe","forEach","publish","undefined","isRegisteredWithSheetProvider","payload","hide","hideHandler","hideAll","SheetManager"],"sourceRoot":"../../src","sources":["manager.ts"],"mappings":"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","ignoreList":[]}
|