@webiny/app-headless-cms 0.0.0-mt-1

package/admin/plugins/definitions/CmsFieldValidatorFileTypePlugin.js

@@ -0,0 +1,36 @@
+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 { Plugin } from "@webiny/plugins/Plugin";
+export var CmsFieldValidatorFileTypePlugin = /*#__PURE__*/function (_Plugin) {
+  _inherits(CmsFieldValidatorFileTypePlugin, _Plugin);
+
+  var _super = _createSuper(CmsFieldValidatorFileTypePlugin);
+
+  function CmsFieldValidatorFileTypePlugin(config) {
+    var _this;
+
+    _classCallCheck(this, CmsFieldValidatorFileTypePlugin);
+
+    _this = _super.call(this);
+
+    _defineProperty(_assertThisInitialized(_this), "config", void 0);
+
+    _this.config = config;
+    return _this;
+  }
+
+  _createClass(CmsFieldValidatorFileTypePlugin, [{
+    key: "getName",
+    value: function getName() {
+      return this.config.name;
+    }
+  }]);
+
+  return CmsFieldValidatorFileTypePlugin;
+}(Plugin);
+
+_defineProperty(CmsFieldValidatorFileTypePlugin, "type", "cms-model-field-validator-fileType");

package/admin/plugins/editor/defaultBar/BackButton.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const BackButton: React.MemoExoticComponent<() => JSX.Element>;
+export default BackButton;

package/admin/plugins/editor/defaultBar/BackButton.js

@@ -0,0 +1,21 @@
+import React from "react";
+import { css } from "emotion";
+import { IconButton } from "@webiny/ui/Button";
+import { useRouter } from "@webiny/react-router";
+import { ReactComponent as BackIcon } from "@svgr/webpack!./icons/round-arrow_back-24px.svg";
+var backStyles = /*#__PURE__*/css({
+  marginLeft: -10
+}, "label:backStyles;");
+var BackButton = /*#__PURE__*/React.memo(function () {
+  var router = useRouter();
+  return /*#__PURE__*/React.createElement(IconButton, {
+    "data-testid": "cms-editor-back-button",
+    className: backStyles,
+    onClick: function onClick() {
+      return router.history.push("/cms/content-models");
+    },
+    icon: /*#__PURE__*/React.createElement(BackIcon, null)
+  });
+});
+BackButton.displayName = "BackButton";
+export default BackButton;

package/admin/plugins/editor/defaultBar/CreateContentButton.d.ts

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

package/admin/plugins/editor/defaultBar/CreateContentButton.js

@@ -0,0 +1,46 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject;
+
+import React from "react";
+import get from "lodash/get";
+import { useRouter } from "@webiny/react-router";
+import { i18n } from "@webiny/app/i18n";
+import { IconButton } from "@webiny/ui/Button";
+import { Tooltip } from "@webiny/ui/Tooltip";
+import { ReactComponent as ViewListIcon } from "@svgr/webpack!../../../icons/view_list.svg";
+import { GET_CONTENT_MODEL } from "../../../graphql/contentModels";
+import { useContentModelEditor } from "../../../components/ContentModelEditor/useContentModelEditor";
+var t = i18n.namespace("app-headless-cms/admin/editor/top-bar/save-button");
+
+var CreateContentButton = function CreateContentButton() {
+  var router = useRouter();
+
+  var _useContentModelEdito = useContentModelEditor(),
+      data = _useContentModelEdito.data,
+      apolloClient = _useContentModelEdito.apolloClient;
+
+  var getQuery = apolloClient.readQuery({
+    query: GET_CONTENT_MODEL,
+    variables: {
+      modelId: data.modelId
+    }
+  });
+  var fields = get(getQuery, "getContentModel.data.fields", []);
+  var disableViewContent = fields.length === 0;
+  var message = disableViewContent ? "To view the content, you first need to add a field and save the form" : "View content";
+  return /*#__PURE__*/React.createElement(Tooltip, {
+    content: t(_templateObject || (_templateObject = _taggedTemplateLiteral(["{message}"])))({
+      message: message
+    }),
+    placement: "bottom"
+  }, /*#__PURE__*/React.createElement(IconButton, {
+    icon: /*#__PURE__*/React.createElement(ViewListIcon, null),
+    onClick: function onClick() {
+      return router.history.push("/cms/content-entries/".concat(data.modelId));
+    },
+    disabled: disableViewContent
+  }));
+};
+
+export default CreateContentButton;

