playroom 1.2.0 → 1.2.1
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/CHANGELOG.md +8 -0
- package/package.json +1 -1
- package/src/components/Playroom/Playroom.tsx +8 -15
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# playroom
|
|
2
2
|
|
|
3
|
+
## 1.2.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#481](https://github.com/seek-oss/playroom/pull/481) [`5ee8ccb`](https://github.com/seek-oss/playroom/commit/5ee8ccbb715e084d23ec440241b1affd06354ec7) Thanks [@michaeltaranto](https://github.com/michaeltaranto)! - Editor: Ensure interactivity after toggling visibility via menu
|
|
8
|
+
|
|
9
|
+
Fixes an issue where the editor would remain `inert` when hidden via the "Hide Code" button and then shown via the menu.
|
|
10
|
+
|
|
3
11
|
## 1.2.0
|
|
4
12
|
|
|
5
13
|
### Minor Changes
|
package/package.json
CHANGED
|
@@ -4,7 +4,7 @@ import { CodeXml, PanelBottomClose, PanelLeftClose } from 'lucide-react';
|
|
|
4
4
|
import {
|
|
5
5
|
type ComponentProps,
|
|
6
6
|
useContext,
|
|
7
|
-
|
|
7
|
+
useLayoutEffect,
|
|
8
8
|
useRef,
|
|
9
9
|
useState,
|
|
10
10
|
} from 'react';
|
|
@@ -53,7 +53,6 @@ export default () => {
|
|
|
53
53
|
] = useContext(StoreContext);
|
|
54
54
|
useDocumentTitle({ title });
|
|
55
55
|
|
|
56
|
-
const lastHidden = useRef(editorHidden);
|
|
57
56
|
const hideActionSource = useRef<'editor' | null>(null);
|
|
58
57
|
const editorRef = useRef<HTMLElement | null>(null);
|
|
59
58
|
const showCodeButtonRef = useRef<HTMLButtonElement | null>(null);
|
|
@@ -65,25 +64,19 @@ export default () => {
|
|
|
65
64
|
const editorVisible = panelsVisible && !editorHidden;
|
|
66
65
|
const hasNoStoredPlayrooms = Object.entries(storedPlayrooms).length === 0;
|
|
67
66
|
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
) {
|
|
73
|
-
if (
|
|
74
|
-
// Remove in favour of direct DOM attribute when we drop React 18 support
|
|
75
|
-
editorRef.current?.setAttribute('inert', '');
|
|
67
|
+
useLayoutEffect(() => {
|
|
68
|
+
// Remove in favour of direct DOM attribute when we drop React 18 support
|
|
69
|
+
editorRef.current?.toggleAttribute('inert', !editorVisible);
|
|
70
|
+
|
|
71
|
+
if (hideActionSource.current === 'editor') {
|
|
72
|
+
if (!editorVisible) {
|
|
76
73
|
showCodeButtonRef.current?.focus();
|
|
77
74
|
} else {
|
|
78
|
-
// Remove in favour of direct DOM attribute when we drop React 18 support
|
|
79
|
-
editorRef.current?.removeAttribute('inert');
|
|
80
75
|
hideCodeButtonRef.current?.focus();
|
|
81
76
|
}
|
|
82
|
-
|
|
83
77
|
hideActionSource.current = null;
|
|
84
78
|
}
|
|
85
|
-
|
|
86
|
-
}, [editorHidden]);
|
|
79
|
+
}, [editorVisible]);
|
|
87
80
|
|
|
88
81
|
return (
|
|
89
82
|
<Box
|