decap-cms-core 3.5.0 → 3.6.0

package/dist/esm/valueObjects/Entry.js

@@ -1,12 +1,5 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.createEntry = createEntry;
-var _isBoolean2 = _interopRequireDefault(require("lodash/isBoolean"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function createEntry(collection, slug = '', path = '', options = {}) {
+import _isBoolean from "lodash/isBoolean";
+export function createEntry(collection, slug = '', path = '', options = {}) {
   const returnObj = {
     collection,
     slug,
@@ -15,7 +8,7 @@ function createEntry(collection, slug = '', path = '', options = {}) {
     raw: options.raw || '',
     data: options.data || {},
     label: options.label || null,
-    isModification: (0, _isBoolean2.default)(options.isModification) ? options.isModification : null,
+    isModification: _isBoolean(options.isModification) ? options.isModification : null,
     mediaFiles: options.mediaFiles || [],
     author: options.author || '',
     updatedOn: options.updatedOn || '',

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "decap-cms-core",
   "description": "Decap CMS core application, see decap-cms package for the main distribution.",
-  "version": "3.5.0",
+  "version": "3.6.0",
   "repository": "https://github.com/decaporg/decap-cms/tree/main/packages/decap-cms-core",
   "bugs": "https://github.com/decaporg/decap-cms/issues",
   "module": "dist/esm/index.js",
@@ -26,6 +26,7 @@
   "dependencies": {
     "@iarna/toml": "2.2.5",
     "@reduxjs/toolkit": "^1.9.1",
+    "@vercel/stega": "^0.1.2",
     "ajv": "8.12.0",
     "ajv-errors": "^3.0.0",
     "ajv-keywords": "^5.0.0",
@@ -96,5 +97,5 @@
     "@types/url-join": "^4.0.0",
     "redux-mock-store": "^1.5.3"
   },
-  "gitHead": "022dbe523d07bb8bc74970460cc82b259fde4041"
+  "gitHead": "e2165450e5963b2a8d76d4cf331319bf91f05d45"
 }

package/src/components/Collection/Entries/EntriesCollection.js

@@ -119,20 +119,19 @@ export class EntriesCollection extends React.Component {
 
 export function filterNestedEntries(path, collectionFolder, entries) {
   const filtered = entries.filter(e => {
-    const entryPath = e.get('path').slice(collectionFolder.length + 1);
+    let entryPath = e.get('path').slice(collectionFolder.length + 1);
     if (!entryPath.startsWith(path)) {
       return false;
     }
 
-    // only show immediate children
+    // for subdirectories, trim off the parent folder corresponding to
+    // this nested collection entry
     if (path) {
-      // non root path
-      const trimmed = entryPath.slice(path.length + 1);
-      return trimmed.split('/').length === 2;
-    } else {
-      // root path
-      return entryPath.split('/').length <= 2;
+      entryPath = entryPath.slice(path.length + 1);
     }
+
+    // only show immediate children
+    return !entryPath.includes('/');
   });
   return filtered;
 }

package/src/components/Collection/Entries/__tests__/EntriesCollection.spec.js

@@ -45,11 +45,11 @@ describe('filterNestedEntries', () => {
     ];
     const entries = fromJS(entriesArray);
     expect(filterNestedEntries('dir3', 'src/pages', entries).toJS()).toEqual([
-      { slug: 'dir3/dir4/index', path: 'src/pages/dir3/dir4/index.md', data: { title: 'File 4' } },
+      { slug: 'dir3/index', path: 'src/pages/dir3/index.md', data: { title: 'File 3' } },
     ]);
   });
 
-  it('should return immediate children and root for root path', () => {
+  it('should return only immediate children for root path', () => {
     const entriesArray = [
       { slug: 'index', path: 'src/pages/index.md', data: { title: 'Root' } },
       { slug: 'dir1/index', path: 'src/pages/dir1/index.md', data: { title: 'File 1' } },
@@ -60,8 +60,6 @@ describe('filterNestedEntries', () => {
     const entries = fromJS(entriesArray);
     expect(filterNestedEntries('', 'src/pages', entries).toJS()).toEqual([
       { slug: 'index', path: 'src/pages/index.md', data: { title: 'Root' } },
-      { slug: 'dir1/index', path: 'src/pages/dir1/index.md', data: { title: 'File 1' } },
-      { slug: 'dir3/index', path: 'src/pages/dir3/index.md', data: { title: 'File 3' } },
     ]);
   });
 });
@@ -126,7 +124,7 @@ describe('EntriesCollection', () => {
     expect(asFragment()).toMatchSnapshot();
   });
 
-  it('should render apply filter term for nested collections', () => {
+  it('should render with applied filter term for nested collections', () => {
     const entriesArray = [
       { slug: 'index', path: 'src/pages/index.md', data: { title: 'Root' } },
       { slug: 'dir1/index', path: 'src/pages/dir1/index.md', data: { title: 'File 1' } },

package/src/components/Collection/Entries/__tests__/__snapshots__/EntriesCollection.spec.js.snap

@@ -1,36 +1,36 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`EntriesCollection should render apply filter term for nested collections 1`] = `
+exports[`EntriesCollection should render connected component 1`] = `
 <DocumentFragment>
   <mock-entries
     collectionname="Pages"
-    collections="Map { \\"name\\": \\"pages\\", \\"label\\": \\"Pages\\", \\"folder\\": \\"src/pages\\", \\"nested\\": Map { \\"depth\\": 10 } }"
+    collections="Map { \\"name\\": \\"pages\\", \\"label\\": \\"Pages\\", \\"folder\\": \\"src/pages\\" }"
     cursor="[object Object]"
-    entries="List []"
+    entries="List [ Map { \\"slug\\": \\"index\\", \\"path\\": \\"src/pages/index.md\\", \\"data\\": Map { \\"title\\": \\"Root\\" } }, Map { \\"slug\\": \\"dir1/index\\", \\"path\\": \\"src/pages/dir1/index.md\\", \\"data\\": Map { \\"title\\": \\"File 1\\" } }, Map { \\"slug\\": \\"dir2/index\\", \\"path\\": \\"src/pages/dir2/index.md\\", \\"data\\": Map { \\"title\\": \\"File 2\\" } } ]"
     isfetching="false"
   />
 </DocumentFragment>
 `;
 
-exports[`EntriesCollection should render connected component 1`] = `
+exports[`EntriesCollection should render show only immediate children for nested collection 1`] = `
 <DocumentFragment>
   <mock-entries
     collectionname="Pages"
-    collections="Map { \\"name\\": \\"pages\\", \\"label\\": \\"Pages\\", \\"folder\\": \\"src/pages\\" }"
+    collections="Map { \\"name\\": \\"pages\\", \\"label\\": \\"Pages\\", \\"folder\\": \\"src/pages\\", \\"nested\\": Map { \\"depth\\": 10 } }"
     cursor="[object Object]"
-    entries="List [ Map { \\"slug\\": \\"index\\", \\"path\\": \\"src/pages/index.md\\", \\"data\\": Map { \\"title\\": \\"Root\\" } }, Map { \\"slug\\": \\"dir1/index\\", \\"path\\": \\"src/pages/dir1/index.md\\", \\"data\\": Map { \\"title\\": \\"File 1\\" } }, Map { \\"slug\\": \\"dir2/index\\", \\"path\\": \\"src/pages/dir2/index.md\\", \\"data\\": Map { \\"title\\": \\"File 2\\" } } ]"
+    entries="List [ Map { \\"slug\\": \\"index\\", \\"path\\": \\"src/pages/index.md\\", \\"data\\": Map { \\"title\\": \\"Root\\" } } ]"
     isfetching="false"
   />
 </DocumentFragment>
 `;
 
-exports[`EntriesCollection should render show only immediate children for nested collection 1`] = `
+exports[`EntriesCollection should render with applied filter term for nested collections 1`] = `
 <DocumentFragment>
   <mock-entries
     collectionname="Pages"
     collections="Map { \\"name\\": \\"pages\\", \\"label\\": \\"Pages\\", \\"folder\\": \\"src/pages\\", \\"nested\\": Map { \\"depth\\": 10 } }"
     cursor="[object Object]"
-    entries="List [ Map { \\"slug\\": \\"index\\", \\"path\\": \\"src/pages/index.md\\", \\"data\\": Map { \\"title\\": \\"Root\\" } }, Map { \\"slug\\": \\"dir1/index\\", \\"path\\": \\"src/pages/dir1/index.md\\", \\"data\\": Map { \\"title\\": \\"File 1\\" } }, Map { \\"slug\\": \\"dir3/index\\", \\"path\\": \\"src/pages/dir3/index.md\\", \\"data\\": Map { \\"title\\": \\"File 3\\" } } ]"
+    entries="List [ Map { \\"slug\\": \\"dir3/dir4/index\\", \\"path\\": \\"src/pages/dir3/dir4/index.md\\", \\"data\\": Map { \\"title\\": \\"File 4\\" } } ]"
     isfetching="false"
   />
 </DocumentFragment>

package/src/components/Collection/NestedCollection.js

@@ -80,7 +80,7 @@ function TreeNode(props) {
 
   const sortedData = sortBy(treeData, getNodeTitle);
   return sortedData.map(node => {
-    const leaf = node.children.length <= 1 && !node.children[0]?.isDir && depth > 0;
+    const leaf = node.children.length === 0 && depth > 0;
     if (leaf) {
       return null;
     }
@@ -90,7 +90,7 @@ function TreeNode(props) {
     }
     const title = getNodeTitle(node);
 
-    const hasChildren = depth === 0 || node.children.some(c => c.children.some(c => c.isDir));
+    const hasChildren = depth === 0 || node.children.some(c => c.isDir);
 
     return (
       <React.Fragment key={node.path}>

package/src/components/Collection/__tests__/__snapshots__/NestedCollection.spec.js.snap

@@ -138,6 +138,20 @@ exports[`NestedCollection should render connected component 1`] = `
   margin-right: 4px;
 }
 
+.emotion-6 {
+  position: relative;
+  top: 2px;
+  color: #fff;
+  width: 0;
+  height: 0;
+  border: 5px solid transparent;
+  border-radius: 2px;
+  border-left: 6px solid currentColor;
+  border-right: 0;
+  color: currentColor;
+  left: 2px;
+}
+
 <a
     class="emotion-0 emotion-1"
     data-testid="/a"
@@ -155,6 +169,9 @@ exports[`NestedCollection should render connected component 1`] = `
       >
         File 1
       </div>
+      <div
+        class="emotion-6 emotion-7"
+      />
     </div>
   </a>
   .emotion-0 {
@@ -207,6 +224,20 @@ exports[`NestedCollection should render connected component 1`] = `
   margin-right: 4px;
 }
 
+.emotion-6 {
+  position: relative;
+  top: 2px;
+  color: #fff;
+  width: 0;
+  height: 0;
+  border: 5px solid transparent;
+  border-radius: 2px;
+  border-left: 6px solid currentColor;
+  border-right: 0;
+  color: currentColor;
+  left: 2px;
+}
+
 <a
     class="emotion-0 emotion-1"
     data-testid="/b"
@@ -224,6 +255,9 @@ exports[`NestedCollection should render connected component 1`] = `
       >
         File 2
       </div>
+      <div
+        class="emotion-6 emotion-7"
+      />
     </div>
   </a>
 </DocumentFragment>
@@ -367,6 +401,20 @@ exports[`NestedCollection should render correctly with nested entries 1`] = `
   margin-right: 4px;
 }
 
+.emotion-6 {
+  position: relative;
+  top: 2px;
+  color: #fff;
+  width: 0;
+  height: 0;
+  border: 5px solid transparent;
+  border-radius: 2px;
+  border-left: 6px solid currentColor;
+  border-right: 0;
+  color: currentColor;
+  left: 2px;
+}
+
 <a
     class="emotion-0 emotion-1"
     data-testid="/a"
@@ -384,6 +432,9 @@ exports[`NestedCollection should render correctly with nested entries 1`] = `
       >
         File 1
       </div>
+      <div
+        class="emotion-6 emotion-7"
+      />
     </div>
   </a>
   .emotion-0 {
@@ -436,6 +487,20 @@ exports[`NestedCollection should render correctly with nested entries 1`] = `
   margin-right: 4px;
 }
 
+.emotion-6 {
+  position: relative;
+  top: 2px;
+  color: #fff;
+  width: 0;
+  height: 0;
+  border: 5px solid transparent;
+  border-radius: 2px;
+  border-left: 6px solid currentColor;
+  border-right: 0;
+  color: currentColor;
+  left: 2px;
+}
+
 <a
     class="emotion-0 emotion-1"
     data-testid="/b"
@@ -453,6 +518,9 @@ exports[`NestedCollection should render correctly with nested entries 1`] = `
       >
         File 2
       </div>
+      <div
+        class="emotion-6 emotion-7"
+      />
     </div>
   </a>
 </DocumentFragment>

package/src/components/Editor/EditorControlPane/EditorControl.js

@@ -139,7 +139,6 @@ class EditorControl extends React.Component {
     removeInsertedMedia: PropTypes.func.isRequired,
     persistMedia: PropTypes.func.isRequired,
     onValidate: PropTypes.func,
-    processControlRef: PropTypes.func,
     controlRef: PropTypes.func,
     query: PropTypes.func.isRequired,
     queryHits: PropTypes.object,
@@ -201,7 +200,6 @@ class EditorControl extends React.Component {
       removeInsertedMedia,
       persistMedia,
       onValidate,
-      processControlRef,
       controlRef,
       query,
       queryHits,
@@ -329,7 +327,6 @@ class EditorControl extends React.Component {
               resolveWidget={resolveWidget}
               widget={widget}
               getEditorComponents={getEditorComponents}
-              ref={processControlRef && partial(processControlRef, field)}
               controlRef={controlRef}
               editorControl={ConnectedEditorControl}
               query={query}

package/src/components/Editor/EditorControlPane/EditorControlPane.js

@@ -99,15 +99,17 @@ export default class ControlPane extends React.Component {
     selectedLocale: this.props.locale,
   };
 
-  componentValidate = {};
+  childRefs = {};
 
-  controlRef(field, wrappedControl) {
+  controlRef = (field, wrappedControl) => {
     if (!wrappedControl) return;
     const name = field.get('name');
+    this.childRefs[name] = wrappedControl;
+  };
 
-    this.componentValidate[name] =
-      wrappedControl.innerWrappedControl?.validate || wrappedControl.validate;
-  }
+  getControlRef = field => wrappedControl => {
+    this.controlRef(field, wrappedControl);
+  };
 
   handleLocaleChange = val => {
     this.setState({ selectedLocale: val });
@@ -152,7 +154,11 @@ export default class ControlPane extends React.Component {
   validate = async () => {
     this.props.fields.forEach(field => {
       if (field.get('widget') === 'hidden') return;
-      this.componentValidate[field.get('name')]();
+      const control = this.childRefs[field.get('name')];
+      const validateFn = control?.innerWrappedControl?.validate ?? control?.validate;
+      if (validateFn) {
+        validateFn();
+      }
     });
   };
 
@@ -165,6 +171,14 @@ export default class ControlPane extends React.Component {
     }
   };
 
+  focus(path) {
+    const [fieldName, ...remainingPath] = path.split('.');
+    const control = this.childRefs[fieldName];
+    if (control?.focus) {
+      control.focus(remainingPath.join('.'));
+    }
+  }
+
   render() {
     const { collection, entry, fields, fieldsMetaData, fieldsErrors, onChange, onValidate, t } =
       this.props;
@@ -227,8 +241,7 @@ export default class ControlPane extends React.Component {
                   onChange(field, newValue, newMetadata, i18n);
                 }}
                 onValidate={onValidate}
-                processControlRef={this.controlRef.bind(this)}
-                controlRef={this.controlRef}
+                controlRef={this.getControlRef(field)}
                 entry={entry}
                 collection={collection}
                 isDisabled={isDuplicate}

package/src/components/Editor/EditorControlPane/Widget.js

@@ -44,6 +44,7 @@ export default class Widget extends Component {
     fieldsErrors: ImmutablePropTypes.map,
     onChange: PropTypes.func.isRequired,
     onValidate: PropTypes.func,
+    controlRef: PropTypes.func,
     onOpenMediaLibrary: PropTypes.func.isRequired,
     onClearMediaControl: PropTypes.func.isRequired,
     onRemoveMediaControl: PropTypes.func.isRequired,
@@ -55,7 +56,6 @@ export default class Widget extends Component {
     widget: PropTypes.object.isRequired,
     getEditorComponents: PropTypes.func.isRequired,
     isFetching: PropTypes.bool,
-    controlRef: PropTypes.func,
     query: PropTypes.func.isRequired,
     clearSearch: PropTypes.func.isRequired,
     clearFieldErrors: PropTypes.func.isRequired,
@@ -112,8 +112,29 @@ export default class Widget extends Component {
      */
     const { shouldComponentUpdate: scu } = this.innerWrappedControl;
     this.wrappedControlShouldComponentUpdate = scu && scu.bind(this.innerWrappedControl);
+
+    // Call the control ref if provided, passing this Widget instance
+    if (this.props.controlRef) {
+      this.props.controlRef(this);
+    }
   };
 
+  focus(path) {
+    // Try widget's custom focus method first
+    if (this.innerWrappedControl?.focus) {
+      this.innerWrappedControl.focus(path);
+    } else {
+      // Fall back to focusing by ID for simple widgets
+      const element = document.getElementById(this.props.uniqueFieldId);
+      element?.focus();
+    }
+    // After focusing, ensure the element is visible
+    const label = document.querySelector(`label[for="${this.props.uniqueFieldId}"]`);
+    if (label) {
+      label.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
+    }
+  }
+
   getValidateValue = () => {
     let value = this.innerWrappedControl?.getValidateValue?.() || this.props.value;
     // Convert list input widget value to string for validation test

package/src/components/Editor/EditorInterface.js

@@ -162,6 +162,10 @@ class EditorInterface extends Component {
     i18nVisible: localStorage.getItem(I18N_VISIBLE) !== 'false',
   };
 
+  handleFieldClick = path => {
+    this.controlPaneRef?.focus(path);
+  };
+
   handleSplitPaneDragStart = () => {
     this.setState({ showEventBlocker: true });
   };
@@ -298,6 +302,7 @@ class EditorInterface extends Component {
                 fields={fields}
                 fieldsMetaData={fieldsMetaData}
                 locale={leftPanelLocale}
+                onFieldClick={this.handleFieldClick}
               />
             </PreviewPaneContainer>
           </StyledSplitPane>
@@ -381,7 +386,7 @@ class EditorInterface extends Component {
                 title={t('editor.editorInterface.togglePreview')}
               />
             )}
-            {scrollSyncVisible && (
+            {scrollSyncVisible && !collection.getIn(['editor', 'visualEditing']) && (
               <EditorToggle
                 isActive={scrollSyncEnabled}
                 onClick={this.handleToggleScrollSync}

package/src/components/Editor/EditorPreviewPane/EditorPreviewContent.js

@@ -3,24 +3,63 @@ import React from 'react';
 import { isElement } from 'react-is';
 import { ScrollSyncPane } from 'react-scroll-sync';
 import { FrameContextConsumer } from 'react-frame-component';
+import { vercelStegaDecode } from '@vercel/stega';
 
 /**
- * We need to create a lightweight component here so that we can access the
- * context within the Frame. This allows us to attach the ScrollSyncPane to the
- * body.
+ * PreviewContent renders the preview component and optionally handles visual editing interactions.
+ * By default it uses scroll sync, but can be configured to use visual editing instead.
  */
 class PreviewContent extends React.Component {
-  render() {
+  handleClick = e => {
+    const { previewProps, onFieldClick } = this.props;
+    const visualEditing = previewProps?.collection?.getIn(['editor', 'visualEditing'], false);
+
+    if (!visualEditing) {
+      return;
+    }
+
+    try {
+      const text = e.target.textContent;
+      const decoded = vercelStegaDecode(text);
+      if (decoded?.decap) {
+        if (onFieldClick) {
+          onFieldClick(decoded.decap);
+        }
+      }
+    } catch (err) {
+      console.log('Visual editing error:', err);
+    }
+  };
+
+  renderPreview() {
     const { previewComponent, previewProps } = this.props;
+    return (
+      <div onClick={this.handleClick}>
+        {isElement(previewComponent)
+          ? React.cloneElement(previewComponent, previewProps)
+          : React.createElement(previewComponent, previewProps)}
+      </div>
+    );
+  }
+
+  render() {
+    const { previewProps } = this.props;
+    const visualEditing = previewProps?.collection?.getIn(['editor', 'visualEditing'], false);
+    const showScrollSync = !visualEditing;
+
     return (
       <FrameContextConsumer>
-        {context => (
-          <ScrollSyncPane attachTo={context.document.scrollingElement}>
-            {isElement(previewComponent)
-              ? React.cloneElement(previewComponent, previewProps)
-              : React.createElement(previewComponent, previewProps)}
-          </ScrollSyncPane>
-        )}
+        {context => {
+          const preview = this.renderPreview();
+          if (showScrollSync) {
+            return (
+              <ScrollSyncPane attachTo={context.document.scrollingElement}>
+                {preview}
+              </ScrollSyncPane>
+            );
+          }
+          return preview;
+        }}
       </FrameContextConsumer>
     );
   }
@@ -29,6 +68,7 @@ class PreviewContent extends React.Component {
 PreviewContent.propTypes = {
   previewComponent: PropTypes.func.isRequired,
   previewProps: PropTypes.object,
+  onFieldClick: PropTypes.func,
 };
 
 export default PreviewContent;

package/src/components/Editor/EditorPreviewPane/EditorPreviewPane.js

@@ -6,6 +6,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import Frame, { FrameContextConsumer } from 'react-frame-component';
 import { lengths } from 'decap-cms-ui-default';
 import { connect } from 'react-redux';
+import { encodeEntry } from 'decap-cms-lib-util/src/stega';
 
 import {
   resolveWidget,
@@ -92,6 +93,7 @@ export class PreviewPane extends React.Component {
     if (field.get('meta')) {
       value = this.props.entry.getIn(['meta', field.get('name')]);
     }
+
     const nestedFields = field.get('fields');
     const singleField = field.get('field');
     const metadata = fieldsMetaData && fieldsMetaData.get(field.get('name'), Map());
@@ -167,9 +169,28 @@ export class PreviewPane extends React.Component {
     const { fields, entry, fieldsMetaData } = this.props;
     const field = fields.find(f => f.get('name') === name);
     const nestedFields = field && field.get('fields');
+    const variableTypes = field && field.get('types');
     const value = entry.getIn(['data', field.get('name')]);
     const metadata = fieldsMetaData.get(field.get('name'), Map());
 
+    // Variable Type lists
+    if (List.isList(value) && variableTypes) {
+      return value.map(val => {
+        const valueType = variableTypes.find(t => t.get('name') === val.get('type'));
+        const typeFields = valueType && valueType.get('fields');
+        const widgets =
+          typeFields &&
+          Map(
+            typeFields.map((f, i) => [
+              f.get('name'),
+              <div key={i}>{this.getWidget(f, val, metadata.get(f.get('name')), this.props)}</div>,
+            ]),
+          );
+        return Map({ data: val, widgets });
+      });
+    }
+
+    // List widgets
     if (List.isList(value)) {
       return value.map(val => {
         const widgets =
@@ -226,9 +247,18 @@ export class PreviewPane extends React.Component {
 
     this.inferFields();
 
+    const visualEditing = collection.getIn(['editor', 'visualEditing'], false);
+
+    // Only encode entry data if visual editing is enabled
+    const previewEntry = visualEditing
+      ? entry.set('data', encodeEntry(entry.get('data'), this.props.fields))
+      : entry;
+
     const previewProps = {
       ...this.props,
-      widgetFor: this.widgetFor,
+      entry: previewEntry,
+      widgetFor: (name, fields, values = previewEntry.get('data'), fieldsMetaData) =>
+        this.widgetFor(name, fields, values, fieldsMetaData),
       widgetsFor: this.widgetsFor,
       getCollection: this.getCollection,
     };
@@ -260,6 +290,7 @@ export class PreviewPane extends React.Component {
               return (
                 <EditorPreviewContent
                   {...{ previewComponent, previewProps: { ...previewProps, document, window } }}
+                  onFieldClick={this.props.onFieldClick}
                 />
               );
             }}
@@ -276,6 +307,7 @@ PreviewPane.propTypes = {
   entry: ImmutablePropTypes.map.isRequired,
   fieldsMetaData: ImmutablePropTypes.map.isRequired,
   getAsset: PropTypes.func.isRequired,
+  onFieldClick: PropTypes.func,
 };
 
 function mapStateToProps(state) {

package/dist/esm/actions/editorControl.js

@@ -1,14 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SET_EDITOR_CONTROL = void 0;
-exports.setEditorControl = setEditorControl;
-const SET_EDITOR_CONTROL = exports.SET_EDITOR_CONTROL = 'SET_EDITOR_CONTROL';
-function setEditorControl(control) {
-  return {
-    type: SET_EDITOR_CONTROL,
-    payload: control
-  };
-}

package/dist/esm/reducers/editorComponent.js

@@ -1 +0,0 @@
-"use strict";

package/dist/esm/reducers/editorControl.js

@@ -1,17 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _editorControl = require("../actions/editorControl");
-const initialState = null;
-function editorControl(state = initialState, action) {
-  switch (action.type) {
-    case _editorControl.SET_EDITOR_CONTROL:
-      return action.payload;
-    default:
-      return state;
-  }
-}
-var _default = exports.default = editorControl;