@commercetools-frontend/application-components 22.40.0 → 22.41.0

package/dist/{custom-views-selector-36368b71.cjs.prod.js → custom-views-selector-4a4c5740.cjs.prod.js}

@@ -33,7 +33,7 @@ var constants = require('@commercetools-frontend/constants');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
 require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
 require('@commercetools-uikit/utils');
-require('react-modal');
+require('@radix-ui/react-dialog');
 require('@commercetools-uikit/card');
 require('@commercetools-uikit/secondary-icon-button');
 require('@commercetools-frontend/i18n');

package/dist/{custom-views-selector-f8bc3071.esm.js → custom-views-selector-67fa3f78.esm.js}

@@ -31,7 +31,7 @@ import { featureFlags, GRAPHQL_TARGETS } from '@commercetools-frontend/constants
 import { jsx, jsxs } from '@emotion/react/jsx-runtime';
 import '@babel/runtime-corejs3/helpers/objectWithoutProperties';
 import '@commercetools-uikit/utils';
-import 'react-modal';
+import '@radix-ui/react-dialog';
 import '@commercetools-uikit/card';
 import '@commercetools-uikit/secondary-icon-button';
 import '@commercetools-frontend/i18n';

package/dist/{custom-views-selector-473e176e.cjs.dev.js → custom-views-selector-feec1e5d.cjs.dev.js}

@@ -33,7 +33,7 @@ var constants = require('@commercetools-frontend/constants');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
 require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
 require('@commercetools-uikit/utils');
-require('react-modal');
+require('@radix-ui/react-dialog');
 require('@commercetools-uikit/card');
 require('@commercetools-uikit/secondary-icon-button');
 require('@commercetools-frontend/i18n');

package/dist/declarations/src/components/dialogs/info-dialog/info-dialog.d.ts

@@ -1,4 +1,4 @@
-import { SyntheticEvent, ReactNode } from 'react';
+import type { ReactNode, SyntheticEvent } from 'react';
 export type TInfoDialogProps = {
     isOpen: boolean;
     onClose?: (event: SyntheticEvent) => void;

package/dist/declarations/src/components/dialogs/internals/dialog-container.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode, SyntheticEvent } from 'react';
+import { type ReactNode, type SyntheticEvent } from 'react';
 declare const getDefaultParentSelector: () => HTMLElement;
 type Props = {
     isOpen: boolean;

package/dist/declarations/src/components/dialogs/internals/dialog.styles.d.ts

@@ -1,8 +1,19 @@
+/// <reference types="react" />
 import { type SerializedStyles } from '@emotion/react';
 type StyleProps = {
     size: 'm' | 'l' | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 16 | 'scale';
     zIndex?: number;
 };
 export declare const getModalContentStyles: (props: StyleProps) => SerializedStyles;
-export declare const getOverlayStyles: (props: StyleProps) => SerializedStyles;
+export declare const ClickableDialogContent: import("@emotion/styled").StyledComponent<import("@radix-ui/react-dialog").DialogContentProps & import("react").RefAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & StyleProps, {}, {}>;
+export declare const DialogOverlay: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & Pick<StyleProps, "zIndex">, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const DialogContent: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};

package/dist/declarations/src/components/modal-pages/internals/modal-page.d.ts

@@ -1,5 +1,5 @@
 import { type ReactNode, type SyntheticEvent } from 'react';
-import { type CSSObject } from '@emotion/react';
+import type { CSSObject } from '@emotion/react';
 declare const getDefaultParentSelector: () => HTMLElement;
 type MessageDescriptor = {
     id: string;

package/dist/declarations/src/components/modal-pages/internals/modal-page.styles.d.ts

@@ -1,9 +1,5 @@
-import { type SerializedStyles } from '@emotion/react';
+/// <reference types="react" />
 import type { TModalPageSize } from './modal-page';
-type StyleProps = {
-    zIndex?: number;
-    size: TModalPageSize;
-};
 export declare const stylesBySize: {
     '10': {
         width: string;
@@ -22,10 +18,15 @@ export declare const stylesBySize: {
         transitionTime: number;
     };
 };
-export declare const getContainerStyles: (props: StyleProps) => SerializedStyles;
-export declare const getOverlayStyles: (props: StyleProps) => SerializedStyles;
-export declare const getAfterOpenContainerAnimation: () => SerializedStyles;
-export declare const getAfterOpenOverlayAnimation: () => SerializedStyles;
-export declare const getBeforeCloseContainerAnimation: (props: StyleProps) => SerializedStyles;
-export declare const getBeforeCloseOverlayAnimation: () => SerializedStyles;
-export {};
+export declare const ModalOverlay: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    size: TModalPageSize;
+    zIndex?: number | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ModalContent: import("@emotion/styled").StyledComponent<import("@radix-ui/react-dialog").DialogContentProps & import("react").RefAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & {
+    size: TModalPageSize;
+}, {}, {}>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercetools-frontend/application-components",
-  "version": "22.40.0",
+  "version": "22.41.0",
   "description": "Generic components for building Merchant Center applications",
   "bugs": "https://github.com/commercetools/merchant-center-application-kit/issues",
   "repository": {
@@ -36,14 +36,14 @@
   "dependencies": {
     "@babel/runtime": "^7.22.15",
     "@babel/runtime-corejs3": "^7.22.15",
-    "@commercetools-frontend/actions-global": "22.40.0",
-    "@commercetools-frontend/application-config": "22.40.0",
-    "@commercetools-frontend/application-shell-connectors": "22.40.0",
-    "@commercetools-frontend/assets": "22.40.0",
-    "@commercetools-frontend/constants": "22.40.0",
-    "@commercetools-frontend/i18n": "22.40.0",
-    "@commercetools-frontend/l10n": "22.40.0",
-    "@commercetools-frontend/sentry": "22.40.0",
+    "@commercetools-frontend/actions-global": "22.41.0",
+    "@commercetools-frontend/application-config": "22.41.0",
+    "@commercetools-frontend/application-shell-connectors": "22.41.0",
+    "@commercetools-frontend/assets": "22.41.0",
+    "@commercetools-frontend/constants": "22.41.0",
+    "@commercetools-frontend/i18n": "22.41.0",
+    "@commercetools-frontend/l10n": "22.41.0",
+    "@commercetools-frontend/sentry": "22.41.0",
     "@commercetools-uikit/accessible-button": "^19.17.1",
     "@commercetools-uikit/card": "^19.17.1",
     "@commercetools-uikit/constraints": "^19.17.1",
@@ -64,6 +64,7 @@
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.0",
     "@flopflip/react-broadcast": "14.0.2",
+    "@radix-ui/react-dialog": "1.1.4",
     "@react-hook/latest": "1.0.3",
     "@react-hook/resize-observer": "1.2.6",
     "@types/history": "^4.7.11",
@@ -76,8 +77,7 @@
     "history": "4.10.1",
     "lodash": "4.17.21",
     "prop-types": "15.8.1",
-    "raf-schd": "^4.0.3",
-    "react-modal": "3.16.1"
+    "raf-schd": "^4.0.3"
   },
   "devDependencies": {
     "@apollo/client": "3.7.14",