@connectid-tools/idp-selector-react 6.10.0-alpha.9 → 6.10.0

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 (9) hide show
  1. package/CidButton.css +5 -0
  2. package/CidButton.js +10 -11
  3. package/IdpLogoList.css +7 -37
  4. package/IdpLogoList.js +5 -9
  5. package/Popup.js +1 -1
  6. package/Process.css +5 -2
  7. package/Process.js +1 -1
  8. package/README.md +32 -1
  9. package/package.json +3 -3
package/CidButton.css CHANGED
@@ -14,6 +14,11 @@
14
14
  background-color: #262626;
15
15
  color: white;
16
16
  }
17
+ .cid-idp-selector-button:focus-visible {
18
+ outline: 3px solid #1a73e8;
19
+ box-shadow: 0 0 0 6px white;
20
+ outline-offset: 0.2rem;
21
+ }
17
22
  /* so we do not break current cid buttons */
18
23
  .cid-idp-selector-button--type {
19
24
  width: 100%;
package/CidButton.js CHANGED
@@ -44,6 +44,7 @@ forceBrowser = undefined, // only for testing purposes
44
44
  }));
45
45
  const [showPopup, setShowPopup] = useState(false);
46
46
  const [isIncognito, setIsIncognito] = useState();
47
+ const [authorisationServersThatDisplayedCompatibilityPopup, setAuthorisationServersThatDisplayedCompatibilityPopup] = useState([]);
47
48
  const analyticsData = {
48
49
  claims,
49
50
  rpLogoUrl,
@@ -125,11 +126,11 @@ forceBrowser = undefined, // only for testing purposes
125
126
  return;
126
127
  track();
127
128
  }, []);
