@lowdefy/blocks-basic 3.23.2 → 4.0.0-alpha.6

package/dist/blocks/Anchor/Anchor.js

@@ -0,0 +1,89 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/*
+  Copyright 2020-2021 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import { get, type } from '@lowdefy/helpers';
+import { blockDefaultProps } from '@lowdefy/block-utils';
+const Strong = ({ children , strong  })=>strong ? /*#__PURE__*/ _jsx("b", {
+        children: children
+    }) : /*#__PURE__*/ _jsx(_Fragment, {
+        children: children
+    })
+;
+const Tag = ({ blockId , children , className , disabled , href , Link , newTab , onClick , rel  })=>disabled ? /*#__PURE__*/ _jsx("span", {
+        id: blockId,
+        className: className,
+        children: children
+    }) : /*#__PURE__*/ _jsx(Link, {
+        id: blockId,
+        className: className,
+        href: href,
+        onClick: onClick,
+        rel: rel || 'noopener noreferrer',
+        target: newTab ? '_blank' : '_self',
+        children: children
+    })
+;
+const AnchorBlock = ({ blockId , events , components: { Icon , Link  } , loading , methods , properties ,  })=>{
+    const title = type.isNone(properties.title) ? type.isNone(properties.href) ? properties.href : blockId : properties.title;
+    const showLoading = get(events, 'onClick.loading') || loading;
+    const disabled = properties.disabled || showLoading;
+    return(/*#__PURE__*/ _jsx(Tag, {
+        blockId: blockId,
+        className: methods.makeCssClass([
+            properties.style,
+            disabled && {
+                color: '#BEBEBE',
+                cursor: 'not-allowed'
+            }, 
+        ]),
+        disabled: disabled,
+        href: properties.href,
+        Link: Link,
+        rel: properties.rel,
+        newTab: properties.newTab,
+        onClick: ()=>methods.triggerEvent({
+                name: 'onClick'
+            })
+        ,
+        children: /*#__PURE__*/ _jsxs(Strong, {
+            strong: properties.strong,
+            children: [
+                properties.icon && /*#__PURE__*/ _jsx(Icon, {
+                    blockId: `${blockId}_icon`,
+                    events: events,
+                    properties: showLoading ? {
+                        name: 'LoadingOutlined',
+                        spin: true
+                    } : properties.icon
+                }),
+                ` ${title}`
+            ]
+        })
+    }));
+};
+AnchorBlock.defaultProps = blockDefaultProps;
+AnchorBlock.meta = {
+    category: 'display',
+    loading: {
+        type: 'SkeletonParagraph',
+        properties: {
+            lines: 1
+        }
+    },
+    icons: [],
+    styles: []
+};
+export default AnchorBlock;

package/dist/blocks/Anchor/schema.json

@@ -0,0 +1,61 @@
+{
+  "type": "object",
+  "properties": {
+    "type": "object",
+    "additionalProperties": false,
+    "properties": {
+      "disabled": {
+        "type": "boolean",
+        "default": false,
+        "description": "Disable the anchor if true."
+      },
+      "icon": {
+        "type": ["string", "object"],
+        "description": "Name of an Ant Design Icon or properties of an Icon block for anchor icon.",
+        "docs": {
+          "displayType": "icon"
+        }
+      },
+      "href": {
+        "type": "string",
+        "description": "Anchor element href property."
+      },
+      "rel": {
+        "type": "string",
+        "default": "noopener noreferrer",
+        "description": "The relationship of the linked URL as space-separated link types."
+      },
+      "newTab": {
+        "type": "boolean",
+        "default": false,
+        "description": "Open link in a new tab when the anchor link is clicked."
+      },
+      "strong": {
+        "type": "boolean",
+        "default": false,
+        "description": "Makes the text bold when true."
+      },
+      "style": {
+        "type": "object",
+        "description": "Css style object to applied to anchor.",
+        "docs": {
+          "displayType": "yaml"
+        }
+      },
+      "title": {
+        "type": "string",
+        "description": "Text to display in the anchor."
+      }
+    }
+  },
+  "events": {
+    "type": "object",
+    "additionalProperties": false,
+    "properties": {
+      "onClick": {
+        "type": "array",
+        "description": "Called when Anchor is clicked."
+      }
+    }
+  }
+}

