@lowdefy/blocks-antd 4.0.0-rc.8 → 4.0.0

package/dist/blocks/Sider/Sider.js

@@ -1,5 +1,5 @@
 /*
-  Copyright 2020-2023 Lowdefy, Inc
+  Copyright 2020-2024 Lowdefy, Inc
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
@@ -17,7 +17,7 @@ import { blockDefaultProps } from '@lowdefy/block-utils';
 import { get } from '@lowdefy/helpers';
 import { Layout } from 'antd';
 const Sider = Layout.Sider;
-const triggerSetOpen = async ({ state , setOpen , methods , rename  })=>{
+const triggerSetOpen = async ({ state, setOpen, methods, rename })=>{
     if (!state) {
         await methods.triggerEvent({
             name: get(rename, 'events.onClose', {
@@ -34,12 +34,12 @@ const triggerSetOpen = async ({ state , setOpen , methods , rename  })=>{
     }
     setOpen(state);
 };
-const SiderBlock = ({ blockId , properties , content , methods , rename  })=>{
+const SiderBlock = ({ blockId, properties, content, methods, rename })=>{
     const [openState, setOpen] = useState(!properties.initialCollapsed);
     useEffect(()=>{
         methods.registerMethod(get(rename, 'methods.toggleOpen', {
             default: 'toggleOpen'
-        }), async ()=>await triggerSetOpen({
+        }), ()=>triggerSetOpen({
                 state: !openState,
                 setOpen,
                 methods,
@@ -47,7 +47,7 @@ const SiderBlock = ({ blockId , properties , content , methods , rename  })=>{
             }));
         methods.registerMethod(get(rename, 'methods.setOpen', {
             default: 'setOpen'
-        }), async ({ open  })=>await triggerSetOpen({
+        }), ({ open })=>triggerSetOpen({
                 state: !!open,
                 setOpen,
                 methods,

package/dist/blocks/Sider/style.less

@@ -1,5 +1,5 @@
 /*
-  Copyright 2020-2023 Lowdefy, Inc
+  Copyright 2020-2024 Lowdefy, Inc
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.

package/dist/blocks/Slider/Slider.js

@@ -0,0 +1,76 @@
+/*
+  Copyright 2020-2024 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';
+import { Slider } from 'antd';
+import classNames from 'classnames';
+import Label from '../Label/Label.js';
+const SliderBlock = ({ blockId, components: { Icon, Link }, events, loading, methods, properties, required, validation, value })=>{
+    return /*#__PURE__*/ React.createElement(Label, {
+        blockId: blockId,
+        components: {
+            Icon,
+            Link
+        },
+        events: events,
+        methods: methods,
+        properties: {
+            title: properties.title,
+            size: properties.size,
+            ...properties.label
+        },
+        required: required,
+        validation: validation,
+        content: {
+            content: ()=>/*#__PURE__*/ React.createElement(Slider, {
+                    id: `${blockId}_input`,
+                    className: classNames(methods.makeCssClass(properties.inputStyle)),
+                    disabled: properties.disabled || loading,
+                    dots: properties.dots,
+                    handleStyle: properties.handleStyle,
+                    included: properties.included,
+                    marks: properties.marks,
+                    max: properties.max,
+                    min: properties.min,
+                    railStyle: properties.railStyle,
+                    range: properties.range,
+                    reverse: properties.reverse,
+                    step: properties.step,
+                    tooltip: properties.tooltip,
+                    trackStyle: properties.trackStyle,
+                    vertical: properties.vertical,
+                    onChange: (val)=>{
+                        methods.setValue(val);
+                        methods.triggerEvent({
+                            name: 'onChange'
+                        });
+                    },
+                    value: value
+                })
+        }
+    });
+};
+SliderBlock.defaultProps = blockDefaultProps;
+SliderBlock.meta = {
+    valueType: 'any',
+    category: 'input',
+    icons: [
+        ...Label.meta.icons
+    ],
+    styles: [
+        'blocks/Slider/style.less'
+    ]
+};
+export default SliderBlock;

package/dist/blocks/Slider/style.less

