@manuscripts/style-guide 3.5.21 → 3.5.23

package/README.md

@@ -12,13 +12,13 @@ const Example: React.FunctionComponent<{
 }> = ({ handleClick }) => (
   <div>
     <PrimaryButton onClick={handleClick}>Done</PrimaryButton>
-  </div>
+  </div> 
 )
-``` 
+```  
 
 ## Development  
 
-Run `yarn build` to build the `dist` folder for distribution. 
+Run `yarn build` to build the `dist` folder for distribution.  
 
 Run `yarn dev` to automatically rebuild when a file is changed.
 

package/dist/cjs/components/icons/delete-solid.js

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
-const DeleteSolidIcon = (props) => ((0, jsx_runtime_1.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M15.494 3.375H11.955C11.93 3.165 11.714 3 11.451 3H8.548C8.286 3 8.07 3.165 8.045 3.375H4.506C4.226 3.375 4 3.561 4 3.792V4.583C4 4.813 4.227 5 4.506 5H15.494C15.774 5 16 4.814 16 4.583V3.792C16 3.562 15.773 3.375 15.494 3.375ZM5 6V16.491C5 16.772 5.23 17 5.513 17H14.487C14.5541 17.0004 14.6207 16.9875 14.6829 16.9621C14.745 16.9367 14.8015 16.8993 14.8492 16.852C14.8969 16.8048 14.9347 16.7485 14.9606 16.6866C14.9865 16.6246 14.9999 16.5581 15 16.491V6H5ZM8.753 13.874C8.753 14.184 8.5 14.435 8.188 14.435C8.03886 14.4355 7.89559 14.3769 7.78966 14.2719C7.68373 14.1669 7.62379 14.0241 7.623 13.875V8.311C7.623 8.001 7.876 7.75 8.188 7.75C8.5 7.75 8.753 8 8.753 8.31V13.873V13.874ZM12.377 13.874C12.377 14.184 12.124 14.435 11.812 14.435C11.6629 14.4355 11.5196 14.3769 11.4137 14.2719C11.3077 14.1669 11.2478 14.0241 11.247 13.875V8.311C11.247 8.001 11.5 7.75 11.812 7.75C12.124 7.75 12.377 8 12.377 8.31V13.873V13.874Z", fill: "#6E6E6E" }) }));
+const DeleteSolidIcon = ({ color = '#6E6E6E', ...props }) => ((0, jsx_runtime_1.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M15.494 3.375H11.955C11.93 3.165 11.714 3 11.451 3H8.548C8.286 3 8.07 3.165 8.045 3.375H4.506C4.226 3.375 4 3.561 4 3.792V4.583C4 4.813 4.227 5 4.506 5H15.494C15.774 5 16 4.814 16 4.583V3.792C16 3.562 15.773 3.375 15.494 3.375ZM5 6V16.491C5 16.772 5.23 17 5.513 17H14.487C14.5541 17.0004 14.6207 16.9875 14.6829 16.9621C14.745 16.9367 14.8015 16.8993 14.8492 16.852C14.8969 16.8048 14.9347 16.7485 14.9606 16.6866C14.9865 16.6246 14.9999 16.5581 15 16.491V6H5ZM8.753 13.874C8.753 14.184 8.5 14.435 8.188 14.435C8.03886 14.4355 7.89559 14.3769 7.78966 14.2719C7.68373 14.1669 7.62379 14.0241 7.623 13.875V8.311C7.623 8.001 7.876 7.75 8.188 7.75C8.5 7.75 8.753 8 8.753 8.31V13.873V13.874ZM12.377 13.874C12.377 14.184 12.124 14.435 11.812 14.435C11.6629 14.4355 11.5196 14.3769 11.4137 14.2719C11.3077 14.1669 11.2478 14.0241 11.247 13.875V8.311C11.247 8.001 11.5 7.75 11.812 7.75C12.124 7.75 12.377 8 12.377 8.31V13.873V13.874Z", fill: color }) }));
 exports.default = DeleteSolidIcon;

package/dist/cjs/components/icons/eye-icon.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const EyeIcon = ({ color = '#0D79D0', ...props }) => ((0, jsx_runtime_1.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 18 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, ...props, children: [(0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7.99971 7.44277C9.15481 7.44277 10.0912 6.50637 10.0912 5.35127C10.0912 4.19616 9.15481 3.25977 7.99971 3.25977C6.8446 3.25977 5.9082 4.19616 5.9082 5.35127C5.9082 6.50637 6.8446 7.44277 7.99971 7.44277Z", fill: "currentColor" }), (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.888672 5.56163C0.888672 5.56163 3.89304 0.75 8.05975 0.75C12.2265 0.75 15.1109 5.56163 15.1109 5.56163C15.1109 5.56163 12.2785 9.95261 8.10099 9.95261C3.92349 9.95261 0.888672 5.56163 0.888672 5.56163Z", stroke: "currentColor", strokeWidth: "1.5" })] }));
+exports.default = EyeIcon;

package/dist/cjs/components/icons/index.js

@@ -20,7 +20,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.FileUnknownIcon = exports.FileTableIcon = exports.FilePdfIcon = exports.FileMainDocumentIcon = exports.FileLatexIcon = exports.FileImageIcon = exports.FileGraphicalAbstractIcon = exports.FileFigureIcon = exports.FileDocumentIcon = exports.FileCorruptedIcon = exports.FileCompressedIcon = exports.FileCodeIcon = exports.FileAudioIcon = exports.EditAttrsTrackingIcon = exports.EditIcon = exports.DraggableIcon = exports.DotsIcon = exports.DeleteIcon = exports.DeleteSolidIcon = exports.CorrespondingAuthorIcon = exports.CommentIcon = exports.CommentResolveIcon = exports.CommentReplyIcon = exports.CitationCountIcon = exports.SystemUserAvatarIcon = exports.ChatIcon = exports.CalendarIcon = exports.BookIcon = exports.AffiliationPlaceholderIcon = exports.AuthorPlaceholderIcon = exports.AffiliationIcon = exports.AlertIcon = exports.AvatarIcon = exports.AttentionRedIcon = exports.AttentionOrangeIcon = exports.AttentionGreenIcon = exports.AttentionBlueIcon = exports.AttachIcon = exports.ArrowUpIcon = exports.ArrowLeftIcon = exports.ArrowDownCircleIcon = exports.ArrowDownIcon = exports.AddRoleIcon = exports.AddIcon = exports.AddOutlineIcon = exports.AddNewIcon = exports.AddedIcon = exports.AddFigureIcon = exports.AddCommentIcon = exports.AddAuthorIcon = void 0;
 exports.ToolbarOrderedListIcon = exports.ToolbarItalicIcon = exports.ToolbarFigureIcon = exports.ToolbarEquationIcon = exports.ToolbarCodeIcon = exports.ToolbarCitationIcon = exports.ToolbarBoxedTextIcon = exports.ToolbarBoldIcon = exports.TickIcon = exports.TaskStepDoneIcon = exports.SupplementsIcon = exports.SliderOnIcon = exports.SliderOffIcon = exports.SectionCategoryIcon = exports.SearchIcon = exports.ScrollIcon = exports.SaveStatusErrorIcon = exports.SaveStatusSavingIcon = exports.SaveStatusSavedIcon = exports.SaveStatusOfflineIcon = exports.RoleReadingIcon = exports.RoleAnnotatingIcon = exports.PlusIcon = exports.ORCIDIcon = exports.OutlineUnorderedListIcon = exports.OutlineTableIcon = exports.OutlineSectionIcon = exports.OutlinePullQuoteIcon = exports.OutlineParagraphIcon = exports.OutlineOrderedListIcon = exports.OutlineManuscriptIcon = exports.OutlineFigureIcon = exports.OutlineEmbedIcon = exports.OutlineEquationIcon = exports.OutlineCodeIcon = exports.OutlineBlockQuoteIcon = exports.ManuscriptIcon = exports.LogoutIcon = exports.LockIcon = exports.LinkIcon = exports.InspectorPluginIcon = exports.InfoCircleIcon = exports.ImageRightIcon = exports.ImageDefaultIcon = exports.ImageLeftIcon = exports.HelpIcon = exports.GlobeIcon = exports.HandleOutlineIcon = exports.HandleInspectorIcon = exports.FileVideoIcon = void 0;
-exports.XIcon = exports.DangerIcon = exports.AddInstitutionIcon = exports.AddUserIcon = exports.ProfileIcon = exports.CrclTickAnimation = exports.VerticalEllipsisIcon = exports.UploadIcon = exports.TriangleExpandedIcon = exports.TriangleCollapsedIcon = exports.TranslateIcon = exports.ToolbarUnindentIcon = exports.ToolbarIndentIcon = exports.ToolbarUnorderedListIcon = exports.ToolbarUnderlineIcon = exports.ToolbarTableIcon = exports.ToolbarSymbolIcon = exports.ToolbarSuperscriptIcon = exports.ToolbarSubscriptIcon = exports.ToolbarSpecialCharactersIcon = void 0;
+exports.PencilIcon = exports.EyeIcon = exports.XIcon = exports.DangerIcon = exports.AddInstitutionIcon = exports.AddUserIcon = exports.ProfileIcon = exports.CrclTickAnimation = exports.VerticalEllipsisIcon = exports.UploadIcon = exports.TriangleExpandedIcon = exports.TriangleCollapsedIcon = exports.TranslateIcon = exports.ToolbarUnindentIcon = exports.ToolbarIndentIcon = exports.ToolbarUnorderedListIcon = exports.ToolbarUnderlineIcon = exports.ToolbarTableIcon = exports.ToolbarSymbolIcon = exports.ToolbarSuperscriptIcon = exports.ToolbarSubscriptIcon = exports.ToolbarSpecialCharactersIcon = void 0;
 var add_author_1 = require("./add-author");
 Object.defineProperty(exports, "AddAuthorIcon", { enumerable: true, get: function () { return __importDefault(add_author_1).default; } });
 var add_comment_1 = require("./add-comment");
@@ -261,3 +261,7 @@ var danger_1 = require("./danger");
 Object.defineProperty(exports, "DangerIcon", { enumerable: true, get: function () { return __importDefault(danger_1).default; } });
 var x_1 = require("./x");
 Object.defineProperty(exports, "XIcon", { enumerable: true, get: function () { return __importDefault(x_1).default; } });
+var eye_icon_1 = require("./eye-icon");
+Object.defineProperty(exports, "EyeIcon", { enumerable: true, get: function () { return __importDefault(eye_icon_1).default; } });
+var pencil_icon_1 = require("./pencil-icon");
+Object.defineProperty(exports, "PencilIcon", { enumerable: true, get: function () { return __importDefault(pencil_icon_1).default; } });

package/dist/cjs/components/icons/pencil-icon.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const PencilIcon = ({ color = '#0D79D0', ...props }) => ((0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M9.68101 4.26899L11.8502 6.55859L6.35835 12.3538L4.1892 10.065L9.68101 4.26899ZM13.4966 3.71699L12.529 2.69619C12.4401 2.60244 12.3344 2.52804 12.2181 2.47728C12.1017 2.42652 11.9769 2.40039 11.8509 2.40039C11.7249 2.40039 11.6001 2.42652 11.4838 2.47728C11.3674 2.52804 11.2617 2.60244 11.1728 2.69619L10.2456 3.67379L12.4155 5.96339L13.4974 4.82259C13.6365 4.67569 13.7146 4.47695 13.7146 4.26979C13.7146 4.06263 13.6365 3.86389 13.4974 3.71699H13.4966ZM3.05397 13.2826C3.04468 13.3256 3.04599 13.3705 3.05776 13.4128C3.06954 13.4552 3.0914 13.4938 3.12128 13.5248C3.15116 13.5559 3.18807 13.5784 3.22855 13.5903C3.26903 13.6023 3.31173 13.6032 3.35263 13.593L5.77016 12.9738L3.60178 10.6842L3.0532 13.2826H3.05397Z", fill: "currentColor" }) }));
+exports.default = PencilIcon;

package/dist/cjs/defaultTheme.js

@@ -58,6 +58,7 @@ exports.defaultTheme = {
             primary: colors.white,
             secondary: colors.alabasterGrey,
             tertiary: colors.mercuryGrey,
+            quaternary: colors.seashellGrey,
             fifth: colors.manuscriptsXLight2,
             dark: 'rgba(0,0,0,0.5)',
             error: colors.chablisRed,
@@ -203,6 +204,7 @@ exports.defaultTheme = {
             },
             success: { background: colors.contrastGreen, color: colors.white },
             dark: { background: colors.greyMuted, color: colors.white },
+            orange: { background: colors.contrastOrange, color: colors.white },
         },
     },
     font: {

package/dist/es/components/icons/delete-solid.js

@@ -1,3 +1,3 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-const DeleteSolidIcon = (props) => (_jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: _jsx("path", { d: "M15.494 3.375H11.955C11.93 3.165 11.714 3 11.451 3H8.548C8.286 3 8.07 3.165 8.045 3.375H4.506C4.226 3.375 4 3.561 4 3.792V4.583C4 4.813 4.227 5 4.506 5H15.494C15.774 5 16 4.814 16 4.583V3.792C16 3.562 15.773 3.375 15.494 3.375ZM5 6V16.491C5 16.772 5.23 17 5.513 17H14.487C14.5541 17.0004 14.6207 16.9875 14.6829 16.9621C14.745 16.9367 14.8015 16.8993 14.8492 16.852C14.8969 16.8048 14.9347 16.7485 14.9606 16.6866C14.9865 16.6246 14.9999 16.5581 15 16.491V6H5ZM8.753 13.874C8.753 14.184 8.5 14.435 8.188 14.435C8.03886 14.4355 7.89559 14.3769 7.78966 14.2719C7.68373 14.1669 7.62379 14.0241 7.623 13.875V8.311C7.623 8.001 7.876 7.75 8.188 7.75C8.5 7.75 8.753 8 8.753 8.31V13.873V13.874ZM12.377 13.874C12.377 14.184 12.124 14.435 11.812 14.435C11.6629 14.4355 11.5196 14.3769 11.4137 14.2719C11.3077 14.1669 11.2478 14.0241 11.247 13.875V8.311C11.247 8.001 11.5 7.75 11.812 7.75C12.124 7.75 12.377 8 12.377 8.31V13.873V13.874Z", fill: "#6E6E6E" }) }));
+const DeleteSolidIcon = ({ color = '#6E6E6E', ...props }) => (_jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: _jsx("path", { d: "M15.494 3.375H11.955C11.93 3.165 11.714 3 11.451 3H8.548C8.286 3 8.07 3.165 8.045 3.375H4.506C4.226 3.375 4 3.561 4 3.792V4.583C4 4.813 4.227 5 4.506 5H15.494C15.774 5 16 4.814 16 4.583V3.792C16 3.562 15.773 3.375 15.494 3.375ZM5 6V16.491C5 16.772 5.23 17 5.513 17H14.487C14.5541 17.0004 14.6207 16.9875 14.6829 16.9621C14.745 16.9367 14.8015 16.8993 14.8492 16.852C14.8969 16.8048 14.9347 16.7485 14.9606 16.6866C14.9865 16.6246 14.9999 16.5581 15 16.491V6H5ZM8.753 13.874C8.753 14.184 8.5 14.435 8.188 14.435C8.03886 14.4355 7.89559 14.3769 7.78966 14.2719C7.68373 14.1669 7.62379 14.0241 7.623 13.875V8.311C7.623 8.001 7.876 7.75 8.188 7.75C8.5 7.75 8.753 8 8.753 8.31V13.873V13.874ZM12.377 13.874C12.377 14.184 12.124 14.435 11.812 14.435C11.6629 14.4355 11.5196 14.3769 11.4137 14.2719C11.3077 14.1669 11.2478 14.0241 11.247 13.875V8.311C11.247 8.001 11.5 7.75 11.812 7.75C12.124 7.75 12.377 8 12.377 8.31V13.873V13.874Z", fill: color }) }));
 export default DeleteSolidIcon;