package/dist/blocks/Box/Box.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+  Copyright 2020-2021 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import { blockDefaultProps } from '@lowdefy/block-utils';
+const Box = ({ blockId , content , events , methods , properties  })=>/*#__PURE__*/ _jsx("div", {
+        id: blockId,
+        "data-testid": blockId,
+        onClick: ()=>methods.triggerEvent({
+                name: 'onClick'
+            })
+        ,
+        className: methods.makeCssClass([
+            {
+                outline: 'none',
+                cursor: events.onClick && 'pointer'
+            },
+            properties.style, 
+        ]),
+        children: properties.content || content.content && content.content()
+    })
+;
+Box.defaultProps = blockDefaultProps;
+Box.meta = {
+    category: 'container',
+    loading: false,
+    icons: [],
+    styles: []
+};
+export default Box;

package/dist/blocks/Box/schema.json

@@ -0,0 +1,30 @@
+{
+  "type": "object",
+  "properties": {
+    "type": "object",
+    "additionalProperties": false,
+    "properties": {
+      "content": {
+        "type": "string",
+        "description": "Box content string. Overrides the \"content\" content area."
+      },
+      "style": {
+        "type": "object",
+        "description": "Css style object to apply to Box div.",
+        "docs": {
+          "displayType": "yaml"
+        }
+      }
+    }
+  },
+  "events": {
+    "type": "object",
+    "additionalProperties": false,
+    "properties": {
+      "onClick": {
+        "type": "array",
+        "description": "Trigger actions when the Box is clicked."
+      }
+    }
+  }
+}

package/dist/blocks/DangerousHtml/DangerousHtml.js

@@ -0,0 +1,58 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+  Copyright 2020-2021 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import DOMPurify from 'dompurify';
+import { blockDefaultProps } from '@lowdefy/block-utils';
+import { type } from '@lowdefy/helpers';
+let DangerousHtml = class DangerousHtml extends React.Component {
+    componentDidMount() {
+        const htmlString = type.isNone(this.props.properties.html) ? '' : this.props.properties.html.toString();
+        this.div.innerHTML = DOMPurify.sanitize(htmlString, this.DOMPurifyOptions);
+    }
+    componentDidUpdate() {
+        const htmlString = type.isNone(this.props.properties.html) ? '' : this.props.properties.html.toString();
+        this.div.innerHTML = DOMPurify.sanitize(htmlString, this.DOMPurifyOptions);
+    }
+    render() {
+        const { blockId , properties , methods  } = this.props;
+        return(/*#__PURE__*/ _jsx("div", {
+            id: blockId,
+            "data-testid": blockId,
+            ref: (el)=>{
+                if (el) {
+                    this.div = el;
+                }
+            },
+            className: methods.makeCssClass(properties.style)
+        }));
+    }
+    constructor(props){
+        super(props);
+        this.div = {
+            innerHTML: ''
+        };
+        // we do not revaluate DOMPurifyOptions improve options safety by not making options dynamic.
+        this.DOMPurifyOptions = props.properties.DOMPurifyOptions;
+    }
+};
+DangerousHtml.defaultProps = blockDefaultProps;
+DangerousHtml.meta = {
+    category: 'display',
+    loading: false,
+    icons: [],
+    styles: []
+};
+export default DangerousHtml;

package/dist/blocks/DangerousHtml/schema.json

@@ -0,0 +1,30 @@
+{
+  "type": "object",
+  "properties": {
+    "type": "object",
+    "additionalProperties": false,
+    "properties": {
+      "html": {
+        "type": "string",
+        "description": "Content to be rendered as Html.",
+        "docs": {
+          "displayType": "text-area"
+        }
+      },
+      "DOMPurifyOptions": {
+        "type": "object",
+        "description": "Customize DOMPurify options. Options are only applied when the block is mounted, thus any parsed settings is only applied at first render.",
+        "docs": {
+          "displayType": "yaml"
+        }
+      },
+      "style": {
+        "type": "object",
+        "description": "Css style object to apply to Html div.",
+        "docs": {
+          "displayType": "yaml"
+        }
+      }
+    }
+  }
+}