@@ -0,0 +1,18 @@
+/*
+  Copyright 2020-2024 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 'antd/lib/slider/style/index.less';
+@import '../Label/style.less';

package/dist/blocks/Statistic/Statistic.js

@@ -1,5 +1,5 @@
 /*
-  Copyright 2020-2023 Lowdefy, Inc
+  Copyright 2020-2024 Lowdefy, Inc
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
@@ -16,9 +16,13 @@
 import { Statistic } from 'antd';
 import { type } from '@lowdefy/helpers';
 import { blockDefaultProps, renderHtml } from '@lowdefy/block-utils';
-const StatisticBlock = ({ blockId , components: { Icon  } , events , properties , methods  })=>/*#__PURE__*/ React.createElement(Statistic, {
+const StatisticBlock = ({ blockId, components: { Icon }, events, properties, methods })=>{
+    const additionalProps = {};
+    if (properties.decimalSeparator) {
+        additionalProps.decimalSeparator = properties.decimalSeparator;
+    }
+    return /*#__PURE__*/ React.createElement(Statistic, {
         className: methods.makeCssClass(properties.style),
-        decimalSeparator: properties.decimalSeparator,
         groupSeparator: properties.groupSeparator,
         id: blockId,
         loading: properties.loading,
@@ -33,13 +37,15 @@ const StatisticBlock = ({ blockId , components: { Icon  } , events , properties
             blockId: `${blockId}_prefixIcon`,
             events: events,
             properties: properties.prefixIcon
-        }) : properties.prefix || '',
+        }) : properties.prefix ?? '',
         suffix: properties.suffixIcon ? /*#__PURE__*/ React.createElement(Icon, {
             blockId: `${blockId}_suffixIcon`,
             events: events,
             properties: properties.suffixIcon
-        }) : properties.suffix || ''
+        }) : properties.suffix ?? '',
+        ...additionalProps
     });
