@lowdefy/docs 4.0.0-alpha.6 → 4.0.0-alpha.7

package/blocks/input/ParagraphInput.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: ParagraphInput
     value_type: string
     category: input
-    schema: ../blocks/blocksAntd/src/blocks/ParagraphInput/ParagraphInput.json
+    schema: ../plugins/blocks/blocks-antd/src/blocks/ParagraphInput/schema.json
     filePath: blocks/input/ParagraphInput.yaml
     init_state_values:
       __type_block.properties.copyable: boolean

package/blocks/input/PasswordInput.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: PasswordInput
     value_type: string
     category: input
-    schema: ../blocks/blocksAntd/src/blocks/PasswordInput/PasswordInput.json
+    schema: ../plugins/blocks/blocks-antd/src/blocks/PasswordInput/schema.json
     filePath: blocks/input/PasswordInput.yaml
     description_content: |
       The `PasswordInput` block is a single line password input.

package/blocks/input/RadioSelector.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: RadioSelector
     value_type: any
     category: input
-    schema: ../blocks/blocksAntd/src/blocks/RadioSelector/RadioSelector.json
+    schema: ../plugins/blocks/blocks-antd/src/blocks/RadioSelector/schema.json
     filePath: blocks/input/RadioSelector.yaml
     init_state_values:
       __type_block.properties.options: object[]

package/blocks/input/RatingSlider.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: RatingSlider
     value_type: number
     category: input
-    schema: ../blocks/blocksAntd/src/blocks/RatingSlider/RatingSlider.json
+    schema: ../plugins/blocks/blocks-antd/src/blocks/RatingSlider/schema.json
     filePath: blocks/input/RatingSlider.yaml
     description_content: |
       The `RatingSlider` block allows a user to choose a numerical value on a slider input. It is typically used for scores or ratings. It has the option to have a "Not Applicable" checkbox, which leaves the value as null.

package/blocks/input/S3UploadButton.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: S3UploadButton
     value_type: object
     category: input
-    schema: ../blocks/blocksAntd/src/blocks/S3UploadButton/S3UploadButton.json
+    schema: ../plugins/plugins/plugin-aws/src/blocks/S3UploadButton/schema.json
     filePath: blocks/input/S3UploadButton.yaml
     description_content: |
       The `S3UploadButton` block allows a user to to upload a file to AWS S3.

package/blocks/input/Selector.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: Selector
     value_type: any
     category: input
-    schema: ../blocks/blocksAntd/src/blocks/Selector/Selector.json
+    schema: ../plugins/blocks/blocks-antd/src/blocks/Selector/schema.json
     filePath: blocks/input/Selector.yaml
     init_state_values:
       __type_block.properties.options: object[]

package/blocks/input/SliderColorSelector.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: SliderColorSelector
     value_type: string
     category: input
-    schema: ../blocks/blocksColorSelectors/src/blocks/SliderColorSelector/SliderColorSelector.json
+    schema: ../plugins/blocks/blocks-color-selectors/src/blocks/SliderColorSelector/schema.json
     filePath: blocks/input/SliderColorSelector.yaml
     description_content: |
       A slider color selector component.

package/blocks/input/SwatchesColorSelector.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: SwatchesColorSelector
     value_type: string
     category: input
-    schema: ../blocks/blocksColorSelectors/src/blocks/SwatchesColorSelector/SwatchesColorSelector.json
+    schema: ../plugins/blocks/blocks-color-selectors/src/blocks/SwatchesColorSelector/schema.json
     filePath: blocks/input/SwatchesColorSelector.yaml
     description_content: |
       A swatches color selector component.

package/blocks/input/Switch.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: Switch
     value_type: boolean
     category: input
-    schema: ../blocks/blocksAntd/src/blocks/Switch/Switch.json
+    schema: ../plugins/blocks/blocks-antd/src/blocks/Switch/schema.json
     filePath: blocks/input/Switch.yaml
     description_content: |
       The `Switch` block is an on/off input. It has a boolean value (true/false).

package/blocks/input/TextArea.yaml