package/admin/plugins/editor/defaultBar/Divider.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const Divider: 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" | "onBlur" | "onClick" | "onContextMenu" | "onCopy" | "onCut" | "onAuxClick" | "onDoubleClick" | "onDragEnd" | "onDragStart" | "onDrop" | "onFocus" | "onInput" | "onInvalid" | "onKeyDown" | "onKeyPress" | "onKeyUp" | "onMouseDown" | "onMouseUp" | "onPaste" | "onPause" | "onPlay" | "onPointerCancel" | "onPointerDown" | "onPointerUp" | "onRateChange" | "onReset" | "onSeeked" | "onSubmit" | "onTouchCancel" | "onTouchEnd" | "onTouchStart" | "onVolumeChange" | "onAbort" | "onAnimationEnd" | "onAnimationIteration" | "onAnimationStart" | "onCanPlay" | "onCanPlayThrough" | "onDrag" | "onDragEnter" | "onDragExit" | "onDragLeave" | "onDragOver" | "onDurationChange" | "onEmptied" | "onEncrypted" | "onEnded" | "onGotPointerCapture" | "onLoad" | "onLoadedData" | "onLoadedMetadata" | "onLoadStart" | "onLostPointerCapture" | "onMouseMove" | "onMouseOut" | "onMouseOver" | "onPlaying" | "onPointerMove" | "onPointerOut" | "onPointerOver" | "onProgress" | "onScroll" | "onSeeking" | "onStalled" | "onSuspend" | "onTimeUpdate" | "onTouchMove" | "onTransitionEnd" | "onWaiting" | "onWheel" | "onMouseEnter" | "onMouseLeave" | "onPointerEnter" | "onPointerLeave" | "onChange" | "onSelect" | "onBeforeInput" | "onCompositionEnd" | "onCompositionStart" | "onCompositionUpdate" | "placeholder" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "lang" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "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" | "onCopyCapture" | "onCutCapture" | "onPasteCapture" | "onCompositionEndCapture" | "onCompositionStartCapture" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInputCapture" | "onInputCapture" | "onResetCapture" | "onSubmitCapture" | "onInvalidCapture" | "onLoadCapture" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbortCapture" | "onCanPlayCapture" | "onCanPlayThroughCapture" | "onDurationChangeCapture" | "onEmptiedCapture" | "onEncryptedCapture" | "onEndedCapture" | "onLoadedDataCapture" | "onLoadedMetadataCapture" | "onLoadStartCapture" | "onPauseCapture" | "onPlayCapture" | "onPlayingCapture" | "onProgressCapture" | "onRateChangeCapture" | "onSeekedCapture" | "onSeekingCapture" | "onStalledCapture" | "onSuspendCapture" | "onTimeUpdateCapture" | "onVolumeChangeCapture" | "onWaitingCapture" | "onAuxClickCapture" | "onClickCapture" | "onContextMenuCapture" | "onDoubleClickCapture" | "onDragCapture" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStartCapture" | "onDropCapture" | "onMouseDownCapture" | "onMouseMoveCapture" | "onMouseOutCapture" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDownCapture" | "onPointerMoveCapture" | "onPointerUpCapture" | "onPointerCancelCapture" | "onPointerEnterCapture" | "onPointerLeaveCapture" | "onPointerOverCapture" | "onPointerOutCapture" | "onGotPointerCaptureCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheelCapture" | "onAnimationStartCapture" | "onAnimationEndCapture" | "onAnimationIterationCapture" | "onTransitionEndCapture">, object>;
+export default Divider;

package/admin/plugins/editor/defaultBar/Divider.js

@@ -0,0 +1,11 @@
+import styled from "@emotion/styled";
+var Divider = /*#__PURE__*/styled("div", {
+  target: "e57x83g0",
+  label: "Divider"
+})({
+  width: 1,
+  margin: "0 5px",
+  height: "100%",
+  backgroundColor: "var(--mdc-theme-on-background)"
+});
+export default Divider;

package/admin/plugins/editor/defaultBar/FormSettings/FormSettings.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare type FormSettingsProps = {
+    onExited: () => void;
+};
+declare const FormSettings: ({ onExited }: FormSettingsProps) => JSX.Element;
+export default FormSettings;

package/admin/plugins/editor/defaultBar/FormSettings/FormSettings.js

