initialize package

.gitignore

@@ -0,0 +1 @@
+node_modules/

Configuration/Settings.yaml

@@ -0,0 +1,7 @@
+Neos:
+  Neos:
+    Ui:
+      resources:
+        javascript:
+          'Prgfx.Neos.DynamicPlaceholder:Plugin':
+            resource: resource://Prgfx.Neos.DynamicPlaceholder/Public/JavaScript/Plugin.js

README.md

@@ -0,0 +1,33 @@
+[![Version](https://poser.pugx.org/prgfx/neos-dynamic-placeholder/version)](//packagist.org/packages/prgfx/neos-dynamic-placeholder)
+
+# Prgfx.Neos.DynamicPlaceholder
+
+This package allows to use `ClientEval:` statements in inline editor placeholders (see [Feature Request](https://github.com/neos/neos-ui/issues/2837)).
+
+```
+composer require prgfx/neos-dynamic-placeholder
+```
+
+## Example
+```yaml
+Vendor.Package:Page:
+  superTypes:
+    Neos.Neos:Page: true
+  properties:
+    displayTitle:
+      type: string
+      ui:
+        inlineEditable: true
+        inline:
+          editorOptions:
+            placeholder: ClientEval:node.properties.title
+```
+
+## Eval Scope
+* `node`: the node the editor belongs to
+* `editorOptions`: the editorOptions, i.e. (original) placeholder, formatting etc.
+
+---
+This plugin works by decorating the original placeholder plugin in some hacky way and thus relies on that internal implementation to a certain extent. Use with care.
+
+It has not been tested against different Neos versions.

Resources/Private/package.json

@@ -0,0 +1,15 @@
+{
+    "description": "",
+    "license": "GNU GPLv3",
+    "private": true,
+    "scripts": {
+        "build": "neos-react-scripts build",
+        "watch": "neos-react-scripts watch"
+    },
+    "devDependencies": {
+        "@neos-project/neos-ui-extensibility": "*"
+    },
+    "neos": {
+        "buildTargetDirectory": "../Public/JavaScript"
+    }
+}

Resources/Private/src/index.js

@@ -0,0 +1 @@
+import './manifest.js';

Resources/Private/src/manifest.js

@@ -0,0 +1,71 @@
+import manifest from '@neos-project/neos-ui-extensibility';
+import { selectors } from '@neos-project/neos-ui-redux-store';
+
+/**
+ * Evaluates a ClientEval: expression with node and editorOptions in scope
+ * @param {string} input The ClientEval expression
+ * @param {object} node The node data
+ * @param {object} editorOptions The editor options
+ * @returns {any}
+ */
+const clientEval = (input, node, editorOptions) => {
+    return eval(input);
+}
+
+/**
+ * Augments the NeosPlaceholder plugin
+ * @param {Function} plugin The original plugin
+ * @param {(contextPath: string) => object} findNode A helper to find the node data for evaluation
+ * @param {object} editorOptions The inline editorOptions
+ * @returns {Function} A decorated version of the plugin
+ */
+const decoratePlaceholderPlugin = (plugin, findNode, editorOptions) => {
+    const originalGetPlaceholder = plugin.prototype.getPlaceholder;
+    plugin.prototype.getPlaceholder = function () {
+        const originalPlaceholder = originalGetPlaceholder.apply(this);
+        if (originalPlaceholder.startsWith('ClientEval:')) {
+            if (this.editor && this.editor.neos && this.editor.neos.contextPath) {
+                try {
+                    const node = findNode(this.editor.neos.contextPath);
+                    if (node) {
+                        return clientEval(originalPlaceholder.substring(11), node, editorOptions).toString();
+                    }
+                } catch (e) {
+                }
+            }
+        }
+        return originalPlaceholder;
+    };
+
+    // for some reason editor.neos is not yet available when initializing the plugin
+    const originalInit = plugin.prototype.init;
+    plugin.prototype.init = function() {
+        const init = originalInit.bind(this);
+        if (!this.editor || !this.editor.neos) {
+            setTimeout(() => init(), 100);
+        } else {
+            init();
+        }
+    };
+
+    return plugin;
+}
+
+manifest('Prgfx.Neos.DynamicPlaceholder', {}, (globalRegistry, { store }) => {
+    const ckeRegistry = globalRegistry.get('ckEditor5');
+    const ckeConfig = ckeRegistry.get('config');
+    const addExistingPlugin = ckeConfig.get('neosPlaceholder');
+    if (!addExistingPlugin) return;
+
+    const getNodeByContextPath = path => selectors.CR.Nodes.makeGetNodeByContextPathSelector(path)(store.getState());
+
+    const decorateAddedPlugin = (ckEditorConfiguration, options) => {
+        const r = addExistingPlugin(ckEditorConfiguration, options);
+        const index = r.plugins.findIndex(p => p.pluginName === 'NeosPlaceholder');
+        if (index >= 0) {
+            r.plugins[index] = decoratePlaceholderPlugin(r.plugins[index], getNodeByContextPath, options.editorOptions);
+        }
+        return r;
+    };
+    ckeConfig.set('neosPlaceholder', decorateAddedPlugin);
+});