@fullkekw/popup 2.0.4 → 2.0.6
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 +3 -2
- package/dist/Interfaces.d.ts +11 -2
- package/dist/index.es.js +339 -336
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +11 -11
- 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,7 @@ 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
|
|
64
65
|
|
|
65
66
|
## 👀 Examples
|
|
66
67
|
Synthetic state handle. Will be opened by default
|
|
@@ -90,7 +91,7 @@ const Page: FC = (props) => {
|
|
|
90
91
|
export default Page;
|
|
91
92
|
```
|
|
92
93
|
|
|
93
|
-
Disable exit on layer & escape
|
|
94
|
+
Disable exit on layer & escape, popup content will be rendered on demand
|
|
94
95
|
```tsx
|
|
95
96
|
import { FC } from 'react';
|
|
96
97
|
import { PopupLayer, PopupWindow, PopupButton} from '@fullkekw/popup'
|
|
@@ -101,7 +102,7 @@ const Page: FC = (props) => {
|
|
|
101
102
|
|
|
102
103
|
return <body>
|
|
103
104
|
<PopupLayer>
|
|
104
|
-
<PopupWindow id={popupId1} settings={{exitOnLayer: false, exitOnDocument: false}}>
|
|
105
|
+
<PopupWindow id={popupId1} settings={{exitOnLayer: false, exitOnDocument: false}} renderOnDemand>
|
|
105
106
|
Popup Content
|
|
106
107
|
|
|
107
108
|
<PopupButton popupId={popupId1}>
|
package/dist/Interfaces.d.ts
CHANGED
|
@@ -38,12 +38,19 @@ export interface PopupLayerProps {
|
|
|
38
38
|
children: ReactNode | ReactNode[];
|
|
39
39
|
className?: string;
|
|
40
40
|
settings?: PopupSettings;
|
|
41
|
+
style?: React.CSSProperties;
|
|
41
42
|
}
|
|
42
|
-
export interface PopupWindowProps
|
|
43
|
+
export interface PopupWindowProps {
|
|
43
44
|
id: string;
|
|
44
45
|
children?: ReactNode | ReactNode[];
|
|
46
|
+
className?: string;
|
|
47
|
+
style?: React.CSSProperties;
|
|
45
48
|
layerClassName?: string;
|
|
46
49
|
settings?: PopupSettings;
|
|
50
|
+
onOpen?(): void;
|
|
51
|
+
onExit?(): void;
|
|
52
|
+
/** Render popup in DOM only when user requested it */
|
|
53
|
+
renderOnDemand?: boolean;
|
|
47
54
|
/** Passed useState value */
|
|
48
55
|
isOpen?: boolean;
|
|
49
56
|
/** Passed useState setter */
|
|
@@ -55,8 +62,10 @@ export interface PopupWindowProps extends React.DetailsHTMLAttributes<HTMLDivEle
|
|
|
55
62
|
*/
|
|
56
63
|
animation?: PopupWindowAnimationType;
|
|
57
64
|
}
|
|
58
|
-
export interface PopupButtonProps
|
|
65
|
+
export interface PopupButtonProps {
|
|
59
66
|
popupId: string;
|
|
67
|
+
className?: string;
|
|
68
|
+
style?: React.CSSProperties;
|
|
60
69
|
children?: ReactNode | ReactNode[];
|
|
61
70
|
onClick?(e: React.MouseEvent): void;
|
|
62
71
|
disabled?: boolean;
|