package/dist/es/components/icons/eye-icon.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const EyeIcon = ({ color = '#0D79D0', ...props }) => (_jsxs("svg", { width: "18", height: "18", viewBox: "0 0 18 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, ...props, children: [_jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7.99971 7.44277C9.15481 7.44277 10.0912 6.50637 10.0912 5.35127C10.0912 4.19616 9.15481 3.25977 7.99971 3.25977C6.8446 3.25977 5.9082 4.19616 5.9082 5.35127C5.9082 6.50637 6.8446 7.44277 7.99971 7.44277Z", fill: "currentColor" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.888672 5.56163C0.888672 5.56163 3.89304 0.75 8.05975 0.75C12.2265 0.75 15.1109 5.56163 15.1109 5.56163C15.1109 5.56163 12.2785 9.95261 8.10099 9.95261C3.92349 9.95261 0.888672 5.56163 0.888672 5.56163Z", stroke: "currentColor", strokeWidth: "1.5" })] }));
+export default EyeIcon;

package/dist/es/components/icons/index.js

@@ -133,3 +133,5 @@ export { default as AddUserIcon } from './add-user';
 export { default as AddInstitutionIcon } from './add-institution';
 export { default as DangerIcon } from './danger';
 export { default as XIcon } from './x';
+export { default as EyeIcon } from './eye-icon';
+export { default as PencilIcon } from './pencil-icon';

package/dist/es/components/icons/pencil-icon.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+const PencilIcon = ({ color = '#0D79D0', ...props }) => (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, ...props, children: _jsx("path", { d: "M9.68101 4.26899L11.8502 6.55859L6.35835 12.3538L4.1892 10.065L9.68101 4.26899ZM13.4966 3.71699L12.529 2.69619C12.4401 2.60244 12.3344 2.52804 12.2181 2.47728C12.1017 2.42652 11.9769 2.40039 11.8509 2.40039C11.7249 2.40039 11.6001 2.42652 11.4838 2.47728C11.3674 2.52804 11.2617 2.60244 11.1728 2.69619L10.2456 3.67379L12.4155 5.96339L13.4974 4.82259C13.6365 4.67569 13.7146 4.47695 13.7146 4.26979C13.7146 4.06263 13.6365 3.86389 13.4974 3.71699H13.4966ZM3.05397 13.2826C3.04468 13.3256 3.04599 13.3705 3.05776 13.4128C3.06954 13.4552 3.0914 13.4938 3.12128 13.5248C3.15116 13.5559 3.18807 13.5784 3.22855 13.5903C3.26903 13.6023 3.31173 13.6032 3.35263 13.593L5.77016 12.9738L3.60178 10.6842L3.0532 13.2826H3.05397Z", fill: "currentColor" }) }));
+export default PencilIcon;

package/dist/es/defaultTheme.js

@@ -22,6 +22,7 @@ export const defaultTheme = {
             primary: colors.white,
             secondary: colors.alabasterGrey,
             tertiary: colors.mercuryGrey,
+            quaternary: colors.seashellGrey,
             fifth: colors.manuscriptsXLight2,
             dark: 'rgba(0,0,0,0.5)',
             error: colors.chablisRed,
@@ -167,6 +168,7 @@ export const defaultTheme = {
             },
             success: { background: colors.contrastGreen, color: colors.white },
             dark: { background: colors.greyMuted, color: colors.white },
+            orange: { background: colors.contrastOrange, color: colors.white },
         },
     },
     font: {

package/dist/types/components/Badge.d.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import React from 'react';
-export type BadgeVariant = 'default' | 'primary' | 'warning' | 'info' | 'bordered' | 'success' | 'dark';
+export type BadgeVariant = 'default' | 'primary' | 'warning' | 'info' | 'bordered' | 'success' | 'dark' | 'orange';
 export type BadgeSize = 'sm' | 'md';
 interface BadgeProps {
     label: string;

package/dist/types/components/icons/eye-icon.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IconProps } from './types';
+declare const EyeIcon: React.FC<IconProps>;
+export default EyeIcon;

package/dist/types/components/icons/index.d.ts

@@ -133,3 +133,5 @@ export { default as AddUserIcon } from './add-user';
 export { default as AddInstitutionIcon } from './add-institution';
 export { default as DangerIcon } from './danger';
 export { default as XIcon } from './x';
+export { default as EyeIcon } from './eye-icon';
+export { default as PencilIcon } from './pencil-icon';

package/dist/types/components/icons/pencil-icon.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IconProps } from './types';
+declare const PencilIcon: React.FC<IconProps>;
+export default PencilIcon;