+};
 StatisticBlock.defaultProps = blockDefaultProps;
 StatisticBlock.meta = {
     category: 'display',

package/dist/blocks/Statistic/style.less

@@ -1,5 +1,5 @@
 /*
-  Copyright 2020-2023 Lowdefy, Inc
+  Copyright 2020-2024 Lowdefy, Inc
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.

package/dist/blocks/Switch/Switch.js

@@ -1,5 +1,5 @@
 /*
-  Copyright 2020-2023 Lowdefy, Inc
+  Copyright 2020-2024 Lowdefy, Inc
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
@@ -17,7 +17,7 @@ import { Switch } from 'antd';
 import { blockDefaultProps } from '@lowdefy/block-utils';
 import { type, serializer } from '@lowdefy/helpers';
 import Label from '../Label/Label.js';
-const SwitchBlock = ({ blockId , components: { Icon , Link  } , events , loading , methods , properties , required , validation , value  })=>{
+const SwitchBlock = ({ blockId, components: { Icon, Link }, events, loading, methods, properties, required, validation, value })=>{
     let propertiesIconChecked = serializer.copy(properties.checkedIcon);
     if (type.isString(propertiesIconChecked)) {
         propertiesIconChecked = {

package/dist/blocks/Switch/style.less

@@ -1,5 +1,5 @@
 /*
-  Copyright 2020-2023 Lowdefy, Inc
+  Copyright 2020-2024 Lowdefy, Inc
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.

package/dist/blocks/Tabs/Tabs.js

@@ -1,5 +1,5 @@
 /*
-  Copyright 2020-2023 Lowdefy, Inc
+  Copyright 2020-2024 Lowdefy, Inc
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
@@ -12,24 +12,10 @@
   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.
-*/ function _extends() {
-    _extends = Object.assign || function(target) {
-        for(var i = 1; i < arguments.length; i++){
-            var source = arguments[i];
-            for(var key in source){
-                if (Object.prototype.hasOwnProperty.call(source, key)) {
-                    target[key] = source[key];
-                }
-            }
-        }
-        return target;
-    };
-    return _extends.apply(this, arguments);
-}
-import React from 'react';
-import { blockDefaultProps } from '@lowdefy/block-utils';
+*/ import React, { useState, useEffect } from 'react';
+import { blockDefaultProps, renderHtml } from '@lowdefy/block-utils';
 import { Tabs } from 'antd';
-const getTabs = ({ content , properties  })=>{
+const getTabs = ({ content, properties })=>{
     let tabs = properties.tabs;
     if (!tabs) {
         tabs = Object.keys(content).sort().map((key)=>({
@@ -40,62 +26,78 @@ const getTabs = ({ content , properties  })=>{
     // remove extraAreaKey key area from tabs
     return tabs.filter((tab)=>tab.key !== properties.extraAreaKey);
 };
-const getAdditionalProps = ({ content , properties  })=>{
-    const additionalProps = {};
-    if (properties.activeKey) {
-        additionalProps.activeKey = properties.activeKey;
-    }
-    if (properties.extraAreaKey) {
-        additionalProps.tabBarExtraContent = content[properties.extraAreaKey] && content[properties.extraAreaKey]();
-    }
-    return additionalProps;
-};
-const TabsBlock = ({ blockId , components: { Icon  } , events , content , methods , properties  })=>{
+const TabsBlock = ({ blockId, components: { Icon }, events, content, methods, properties })=>{
     const tabs = getTabs({
         content,
         properties
     });
-    const additionalProps = getAdditionalProps({
-        content,
-        properties
+    const additionalProps = {};
+    if (properties.extraAreaKey) {
+        additionalProps.tabBarExtraContent = content[properties.extraAreaKey] && content[properties.extraAreaKey]();
+    }
+    const [key, setKey] = useState(properties.defaultActiveKey ?? tabs[0].key);
+    useEffect(()=>{
+        methods.registerMethod('setActiveKey', ({ activeKey })=>{
+            if (activeKey !== key) {
+                setKey(activeKey);
+                methods.triggerEvent({
+                    name: 'onChange',
+                    event: {
+                        activeKey
+                    }
+                });
+            }
+        });
     });
-    return /*#__PURE__*/ React.createElement(Tabs, _extends({
+    return /*#__PURE__*/ React.createElement(Tabs, {
+        activeKey: key,
         animated: properties.animated !== undefined ? properties.animated : true,
-        defaultActiveKey: properties.defaultActiveKey || tabs[0].key,
         id: blockId,
-        onChange: (activeKey)=>methods.triggerEvent({
+        onChange: (activeKey)=>{
+            setKey(activeKey);
+            methods.triggerEvent({
                 name: 'onChange',
                 event: {
                     activeKey
                 }
-            }),
-        size: properties.size || 'default',
+            });
+        },
+        size: properties.size ?? 'default',
         tabBarStyle: methods.makeCssClass(properties.tabBarStyle, true),
-        tabPosition: properties.tabPosition || 'top',
-        type: properties.tabType || 'line',
-        onTabScroll: ({ direction  })=>methods.triggerEvent({
+        tabPosition: properties.tabPosition ?? 'top',
+        type: properties.tabType ?? 'line',
+        onTabScroll: ({ direction })=>methods.triggerEvent({
                 name: 'onTabScroll',
                 event: {
                     direction
                 }
             }),
-        onTabClick: (key)=>methods.triggerEvent({
+        onTabClick: (key)=>{
+            methods.triggerEvent({
                 name: 'onTabClick',
                 event: {
                     key
                 }
-            })
-    }, additionalProps), tabs.map((tab)=>/*#__PURE__*/ React.createElement(Tabs.TabPane, {
-            disabled: tab.disabled,
-            key: tab.key,
-            tab: /*#__PURE__*/ React.createElement("span", {
-                className: methods.makeCssClass(tab.titleStyle)
-            }, tab.icon && /*#__PURE__*/ React.createElement(Icon, {
-                blockId: `${blockId}_icon`,
-                events: events,
-                properties: tab.icon
-            }), tab.title || tab.key)
-        }, content[tab.key] && content[tab.key]())));
+            });
+        },
+        items: tabs.map((tab)=>({
+                id: `${blockId}_${tab.key}`,
+                key: tab.key,
+                disabled: tab.disabled,
+                label: /*#__PURE__*/ React.createElement("span", {
+                    className: methods.makeCssClass(tab.titleStyle)
+                }, tab.icon && /*#__PURE__*/ React.createElement(Icon, {
+                    blockId: `${blockId}_icon`,
+                    events: events,
+                    properties: tab.icon
+                }), tab.title ? renderHtml({
+                    html: tab.title,
+                    methods
+                }) : tab.key),
+                children: content[tab.key] && content[tab.key]()
+            })),
+        ...additionalProps
+    });
 };
 TabsBlock.defaultProps = blockDefaultProps;
 TabsBlock.meta = {

package/dist/blocks/Tabs/schema.json

@@ -4,10 +4,6 @@
     "type": "object",
     "additionalProperties": false,
     "properties": {
-      "activeKey": {
-        "type": "string",
-        "description": "Current TabPane's key."
-      },
       "animated": {
         "type": "boolean",
         "default": true,
@@ -43,7 +39,7 @@
           "properties": {
             "title": {
               "type": "string",
-              "description": "Title of the tab."
+              "description": "Title of the tab - supports html."
             },
             "key": {
               "type": "string",

package/dist/blocks/Tabs/style.less

@@ -1,5 +1,5 @@
 /*
-  Copyright 2020-2023 Lowdefy, Inc
+  Copyright 2020-2024 Lowdefy, Inc
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.

package/dist/blocks/Tag/Tag.js

@@ -0,0 +1,57 @@
+/*
+  Copyright 2020-2024 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 { Tag } from 'antd';
+import { blockDefaultProps, renderHtml } from '@lowdefy/block-utils';
+import { type } from '@lowdefy/helpers';
+const TagBlock = ({ blockId, components: { Icon }, events, methods, onClick, onClose, properties })=>{
+    const additionalProps = {};
+    if (properties.icon) {
+        additionalProps.icon = /*#__PURE__*/ React.createElement(Icon, {
+            blockId: `${blockId}_icon`,
+            events: events,
+            properties: properties.icon
+        });
+    }
+    if (onClick || events.onClick) {
+        additionalProps.onClick = onClick || (()=>methods.triggerEvent({
+                name: 'onClick'
+            }));
+    }
+    if (onClose || events.onClose) {
+        additionalProps.onClose = onClose || (()=>methods.triggerEvent({
+                name: 'onClose'
+            }));
+    }
+    return /*#__PURE__*/ React.createElement(Tag, {
+        id: blockId,
+        closable: properties.closable,
+        color: properties.color,
+        className: methods.makeCssClass(properties.style),
+        ...additionalProps
+    }, type.isString(properties.title) ? renderHtml({
+        html: properties.title,
+        methods
+    }) : properties.title ?? blockId);
+};
+TagBlock.defaultProps = blockDefaultProps;
+TagBlock.meta = {
+    category: 'display',
+    icons: [],
+    styles: [
+        'blocks/Tag/style.less'
+    ]
+};
+export default TagBlock;

package/dist/blocks/Tag/schema.json

@@ -0,0 +1,45 @@
+{
+  "properties": {
+    "type": "object",
+    "additionalProperties": false,
+    "properties": {
+      "closable": {
+        "type": "boolean",
+        "default": false,
+        "description": "Allow tag to be closed."
+      },
+      "color": {
+        "type": "string",
+        "description": "Color of the Tag. Preset options are success, processing, error, warning, default, blue, cyan, geekblue, gold, green, lime, magenta, orange, purple, red, volcano, or alternatively any hex color.",
+        "docs": {
+          "displayType": "color"
+        }
+      },
+      "title": {
+        "type": "string",
+        "description": "Content title of tag - supports html."
+      },
+      "icon": {
+        "type": ["string", "object"],
+        "description": "Name of an Ant Design Icon or properties of an Icon block to customize alert icon.",
+        "docs": {
+          "displayType": "icon"
+        }
+      }
+    }
+  },
+  "events": {
+    "type": "object",
+    "additionalProperties": false,
+    "properties": {
+      "onClick": {
+        "type": "array",
+        "description": "Called when Tag is clicked."
+      },
+      "onClose": {
+        "type": "array",
+        "description": "Called when Tag close icon is clicked."
+      }
+    }
+  }
+}

package/dist/blocks/Tag/style.less

@@ -0,0 +1,17 @@
+/*
+  Copyright 2020-2024 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 'antd/lib/tag/style/index.less';

package/dist/blocks/TextArea/TextArea.js

@@ -1,5 +1,5 @@
 /*
-  Copyright 2020-2023 Lowdefy, Inc
+  Copyright 2020-2024 Lowdefy, Inc
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
@@ -19,7 +19,7 @@ import { Input } from 'antd';
 import Label from '../Label/Label.js';
 import useRunAfterUpdate from '../../useRunAfterUpdate.js';
 const TextAreaComp = Input.TextArea;
-const TextAreaBlock = ({ blockId , components , events , loading , properties , required , validation , value , methods  })=>{
+const TextAreaBlock = ({ blockId, components, events, loading, properties, required, validation, value, methods })=>{
     return /*#__PURE__*/ React.createElement(Label, {
         blockId: blockId,
         components: components,
@@ -63,6 +63,16 @@ const TextAreaBlock = ({ blockId , components , events , loading , properties ,
                             event.target.setSelectionRange(cStart, cEnd);
                         });
                     },
+                    onFocus: ()=>{
+                        methods.triggerEvent({
+                            name: 'onFocus'
+                        });
+                    },
+                    onBlur: ()=>{
+                        methods.triggerEvent({
+                            name: 'onBlur'
+                        });
+                    },
                     onPressEnter: ()=>{
                         methods.triggerEvent({
                             name: 'onPressEnter'

package/dist/blocks/TextArea/schema.json

@@ -151,10 +151,18 @@
     "type": "object",
     "additionalProperties": false,
     "properties": {
+      "onBlur": {
+        "type": "array",
+        "description": "Trigger action event occurs when text input loses focus."
+      },
       "onChange": {
         "type": "array",
         "description": "Trigger action when text input is changed."
       },
+      "onFocus": {
+        "type": "array",
+        "description": "Trigger action when text input gets focus."
+      },
       "onPressEnter": {
         "type": "array",
         "description": "Trigger action when enter is pressed while text input is focused."

package/dist/blocks/TextArea/style.less

@@ -1,5 +1,5 @@
 /*
-  Copyright 2020-2023 Lowdefy, Inc
+  Copyright 2020-2024 Lowdefy, Inc
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.

package/dist/blocks/TextInput/TextInput.js

@@ -1,5 +1,5 @@
 /*
-  Copyright 2020-2023 Lowdefy, Inc
+  Copyright 2020-2024 Lowdefy, Inc
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
@@ -17,7 +17,7 @@ import { Input } from 'antd';
 import { blockDefaultProps } from '@lowdefy/block-utils';
 import Label from '../Label/Label.js';
 import useRunAfterUpdate from '../../useRunAfterUpdate.js';
-const TextInput = ({ blockId , components: { Icon , Link  } , events , loading , methods , properties , required , validation , value  })=>{
+const TextInput = ({ blockId, components: { Icon, Link }, events, loading, methods, properties, required, validation, value })=>{
     return /*#__PURE__*/ React.createElement(Label, {
         blockId: blockId,
         components: {
@@ -48,7 +48,7 @@ const TextInput = ({ blockId , components: { Icon , Link  } , events , loading ,
                     status: validation.status,
                     value: value,
                     onChange: (event)=>{
-                        var input = event.target.value;
+                        let input = event.target.value;
                         if (properties.replaceInput) {
                             const regex = new RegExp(properties.replaceInput.pattern, properties.replaceInput.flags ?? 'gm');
                             input = input.replace(regex, properties.replaceInput.replacement ?? '');
@@ -68,6 +68,16 @@ const TextInput = ({ blockId , components: { Icon , Link  } , events , loading ,
                             name: 'onPressEnter'
                         });
                     },
+                    onBlur: ()=>{
+                        methods.triggerEvent({
+                            name: 'onBlur'
+                        });
+                    },
+                    onFocus: ()=>{
+                        methods.triggerEvent({
+                            name: 'onFocus'
+                        });
+                    },
                     prefix: properties.prefix || properties.prefixIcon && /*#__PURE__*/ React.createElement(Icon, {
                         blockId: `${blockId}_prefixIcon`,
                         events: events,

package/dist/blocks/TextInput/schema.json

@@ -157,10 +157,18 @@
     "type": "object",
     "additionalProperties": false,
     "properties": {
+      "onBlur": {
+        "type": "array",
+        "description": "Trigger action event occurs when text input loses focus."
+      },
       "onChange": {
         "type": "array",
         "description": "Trigger action when text input is changed."
       },
+      "onFocus": {
+        "type": "array",
+        "description": "Trigger action when text input gets focus."
+      },
       "onPressEnter": {
         "type": "array",
         "description": "Trigger action when enter is pressed while text input is focused."

package/dist/blocks/TextInput/style.less

@@ -1,5 +1,5 @@
 /*
-  Copyright 2020-2023 Lowdefy, Inc
+  Copyright 2020-2024 Lowdefy, Inc
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.