Merge remote-tracking branch 'origin/8.4' into 9.0

# Conflicts: # package.json # packages/debug-reason-for-rendering/package.json # packages/jest-preset-neos-ui/package.json # packages/neos-ts-interfaces/package.json # packages/neos-ui-backend-connector/package.json # packages/neos-ui-build/package.json # packages/neos-ui-ckeditor5-bindings/package.json # packages/neos-ui-constants/package.json # packages/neos-ui-containers/package.json # packages/neos-ui-contentrepository/package.json # packages/neos-ui-decorators/package.json # packages/neos-ui-editors/package.json # packages/neos-ui-editors/src/Editors/AssetEditor/index.js # packages/neos-ui-editors/src/Editors/Image/index.js # packages/neos-ui-extensibility-webpack-adapter/package.json # packages/neos-ui-extensibility/package.json # packages/neos-ui-guest-frame/package.json # packages/neos-ui-i18n/package.json # packages/neos-ui-inspector/package.json # packages/neos-ui-redux-store/package.json # packages/neos-ui-sagas/package.json # packages/neos-ui-validators/package.json # packages/neos-ui-views/package.json # packages/neos-ui/package.json # packages/neos-ui/src/Containers/Modals/SelectNodeType/nodeTypeGroupPanel.js # packages/neos-ui/src/Containers/PrimaryToolbar/PublishDropDown/index.js # packages/neos-ui/src/Containers/RightSideBar/Inspector/PropertyGroup/index.js # packages/neos-ui/src/Containers/RightSideBar/index.js # packages/positional-array-sorter/package.json # packages/react-proptypes/package.json # packages/react-ui-components/package.json # packages/utils-helpers/package.json # packages/utils-logger/package.json # packages/utils-redux/package.json
neos · Jan 15, 2024 · a609614 · a609614
2 parents 5758aa4 + 4b09226
commit a609614
Show file tree

Hide file tree

Showing 39 changed files with 99 additions and 111 deletions.
diff --git a/Tests/IntegrationTests/Fixtures/1Dimension/inspector.e2e.js b/Tests/IntegrationTests/Fixtures/1Dimension/inspector.e2e.js
@@ -44,7 +44,7 @@ test('Can edit the page title via inspector', async t => {
     await t
         .click(InspectorTitleProperty)
         .typeText(InspectorTitleProperty, '-2')
-        .click(Selector('[name="neos-content-main"]'))
+        .click(Selector('#neos-Inspector'), {offsetX: -400}) // hack to click into the iframe even with overlaying changes div in dom
         .expect(Selector('#neos-UnappliedChangesDialog').exists)
         .ok()
         .click(Selector('#neos-UnappliedChangesDialog-resume'))
@@ -55,19 +55,19 @@ test('Can edit the page title via inspector', async t => {
 
     subSection('Test unapplied changes dialog - discard');
     await t
-        .click(Selector('[name="neos-content-main"]'))
+        .click(Selector('#neos-Inspector'), {offsetX: -400}) // hack to click into the iframe even with overlaying changes div in dom
         .click(Selector('#neos-UnappliedChangesDialog-discard'))
         .expect(InspectorTitleProperty.value)
         .eql('Home-1');
 
     subSection('Test unapplied changes dialog - apply');
     await t
         .typeText(InspectorTitleProperty, '-3')
-        .click(Selector('[name="neos-content-main"]'))
+        .click(Selector('#neos-Inspector'), {offsetX: -400}) // hack to click into the iframe even with overlaying changes div in dom
         .click(Selector('#neos-UnappliedChangesDialog-apply'))
         .expect(InspectorTitleProperty.value)
         .eql('Home-1-3')
-        .click(Selector('[name="neos-content-main"]'))
+        .click(Selector('#neos-Inspector'), {offsetX: -400}) // hack to click into the iframe even with overlaying changes div in dom
         .expect(Selector('#neos-UnappliedChangesDialog').exists)
         .notOk();
 });

diff --git a/packages/neos-ui-containers/src/InsertModeSelector/index.js b/packages/neos-ui-containers/src/InsertModeSelector/index.js
@@ -1,10 +1,7 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 
-import ButtonGroup from '@neos-project/react-ui-components/src/ButtonGroup/';
-import Button from '@neos-project/react-ui-components/src/Button/';
-import Icon from '@neos-project/react-ui-components/src/Icon/';
-
+import {ButtonGroup, Button, Icon} from '@neos-project/react-ui-components';
 import {neos} from '@neos-project/neos-ui-decorators';
 import I18n from '@neos-project/neos-ui-i18n';
 

diff --git a/packages/neos-ui-editors/src/EditorEnvelope/index.js b/packages/neos-ui-editors/src/EditorEnvelope/index.js
@@ -4,15 +4,12 @@ import mergeClassNames from 'classnames';
 import ReactMarkdown from 'react-markdown';
 import omit from 'lodash.omit';
 
-import Label from '@neos-project/react-ui-components/src/Label/';
-import {Tooltip} from '@neos-project/react-ui-components';
+import {Tooltip, Label, Icon} from '@neos-project/react-ui-components';
 import I18n from '@neos-project/neos-ui-i18n';
 import {neos} from '@neos-project/neos-ui-decorators';
 
 import style from './style.module.css';
 
-import {Icon} from '@neos-project/react-ui-components';
-
 @neos(globalRegistry => ({
     editorRegistry: globalRegistry.get('inspector').get('editors'),
     i18nRegistry: globalRegistry.get('i18n')

diff --git a/packages/neos-ui-editors/src/Editors/AssetEditor/index.js b/packages/neos-ui-editors/src/Editors/AssetEditor/index.js
@@ -1,11 +1,13 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
+import {connect} from 'react-redux';
 import MultiSelectBox from '@neos-project/react-ui-components/src/MultiSelectBox/';
 import SelectBox from '@neos-project/react-ui-components/src/SelectBox/';
 import {dndTypes} from '@neos-project/neos-ui-constants';
 import {neos} from '@neos-project/neos-ui-decorators';
-
 import Controls from './Components/Controls/index';
+import {selectors} from '@neos-project/neos-ui-redux-store';
+
 import AssetOption from '../../Library/AssetOption';
 import {AssetUpload} from '../../Library/index';
 import backend from '@neos-project/neos-ui-backend-connector';
@@ -15,6 +17,10 @@ const DEFAULT_FEATURES = {
     upload: true
 };
 
+@connect(state => ({
+    siteNodePath: state?.cr?.nodes?.siteNode,
+    focusedNodePath: selectors.CR.Nodes.focusedNodePathSelector(state)
+}), null, null, {forwardRef: true})
 @neos(globalRegistry => ({
     assetLookupDataLoader: globalRegistry.get('dataLoaders').get('AssetLookup'),
     i18nRegistry: globalRegistry.get('i18n'),
@@ -45,7 +51,9 @@ export default class AssetEditor extends PureComponent {
         }).isRequired,
         secondaryEditorsRegistry: PropTypes.object.isRequired,
         renderSecondaryInspector: PropTypes.func.isRequired,
-        imagesOnly: PropTypes.bool
+        imagesOnly: PropTypes.bool,
+        siteNodePath: PropTypes.string.isRequired,
+        focusedNodePath: PropTypes.string.isRequired
     };
 
     static defaultProps = {
@@ -180,8 +188,30 @@ export default class AssetEditor extends PureComponent {
         }
     }
 
+    afterUpload = uploadResult => {
+        if (uploadResult?.object) {
+            this.handleValueChange(uploadResult?.object?.__identity);
+        } else {
+            this.handleValuesChange(uploadResult);
+        }
+    }
+
     handleChooseFile = () => {
-        this.assetUpload.chooseFromLocalFileSystem();
+        const {secondaryEditorsRegistry, options} = this.props;
+        if (secondaryEditorsRegistry.get('Neos.Neos/Inspector/Secondary/Editors/AssetUploadScreen')) {
+            // set media type constraint to "image/*" if it is not explicitly specified via options.constraints.mediaTypes
+            const constraints = {...options.constraints, mediaTypes: (options.constraints && options.constraints.mediaTypes) || ['image/*']};
+            const {component: AssetUploadScreen} = secondaryEditorsRegistry.get('Neos.Neos/Inspector/Secondary/Editors/AssetUploadScreen');
+            const additionalData = {
+                propertyName: this.props.identifier,
+                focusedNodePath: this.props.focusedNodePath,
+                siteNodePath: this.props.siteNodePath,
+                metaData: this.props.imagesOnly ? 'Image' : 'Asset'
+            };
+            this.props.renderSecondaryInspector('ASSET_UPLOAD_MEDIA', () => <AssetUploadScreen type={this.props.imagesOnly ? 'images' : 'all'} constraints={constraints} onComplete={this.afterUpload} additionalData={additionalData}/>);
+        } else {
+            this.assetUpload.chooseFromLocalFileSystem();
+        }
     }
 
     renderControls() {

diff --git a/packages/neos-ui-editors/src/Editors/Boolean/index.js b/packages/neos-ui-editors/src/Editors/Boolean/index.js
@@ -2,8 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import mergeClassNames from 'classnames';
 
-import CheckBox from '@neos-project/react-ui-components/src/CheckBox/';
-import Label from '@neos-project/react-ui-components/src/Label/';
+import {CheckBox, Label} from '@neos-project/react-ui-components';
 import I18n from '@neos-project/neos-ui-i18n';
 
 import style from './style.module.css';

diff --git a/packages/neos-ui-editors/src/Editors/CKEditor/index.js b/packages/neos-ui-editors/src/Editors/CKEditor/index.js
@@ -1,9 +1,7 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 
-import Button from '@neos-project/react-ui-components/src/Button/';
-import Icon from '@neos-project/react-ui-components/src/Icon/';
-import Label from '@neos-project/react-ui-components/src/Label/';
+import {Button, Icon, Label} from '@neos-project/react-ui-components';
 import I18n from '@neos-project/neos-ui-i18n';
 import {neos} from '@neos-project/neos-ui-decorators';
 

diff --git a/packages/neos-ui-editors/src/Editors/CodeMirror/index.js b/packages/neos-ui-editors/src/Editors/CodeMirror/index.js
@@ -1,9 +1,7 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 
-import Button from '@neos-project/react-ui-components/src/Button/';
-import Icon from '@neos-project/react-ui-components/src/Icon/';
-import Label from '@neos-project/react-ui-components/src/Label/';
+import {Button, Icon, Label} from '@neos-project/react-ui-components';
 import I18n from '@neos-project/neos-ui-i18n';
 import {neos} from '@neos-project/neos-ui-decorators';
 

diff --git a/packages/neos-ui-editors/src/Editors/Image/Components/ResizeControls/index.js b/packages/neos-ui-editors/src/Editors/Image/Components/ResizeControls/index.js
@@ -1,8 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import TextInput from '@neos-project/react-ui-components/src/TextInput/';
-import CheckBox from '@neos-project/react-ui-components/src/CheckBox/';
+import {TextInput, CheckBox} from '@neos-project/react-ui-components';
 import I18n from '@neos-project/neos-ui-i18n';
 
 import style from './style.module.css';

diff --git a/packages/neos-ui-editors/src/Editors/Image/index.js b/packages/neos-ui-editors/src/Editors/Image/index.js
@@ -1,7 +1,9 @@
 import React, {Component} from 'react';
 import PropTypes from 'prop-types';
+import {connect} from 'react-redux';
 import mergeClassNames from 'classnames';
 import produce from 'immer';
+import {selectors} from '@neos-project/neos-ui-redux-store';
 
 import backend from '@neos-project/neos-ui-backend-connector';
 import {neos} from '@neos-project/neos-ui-decorators';
@@ -18,6 +20,10 @@ const DEFAULT_FEATURES = {
     upload: true
 };
 
+@connect(state => ({
+    siteNodePath: state?.cr?.nodes?.siteNode,
+    focusedNodePath: selectors.CR.Nodes.focusedNodePathSelector(state)
+}), null, null, {forwardRef: true})
 @neos(globalRegistry => ({secondaryEditorsRegistry: globalRegistry.get('inspector').get('secondaryEditors')}))
 export default class ImageEditor extends Component {
     state = {
@@ -48,7 +54,10 @@ export default class ImageEditor extends Component {
         // I18N key
         fileChooserLabel: PropTypes.string,
 
-        accept: PropTypes.string
+        accept: PropTypes.string,
+
+        siteNodePath: PropTypes.string.isRequired,
+        focusedNodePath: PropTypes.string.isRequired
     };
 
     static defaultProps = {
@@ -242,8 +251,22 @@ export default class ImageEditor extends Component {
     }
 
     handleChooseFile = () => {
-        this.previewScreen.chooseFromLocalFileSystem();
-        this.setState({isAssetLoading: true});
+        const {secondaryEditorsRegistry, options} = this.props;
+        if (secondaryEditorsRegistry.get('Neos.Neos/Inspector/Secondary/Editors/AssetUploadScreen')) {
+            // set media type constraint to "image/*" if it is not explicitly specified via options.constraints.mediaTypes
+            const constraints = {...options.constraints, mediaTypes: (options.constraints && options.constraints.mediaTypes) || ['image/*']};
+            const {component: AssetUploadScreen} = secondaryEditorsRegistry.get('Neos.Neos/Inspector/Secondary/Editors/AssetUploadScreen');
+            const additionalData = {
+                propertyName: this.props.identifier,
+                focusedNodePath: this.props.focusedNodePath,
+                siteNodePath: this.props.siteNodePath,
+                metaData: 'Image'
+            };
+            this.props.renderSecondaryInspector('IMAGE_UPLOAD_MEDIA', () => <AssetUploadScreen type="images" constraints={constraints} onComplete={this.afterUpload} additionalData={additionalData}/>);
+        } else {
+            this.previewScreen.chooseFromLocalFileSystem();
+            this.setState({isAssetLoading: true});
+        }
     }
 
     handleChooseFromMedia = () => {

diff --git a/packages/neos-ui-editors/src/Editors/SelectBox/DataSourceBasedSelectBoxEditor.js b/packages/neos-ui-editors/src/Editors/SelectBox/DataSourceBasedSelectBoxEditor.js
@@ -1,8 +1,7 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import {connect} from 'react-redux';
-import SelectBox from '@neos-project/react-ui-components/src/SelectBox/';
-import MultiSelectBox from '@neos-project/react-ui-components/src/MultiSelectBox/';
+import {SelectBox, MultiSelectBox} from '@neos-project/react-ui-components';
 import {selectors} from '@neos-project/neos-ui-redux-store';
 import {neos} from '@neos-project/neos-ui-decorators';
 import {shouldDisplaySearchBox, searchOptions, processSelectBoxOptions} from './SelectBoxHelpers';

diff --git a/packages/neos-ui-editors/src/Editors/SelectBox/SimpleSelectBoxEditor.js b/packages/neos-ui-editors/src/Editors/SelectBox/SimpleSelectBoxEditor.js
@@ -1,7 +1,6 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
-import SelectBox from '@neos-project/react-ui-components/src/SelectBox/';
-import MultiSelectBox from '@neos-project/react-ui-components/src/MultiSelectBox/';
+import {SelectBox, MultiSelectBox} from '@neos-project/react-ui-components';
 import {neos} from '@neos-project/neos-ui-decorators';
 import {shouldDisplaySearchBox, searchOptions, processSelectBoxOptions} from './SelectBoxHelpers';
 

diff --git a/packages/neos-ui-editors/src/SecondaryEditors/ImageCropper/AspectRatioDropDown/index.js b/packages/neos-ui-editors/src/SecondaryEditors/ImageCropper/AspectRatioDropDown/index.js
@@ -1,8 +1,7 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import mergeClassNames from 'classnames';
-import IconButton from '@neos-project/react-ui-components/src/IconButton/';
-import DropDown from '@neos-project/react-ui-components/src/DropDown/';
+import {DropDown, IconButton} from '@neos-project/react-ui-components';
 
 import {AspectRatioOption, NullAspectRatioStrategy} from '../model';
 import style from './style.module.css';

diff --git a/packages/neos-ui-editors/src/SecondaryEditors/ImageCropper/index.js b/packages/neos-ui-editors/src/SecondaryEditors/ImageCropper/index.js
@@ -2,9 +2,7 @@ import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import ReactCrop from 'react-image-crop';
 
-import Icon from '@neos-project/react-ui-components/src/Icon/';
-import IconButton from '@neos-project/react-ui-components/src/IconButton/';
-import TextInput from '@neos-project/react-ui-components/src/TextInput/';
+import {Icon, IconButton, TextInput} from '@neos-project/react-ui-components';
 import {neos} from '@neos-project/neos-ui-decorators';
 
 import AspectRatioDropDown from './AspectRatioDropDown/index';

diff --git a/packages/neos-ui-inspector/src/SecondaryInspector/index.js b/packages/neos-ui-inspector/src/SecondaryInspector/index.js
@@ -6,8 +6,7 @@ import mergeClassNames from 'classnames';
 
 import {selectors} from '@neos-project/neos-ui-redux-store';
 
-import Icon from '@neos-project/react-ui-components/src/Icon/';
-import Button from '@neos-project/react-ui-components/src/Button/';
+import {Icon, Button} from '@neos-project/react-ui-components';
 
 import style from './style.module.css';
 

diff --git a/packages/neos-ui/src/Containers/Drawer/MenuItem/index.js b/packages/neos-ui/src/Containers/Drawer/MenuItem/index.js
@@ -1,8 +1,7 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 
-import Icon from '@neos-project/react-ui-components/src/Icon/';
-import Button from '@neos-project/react-ui-components/src/Button/';
+import {Icon, Button} from '@neos-project/react-ui-components';
 
 import I18n from '@neos-project/neos-ui-i18n';
 

diff --git a/packages/neos-ui/src/Containers/Drawer/MenuItemGroup/index.js b/packages/neos-ui/src/Containers/Drawer/MenuItemGroup/index.js
@@ -1,9 +1,7 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 
-import Icon from '@neos-project/react-ui-components/src/Icon/';
-import ToggablePanel from '@neos-project/react-ui-components/src/ToggablePanel/';
-import Button from '@neos-project/react-ui-components/src/Button/';
+import {Icon, ToggablePanel, Button} from '@neos-project/react-ui-components';
 
 import I18n from '@neos-project/neos-ui-i18n';
 

diff --git a/packages/neos-ui/src/Containers/FlashMessages/FlashMessage/index.js b/packages/neos-ui/src/Containers/FlashMessages/FlashMessage/index.js
@@ -1,8 +1,7 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import mergeClassNames from 'classnames';
-import IconButton from '@neos-project/react-ui-components/src/IconButton/';
-import Icon from '@neos-project/react-ui-components/src/Icon/';
+import {IconButton, Icon} from '@neos-project/react-ui-components';
 
 import style from './style.module.css';
 

diff --git a/packages/neos-ui/src/Containers/LeftSideBar/NodeTree/Node/index.js b/packages/neos-ui/src/Containers/LeftSideBar/NodeTree/Node/index.js
@@ -3,8 +3,7 @@ import PropTypes from 'prop-types';
 import {connect} from 'react-redux';
 
 import flowright from 'lodash.flowright';
-import Tree from '@neos-project/react-ui-components/src/Tree/';
-import Icon from '@neos-project/react-ui-components/src/Icon/';
+import {Tree, Icon} from '@neos-project/react-ui-components';
 import {stripTags, decodeHtml} from '@neos-project/utils-helpers';
 
 import {actions, selectors} from '@neos-project/neos-ui-redux-store';

diff --git a/packages/neos-ui/src/Containers/LeftSideBar/index.js b/packages/neos-ui/src/Containers/LeftSideBar/index.js
@@ -5,9 +5,7 @@ import {connect} from 'react-redux';
 
 import {actions, selectors} from '@neos-project/neos-ui-redux-store';
 
-import IconButton from '@neos-project/react-ui-components/src/IconButton/';
-
-import SideBar from '@neos-project/react-ui-components/src/SideBar/';
+import {IconButton, SideBar} from '@neos-project/react-ui-components';
 import {neos} from '@neos-project/neos-ui-decorators';
 
 import style from './style.module.css';

diff --git a/packages/neos-ui/src/Containers/Modals/DeleteNode/index.js b/packages/neos-ui/src/Containers/Modals/DeleteNode/index.js
@@ -2,9 +2,7 @@ import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import {connect} from 'react-redux';
 
-import Button from '@neos-project/react-ui-components/src/Button/';
-import Dialog from '@neos-project/react-ui-components/src/Dialog/';
-import Icon from '@neos-project/react-ui-components/src/Icon/';
+import {Button, Dialog, Icon} from '@neos-project/react-ui-components';
 
 import {selectors, actions} from '@neos-project/neos-ui-redux-store';
 import {neos} from '@neos-project/neos-ui-decorators';

diff --git a/packages/neos-ui/src/Containers/Modals/DiscardDialog/index.js b/packages/neos-ui/src/Containers/Modals/DiscardDialog/index.js
@@ -2,9 +2,7 @@ import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import {connect} from 'react-redux';
 
-import Button from '@neos-project/react-ui-components/src/Button/';
-import Dialog from '@neos-project/react-ui-components/src/Dialog/';
-import Icon from '@neos-project/react-ui-components/src/Icon/';
+import {Button, Dialog, Icon} from '@neos-project/react-ui-components';
 import I18n from '@neos-project/neos-ui-i18n';
 
 import {actions} from '@neos-project/neos-ui-redux-store';

diff --git a/packages/neos-ui/src/Containers/Modals/InsertMode/index.js b/packages/neos-ui/src/Containers/Modals/InsertMode/index.js
@@ -4,9 +4,7 @@ import {connect} from 'react-redux';
 
 import {neos} from '@neos-project/neos-ui-decorators';
 
-import Button from '@neos-project/react-ui-components/src/Button/';
-import Dialog from '@neos-project/react-ui-components/src/Dialog/';
-import Icon from '@neos-project/react-ui-components/src/Icon/';
+import {Button, Dialog, Icon} from '@neos-project/react-ui-components';
 import I18n from '@neos-project/neos-ui-i18n';
 
 import {InsertModeSelector} from '@neos-project/neos-ui-containers';

diff --git a/packages/neos-ui/src/Containers/Modals/KeyboardShortcutModal/index.js b/packages/neos-ui/src/Containers/Modals/KeyboardShortcutModal/index.js
@@ -4,10 +4,9 @@ import {connect} from 'react-redux';
 
 import {neos} from '@neos-project/neos-ui-decorators';
 import {actions} from '@neos-project/neos-ui-redux-store';
-import Dialog from '@neos-project/react-ui-components/src/Dialog/';
 import I18n from '@neos-project/neos-ui-i18n';
-import Button from '@neos-project/react-ui-components/src/Button/';
 
+import {Dialog, Button} from '@neos-project/react-ui-components';
 import style from './style.module.css';
 
 @neos(globalRegistry => ({

diff --git a/packages/neos-ui/src/Containers/Modals/NodeCreationDialog/index.js b/packages/neos-ui/src/Containers/Modals/NodeCreationDialog/index.js
@@ -9,9 +9,7 @@ import {actions, selectors} from '@neos-project/neos-ui-redux-store';
 import validate from '@neos-project/neos-ui-validators';
 import preprocessNodeConfiguration from '../../../preprocessNodeConfiguration';
 
-import Icon from '@neos-project/react-ui-components/src/Icon/';
-import Button from '@neos-project/react-ui-components/src/Button/';
-import Dialog from '@neos-project/react-ui-components/src/Dialog/';
+import {Icon, Button, Dialog} from '@neos-project/react-ui-components';
 import I18n from '@neos-project/neos-ui-i18n';
 import EditorEnvelope from '@neos-project/neos-ui-editors/src/EditorEnvelope/index';
 

diff --git a/packages/neos-ui/src/Containers/Modals/NodeVariantCreationDialog/index.js b/packages/neos-ui/src/Containers/Modals/NodeVariantCreationDialog/index.js
@@ -2,8 +2,7 @@ import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import {connect} from 'react-redux';
 
-import Button from '@neos-project/react-ui-components/src/Button/';
-import Dialog from '@neos-project/react-ui-components/src/Dialog/';
+import {Button, Dialog} from '@neos-project/react-ui-components';
 import I18n from '@neos-project/neos-ui-i18n';
 
 import {selectors, actions} from '@neos-project/neos-ui-redux-store';