@@ -18,11 +18,10 @@ _ref:
     block_type: TextArea
     value_type: string
     category: input
-    schema: ../blocks/blocksAntd/src/blocks/TextArea/TextArea.json
+    schema: ../plugins/blocks/blocks-antd/src/blocks/TextArea/schema.json
     filePath: blocks/input/TextArea.yaml
     init_state_values:
       __type_block.properties.autoSize: boolean
       __boolean_block.properties.autoSize: true
     description_content: |
       The `TextArea` block is a text input that has multiple rows of input. It can be set to a fixed number of rows, or it can expand automatically as the user inputs more text.
-      

package/blocks/input/TextInput.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: TextInput
     value_type: string
     category: input
-    schema: ../blocks/blocksAntd/src/blocks/TextInput/TextInput.json
+    schema: ../plugins/blocks/blocks-antd/src/blocks/TextInput/schema.json
     filePath: blocks/input/TextInput.yaml
     description_content: |
       The `TextInput` block is a single line text input.
@@ -41,19 +41,19 @@ _ref:
         block:
           id: prefix_suffix_example
           type: TextInput
-          properties: 
-            label: 
+          properties:
+            label:
               extra: Prefix and suffix text
             prefix: The cat
-            placeholder: chased 
+            placeholder: chased
             suffix: the rat
       - title: User name
         block:
           id: username
           type: TextInput
-          properties: 
+          properties:
             title: First Name
-            suffixIcon: UserOutlined
+            suffixIcon: AiOutlinedUser
             placeholder: Your name
-            label: 
+            label:
               span: 6

package/blocks/input/TitleInput.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: TitleInput
     value_type: string
     category: input
-    schema: ../blocks/blocksAntd/src/blocks/TitleInput/TitleInput.json
+    schema: ../plugins/blocks/blocks-antd/src/blocks/TitleInput/schema.json
     filePath: blocks/input/TitleInput.yaml
     init_state_values:
       __type_block.properties.copyable: boolean

package/blocks/input/TwitterColorSelector.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: TwitterColorSelector
     value_type: string
     category: input
-    schema: ../blocks/blocksColorSelectors/src/blocks/TwitterColorSelector/TwitterColorSelector.json
+    schema: ../plugins/blocks/blocks-color-selectors/src/blocks/TwitterColorSelector/schema.json
     filePath: blocks/input/TwitterColorSelector.yaml
     description_content: |
       A color selector component similar to the twitter color selector..

package/blocks/input/WeekSelector.yaml

@@ -18,7 +18,7 @@ _ref:
     block_type: WeekSelector
     value_type: date
     category: input
-    schema: ../blocks/blocksAntd/src/blocks/WeekSelector/WeekSelector.json
+    schema: ../plugins/blocks/blocks-antd/src/blocks/WeekSelector/schema.json
     filePath: blocks/input/WeekSelector.yaml
     description_content: |
       The `WeekSelector` block allows a user to select a week. The value is a date object, with day and time values of midnight on the first monday of the week GMT.

package/blocks/list/ControlledList.yaml

@@ -17,7 +17,7 @@ _ref:
   vars:
     block_type: ControlledList
     category: list
-    schema: ../blocks/blocksAntd/src/blocks/ControlledList/ControlledList.json
+    schema: ../plugins/blocks/blocks-antd/src/blocks/ControlledList/schema.json
     filePath: blocks/ControlledList/ControlledList.yaml
     description_content: |
       The ControlledList block renders a content area for all items in the array into the list card and provides easy UI elements to add or remove items in the list. All list blocks create a array in state at their block `id`. The list content areas are rendered for each index in the array. See the [List Concept](/lists) page for a detailed description on how to work with lists.
@@ -26,11 +26,11 @@ _ref:
     methods:
       - name: pushItem
         onClick:
-        - id: pushItem
-          type: CallMethod
-          params:
-            blockId: block_id
-            method: pushItem
+          - id: pushItem
+            type: CallMethod
+            params:
+              blockId: block_id
+              method: pushItem
       - name: unshiftItem
         onClick:
           - id: unshiftItem
@@ -45,7 +45,7 @@ _ref:
             params:
               blockId: block_id
               method: removeItem