@@ -0,0 +1,90 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+
+var _templateObject, _templateObject2;
+
+import React, { useState } from "react";
+import { plugins } from "@webiny/plugins";
+import { OverlayLayout } from "@webiny/app-admin/components/OverlayLayout";
+import { SplitView, LeftPanel, RightPanel } from "@webiny/app-admin/components/SplitView";
+import { Typography } from "@webiny/ui/Typography";
+import { Form } from "@webiny/form";
+import { Icon } from "@webiny/ui/Icon";
+import { ButtonPrimary } from "@webiny/ui/Button";
+import { List, ListItem, ListItemGraphic } from "@webiny/ui/List";
+import { useSnackbar } from "@webiny/app-admin/hooks/useSnackbar";
+import { i18n } from "@webiny/app/i18n";
+import * as SF from "@webiny/app-admin/components/SimpleForm";
+import { Title, listItem, ListItemTitle, listStyle, TitleContent } from "./FormSettingsStyled";
+import { useContentModelEditor } from "../../../../components/ContentModelEditor/useContentModelEditor";
+var t = i18n.namespace("FormsApp.Editor.FormSettings");
+
+var FormSettings = function FormSettings(_ref) {
+  var onExited = _ref.onExited;
+  var cmsEditorFormSettingsPlugins = plugins.byType("cms-editor-form-settings");
+
+  var _useContentModelEdito = useContentModelEditor(),
+      data = _useContentModelEdito.data,
+      setData = _useContentModelEdito.setData;
+
+  var _useSnackbar = useSnackbar(),
+      showSnackbar = _useSnackbar.showSnackbar;
+
+  var _useState = useState(cmsEditorFormSettingsPlugins[0]),
+      _useState2 = _slicedToArray(_useState, 2),
+      activePlugin = _useState2[0],
+      setActivePlugin = _useState2[1];
+
+  return /*#__PURE__*/React.createElement(OverlayLayout, {
+    barMiddle: Title,
+    onExited: onExited
+  }, /*#__PURE__*/React.createElement(SplitView, null, /*#__PURE__*/React.createElement(LeftPanel, {
+    span: 5
+  }, /*#__PURE__*/React.createElement(List, {
+    twoLine: true,
+    className: listStyle
+  }, cmsEditorFormSettingsPlugins.map(function (pl) {
+    return /*#__PURE__*/React.createElement(ListItem, {
+      key: pl.name,
+      className: listItem,
+      onClick: function onClick() {
+        return setActivePlugin(pl);
+      }
+    }, /*#__PURE__*/React.createElement(ListItemGraphic, null, /*#__PURE__*/React.createElement(Icon, {
+      icon: pl.icon
+    })), /*#__PURE__*/React.createElement(TitleContent, null, /*#__PURE__*/React.createElement(ListItemTitle, null, pl.title), /*#__PURE__*/React.createElement(Typography, {
+      use: "subtitle2"
+    }, pl.description)));
+  }))), /*#__PURE__*/React.createElement(RightPanel, {
+    span: 7
+  }, /*#__PURE__*/React.createElement(Form, {
+    data: data,
+    onSubmit: function onSubmit(data) {
+      setData(function () {
+        return data;
+      });
+      onExited();
+      showSnackbar(t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Content model settings updated successfully."]))));
+    }
+  }, function (_ref2) {
+    var Bind = _ref2.Bind,
+        submit = _ref2.submit,
+        form = _ref2.form,
+        formData = _ref2.data;
+    return /*#__PURE__*/React.createElement(SF.SimpleForm, null, /*#__PURE__*/React.createElement(SF.SimpleFormHeader, {
+      title: activePlugin.title
+    }, typeof activePlugin.renderHeaderActions === "function" && activePlugin.renderHeaderActions({
+      Bind: Bind,
+      form: form,
+      formData: formData
+    })), /*#__PURE__*/React.createElement(SF.SimpleFormContent, null, activePlugin ? activePlugin.render({
+      Bind: Bind,
+      form: form,
+      formData: formData
+    }) : null), /*#__PURE__*/React.createElement(SF.SimpleFormFooter, null, /*#__PURE__*/React.createElement(ButtonPrimary, {
+      onClick: submit
+    }, t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["Save settings"]))))));
+  }))));
+};
+
+export default FormSettings;

package/admin/plugins/editor/defaultBar/FormSettings/FormSettingsButton.d.ts

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

package/admin/plugins/editor/defaultBar/FormSettings/FormSettingsButton.js

@@ -0,0 +1,27 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import React, { useState, useCallback } from "react";
+import { IconButton } from "@webiny/ui/Button";
+import FormSettings from "./FormSettings";
+import { ReactComponent as SettingsIcon } from "@svgr/webpack!./../icons/settings.svg";
+
+var FormSettingsButton = function FormSettingsButton() {
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      opened = _useState2[0],
+      setOpened = _useState2[1];
+
+  var open = useCallback(function () {
+    return setOpened(true);
+  }, []);
+  var close = useCallback(function () {
+    return setOpened(false);
+  }, []);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconButton, {
+    onClick: open,
+    icon: /*#__PURE__*/React.createElement(SettingsIcon, null)
+  }), opened && /*#__PURE__*/React.createElement(FormSettings, {
+    onExited: close
+  }));
+};
+
+export default FormSettingsButton;

package/admin/plugins/editor/defaultBar/FormSettings/FormSettingsStyled.d.ts

