@fullkekw/popup 2.0.5 → 2.0.7
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 +4 -2
- package/dist/Interfaces.d.ts +7 -4
- package/dist/index.es.js +338 -336
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +10 -10
- package/dist/index.umd.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -61,6 +61,8 @@ export default Page;
|
|
|
61
61
|
- Will always be on top of the stacking context
|
|
62
62
|
- Hightly customizable (you can even turn off scroll hide!)
|
|
63
63
|
- Does not break elements with sticky position on oveflow hide
|
|
64
|
+
- Render window content on demand
|
|
65
|
+
- onOpen & noExit hooks
|
|
64
66
|
|
|
65
67
|
## 👀 Examples
|
|
66
68
|
Synthetic state handle. Will be opened by default
|
|
@@ -90,7 +92,7 @@ const Page: FC = (props) => {
|
|
|
90
92
|
export default Page;
|
|
91
93
|
```
|
|
92
94
|
|
|
93
|
-
Disable exit on layer & escape
|
|
95
|
+
Disable exit on layer & escape, popup content will be rendered on demand
|
|
94
96
|
```tsx
|
|
95
97
|
import { FC } from 'react';
|
|
96
98
|
import { PopupLayer, PopupWindow, PopupButton} from '@fullkekw/popup'
|
|
@@ -101,7 +103,7 @@ const Page: FC = (props) => {
|
|
|
101
103
|
|
|
102
104
|
return <body>
|
|
103
105
|
<PopupLayer>
|
|
104
|
-
<PopupWindow id={popupId1} settings={{exitOnLayer: false, exitOnDocument: false}}>
|
|
106
|
+
<PopupWindow id={popupId1} settings={{exitOnLayer: false, exitOnDocument: false}} renderOnDemand>
|
|
105
107
|
Popup Content
|
|
106
108
|
|
|
107
109
|
<PopupButton popupId={popupId1}>
|
package/dist/Interfaces.d.ts
CHANGED
|
@@ -34,16 +34,19 @@ export interface PopupContextProps {
|
|
|
34
34
|
registerNode(node: PopupNode): void;
|
|
35
35
|
toggleDocument(id: string, e: React.MouseEvent): void;
|
|
36
36
|
}
|
|
37
|
-
export interface PopupLayerProps {
|
|
37
|
+
export interface PopupLayerProps extends React.HTMLAttributes<HTMLElement> {
|
|
38
38
|
children: ReactNode | ReactNode[];
|
|
39
|
-
className?: string;
|
|
40
39
|
settings?: PopupSettings;
|
|
41
40
|
}
|
|
42
|
-
export interface PopupWindowProps extends React.
|
|
41
|
+
export interface PopupWindowProps extends React.HTMLAttributes<HTMLElement> {
|
|
43
42
|
id: string;
|
|
44
43
|
children?: ReactNode | ReactNode[];
|
|
45
44
|
layerClassName?: string;
|
|
46
45
|
settings?: PopupSettings;
|
|
46
|
+
onOpen?(): void;
|
|
47
|
+
onExit?(): void;
|
|
48
|
+
/** Render popup in DOM only when user requested it */
|
|
49
|
+
renderOnDemand?: boolean;
|
|
47
50
|
/** Passed useState value */
|
|
48
51
|
isOpen?: boolean;
|
|
49
52
|
/** Passed useState setter */
|
|
@@ -55,7 +58,7 @@ export interface PopupWindowProps extends React.DetailsHTMLAttributes<HTMLDivEle
|
|
|
55
58
|
*/
|
|
56
59
|
animation?: PopupWindowAnimationType;
|
|
57
60
|
}
|
|
58
|
-
export interface PopupButtonProps extends React.
|
|
61
|
+
export interface PopupButtonProps extends React.HTMLAttributes<HTMLElement> {
|
|
59
62
|
popupId: string;
|
|
60
63
|
children?: ReactNode | ReactNode[];
|
|
61
64
|
onClick?(e: React.MouseEvent): void;
|