128
- const getCompatibilityConfirmText = (compatibilityWarnings) => {
129
+ const getCompatibilityPopupText = (compatibilityWarnings) => {
129
130
  if (compatibilityWarnings.mobileOs === 'android' && compatibilityWarnings.browser === 'samsung') {
130
- return 'It looks like you are using Samsung Browser. This generally will not work - we suggest using Chrome and trying again.\nClick on "Cancel" to abort or "OK" to proceed.';
131
+ return "We couldn't open your identity provider's app. Samsung Internet doesn't support this step. To continue verifying your identity, please switch to a different browser.";
131
132
  }
132
- return 'It looks like you are in incognito mode. This generally will not work - we suggest switching out of incognito mode and trying again.\nClick on "Cancel" to abort or "OK" to proceed.';
133
+ return "Looks like you're in incognito mode.\nWe can't complete verification using this identity provider while private browsing is on. To continue, please open a regular browser window and try again.";
133
134
  };
134
135
  const handleOnProceed = (authorisationServerId, authorisationServerName, authorisationServerCertifications) => {
135
136
  if (typeof analytics !== 'undefined') {
@@ -147,14 +148,12 @@ forceBrowser = undefined, // only for testing purposes
147
148
  isIos: forceIos || isIos(),
148
149
  browser: forceBrowser || getBrowserName(),
149
150
  });
150
- if (showCompatibilityWarnings && compatibility.mightFail) {
151
- const confirmText = getCompatibilityConfirmText(compatibility);
152
- if (confirm(confirmText)) {
153
- onProceed(authorisationServerId, compatibility);
154
- }
155
- else {
156
- setShowPopup(true);
157
- }
151
+ const authorisationServerHasNotDisplayedCompatibilityPopup = authorisationServersThatDisplayedCompatibilityPopup.find(authServerId => authServerId === authorisationServerId) === undefined;
152
+ if (showCompatibilityWarnings && compatibility.mightFail && authorisationServerHasNotDisplayedCompatibilityPopup) {
153
+ const popupText = getCompatibilityPopupText(compatibility);
154
+ alert(popupText);
155
+ setShowPopup(true);
156
+ setAuthorisationServersThatDisplayedCompatibilityPopup([...authorisationServersThatDisplayedCompatibilityPopup, authorisationServerId]);
158
157
  return;
159
158
  }
160
159
  onProceed(authorisationServerId, compatibility);
package/IdpLogoList.css CHANGED
@@ -2,52 +2,22 @@
2
2
  display: flex;
3
3
  align-items: center;
4
4
  justify-content: center;
5
- flex-wrap: wrap;
6
5
  gap: 8px;
7
- margin-top: 6px;
8
- margin-bottom: 12px;
6
+ margin-top: 10px;
7
+ margin-bottom: 16px;
9
8
  }
10
- .cid-idp-selector-idp-logo-list-title {
11
- font-size: 12px;
12
- color: var(--charcoal75);
9
+ .cid-idp-selector-idp-logo-list-label {
10
+ font-size: 13px;
11
+ color: var(--charcoal);
13
12
  }
14
- .cid-idp-selector-idp-logo-list-title.cid-idp-selector-idp-logo-list-title--light {
13
+ .cid-idp-selector-idp-logo-list-label--dark {
15
14
  color: white;
16
15
  }
17
- .cid-idp-selector-idp-logo-list {
18
- display: flex;
19
- flex-wrap: wrap;
20
- gap: 8px;
21
- }
22
16
  .cid-idp-selector-idp-logo-list-logo {
23
- width: 24px;
24
- height: 24px;
25
- border-radius: 2px;
17
+ height: 30px;
26
18
  }
27
19
  .cid-idp-selector-idp-logo-list-skeleton-wrapper {
28
20
  margin-top: 20px;
29
21
  display: flex;
30
22
  justify-content: center;
31
23
  }
32
- .cid-logo-lockup {
33
- width: 264px;
34
- height: 53.18px;
35
- }
36
- @media (max-width: 1440px) {
37
- .cid-logo-lockup {
38
- width: 234px;
39
- height: 47px;
40
- }
41
- }
42
- @media (max-width: 430px) {
43
- .cid-logo-lockup {
44
- width: 233.78px;
45
- height: 45px;
46
- }
47
- }
48
- @media (max-width: 375px) {
49
- .cid-logo-lockup {
50
- width: 213px;
51
- height: 41px;
52
- }
53
- }
package/IdpLogoList.js CHANGED
@@ -1,16 +1,12 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import './IdpLogoList.css';
3
3
  import { Skeleton } from './Skeleton';
4
- const logoLockupUrl = {
5
- dark: 'https://cdn.connectid.com.au/images/idp-selector/logo-lockup/logo-lockup-dark.svg',
6
- light: 'https://cdn.connectid.com.au/images/idp-selector/logo-lockup/logo-lockup-light.svg',
7
- };
8
4
  export const IdpLogoList = ({ loading, logoLockupStyle }) => {
9
5
  if (loading) {
10
- return (_jsx("div", { className: "cid-idp-selector-idp-logo-list-skeleton-wrapper", children: _jsx(Skeleton, { height: "24px", width: "120px", dataTestId: "idp-logo-list-loading" }) }));
6
+ return (_jsx("div", { className: "cid-idp-selector-idp-logo-list-skeleton-wrapper", children: _jsx(Skeleton, { height: "25px", width: "203px", dataTestId: "idp-logo-list-loading" }) }));
11
7
  }
12
8
  const isDarkMode = logoLockupStyle === 'dark';
13
- const imgSrc = isDarkMode ? logoLockupUrl.dark : logoLockupUrl.light;
14
- const dataTestId = isDarkMode ? 'logo-lockup-dark' : 'logo-lockup-light';
15
- return (_jsx("div", { className: "cid-idp-selector-idp-logo-list-wrapper", "data-testid": "idp-logo-list-wrapper", children: _jsx("img", { "data-testid": dataTestId, className: "cid-logo-lockup", src: imgSrc, alt: "Available on: CommBank, NAB, ANZ Plus and Westpac" }) }));
9
+ const imgSrc = `https://cdn.connectid.com.au/images/idp-selector/logo-lockup/logo-lockup-${isDarkMode ? 'dark' : 'light'}2.svg`;
10
+ const dataTestId = `idp-logo-lockup-${isDarkMode ? 'dark' : 'light'}`;
11
+ return (_jsxs("div", { className: "cid-idp-selector-idp-logo-list-wrapper", "data-testid": "idp-logo-list-wrapper", children: [_jsx("span", { className: `cid-idp-selector-idp-logo-list-label ${isDarkMode ? 'cid-idp-selector-idp-logo-list-label--dark' : ''}`, "data-testid": "idp-logo-list-label", children: "Available on" }), _jsx("img", { "data-testid": dataTestId, className: "cid-idp-selector-idp-logo-list-logo", src: imgSrc, alt: "CommBank, NAB, ANZ Plus and Westpac" })] }));
16
12
  };
package/Popup.js CHANGED
@@ -145,7 +145,7 @@ export const Popup = ({ onProceed, onCancel, onError, claims, requiredClaims, sh
145
145
  });
146
146
  const missingAuthorisationServerWithProfileRedirectFapi2 = authorisationServerWithProfileRedirectFapi2.length !== filteredAuthorisationServers.length;
147
147
  const hasManualIdp = enableManualVerification && !!manualAuthorisationServer;
148
- return (_jsxs(_Fragment, { children: [filteredAuthorisationServers.length > 0 ? (_jsxs("div", { className: "cid-idp-selector-popup-provider-wrapper", children: [_jsx("h3", { className: "cid-idp-selector-popup-subtitle", children: "Choose a provider" }), _jsx("ul", { className: "cid-idp-selector-popup-participants", "data-testid": "participants", children: filteredAuthorisationServers.map(({ AuthorisationServerId, CustomerFriendlyName, CustomerFriendlyLogoUri, AuthorisationServerCertifications }) => (_jsxs("li", { "data-testid": "participant", className: "cid-idp-selector-popup-participant", tabIndex: 0, onClick: () => onProceed(AuthorisationServerId, CustomerFriendlyName, AuthorisationServerCertifications), children: [_jsx("img", { className: "cid-idp-selector-popup-participant-icon", src: CustomerFriendlyLogoUri, alt: "" }), _jsx("div", { className: "cid-idp-selector-popup-participant-name", title: CustomerFriendlyName, "data-testid": "participant-name", children: CustomerFriendlyName })] }, AuthorisationServerId))) }), missingAuthorisationServerWithProfileRedirectFapi2 && (_jsxs("div", { className: "cid-idp-selector-popup-missing", "data-testid": "missing-auth-server", children: [_jsx("h4", { className: "cid-idp-selector-popup-missing-title", children: "Can't find your provider?" }), _jsx("p", { className: "cid-idp-selector-popup-missing-text", children: "Not all of our identity providers are available for this verification." })] }))] })) : (_jsx("div", { className: "cid-idp-selector-popup-info-box-error-wrapper", "data-testid": "popup-error-info-box", children: _jsx(NoIdpError, { hasManualIdp: hasManualIdp }) })), enableManualVerification && manualAuthorisationServer && (_jsx(_Fragment, { children: _jsxs("p", { className: "cid-idp-selector-popup-manual", children: [_jsx("span", { className: "cid-idp-selector-popup-manual-title", "data-testid": "manual-verification-text", children: "Use a document to verify your identity" }), _jsx("span", { className: "cid-idp-selector-popup-manual-action", tabIndex: 0, onClick: () => onProceed(manualAuthorisationServer.AuthorisationServerId, manualAuthorisationServer.CustomerFriendlyName, manualAuthorisationServer.AuthorisationServerCertifications), "data-testid": "manual-verification-action", role: "link", children: "Verify with a document" }), _jsx("span", { className: "cid-idp-selector-popup-manual-description", children: "ConnectID does not collect, hold or store your personal information at any time." })] }) }))] }));
148
+ return (_jsxs(_Fragment, { children: [filteredAuthorisationServers.length > 0 ? (_jsxs("div", { className: "cid-idp-selector-popup-provider-wrapper", children: [_jsx("h3", { className: "cid-idp-selector-popup-subtitle", children: "Choose a provider" }), _jsx("ul", { className: "cid-idp-selector-popup-participants", "data-testid": "participants", children: filteredAuthorisationServers.map(({ AuthorisationServerId, CustomerFriendlyName, CustomerFriendlyLogoUri, AuthorisationServerCertifications, }) => (_jsxs("li", { role: "img", "data-testid": "participant", className: "cid-idp-selector-popup-participant", tabIndex: 0, onClick: () => onProceed(AuthorisationServerId, CustomerFriendlyName, AuthorisationServerCertifications), children: [_jsx("img", { className: "cid-idp-selector-popup-participant-icon", src: CustomerFriendlyLogoUri, alt: "" }), _jsx("div", { className: "cid-idp-selector-popup-participant-name", title: CustomerFriendlyName, "data-testid": "participant-name", children: CustomerFriendlyName })] }, AuthorisationServerId))) }), missingAuthorisationServerWithProfileRedirectFapi2 && (_jsxs("div", { className: "cid-idp-selector-popup-missing", "data-testid": "missing-auth-server", children: [_jsx("h4", { className: "cid-idp-selector-popup-missing-title", children: "Can't find your provider?" }), _jsx("p", { className: "cid-idp-selector-popup-missing-text", children: "Not all of our identity providers are available for this verification." })] }))] })) : (_jsx("div", { className: "cid-idp-selector-popup-info-box-error-wrapper", "data-testid": "popup-error-info-box", children: _jsx(NoIdpError, { hasManualIdp: hasManualIdp }) })), enableManualVerification && manualAuthorisationServer && (_jsx(_Fragment, { children: _jsxs("p", { className: "cid-idp-selector-popup-manual", children: [_jsx("span", { className: "cid-idp-selector-popup-manual-title", "data-testid": "manual-verification-text", children: "Use a document to verify your identity" }), _jsx("span", { className: "cid-idp-selector-popup-manual-action", tabIndex: 0, onClick: () => onProceed(manualAuthorisationServer.AuthorisationServerId, manualAuthorisationServer.CustomerFriendlyName, manualAuthorisationServer.AuthorisationServerCertifications), "data-testid": "manual-verification-action", role: "link", children: "Verify with a document" }), _jsx("span", { className: "cid-idp-selector-popup-manual-description", children: "ConnectID does not collect, hold or store your personal information at any time." })] }) }))] }));
149
149
  };
150
150
  return ReactDOM.createPortal(_jsxs("div", { className: "cid-idp-selector-popup", tabIndex: 0, ref: popupRef, onKeyDown: handleEnterEsc, children: [_jsxs("div", { className: "cid-idp-selector-popup-logo-container", children: [_jsxs("div", { className: "cid-idp-selector-popup-logos", children: [_jsxs("svg", { role: "img", focusable: "false", className: "cid-idp-selector-popup-logo", viewBox: "0 0 132.37 157.84", "data-testid": "cid-logo", children: [_jsx("title", { children: "ConnectID logo" }), _jsx("path", { d: "M102.22,91.65c0,19.9-16.13,36.03-36.03,36.03s-36.03-16.13-36.03-36.03,16.13-36.03,36.03-36.03c9.95,0,18.96,4.03,25.48,10.55l40.71-40.71c-6.52-6.52-10.55-15.52-10.55-25.46h-30.14c0,13.45,4.02,25.95,10.92,36.39-10.45-6.9-22.96-10.93-36.42-10.93C29.63,25.47,0,55.1,0,91.65s29.63,66.19,66.19,66.19,66.19-29.63,66.19-66.19h-30.16Z" })] }), rpLogoUrl && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "cid-idp-selector-popup-logo-dots", children: [_jsx("div", { className: "cid-idp-selector-popup-logo-dot" }), _jsx("div", { className: "cid-idp-selector-popup-logo-dot" }), _jsx("div", { className: "cid-idp-selector-popup-logo-dot" })] }), _jsx("img", { className: "cid-idp-selector-popup-logo-rp", src: rpLogoUrl, alt: "RP logo", "data-testid": "rp-logo" })] }))] }), _jsxs("button", { "aria-label": "Close popup", "data-testid": "popup-close", className: "cid-idp-selector-popup-close", onClick: onCancel, tabIndex: 0, ref: closeButtonRef, children: [_jsx("span", { className: "cid-idp-selector-popup-close-label", children: "Close" }), _jsx("svg", { clipRule: "evenodd", fillRule: "evenodd", strokeLinejoin: "round", strokeMiterlimit: "2", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "m12 10.93 5.719-5.72c.146-.146.339-.219.531-.219.404 0 .75.324.75.749 0 .193-.073.385-.219.532l-5.72 5.719 5.719 5.719c.147.147.22.339.22.531 0 .427-.349.75-.75.75-.192 0-.385-.073-.531-.219l-5.719-5.719-5.719 5.719c-.146.146-.339.219-.531.219-.401 0-.75-.323-.75-.75 0-.192.073-.384.22-.531l5.719-5.719-5.72-5.719c-.146-.147-.219-.339-.219-.532 0-.425.346-.749.75-.749.192 0 .385.073.531.219z" }) })] })] }), _jsxs("div", { className: "cid-idp-selector-popup-title-description-container", children: [_jsx("h2", { className: "cid-idp-selector-popup-title", children: popupTitle }), _jsx("p", { className: "cid-idp-selector-popup-description", children: rpDataSharingDescription })] }), renderClaims(), renderAuthorisationServers(), _jsx("div", { className: "cid-idp-selector-popup-info-box-wrapper", children: _jsxs(InfoBox, { children: [_jsx("h2", { className: "cid-idp-selector-popup-info-box-title", children: "What is ConnectID?" }), _jsxs("p", { className: "cid-idp-selector-popup-info-box-text", "data-testid": "whats-cid-text", children: ["ConnectID is an Australian-owned digital identity solution which allows you to securely prove who you are. ConnectID does not see or store your personal data. Visit", ' ', _jsx("a", { className: "cid-idp-selector-popup-info-box-link", href: "https://www.connectid.com.au", onClick: handleConnectIdLinkClicked, target: "_blank", tabIndex: 0, "data-testid": "info-box-link", ref: infoboxLinkRef, children: "connectid.com.au" }), ' ', "to find out more."] })] }) })] }), document.querySelector('body'));