-              args: 
+              args:
                 - 1
       - name: for index 1 moveItemDown
         onClick:
@@ -54,7 +54,7 @@ _ref:
             params:
               blockId: block_id
               method: moveItemDown
-              args: 
+              args:
                 - 1
       - name: for index 1 moveItemUp
         onClick:
@@ -63,10 +63,10 @@ _ref:
             params:
               blockId: block_id
               method: moveItemUp
-              args: 
+              args:
                 - 1
     init_state_values:
-      todos:  
+      todos:
         - Add the noodles.
         - Let it cook for a minute.
         - Add some 🌶.
@@ -86,7 +86,7 @@ _ref:
           style:
             paddingTop: 16
           properties:
-            content: 
+            content:
               _nunjucks:
                 template: |
                   ###### Todos State Value:
@@ -97,10 +97,10 @@ _ref:
                   value:
                     _yaml.stringify:
                       on:
-                        todos: 
+                        todos:
                           _state: todos
                       options:
-                        sortKeys: false 
+                        sortKeys: false
       - title: List of Contacts
         block:
           id: contacts
@@ -126,7 +126,7 @@ _ref:
                 label:
                   span: 10
                   align: right
-            
+
             - id: contacts.$.date_of_birth
               type: DateSelector
               layout:
@@ -143,7 +143,7 @@ _ref:
                 span: 12
               required: true
               properties:
-                title: Email address 
+                title: Email address
                 label:
                   span: 10
                   align: right
@@ -174,7 +174,7 @@ _ref:
           style:
             paddingTop: 16
           properties:
-            content: 
+            content:
               _nunjucks:
                 template: |
                   ###### Contacts State Value:
@@ -185,7 +185,7 @@ _ref:
                   value:
                     _yaml.stringify:
                       on:
-                        contacts: 
+                        contacts:
                           _state: contacts
                       options:
-                        sortKeys: false 
+                        sortKeys: false

package/blocks/list/List.yaml

@@ -17,25 +17,25 @@ _ref:
   vars:
     block_type: List
     category: list
-    schema: ../blocks/blocksBasic/src/blocks/List/List.json
+    schema: ../plugins/blocks/blocks-basic/src/blocks/List/schema.json
     filePath: blocks/list/List.yaml
     description_content: |
       The List block renders a content area for all items in the array. All list blocks create a array in state at their block `id`. The list content areas are rendered for each index in the array. See the [List Concept](/lists) page for a detailed description on how to work with lists.
     areas:
       - content
     init_state_values:
-      todos: 
-        - Bake a 🧁   
+      todos:
+        - Bake a 🧁
         - Eat a🍦
         - Phone a 🦖
     methods:
       - name: pushItem
         onClick:
-        - id: pushItem
-          type: CallMethod
-          params:
-            blockId: block_id
-            method: pushItem
+          - id: pushItem
+            type: CallMethod
+            params:
+              blockId: block_id
+              method: pushItem
       - name: unshiftItem
         onClick:
           - id: unshiftItem
@@ -50,7 +50,7 @@ _ref:
             params:
               blockId: block_id
               method: removeItem
-              args: 
+              args:
                 - 1
       - name: for index 1 moveItemDown
         onClick:
@@ -59,7 +59,7 @@ _ref:
             params:
               blockId: block_id
               method: moveItemDown
-              args: 
+              args:
                 - 1
       - name: for index 1 moveItemUp
         onClick:
@@ -68,7 +68,7 @@ _ref:
             params:
               blockId: block_id
               method: moveItemUp
-              args: 
+              args:
                 - 1
     examples:
       - title: Todo List
@@ -92,7 +92,7 @@ _ref:
                 shrink: 1
               properties:
                 title: Add item
-                icon: PlusOutlined
+                icon: AiOutlinedPlus
               events:
                 onClick:
                   - id: add
@@ -119,7 +119,7 @@ _ref:
                   layout:
                     shrink: 1
                   properties:
-                    name: MinusCircleOutlined
+                    name: AiOutlinedMinusCircle
                     size: 18
                   events:
                     onClick:
