payload 2.0.0-beta.21 → 2.0.0-beta.23

package/components/rich-text.d.ts

@@ -0,0 +1,4 @@
+export { default as ElementButton } from '../dist/admin/components/forms/field-types/RichText/elements/Button';
+export { default as toggleElement } from '../dist/admin/components/forms/field-types/RichText/elements/toggle';
+export { default as LeafButton } from '../dist/admin/components/forms/field-types/RichText/leaves/Button';
+//# sourceMappingURL=rich-text.d.ts.map

package/components/rich-text.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    ElementButton: function() {
+        return _Button.default;
+    },
+    toggleElement: function() {
+        return _toggle.default;
+    },
+    LeafButton: function() {
+        return _Button1.default;
+    }
+});
+const _Button = /*#__PURE__*/ _interop_require_default(require("../dist/admin/components/forms/field-types/RichText/elements/Button"));
+const _toggle = /*#__PURE__*/ _interop_require_default(require("../dist/admin/components/forms/field-types/RichText/elements/toggle"));
+const _Button1 = /*#__PURE__*/ _interop_require_default(require("../dist/admin/components/forms/field-types/RichText/leaves/Button"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9leHBvcnRzL2NvbXBvbmVudHMvcmljaC10ZXh0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCB7IGRlZmF1bHQgYXMgRWxlbWVudEJ1dHRvbiB9IGZyb20gJy4uLy4uL2FkbWluL2NvbXBvbmVudHMvZm9ybXMvZmllbGQtdHlwZXMvUmljaFRleHQvZWxlbWVudHMvQnV0dG9uJ1xuZXhwb3J0IHsgZGVmYXVsdCBhcyB0b2dnbGVFbGVtZW50IH0gZnJvbSAnLi4vLi4vYWRtaW4vY29tcG9uZW50cy9mb3Jtcy9maWVsZC10eXBlcy9SaWNoVGV4dC9lbGVtZW50cy90b2dnbGUnXG5leHBvcnQgeyBkZWZhdWx0IGFzIExlYWZCdXR0b24gfSBmcm9tICcuLi8uLi9hZG1pbi9jb21wb25lbnRzL2Zvcm1zL2ZpZWxkLXR5cGVzL1JpY2hUZXh0L2xlYXZlcy9CdXR0b24nXG4iXSwibmFtZXMiOlsiRWxlbWVudEJ1dHRvbiIsInRvZ2dsZUVsZW1lbnQiLCJMZWFmQnV0dG9uIl0sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztJQUFvQkEsYUFBYTtlQUFiQSxlQUFhOztJQUNiQyxhQUFhO2VBQWJBLGVBQWE7O0lBQ2JDLFVBQVU7ZUFBVkEsZ0JBQVU7OzsrREFGVzsrREFDQTtnRUFDSCJ9

package/dist/admin/components/elements/Hamburger/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/admin/components/elements/Hamburger/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC;IAC/B,SAAS,CAAC,EAAE,UAAU,GAAG,GAAG,CAAA;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CA0BA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/admin/components/elements/Hamburger/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC;IAC/B,SAAS,CAAC,EAAE,UAAU,GAAG,GAAG,CAAA;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAgCA,CAAA"}

package/dist/admin/components/elements/Hamburger/index.js

@@ -23,35 +23,29 @@ const Hamburger = (props)=>{
     const { closeIcon = 'x', isActive = false } = props;
     return /*#__PURE__*/ _react.default.createElement("div", {
         className: [
-            baseClass,
-            isActive && `${baseClass}--active`
+            baseClass
         ].filter(Boolean).join(' ')
     }, /*#__PURE__*/ _react.default.createElement("div", {
         className: `${baseClass}__icon`
+    }, !isActive && /*#__PURE__*/ _react.default.createElement("div", {
+        className: `${baseClass}__lines`
     }, /*#__PURE__*/ _react.default.createElement("div", {
         className: `${baseClass}__line ${baseClass}__top`
     }), /*#__PURE__*/ _react.default.createElement("div", {
         className: `${baseClass}__line ${baseClass}__middle`
     }), /*#__PURE__*/ _react.default.createElement("div", {
         className: `${baseClass}__line ${baseClass}__bottom`
-    })), closeIcon === 'x' && /*#__PURE__*/ _react.default.createElement("div", {
-        className: `${baseClass}__x`
-    }, /*#__PURE__*/ _react.default.createElement("div", {
+    })), isActive && /*#__PURE__*/ _react.default.createElement("div", {
+        "aria-label": t('collapse'),
+        className: `${baseClass}__close-icon`
+    }, closeIcon === 'x' && /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/ _react.default.createElement("div", {
         className: `${baseClass}__line ${baseClass}__x-left`
     }), /*#__PURE__*/ _react.default.createElement("div", {
         className: `${baseClass}__line ${baseClass}__x-right`
-    })), closeIcon === 'collapse' && /*#__PURE__*/ _react.default.createElement("div", {
-        "aria-label": t('collapse'),
-        className: `${baseClass}__collapse`,
-        title: t('collapse')
-    }, /*#__PURE__*/ _react.default.createElement("div", {
-        className: `${baseClass}__line ${baseClass}__collapse-left`
-    }), /*#__PURE__*/ _react.default.createElement(_.Chevron, {
+    })), closeIcon === 'collapse' && /*#__PURE__*/ _react.default.createElement(_.Chevron, {
         className: `${baseClass}__collapse-chevron`,
         direction: "left"
-    }), /*#__PURE__*/ _react.default.createElement("div", {
-        className: `${baseClass}__collapse-label`
-    }, t('collapse'))));
+    }))));
 };
 
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL2VsZW1lbnRzL0hhbWJ1cmdlci9pbmRleC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tICdyZWFjdC1pMThuZXh0J1xuXG5pbXBvcnQgeyBDaGV2cm9uIH0gZnJvbSAnLi4vLi4nXG5pbXBvcnQgJy4vaW5kZXguc2NzcydcblxuY29uc3QgYmFzZUNsYXNzID0gJ2hhbWJ1cmdlcidcblxuZXhwb3J0IGNvbnN0IEhhbWJ1cmdlcjogUmVhY3QuRkM8e1xuICBjbG9zZUljb24/OiAnY29sbGFwc2UnIHwgJ3gnXG4gIGlzQWN0aXZlPzogYm9vbGVhblxufT4gPSAocHJvcHMpID0+IHtcbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbignZ2VuZXJhbCcpXG4gIGNvbnN0IHsgY2xvc2VJY29uID0gJ3gnLCBpc0FjdGl2ZSA9IGZhbHNlIH0gPSBwcm9wc1xuXG4gIHJldHVybiAoXG4gICAgPGRpdiBjbGFzc05hbWU9e1tiYXNlQ2xhc3MsIGlzQWN0aXZlICYmIGAke2Jhc2VDbGFzc30tLWFjdGl2ZWBdLmZpbHRlcihCb29sZWFuKS5qb2luKCcgJyl9PlxuICAgICAgPGRpdiBjbGFzc05hbWU9e2Ake2Jhc2VDbGFzc31fX2ljb25gfT5cbiAgICAgICAgPGRpdiBjbGFzc05hbWU9e2Ake2Jhc2VDbGFzc31fX2xpbmUgJHtiYXNlQ2xhc3N9X190b3BgfSAvPlxuICAgICAgICA8ZGl2IGNsYXNzTmFtZT17YCR7YmFzZUNsYXNzfV9fbGluZSAke2Jhc2VDbGFzc31fX21pZGRsZWB9IC8+XG4gICAgICAgIDxkaXYgY2xhc3NOYW1lPXtgJHtiYXNlQ2xhc3N9X19saW5lICR7YmFzZUNsYXNzfV9fYm90dG9tYH0gLz5cbiAgICAgIDwvZGl2PlxuICAgICAge2Nsb3NlSWNvbiA9PT0gJ3gnICYmIChcbiAgICAgICAgPGRpdiBjbGFzc05hbWU9e2Ake2Jhc2VDbGFzc31fX3hgfT5cbiAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17YCR7YmFzZUNsYXNzfV9fbGluZSAke2Jhc2VDbGFzc31fX3gtbGVmdGB9IC8+XG4gICAgICAgICAgPGRpdiBjbGFzc05hbWU9e2Ake2Jhc2VDbGFzc31fX2xpbmUgJHtiYXNlQ2xhc3N9X194LXJpZ2h0YH0gLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICApfVxuICAgICAge2Nsb3NlSWNvbiA9PT0gJ2NvbGxhcHNlJyAmJiAoXG4gICAgICAgIDxkaXYgYXJpYS1sYWJlbD17dCgnY29sbGFwc2UnKX0gY2xhc3NOYW1lPXtgJHtiYXNlQ2xhc3N9X19jb2xsYXBzZWB9IHRpdGxlPXt0KCdjb2xsYXBzZScpfT5cbiAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17YCR7YmFzZUNsYXNzfV9fbGluZSAke2Jhc2VDbGFzc31fX2NvbGxhcHNlLWxlZnRgfSAvPlxuICAgICAgICAgIDxDaGV2cm9uIGNsYXNzTmFtZT17YCR7YmFzZUNsYXNzfV9fY29sbGFwc2UtY2hldnJvbmB9IGRpcmVjdGlvbj1cImxlZnRcIiAvPlxuICAgICAgICAgIDxkaXYgY2xhc3NOYW1lPXtgJHtiYXNlQ2xhc3N9X19jb2xsYXBzZS1sYWJlbGB9Pnt0KCdjb2xsYXBzZScpfTwvZGl2PlxuICAgICAgICA8L2Rpdj5cbiAgICAgICl9XG4gICAgPC9kaXY+XG4gIClcbn1cbiJdLCJuYW1lcyI6WyJIYW1idXJnZXIiLCJiYXNlQ2xhc3MiLCJwcm9wcyIsInQiLCJ1c2VUcmFuc2xhdGlvbiIsImNsb3NlSWNvbiIsImlzQWN0aXZlIiwiZGl2IiwiY2xhc3NOYW1lIiwiZmlsdGVyIiwiQm9vbGVhbiIsImpvaW4iLCJhcmlhLWxhYmVsIiwidGl0bGUiLCJDaGV2cm9uIiwiZGlyZWN0aW9uIl0sIm1hcHBpbmdzIjoiOzs7OytCQVFhQTs7O2VBQUFBOzs7OERBUks7OEJBQ2E7a0JBRVA7UUFDakI7Ozs7OztBQUVQLE1BQU1DLFlBQVk7QUFFWCxNQUFNRCxZQUdSLENBQUNFO0lBQ0osTUFBTSxFQUFFQyxDQUFDLEVBQUUsR0FBR0MsSUFBQUEsNEJBQWMsRUFBQztJQUM3QixNQUFNLEVBQUVDLFlBQVksR0FBRyxFQUFFQyxXQUFXLEtBQUssRUFBRSxHQUFHSjtJQUU5QyxxQkFDRSw2QkFBQ0s7UUFBSUMsV0FBVztZQUFDUDtZQUFXSyxZQUFZLENBQUMsRUFBRUwsVUFBVSxRQUFRLENBQUM7U0FBQyxDQUFDUSxNQUFNLENBQUNDLFNBQVNDLElBQUksQ0FBQztxQkFDbkYsNkJBQUNKO1FBQUlDLFdBQVcsQ0FBQyxFQUFFUCxVQUFVLE1BQU0sQ0FBQztxQkFDbEMsNkJBQUNNO1FBQUlDLFdBQVcsQ0FBQyxFQUFFUCxVQUFVLE9BQU8sRUFBRUEsVUFBVSxLQUFLLENBQUM7c0JBQ3RELDZCQUFDTTtRQUFJQyxXQUFXLENBQUMsRUFBRVAsVUFBVSxPQUFPLEVBQUVBLFVBQVUsUUFBUSxDQUFDO3NCQUN6RCw2QkFBQ007UUFBSUMsV0FBVyxDQUFDLEVBQUVQLFVBQVUsT0FBTyxFQUFFQSxVQUFVLFFBQVEsQ0FBQztTQUUxREksY0FBYyxxQkFDYiw2QkFBQ0U7UUFBSUMsV0FBVyxDQUFDLEVBQUVQLFVBQVUsR0FBRyxDQUFDO3FCQUMvQiw2QkFBQ007UUFBSUMsV0FBVyxDQUFDLEVBQUVQLFVBQVUsT0FBTyxFQUFFQSxVQUFVLFFBQVEsQ0FBQztzQkFDekQsNkJBQUNNO1FBQUlDLFdBQVcsQ0FBQyxFQUFFUCxVQUFVLE9BQU8sRUFBRUEsVUFBVSxTQUFTLENBQUM7U0FHN0RJLGNBQWMsNEJBQ2IsNkJBQUNFO1FBQUlLLGNBQVlULEVBQUU7UUFBYUssV0FBVyxDQUFDLEVBQUVQLFVBQVUsVUFBVSxDQUFDO1FBQUVZLE9BQU9WLEVBQUU7cUJBQzVFLDZCQUFDSTtRQUFJQyxXQUFXLENBQUMsRUFBRVAsVUFBVSxPQUFPLEVBQUVBLFVBQVUsZUFBZSxDQUFDO3NCQUNoRSw2QkFBQ2EsU0FBTztRQUFDTixXQUFXLENBQUMsRUFBRVAsVUFBVSxrQkFBa0IsQ0FBQztRQUFFYyxXQUFVO3NCQUNoRSw2QkFBQ1I7UUFBSUMsV0FBVyxDQUFDLEVBQUVQLFVBQVUsZ0JBQWdCLENBQUM7T0FBR0UsRUFBRTtBQUs3RCJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL2VsZW1lbnRzL0hhbWJ1cmdlci9pbmRleC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tICdyZWFjdC1pMThuZXh0J1xuXG5pbXBvcnQgeyBDaGV2cm9uIH0gZnJvbSAnLi4vLi4nXG5pbXBvcnQgJy4vaW5kZXguc2NzcydcblxuY29uc3QgYmFzZUNsYXNzID0gJ2hhbWJ1cmdlcidcblxuZXhwb3J0IGNvbnN0IEhhbWJ1cmdlcjogUmVhY3QuRkM8e1xuICBjbG9zZUljb24/OiAnY29sbGFwc2UnIHwgJ3gnXG4gIGlzQWN0aXZlPzogYm9vbGVhblxufT4gPSAocHJvcHMpID0+IHtcbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbignZ2VuZXJhbCcpXG4gIGNvbnN0IHsgY2xvc2VJY29uID0gJ3gnLCBpc0FjdGl2ZSA9IGZhbHNlIH0gPSBwcm9wc1xuXG4gIHJldHVybiAoXG4gICAgPGRpdiBjbGFzc05hbWU9e1tiYXNlQ2xhc3NdLmZpbHRlcihCb29sZWFuKS5qb2luKCcgJyl9PlxuICAgICAgPGRpdiBjbGFzc05hbWU9e2Ake2Jhc2VDbGFzc31fX2ljb25gfT5cbiAgICAgICAgeyFpc0FjdGl2ZSAmJiAoXG4gICAgICAgICAgPGRpdiBjbGFzc05hbWU9e2Ake2Jhc2VDbGFzc31fX2xpbmVzYH0+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17YCR7YmFzZUNsYXNzfV9fbGluZSAke2Jhc2VDbGFzc31fX3RvcGB9IC8+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17YCR7YmFzZUNsYXNzfV9fbGluZSAke2Jhc2VDbGFzc31fX21pZGRsZWB9IC8+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17YCR7YmFzZUNsYXNzfV9fbGluZSAke2Jhc2VDbGFzc31fX2JvdHRvbWB9IC8+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgICl9XG5cbiAgICAgICAge2lzQWN0aXZlICYmIChcbiAgICAgICAgICA8ZGl2IGFyaWEtbGFiZWw9e3QoJ2NvbGxhcHNlJyl9IGNsYXNzTmFtZT17YCR7YmFzZUNsYXNzfV9fY2xvc2UtaWNvbmB9PlxuICAgICAgICAgICAge2Nsb3NlSWNvbiA9PT0gJ3gnICYmIChcbiAgICAgICAgICAgICAgPFJlYWN0LkZyYWdtZW50PlxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3NOYW1lPXtgJHtiYXNlQ2xhc3N9X19saW5lICR7YmFzZUNsYXNzfV9feC1sZWZ0YH0gLz5cbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17YCR7YmFzZUNsYXNzfV9fbGluZSAke2Jhc2VDbGFzc31fX3gtcmlnaHRgfSAvPlxuICAgICAgICAgICAgICA8L1JlYWN0LkZyYWdtZW50PlxuICAgICAgICAgICAgKX1cblxuICAgICAgICAgICAge2Nsb3NlSWNvbiA9PT0gJ2NvbGxhcHNlJyAmJiAoXG4gICAgICAgICAgICAgIDxDaGV2cm9uIGNsYXNzTmFtZT17YCR7YmFzZUNsYXNzfV9fY29sbGFwc2UtY2hldnJvbmB9IGRpcmVjdGlvbj1cImxlZnRcIiAvPlxuICAgICAgICAgICAgKX1cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgKX1cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuICApXG59XG4iXSwibmFtZXMiOlsiSGFtYnVyZ2VyIiwiYmFzZUNsYXNzIiwicHJvcHMiLCJ0IiwidXNlVHJhbnNsYXRpb24iLCJjbG9zZUljb24iLCJpc0FjdGl2ZSIsImRpdiIsImNsYXNzTmFtZSIsImZpbHRlciIsIkJvb2xlYW4iLCJqb2luIiwiYXJpYS1sYWJlbCIsIlJlYWN0IiwiRnJhZ21lbnQiLCJDaGV2cm9uIiwiZGlyZWN0aW9uIl0sIm1hcHBpbmdzIjoiOzs7OytCQVFhQTs7O2VBQUFBOzs7OERBUks7OEJBQ2E7a0JBRVA7UUFDakI7Ozs7OztBQUVQLE1BQU1DLFlBQVk7QUFFWCxNQUFNRCxZQUdSLENBQUNFO0lBQ0osTUFBTSxFQUFFQyxDQUFDLEVBQUUsR0FBR0MsSUFBQUEsNEJBQWMsRUFBQztJQUM3QixNQUFNLEVBQUVDLFlBQVksR0FBRyxFQUFFQyxXQUFXLEtBQUssRUFBRSxHQUFHSjtJQUU5QyxxQkFDRSw2QkFBQ0s7UUFBSUMsV0FBVztZQUFDUDtTQUFVLENBQUNRLE1BQU0sQ0FBQ0MsU0FBU0MsSUFBSSxDQUFDO3FCQUMvQyw2QkFBQ0o7UUFBSUMsV0FBVyxDQUFDLEVBQUVQLFVBQVUsTUFBTSxDQUFDO09BQ2pDLENBQUNLLDBCQUNBLDZCQUFDQztRQUFJQyxXQUFXLENBQUMsRUFBRVAsVUFBVSxPQUFPLENBQUM7cUJBQ25DLDZCQUFDTTtRQUFJQyxXQUFXLENBQUMsRUFBRVAsVUFBVSxPQUFPLEVBQUVBLFVBQVUsS0FBSyxDQUFDO3NCQUN0RCw2QkFBQ007UUFBSUMsV0FBVyxDQUFDLEVBQUVQLFVBQVUsT0FBTyxFQUFFQSxVQUFVLFFBQVEsQ0FBQztzQkFDekQsNkJBQUNNO1FBQUlDLFdBQVcsQ0FBQyxFQUFFUCxVQUFVLE9BQU8sRUFBRUEsVUFBVSxRQUFRLENBQUM7U0FJNURLLDBCQUNDLDZCQUFDQztRQUFJSyxjQUFZVCxFQUFFO1FBQWFLLFdBQVcsQ0FBQyxFQUFFUCxVQUFVLFlBQVksQ0FBQztPQUNsRUksY0FBYyxxQkFDYiw2QkFBQ1EsY0FBSyxDQUFDQyxRQUFRLHNCQUNiLDZCQUFDUDtRQUFJQyxXQUFXLENBQUMsRUFBRVAsVUFBVSxPQUFPLEVBQUVBLFVBQVUsUUFBUSxDQUFDO3NCQUN6RCw2QkFBQ007UUFBSUMsV0FBVyxDQUFDLEVBQUVQLFVBQVUsT0FBTyxFQUFFQSxVQUFVLFNBQVMsQ0FBQztTQUk3REksY0FBYyw0QkFDYiw2QkFBQ1UsU0FBTztRQUFDUCxXQUFXLENBQUMsRUFBRVAsVUFBVSxrQkFBa0IsQ0FBQztRQUFFZSxXQUFVOztBQU85RSJ9