151
151
  };
package/Process.css CHANGED
@@ -1,9 +1,12 @@
1
1
  .cid-idp-selector-process {
2
+ padding: 0;
3
+ margin-top: -12px;
4
+ margin-bottom: 9px;
5
+ }
6
+ .cid-idp-selector-process-item {
2
7
  display: grid;
3
8
  grid-template-columns: 6px 1fr;
4
9
  column-gap: 8px;
5
- margin-top: -12px;
6
- margin-bottom: 9px;
7
10
  }
8
11
  .cid-idp-selector-process-dot {
9
12
  width: 7px;
package/Process.js CHANGED
@@ -8,5 +8,5 @@ export const Process = () => {
8
8
  const lineClasses = `cid-idp-selector-process-line ${theme === 'light' ? 'cid-idp-selector-process-line--grey' : ''}`;
9
9
  const lastLineClass = `cid-idp-selector-process-line-last ${theme === 'light' ? 'cid-idp-selector-process-line-last--grey' : ''}`;
10
10
  const stepClasses = `cid-idp-selector-process-step ${theme === 'light' ? 'cid-idp-selector-process-step--light' : ''}`;
11
- return (_jsxs("div", { className: "cid-idp-selector-process", "data-testid": "process", children: [_jsxs("div", { children: [_jsx("div", { className: "cid-idp-selector-process-filler" }), _jsx("div", { className: dotClasses, "data-testid": "process-dot" }), _jsx("div", { className: lineClasses, "data-testid": "process-line" })] }), _jsx("div", { className: stepClasses, "data-testid": "process-step", children: "Select your bank" }), _jsxs("div", { children: [_jsx("div", { className: lineClasses }), _jsx("div", { className: dotClasses }), _jsx("div", { className: lineClasses })] }), _jsx("div", { className: stepClasses, children: "Log in to your account" }), _jsxs("div", { children: [_jsx("div", { className: lastLineClass }), _jsx("div", { className: dotClasses }), _jsx("div", { className: "cid-idp-selector-process-filler" })] }), _jsx("div", { className: stepClasses, children: "Review your details and provide consent" })] }));
11
+ return (_jsxs("ol", { className: "cid-idp-selector-process", "data-testid": "process", children: [_jsxs("li", { className: "cid-idp-selector-process-item", children: [_jsxs("div", { children: [_jsx("div", { className: "cid-idp-selector-process-filler" }), _jsx("div", { className: dotClasses, "data-testid": "process-dot" }), _jsx("div", { className: lineClasses, "data-testid": "process-line" })] }), _jsx("div", { className: stepClasses, "data-testid": "process-step", children: "Select your bank" })] }), _jsxs("li", { className: "cid-idp-selector-process-item", children: [_jsxs("div", { children: [_jsx("div", { className: lineClasses }), _jsx("div", { className: dotClasses }), _jsx("div", { className: lineClasses })] }), _jsx("div", { className: stepClasses, children: "Log in to your account" })] }), _jsxs("li", { className: "cid-idp-selector-process-item", children: [_jsxs("div", { children: [_jsx("div", { className: lastLineClass }), _jsx("div", { className: dotClasses }), _jsx("div", { className: "cid-idp-selector-process-filler" })] }), _jsx("div", { className: stepClasses, children: "Review your details and provide consent" })] })] }));
12
12
  };
package/README.md CHANGED
@@ -229,7 +229,7 @@ This is an optional field in addition with the widgets below the ConnectID butto
229
229
 
230
230
  ### <a name="showCompatibilityWarnings"></a>showCompatibilityWarnings option
231
231
 
232
- If set to `true`, a popup with compatibility warnings will be displayed after an IDP is selected, if the conditions are met. The popup will show information about the compatibility of the user's browser, device, incognito/private mode with the ConnectID flow and the user can decide whether they want to proceed or not.
232
+ If set to `true`, a popup with compatibility warnings will be displayed after an IDP is selected, if the conditions are met. The popup will show information about the compatibility of the user's browser, device, incognito/private mode with the ConnectID flow.
233
233
 
234
234
  <details>
235
235
  <summary>Show compatibility warnings</summary>
@@ -259,6 +259,37 @@ The SVG image below the ConnectID button has either option dark or light mode. B
259
259
 
260
260
  ## 🚀 Release Notes
261
261
 
262
+ ### 6.10.0 (Jul 22, 2025)
263
+ - Remove `Available on` from IDP logo list image.
264
+ - Add `role="img"` to participant list item.
265
+ - Show border on ConnectID button when on focus.
266
+ - `medium process` as list.
267
+ - Fix headings.
268
+ - Set empty `alt` attribute for IDP logos.
269
+ - Fix bank logos `alt` attribute.
270
+ - Add `disableAnalytics` option.
271
+ - Fix analytics double loading.
272
+ - Add test support for Samsung and Chrome browsers.
273
+ - Add `supportIncognito` option.
274
+ - Add `showCompatibilityWarnings` option.
275
+ - Rename `compabilityWarnings` to `compatibilityWarnings`.
276
+ - Add `compabilityWarnings` to `onProceed` callback.
277
+
278
+ ### 6.10.0-alpha.14 (Jul 18, 2025)
279
+ - Compatibility warning popup adjustments.
280
+
281
+ ### 6.10.0-alpha.13 (Jul 18, 2025)
282
+ - Remove `Available on` from IDP logo list image.
283
+
284
+ ### 6.10.0-alpha.12 (Jul 17, 2025)
285
+ - Add `role="img"` to participant list item.
286
+
287
+ ### 6.10.0-alpha.11 (Jul 17, 2025)
288
+ - Show border on ConnectID button when on focus.
289
+
290
+ ### 6.10.0-alpha.10 (Jul 15, 2025)
291
+ - `medium process` as list.
292
+
262
293
  ### 6.10.0-alpha.9 (Jul 14, 2025)
263
294
  - Fix headings.
264
295
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@connectid-tools/idp-selector-react",
3
- "version": "6.10.0-alpha.9",
3
+ "version": "6.10.0",
4
4
  "description": "React component for IDP Selector.",
5
5
  "main": "index.js",
6
6
  "type": "module",
@@ -26,10 +26,10 @@
26
26
  "homepage": "https://github.com/connectid-tools/idp-selector-react",
27
27
  "devDependencies": {
28
28
  "@babel/preset-typescript": "^7.27.1",
29
- "@types/node": "^22.16.3",
29
+ "@types/node": "^22.16.5",
30
30
  "@types/react": "^18.3.23",
31
31
  "@types/react-dom": "^18.3.7",
32
- "cypress": "^14.5.1",
32
+ "cypress": "^14.5.2",
33
33
  "jest-environment-jsdom": "^29.7.0",
34
34
  "prettier": "^3.6.2",
35
35
  "react": "^18.3.1",