@@ -133,7 +133,6 @@ _ref:
                           method: removeItem
                           args:
                             - _index: 0
-      
 
         extra:
           id: ex_state
@@ -141,7 +140,7 @@ _ref:
           style:
             paddingTop: 16
           properties:
-            content: 
+            content:
               _nunjucks:
                 template: |
                   ###### Todos State Value:
@@ -152,7 +151,7 @@ _ref:
                   value:
                     _yaml.stringify:
                       on:
-                        todos: 
+                        todos:
                           _state: todos
                       options:
-                        sortKeys: false 
+                        sortKeys: false

package/blocks/list/TimelineList.yaml

@@ -12,12 +12,14 @@
 # See the License for the specific language governing permissions and
 # limitations under the License.
 
+# TODO: Fix schema to add to docs
+
 _ref:
   path: templates/blocks/template.yaml.njk
   vars:
     block_type: TimelineList
     category: list
-    schema: ../blocks/blocksAntd/src/blocks/TimelineList/TimelineList.json
+    schema: ../plugins/blocks/blocks-antd/src/blocks/TimelineList/schema.json
     filePath: blocks/TimelineList/TimelineList.yaml
     description_content: |
       The TimelineList block renders a content area for all items in the array. All list blocks create a array in state at their block `id`. The list content areas are rendered for each index in the array. See the [List Concept](/lists) page for a detailed description on how to work with lists.
@@ -28,41 +30,41 @@ _ref:
     init_state_values:
       shipment_events:
         - type: Order Placed
-          icon: ShoppingCartTwoTone
+          icon: AiTwoToneShoppingCart
           color: '#2f54eb'
           orderNumber: 2112
-          timestamp: 
+          timestamp:
             _date: '2021-02-10T20:30:00.000Z'
           item:
             code: ax2m-83kl9-ck
             title: Useless Glue
         - type: Shipped
-          icon: GiftTwoTone
+          icon: AiTwoToneGift
           color: '#fa8c16'
           orderNumber: 2112
-          timestamp: 
+          timestamp:
             _date: '2021-02-11T08:33:00.000Z'
         - type: Cleared Customs
-          icon: FileDoneTwoTone
+          icon: AiTwoToneFileDone
           color: '#13c2c2'
           orderNumber: 2112
-          timestamp: 
+          timestamp:
             _date: '2021-02-11T16:12:00.000Z'
         - type: Delivered
-          icon: CheckCircleTwoTone
+          icon: AiTwoToneCheckCircle
           color: '#52c41a'
           orderNumber: 2112
-          timestamp: 
+          timestamp:
             _date: '2021-02-11T16:12:00.000Z'
 
     methods:
       - name: pushItem
         onClick:
-        - id: pushItem
-          type: CallMethod
-          params:
-            blockId: block_id
-            method: pushItem
+          - id: pushItem
+            type: CallMethod
+            params:
+              blockId: block_id
+              method: pushItem
       - name: unshiftItem
         onClick:
           - id: unshiftItem
@@ -77,7 +79,7 @@ _ref:
             params:
               blockId: block_id
               method: removeItem
-              args: 
+              args:
                 - 1
       - name: for index 1 moveItemDown
         onClick:
@@ -86,7 +88,7 @@ _ref:
             params:
               blockId: block_id
               method: moveItemDown
-              args: 
+              args:
                 - 1
       - name: for index 1 moveItemUp
         onClick:
@@ -95,8 +97,8 @@ _ref:
             params:
               blockId: block_id
               method: moveItemUp
-              args: 
-               - 1
+              args:
+                - 1
     examples:
       - title: Shipment Event Log
         block:
@@ -117,7 +119,7 @@ _ref:
           style:
             paddingTop: 16
           properties:
-            content: 
+            content:
               _nunjucks:
                 template: |
                   ###### Shipment Events State Value:
@@ -128,8 +130,7 @@ _ref:
                   value:
                     _yaml.stringify:
                       on:
-                        shipment_events: 
+                        shipment_events:
                           _state: shipment_events
                       options:
-                        sortKeys: false 
-            
+                        sortKeys: false