@@ -0,0 +1,6 @@
+import * as React from "react";
+export declare const listStyle: string;
+export declare const listItem: string;
+export declare const ListItemTitle: import("@emotion/styled-base").StyledComponent<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "defaultValue" | "id" | "onError" | "className" | "onBlur" | "onClick" | "onContextMenu" | "onCopy" | "onCut" | "onAuxClick" | "onDoubleClick" | "onDragEnd" | "onDragStart" | "onDrop" | "onFocus" | "onInput" | "onInvalid" | "onKeyDown" | "onKeyPress" | "onKeyUp" | "onMouseDown" | "onMouseUp" | "onPaste" | "onPause" | "onPlay" | "onPointerCancel" | "onPointerDown" | "onPointerUp" | "onRateChange" | "onReset" | "onSeeked" | "onSubmit" | "onTouchCancel" | "onTouchEnd" | "onTouchStart" | "onVolumeChange" | "onAbort" | "onAnimationEnd" | "onAnimationIteration" | "onAnimationStart" | "onCanPlay" | "onCanPlayThrough" | "onDrag" | "onDragEnter" | "onDragExit" | "onDragLeave" | "onDragOver" | "onDurationChange" | "onEmptied" | "onEncrypted" | "onEnded" | "onGotPointerCapture" | "onLoad" | "onLoadedData" | "onLoadedMetadata" | "onLoadStart" | "onLostPointerCapture" | "onMouseMove" | "onMouseOut" | "onMouseOver" | "onPlaying" | "onPointerMove" | "onPointerOut" | "onPointerOver" | "onProgress" | "onScroll" | "onSeeking" | "onStalled" | "onSuspend" | "onTimeUpdate" | "onTouchMove" | "onTransitionEnd" | "onWaiting" | "onWheel" | "onMouseEnter" | "onMouseLeave" | "onPointerEnter" | "onPointerLeave" | "onChange" | "onSelect" | "onBeforeInput" | "onCompositionEnd" | "onCompositionStart" | "onCompositionUpdate" | "placeholder" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "lang" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "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" | "onCopyCapture" | "onCutCapture" | "onPasteCapture" | "onCompositionEndCapture" | "onCompositionStartCapture" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInputCapture" | "onInputCapture" | "onResetCapture" | "onSubmitCapture" | "onInvalidCapture" | "onLoadCapture" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbortCapture" | "onCanPlayCapture" | "onCanPlayThroughCapture" | "onDurationChangeCapture" | "onEmptiedCapture" | "onEncryptedCapture" | "onEndedCapture" | "onLoadedDataCapture" | "onLoadedMetadataCapture" | "onLoadStartCapture" | "onPauseCapture" | "onPlayCapture" | "onPlayingCapture" | "onProgressCapture" | "onRateChangeCapture" | "onSeekedCapture" | "onSeekingCapture" | "onStalledCapture" | "onSuspendCapture" | "onTimeUpdateCapture" | "onVolumeChangeCapture" | "onWaitingCapture" | "onAuxClickCapture" | "onClickCapture" | "onContextMenuCapture" | "onDoubleClickCapture" | "onDragCapture" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStartCapture" | "onDropCapture" | "onMouseDownCapture" | "onMouseMoveCapture" | "onMouseOutCapture" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDownCapture" | "onPointerMoveCapture" | "onPointerUpCapture" | "onPointerCancelCapture" | "onPointerEnterCapture" | "onPointerLeaveCapture" | "onPointerOverCapture" | "onPointerOutCapture" | "onGotPointerCaptureCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheelCapture" | "onAnimationStartCapture" | "onAnimationEndCapture" | "onAnimationIterationCapture" | "onTransitionEndCapture">, object>;
+export declare const Title: JSX.Element;
+export declare const TitleContent: import("@emotion/styled-base").StyledComponent<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "defaultValue" | "id" | "onError" | "className" | "onBlur" | "onClick" | "onContextMenu" | "onCopy" | "onCut" | "onAuxClick" | "onDoubleClick" | "onDragEnd" | "onDragStart" | "onDrop" | "onFocus" | "onInput" | "onInvalid" | "onKeyDown" | "onKeyPress" | "onKeyUp" | "onMouseDown" | "onMouseUp" | "onPaste" | "onPause" | "onPlay" | "onPointerCancel" | "onPointerDown" | "onPointerUp" | "onRateChange" | "onReset" | "onSeeked" | "onSubmit" | "onTouchCancel" | "onTouchEnd" | "onTouchStart" | "onVolumeChange" | "onAbort" | "onAnimationEnd" | "onAnimationIteration" | "onAnimationStart" | "onCanPlay" | "onCanPlayThrough" | "onDrag" | "onDragEnter" | "onDragExit" | "onDragLeave" | "onDragOver" | "onDurationChange" | "onEmptied" | "onEncrypted" | "onEnded" | "onGotPointerCapture" | "onLoad" | "onLoadedData" | "onLoadedMetadata" | "onLoadStart" | "onLostPointerCapture" | "onMouseMove" | "onMouseOut" | "onMouseOver" | "onPlaying" | "onPointerMove" | "onPointerOut" | "onPointerOver" | "onProgress" | "onScroll" | "onSeeking" | "onStalled" | "onSuspend" | "onTimeUpdate" | "onTouchMove" | "onTransitionEnd" | "onWaiting" | "onWheel" | "onMouseEnter" | "onMouseLeave" | "onPointerEnter" | "onPointerLeave" | "onChange" | "onSelect" | "onBeforeInput" | "onCompositionEnd" | "onCompositionStart" | "onCompositionUpdate" | "placeholder" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "lang" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "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" | "onCopyCapture" | "onCutCapture" | "onPasteCapture" | "onCompositionEndCapture" | "onCompositionStartCapture" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInputCapture" | "onInputCapture" | "onResetCapture" | "onSubmitCapture" | "onInvalidCapture" | "onLoadCapture" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbortCapture" | "onCanPlayCapture" | "onCanPlayThroughCapture" | "onDurationChangeCapture" | "onEmptiedCapture" | "onEncryptedCapture" | "onEndedCapture" | "onLoadedDataCapture" | "onLoadedMetadataCapture" | "onLoadStartCapture" | "onPauseCapture" | "onPlayCapture" | "onPlayingCapture" | "onProgressCapture" | "onRateChangeCapture" | "onSeekedCapture" | "onSeekingCapture" | "onStalledCapture" | "onSuspendCapture" | "onTimeUpdateCapture" | "onVolumeChangeCapture" | "onWaitingCapture" | "onAuxClickCapture" | "onClickCapture" | "onContextMenuCapture" | "onDoubleClickCapture" | "onDragCapture" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStartCapture" | "onDropCapture" | "onMouseDownCapture" | "onMouseMoveCapture" | "onMouseOutCapture" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDownCapture" | "onPointerMoveCapture" | "onPointerUpCapture" | "onPointerCancelCapture" | "onPointerEnterCapture" | "onPointerLeaveCapture" | "onPointerOverCapture" | "onPointerOutCapture" | "onGotPointerCaptureCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheelCapture" | "onAnimationStartCapture" | "onAnimationEndCapture" | "onAnimationIterationCapture" | "onTransitionEndCapture">, object>;