package/dist/blocks/Html/Html.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+  Copyright 2020-2021 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import { blockDefaultProps, HtmlComponent } from '@lowdefy/block-utils';
+const HtmlBlock = ({ blockId , properties , methods  })=>/*#__PURE__*/ _jsx(HtmlComponent, {
+        div: true,
+        html: properties.html,
+        id: blockId,
+        methods: methods,
+        style: properties.style
+    })
+;
+HtmlBlock.defaultProps = blockDefaultProps;
+HtmlBlock.meta = {
+    category: 'display',
+    loading: false,
+    icons: [],
+    styles: []
+};
+export default HtmlBlock;

package/dist/blocks/Html/schema.json

@@ -0,0 +1,23 @@
+{
+  "type": "object",
+  "properties": {
+    "type": "object",
+    "additionalProperties": false,
+    "properties": {
+      "html": {
+        "type": "string",
+        "description": "Content to be rendered as Html.",
+        "docs": {
+          "displayType": "text-area"
+        }
+      },
+      "style": {
+        "type": "object",
+        "description": "Css style object to apply to Html div.",
+        "docs": {
+          "displayType": "yaml"
+        }
+      }
+    }
+  }
+}

package/dist/blocks/Icon/Icon.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+  Copyright 2020-2021 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import { blockDefaultProps } from '@lowdefy/block-utils';
+const IconBlock = ({ components: { Icon  } , ...props })=>/*#__PURE__*/ _jsx(Icon, {
+        ...props
+    })
+;
+IconBlock.defaultProps = blockDefaultProps;
+IconBlock.meta = {
+    category: 'display',
+    loading: false,
+    icons: [],
+    styles: []
+};
+export default IconBlock;

package/dist/blocks/Icon/schema.json

@@ -0,0 +1,63 @@
+{
+  "type": "object",
+  "properties": {
+    "type": "object",
+    "additionalProperties": false,
+    "properties": {
+      "color": {
+        "type": "string",
+        "description": "Primary icon color.",
+        "docs": {
+          "displayType": "color"
+        }
+      },
+      "name": {
+        "type": "string",
+        "default": "AiCloseCircleOutlined",
+        "description": "Name of icon to be displayed."
+      },
+      "rotate": {
+        "type": "number",
+        "description": "Number of degrees to rotate the icon."
+      },
+      "size": {
+        "type": ["string", "number"],
+        "description": "Size of the icon.",
+        "docs": {
+          "displayType": "number"
+        }
+      },
+      "spin": {
+        "type": "boolean",
+        "default": false,
+        "description": "Continuously spin icon with animation."
+      },
+      "title": {
+        "type": "string",
+        "description": "Icon description for accessibility."
+      },
+      "style": {
+        "type": "object",
+        "description": "CSS style object.",
+        "docs": {
+          "displayType": "yaml"
+        }
+      },
+      "disableLoadingIcon": {
+        "type": "boolean",
+        "default": false,
+        "description": "While loading after the icon has been clicked, don't render the loading icon."
+      }
+    }
+  },
+  "events": {
+    "type": "object",
+    "additionalProperties": false,
+    "properties": {
+      "onClick": {
+        "type": "array",
+        "description": "Trigger actions when icon is clicked."
+      }
+    }
+  }
+}

package/dist/blocks/Img/Img.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+  Copyright 2020-2021 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import { blockDefaultProps } from '@lowdefy/block-utils';
+const ImgBlock = ({ blockId , events , properties , methods  })=>{
+    const { style , ...allProps } = properties;
+    return(/*#__PURE__*/ _jsx("img", {
+        ...allProps,
+        id: blockId,
+        "data-testid": blockId,
+        onClick: ()=>methods.triggerEvent({
+                name: 'onClick'
+            })
+        ,
+        className: methods.makeCssClass([
+            {
+                outline: 'none',
+                cursor: events.onClick && 'pointer'
+            },
+            style, 
+        ])
+    }));
+};
+ImgBlock.defaultProps = blockDefaultProps;
+ImgBlock.meta = {
+    category: 'display',
+    loading: false,
+    icons: [],
+    styles: []
+};
+export default ImgBlock;

package/dist/blocks/Img/schema.json

