web-window-manager 1.0.9 → 1.0.11
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/README.md +20 -20
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -4,23 +4,24 @@
|
|
|
4
4
|
|
|
5
5
|
THIS PACKAGE IS NOT READY FOR USE IN YOUR PROJECTS
|
|
6
6
|
|
|
7
|
-
|
|
8
7
|
<!-- TODO SECTION _____________________________ -->
|
|
9
8
|
|
|
10
9
|
# TODO
|
|
11
10
|
|
|
12
11
|
- [x] Add appropriate readme boilerplate
|
|
13
|
-
- [
|
|
12
|
+
- [x] Add complete readme details
|
|
14
13
|
- [ ] Add examples
|
|
15
14
|
- [ ] abstract cache manager to new npm package
|
|
16
15
|
|
|
17
|
-
|
|
18
16
|
<!-- MAIN SECTION INTRO _____________________________ -->
|
|
19
17
|
|
|
20
18
|
# Web-Window-Manager
|
|
21
19
|
|
|
22
|
-
|
|
20
|
+
<a href="https://www.loom.com/share/641344bac18a415f90c983d9a3c2352a">
|
|
21
|
+
<img style="max-width:300px;" src="https://cdn.loom.com/sessions/thumbnails/641344bac18a415f90c983d9a3c2352a-with-play.gif">
|
|
22
|
+
</a>
|
|
23
23
|
|
|
24
|
+
A Window Manger for managing the creation and deletion of windows/tabs within a web based application.
|
|
24
25
|
|
|
25
26
|
<!-- BADGES SECTION _____________________________ -->
|
|
26
27
|
|
|
@@ -105,48 +106,45 @@ After installing the package, you can import and use it in your project as shown
|
|
|
105
106
|
<!-- USAGE SECTION _____________________________ -->
|
|
106
107
|
|
|
107
108
|
## Usage
|
|
109
|
+
|
|
108
110
|
Import the Web-Window-Manager file into your entry file (e.g. app.tsx in a React project):
|
|
109
|
-
|
|
110
111
|
|
|
111
112
|
```typescript
|
|
112
|
-
import 'web-window-manager'
|
|
113
|
+
import 'web-window-manager'
|
|
113
114
|
```
|
|
114
115
|
|
|
115
116
|
Replace any window.open() calls in your code with window.windowManager.open():
|
|
117
|
+
|
|
116
118
|
```typescript
|
|
117
119
|
// Before
|
|
118
|
-
window.open('https://www.example.com', '_blank')
|
|
120
|
+
window.open('https://www.example.com', '_blank')
|
|
119
121
|
|
|
120
122
|
// After
|
|
121
|
-
window.
|
|
123
|
+
window.WindowManager.openWindow({ link: '/some-link', name: `some-name` })
|
|
122
124
|
```
|
|
123
125
|
|
|
124
126
|
This will use the Web-Window-Manager to open the new window/tab, allowing you to track and manage it within your application.
|
|
125
127
|
|
|
126
|
-
Add a simple React button with an onClick prop that calls window.windowManager.recursivelyCloseChildren() with a label of "Logout"
|
|
128
|
+
Add a simple React button with an `onClick` prop that calls `window.windowManager.recursivelyCloseChildren()` with a label of `"Logout"`:
|
|
127
129
|
|
|
128
130
|
```javascript
|
|
129
|
-
import 'web-window-manager'
|
|
130
|
-
|
|
131
|
-
// Initialize the window manager with a custom event
|
|
132
|
-
const windowManager = new WebWindowManager('custom-event');
|
|
131
|
+
import 'web-window-manager'
|
|
133
132
|
|
|
134
133
|
function App() {
|
|
135
134
|
return (
|
|
135
|
+
// NOTE: you must call it from an arrow function in this context because
|
|
136
|
+
// this function expects a number parameter or undefined
|
|
136
137
|
<button onClick={() => window.windowManager.recursivelyCloseChildren()}>
|
|
137
138
|
Logout
|
|
138
139
|
</button>
|
|
139
|
-
)
|
|
140
|
+
)
|
|
140
141
|
}
|
|
141
|
-
|
|
142
142
|
```
|
|
143
143
|
|
|
144
144
|
When the user clicks the "Logout" button, this will close all child windows/tabs that were opened by the current window/tab.
|
|
145
145
|
|
|
146
146
|
For more detailed usage instructions and examples, please see the `Web-Window-Manager` documentation [examples](https://github.com/Tarmstrong95/WindowManger/tree/main/src/examples).
|
|
147
147
|
|
|
148
|
-
|
|
149
|
-
|
|
150
148
|
_See the [open issues](https://github.com/Tarmstrong95/WebWindowManager/issues) for a full list of proposed features (and known issues)._
|
|
151
149
|
|
|
152
150
|
<hr/>
|
|
@@ -155,10 +153,12 @@ _See the [open issues](https://github.com/Tarmstrong95/WebWindowManager/issues)
|
|
|
155
153
|
|
|
156
154
|
## Roadmap
|
|
157
155
|
|
|
158
|
-
|
|
156
|
+
- The Web-Window-Manager package is still in development, and the following features are planned for future releases:
|
|
159
157
|
|
|
160
|
-
|
|
161
|
-
|
|
158
|
+
- Abstract the cache manager to a separate npm package
|
|
159
|
+
- Add more detailed examples
|
|
160
|
+
- usage instructions in the readme
|
|
161
|
+
- make window details customizable
|
|
162
162
|
|
|
163
163
|
<hr/>
|
|
164
164
|
|