package/admin/plugins/editor/defaultBar/FormSettings/FormSettingsStyled.js

@@ -0,0 +1,42 @@
+import * as React from "react";
+import { css } from "emotion";
+import styled from "@emotion/styled";
+import { Typography } from "@webiny/ui/Typography";
+export var listStyle = /*#__PURE__*/css({
+  "&.mdc-list": {
+    padding: 0,
+    backgroundColor: "var(--mdc-theme-surface)"
+  }
+}, "label:listStyle;");
+export var listItem = /*#__PURE__*/css({
+  padding: "15px 20px",
+  cursor: "pointer",
+  borderBottom: "1px solid var(--mdc-theme-background)",
+  "&:last-child": {
+    borderBottom: "none"
+  },
+  ".mdc-list-item__graphic": {
+    marginRight: 20
+  }
+}, "label:listItem;");
+export var ListItemTitle = /*#__PURE__*/styled("div", {
+  target: "enz7avh0",
+  label: "ListItemTitle"
+})({
+  fontWeight: 600,
+  marginBottom: 5
+});
+export var Title = /*#__PURE__*/React.createElement(Typography, {
+  style: {
+    margin: "0 auto",
+    color: "var(--mdc-theme-on-surface)"
+  },
+  use: "headline6"
+}, "Content model settings");
+export var TitleContent = /*#__PURE__*/styled("div", {
+  target: "enz7avh1",
+  label: "TitleContent"
+})({
+  display: "flex",
+  flexDirection: "column"
+});

package/admin/plugins/editor/defaultBar/FormSettings/index.d.ts

@@ -0,0 +1 @@
+export { default as FormSettingsButton } from "./FormSettingsButton";

package/admin/plugins/editor/defaultBar/FormSettings/index.js

@@ -0,0 +1 @@
+export { default as FormSettingsButton } from "./FormSettingsButton";

package/admin/plugins/editor/defaultBar/Name/Name.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+declare global {
+    interface Window {
+        Cypress: any;
+    }
+}
+export declare const Name: () => JSX.Element;

package/admin/plugins/editor/defaultBar/Name/Name.js

@@ -0,0 +1,80 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+
+var _templateObject;
+
+import React, { useCallback, useState } from "react";
+import { Input } from "@webiny/ui/Input";
+import { Tooltip } from "@webiny/ui/Tooltip";
+import { useHotkeys } from "react-hotkeyz";
+import { FormName, formNameWrapper, NameInputWrapper, NameWrapper } from "./NameStyled";
+import { i18n } from "@webiny/app/i18n";
+import { useContentModelEditor } from "../../../../components/ContentModelEditor/useContentModelEditor";
+var t = i18n.namespace("ContentModelEditor.Name");
+export var Name = function Name() {
+  var _useContentModelEdito = useContentModelEditor(),
+      data = _useContentModelEdito.data,
+      setData = _useContentModelEdito.setData;
+
+  var _useState = useState(null),
+      _useState2 = _slicedToArray(_useState, 2),
+      localName = _useState2[0],
+      setLocalName = _useState2[1];
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      editingEnabled = _useState4[0],
+      setEditing = _useState4[1];
+
+  var cancelChanges = function cancelChanges() {
+    setEditing(false);
+  };
+
+  var startEditing = function startEditing() {
+    setLocalName(data.name);
+    setEditing(true);
+  };
+
+  var saveName = useCallback(function (e) {
+    e.preventDefault();
+    setData(function (data) {
+      data.name = localName;
+      return data;
+    });
+    setEditing(false);
+  }, [localName]);
+  useHotkeys({
+    zIndex: 100,
+    keys: {
+      "alt+cmd+enter": startEditing
+    }
+  });
+  useHotkeys({
+    zIndex: 101,
+    disabled: !editingEnabled,
+    keys: {
+      esc: function esc(e) {
+        e.preventDefault();
+        cancelChanges();
+      },
+      enter: saveName
+    }
+  }); // Disable autoFocus because for some reason, blur event would automatically be triggered when clicking
+  // on the page title when doing Cypress testing. Not sure if this is RMWC or Cypress related issue.
+
+  var autoFocus = !window.Cypress;
+  return editingEnabled ? /*#__PURE__*/React.createElement(NameInputWrapper, null, /*#__PURE__*/React.createElement(Input, {
+    autoFocus: autoFocus,
+    fullwidth: true,
+    value: localName,
+    onChange: setLocalName,
+    onBlur: saveName
+  })) : /*#__PURE__*/React.createElement(NameWrapper, null, /*#__PURE__*/React.createElement(Tooltip, {
+    className: formNameWrapper,
+    placement: "bottom",
+    content: /*#__PURE__*/React.createElement("span", null, t(_templateObject || (_templateObject = _taggedTemplateLiteral(["rename"]))))
+  }, /*#__PURE__*/React.createElement(FormName, {
+    "data-testid": "cms-editor-model-title",
+    onClick: startEditing
+  }, data.name)));
+};

package/admin/plugins/editor/defaultBar/Name/NameStyled.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const NameInputWrapper: 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" | "onBlur" | "onClick" | "onContextMenu" | "onCopy" | "onCut" | "onAuxClick" | "onDoubleClick" | "onDragEnd" | "onDragStart" | "onDrop" | "onFocus" | "onInput" | "onInvalid" | "onKeyDown" | "onKeyPress" | "onKeyUp" | "onMouseDown" | "onMouseUp" | "onPaste" | "onPause" | "onPlay" | "onPointerCancel" | "onPointerDown" | "onPointerUp" | "onRateChange" | "onReset" | "onSeeked" | "onSubmit" | "onTouchCancel" | "onTouchEnd" | "onTouchStart" | "onVolumeChange" | "onAbort" | "onAnimationEnd" | "onAnimationIteration" | "onAnimationStart" | "onCanPlay" | "onCanPlayThrough" | "onDrag" | "onDragEnter" | "onDragExit" | "onDragLeave" | "onDragOver" | "onDurationChange" | "onEmptied" | "onEncrypted" | "onEnded" | "onGotPointerCapture" | "onLoad" | "onLoadedData" | "onLoadedMetadata" | "onLoadStart" | "onLostPointerCapture" | "onMouseMove" | "onMouseOut" | "onMouseOver" | "onPlaying" | "onPointerMove" | "onPointerOut" | "onPointerOver" | "onProgress" | "onScroll" | "onSeeking" | "onStalled" | "onSuspend" | "onTimeUpdate" | "onTouchMove" | "onTransitionEnd" | "onWaiting" | "onWheel" | "onMouseEnter" | "onMouseLeave" | "onPointerEnter" | "onPointerLeave" | "onChange" | "onSelect" | "onBeforeInput" | "onCompositionEnd" | "onCompositionStart" | "onCompositionUpdate" | "placeholder" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "lang" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "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" | "onCopyCapture" | "onCutCapture" | "onPasteCapture" | "onCompositionEndCapture" | "onCompositionStartCapture" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInputCapture" | "onInputCapture" | "onResetCapture" | "onSubmitCapture" | "onInvalidCapture" | "onLoadCapture" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbortCapture" | "onCanPlayCapture" | "onCanPlayThroughCapture" | "onDurationChangeCapture" | "onEmptiedCapture" | "onEncryptedCapture" | "onEndedCapture" | "onLoadedDataCapture" | "onLoadedMetadataCapture" | "onLoadStartCapture" | "onPauseCapture" | "onPlayCapture" | "onPlayingCapture" | "onProgressCapture" | "onRateChangeCapture" | "onSeekedCapture" | "onSeekingCapture" | "onStalledCapture" | "onSuspendCapture" | "onTimeUpdateCapture" | "onVolumeChangeCapture" | "onWaitingCapture" | "onAuxClickCapture" | "onClickCapture" | "onContextMenuCapture" | "onDoubleClickCapture" | "onDragCapture" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStartCapture" | "onDropCapture" | "onMouseDownCapture" | "onMouseMoveCapture" | "onMouseOutCapture" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDownCapture" | "onPointerMoveCapture" | "onPointerUpCapture" | "onPointerCancelCapture" | "onPointerEnterCapture" | "onPointerLeaveCapture" | "onPointerOverCapture" | "onPointerOutCapture" | "onGotPointerCaptureCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheelCapture" | "onAnimationStartCapture" | "onAnimationEndCapture" | "onAnimationIterationCapture" | "onTransitionEndCapture">, object>;
+export declare const NameWrapper: 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" | "onBlur" | "onClick" | "onContextMenu" | "onCopy" | "onCut" | "onAuxClick" | "onDoubleClick" | "onDragEnd" | "onDragStart" | "onDrop" | "onFocus" | "onInput" | "onInvalid" | "onKeyDown" | "onKeyPress" | "onKeyUp" | "onMouseDown" | "onMouseUp" | "onPaste" | "onPause" | "onPlay" | "onPointerCancel" | "onPointerDown" | "onPointerUp" | "onRateChange" | "onReset" | "onSeeked" | "onSubmit" | "onTouchCancel" | "onTouchEnd" | "onTouchStart" | "onVolumeChange" | "onAbort" | "onAnimationEnd" | "onAnimationIteration" | "onAnimationStart" | "onCanPlay" | "onCanPlayThrough" | "onDrag" | "onDragEnter" | "onDragExit" | "onDragLeave" | "onDragOver" | "onDurationChange" | "onEmptied" | "onEncrypted" | "onEnded" | "onGotPointerCapture" | "onLoad" | "onLoadedData" | "onLoadedMetadata" | "onLoadStart" | "onLostPointerCapture" | "onMouseMove" | "onMouseOut" | "onMouseOver" | "onPlaying" | "onPointerMove" | "onPointerOut" | "onPointerOver" | "onProgress" | "onScroll" | "onSeeking" | "onStalled" | "onSuspend" | "onTimeUpdate" | "onTouchMove" | "onTransitionEnd" | "onWaiting" | "onWheel" | "onMouseEnter" | "onMouseLeave" | "onPointerEnter" | "onPointerLeave" | "onChange" | "onSelect" | "onBeforeInput" | "onCompositionEnd" | "onCompositionStart" | "onCompositionUpdate" | "placeholder" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "lang" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "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" | "onCopyCapture" | "onCutCapture" | "onPasteCapture" | "onCompositionEndCapture" | "onCompositionStartCapture" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInputCapture" | "onInputCapture" | "onResetCapture" | "onSubmitCapture" | "onInvalidCapture" | "onLoadCapture" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbortCapture" | "onCanPlayCapture" | "onCanPlayThroughCapture" | "onDurationChangeCapture" | "onEmptiedCapture" | "onEncryptedCapture" | "onEndedCapture" | "onLoadedDataCapture" | "onLoadedMetadataCapture" | "onLoadStartCapture" | "onPauseCapture" | "onPlayCapture" | "onPlayingCapture" | "onProgressCapture" | "onRateChangeCapture" | "onSeekedCapture" | "onSeekingCapture" | "onStalledCapture" | "onSuspendCapture" | "onTimeUpdateCapture" | "onVolumeChangeCapture" | "onWaitingCapture" | "onAuxClickCapture" | "onClickCapture" | "onContextMenuCapture" | "onDoubleClickCapture" | "onDragCapture" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStartCapture" | "onDropCapture" | "onMouseDownCapture" | "onMouseMoveCapture" | "onMouseOutCapture" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDownCapture" | "onPointerMoveCapture" | "onPointerUpCapture" | "onPointerCancelCapture" | "onPointerEnterCapture" | "onPointerLeaveCapture" | "onPointerOverCapture" | "onPointerOutCapture" | "onGotPointerCaptureCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheelCapture" | "onAnimationStartCapture" | "onAnimationEndCapture" | "onAnimationIterationCapture" | "onTransitionEndCapture">, object>;
+export declare const FormName: 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" | "onBlur" | "onClick" | "onContextMenu" | "onCopy" | "onCut" | "onAuxClick" | "onDoubleClick" | "onDragEnd" | "onDragStart" | "onDrop" | "onFocus" | "onInput" | "onInvalid" | "onKeyDown" | "onKeyPress" | "onKeyUp" | "onMouseDown" | "onMouseUp" | "onPaste" | "onPause" | "onPlay" | "onPointerCancel" | "onPointerDown" | "onPointerUp" | "onRateChange" | "onReset" | "onSeeked" | "onSubmit" | "onTouchCancel" | "onTouchEnd" | "onTouchStart" | "onVolumeChange" | "onAbort" | "onAnimationEnd" | "onAnimationIteration" | "onAnimationStart" | "onCanPlay" | "onCanPlayThrough" | "onDrag" | "onDragEnter" | "onDragExit" | "onDragLeave" | "onDragOver" | "onDurationChange" | "onEmptied" | "onEncrypted" | "onEnded" | "onGotPointerCapture" | "onLoad" | "onLoadedData" | "onLoadedMetadata" | "onLoadStart" | "onLostPointerCapture" | "onMouseMove" | "onMouseOut" | "onMouseOver" | "onPlaying" | "onPointerMove" | "onPointerOut" | "onPointerOver" | "onProgress" | "onScroll" | "onSeeking" | "onStalled" | "onSuspend" | "onTimeUpdate" | "onTouchMove" | "onTransitionEnd" | "onWaiting" | "onWheel" | "onMouseEnter" | "onMouseLeave" | "onPointerEnter" | "onPointerLeave" | "onChange" | "onSelect" | "onBeforeInput" | "onCompositionEnd" | "onCompositionStart" | "onCompositionUpdate" | "placeholder" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "lang" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "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" | "onCopyCapture" | "onCutCapture" | "onPasteCapture" | "onCompositionEndCapture" | "onCompositionStartCapture" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInputCapture" | "onInputCapture" | "onResetCapture" | "onSubmitCapture" | "onInvalidCapture" | "onLoadCapture" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbortCapture" | "onCanPlayCapture" | "onCanPlayThroughCapture" | "onDurationChangeCapture" | "onEmptiedCapture" | "onEncryptedCapture" | "onEndedCapture" | "onLoadedDataCapture" | "onLoadedMetadataCapture" | "onLoadStartCapture" | "onPauseCapture" | "onPlayCapture" | "onPlayingCapture" | "onProgressCapture" | "onRateChangeCapture" | "onSeekedCapture" | "onSeekingCapture" | "onStalledCapture" | "onSuspendCapture" | "onTimeUpdateCapture" | "onVolumeChangeCapture" | "onWaitingCapture" | "onAuxClickCapture" | "onClickCapture" | "onContextMenuCapture" | "onDoubleClickCapture" | "onDragCapture" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStartCapture" | "onDropCapture" | "onMouseDownCapture" | "onMouseMoveCapture" | "onMouseOutCapture" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDownCapture" | "onPointerMoveCapture" | "onPointerUpCapture" | "onPointerCancelCapture" | "onPointerEnterCapture" | "onPointerLeaveCapture" | "onPointerOverCapture" | "onPointerOutCapture" | "onGotPointerCaptureCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheelCapture" | "onAnimationStartCapture" | "onAnimationEndCapture" | "onAnimationIterationCapture" | "onTransitionEndCapture">, object>;
+export declare const formNameWrapper: string;