@@ -0,0 +1,59 @@
+{
+  "type": "object",
+  "properties": {
+    "type": "object",
+    "additionalProperties": false,
+    "required": ["src"],
+    "properties": {
+      "src": {
+        "type": "string",
+        "description": "The image URL."
+      },
+      "alt": {
+        "type": "string",
+        "description": "Alternative text description of the image."
+      },
+      "crossOrigin": {
+        "type": "string",
+        "enum": ["anonymous", "use-credentials"],
+        "description": "Indicates if the fetching of the image must be done using a CORS request."
+      },
+      "decoding": {
+        "type": "string",
+        "enum": ["sync", "async", "auto"],
+        "description": "An image decoding hint to the browser. Sync for atomic presentation with other content, async,  to reduce delay in presenting other content and auto leave to browser to decide."
+      },
+      "height": {
+        "type": "number",
+        "description": "Height of the image."
+      },
+      "loading": {
+        "type": "string",
+        "enum": ["eager", "lazy"],
+        "description": "How the browser should load the image. Eager loads the image immediately, lazy, defers loading until the image it reaches a calculated distance from the viewport, as defined by the browser."
+      },
+      "sizes": {
+        "type": "string",
+        "description": "Indicating a set of source sizes of strings separated by commas."
+      },
+      "srcSet": {
+        "type": "string",
+        "description": "Possible image sources for the user agent to use, strings separated by commas.",
+        "docs": {
+          "displayType": "text-area"
+        }
+      },
+      "style": {
+        "type": "object",
+        "description": "Css style object to applied to the image.",
+        "docs": {
+          "displayType": "yaml"
+        }
+      },
+      "width": {
+        "type": "number",
+        "description": "Width of the image."
+      }
+    }
+  }
+}

package/dist/blocks/List/List.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+  Copyright 2020-2021 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React, { useEffect } from 'react';
+import { blockDefaultProps } from '@lowdefy/block-utils';
+import Box from '../Box/Box.js';
+const List = ({ blockId , events , list , methods , properties  })=>{
+    useEffect(()=>{
+        methods.registerMethod('pushItem', methods.pushItem);
+        methods.registerMethod('unshiftItem', methods.unshiftItem);
+        methods.registerMethod('removeItem', methods.removeItem);
+        methods.registerMethod('moveItemDown', methods.moveItemDown);
+        methods.registerMethod('moveItemUp', methods.moveItemUp);
+    }, []);
+    return(/*#__PURE__*/ _jsx(Box, {
+        blockId: blockId,
+        events: events,
+        properties: {
+            style: {
+                ...properties.direction ? {
+                    display: 'flex',
+                    flexDirection: properties.direction,
+                    flexWrap: properties.wrap ? properties.wrap : 'wrap',
+                    overflow: properties.scroll ? 'auto' : 'visible'
+                } : {},
+                ...properties.style
+            }
+        },
+        methods: methods,
+        content: {
+            content: ()=>list.map((item)=>item.content()
+                )
+        }
+    }));
+};
+List.defaultProps = blockDefaultProps;
+List.meta = {
+    category: 'list',
+    valueType: 'array',
+    loading: false,
+    icons: [],
+    styles: []
+};
+export default List;

package/dist/blocks/List/schema.json

@@ -0,0 +1,40 @@
+{
+  "type": "object",
+  "properties": {
+    "type": "object",
+    "additionalProperties": false,
+    "properties": {
+      "direction": {
+        "type": "string",
+        "enum": ["row", "column", "row-reverse", "column-reverse"],
+        "description": "List content along a 'row' or down a 'column'. Applies the 'flex-direction' css property to the List block."
+      },
+      "wrap": {
+        "type": "string",
+        "enum": ["wrap", "nowrap", "wrap-reverse"],
+        "description": "Specifies wrapping style to be applied to List block as 'wrap', 'nowrap' or 'wrap-reverse'. Applies the 'flex-wrap' css property to the List block - defaults to 'wrap', requires List direction to be set."
+      },
+      "scroll": {
+        "type": "boolean",
+        "description": "Specifies whether scrolling should be applied to the List, can be true or false. Applies the 'overflow' css property to the List block - defaults to 'visible', requires List direction to be set."
+      },
+      "style": {
+        "type": "object",
+        "description": "Css style object to apply to List block.",
+        "docs": {
+          "displayType": "yaml"
+        }
+      }
+    }
+  },
+  "events": {
+    "type": "object",
+    "additionalProperties": false,
+    "properties": {
+      "onClick": {
+        "type": "array",
+        "description": "Trigger actions when the List is clicked."
+      }
+    }
+  }
+}