@webiny/app-admin 0.0.0-mt-1

package/ui/views/FormView/FormHeaderElement.js

@@ -0,0 +1,81 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+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 React from "react";
+import { css } from "emotion";
+import { Cell, Grid } from "@webiny/ui/Grid";
+import { Typography } from "@webiny/ui/Typography";
+import { UIElement } from "../../UIElement";
+import { Icon } from "@webiny/ui/Icon";
+var iconClass = /*#__PURE__*/css({
+  marginRight: 15,
+  color: "var(--mdc-theme-text-primary-on-background)"
+}, "label:iconClass;");
+var headerClass = /*#__PURE__*/css({
+  borderBottom: "1px solid var(--mdc-theme-on-background)",
+  color: "var(--mdc-theme-text-primary-on-background)"
+}, "label:headerClass;");
+var titleClass = /*#__PURE__*/css({
+  display: "flex",
+  alignItems: "center"
+}, "label:titleClass;");
+var actionsClass = /*#__PURE__*/css({
+  display: "flex",
+  justifyContent: "flex-end",
+  alignItems: "center"
+}, "label:actionsClass;");
+export var FormHeaderElement = /*#__PURE__*/function (_UIElement) {
+  _inherits(FormHeaderElement, _UIElement);
+
+  var _super = _createSuper(FormHeaderElement);
+
+  function FormHeaderElement(id, config) {
+    var _this;
+
+    _classCallCheck(this, FormHeaderElement);
+
+    _this = _super.call(this, id, config);
+
+    _this.useGrid(false);
+
+    return _this;
+  }
+
+  _createClass(FormHeaderElement, [{
+    key: "setIcon",
+    value: function setIcon(icon) {
+      this.config.icon = icon;
+    }
+  }, {
+    key: "addAction",
+    value: function addAction(element) {
+      this.addElement(element);
+    }
+  }, {
+    key: "render",
+    value: function render(props) {
+      var _this$config = this.config,
+          icon = _this$config.icon,
+          getTitle = _this$config.getTitle;
+      return /*#__PURE__*/React.createElement(Grid, {
+        className: headerClass
+      }, /*#__PURE__*/React.createElement(Cell, {
+        span: 6,
+        className: titleClass
+      }, /*#__PURE__*/React.createElement(React.Fragment, null, icon && /*#__PURE__*/React.createElement(Icon, {
+        className: iconClass,
+        icon: icon
+      }), /*#__PURE__*/React.createElement(Typography, {
+        use: "headline5"
+      }, getTitle(props)))), /*#__PURE__*/React.createElement(Cell, {
+        span: 6,
+        className: actionsClass
+      }, _get(_getPrototypeOf(FormHeaderElement.prototype), "render", this).call(this, props)));
+    }
+  }]);
+
+  return FormHeaderElement;
+}(UIElement);

package/ui/views/FormView.d.ts

@@ -0,0 +1,40 @@
+import { FormOnSubmit } from "@webiny/form";
+import { UIElement, UIElementConfig } from "../UIElement";
+import { FormElementRenderProps } from "../elements/form/FormElement";
+import { ButtonElement } from "../elements/ButtonElement";
+import { FormContentElement } from "./FormView/FormContentElement";
+import { FormHeaderElement } from "./FormView/FormHeaderElement";
+import { FormFooterElement } from "./FormView/FormFooterElement";
+import { FormContainerElement } from "./FormView/FormContainerElement";
+import { UIView } from "../UIView";
+export interface FormViewConfig extends UIElementConfig {
+    setupForm?: boolean;
+    onSubmit?: FormOnSubmit;
+    getTitle?: (props: FormElementRenderProps) => string;
+    getFormData?: () => Record<string, any>;
+    isLoading?: () => boolean;
+    onCancel?: () => void;
+    testId?: string;
+    noElevation?: boolean;
+    className?: string;
+}
+interface GetterWithProps<T> {
+    (props: FormElementRenderProps): T;
+}
+interface GetterWithoutProps<T> {
+    (): T;
+}
+export declare class FormView extends UIView<FormViewConfig> {
+    constructor(id: any, config?: FormViewConfig);
+    addElement<TElement extends UIElement = UIElement>(element: TElement): TElement;
+    setTitle(title: string | GetterWithProps<string>): void;
+    setOnSubmit(onSubmit: FormOnSubmit): void;
+    setFormData(getter: GetterWithoutProps<Record<string, any>>): void;
+    getFormContainer(): FormContainerElement;
+    getFormContentElement(): FormContentElement;
+    getFormHeaderElement(): FormHeaderElement;
+    getFormFooterElement(): FormFooterElement;
+    getSubmitButtonElement(): ButtonElement;
+    private addElements;
+}
+export {};