package/concepts/cli.yaml

@@ -58,10 +58,10 @@ _ref:
 
             The `build` command runs a Lowdefy build. The options are:
 
-            - `--base-directory <base-directory>`: Change base directory. The default is the current working directory.
+            - `--config-directory <config-directory>`: Change config directory. The default is the current working directory.
             - `--blocks-server-url <blocks-server-url>`: The URL from where Lowdefy blocks will be served. See below for more information.
             - `--disable-telemetry`: Disable telemetry.
-            - `--output-directory <output-directory>`: Change the directory to which build artifacts are saved. The default is `<base-directory>/.lowdefy/build`.
+            - `--output-directory <output-directory>`: Change the directory to which build artifacts are saved. The default is `<config-directory>/.lowdefy/build`.
             - `--ref-resolver <ref-resolver-function-path>`: Path to a JavaScript file containing a `_ref` resolver function to be used as the app default `_ref` resolver.
 
             ## build-netlify
@@ -69,7 +69,7 @@ _ref:
 
             We recommend setting the build command to `npx lowdefy@latest build-netlify`. The Netlify publish directory should be set to `.lowdefy/publish`, and the functions directory set to `.lowdefy/functions`.
 
-            - `--base-directory <base-directory>`: Change base directory. The default is the current working directory (The base directory should rather be configured in the Netlify build settings).
+            - `--config-directory <config-directory>`: Change config directory. The default is the current working directory (The config directory should rather be configured in the Netlify build settings).
             - `--blocks-server-url <blocks-server-url>`: The URL from where Lowdefy blocks will be served. See below for more information.
             - `--disable-telemetry`: Disable telemetry.
             - `--ref-resolver <ref-resolver-function-path>`: Path to a JavaScript file containing a `_ref` resolver function to be used as the app default `_ref` resolver.
@@ -78,14 +78,14 @@ _ref:
 
             The Lowdefy CLI caches block metadata, and build and server scripts in the `.lowdefy/cache` directory. These cached files can be removed using the `clean-cache` command.
 