package/dist/types/theme.d.ts

@@ -77,6 +77,7 @@ interface Variations {
     primary: string;
     secondary: string;
     tertiary: string;
+    quaternary?: string;
     fifth?: string;
 }
 interface Background {
@@ -117,6 +118,7 @@ interface Badge {
     bordered: BadgeVariant;
     success: BadgeVariant;
     dark: BadgeVariant;
+    orange: BadgeVariant;
 }
 interface Text {
     muted: string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@manuscripts/style-guide",
   "description": "Shared components for Manuscripts applications",
-  "version": "3.5.21",
+  "version": "3.5.23",
   "repository": "github:Atypon-OpenSource/manuscripts-style-guide",
   "license": "Apache-2.0",
   "main": "dist/cjs",
@@ -28,7 +28,7 @@
     "prettier": "prettier --write \"{src,stories}/**/*.{ts,tsx}\"",
     "preversion": "npm-run-all --parallel lint typecheck test",
     "storybook": "storybook dev -p 6006",
-    "test": "jest --passWithNoTests",
+    "test": "vitest run",
     "typecheck": "tsc --noEmit",
     "version": "pnpm build",
     "prepare": "husky install"
@@ -71,7 +71,7 @@
     "@storybook/react": "8.5.3",
     "@storybook/react-webpack5": "8.5.3",
     "@storybook/test": "8.5.3",
-    "@types/jest": "30.0.0",
+    "@vitest/coverage-v8": "4.1.6",
     "@types/lodash": "4.17.16",
     "@types/node": "^20.19.25",
     "@types/react": "19.2.3",
@@ -81,14 +81,13 @@
     "@types/styled-components": "5.1.34",
     "@typescript-eslint/eslint-plugin": "8.46.4",
     "@typescript-eslint/parser": "8.46.4",
-    "babel-jest": "30.0.5",
+    "jsdom": "29.1.1",
     "babel-loader": "9.1.3",
     "eslint": "9.39.1",
     "eslint-config-prettier": "10.1.8",
     "eslint-plugin-diff": "2.0.3",
     "eslint-plugin-header": "3.1.1",
     "eslint-plugin-import": "2.32.0",
-    "eslint-plugin-jest": "29.1.0",
     "eslint-plugin-jsx-a11y": "6.10.2",
     "eslint-plugin-mdx": "3.6.2",
     "eslint-plugin-node": "11.1.0",
@@ -99,8 +98,7 @@
     "eslint-plugin-simple-import-sort": "12.1.1",
     "eslint-plugin-storybook": "10.0.6",
     "husky": "8.0.3",
-    "jest": "30.0.5",
-    "jest-environment-jsdom": "30.0.5",
+    "vitest": "4.1.6",
     "npm-run-all": "4.1.5",
     "prettier": "3.6.2",
     "rimraf": "6.0.1",