diff --git a/README.md b/README.md
index f96cf0f4db5d2748b51230237f9e51ec7778942a..dbd22ed6eeab5a5c75e772e86980421917e4732f 100644
--- a/README.md
+++ b/README.md
@@ -31,6 +31,7 @@ The core of Mol* currently consists of these modules (see under `src/`):
 - `mol-state` State representation tree with state saving and automatic updates.
 - `mol-app` Components for builduing UIs.
 - `mol-plugin` Allow to define modular Mol* plugin instances utilizing `mol-state` and `mol-canvas3d`.
+- `mol-plugin-ui` React based user interface for the Mol* plugin. Some components of the UI are usable outside the main plugin and can be integrated to 3rd party solutions.
 - `mol-util` Useful things that do not fit elsewhere.
 
 Moreover, the project contains the imlementation of `servers`, including
diff --git a/src/apps/basic-wrapper/controls.tsx b/src/apps/basic-wrapper/controls.tsx
index 6fdcfdd1a38cdab8b089626316fdc6a90800fca2..c45a76010edd1bc18d52f4635fd482ae1b9ee7cd 100644
--- a/src/apps/basic-wrapper/controls.tsx
+++ b/src/apps/basic-wrapper/controls.tsx
@@ -4,9 +4,9 @@
  * @author David Sehnal <david.sehnal@gmail.com>
  */
 
-import { PluginUIComponent } from '../../mol-plugin/ui/base';
+import { PluginUIComponent } from '../../mol-plugin-ui/base';
 import * as React from 'react';
-import { TransformUpdaterControl } from '../../mol-plugin/ui/state/update-transform';
+import { TransformUpdaterControl } from '../../mol-plugin-ui/state/update-transform';
 
 export class BasicWrapperControls extends PluginUIComponent {
 
diff --git a/src/examples/proteopedia-wrapper/ui/controls.tsx b/src/examples/proteopedia-wrapper/ui/controls.tsx
index df7938cc3c9b1fa92fc1b9ddf2bc4d74c769fe79..abe14b3718d1eb844e010b6753127e41bd3a1f4e 100644
--- a/src/examples/proteopedia-wrapper/ui/controls.tsx
+++ b/src/examples/proteopedia-wrapper/ui/controls.tsx
@@ -6,12 +6,12 @@
 
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import { PluginUIComponent } from '../../../mol-plugin/ui/base';
-import { CurrentObject, PluginContextContainer } from '../../../mol-plugin/ui/plugin';
-import { AnimationControls } from '../../../mol-plugin/ui/state/animation';
-import { CameraSnapshots } from '../../../mol-plugin/ui/camera';
+import { PluginUIComponent } from '../../../mol-plugin-ui/base';
+import { CurrentObject, PluginContextContainer } from '../../../mol-plugin-ui/plugin';
+import { AnimationControls } from '../../../mol-plugin-ui/state/animation';
+import { CameraSnapshots } from '../../../mol-plugin-ui/camera';
 import { PluginContext } from '../../../mol-plugin/context';
-import { TransformUpdaterControl } from '../../../mol-plugin/ui/state/update-transform';
+import { TransformUpdaterControl } from '../../../mol-plugin-ui/state/update-transform';
 import { StateElements } from '../helpers';
 
 export class ControlsWrapper extends PluginUIComponent {
diff --git a/src/mol-plugin/ui/base.tsx b/src/mol-plugin-ui/base.tsx
similarity index 98%
rename from src/mol-plugin/ui/base.tsx
rename to src/mol-plugin-ui/base.tsx
index b62d1b1bba5960e2d7329ae485b382b335da0102..d377417addc71ca14c8c4eec0c0cbccd37cdcc07 100644
--- a/src/mol-plugin/ui/base.tsx
+++ b/src/mol-plugin-ui/base.tsx
@@ -7,7 +7,7 @@
 
 import * as React from 'react';
 import { Observable, Subscription } from 'rxjs';
-import { PluginContext } from '../context';
+import { PluginContext } from '../mol-plugin/context';
 
 export const PluginReactContext = React.createContext(void 0 as any as PluginContext);
 
diff --git a/src/mol-plugin/ui/camera.tsx b/src/mol-plugin-ui/camera.tsx
similarity index 95%
rename from src/mol-plugin/ui/camera.tsx
rename to src/mol-plugin-ui/camera.tsx
index f09ae177c49f3d8cb778612c7d093b17dc8b632c..e1b9a0a8545f29d054437a925c6b9c6bf8130628 100644
--- a/src/mol-plugin/ui/camera.tsx
+++ b/src/mol-plugin-ui/camera.tsx
@@ -4,10 +4,10 @@
  * @author David Sehnal <david.sehnal@gmail.com>
  */
 
-import { PluginCommands } from '../../mol-plugin/command';
+import { PluginCommands } from '../mol-plugin/command';
 import * as React from 'react';
 import { PluginUIComponent } from './base';
-import { ParamDefinition as PD } from '../../mol-util/param-definition';
+import { ParamDefinition as PD } from '../mol-util/param-definition';
 import { ParameterControls } from './controls/parameters';
 import { Icon } from './controls/common';
 
diff --git a/src/mol-plugin/ui/controls.tsx b/src/mol-plugin-ui/controls.tsx
similarity index 95%
rename from src/mol-plugin/ui/controls.tsx
rename to src/mol-plugin-ui/controls.tsx
index 01d83565c4e3ae64967bee62f9788d3e5078b6d4..147b9c8d2239a090fa738663515c56ce195a3273 100644
--- a/src/mol-plugin/ui/controls.tsx
+++ b/src/mol-plugin-ui/controls.tsx
@@ -6,15 +6,15 @@
  */
 
 import * as React from 'react';
-import { PluginCommands } from '../../mol-plugin/command';
-import { UpdateTrajectory } from '../../mol-plugin/state/actions/structure';
+import { PluginCommands } from '../mol-plugin/command';
+import { UpdateTrajectory } from '../mol-plugin/state/actions/structure';
 import { PluginUIComponent } from './base';
-import { LociLabelEntry } from '../../mol-plugin/util/loci-label-manager';
+import { LociLabelEntry } from '../mol-plugin/util/loci-label-manager';
 import { IconButton, Icon } from './controls/common';
-import { PluginStateObject } from '../../mol-plugin/state/objects';
-import { StateTransforms } from '../../mol-plugin/state/transforms';
-import { StateTransformer } from '../../mol-state';
-import { ModelFromTrajectory } from '../../mol-plugin/state/transforms/model';
+import { PluginStateObject } from '../mol-plugin/state/objects';
+import { StateTransforms } from '../mol-plugin/state/transforms';
+import { StateTransformer } from '../mol-state';
+import { ModelFromTrajectory } from '../mol-plugin/state/transforms/model';
 import { AnimationControls } from './state/animation';
 import { StructureRepresentationControls } from './structure/representation';
 import { StructureSelectionControls } from './structure/selection';
diff --git a/src/mol-plugin/ui/controls/color.tsx b/src/mol-plugin-ui/controls/color.tsx
similarity index 94%
rename from src/mol-plugin/ui/controls/color.tsx
rename to src/mol-plugin-ui/controls/color.tsx
index f3c3b894e4d57696074407565caeb386509b1f3e..4cd1c7762b0efa83c7bc966ae90e3ab85f92e41c 100644
--- a/src/mol-plugin/ui/controls/color.tsx
+++ b/src/mol-plugin-ui/controls/color.tsx
@@ -5,14 +5,14 @@
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
 
-import { Color } from '../../../mol-util/color';
-import { ParamDefinition as PD } from '../../../mol-util/param-definition';
-import { camelCaseToWords, stringToWords } from '../../../mol-util/string';
+import { Color } from '../../mol-util/color';
+import { ParamDefinition as PD } from '../../mol-util/param-definition';
+import { camelCaseToWords, stringToWords } from '../../mol-util/string';
 import * as React from 'react';
 import { _Props, _State } from '../base';
 import { ParamProps } from './parameters';
 import { TextInput } from './common';
-import { DefaultColorSwatch } from '../../../mol-util/color/swatches';
+import { DefaultColorSwatch } from '../../mol-util/color/swatches';
 
 export class CombinedColorControl extends React.PureComponent<ParamProps<PD.Color>, { isExpanded: boolean }> {
     state = { isExpanded: false }
diff --git a/src/mol-plugin/ui/controls/common.tsx b/src/mol-plugin-ui/controls/common.tsx
similarity index 99%
rename from src/mol-plugin/ui/controls/common.tsx
rename to src/mol-plugin-ui/controls/common.tsx
index 25dd284f7c661813e8d82177b450f8778a45986a..c345eb5d86c0a1c0e90f8e6c7f8590700a6d5576 100644
--- a/src/mol-plugin/ui/controls/common.tsx
+++ b/src/mol-plugin-ui/controls/common.tsx
@@ -5,7 +5,7 @@
  */
 
 import * as React from 'react';
-import { Color } from '../../../mol-util/color';
+import { Color } from '../../mol-util/color';
 import { PurePluginUIComponent } from '../base';
 
 export class ControlGroup extends React.Component<{
diff --git a/src/mol-plugin/ui/controls/legend.tsx b/src/mol-plugin-ui/controls/legend.tsx
similarity index 94%
rename from src/mol-plugin/ui/controls/legend.tsx
rename to src/mol-plugin-ui/controls/legend.tsx
index 93463cef9668aba9bc5932f28e23620305449efb..1243de1a7a45d9ea52c8c63336b0cb1219c97cbd 100644
--- a/src/mol-plugin/ui/controls/legend.tsx
+++ b/src/mol-plugin-ui/controls/legend.tsx
@@ -4,10 +4,10 @@
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
 
-import { Color } from '../../../mol-util/color';
+import { Color } from '../../mol-util/color';
 import * as React from 'react';
 import { _Props, _State } from '../base';
-import { Legend as LegendData, ScaleLegend as ScaleLegendData, TableLegend as TableLegendData } from '../../../mol-util/legend';
+import { Legend as LegendData, ScaleLegend as ScaleLegendData, TableLegend as TableLegendData } from '../../mol-util/legend';
 
 export type LegendProps<L extends LegendData> = { legend: L }
 export type Legend = React.ComponentClass<LegendProps<any>>
diff --git a/src/mol-plugin/ui/controls/line-graph/line-graph-component.tsx b/src/mol-plugin-ui/controls/line-graph/line-graph-component.tsx
similarity index 99%
rename from src/mol-plugin/ui/controls/line-graph/line-graph-component.tsx
rename to src/mol-plugin-ui/controls/line-graph/line-graph-component.tsx
index 70fafe032c9ad1df1fc3249bf4c4b029a6650336..f623e05c9e4ed876884e5bd97a02743e49a4873e 100644
--- a/src/mol-plugin/ui/controls/line-graph/line-graph-component.tsx
+++ b/src/mol-plugin-ui/controls/line-graph/line-graph-component.tsx
@@ -6,7 +6,7 @@
 import PointComponent from './point-component';
 
 import * as React from 'react';
-import { Vec2 } from '../../../../mol-math/linear-algebra';
+import { Vec2 } from '../../../mol-math/linear-algebra';
 
 interface LineGraphComponentState {
     points: Vec2[],
diff --git a/src/mol-plugin/ui/controls/line-graph/point-component.tsx b/src/mol-plugin-ui/controls/line-graph/point-component.tsx
similarity index 95%
rename from src/mol-plugin/ui/controls/line-graph/point-component.tsx
rename to src/mol-plugin-ui/controls/line-graph/point-component.tsx
index c05f2d9ea4b061fd603a985a830b37770949b487..191bc8f9f6a73d63d8c0d2e5c0c4d545dd0417ce 100644
--- a/src/mol-plugin/ui/controls/line-graph/point-component.tsx
+++ b/src/mol-plugin-ui/controls/line-graph/point-component.tsx
@@ -1,7 +1,7 @@
 
 import * as React from 'react';
 
-import { Vec2 } from '../../../../mol-math/linear-algebra';
+import { Vec2 } from '../../../mol-math/linear-algebra';
 
 export default class PointComponent extends React.Component<any, {show: boolean}> {
     constructor(props: any) {
diff --git a/src/mol-plugin/ui/controls/parameters.tsx b/src/mol-plugin-ui/controls/parameters.tsx
similarity index 98%
rename from src/mol-plugin/ui/controls/parameters.tsx
rename to src/mol-plugin-ui/controls/parameters.tsx
index fdb4f2810641dff356313e9585c9fadd1e9c6e3a..a942c12439df0d7fdcc595e26d000c8ea361e3fc 100644
--- a/src/mol-plugin/ui/controls/parameters.tsx
+++ b/src/mol-plugin-ui/controls/parameters.tsx
@@ -5,19 +5,19 @@
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
 
-import { Vec2, Vec3 } from '../../../mol-math/linear-algebra';
-import { Color } from '../../../mol-util/color';
-import { ColorListName, getColorListFromName } from '../../../mol-util/color/lists';
-import { memoize1 } from '../../../mol-util/memoize';
-import { ParamDefinition as PD } from '../../../mol-util/param-definition';
-import { camelCaseToWords } from '../../../mol-util/string';
+import { Vec2, Vec3 } from '../../mol-math/linear-algebra';
+import { Color } from '../../mol-util/color';
+import { ColorListName, getColorListFromName } from '../../mol-util/color/lists';
+import { memoize1 } from '../../mol-util/memoize';
+import { ParamDefinition as PD } from '../../mol-util/param-definition';
+import { camelCaseToWords } from '../../mol-util/string';
 import * as React from 'react';
 import LineGraphComponent from './line-graph/line-graph-component';
 import { Slider, Slider2 } from './slider';
 import { NumericInput, IconButton, ControlGroup } from './common';
 import { _Props, _State } from '../base';
 import { legendFor } from './legend';
-import { Legend as LegendData } from '../../../mol-util/legend';
+import { Legend as LegendData } from '../../mol-util/legend';
 import { CombinedColorControl, ColorValueOption, ColorOptions } from './color';
 
 export interface ParameterControlsProps<P extends PD.Params = PD.Params> {
diff --git a/src/mol-plugin/ui/controls/slider.tsx b/src/mol-plugin-ui/controls/slider.tsx
similarity index 99%
rename from src/mol-plugin/ui/controls/slider.tsx
rename to src/mol-plugin-ui/controls/slider.tsx
index 5648d68242345f83fd731b0499ff3397afaeeaec..f393f43e6429432d91543169a6bf1b27bba2265a 100644
--- a/src/mol-plugin/ui/controls/slider.tsx
+++ b/src/mol-plugin-ui/controls/slider.tsx
@@ -7,7 +7,7 @@
 
 import * as React from 'react'
 import { NumericInput } from './common';
-import { noop } from '../../../mol-util';
+import { noop } from '../../mol-util';
 
 export class Slider extends React.Component<{
     min: number,
diff --git a/src/mol-plugin/ui/custom/volume.tsx b/src/mol-plugin-ui/custom/volume.tsx
similarity index 96%
rename from src/mol-plugin/ui/custom/volume.tsx
rename to src/mol-plugin-ui/custom/volume.tsx
index 7083ddba0fe2a24c97ede6b68bbda44e5abe3fb7..95fd9cec46b34556ea605d1d545a68686c8e8324 100644
--- a/src/mol-plugin/ui/custom/volume.tsx
+++ b/src/mol-plugin-ui/custom/volume.tsx
@@ -7,15 +7,15 @@
 import { PluginUIComponent } from '../base';
 import { StateTransformParameters } from '../state/common';
 import * as React from 'react';
-import { VolumeStreaming } from '../../../mol-plugin/behavior/dynamic/volume-streaming/behavior';
+import { VolumeStreaming } from '../../mol-plugin/behavior/dynamic/volume-streaming/behavior';
 import { ExpandableGroup } from '../controls/common';
-import { ParamDefinition as PD } from '../../../mol-util/param-definition';
+import { ParamDefinition as PD } from '../../mol-util/param-definition';
 import { ParameterControls, ParamOnChange } from '../controls/parameters';
 import { Slider } from '../controls/slider';
-import { VolumeIsoValue, VolumeData } from '../../../mol-model/volume';
-import { Vec3 } from '../../../mol-math/linear-algebra';
-import { ColorNames } from '../../../mol-util/color/names';
-import { toPrecision } from '../../../mol-util/number';
+import { VolumeIsoValue, VolumeData } from '../../mol-model/volume';
+import { Vec3 } from '../../mol-math/linear-algebra';
+import { ColorNames } from '../../mol-util/color/names';
+import { toPrecision } from '../../mol-util/number';
 
 const ChannelParams = {
     color: PD.Color(ColorNames.black, { description: 'Display color of the volume.' }),
diff --git a/src/mol-plugin/ui/image.tsx b/src/mol-plugin-ui/image.tsx
similarity index 97%
rename from src/mol-plugin/ui/image.tsx
rename to src/mol-plugin-ui/image.tsx
index fa62c67f91e04cb00f703cadbb1fd14621963fd4..854ce21f7b7d066d0260d56268979955d35d5473 100644
--- a/src/mol-plugin/ui/image.tsx
+++ b/src/mol-plugin-ui/image.tsx
@@ -6,9 +6,9 @@
 
 import * as React from 'react';
 import { CollapsableControls, CollapsableState } from './base';
-import { ParamDefinition as PD } from '../../mol-util/param-definition';
+import { ParamDefinition as PD } from '../mol-util/param-definition';
 import { ParameterControls } from './controls/parameters';
-import { setCanvasSize } from '../../mol-canvas3d/util';
+import { setCanvasSize } from '../mol-canvas3d/util';
 
 interface ImageControlsState extends CollapsableState {
     showPreview: boolean
diff --git a/src/mol-plugin/ui/left-panel.tsx b/src/mol-plugin-ui/left-panel.tsx
similarity index 96%
rename from src/mol-plugin/ui/left-panel.tsx
rename to src/mol-plugin-ui/left-panel.tsx
index 811f402555370fcc8e5c907461cb8eb47e243744..25a962f155209164719ed8918454765a4045e875 100644
--- a/src/mol-plugin/ui/left-panel.tsx
+++ b/src/mol-plugin-ui/left-panel.tsx
@@ -9,14 +9,14 @@ import { PluginUIComponent } from './base';
 import { StateTree } from './state/tree';
 import { IconButton, SectionHeader } from './controls/common';
 import { StateObjectActions } from './state/actions';
-import { StateTransform } from '../../mol-state';
-import { PluginCommands } from '../command';
+import { StateTransform } from '../mol-state';
+import { PluginCommands } from '../mol-plugin/command';
 import { ParameterControls } from './controls/parameters';
-import { Canvas3DParams } from '../../mol-canvas3d/canvas3d';
-import { ParamDefinition as PD } from '../../mol-util/param-definition';
+import { Canvas3DParams } from '../mol-canvas3d/canvas3d';
+import { ParamDefinition as PD } from '../mol-util/param-definition';
 import { StateSnapshots, RemoteStateSnapshots } from './state/snapshots';
 import { HelpContent } from './viewport/help';
-import { LeftPanelTabName } from '../layout';
+import { LeftPanelTabName } from '../mol-plugin/layout';
 
 export class LeftPanelControls extends PluginUIComponent<{}, { tab: LeftPanelTabName }> {
     state = { tab: this.plugin.behaviors.layout.leftPanelTabName.value };
diff --git a/src/mol-plugin/ui/plugin.tsx b/src/mol-plugin-ui/plugin.tsx
similarity index 97%
rename from src/mol-plugin/ui/plugin.tsx
rename to src/mol-plugin-ui/plugin.tsx
index fc8a0356d810de7d506ddb6b386997c4143fc116..7a7eb0cd20ad8cd8a2c1bc7bb530ce5d79c3396e 100644
--- a/src/mol-plugin/ui/plugin.tsx
+++ b/src/mol-plugin-ui/plugin.tsx
@@ -6,16 +6,16 @@
  */
 
 import { List } from 'immutable';
-import { formatTime } from '../../mol-util';
-import { LogEntry } from '../../mol-util/log-entry';
+import { formatTime } from '../mol-util';
+import { LogEntry } from '../mol-util/log-entry';
 import * as React from 'react';
-import { PluginContext } from '../context';
+import { PluginContext } from '../mol-plugin/context';
 import { PluginReactContext, PluginUIComponent } from './base';
 import { LociLabels, TrajectoryViewportControls, StateSnapshotViewportControls, AnimationViewportControls, StructureToolsWrapper } from './controls';
 import { StateObjectActionSelect } from './state/actions';
 import { BackgroundTaskProgress } from './task';
 import { Viewport, ViewportControls } from './viewport';
-import { StateTransform } from '../../mol-state';
+import { StateTransform } from '../mol-state';
 import { UpdateTransformControl } from './state/update-transform';
 import { SequenceView } from './sequence';
 import { Toasts } from './toast';
diff --git a/src/mol-plugin/ui/sequence.tsx b/src/mol-plugin-ui/sequence.tsx
similarity index 96%
rename from src/mol-plugin/ui/sequence.tsx
rename to src/mol-plugin-ui/sequence.tsx
index 183f8fd588ad60ce4a265833cd3c103dde905361..1ab7f214fdab49c0aa8b6955fa40b0ba797c2fd9 100644
--- a/src/mol-plugin/ui/sequence.tsx
+++ b/src/mol-plugin-ui/sequence.tsx
@@ -7,20 +7,20 @@
 
 import * as React from 'react'
 import { PluginUIComponent } from './base';
-import { PluginStateObject as PSO } from '../state/objects';
+import { PluginStateObject as PSO } from '../mol-plugin/state/objects';
 import { Sequence } from './sequence/sequence';
-import { Structure, StructureElement, StructureProperties as SP, Unit } from '../../mol-model/structure';
+import { Structure, StructureElement, StructureProperties as SP, Unit } from '../mol-model/structure';
 import { SequenceWrapper } from './sequence/wrapper';
 import { PolymerSequenceWrapper } from './sequence/polymer';
-import { StructureElementSelectionManager } from '../util/structure-element-selection';
-import { MarkerAction } from '../../mol-util/marker-action';
+import { StructureElementSelectionManager } from '../mol-plugin/util/structure-element-selection';
+import { MarkerAction } from '../mol-util/marker-action';
 import { PureSelectControl } from './controls/parameters';
-import { ParamDefinition as PD } from '../../mol-util/param-definition';
+import { ParamDefinition as PD } from '../mol-util/param-definition';
 import { HeteroSequenceWrapper } from './sequence/hetero';
-import { State, StateSelection } from '../../mol-state';
+import { State, StateSelection } from '../mol-state';
 import { ChainSequenceWrapper } from './sequence/chain';
 import { ElementSequenceWrapper } from './sequence/element';
-import { elementLabel } from '../../mol-theme/label';
+import { elementLabel } from '../mol-theme/label';
 
 const MaxDisplaySequenceLength = 5000
 
diff --git a/src/mol-plugin/ui/sequence/chain.ts b/src/mol-plugin-ui/sequence/chain.ts
similarity index 91%
rename from src/mol-plugin/ui/sequence/chain.ts
rename to src/mol-plugin-ui/sequence/chain.ts
index 727d5b47dd35e5ff13aaef502f25e0d624ceb5c0..b3e53700e3263f3dd3ed84a57a46962300ba4999 100644
--- a/src/mol-plugin/ui/sequence/chain.ts
+++ b/src/mol-plugin-ui/sequence/chain.ts
@@ -4,12 +4,12 @@
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
 
-import { Structure, StructureElement, StructureProperties } from '../../../mol-model/structure';
+import { Structure, StructureElement, StructureProperties } from '../../mol-model/structure';
 import { SequenceWrapper, StructureUnit } from './wrapper';
-import { OrderedSet, Interval } from '../../../mol-data/int';
-import { Loci } from '../../../mol-model/loci';
-import { ColorNames } from '../../../mol-util/color/names';
-import { MarkerAction, applyMarkerAction } from '../../../mol-util/marker-action';
+import { OrderedSet, Interval } from '../../mol-data/int';
+import { Loci } from '../../mol-model/loci';
+import { ColorNames } from '../../mol-util/color/names';
+import { MarkerAction, applyMarkerAction } from '../../mol-util/marker-action';
 
 export class ChainSequenceWrapper extends SequenceWrapper<StructureUnit> {
     private label: string
diff --git a/src/mol-plugin/ui/sequence/element.ts b/src/mol-plugin-ui/sequence/element.ts
similarity index 89%
rename from src/mol-plugin/ui/sequence/element.ts
rename to src/mol-plugin-ui/sequence/element.ts
index c1a881361f2e3de5024b9c53ce2ae5a85b2c0761..f0c26d40894d310d4f4d5a1540debd8f2cb28b2c 100644
--- a/src/mol-plugin/ui/sequence/element.ts
+++ b/src/mol-plugin-ui/sequence/element.ts
@@ -4,12 +4,12 @@
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
 
-import { Structure, StructureElement } from '../../../mol-model/structure';
+import { Structure, StructureElement } from '../../mol-model/structure';
 import { SequenceWrapper, StructureUnit } from './wrapper';
-import { OrderedSet, Interval } from '../../../mol-data/int';
-import { Loci } from '../../../mol-model/loci';
-import { ColorNames } from '../../../mol-util/color/names';
-import { MarkerAction, applyMarkerAction } from '../../../mol-util/marker-action';
+import { OrderedSet, Interval } from '../../mol-data/int';
+import { Loci } from '../../mol-model/loci';
+import { ColorNames } from '../../mol-util/color/names';
+import { MarkerAction, applyMarkerAction } from '../../mol-util/marker-action';
 
 export class ElementSequenceWrapper extends SequenceWrapper<StructureUnit> {
     private unitIndices: Map<number, Interval<StructureElement.UnitIndex>>
diff --git a/src/mol-plugin/ui/sequence/hetero.ts b/src/mol-plugin-ui/sequence/hetero.ts
similarity index 94%
rename from src/mol-plugin/ui/sequence/hetero.ts
rename to src/mol-plugin-ui/sequence/hetero.ts
index b677c0808808d00d93502d440d3609517720a880..ee3411faa0c10bec91701c45d451855a2e5bd479 100644
--- a/src/mol-plugin/ui/sequence/hetero.ts
+++ b/src/mol-plugin-ui/sequence/hetero.ts
@@ -4,12 +4,12 @@
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
 
-import { Structure, StructureElement, ResidueIndex, Unit } from '../../../mol-model/structure';
+import { Structure, StructureElement, ResidueIndex, Unit } from '../../mol-model/structure';
 import { SequenceWrapper, StructureUnit } from './wrapper';
-import { OrderedSet, Segmentation, Interval, SortedArray } from '../../../mol-data/int';
-import { Loci } from '../../../mol-model/loci';
-import { ColorNames } from '../../../mol-util/color/names';
-import { MarkerAction, applyMarkerAction } from '../../../mol-util/marker-action';
+import { OrderedSet, Segmentation, Interval, SortedArray } from '../../mol-data/int';
+import { Loci } from '../../mol-model/loci';
+import { ColorNames } from '../../mol-util/color/names';
+import { MarkerAction, applyMarkerAction } from '../../mol-util/marker-action';
 
 export class HeteroSequenceWrapper extends SequenceWrapper<StructureUnit> {
     private readonly unitMap: Map<number, Unit>
diff --git a/src/mol-plugin/ui/sequence/polymer.ts b/src/mol-plugin-ui/sequence/polymer.ts
similarity index 93%
rename from src/mol-plugin/ui/sequence/polymer.ts
rename to src/mol-plugin-ui/sequence/polymer.ts
index 8b799205b591f5006389e5d605c4bf49edc37f51..1402a8888735197aeb3f8d9b972a826a58142838 100644
--- a/src/mol-plugin/ui/sequence/polymer.ts
+++ b/src/mol-plugin-ui/sequence/polymer.ts
@@ -4,14 +4,14 @@
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
 
-import { StructureSelection, StructureQuery, Structure, Queries, StructureProperties as SP, StructureElement, Unit } from '../../../mol-model/structure';
+import { StructureSelection, StructureQuery, Structure, Queries, StructureProperties as SP, StructureElement, Unit } from '../../mol-model/structure';
 import { SequenceWrapper, StructureUnit } from './wrapper';
-import { OrderedSet, Interval, SortedArray } from '../../../mol-data/int';
-import { Loci } from '../../../mol-model/loci';
-import { Sequence } from '../../../mol-model/sequence';
-import { MissingResidues } from '../../../mol-model/structure/model/properties/common';
-import { ColorNames } from '../../../mol-util/color/names';
-import { MarkerAction, applyMarkerAction, applyMarkerActionAtPosition } from '../../../mol-util/marker-action';
+import { OrderedSet, Interval, SortedArray } from '../../mol-data/int';
+import { Loci } from '../../mol-model/loci';
+import { Sequence } from '../../mol-model/sequence';
+import { MissingResidues } from '../../mol-model/structure/model/properties/common';
+import { ColorNames } from '../../mol-util/color/names';
+import { MarkerAction, applyMarkerAction, applyMarkerActionAtPosition } from '../../mol-util/marker-action';
 
 export class PolymerSequenceWrapper extends SequenceWrapper<StructureUnit> {
     private readonly unitMap: Map<number, Unit>
diff --git a/src/mol-plugin/ui/sequence/sequence.tsx b/src/mol-plugin-ui/sequence/sequence.tsx
similarity index 97%
rename from src/mol-plugin/ui/sequence/sequence.tsx
rename to src/mol-plugin-ui/sequence/sequence.tsx
index fed58afc6fa3efa6bee0280c9767eaeeddcf4019..f1ef4b5ffbf1ac949c9b014479c349e5ae725ba2 100644
--- a/src/mol-plugin/ui/sequence/sequence.tsx
+++ b/src/mol-plugin-ui/sequence/sequence.tsx
@@ -7,15 +7,15 @@
 
 import * as React from 'react'
 import { PluginUIComponent } from '../base';
-import { Interactivity } from '../../util/interactivity';
-import { MarkerAction } from '../../../mol-util/marker-action';
-import { ButtonsType, ModifiersKeys, getButtons, getModifiers, getButton } from '../../../mol-util/input/input-observer';
+import { Interactivity } from '../../mol-plugin/util/interactivity';
+import { MarkerAction } from '../../mol-util/marker-action';
+import { ButtonsType, ModifiersKeys, getButtons, getModifiers, getButton } from '../../mol-util/input/input-observer';
 import { SequenceWrapper } from './wrapper';
-import { StructureElement, StructureProperties, Unit } from '../../../mol-model/structure';
+import { StructureElement, StructureProperties, Unit } from '../../mol-model/structure';
 import { Subject } from 'rxjs';
 import { debounceTime } from 'rxjs/operators';
-import { Color } from '../../../mol-util/color';
-import { OrderedSet } from '../../../mol-data/int';
+import { Color } from '../../mol-util/color';
+import { OrderedSet } from '../../mol-data/int';
 
 type SequenceProps = {
     sequenceWrapper: SequenceWrapper.Any,
diff --git a/src/mol-plugin/ui/sequence/wrapper.ts b/src/mol-plugin-ui/sequence/wrapper.ts
similarity index 74%
rename from src/mol-plugin/ui/sequence/wrapper.ts
rename to src/mol-plugin-ui/sequence/wrapper.ts
index acbc8ed178afd8a3892c570e2fa8bdbf0bedde2e..af84608b155445336f2b2a27cd9e82cdf56637b6 100644
--- a/src/mol-plugin/ui/sequence/wrapper.ts
+++ b/src/mol-plugin-ui/sequence/wrapper.ts
@@ -4,11 +4,11 @@
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
 
-import { Interval } from '../../../mol-data/int';
-import { Loci, isEveryLoci } from '../../../mol-model/loci';
-import { MarkerAction, applyMarkerAction } from '../../../mol-util/marker-action';
-import { StructureElement, Structure, Unit } from '../../../mol-model/structure';
-import { Color } from '../../../mol-util/color';
+import { Interval } from '../../mol-data/int';
+import { Loci, isEveryLoci } from '../../mol-model/loci';
+import { MarkerAction, applyMarkerAction } from '../../mol-util/marker-action';
+import { StructureElement, Structure, Unit } from '../../mol-model/structure';
+import { Color } from '../../mol-util/color';
 
 export type StructureUnit = { structure: Structure, units: Unit[] }
 
diff --git a/src/mol-plugin/ui/state/actions.tsx b/src/mol-plugin-ui/state/actions.tsx
similarity index 97%
rename from src/mol-plugin/ui/state/actions.tsx
rename to src/mol-plugin-ui/state/actions.tsx
index c7c353a9053f9fe6dc0f065dc4bc9b4aa5809561..7ec479d73d4663024b5521c3c16f4f3e4884c8b3 100644
--- a/src/mol-plugin/ui/state/actions.tsx
+++ b/src/mol-plugin-ui/state/actions.tsx
@@ -7,9 +7,9 @@
 import * as React from 'react';
 import { PluginUIComponent } from '../base';
 import { ApplyActionControl } from './apply-action';
-import { State, StateAction } from '../../../mol-state';
+import { State, StateAction } from '../../mol-state';
 import { Icon } from '../controls/common';
-import { PluginContext } from '../../context';
+import { PluginContext } from '../../mol-plugin/context';
 
 export class StateObjectActions extends PluginUIComponent<{ state: State, nodeRef: string, hideHeader?: boolean, initiallyCollapsed?: boolean, alwaysExpandFirst?: boolean }> {
     get current() {
diff --git a/src/mol-plugin/ui/state/animation.tsx b/src/mol-plugin-ui/state/animation.tsx
similarity index 100%
rename from src/mol-plugin/ui/state/animation.tsx
rename to src/mol-plugin-ui/state/animation.tsx
diff --git a/src/mol-plugin/ui/state/apply-action.tsx b/src/mol-plugin-ui/state/apply-action.tsx
similarity index 89%
rename from src/mol-plugin/ui/state/apply-action.tsx
rename to src/mol-plugin-ui/state/apply-action.tsx
index dea9d161387995309a09faca71290714ef05ac27..d950150608524840bd9d39eb12696d3b11b62675 100644
--- a/src/mol-plugin/ui/state/apply-action.tsx
+++ b/src/mol-plugin-ui/state/apply-action.tsx
@@ -4,12 +4,12 @@
  * @author David Sehnal <david.sehnal@gmail.com>
  */
 
-import { PluginCommands } from '../../../mol-plugin/command';
-import { PluginContext } from '../../../mol-plugin/context';
-import { State, StateTransform, StateAction } from '../../../mol-state';
-import { memoizeLatest } from '../../../mol-util/memoize';
+import { PluginCommands } from '../../mol-plugin/command';
+import { PluginContext } from '../../mol-plugin/context';
+import { State, StateTransform, StateAction } from '../../mol-state';
+import { memoizeLatest } from '../../mol-util/memoize';
 import { StateTransformParameters, TransformControlBase } from './common';
-import { ParamDefinition as PD } from '../../../mol-util/param-definition';
+import { ParamDefinition as PD } from '../../mol-util/param-definition';
 
 export { ApplyActionControl };
 
diff --git a/src/mol-plugin/ui/state/common.tsx b/src/mol-plugin-ui/state/common.tsx
similarity index 97%
rename from src/mol-plugin/ui/state/common.tsx
rename to src/mol-plugin-ui/state/common.tsx
index fe20b8a19e561eae9b37b5c428725a14f4e7083e..2165b7ff284dc16cbaddb3f1ca7536cc863ec5cc 100644
--- a/src/mol-plugin/ui/state/common.tsx
+++ b/src/mol-plugin-ui/state/common.tsx
@@ -4,12 +4,12 @@
  * @author David Sehnal <david.sehnal@gmail.com>
  */
 
-import { State, StateTransform, StateTransformer, StateAction, StateObject } from '../../../mol-state';
+import { State, StateTransform, StateTransformer, StateAction, StateObject } from '../../mol-state';
 import * as React from 'react';
 import { PurePluginUIComponent } from '../base';
 import { ParameterControls, ParamOnChange } from '../controls/parameters';
-import { PluginContext } from '../../../mol-plugin/context';
-import { ParamDefinition as PD } from '../../../mol-util/param-definition';
+import { PluginContext } from '../../mol-plugin/context';
+import { ParamDefinition as PD } from '../../mol-util/param-definition';
 import { Subject } from 'rxjs';
 import { Icon } from '../controls/common';
 
diff --git a/src/mol-plugin/ui/state/snapshots.tsx b/src/mol-plugin-ui/state/snapshots.tsx
similarity index 97%
rename from src/mol-plugin/ui/state/snapshots.tsx
rename to src/mol-plugin-ui/state/snapshots.tsx
index fac58cc1d4657ef4df166e4ea72fcf01078f7737..a74699a320d2a8e942736ccf161b55a9ec9bc396 100644
--- a/src/mol-plugin/ui/state/snapshots.tsx
+++ b/src/mol-plugin-ui/state/snapshots.tsx
@@ -4,17 +4,17 @@
  * @author David Sehnal <david.sehnal@gmail.com>
  */
 
-import { PluginCommands } from '../../command';
+import { PluginCommands } from '../../mol-plugin/command';
 import * as React from 'react';
 import { PluginUIComponent, PurePluginUIComponent } from '../base';
-import { shallowEqual } from '../../../mol-util';
+import { shallowEqual } from '../../mol-util';
 import { OrderedMap } from 'immutable';
 import { ParameterControls } from '../controls/parameters';
-import { ParamDefinition as PD} from '../../../mol-util/param-definition';
-import { PluginState } from '../../state';
-import { urlCombine } from '../../../mol-util/url';
+import { ParamDefinition as PD} from '../../mol-util/param-definition';
+import { PluginState } from '../../mol-plugin/state';
+import { urlCombine } from '../../mol-util/url';
 import { IconButton, Icon, SectionHeader } from '../controls/common';
-import { formatTimespan } from '../../../mol-util/now';
+import { formatTimespan } from '../../mol-util/now';
 
 export class StateSnapshots extends PluginUIComponent<{ }> {
     downloadToFile = () => {
diff --git a/src/mol-plugin/ui/state/tree.tsx b/src/mol-plugin-ui/state/tree.tsx
similarity index 98%
rename from src/mol-plugin/ui/state/tree.tsx
rename to src/mol-plugin-ui/state/tree.tsx
index 0c4a0762978571c37d844678d1f04e1f87d49242..9304c209d4c417e2dec367b05a7ed222153afad7 100644
--- a/src/mol-plugin/ui/state/tree.tsx
+++ b/src/mol-plugin-ui/state/tree.tsx
@@ -5,9 +5,9 @@
  */
 
 import * as React from 'react';
-import { PluginStateObject } from '../../../mol-plugin/state/objects';
-import { State, StateObject, StateTransform, StateObjectCell } from '../../../mol-state'
-import { PluginCommands } from '../../../mol-plugin/command';
+import { PluginStateObject } from '../../mol-plugin/state/objects';
+import { State, StateObject, StateTransform, StateObjectCell } from '../../mol-state'
+import { PluginCommands } from '../../mol-plugin/command';
 import { PluginUIComponent, _Props, _State } from '../base';
 import { Icon } from '../controls/common';
 
diff --git a/src/mol-plugin/ui/state/update-transform.tsx b/src/mol-plugin-ui/state/update-transform.tsx
similarity index 97%
rename from src/mol-plugin/ui/state/update-transform.tsx
rename to src/mol-plugin-ui/state/update-transform.tsx
index 7e3a896c5376e962e718278a485b98548bf49de9..a901b20c5885c8aad450fbf1846c946e07847c4f 100644
--- a/src/mol-plugin/ui/state/update-transform.tsx
+++ b/src/mol-plugin-ui/state/update-transform.tsx
@@ -4,8 +4,8 @@
  * @author David Sehnal <david.sehnal@gmail.com>
  */
 
-import { State, StateTransform, StateTransformer } from '../../../mol-state';
-import { memoizeLatest } from '../../../mol-util/memoize';
+import { State, StateTransform, StateTransformer } from '../../mol-state';
+import { memoizeLatest } from '../../mol-util/memoize';
 import { StateTransformParameters, TransformControlBase } from './common';
 import { Observable } from 'rxjs';
 import * as React from 'react';
diff --git a/src/mol-plugin/ui/structure/representation.tsx b/src/mol-plugin-ui/structure/representation.tsx
similarity index 91%
rename from src/mol-plugin/ui/structure/representation.tsx
rename to src/mol-plugin-ui/structure/representation.tsx
index 07fd61a6b078b6631f7e6ee2420791372bf5b973..63629702fb4816ecddb40819b17a42ac4fd890cd 100644
--- a/src/mol-plugin/ui/structure/representation.tsx
+++ b/src/mol-plugin-ui/structure/representation.tsx
@@ -6,18 +6,18 @@
 
 import * as React from 'react';
 import { PluginUIComponent, CollapsableState, CollapsableProps } from '../base';
-import { Structure, StructureElement } from '../../../mol-model/structure';
-import { isEmptyLoci } from '../../../mol-model/loci';
+import { Structure, StructureElement } from '../../mol-model/structure';
+import { isEmptyLoci } from '../../mol-model/loci';
 import { ParameterControls } from '../controls/parameters';
-import { Color } from '../../../mol-util/color';
+import { Color } from '../../mol-util/color';
 import { ButtonSelect, Options } from '../controls/common'
-import { ParamDefinition as PD } from '../../../mol-util/param-definition';
-import { VisualQuality, VisualQualityOptions } from '../../../mol-geo/geometry/base';
-import { StructureRepresentationPresets as P } from '../../util/structure-representation-helper';
-import { camelCaseToWords } from '../../../mol-util/string';
+import { ParamDefinition as PD } from '../../mol-util/param-definition';
+import { VisualQuality, VisualQualityOptions } from '../../mol-geo/geometry/base';
+import { StructureRepresentationPresets as P } from '../../mol-plugin/util/structure-representation-helper';
+import { camelCaseToWords } from '../../mol-util/string';
 import { CollapsableControls } from '../base';
-import { StateSelection, StateObject } from '../../../mol-state';
-import { PluginStateObject } from '../../state/objects';
+import { StateSelection, StateObject } from '../../mol-state';
+import { PluginStateObject } from '../../mol-plugin/state/objects';
 import { ColorOptions } from '../controls/color';
 
 interface BaseStructureRepresentationControlsState {
diff --git a/src/mol-plugin/ui/structure/selection.tsx b/src/mol-plugin-ui/structure/selection.tsx
similarity index 96%
rename from src/mol-plugin/ui/structure/selection.tsx
rename to src/mol-plugin-ui/structure/selection.tsx
index 26634a3ed6deaf122afea1906e4a43bd5a807353..89402f95945d08888f40fd0a0285acb4bf0198e3 100644
--- a/src/mol-plugin/ui/structure/selection.tsx
+++ b/src/mol-plugin-ui/structure/selection.tsx
@@ -6,14 +6,14 @@
 
 import * as React from 'react';
 import { CollapsableControls, CollapsableState } from '../base';
-import { StructureSelectionQueries, SelectionModifier } from '../../util/structure-selection-helper';
+import { StructureSelectionQueries, SelectionModifier } from '../../mol-plugin/util/structure-selection-helper';
 import { ButtonSelect, Options } from '../controls/common';
-import { PluginCommands } from '../../command';
-import { ParamDefinition as PD } from '../../../mol-util/param-definition';
-import { Interactivity } from '../../util/interactivity';
+import { PluginCommands } from '../../mol-plugin/command';
+import { ParamDefinition as PD } from '../../mol-util/param-definition';
+import { Interactivity } from '../../mol-plugin/util/interactivity';
 import { ParameterControls } from '../controls/parameters';
-import { stripTags } from '../../../mol-util/string';
-import { StructureElement } from '../../../mol-model/structure';
+import { stripTags } from '../../mol-util/string';
+import { StructureElement } from '../../mol-model/structure';
 
 const SSQ = StructureSelectionQueries
 const DefaultQueries: (keyof typeof SSQ)[] = [
diff --git a/src/mol-plugin/ui/task.tsx b/src/mol-plugin-ui/task.tsx
similarity index 95%
rename from src/mol-plugin/ui/task.tsx
rename to src/mol-plugin-ui/task.tsx
index 81c73ff9bbe184765a741fba9a45664e6770be08..dbfbd8192d201c3858e4039c720759e89dc9b5a3 100644
--- a/src/mol-plugin/ui/task.tsx
+++ b/src/mol-plugin-ui/task.tsx
@@ -7,9 +7,9 @@
 import * as React from 'react';
 import { PluginUIComponent } from './base';
 import { OrderedMap } from 'immutable';
-import { TaskManager } from '../../mol-plugin/util/task-manager';
+import { TaskManager } from '../mol-plugin/util/task-manager';
 import { filter } from 'rxjs/operators';
-import { Progress } from '../../mol-task';
+import { Progress } from '../mol-task';
 import { IconButton } from './controls/common';
 
 export class BackgroundTaskProgress extends PluginUIComponent<{ }, { tracked: OrderedMap<number, TaskManager.ProgressEvent> }> {
diff --git a/src/mol-plugin/ui/toast.tsx b/src/mol-plugin-ui/toast.tsx
similarity index 96%
rename from src/mol-plugin/ui/toast.tsx
rename to src/mol-plugin-ui/toast.tsx
index d32abccc7395e7cd3dfe1d9c36fbc1273f0a973d..ff5384d0fe55cafb2afa97870693518a938b4dac 100644
--- a/src/mol-plugin/ui/toast.tsx
+++ b/src/mol-plugin-ui/toast.tsx
@@ -8,7 +8,7 @@
 
 import * as React from 'react';
 import { PluginUIComponent } from './base';
-import { PluginToastManager } from '../state/toast';
+import { PluginToastManager } from '../mol-plugin/state/toast';
 import { IconButton } from './controls/common';
 
 class ToastEntry extends PluginUIComponent<{ entry: PluginToastManager.Entry }> {
diff --git a/src/mol-plugin/ui/viewport.tsx b/src/mol-plugin-ui/viewport.tsx
similarity index 97%
rename from src/mol-plugin/ui/viewport.tsx
rename to src/mol-plugin-ui/viewport.tsx
index e1a9486188daae6fb95b0cc01d0d49e9d25cbd48..f7225df55230da079532ed40d7c904412fea6b56 100644
--- a/src/mol-plugin/ui/viewport.tsx
+++ b/src/mol-plugin-ui/viewport.tsx
@@ -6,9 +6,9 @@
  */
 
 import * as React from 'react';
-import { resizeCanvas } from '../../mol-canvas3d/util';
-import { PluginCommands } from '../../mol-plugin/command';
-import { ParamDefinition as PD } from '../../mol-util/param-definition';
+import { resizeCanvas } from '../mol-canvas3d/util';
+import { PluginCommands } from '../mol-plugin/command';
+import { ParamDefinition as PD } from '../mol-util/param-definition';
 import { PluginUIComponent } from './base';
 import { ControlGroup, IconButton } from './controls/common';
 import { SimpleSettingsControl } from './viewport/simple-settings';
diff --git a/src/mol-plugin/ui/viewport/help.tsx b/src/mol-plugin-ui/viewport/help.tsx
similarity index 96%
rename from src/mol-plugin/ui/viewport/help.tsx
rename to src/mol-plugin-ui/viewport/help.tsx
index d7b9adc8804b0e7e6cf1b177710c75e753acbc31..10059480fef80440d06aee70a9e77e275f53c7af 100644
--- a/src/mol-plugin/ui/viewport/help.tsx
+++ b/src/mol-plugin-ui/viewport/help.tsx
@@ -5,11 +5,11 @@
  */
 
 import * as React from 'react';
-import { Binding } from '../../../mol-util/binding';
+import { Binding } from '../../mol-util/binding';
 import { PluginUIComponent } from '../base';
-import { StateTransformer, StateSelection } from '../../../mol-state';
-import { SelectLoci } from '../../behavior/dynamic/representation';
-import { StructureRepresentationInteraction } from '../../behavior/dynamic/selection/structure-representation-interaction';
+import { StateTransformer, StateSelection } from '../../mol-state';
+import { SelectLoci } from '../../mol-plugin/behavior/dynamic/representation';
+import { StructureRepresentationInteraction } from '../../mol-plugin/behavior/dynamic/selection/structure-representation-interaction';
 import { Icon } from '../controls/common';
 
 function getBindingsList(bindings: { [k: string]: Binding }) {
diff --git a/src/mol-plugin/ui/viewport/simple-settings.tsx b/src/mol-plugin-ui/viewport/simple-settings.tsx
similarity index 95%
rename from src/mol-plugin/ui/viewport/simple-settings.tsx
rename to src/mol-plugin-ui/viewport/simple-settings.tsx
index 8a51cbbd821269a9b1d7f48556479282e62a58e8..2062c6f4c9a8c89fedd7615b305961aee62a7a31 100644
--- a/src/mol-plugin/ui/viewport/simple-settings.tsx
+++ b/src/mol-plugin-ui/viewport/simple-settings.tsx
@@ -6,13 +6,13 @@
  */
 
 import * as React from 'react';
-import { Canvas3DParams } from '../../../mol-canvas3d/canvas3d';
-import { PluginCommands } from '../../command';
-import { ColorNames } from '../../../mol-util/color/names';
+import { Canvas3DParams } from '../../mol-canvas3d/canvas3d';
+import { PluginCommands } from '../../mol-plugin/command';
+import { ColorNames } from '../../mol-util/color/names';
 import { ParameterControls } from '../controls/parameters';
-import { ParamDefinition as PD } from '../../../mol-util/param-definition';
+import { ParamDefinition as PD } from '../../mol-util/param-definition';
 import { PluginUIComponent } from '../base';
-import { Color } from '../../../mol-util/color';
+import { Color } from '../../mol-util/color';
 
 const SimpleSettingsParams = {
     spin: Canvas3DParams.trackball.params.spin,
diff --git a/src/mol-plugin/context.ts b/src/mol-plugin/context.ts
index bba778050b465673de27417b3e753cab25eefd54..47d7c334bfdb35ce28aa66440c94ce24df5a0424 100644
--- a/src/mol-plugin/context.ts
+++ b/src/mol-plugin/context.ts
@@ -27,7 +27,7 @@ import { PluginLayout, LeftPanelTabName } from './layout';
 import { PluginSpec } from './spec';
 import { PluginState } from './state';
 import { DataFormatRegistry } from './state/actions/data-format';
-import { StateTransformParameters } from './ui/state/common';
+import { StateTransformParameters } from '../mol-plugin-ui/state/common';
 import { LociLabelEntry, LociLabelManager } from './util/loci-label-manager';
 import { TaskManager } from './util/task-manager';
 import { PLUGIN_VERSION, PLUGIN_VERSION_DATE } from './version';
diff --git a/src/mol-plugin/index.ts b/src/mol-plugin/index.ts
index 38d51836edf9428f2eb9480b5d1eda74ff0e1d8e..4ab0afb74d784bd380030e1ac1e923a946392b2c 100644
--- a/src/mol-plugin/index.ts
+++ b/src/mol-plugin/index.ts
@@ -6,7 +6,7 @@
  */
 
 import { PluginContext } from './context';
-import { Plugin } from './ui/plugin'
+import { Plugin } from '../mol-plugin-ui/plugin'
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import { PluginSpec } from './spec';
@@ -17,7 +17,7 @@ import { StateActions } from './state/actions';
 import { InitVolumeStreaming, BoxifyVolumeStreaming, CreateVolumeStreamingBehavior } from './behavior/dynamic/volume-streaming/transformers';
 import { StructureRepresentationInteraction } from './behavior/dynamic/selection/structure-representation-interaction';
 import { TransformStructureConformation } from './state/actions/structure';
-import { VolumeStreamingCustomControls } from './ui/custom/volume';
+import { VolumeStreamingCustomControls } from '../mol-plugin-ui/custom/volume';
 
 export const DefaultPluginSpec: PluginSpec = {
     actions: [
diff --git a/src/mol-plugin/spec.ts b/src/mol-plugin/spec.ts
index ad1370a530df52f74c82020b94c0cd2bff998d40..61c9a21f9b64317e8c095a738b284f0c77622fa0 100644
--- a/src/mol-plugin/spec.ts
+++ b/src/mol-plugin/spec.ts
@@ -6,7 +6,7 @@
  */
 
 import { StateTransformer, StateAction } from '../mol-state';
-import { StateTransformParameters } from './ui/state/common';
+import { StateTransformParameters } from '../mol-plugin-ui/state/common';
 import { PluginLayoutStateProps } from './layout';
 import { PluginStateAnimation } from './state/animation/model';
 import { ParamDefinition as PD } from '../mol-util/param-definition';