package/ui/views/FormView.js

@@ -0,0 +1,160 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+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 React from "react";
+import { CircularProgress } from "@webiny/ui/Progress";
+import { FormElement } from "../elements/form/FormElement";
+import { ButtonElement } from "../elements/ButtonElement";
+import { GenericElement } from "../elements/GenericElement";
+import { FormContentElement } from "./FormView/FormContentElement";
+import { FormHeaderElement } from "./FormView/FormHeaderElement";
+import { FormFooterElement } from "./FormView/FormFooterElement";
+import { FormContainerElement } from "./FormView/FormContainerElement";
+import { UIView } from "../UIView";
+export var FormView = /*#__PURE__*/function (_UIView) {
+  _inherits(FormView, _UIView);
+
+  var _super = _createSuper(FormView);
+
+  function FormView(id, config) {
+    var _this;
+
+    _classCallCheck(this, FormView);
+
+    if (!("setupForm" in config)) {
+      config.setupForm = true;
+    }
+
+    _this = _super.call(this, id, config);
+
+    _this.addElements();
+
+    _this.useGrid(false);
+
+    _this.applyPlugins(FormView);
+
+    return _this;
+  }
+
+  _createClass(FormView, [{
+    key: "addElement",
+    value: function addElement(element) {
+      if (element.id === "form" || element.id === "formContainer") {
+        return _get(_getPrototypeOf(FormView.prototype), "addElement", this).call(this, element);
+      }
+
+      return this.getFormContainer().addElement(element);
+    }
+  }, {
+    key: "setTitle",
+    value: function setTitle(title) {
+      if (typeof title === "string") {
+        this.config.getTitle = function () {
+          return title;
+        };
+      } else {
+        this.config.getTitle = title;
+      }
+    }
+  }, {
+    key: "setOnSubmit",
+    value: function setOnSubmit(onSubmit) {
+      this.config.onSubmit = onSubmit;
+    }
+  }, {
+    key: "setFormData",
+    value: function setFormData(getter) {
+      this.config.getFormData = getter;
+    }
+  }, {
+    key: "getFormContainer",
+    value: function getFormContainer() {
+      return this.getElement("formContainer");
+    }
+  }, {
+    key: "getFormContentElement",
+    value: function getFormContentElement() {
+      return this.getElement("formContent");
+    }
+  }, {
+    key: "getFormHeaderElement",
+    value: function getFormHeaderElement() {
+      return this.getElement("formHeader");
+    }
+  }, {
+    key: "getFormFooterElement",
+    value: function getFormFooterElement() {
+      return this.getElement("formFooter");
+    }
+  }, {
+    key: "getSubmitButtonElement",
+    value: function getSubmitButtonElement() {
+      return this.getFormFooterElement().getElement("submit");
+    }
+  }, {
+    key: "addElements",
+    value: function addElements() {
+      var _this2 = this;
+
+      var formContainer = new FormContainerElement("formContainer", {
+        testId: this.config.testId,
+        className: this.config.className,
+        noElevation: this.config.noElevation
+      });
+
+      if (this.config.setupForm) {
+        var form = this.addElement(new FormElement("form", {
+          onSubmit: function onSubmit(data, form) {
+            return _this2.config.onSubmit(data, form);
+          },
+          getData: function getData() {
+            return _this2.config.getFormData();
+          }
+        }));
+        form.addElement(formContainer);
+      } else {
+        this.addElement(formContainer);
+      }
+
+      this.addElement(new GenericElement("loading", function () {
+        if (typeof _this2.config.isLoading !== "function") {
+          return null;
+        }
+
+        return _this2.config.isLoading() ? /*#__PURE__*/React.createElement(CircularProgress, null) : null;
+      }));
+      this.addElement(new FormHeaderElement("formHeader", {
+        getTitle: function getTitle(props) {
+          return _this2.config.getTitle(props);
+        }
+      }));
+      this.addElement(new FormContentElement("formContent"));
+      var footer = new FormFooterElement("formFooter");
+      this.addElement(footer);
+      var submitButton = new ButtonElement("submit", {
+        type: "primary",
+        label: "Save",
+        onClick: function onClick(props) {
+          return props.formProps.submit();
+        }
+      });
+      submitButton.moveToTheEndOf(footer);
+      var cancelButton = footer.addElement(new ButtonElement("cancel", {
+        type: "default",
+        label: "Cancel",
+        onClick: function onClick() {
+          return _this2.config.onCancel();
+        },
+        shouldRender: function shouldRender() {
+          return typeof _this2.config.onCancel === "function";
+        }
+      }));
+      cancelButton.moveToTheBeginningOf(footer);
+    }
+  }]);
+
+  return FormView;
+}(UIView);

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

@@ -0,0 +1,10 @@
+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

