@thecb/components 7.0.0-beta.1 → 7.0.0-beta.10

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.
Files changed (6) hide show
  1. package/dist/index.cjs.js +8 -10
  2. package/dist/index.cjs.js.map +1 -1
  3. package/dist/index.esm.js +8 -10
  4. package/dist/index.esm.js.map +1 -1
  5. package/package.json +1 -1
  6. package/src/components/molecules/modal/Modal.js +8 -8
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@thecb/components",
3
- "version": "7.0.0-beta.1",
3
+ "version": "7.0.0-beta.10",
4
4
  "description": "Common lib for CityBase react components",
5
5
  "main": "dist/index.cjs.js",
6
6
  "typings": "dist/index.d.ts",
package/src/components/molecules/modal/Modal.js CHANGED
@@ -47,14 +47,16 @@ const Modal = ({
47
47
  children
48
48
  }) => {
49
49
  const { isMobile } = useContext(ThemeContext);
50
- const closeBtnRef = useRef(null);
51
- const modalBodyTextRef = useRef(null);
50
+ const modalContainerRef = useRef(null);
52
51
  return (
53
- <Fragment>
52
+ <div ref={modalContainerRef}>
54
53
  {modalOpen && (
55
54
  <AriaModal
56
- initialFocus={closeBtnRef || modalBodyTextRef}
57
- focusTrapOptions={{ delayInitialFocus: false, fallbackFocus: closeBtnRef || modalBodyTextRef }} // fallback to resolve unit test errors https://github.com/focus-trap/focus-trap-react/issues/91
55
+ // fallback to resolve Jest unit test errors when tabbable doesn't exist in jsdom https://github.com/focus-trap/focus-trap-react/issues/91
56
+ focusTrapOptions={{
57
+ delayInitialFocus: true,
58
+ fallbackFocus: modalContainerRef?.current
59
+ }}
58
60
  onExit={onExit}
59
61
  getApplicationNode={getApplicationNode}
60
62
  titleText={modalHeaderText}
@@ -84,7 +86,6 @@ const Modal = ({
84
86
  <Box background={modalBodyBg} padding="1.5rem">
85
87
  <Stack childGap="1.5rem">
86
88
  <Box
87
- ref={modalBodyTextRef}
88
89
  borderWidthOverride={noBorder && "0 0 2px 0"}
89
90
  borderColor={!noBorder && SILVER_GREY}
90
91
  padding={!noBorder && "0 0 1.5rem 0"}
@@ -174,7 +175,6 @@ const Modal = ({
174
175
  ) : (
175
176
  <Box padding="0.5rem">
176
177
  <ButtonWithAction
177
- ref={closeBtnRef}
178
178
  action={hideModal}
179
179
  variant="primary"
180
180
  text={closeButtonText}
@@ -194,7 +194,7 @@ const Modal = ({
194
194
  </AriaModal>
195
195
  )}
196
196
  {children}
197
- </Fragment>
197
+ </div>
198
198
  );
199
199
  };
200
200