feat: Update to pnpm example.

.gitignore

@@ -0,0 +1,6 @@
+.DS_Store
+**/.lowdefy/**
+**/.env
+**/node_modules/**
+**/dist/**
+api/dev/**

README.md

@@ -1,24 +1,85 @@
 # Lowdefy Plugins Example
 
-A plugin needs to be a npm package. The package is installed into the server using npm or yarn, so any of the supported protocols like `file:` or `git:` should work. We copy the `plugins` folder in your config into the server, so you can use relative paths there in the package specifier if you place your plugins in the `plugins` folder.
+A plugin needs to be a npm package. The package is installed into the server using preferable pnpm, but npm or yarn can also be used when not setup as a monorepo. Any of the supported protocols like `file:` or `git:` should work, including `workspace:*` in monorepo setups, like this example.
 
 You can have a look at the official Lowdefy plugins here:
-https://github.com/lowdefy/lowdefy/tree/main/packages/plugins
-The official plugins are built using swc, but is not really necessary, as the Lowdefy server is built with webpack, so it is simpler not to include a build step.
+https://github.com/lowdefy/lowdefy/tree/main/packages/plugins (TODO)
+The official plugins are built using swc, but is not necessary, as the Lowdefy server is built with webpack, so it is simpler not to include a build step.
 
 To import the plugin into your app, you can add the following to the root of your lowdefy config (replacing the `types` array):
 
 ```yaml
 plugins:
   - name: 'local-plugin'
-    version: 'file:./plugins/local-plugin'
+    version: 'workspace:*' # for local plugins in pnpm monorepo
   - name: 'npm-plugin'
-    version: 1.0.0
+    version: 1.0.0 # for plugins installed remotely from npm
 ```
 
-You can then use all of the types declared by the plugin as normal types.
+In Lowdefy v4, you can have plugins for Actions, Blocks, Operators (both build, client and server), Connectors and Requests, as well as the auth plugins, Callbacks, Provider and Events. Your plugin package can export any one of these types and does not need to include all types. Consider the following simple examples.
 
-The plugin `package,json` file should look like this:
+Plugins needs at least the following:
+- A `package.json` which declares the package and exports the plugin types.
+- A `types.js` file which exports the plugin names.
+- A file that exports all the types as named exports.
+- And the actual plugin code to be exported.
+
+You can then use all of the types declared by the plugin as normal types in your lowdefy app. You can change your folder structure in your package, but then you need to change the `exports` config to match your file structure.
+
+> NOTE: You should have a `types.js` file, which exports all the types declared by the package - the declared names in this file must be the same as the named exported in your package. This is used so that the build knows which types can be used from that plugin. The type names exported in the `types.js` are the type names you can use in your Lowdefy config.
+
+
+## To run this example
+
+1. Install pnpm see: https://pnpm.io/installation, it is advise to update to node v16.17 or greater and running `corepack enable`.
+2. Run `pnpm i`.
+3. Navigate / cd to app folder, and run `pnpm lowdefy dev`.
+
+## A simple client operator plugin
+
+Your plugin `package.json` needs to export the operator type:
+```json
+{
+  "name": "plugin-times-eleven-operator",
+  "version": "1.0.0",
+  "type": "module",
+  "exports": {
+    "./operators/client": "./operatorsClient.js",
+    "./types": "./types.js"
+  },
+  "files": [
+    "*"
+  ],
+  "dependencies": {}
+}
+```
+
+The `types.js` file should export the plugin name:
+```js
+export default {
+  operators: {
+    client: ['_times_eleven'],
+  },
+};
+```
+
+The `operatorsClient.js` file:
+```js
+export { default as _times_eleven } from './_times_eleven.js';
+```
+
+And the `_times_eleven` code:
+```js
+function _times_eleven({ params }) {
+  return params.number * 11;
+}
+
+export default _times_eleven;
+```
+
+## Multiple types in one plugin
+
+All plugin exports in `package.json` file that you can apply, only include the ones used:
 ```json
 {
   "name": "plugin-name",
@@ -42,12 +103,7 @@ The plugin `package,json` file should look like this:
 }
 ```
 
-You can change your folder structure in your package, but then you need to change the `exports` config to match your file structure.
-
-You should have a `types.js` file, which exports all the types declared by the package. This is used so that the build knows which types can be used from that plugin. The type names exported in the `types.js` are the type names you can use in your Lowdefy config.
-
-The `types.js` file should look like
-
+The export schema for the `types.js` file should look like, use the same type names here as in the named exports:
 ```js
 export default {
   actions: ['Action'],
@@ -60,21 +116,19 @@ export default {
   connections: ['Connection'],
   requests: ['Request'],
   operators: {
-    client: ['_build_operator', '_shared_operator'],
+    build: ['_build_operator', '_shared_operator'],
     client: ['_client_operator', '_shared_operator'],
     server: ['_server_operator', '_shared_operator'],
   },
 };
 ```
 
-The plugin should also have a file that exports all the types as named exports. So for example, you should have a `blocks.js`:
-
+Export the types as named exports. So for example, you should have a `blocks.js`:
 ```js
 export { default as Block } from './blocks/Block/Block.js';
 ```
 
-The block file also needs to change slightly, an example block is
-
+The block file also needs to change slightly, an example block is:
 ```js
 import React from 'react';
 import { blockDefaultProps } from '@lowdefy/block-utils';

app/lowdefy.yaml

@@ -0,0 +1,33 @@
+lowdefy: 4.0.0-alpha.36 # Please check for latest Lowdefy version.
+license: MIT
+
+plugins:
+  - name: 'plugin-name'
+    version: 'workspace:*'
+  - name: 'plugin-times-eleven-operator'
+    version: 'workspace:*'
+
+pages:
+  - id: plugin-example
+    type: Box
+    blocks:
+      - id: number
+        type: NumberInput
+        properties:
+          title: Type a number
+      - id: result
+        type: Html
+        properties:
+          html:
+            _nunjucks:
+              template: |
+                {% if number != null %}
+                  {{ number }} times eleven is: {{ result }}
+                {% endif %}
+              on:
+                number:
+                  _state: number
+                result:
+                  _times_eleven:
+                    number:
+                      _state: number

app/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "lowdefy-example-plugins",
+  "version": "1.0.0",
+  "license": "MIT",
+  "type": "module",
+  "scripts": {
+    "ldf:b": "lowdefy build",
+    "ldf:d": "lowdefy dev --log-level=debug --no-open",
+    "ldf:s": "lowdefy start",
+    "ldf": "lowdefy dev --no-open",
+    "lowdefy": "lowdefy"
+  },
+  "dependencies": {
+    "lowdefy": "4.0.0-alpha.36"
+  }
+}

package.json

@@ -0,0 +1,13 @@
+{
+  "name": "lowdefy-example-plugins-repo",
+  "version": "1.0.0",
+  "license": "MIT",
+  "packageManager": "[email protected]",
+  "dependencies": {
+    "lowdefy": "4.0.0-alpha.36"
+  },
+  "scripts": {
+  },
+  "devDependencies": {
+  }
+}

plugins/plugin-foo-operator/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "plugin-times-eleven-operator",
+  "version": "1.0.0",
+  "license": "MIT",
+  "type": "module",
+  "exports": {
+    "./operators/client": "./src/operatorsClient.js",
+    "./types": "./src/types.js"
+  },
+  "files": [
+    "src/*"
+  ],
+  "scripts": {
+  },
+  "devDependencies": {
+  }
+}

plugins/plugin-foo-operator/src/_times_eleven.js

@@ -0,0 +1,5 @@
+function _times_eleven({ params }) {
+  return params.number * 11;
+}
+
+export default _times_eleven;

plugins/plugin-foo-operator/src/operatorsClient.js

@@ -0,0 +1 @@
+export { default as _times_eleven } from './_times_eleven.js';

plugins/plugin-foo-operator/src/types.js

@@ -0,0 +1,5 @@
+export default {
+  operators: {
+    client: ['_times_eleven'],
+  },
+};

plugins/plugin-name/package.json

@@ -4,18 +4,18 @@
   "license": "MIT",
   "type": "module",
   "exports": {
-    "./auth/callbacks": "./auth/callbacks.js",
-    "./auth/events": "./auth/events.js",
-    "./auth/providers": "./auth/providers.js",
-    "./blocks": "./blocks.js",
-    "./connections": "./connections.js",
-    "./operators/build": "./operators/build.js",
-    "./operators/client": "./operators/client.js",
-    "./operators/server": "./operators/server.js",
-    "./types": "./types.js"
+    "./auth/callbacks": "./src/auth/callbacks.js",
+    "./auth/events": "./src/auth/events.js",
+    "./auth/providers": "./src/auth/providers.js",
+    "./blocks": "./src/blocks.js",
+    "./connections": "./src/connections.js",
+    "./operators/build": "./src/operators/build.js",
+    "./operators/client": "./src/operators/client.js",
+    "./operators/server": "./src/operators/server.js",
+    "./types": "./src/types.js"
   },
   "files": [
-    "*"
+    "src/*"
   ],
   "dependencies": {}
 }