@@ -0,0 +1,86 @@
+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);

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

@@ -0,0 +1,13 @@
+import React from "react";
+import { UIElement, UIElementConfig } from "../../UIElement";
+import { NavigationMenuElement } from "../../elements/NavigationMenuElement";
+interface FooterElementConfig extends UIElementConfig {
+    closeMenu: () => void;
+}
+export declare class FooterElement extends UIElement<FooterElementConfig> {
+    private _footerPlaceholder;
+    constructor(id: string, config: FooterElementConfig);
+    addMenuElement(element: NavigationMenuElement): NavigationMenuElement<import("../../elements/NavigationMenuElement").NavigationMenuElementConfig>;
+    render(props?: any): React.ReactNode;
+}
+export {};

package/ui/views/NavigationView/FooterElement.js

@@ -0,0 +1,57 @@
+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 { List, ListItem } from "@webiny/ui/List";
+import { UIElement } from "../../UIElement";
+import { GenericElement } from "../../elements/GenericElement";
+import { PlaceholderElement } from "../../elements/PlaceholderElement";
+import { MenuFooter, subFooter } from "./Styled";
+export var FooterElement = /*#__PURE__*/function (_UIElement) {
+  _inherits(FooterElement, _UIElement);
+
+  var _super = _createSuper(FooterElement);
+
+  function FooterElement(id, config) {
+    var _this;
+
+    _classCallCheck(this, FooterElement);
+
+    _this = _super.call(this, id, config);
+
+    _defineProperty(_assertThisInitialized(_this), "_footerPlaceholder", void 0);
+
+    _this.useGrid(false);
+
+    _this._footerPlaceholder = _this.addElement(new PlaceholderElement("navigation.footer.placeholder"));
+    new GenericElement("webiny.version", function () {
+      return /*#__PURE__*/React.createElement(ListItem, {
+        ripple: false,
+        className: subFooter
+      }, "Webiny v", process.env.REACT_APP_WEBINY_VERSION);
+    }).moveAfter(_this._footerPlaceholder);
+    return _this;
+  }
+
+  _createClass(FooterElement, [{
+    key: "addMenuElement",
+    value: function addMenuElement(element) {
+      element.moveBefore(this._footerPlaceholder);
+      return element;
+    }
+  }, {
+    key: "render",
+    value: function render(props) {
+      return /*#__PURE__*/React.createElement(MenuFooter, null, /*#__PURE__*/React.createElement(List, {
+        nonInteractive: true
+      }, _get(_getPrototypeOf(FooterElement.prototype), "render", this).call(this, props)));
+    }
+  }]);
+
+  return FooterElement;
+}(UIElement);

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

@@ -0,0 +1,16 @@
+import React from "react";
+import { UIElement, UIElementConfig } from "../../UIElement";
+export declare enum ElementID {
+    Logo = "headerLogo",
+    MenuButton = "headerMenuButton"
+}
+interface HeaderElementConfig extends UIElementConfig {
+    closeMenu: () => void;
+}
+export declare class HeaderElement extends UIElement<HeaderElementConfig> {
+    constructor(id: string, config: HeaderElementConfig);
+    setLogo(logo: React.ReactElement): void;
+    setMenuButton(menuButton: React.ReactElement): void;
+    render(props?: any): React.ReactNode;
+}
+export {};

package/ui/views/NavigationView/HeaderElement.js

@@ -0,0 +1,66 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+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 React from "react";
+import { UIElement } from "../../UIElement";
+import { DrawerHeader } from "@webiny/ui/Drawer";
+import { GenericElement } from "../../elements/GenericElement";
+import { PlaceholderElement } from "../../elements/PlaceholderElement";
+import { TopAppBarTitle } from "@webiny/ui/TopAppBar";
+import { MenuHeader, navHeader } from "./Styled";
+export var ElementID;
+
+(function (ElementID) {
+  ElementID["Logo"] = "headerLogo";
+  ElementID["MenuButton"] = "headerMenuButton";
+})(ElementID || (ElementID = {}));
+
+export var HeaderElement = /*#__PURE__*/function (_UIElement) {
+  _inherits(HeaderElement, _UIElement);
+
+  var _super = _createSuper(HeaderElement);
+
+  function HeaderElement(id, config) {
+    var _this;
+
+    _classCallCheck(this, HeaderElement);
+
+    _this = _super.call(this, id, config);
+
+    _this.useGrid(false);
+
+    _this.addElement(new PlaceholderElement(ElementID.MenuButton));
+
+    _this.addElement(new PlaceholderElement(ElementID.Logo));
+
+    return _this;
+  }
+
+  _createClass(HeaderElement, [{
+    key: "setLogo",
+    value: function setLogo(logo) {
+      this.getElement(ElementID.Logo).replaceWith(new GenericElement(ElementID.Logo, function () {
+        return /*#__PURE__*/React.createElement(TopAppBarTitle, null, logo);
+      }));
+    }
+  }, {
+    key: "setMenuButton",
+    value: function setMenuButton(menuButton) {
+      this.getElement(ElementID.MenuButton).replaceWith(new GenericElement(ElementID.MenuButton, function () {
+        return menuButton;
+      }));
+    }
+  }, {
+    key: "render",
+    value: function render(props) {
+      return /*#__PURE__*/React.createElement(DrawerHeader, {
+        className: navHeader
+      }, /*#__PURE__*/React.createElement(MenuHeader, null, _get(_getPrototypeOf(HeaderElement.prototype), "render", this).call(this, props)));
+    }
+  }]);
+
+  return HeaderElement;
+}(UIElement);

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