package/admin/plugins/editor/defaultBar/Name/NameStyled.js

@@ -0,0 +1,48 @@
+import styled from "@emotion/styled";
+import { css } from "emotion";
+export var NameInputWrapper = /*#__PURE__*/styled("div", {
+  target: "e1go0so10",
+  label: "NameInputWrapper"
+})({
+  width: "100%",
+  display: "flex",
+  alignItems: "center",
+  position: "relative",
+  "> .mdc-text-field--upgraded": {
+    height: 35,
+    marginTop: "0 !important",
+    paddingLeft: 10,
+    paddingRight: 40
+  }
+});
+export var NameWrapper = /*#__PURE__*/styled("div", {
+  target: "e1go0so11",
+  label: "NameWrapper"
+})({
+  display: "flex",
+  alignItems: "baseline",
+  justifyContent: "flex-center",
+  flexDirection: "column",
+  color: "var(--mdc-theme-text-primary-on-background)",
+  position: "relative",
+  width: "100%",
+  marginLeft: 10
+});
+export var FormName = /*#__PURE__*/styled("div", {
+  target: "e1go0so12",
+  label: "FormName"
+})({
+  border: "1px solid transparent",
+  fontSize: 20,
+  lineHeight: 1.25,
+  whiteSpace: "nowrap",
+  overflow: "hidden",
+  textOverflow: "ellipsis",
+  width: "100%",
+  "&:hover": {
+    border: "1px solid var(--mdc-theme-on-background)"
+  }
+});
+export var formNameWrapper = /*#__PURE__*/css({
+  maxWidth: "calc(100% - 50px)"
+}, "label:formNameWrapper;");