package/dist/admin/components/elements/Hamburger/index.scss

@@ -1,14 +1,20 @@
 @import '../../../scss/styles';
 
 .hamburger {
-  position: relative;
   padding: 0;
   border: 0;
   cursor: pointer;
   background-color: transparent;
   outline: none;
-  width: 14px;
-  height: 14px;
+  position: absolute;
+
+  --hamburger-padding: 5px;
+  --hamburger-size: 9px;
+  --hamburger-line-gap: 3px;
+  padding: var(--hamburger-padding);
+  border: 1px solid var(--theme-elevation-350);
+  color: var(--theme-text);
+  border-radius: 3px;
 
   &:focus {
     outline: none;
@@ -16,82 +22,62 @@
 
   &__icon {
     position: relative;
+    height: var(--hamburger-size);
+    width: var(--hamburger-size);
+    display: flex;
+    .stroke {
+      stroke: currentColor;
+      stroke-width: 1px;
+    }
+
+    svg {
+      height: 100%;
+    }
   }
 
-  &__icon,
-  &__x,
-  &__collapse {
+  &__close-icon {
+    display: flex;
+    align-items: center;
+    justify-content: center;
     position: absolute;
-    left: 0;
-    top: 0;
+    top: 50%;
+    left: 50%;
     width: 100%;
     height: 100%;
+    transform: translate3d(-50%, -50%, 0);
   }
 
-  &__line {
-    background-color: var(--theme-text);
+  &__lines {
+    display: flex;
+    flex-direction: column;
+    gap: var(--hamburger-line-gap);
     width: 100%;
-    height: 2px;
-    position: absolute;
-  }
-
-  &__top {
-    top: 1px;
-    transform: translate3d(0, 0, 0) rotate(0);
-  }
-
-  &__middle {
-    top: 50%;
-    transform: translate3d(0, -50%, 0) rotate(0);
-  }
-
-  &__bottom {
-    bottom: 1px;
-    transform: translate3d(0, 0, 0) rotate(0);
+    margin: auto;
   }
 
-  &__x,
-  &__collapse {
-    display: none;
-    opacity: 0;
+  &__line {
+    background-color: currentColor;
+    width: 100%;
+    height: 1px;
   }
 
   &__x-left {
+    position: absolute;
     top: 50%;
     left: 50%;
     transform: translate3d(-50%, -50%, 0) rotate(45deg);
   }
 
   &__x-right {
+    position: absolute;
     top: 50%;
     left: 50%;
     transform: translate3d(-50%, -50%, 0) rotate(-45deg);
   }
 
-  &__collapse {
-    position: relative;
-  }
-
-  &__collapse-label {
-    opacity: 0;
-    position: absolute;
-    left: calc(100% + 4px);
-    top: 50%;
-    transform: translate3d(0, -50%, 0);
-    font-weight: bold;
-  }
-
-  &__collapse-left {
-    height: 90%;
-    width: 2px;
-    left: 0;
-    top: 50%;
-    transform: translate3d(0, -50%, 0);
-  }
-
   &__collapse-chevron {
+    left: -1px;
     position: relative;
-    top: -1px;
   }
 
   &--active {
@@ -112,7 +98,8 @@
 
   @include mid-break {
     &__collapse-chevron {
-      top: -2px;
+      top: 1px;
+      left: 0px;
     }
   }
 }

package/dist/admin/components/elements/Header/index.scss

@@ -93,7 +93,12 @@
     }
 
     &__mobile-nav-toggler {
-      display: block;
+      display: flex;
+      align-items: center;
+
+      &.nav-toggler--is-open {
+        opacity: 0.5;
+      }
     }
 
     &__step-header {

package/dist/admin/components/elements/Nav/NavToggler/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/admin/components/elements/Nav/NavToggler/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC;IAChC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,EAAE,CAAC,EAAE,MAAM,CAAA;CACZ,CAkCA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/admin/components/elements/Nav/NavToggler/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC;IAChC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,EAAE,CAAC,EAAE,MAAM,CAAA;CACZ,CAoCA,CAAA"}

package/dist/admin/components/elements/Nav/NavToggler/index.js

@@ -30,6 +30,7 @@ const NavToggler = (props)=>{
         "aria-label": t('menu'),
         className: [
             baseClass,
+            navOpen && `${baseClass}--is-open`,
             className
         ].filter(Boolean).join(' '),
         id: id,
@@ -47,4 +48,4 @@ const NavToggler = (props)=>{
     }, children);
 };
 
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL2VsZW1lbnRzL05hdi9OYXZUb2dnbGVyL2luZGV4LnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyB1c2VXaW5kb3dJbmZvIH0gZnJvbSAnQGZhY2VsZXNzLXVpL3dpbmRvdy1pbmZvJ1xuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tICdyZWFjdC1pMThuZXh0J1xuXG5pbXBvcnQgeyB1c2VQcmVmZXJlbmNlcyB9IGZyb20gJy4uLy4uLy4uL3V0aWxpdGllcy9QcmVmZXJlbmNlcydcbmltcG9ydCB7IHVzZU5hdiB9IGZyb20gJy4uL2NvbnRleHQnXG5pbXBvcnQgJy4vaW5kZXguc2NzcydcblxuY29uc3QgYmFzZUNsYXNzID0gJ25hdi10b2dnbGVyJ1xuXG5leHBvcnQgY29uc3QgTmF2VG9nZ2xlcjogUmVhY3QuRkM8e1xuICBjaGlsZHJlbj86IFJlYWN0LlJlYWN0Tm9kZVxuICBjbGFzc05hbWU/OiBzdHJpbmdcbiAgaWQ/OiBzdHJpbmdcbn0+ID0gKHByb3BzKSA9PiB7XG4gIGNvbnN0IHsgaWQsIGNoaWxkcmVuLCBjbGFzc05hbWUgfSA9IHByb3BzXG5cbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbignZ2VuZXJhbCcpXG5cbiAgY29uc3QgeyBzZXRQcmVmZXJlbmNlIH0gPSB1c2VQcmVmZXJlbmNlcygpXG5cbiAgY29uc3QgeyBuYXZPcGVuLCBzZXROYXZPcGVuIH0gPSB1c2VOYXYoKVxuXG4gIGNvbnN0IHtcbiAgICBicmVha3BvaW50czogeyBsOiBsYXJnZUJyZWFrIH0sXG4gIH0gPSB1c2VXaW5kb3dJbmZvKClcblxuICByZXR1cm4gKFxuICAgIDxidXR0b25cbiAgICAgIGFyaWEtbGFiZWw9e3QoJ21lbnUnKX1cbiAgICAgIGNsYXNzTmFtZT17W2Jhc2VDbGFzcywgY2xhc3NOYW1lXS5maWx0ZXIoQm9vbGVhbikuam9pbignICcpfVxuICAgICAgaWQ9e2lkfVxuICAgICAgb25DbGljaz17YXN5bmMgKCkgPT4ge1xuICAgICAgICBzZXROYXZPcGVuKCFuYXZPcGVuKVxuXG4gICAgICAgIC8vIG9ubHkgd2hlbiB0aGUgdXNlciBleHBsaWNpdGx5IHRvZ2dsZXMgdGhlIG5hdiBvbiBkZXNrdG9wIGRvIHdlIHdhbnQgdG8gc2V0IHRoZSBwcmVmZXJlbmNlXG4gICAgICAgIC8vIHRoaXMgaXMgYmVjYXVzZSB0aGUganMgbWF5IG9wZW4gb3IgY2xvc2UgdGhlIG5hdiBiYXNlZCBvbiB0aGUgd2luZG93IHNpemUsIHJvdXRpbmcsIGV0Y1xuICAgICAgICBpZiAoIWxhcmdlQnJlYWspIHtcbiAgICAgICAgICBhd2FpdCBzZXRQcmVmZXJlbmNlKCduYXYnLCB7XG4gICAgICAgICAgICBvcGVuOiAhbmF2T3BlbixcbiAgICAgICAgICB9KVxuICAgICAgICB9XG4gICAgICB9fVxuICAgICAgdHlwZT1cImJ1dHRvblwiXG4gICAgPlxuICAgICAge2NoaWxkcmVufVxuICAgIDwvYnV0dG9uPlxuICApXG59XG4iXSwibmFtZXMiOlsiTmF2VG9nZ2xlciIsImJhc2VDbGFzcyIsInByb3BzIiwiaWQiLCJjaGlsZHJlbiIsImNsYXNzTmFtZSIsInQiLCJ1c2VUcmFuc2xhdGlvbiIsInNldFByZWZlcmVuY2UiLCJ1c2VQcmVmZXJlbmNlcyIsIm5hdk9wZW4iLCJzZXROYXZPcGVuIiwidXNlTmF2IiwiYnJlYWtwb2ludHMiLCJsIiwibGFyZ2VCcmVhayIsInVzZVdpbmRvd0luZm8iLCJidXR0b24iLCJhcmlhLWxhYmVsIiwiZmlsdGVyIiwiQm9vbGVhbiIsImpvaW4iLCJvbkNsaWNrIiwib3BlbiIsInR5cGUiXSwibWFwcGluZ3MiOiI7Ozs7K0JBVWFBOzs7ZUFBQUE7Ozs0QkFWaUI7OERBQ1o7OEJBQ2E7NkJBRUE7eUJBQ1I7UUFDaEI7Ozs7OztBQUVQLE1BQU1DLFlBQVk7QUFFWCxNQUFNRCxhQUlSLENBQUNFO0lBQ0osTUFBTSxFQUFFQyxFQUFFLEVBQUVDLFFBQVEsRUFBRUMsU0FBUyxFQUFFLEdBQUdIO0lBRXBDLE1BQU0sRUFBRUksQ0FBQyxFQUFFLEdBQUdDLElBQUFBLDRCQUFjLEVBQUM7SUFFN0IsTUFBTSxFQUFFQyxhQUFhLEVBQUUsR0FBR0MsSUFBQUEsMkJBQWM7SUFFeEMsTUFBTSxFQUFFQyxPQUFPLEVBQUVDLFVBQVUsRUFBRSxHQUFHQyxJQUFBQSxlQUFNO0lBRXRDLE1BQU0sRUFDSkMsYUFBYSxFQUFFQyxHQUFHQyxVQUFVLEVBQUUsRUFDL0IsR0FBR0MsSUFBQUEseUJBQWE7SUFFakIscUJBQ0UsNkJBQUNDO1FBQ0NDLGNBQVlaLEVBQUU7UUFDZEQsV0FBVztZQUFDSjtZQUFXSTtTQUFVLENBQUNjLE1BQU0sQ0FBQ0MsU0FBU0MsSUFBSSxDQUFDO1FBQ3ZEbEIsSUFBSUE7UUFDSm1CLFNBQVM7WUFDUFgsV0FBVyxDQUFDRDtZQUVaLDRGQUE0RjtZQUM1RiwwRkFBMEY7WUFDMUYsSUFBSSxDQUFDSyxZQUFZO2dCQUNmLE1BQU1QLGNBQWMsT0FBTztvQkFDekJlLE1BQU0sQ0FBQ2I7Z0JBQ1Q7WUFDRjtRQUNGO1FBQ0FjLE1BQUs7T0FFSnBCO0FBR1AifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL2VsZW1lbnRzL05hdi9OYXZUb2dnbGVyL2luZGV4LnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyB1c2VXaW5kb3dJbmZvIH0gZnJvbSAnQGZhY2VsZXNzLXVpL3dpbmRvdy1pbmZvJ1xuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tICdyZWFjdC1pMThuZXh0J1xuXG5pbXBvcnQgeyB1c2VQcmVmZXJlbmNlcyB9IGZyb20gJy4uLy4uLy4uL3V0aWxpdGllcy9QcmVmZXJlbmNlcydcbmltcG9ydCB7IHVzZU5hdiB9IGZyb20gJy4uL2NvbnRleHQnXG5pbXBvcnQgJy4vaW5kZXguc2NzcydcblxuY29uc3QgYmFzZUNsYXNzID0gJ25hdi10b2dnbGVyJ1xuXG5leHBvcnQgY29uc3QgTmF2VG9nZ2xlcjogUmVhY3QuRkM8e1xuICBjaGlsZHJlbj86IFJlYWN0LlJlYWN0Tm9kZVxuICBjbGFzc05hbWU/OiBzdHJpbmdcbiAgaWQ/OiBzdHJpbmdcbn0+ID0gKHByb3BzKSA9PiB7XG4gIGNvbnN0IHsgaWQsIGNoaWxkcmVuLCBjbGFzc05hbWUgfSA9IHByb3BzXG5cbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbignZ2VuZXJhbCcpXG5cbiAgY29uc3QgeyBzZXRQcmVmZXJlbmNlIH0gPSB1c2VQcmVmZXJlbmNlcygpXG5cbiAgY29uc3QgeyBuYXZPcGVuLCBzZXROYXZPcGVuIH0gPSB1c2VOYXYoKVxuXG4gIGNvbnN0IHtcbiAgICBicmVha3BvaW50czogeyBsOiBsYXJnZUJyZWFrIH0sXG4gIH0gPSB1c2VXaW5kb3dJbmZvKClcblxuICByZXR1cm4gKFxuICAgIDxidXR0b25cbiAgICAgIGFyaWEtbGFiZWw9e3QoJ21lbnUnKX1cbiAgICAgIGNsYXNzTmFtZT17W2Jhc2VDbGFzcywgbmF2T3BlbiAmJiBgJHtiYXNlQ2xhc3N9LS1pcy1vcGVuYCwgY2xhc3NOYW1lXVxuICAgICAgICAuZmlsdGVyKEJvb2xlYW4pXG4gICAgICAgIC5qb2luKCcgJyl9XG4gICAgICBpZD17aWR9XG4gICAgICBvbkNsaWNrPXthc3luYyAoKSA9PiB7XG4gICAgICAgIHNldE5hdk9wZW4oIW5hdk9wZW4pXG5cbiAgICAgICAgLy8gb25seSB3aGVuIHRoZSB1c2VyIGV4cGxpY2l0bHkgdG9nZ2xlcyB0aGUgbmF2IG9uIGRlc2t0b3AgZG8gd2Ugd2FudCB0byBzZXQgdGhlIHByZWZlcmVuY2VcbiAgICAgICAgLy8gdGhpcyBpcyBiZWNhdXNlIHRoZSBqcyBtYXkgb3BlbiBvciBjbG9zZSB0aGUgbmF2IGJhc2VkIG9uIHRoZSB3aW5kb3cgc2l6ZSwgcm91dGluZywgZXRjXG4gICAgICAgIGlmICghbGFyZ2VCcmVhaykge1xuICAgICAgICAgIGF3YWl0IHNldFByZWZlcmVuY2UoJ25hdicsIHtcbiAgICAgICAgICAgIG9wZW46ICFuYXZPcGVuLFxuICAgICAgICAgIH0pXG4gICAgICAgIH1cbiAgICAgIH19XG4gICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICA+XG4gICAgICB7Y2hpbGRyZW59XG4gICAgPC9idXR0b24+XG4gIClcbn1cbiJdLCJuYW1lcyI6WyJOYXZUb2dnbGVyIiwiYmFzZUNsYXNzIiwicHJvcHMiLCJpZCIsImNoaWxkcmVuIiwiY2xhc3NOYW1lIiwidCIsInVzZVRyYW5zbGF0aW9uIiwic2V0UHJlZmVyZW5jZSIsInVzZVByZWZlcmVuY2VzIiwibmF2T3BlbiIsInNldE5hdk9wZW4iLCJ1c2VOYXYiLCJicmVha3BvaW50cyIsImwiLCJsYXJnZUJyZWFrIiwidXNlV2luZG93SW5mbyIsImJ1dHRvbiIsImFyaWEtbGFiZWwiLCJmaWx0ZXIiLCJCb29sZWFuIiwiam9pbiIsIm9uQ2xpY2siLCJvcGVuIiwidHlwZSJdLCJtYXBwaW5ncyI6Ijs7OzsrQkFVYUE7OztlQUFBQTs7OzRCQVZpQjs4REFDWjs4QkFDYTs2QkFFQTt5QkFDUjtRQUNoQjs7Ozs7O0FBRVAsTUFBTUMsWUFBWTtBQUVYLE1BQU1ELGFBSVIsQ0FBQ0U7SUFDSixNQUFNLEVBQUVDLEVBQUUsRUFBRUMsUUFBUSxFQUFFQyxTQUFTLEVBQUUsR0FBR0g7SUFFcEMsTUFBTSxFQUFFSSxDQUFDLEVBQUUsR0FBR0MsSUFBQUEsNEJBQWMsRUFBQztJQUU3QixNQUFNLEVBQUVDLGFBQWEsRUFBRSxHQUFHQyxJQUFBQSwyQkFBYztJQUV4QyxNQUFNLEVBQUVDLE9BQU8sRUFBRUMsVUFBVSxFQUFFLEdBQUdDLElBQUFBLGVBQU07SUFFdEMsTUFBTSxFQUNKQyxhQUFhLEVBQUVDLEdBQUdDLFVBQVUsRUFBRSxFQUMvQixHQUFHQyxJQUFBQSx5QkFBYTtJQUVqQixxQkFDRSw2QkFBQ0M7UUFDQ0MsY0FBWVosRUFBRTtRQUNkRCxXQUFXO1lBQUNKO1lBQVdTLFdBQVcsQ0FBQyxFQUFFVCxVQUFVLFNBQVMsQ0FBQztZQUFFSTtTQUFVLENBQ2xFYyxNQUFNLENBQUNDLFNBQ1BDLElBQUksQ0FBQztRQUNSbEIsSUFBSUE7UUFDSm1CLFNBQVM7WUFDUFgsV0FBVyxDQUFDRDtZQUVaLDRGQUE0RjtZQUM1RiwwRkFBMEY7WUFDMUYsSUFBSSxDQUFDSyxZQUFZO2dCQUNmLE1BQU1QLGNBQWMsT0FBTztvQkFDekJlLE1BQU0sQ0FBQ2I7Z0JBQ1Q7WUFDRjtRQUNGO1FBQ0FjLE1BQUs7T0FFSnBCO0FBR1AifQ==

package/dist/admin/components/elements/Nav/NavToggler/index.scss

@@ -9,4 +9,8 @@
   height: var(--app-header-height);
   width: var(--gutter-h);
   cursor: pointer;
+
+  @include small-break {
+    width: calc(var(--gutter-h) * 2);
+  }
 }

package/dist/admin/components/elements/Nav/index.scss

@@ -149,7 +149,9 @@
     }
 
     &__mobile-close {
-      display: block;
+      display: flex;
+      height: 100%;
+      align-items: center;
     }
   }
 }

