@ssa-ui-kit/templates 2.33.0 → 3.1.0

package/dist/projects/fintech/components/ConfirmationModal/types.d.ts

@@ -1,8 +1,8 @@
 export interface ConfirmationModalProps {
-    trigger?: JSX.Element;
+    trigger?: React.JSX.Element;
     isOpen?: boolean;
     title: React.ReactNode;
-    content: JSX.Element | string;
+    content: React.JSX.Element | string;
     isDismissButton?: boolean;
     confirmationBtnText: string;
     cancelBtnText?: string;

package/dist/projects/fintech/components/CryptocurrencyPrices/styles.d.ts

@@ -2,8 +2,9 @@ export declare const IconWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    direction?: string;
-    alignItems?: string;
+    direction?: import("@ssa-ui-kit/core").WrapperDirection;
+    alignItems?: import("@ssa-ui-kit/core").WrapperAlignItems;
+    justifyContent?: import("@ssa-ui-kit/core").WrapperJustifyContent;
     fade?: boolean;
     fadeDelay?: number;
     isVisible?: boolean;
@@ -15,8 +16,9 @@ export declare const ItemsWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    direction?: string;
-    alignItems?: string;
+    direction?: import("@ssa-ui-kit/core").WrapperDirection;
+    alignItems?: import("@ssa-ui-kit/core").WrapperAlignItems;
+    justifyContent?: import("@ssa-ui-kit/core").WrapperJustifyContent;
     fade?: boolean;
     fadeDelay?: number;
     isVisible?: boolean;
@@ -27,8 +29,9 @@ export declare const WeightedItemsWrapper: import("@emotion/styled").StyledCompo
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    direction?: string;
-    alignItems?: string;
+    direction?: import("@ssa-ui-kit/core").WrapperDirection;
+    alignItems?: import("@ssa-ui-kit/core").WrapperAlignItems;
+    justifyContent?: import("@ssa-ui-kit/core").WrapperJustifyContent;
     fade?: boolean;
     fadeDelay?: number;
     isVisible?: boolean;
@@ -39,8 +42,9 @@ export declare const Instrument: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    direction?: string;
-    alignItems?: string;
+    direction?: import("@ssa-ui-kit/core").WrapperDirection;
+    alignItems?: import("@ssa-ui-kit/core").WrapperAlignItems;
+    justifyContent?: import("@ssa-ui-kit/core").WrapperJustifyContent;
     fade?: boolean;
     fadeDelay?: number;
     isVisible?: boolean;
@@ -53,8 +57,9 @@ export declare const Price: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    direction?: string;
-    alignItems?: string;
+    direction?: import("@ssa-ui-kit/core").WrapperDirection;
+    alignItems?: import("@ssa-ui-kit/core").WrapperAlignItems;
+    justifyContent?: import("@ssa-ui-kit/core").WrapperJustifyContent;
     fade?: boolean;
     fadeDelay?: number;
     isVisible?: boolean;

package/dist/projects/fintech/components/PlotTooltip/hooks/usePlotTooltip.d.ts

@@ -1,8 +1,8 @@
 import { PlotTooltipState } from '../types';
 export declare const usePlotTooltip: () => {
     tooltipProps: PlotTooltipState;
-    tooltipRef: import("react").RefObject<HTMLDivElement>;
-    containerRef: import("react").RefObject<HTMLDivElement>;
+    tooltipRef: import("react").RefObject<HTMLDivElement | null>;
+    containerRef: import("react").RefObject<HTMLDivElement | null>;
     showTooltip: (x: number, y: number) => void;
     hideTooltip: (fixed?: boolean) => void;
     pinTooltip: import("react").Dispatch<import("react").SetStateAction<boolean>>;

package/dist/projects/fintech/components/WidgetCard/Title.d.ts

@@ -1,3 +1,3 @@
-export declare const Title: import("@emotion/styled").StyledComponent<Omit<import("@ssa-ui-kit/core/dist/components/Typography/types").TypographyProps, "ref"> & import("react").RefAttributes<HTMLElement> & {
+export declare const Title: import("@emotion/styled").StyledComponent<Omit<import("@ssa-ui-kit/core").TypographyProps, "ref"> & import("react").RefAttributes<HTMLElement> & {
     theme?: import("@emotion/react").Theme;
 }, {}, {}>;

package/dist/projects/fintech/components/WidgetCard/WidgetCardBase.d.ts

@@ -1,3 +1,3 @@
-export declare const WidgetCardBase: import("@emotion/styled").StyledComponent<import("@ssa-ui-kit/core/dist/components/Card/types").CardProps & {
+export declare const WidgetCardBase: import("@emotion/styled").StyledComponent<import("@ssa-ui-kit/core").CardProps & {
     theme?: import("@emotion/react").Theme;
 }, {}, {}>;

package/dist/projects/fintech/components/WidgetInfoLabel/types.d.ts

@@ -1,8 +1,8 @@
 import { Interpolation, Theme } from '@emotion/react';
 export interface WidgetInfoLabelProps {
-    title: JSX.Element | string;
-    value: JSX.Element | string | number;
-    currency?: JSX.Element | string;
+    title: React.JSX.Element | string;
+    value: React.JSX.Element | string | number;
+    currency?: React.JSX.Element | string;
     className?: string;
     isIncreasing?: boolean | null;
     titleCSS?: Interpolation<Theme>;

package/dist/projects/fintech/components/WithWidgetLoader/WithWidgetLoader.d.ts

@@ -3,4 +3,4 @@ export declare const WithWidgetLoader: ({ children, className, title, isFetching
     className?: string;
     title: string;
     isFetching: boolean;
-}) => string | number | boolean | Iterable<import("react").ReactNode> | import("@emotion/react/jsx-runtime").JSX.Element | null | undefined;
+}) => string | number | bigint | boolean | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("@emotion/react/jsx-runtime").JSX.Element | null | undefined;

package/dist/projects/fintech/contexts/GraphsContext/types.d.ts

@@ -1,9 +1,9 @@
-import { MutableRefObject } from 'react';
+import { RefObject } from 'react';
 import { GraphsListItem } from '../../types';
 export interface GraphsContextValue {
     marginRight: number;
     marginLeft: number;
-    tooltipRef: MutableRefObject<HTMLDivElement | null>;
+    tooltipRef: RefObject<HTMLDivElement | null>;
     calculateMargins: (data: GraphsListItem[]) => void;
     updateRightMargin: (newRightMargin: number) => void;
     updateLeftMargin: (newLeftMargin: number) => void;

package/dist/projects/fintech/contexts/HeaderContext/types.d.ts

@@ -1,7 +1,7 @@
 export type HeaderContentRef = Element | DocumentFragment;
 export interface HeaderContextContent {
-    headerContentRef: React.RefObject<HeaderContentRef>;
-    breadcrumbContentRef: React.RefObject<HeaderContentRef>;
-    renderHeaderContent: (content: JSX.Element | null) => React.ReactPortal | null;
-    renderBreadcrumbContent: (content: JSX.Element | null) => React.ReactPortal | null;
+    headerContentRef: React.RefObject<HeaderContentRef | null>;
+    breadcrumbContentRef: React.RefObject<HeaderContentRef | null>;
+    renderHeaderContent: (content: React.JSX.Element | null) => React.ReactPortal | null;
+    renderBreadcrumbContent: (content: React.JSX.Element | null) => React.ReactPortal | null;
 }

package/dist/projects/fintech/modals/types.d.ts

@@ -1,9 +1,9 @@
 import { CONFIRMATION_MODAL } from './constants';
 export interface ModalInformation {
     id: typeof CONFIRMATION_MODAL;
-    trigger?: JSX.Element;
+    trigger?: React.JSX.Element;
     title: React.ReactNode;
-    content: string | JSX.Element;
+    content: string | React.JSX.Element;
     isDismissButton?: boolean;
     confirmationBtnText: string;
     onClose?: () => void;

package/dist/projects/fintech/pages/AppLayout/types.d.ts

@@ -3,5 +3,5 @@ export type AppLayoutContextType = {
     isNavBarOpened: boolean;
     isFullscreenMode: boolean;
     setFullscreenMode: (isFullscreenMode: boolean) => void;
-    mainRef: RefObject<HTMLElement> | null;
+    mainRef: RefObject<HTMLElement | null> | null;
 };

package/dist/projects/fintech/pages/BotsPage/BotsPage.d.ts

@@ -1,4 +1 @@
-export declare const BotsPage: {
-    (props: object): import("@emotion/react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const BotsPage: import("react").ComponentType<object>;

package/dist/projects/fintech/pages/Dashboard/components/Bots/BotsText.d.ts

@@ -1,6 +1,6 @@
-export declare const SmallText: import("@emotion/styled").StyledComponent<Omit<import("@ssa-ui-kit/core/dist/components/Typography/types").TypographyProps, "ref"> & import("react").RefAttributes<HTMLElement> & {
+export declare const SmallText: import("@emotion/styled").StyledComponent<Omit<import("@ssa-ui-kit/core").TypographyProps, "ref"> & import("react").RefAttributes<HTMLElement> & {
     theme?: import("@emotion/react").Theme;
 }, {}, {}>;
-export declare const LargeText: import("@emotion/styled").StyledComponent<Omit<import("@ssa-ui-kit/core/dist/components/Typography/types").TypographyProps, "ref"> & import("react").RefAttributes<HTMLElement> & {
+export declare const LargeText: import("@emotion/styled").StyledComponent<Omit<import("@ssa-ui-kit/core").TypographyProps, "ref"> & import("react").RefAttributes<HTMLElement> & {
     theme?: import("@emotion/react").Theme;
 }, {}, {}>;

package/dist/projects/fintech/pages/Dashboard/components/PeriodFilter/PeriodButtonGroup.d.ts

@@ -1,10 +1,5 @@
+import { ComponentType } from 'react';
 import { ButtonGroupProps } from '@ssa-ui-kit/core';
 export declare const PeriodButtonGroup: ({ buttonStyles, ...props }: ButtonGroupProps) => import("@emotion/react/jsx-runtime").JSX.Element;
-export declare const ButtonGroupSM: {
-    (props: ButtonGroupProps): import("@emotion/react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export declare const ButtonGroupMD: {
-    (props: ButtonGroupProps): import("@emotion/react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const ButtonGroupSM: ComponentType<ButtonGroupProps>;
+export declare const ButtonGroupMD: ComponentType<ButtonGroupProps>;

package/dist/projects/fintech/pages/Dashboard/components/TopMenuWrapper/TopMenuWrapper.d.ts

@@ -2,8 +2,9 @@ export declare const TopMenuWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    direction?: string;
-    alignItems?: string;
+    direction?: import("@ssa-ui-kit/core").WrapperDirection;
+    alignItems?: import("@ssa-ui-kit/core").WrapperAlignItems;
+    justifyContent?: import("@ssa-ui-kit/core").WrapperJustifyContent;
     fade?: boolean;
     fadeDelay?: number;
     isVisible?: boolean;

package/dist/projects/fintech/pages/NotificationsPage/NotificationsPage.d.ts

@@ -1,4 +1,2 @@
-export declare const NotificationsPage: {
-    (props: object): import("@emotion/react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+import React from 'react';
+export declare const NotificationsPage: React.ComponentType<object>;

package/dist/projects/fintech/pages/NotificationsPage/components/ReadAllButton/StyledButton.d.ts

@@ -1,3 +1,3 @@
-export declare const StyledButton: import("@emotion/styled").StyledComponent<import("@ssa-ui-kit/core/dist/components/Button/types").ButtonProps & import("react").RefAttributes<HTMLButtonElement> & {
+export declare const StyledButton: import("@emotion/styled").StyledComponent<import("@ssa-ui-kit/core").ButtonProps & import("react").RefAttributes<HTMLButtonElement> & {
     theme?: import("@emotion/react").Theme;
 }, {}, {}>;

package/dist/projects/fitness/pages/Template/Default.d.ts

@@ -1,5 +1,6 @@
+import React from 'react';
 declare const Default: {
-    (Component: JSX.ElementType): (props: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    (Component: React.ComponentType<any>): (props: any) => import("@emotion/react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default Default;

package/dist/projects/hr/components/AppLayout/types.d.ts

@@ -2,7 +2,7 @@ import { Dispatch, RefObject, SetStateAction } from 'react';
 export type AppLayoutContextType = {
     isFullscreenMode: boolean;
     isNavBarOpened: boolean;
-    mainRef: RefObject<HTMLElement> | null;
+    mainRef: RefObject<HTMLElement | null> | null;
     setFullscreenMode: Dispatch<SetStateAction<boolean>>;
     setNavBarOpened: Dispatch<SetStateAction<boolean>>;
 };

package/dist/projects/hr/components/Events/components/EventInfoCell.d.ts

@@ -1,8 +1,6 @@
 export declare const EventInfoCell: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & {
-    align?: string;
-} & import("@ssa-ui-kit/core").CommonProps & import("react").ClassAttributes<HTMLTableDataCellElement> & import("react").TdHTMLAttributes<HTMLTableDataCellElement> & {
+} & import("@ssa-ui-kit/core/dist/components/TableCell/types").TableCellProps & import("react").ClassAttributes<HTMLTableDataCellElement> & import("react").TdHTMLAttributes<HTMLTableDataCellElement> & {
     theme?: import("@emotion/react").Theme;
 }, {}, {}>;

package/dist/projects/hr/components/Events/components/EventInfoContext.d.ts

@@ -1,8 +1,8 @@
-import { MutableRefObject, ReactNode } from 'react';
+import { RefObject, ReactNode } from 'react';
 import { EventItemInfo } from '../../../types';
 export type EventInfoContextType = {
-    firstEventCellRef: MutableRefObject<HTMLTableCellElement | null>;
-    photoCellRef: MutableRefObject<HTMLTableCellElement | null>;
+    firstEventCellRef: RefObject<HTMLTableCellElement | null>;
+    photoCellRef: RefObject<HTMLTableCellElement | null>;
     popoverOffsetLeft: number;
     dateColumnWidth: number;
     items: EventItemInfo[];

package/dist/projects/hr/components/Events/components/EventInfoPopoverTrigger.d.ts

@@ -1,7 +1,2 @@
 import React from 'react';
-export declare const EventInfoPopoverTrigger: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLElement> & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
-} & import("@ssa-ui-kit/core").CommonProps & {
-    isDisabled?: boolean;
-} & React.ClassAttributes<HTMLTableRowElement> & React.HTMLAttributes<HTMLTableRowElement> & Omit<React.HTMLProps<HTMLElement> & import("@ssa-ui-kit/core/dist/components/Button/types").ButtonProps & import("@ssa-ui-kit/core/dist/components/Popover/types").PopoverTriggerProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+export declare const EventInfoPopoverTrigger: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLElement> & import("@ssa-ui-kit/core/dist/components/TableRow/types").TableRowProps & React.RefAttributes<HTMLTableRowElement> & Omit<React.HTMLProps<HTMLElement> & import("@ssa-ui-kit/core").ButtonProps & import("@ssa-ui-kit/core/dist/components/Popover/types").PopoverTriggerProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;

package/dist/projects/hr/components/Events/components/WithEventLink.d.ts

@@ -1,2 +1,2 @@
 import { WithLink } from '@ssa-ui-kit/core';
-export declare const WithEventLink: ({ children, className, link, onClick, }: Parameters<typeof WithLink>[0]) => string | number | boolean | Iterable<import("react").ReactNode> | import("@emotion/react/jsx-runtime").JSX.Element | null | undefined;
+export declare const WithEventLink: ({ children, className, link, onClick, }: Parameters<typeof WithLink>[0]) => string | number | bigint | boolean | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("@emotion/react/jsx-runtime").JSX.Element | null | undefined;

package/dist/projects/hr/components/TableCell.d.ts

@@ -1,8 +1,6 @@
 export declare const HRTableCell: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & {
-    align?: string;
-} & import("@ssa-ui-kit/core").CommonProps & import("react").ClassAttributes<HTMLTableDataCellElement> & import("react").TdHTMLAttributes<HTMLTableDataCellElement> & {
+} & import("@ssa-ui-kit/core/dist/components/TableCell/types").TableCellProps & import("react").ClassAttributes<HTMLTableDataCellElement> & import("react").TdHTMLAttributes<HTMLTableDataCellElement> & {
     theme?: import("@emotion/react").Theme;
 }, {}, {}>;

package/dist/projects/hr/components/WidgetCard/Title.d.ts

@@ -1,3 +1,3 @@
-export declare const Title: import("@emotion/styled").StyledComponent<Omit<import("@ssa-ui-kit/core/dist/components/Typography/types").TypographyProps, "ref"> & import("react").RefAttributes<HTMLElement> & {
+export declare const Title: import("@emotion/styled").StyledComponent<Omit<import("@ssa-ui-kit/core").TypographyProps, "ref"> & import("react").RefAttributes<HTMLElement> & {
     theme?: import("@emotion/react").Theme;
 }, {}, {}>;

package/dist/projects/hr/components/WidgetCard/WidgetCardBase.d.ts

@@ -1,3 +1,3 @@
-export declare const WidgetCardBase: import("@emotion/styled").StyledComponent<import("@ssa-ui-kit/core/dist/components/Card/types").CardProps & {
+export declare const WidgetCardBase: import("@emotion/styled").StyledComponent<import("@ssa-ui-kit/core").CardProps & {
     theme?: import("@emotion/react").Theme;
 }, {}, {}>;

package/dist/projects/hr/components/WithWidgetLoader/WithWidgetLoader.d.ts

@@ -3,4 +3,4 @@ export declare const WithWidgetLoader: ({ children, className, title, isFetching
     className?: string;
     title: string;
     isFetching: boolean;
-}) => string | number | boolean | Iterable<import("react").ReactNode> | import("@emotion/react/jsx-runtime").JSX.Element | null | undefined;
+}) => string | number | bigint | boolean | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("@emotion/react/jsx-runtime").JSX.Element | null | undefined;

package/dist/projects/hr/contexts/Header/types.d.ts

@@ -1,5 +1,5 @@
 export type HeaderContentRef = Element | DocumentFragment;
 export interface HeaderContextContent {
-    headerContentRef: React.RefObject<HeaderContentRef>;
-    renderHeaderContent: (content: JSX.Element | null) => React.ReactPortal | null;
+    headerContentRef: React.RefObject<HeaderContentRef | null>;
+    renderHeaderContent: (content: React.JSX.Element | null) => React.ReactPortal | null;
 }

package/package.json

@@ -1,8 +1,16 @@
 {
   "name": "@ssa-ui-kit/templates",
-  "version": "2.33.0",
+  "version": "3.1.0",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.js",
+      "default": "./dist/index.js"
+    }
+  },
   "private": false,
   "sideEffects": false,
   "author": "SSA Group",
@@ -23,34 +31,35 @@
   ],
   "dependencies": {
     "@floating-ui/react": "0.27.4",
-    "@nivo/line": "^0.88.0",
-    "dompurify": "^3.2.4",
-    "dotenv": "^16.0.3",
-    "js-cookie": "^3.0.5",
-    "loose-envify": "^1.4.0",
-    "luxon": "^3.5.0",
-    "plotly.js": "^3.0.0",
-    "react-plotly.js": "^2.6.0",
-    "react-toastify": "^11.0.3",
-    "usehooks-ts": "^3.1.0",
-    "@ssa-ui-kit/core": "^2.33.0",
-    "@ssa-ui-kit/hooks": "^2.33.0",
-    "@ssa-ui-kit/utils": "^2.33.0",
-    "@ssa-ui-kit/widgets": "^2.33.0"
+    "@nivo/line": "0.99.0",
+    "dompurify": "3.2.4",
+    "dotenv": "16.0.3",
+    "js-cookie": "3.0.5",
+    "loose-envify": "1.4.0",
+    "luxon": "3.5.0",
+    "plotly.js": "3.0.0",
+    "react-plotly.js": "2.6.0",
+    "react-toastify": "11.0.3",
+    "usehooks-ts": "3.1.1",
+    "@ssa-ui-kit/core": "^3.1.0",
+    "@ssa-ui-kit/utils": "^3.1.0",
+    "@ssa-ui-kit/hooks": "^3.1.0",
+    "@ssa-ui-kit/widgets": "^3.1.0"
   },
   "devDependencies": {
-    "@emotion/css": "^11.13.5",
-    "@emotion/jest": "^11.13.0",
-    "@emotion/react": "^11.14.0",
-    "@emotion/styled": "^11.14.0",
-    "@nivo/colors": "^0.88.0",
-    "@nivo/core": "^0.88.0",
-    "@nivo/pie": "^0.88.0",
-    "@nivo/scales": "^0.88.0",
-    "@playwright/test": "^1.48.0",
-    "@types/js-cookie": "^3.0.6",
-    "@types/luxon": "^3.4.2",
-    "@types/react-plotly.js": "^2.6.3"
+    "@emotion/css": "11.13.5",
+    "@emotion/jest": "11.14.2",
+    "@emotion/react": "11.14.0",
+    "@emotion/styled": "11.14.0",
+    "@nivo/colors": "0.99.0",
+    "@nivo/core": "0.99.0",
+    "@nivo/pie": "0.99.0",
+    "@nivo/scales": "0.99.0",
+    "@playwright/test": "1.57.0",
+    "@types/js-cookie": "3.0.6",
+    "@types/luxon": "3.4.2",
+    "@types/react-plotly.js": "2.6.3",
+    "process": "0.11.10"
   },
   "browserslist": [
     ">0.1%",
@@ -61,12 +70,12 @@
     "@emotion/css": "^11.13.5",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
-    "@nivo/colors": "^0.88.0",
-    "@nivo/core": "^0.88.0",
-    "@nivo/pie": "^0.88.0",
-    "@nivo/scales": "^0.88.0",
-    "react": "18.x",
-    "react-dom": "18.x",
+    "@nivo/colors": "^0.99.0",
+    "@nivo/core": "^0.99.0",
+    "@nivo/pie": "^0.99.0",
+    "@nivo/scales": "^0.99.0",
+    "react": "19.x",
+    "react-dom": "19.x",
     "react-hook-form": "^7.46.1",
     "react-router-dom": "6.x || 7.x"
   },
@@ -78,8 +87,8 @@
   "scripts": {
     "test": "jest -i --no-cache",
     "build": "webpack --mode=production --node-env=production && tsc --build --force ./tsconfig.build.json && resolve-tspaths -p ./tsconfig.build.json",
-    "sb:dev": "storybook dev -p 6008",
-    "sb:build": "storybook build",
+    "sb:dev": "env storybook dev -p 6008",
+    "sb:build": "env storybook build",
     "test:e2e": "pnpm exec playwright test --project=chromium",
     "test:e2e:ui": "pnpm exec playwright test --project=chromium --ui",
     "test:e2e:debug": "pnpm exec playwright test --project=chromium --debug",