package/admin/plugins/editor/defaultBar/Name/index.d.ts

@@ -0,0 +1 @@
+export { Name } from "./Name";

package/admin/plugins/editor/defaultBar/Name/index.js

@@ -0,0 +1 @@
+export { Name } from "./Name";

package/admin/plugins/editor/defaultBar/SaveContentModelButton.d.ts

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

package/admin/plugins/editor/defaultBar/SaveContentModelButton.js

@@ -0,0 +1,63 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+
+var _templateObject, _templateObject2;
+
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React, { useState } from "react";
+import { ButtonPrimary } from "@webiny/ui/Button";
+import { useSnackbar } from "@webiny/app-admin/hooks/useSnackbar";
+import { i18n } from "@webiny/app/i18n";
+import { useContentModelEditor } from "../../../components/ContentModelEditor/useContentModelEditor";
+var t = i18n.namespace("app-headless-cms/admin/editor/top-bar/save-button");
+
+var SaveContentModelButton = function SaveContentModelButton() {
+  var _useContentModelEdito = useContentModelEditor(),
+      saveContentModel = _useContentModelEdito.saveContentModel;
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      loading = _useState2[0],
+      setLoading = _useState2[1];
+
+  var _useSnackbar = useSnackbar(),
+      showSnackbar = _useSnackbar.showSnackbar;
+
+  return /*#__PURE__*/React.createElement(ButtonPrimary, {
+    disabled: loading,
+    onClick: /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var response;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              setLoading(true);
+              _context.next = 3;
+              return saveContentModel();
+
+            case 3:
+              response = _context.sent;
+              setLoading(false);
+
+              if (!response.error) {
+                _context.next = 7;
+                break;
+              }
+
+              return _context.abrupt("return", showSnackbar(response.error.message));
+
+            case 7:
+              showSnackbar(t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Your content model was saved successfully!"]))));
+
+            case 8:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }))
+  }, t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["Save"]))));
+};
+
+export default SaveContentModelButton;