-            - `--base-directory <base-directory>`: Change base directory. The default is the current working directory.
+            - `--config-directory <config-directory>`: Change config directory. The default is the current working directory.
             - `--disable-telemetry`: Disable telemetry.
 
             ## dev
 
             The `dev` command starts a Lowdefy development server, running locally. It can be accessed in a browser at [http://localhost:3000](http://localhost:3000). The CLI watches the file system, and rebuilds the app and reloads served pages every time a change is made to any of the files in the project directory.
 
-            - `--base-directory <base-directory>`: Change base directory. The default is the current working directory.
+            - `--config-directory <config-directory>`: Change config directory. The default is the current working directory.
             - `--blocks-server-url <blocks-server-url>`: The URL from where Lowdefy blocks will be served. See below for more information.
             - `--disable-telemetry`: Disable telemetry.
             - `--port <port>`: Change the port the server is hosted at. The default is `3000`.
@@ -113,13 +113,13 @@ _ref:
             Options set in the `lowdefy.yaml` should be defined in camelCase. The options that can be set are:
             - `blocksServerUrl: string`: The URL from where Lowdefy blocks will be served. See below for more information.
             - `disableTelemetry: boolean`: Disable telemetry.
-            - `outputDirectory: string`: Change the directory to which build artifacts are saved. The default is `<base-directory>/.lowdefy/build`.
+            - `outputDirectory: string`: Change the directory to which build artifacts are saved. The default is `<config-directory>/.lowdefy/build`.
             - `refResolver: string`: Path to a JavaScript file containing a `_ref` resolver function to be used as the app default `_ref` resolver.
             - `port: number`: Change the port the server is hosted at. The default is `3000`.
             - `watch: string[]`: A list of paths to files or directories that should be watched for changes.
             - `watchIgnore: string[]`: A list of paths to files or directories that should be ignored by the file watcher. Globs are supported.
 
-            The `--base-directory` option cannot be set from the `lowdefy.yaml` file.
+            The `--config-directory` option cannot be set from the `lowdefy.yaml` file.
 
 
             # Telemetry

package/concepts/custom-blocks.yaml

@@ -45,7 +45,7 @@ _ref:
 
             ```yaml
             name: dashboard-app
-            lowdefy: 3.23.1
+            lowdefy: 3.23.2
             types:
               AmChartsXY:
                 url: https://blocks-cdn.lowdefy.com/v3.10.1/blocks-amcharts/meta/AmChartsXY.json
@@ -95,7 +95,7 @@ _ref:
 
             ```yaml
             name: dashboard-app
-            lowdefy: 3.23.1
+            lowdefy: 3.23.2
             types:
               MyCustomBlock:
                 url: http://localhost:3002/meta/MyCustomBlock.json
@@ -123,6 +123,20 @@ _ref:
 
             - `basePath: string`: The base path setting for the application. This variable is used to prefix route paths for example `${basePath}/public/logo-square-light-theme.png`. The default base path is ''.
             - `blockId: string`: The block's id within the Lowdefy app, this is useful for setting a unique `id` on DOM elements.
+            - `components: object`: Helper React components that are exposed to blocks to use internally.
+              - `Icon`: component`: Lowdefy standard Icon React component to render build in icons.
+              - `Link`: component`: Lowdefy standard Link React component used as links to pages or external urls. The following props apply:
+                - `ariaLabel: string`: Arial-label to apply to link tag.
+                - `back: boolean`: When the link is clicked, trigger the browser back.
+                - `home: boolean`: When the link is clicked, route to the home page.
+                - `input: object`: When the link is clicked, pass data as the input object to the next Lowdefy page.  Can only be used with pageId link and newTab false. See [Input]( TODO: Link to input page? ).
+                - `newTab: boolean`: When the link is clicked, open the page in a new browser tab.
+                - `pageId: string`: When the link is clicked, route to the provided Lowdefy page.
+                - `rel: string`: The relationship of the linked URL as space-separated link types.
+                - `replace: boolean`: Prevent adding a new entry into browser history by replacing the url instead of pushing into history. Can only be used with pageId link and newTab false.
+                - `scroll: boolean`: Disable scrolling to the top of the page after page transition. Can only be used with pageId link and newTab false.
+                - `url: string`: When the link is clicked, route to an external url.
+                - `urlQuery: object`: When the link is clicked, pass data as a url query to the next page. See [url query]( TODO: Link to url query page? ).
             - `content: object`: Passed to `container` and `context` block categories. The `content` object with methods to render sub blocks into content areas. The method name is the same as the area key, for example, 'content.content()` renders a blocks default `content` area.
             - `events: object`: All events defined on the block in the Lowdefy app config.
               - `[event_key]: object`: Event keys gives a handle name to the event details.

package/concepts/custom-code.yaml

@@ -29,6 +29,7 @@ _ref:
       - id: md1
         type: MarkdownWithCode
         properties:
+          # TODO: Remove JsAction reference.
           content: |
             Lowdefy runs as a single page web app (SPA). It is possible to extend the functionality of a Lowdefy app by loading custom code (HTML, CSS and JavaScript) into the HTML `head` and `body` to of the default `index.html` page.
 
@@ -53,7 +54,7 @@ _ref:
 
             ```yaml
             name: google-analytics-example
-            lowdefy: 3.23.1
+            lowdefy: 3.23.2
             # ...
             app:
               html:
@@ -98,7 +99,7 @@ _ref:
             ```yaml
             # /lowdefy.yaml
             name: json-todos
-            lowdefy: 3.23.1
+            lowdefy: 3.23.2
             app:
               html:
                 appendHead:
@@ -109,7 +110,7 @@ _ref:
                 events:
                   onEnter:
                     - id: get_todos
-                      type: JsAction
+                      type: JsAction # TODO:
                       params:
                         name: fetchTodos # Trigger the custom JavaScript action.
                         args:
@@ -156,7 +157,7 @@ _ref:
             ```yaml
             # /lowdefy.yaml
             name: operator-example
-            lowdefy: 3.23.1
+            lowdefy: 3.23.2
             app:
               html:
                 appendHead: