@webiny/app-admin 0.0.0-mt-2 → 0.0.0-unstable.06b2ede40f

package/styles/material-theme-assignments.scss

@@ -1,333 +0,0 @@
-@use "~@material/top-app-bar/_mixins.scss" as topAppBar;
-@use "~@material/elevation/mixins" as elevation;
-@use "~@material/button/mixins" as button;
-@use "~@material/icon-button/mixins" as iconButton;
-@use "~@material/drawer/mixins" as drawer;
-@use "~@material/tab-bar/mixins" as tabBar;
-@use "~@material/tab/mixins" as tab;
-@use "~@material/tab-indicator/mixins" as tabIndicator;
-@use "~@material/list/mixins" as list;
-@use "~@material/switch/mixins" as switch;
-@use "~@material/textfield/mixins" as textfield;
-@use "~@material/select/mixins" as select;
-@use "~@material/checkbox/mixins" as checkbox;
-@use "~@material/radio/mixins" as radio;
-@use "~@material/snackbar/mixins" as snackbar;
-
-// top app bar should use theme-surface as the fill color
-.mdc-top-app-bar {
-  @include topAppBar.mdc-top-app-bar-fill-color($mdc-theme-surface);
-}
-
-.mdc-top-app-bar.primary {
-  @include topAppBar.mdc-top-app-bar-fill-color($mdc-theme-primary);
-}
-
-// elevation should use theme-surface as fill color so it can be used as surface
-.mdc-elevation--z1 {
-  @include elevation.mdc-elevation(1, $mdc-theme-on-surface);
-}
-
-.mdc-elevation--z2 {
-  @include elevation.mdc-elevation(2, $mdc-theme-on-surface);
-}
-
-.mdc-elevation--z3 {
-  @include elevation.mdc-elevation(3, $mdc-theme-on-surface);
-}
-
-.mdc-elevation--z1,
-.mdc-elevation--z2,
-.mdc-elevation--z3,
-.mdc-elevation--z4,
-.mdc-elevation--z5,
-.mdc-elevation--z6,
-.mdc-elevation--z7,
-.mdc-elevation--z8,
-.mdc-elevation--z9 {
-  background-color: $mdc-theme-surface;
-}
-
-// button styles
-.mdc-button {
-  @include button.mdc-button-shape-radius(2px);
-  .mdc-button__label {
-    display: flex;
-    align-items: center;
-  }
-}
-
-// set icon colors
-.mdc-icon,
-.mdc-icon-button {
-  @include iconButton.mdc-icon-button-ink-color($mdc-theme-text-secondary-on-background);
-}
-
-// drawer
-.mcd-drawer {
-  @include drawer.mdc-drawer-title-ink-color($mdc-theme-text-primary-on-background);
-  @include drawer.mdc-drawer-subtitle-ink-color($mdc-theme-text-primary-on-background);
-  @include drawer.mdc-drawer-item-icon-ink-color($mdc-theme-text-primary-on-background);
-  @include drawer.mdc-drawer-item-text-ink-color($mdc-theme-text-primary-on-background);
-  @include drawer.mdc-drawer-surface-fill-color($mdc-theme-surface);
-  @include drawer.mdc-drawer-item-shape-radius(0);
-}
-
-// fix for drawer positioning
-.mdc-drawer {
-  background-color: $mdc-theme-surface;
-  &.mdc-drawer--modal.mdc-drawer--open {
-    top: 0;
-    background-color: $mdc-theme-surface;
-  }
-}
-
-// fix drawer display so we can have a nice drawer footer
-.mdc-drawer--modal.mdc-drawer--open {
-  display: flex;
-}
-
-// tabs
-.mdc-tab-bar {
-  @include tabBar.mdc-tab-bar-width("100%");
-
-  .mdc-tab {
-    @include tab.mdc-tab-fixed-width("100px");
-    @include tab.mdc-tab-text-label-color($mdc-theme-text-primary-on-background);
-    @include tab.mdc-tab-icon-color($mdc-theme-text-primary-on-background);
-
-    // fixes tab width
-    flex: 1 0;
-  }
-
-  .mdc-tab-indicator {
-    @include tabIndicator.mdc-tab-indicator-underline-color($mdc-theme-primary);
-  }
-}
-
-// list
-.mdc-list {
-  @include list.mdc-list-item-primary-text-ink-color($mdc-theme-text-primary-on-background);
-  @include list.mdc-list-item-secondary-text-ink-color($mdc-theme-text-secondary-on-background);
-  @include list.mdc-list-item-graphic-ink-color($mdc-theme-text-secondary-on-background);
-  @include list.mdc-list-item-meta-ink-color($mdc-theme-text-secondary-on-background);
-  @include list.mdc-list-divider-color($mdc-theme-on-background);
-  @include list.mdc-list-group-subheader-ink-color($mdc-theme-text-primary-on-background);
-  @include list.mdc-list-item-shape-radius(0);
-
-  .mdc-list-item {
-    color: $mdc-theme-text-primary-on-background;
-  }
-
-  .mdc-list-item:hover,
-  .mdc-list-item::after,
-  .mdc-list-item::before {
-    background-color: transparent;
-  }
-  &:not(.mdc-list--non-interactive) {
-    .mdc-list-item:hover {
-      background-color: $mdc-theme-text-hint-on-dark;
-      cursor: pointer;
-    }
-    .mdc-list-item::after,
-    .mdc-list-item::before {
-      background-color: $mdc-theme-text-primary-on-background;
-    }
-  }
-}
-
-// switch
-.mdc-switch {
-  @include switch.mdc-switch-toggled-off-track-color($mdc-theme-on-surface);
-  margin-left: 5px;
-  margin-right: 10px;
-}
-
-// menu
-.mdc-menu {
-  background-color: $mdc-theme-surface;
-}
-
-/*
-Fix the width of input components when inside grids
- */
-.mdc-text-field {
-  width: 100%;
-  @include textfield.mdc-text-field-shape-radius(0);
-  @include textfield.mdc-text-field-textarea-shape-radius(0);
-  @include textfield.mdc-text-field-fill-color($mdc-theme-on-background);
-  @include textfield.mdc-text-field-label-color($mdc-theme-text-primary-on-background);
-  @include textfield.mdc-text-field-ink-color($mdc-theme-on-surface);
-  &.mdc-text-field--textarea {
-    textarea {
-      padding-top: 25px;
-    }
-    .mdc-floating-label.mdc-floating-label {
-      margin-left: 11px;
-      top: 35px;
-    }
-    &.--focused {
-      .mdc-floating-label.mdc-floating-label {
-        top: 0px;
-      }
-    }
-  }
-  &.mdc-text-field--disabled {
-    background-color: $mdc-theme-background;
-    opacity: 0.55;
-    .mdc-text-field__input {
-      color: $mdc-theme-text-primary-on-background;
-      &::placeholder {
-        color: $mdc-theme-text-primary-on-background;
-      }
-    }
-  }
-  .mdc-text-field__input {
-    width: 100%;
-    resize: none;
-    //border: 1px solid $mdc-theme-on-background;
-  }
-}
-
-// textfield helper - color fix
-.mdc-text-field-helper-text {
-  margin-left: 2px !important;
-  color: $mdc-theme-text-secondary-on-background;
-  &--error {
-    color: $webiny-theme-dark-primary !important;
-  }
-}
-
-// dialog
-.mdc-dialog {
-  z-index: 20;
-  .mdc-dialog__container {
-    width: 100%;
-  }
-  .mdc-dialog__surface {
-    border-radius: 0px;
-    max-width: 875px;
-    position: relative;
-    .mdc-dialog__title {
-      background-color: $mdc-theme-secondary;
-      padding-bottom: 20px;
-      font-size: 1.4rem;
-      font-weight: 600;
-      color: $mdc-theme-on-secondary;
-    }
-    .mdc-dialog__content {
-      color: $mdc-theme-text-primary-on-background;
-      max-height: 70vh;
-      overflow: auto;
-      margin-top: 0;
-      padding-top: 24px;
-      background-color: $mdc-theme-surface;
-
-      // add options for when tabs are inside the body
-      > .webiny-ui-tabs {
-        margin: -24px;
-        > .mdc-tab-bar {
-          position: absolute;
-          z-index: 10;
-          @include tabBar.mdc-tab-bar-width(100%);
-          background-color: $mdc-theme-secondary;
-          .mdc-tab {
-            @include tab.mdc-tab-text-label-color($mdc-theme-on-secondary);
-            @include tab.mdc-tab-icon-color($mdc-theme-on-secondary);
-            @include tab.mdc-tab-fixed-width(100px);
-            justify-content: flex-start;
-            font-weight: 600;
-          }
-          .mdc-tab-indicator {
-            padding-bottom: 5px;
-            margin-top: -1px;
-            @include tabIndicator.mdc-tab-indicator-underline-color($mdc-theme-on-secondary);
-            background-color: $mdc-theme-secondary;
-          }
-        }
-        > .webiny-ui-tabs__content {
-          padding-top: 50px;
-          padding-bottom: 25px;
-        }
-      }
-    }
-    .mdc-dialog__actions {
-      border-top: 1px solid $mdc-theme-on-background;
-      background-color: $mdc-theme-surface;
-      padding: 24px;
-    }
-  }
-  &.mdc-dialog--open .mdc-dialog__scrim {
-    opacity: 0.7;
-    background-color: var(--mdc-theme-on-surface);
-  }
-}
-
-// select
-.mdc-select {
-  width: 100%;
-  @include select.mdc-select-ink-color($mdc-theme-text-primary-on-background);
-  @include select.mdc-select-label-color($mdc-theme-text-secondary-on-background);
-  @include select.mdc-select-bottom-line-color($mdc-theme-text-secondary-on-background);
-  @include select.mdc-select-hover-bottom-line-color($mdc-theme-text-primary-on-background);
-  @include select.mdc-select-container-fill-color($mdc-theme-on-background);
-  @include select.mdc-select-shape-radius(0);
-  @include select.mdc-select-outline-shape-radius(2);
-
-  /*
-  Fix for select box appearance. For some reason browser prefix css attributes are striped away.
-   */
-  .mdc-select__native-control {
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    border-radius: 2px;
-  }
-
-  &.mdc-select--box {
-    border-radius: 2px;
-    .mdc-select__native-control {
-      padding-top: 10px;
-    }
-  }
-
-  .mdc-select__dropdown-icon {
-    bottom: 50%;
-    transform: translateY(50%);
-  }
-}
-
-// checkbox
-.mdc-checkbox {
-  @include checkbox.mdc-checkbox-container-colors("text-secondary-on-background");
-}
-
-// radio button
-.mdc-radio {
-  @include radio.mdc-radio-unchecked-stroke-color("text-secondary-on-background");
-}
-
-// snackbar
-.mdc-snackbar {
-  @include snackbar.mdc-snackbar-shape-radius(2px);
-  @include snackbar.mdc-snackbar-z-index(1000);
-}
-.mdc-snackbar__action:not(:disabled) {
-  color: var(--mdc-theme-primary);
-  &::before {
-    background-color: var(--mdc-theme-primary);
-  }
-  &::after {
-    background-color: var(--mdc-theme-primary);
-  }
-}
-
-// when grid is inside another grid cell, child grid should not have any padding
-.mdc-layout-grid {
-  > .mdc-layout-grid__inner {
-    > .mdc-layout-grid__cell {
-      > .mdc-layout-grid {
-        padding: 0;
-      }
-    }
-  }
-}

package/styles/material.scss

@@ -1,74 +0,0 @@
-@use "~@material/theme/mixins" as themeMixins;
-
-// material variables
-$mdc-theme-primary: $webiny-theme-light-primary;
-$mdc-theme-on-primary: $webiny-theme-light-on-primary;
-$mdc-theme-secondary: $webiny-theme-light-secondary;
-$mdc-theme-on-secondary: $webiny-theme-light-on-secondary;
-$mdc-theme-surface: $webiny-theme-light-surface;
-$mdc-theme-on-surface: $webiny-theme-light-on-surface;
-$mdc-theme-background: $webiny-theme-light-background;
-$mdc-theme-on-background: $webiny-theme-light-on-background;
-$mdc-theme-text-primary-on-background: $webiny-theme-light-text-primary-on-background !global;
-$mdc-theme-text-secondary-on-background: $webiny-theme-light-text-secondary-on-background;
-$mdc-theme-text-hint-on-dark: $webiny-theme-light-text-hint-on-dark;
-$mdc-typography-font-family: $webiny-theme-typography-font-family;
-
-@import "~material-components-web/material-components-web.scss";
-@import "material-theme-assignments.scss";
-
-body {
-  background-color: $mdc-theme-background;
-  min-height: 100vh;
-
-  // assign all the sass variables in css variables
-  --mdc-theme-primary: #{$mdc-theme-primary};
-  --mdc-theme-secondary: #{$mdc-theme-secondary};
-  --mdc-theme-background: #{$mdc-theme-background};
-  --mdc-theme-surface: #{$mdc-theme-surface};
-  --mdc-theme-on-primary: #{$mdc-theme-on-primary};
-  --mdc-theme-on-secondary: #{$mdc-theme-on-secondary};
-  --mdc-theme-on-surface: #{$mdc-theme-on-surface};
-  --mdc-theme-on-background: #{$mdc-theme-on-background};
-  --mdc-theme-text-primary-on-background: #{$mdc-theme-text-primary-on-background};
-  --mdc-theme-text-secondary-on-background: #{$mdc-theme-text-secondary-on-background};
-  --mdc-theme-text-hint-on-dark: #{$mdc-theme-text-hint-on-dark};
-  --mdc-theme-caret-down: #{$webiny-theme-light-caret-down};
-
-  font-family: "Source Sans Pro";
-}
-
-body.dark-theme {
-  $mdc-theme-primary: $webiny-theme-dark-primary;
-  $mdc-theme-on-primary: $webiny-theme-dark-on-primary;
-  $mdc-theme-secondary: $webiny-theme-dark-secondary;
-  $mdc-theme-on-secondary: $webiny-theme-dark-on-secondary;
-  $mdc-theme-surface: $webiny-theme-dark-surface;
-  $mdc-theme-on-surface: $webiny-theme-dark-on-surface;
-  $mdc-theme-background: $webiny-theme-dark-background;
-  $mdc-theme-on-background: $webiny-theme-dark-on-background;
-  $mdc-theme-text-secondary-on-background: $webiny-theme-dark-text-secondary-on-background;
-  $mdc-theme-text-primary-on-background: $webiny-theme-dark-text-primary-on-background;
-  $mdc-theme-text-hint-on-dark: $webiny-theme-dark-text-hint-on-dark;
-
-  @include themeMixins.mdc-theme-prop("on-primary", $webiny-theme-dark-text-primary-on-background);
-
-  background-color: $mdc-theme-background;
-
-  // assign all the sass variables in css variables
-  --mdc-theme-primary: #{$mdc-theme-primary};
-  --mdc-theme-secondary: #{$mdc-theme-secondary};
-  --mdc-theme-background: #{$mdc-theme-background};
-  --mdc-theme-surface: #{$mdc-theme-surface};
-  --mdc-theme-on-primary: #{$mdc-theme-on-primary};
-  --mdc-theme-on-secondary: #{$mdc-theme-on-secondary};
-  --mdc-theme-on-surface: #{$mdc-theme-on-surface};
-  --mdc-theme-on-background: #{$mdc-theme-on-background};
-  --mdc-theme-text-primary-on-background: #{$mdc-theme-text-primary-on-background};
-  --mdc-theme-text-secondary-on-background: #{$mdc-theme-text-secondary-on-background};
-  --mdc-theme-text-hint-on-dark: #{$mdc-theme-text-hint-on-dark};
-  --mdc-theme-caret-down: #{$webiny-theme-dark-caret-down};
-
-  @import "~@material/textfield/mdc-text-field";
-  @import "material-theme-assignments.scss";
-}

package/styles/theme.scss

@@ -1,43 +0,0 @@
-// webiny light theme
-$webiny-theme-light-primary: #fa5723 !default;
-$webiny-theme-light-secondary: #00ccb0 !default;
-$webiny-theme-light-background: #f2f2f2 !default;
-$webiny-theme-light-surface: #fff !default;
-$webiny-theme-light-on-primary: #ffffff !default;
-$webiny-theme-light-on-secondary: #ffffff !default;
-$webiny-theme-light-on-surface: #000000 !default;
-$webiny-theme-light-on-background: rgba(212, 212, 212, 0.5) !default;
-$webiny-theme-light-text-primary-on-background: rgba(0, 0, 0, 0.87);
-$webiny-theme-light-text-secondary-on-background: rgba(0, 0, 0, 0.54);
-$webiny-theme-light-text-hint-on-dark: rgba(255, 255, 255, 0.5);
-$webiny-theme-light-caret-down: url("data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%23000000%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.54%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E");
-
-// webiny dark theme
-$webiny-theme-dark-primary: #fa5723 !default;
-$webiny-theme-dark-secondary: #00ccb0 !default;
-$webiny-theme-dark-background: #121212 !default;
-$webiny-theme-dark-surface: #242424 !default;
-$webiny-theme-dark-on-primary: #ffffff !default;
-$webiny-theme-dark-on-secondary: #ffffff !default;
-$webiny-theme-dark-on-surface: #ffffff !default;
-$webiny-theme-dark-on-background: rgba(255, 255, 255, 0.15) !default;
-$webiny-theme-dark-text-primary-on-background: rgba(255, 255, 255, 0.87);
-$webiny-theme-dark-text-secondary-on-background: rgba(255, 255, 255, 0.54);
-$webiny-theme-dark-text-hint-on-dark: rgba(255, 255, 255, 0.15);
-$webiny-theme-dark-caret-down: url("data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%23FFFFFF%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.54%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E");
-
-// webiny typography
-$webiny-theme-typography-font-family: "Source Sans Pro" !default;
-
-// import required fonts
-@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700|Open+Sans:300,400,600,700|Source+Code+Pro:400,700");
-//@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700|Open+Sans:300,400,600,700|Source+Code+Pro:400,700");
-
-body {
-  font-size: 16px;
-}
-
-a {
-  color: var(--webiny-theme-color-primary, #ee896b);
-  text-decoration: none;
-}

package/ui/views/AdminView/components/Snackbar.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-declare const SnackbarMain: () => JSX.Element;
-export default SnackbarMain;

package/ui/views/AdminView/components/Snackbar.js

@@ -1,28 +0,0 @@
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _get from "lodash/get";
-import React, { useCallback } from "react";
-import { Snackbar } from "@webiny/ui/Snackbar";
-import { useUi } from "@webiny/app/hooks/useUi";
-
-var SnackbarMain = function SnackbarMain() {
-  var ui = useUi();
-
-  var message = _get(ui, "snackbar.message");
-
-  var options = _get(ui, "snackbar.options", {});
-
-  var hideSnackbar = useCallback(function () {
-    ui.setState(function (ui) {
-      return _objectSpread(_objectSpread({}, ui), {}, {
-        snackbar: null
-      });
-    });
-  }, [ui]);
-  return /*#__PURE__*/React.createElement(Snackbar, Object.assign({
-    open: !!message,
-    onClose: hideSnackbar,
-    message: message
-  }, options));
-};
-
-export default SnackbarMain;

package/ui/views/AdminView.d.ts

@@ -1,12 +0,0 @@
-import { UIView } from "../UIView";
-import { UIElement } from "../UIElement";
-import { HeaderElement } from "./AdminView/HeaderElement";
-import { ContentElement } from "./AdminView/ContentElement";
-export declare class AdminView extends UIView {
-    private _title;
-    constructor();
-    setTitle(title: string): void;
-    setContentElement(element: UIElement): void;
-    getHeaderElement(): HeaderElement;
-    getContentElement(): ContentElement;
-}

package/ui/views/AdminView.js

@@ -1,90 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _createSuper from "@babel/runtime/helpers/createSuper";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from "react";
-import Helmet from "react-helmet";
-import { UIView } from "../UIView";
-import { GenericElement } from "../elements/GenericElement";
-import { ViewElement } from "../elements/ViewElement";
-import { HeaderElement } from "./AdminView/HeaderElement";
-import { ContentElement } from "./AdminView/ContentElement";
-import { NavigationView } from "./NavigationView";
-import Snackbar from "./AdminView/components/Snackbar";
-import { DialogContainer } from "./AdminView/components/Dialog";
-export var AdminView = /*#__PURE__*/function (_UIView) {
-  _inherits(AdminView, _UIView);
-
-  var _super = _createSuper(AdminView);
-
-  function AdminView() {
-    var _this;
-
-    _classCallCheck(this, AdminView);
-
-    _this = _super.call(this, "AdminView");
-
-    _defineProperty(_assertThisInitialized(_this), "_title", void 0);
-
-    _this.useGrid(false);
-
-    _this.addElement(new GenericElement("helmet", function () {
-      return _this._title ? /*#__PURE__*/React.createElement(Helmet, {
-        title: _this._title
-      }) : null;
-    }));
-
-    _this.addElement(new HeaderElement("header"));
-
-    _this.addElement(new ContentElement("content"));
-
-    _this.addElement(new ViewElement("navigation", {
-      view: new NavigationView()
-    }));
-
-    _this.addElement(new GenericElement("snackbarContainer", function () {
-      return /*#__PURE__*/React.createElement(Snackbar, null);
-    }));
-
-    _this.addElement(new GenericElement("dialogContainer", function () {
-      return /*#__PURE__*/React.createElement(DialogContainer, null);
-    })); // Apply plugins
-
-
-    _this.applyPlugins(AdminView);
-
-    return _this;
-  }
-
-  _createClass(AdminView, [{
-    key: "setTitle",
-    value: function setTitle(title) {
-      this._title = title;
-    }
-  }, {
-    key: "setContentElement",
-    value: function setContentElement(element) {
-      var content = this.getContentElement(); // Remove previous content
-
-      content.getChildren().forEach(function (el) {
-        return el.remove();
-      }); // Add new content
-
-      content.addElement(element);
-    }
-  }, {
-    key: "getHeaderElement",
-    value: function getHeaderElement() {
-      return this.getElement("header");
-    }
-  }, {
-    key: "getContentElement",
-    value: function getContentElement() {
-      return this.getElement("content");
-    }
-  }]);
-
-  return AdminView;
-}(UIView);

package/ui/views/NavigationView/ContentElement.d.ts

@@ -1,10 +0,0 @@
-import React from "react";
-import { UIElement } from "../../UIElement";
-export declare class ContentElement extends UIElement {
-    private _sorters;
-    constructor(id: string);
-    addElement<TElement extends UIElement = UIElement>(element: TElement): TElement;
-    addSorter(sorter: Function): void;
-    render(props?: any): React.ReactNode;
-    private runSorters;
-}

package/ui/views/NavigationView/ContentElement.js

@@ -1,86 +0,0 @@
-import _createForOfIteratorHelper from "@babel/runtime/helpers/createForOfIteratorHelper";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _get from "@babel/runtime/helpers/get";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _createSuper from "@babel/runtime/helpers/createSuper";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from "react";
-import { UIElement } from "../../UIElement";
-import { DrawerContent } from "@webiny/ui/Drawer";
-import { navContent } from "./Styled";
-import { TAGS } from "../../elements/NavigationMenuElement";
-export var ContentElement = /*#__PURE__*/function (_UIElement) {
-  _inherits(ContentElement, _UIElement);
-
-  var _super = _createSuper(ContentElement);
-
-  function ContentElement(id) {
-    var _this;
-
-    _classCallCheck(this, ContentElement);
-
-    _this = _super.call(this, id);
-
-    _defineProperty(_assertThisInitialized(_this), "_sorters", []);
-
-    _this.useGrid(false);
-
-    _this.addSorter(function (a, b) {
-      if (a.hasTag(TAGS.APP) && b.hasTag(TAGS.UTILS)) {
-        return -1;
-      }
-
-      if (a.hasTag(TAGS.UTILS) && b.hasTag(TAGS.APP)) {
-        return 1;
-      }
-
-      return a.config.label.localeCompare(b.config.label);
-    });
-
-    return _this;
-  }
-
-  _createClass(ContentElement, [{
-    key: "addElement",
-    value: function addElement(element) {
-      _get(_getPrototypeOf(ContentElement.prototype), "addElement", this).call(this, element);
-
-      this.runSorters();
-      return element;
-    }
-  }, {
-    key: "addSorter",
-    value: function addSorter(sorter) {
-      this._sorters.push(sorter);
-    }
-  }, {
-    key: "render",
-    value: function render(props) {
-      return /*#__PURE__*/React.createElement(DrawerContent, {
-        className: navContent
-      }, _get(_getPrototypeOf(ContentElement.prototype), "render", this).call(this, props));
-    }
-  }, {
-    key: "runSorters",
-    value: function runSorters() {
-      var _iterator = _createForOfIteratorHelper(this._sorters),
-          _step;
-
-      try {
-        for (_iterator.s(); !(_step = _iterator.n()).done;) {
-          var sorter = _step.value;
-          this.getLayout().sort(sorter);
-        }
-      } catch (err) {
-        _iterator.e(err);
-      } finally {
-        _iterator.f();
-      }
-    }
-  }]);
-
-  return ContentElement;
-}(UIElement);