@@ -0,0 +1,6 @@
+import React from "react";
+import { UIRenderer, UIRenderParams } from "../../UIRenderer";
+import { NavigationView } from "../NavigationView";
+export declare class NavigationViewRenderer extends UIRenderer<NavigationView> {
+    render({ element, children }: UIRenderParams<NavigationView>): React.ReactNode;
+}

package/ui/views/NavigationView/NavigationViewRenderer.js

@@ -0,0 +1,38 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _createSuper from "@babel/runtime/helpers/createSuper";
+import React from "react";
+import { UIRenderer } from "../../UIRenderer";
+import { Drawer } from "@webiny/ui/Drawer";
+export var NavigationViewRenderer = /*#__PURE__*/function (_UIRenderer) {
+  _inherits(NavigationViewRenderer, _UIRenderer);
+
+  var _super = _createSuper(NavigationViewRenderer);
+
+  function NavigationViewRenderer() {
+    _classCallCheck(this, NavigationViewRenderer);
+
+    return _super.apply(this, arguments);
+  }
+
+  _createClass(NavigationViewRenderer, [{
+    key: "render",
+    value: function render(_ref) {
+      var element = _ref.element,
+          children = _ref.children;
+
+      var _element$getNavigatio = element.getNavigationHook(),
+          menuIsShown = _element$getNavigatio.menuIsShown,
+          hideMenu = _element$getNavigatio.hideMenu;
+
+      return /*#__PURE__*/React.createElement(Drawer, {
+        modal: true,
+        open: menuIsShown(),
+        onClose: hideMenu
+      }, children());
+    }
+  }]);
+
+  return NavigationViewRenderer;
+}(UIRenderer);

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

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export declare const MenuHeader: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "defaultValue" | "id" | "onError" | "className" | "onChange" | "placeholder" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "lang" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture">, object>;
+export declare const navHeader: string;
+export declare const navContent: string;
+export declare const logoStyle: string;
+export declare const MenuFooter: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "defaultValue" | "id" | "onError" | "className" | "onChange" | "placeholder" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "lang" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture">, object>;
+export declare const subFooter: string;

package/ui/views/NavigationView/Styled.js

@@ -0,0 +1,47 @@
+import styled from "@emotion/styled";
+import { css } from "emotion";
+export var MenuHeader = /*#__PURE__*/styled("div", {
+  target: "e1b4rzuv0",
+  label: "MenuHeader"
+})({
+  display: "flex",
+  alignItems: "center",
+  padding: 5,
+  backgroundColor: "var(--mdc-theme-surface)",
+  borderBottom: "1px solid var(--mdc-theme-on-background)"
+});
+export var navHeader = /*#__PURE__*/css({
+  padding: 0,
+  "&.mdc-drawer__header": {
+    padding: "0 !important",
+    minHeight: 0
+  }
+}, "label:navHeader;");
+export var navContent = /*#__PURE__*/css({
+  padding: "0 !important"
+}, "label:navContent;");
+export var logoStyle = /*#__PURE__*/css({
+  "&.mdc-top-app-bar__title": {
+    paddingLeft: 15,
+    ".webiny-logo": {
+      color: "var(--mdc-theme-primary)"
+    }
+  }
+}, "label:logoStyle;");
+export var MenuFooter = /*#__PURE__*/styled("div", {
+  target: "e1b4rzuv1",
+  label: "MenuFooter"
+})({
+  borderTop: "1px solid var(--mdc-theme-on-background)",
+  a: {
+    color: "var(--mdc-theme-text-on-primary)",
+    textDecoration: "none"
+  }
+});
+export var subFooter = /*#__PURE__*/css({
+  ".mdc-drawer &.mdc-list-item": {
+    borderTop: "1px solid var(--mdc-theme-on-background)",
+    padding: "10px 16px",
+    margin: 0
+  }
+}, "label:subFooter;");