package/dist/admin/components/templates/Default/index.scss

@@ -86,26 +86,59 @@
         }
       }
     }
+
+    &__nav-toggler {
+      .hamburger {
+        left: calc(var(--base) * 1.25);
+      }
+    }
+  }
+
+  @include mid-break {
+    &__nav-toggler {
+      .hamburger {
+        left: calc(var(--base) * 0.75);
+      }
+    }
   }
 
   @include small-break {
     &__nav-toggler {
-      width: auto;
-      padding-left: var(--gutter-h);
+      .hamburger {
+        left: calc(var(--base) * 0.5);
+      }
+      &.nav-toggler--is-open .hamburger {
+        display: flex;
+        display: inline;
+      }
     }
   }
 
-  @include extra-small-break {
+  @include small-break {
     &__nav-toggler {
-      width: calc(var(--base) * 2);
-      height: calc(var(--base) * 2);
-      display: none;
+      width: unset;
+      justify-content: unset;
+
+      .hamburger {
+        opacity: none;
+      }
     }
 
+    &__nav-toggler.nav-toggler--is-open .hamburger {
+      display: flex;
+      display: inline;
+    }
+  }
+
+  @include extra-small-break {
     &--nav-open {
       transition: none;
     }
 
+    &__nav-toggler.nav-toggler--is-open .hamburger {
+      display: none;
+    }
+
     .template-default {
       &__wrap {
         transition: none;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "payload",
-  "version": "2.0.0-beta.21",
+  "version": "2.0.0-beta.23",
   "description": "Node, React and MongoDB Headless CMS and Application Framework",
   "license": "MIT",
   "main": "./dist/index.js",