@lowdefy/client 4.0.0-alpha.9 → 4.0.0-rc.0

package/dist/Client.js

@@ -19,11 +19,12 @@ import DisplayMessage from './DisplayMessage.js';
 import Head from './Head.js';
 import ProgressBarController from './ProgressBarController.js';
 import initLowdefyContext from './initLowdefyContext.js';
-const Client = ({ Components , config , resetContext ={
+const Client = ({ auth , Components , config , resetContext ={
     reset: false,
     setReset: ()=>undefined
 } , router , stage , types , window ,  })=>{
     const lowdefy = initLowdefyContext({
+        auth,
         Components,
         config,
         router,
@@ -31,7 +32,7 @@ const Client = ({ Components , config , resetContext ={
         types,
         window
     });
-    return(/*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(ProgressBarController, {
+    return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(ProgressBarController, {
         id: "lowdefy-progress-bar",
         key: `${config.pageConfig.id}-progress-bar`,
         lowdefy: lowdefy,
@@ -52,16 +53,16 @@ const Client = ({ Components , config , resetContext ={
         resetContext: resetContext
     }, (context)=>{
         if (!context._internal.onInitDone) return '';
-        return(/*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(Head, {
+        return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(Head, {
             Component: Components.Head,
-            properties: context._internal.RootBlocks.map[config.pageConfig.id].eval.properties
+            properties: context._internal.RootBlocks.map[config.pageConfig.blockId].eval.properties
         }), /*#__PURE__*/ React.createElement(Block, {
-            block: context._internal.RootBlocks.map[config.pageConfig.id],
+            block: context._internal.RootBlocks.map[config.pageConfig.blockId],
             Blocks: context._internal.RootBlocks,
             context: context,
             lowdefy: lowdefy,
             parentLoading: false
-        })));
-    })));
+        }));
+    }));
 };
 export default Client;

package/dist/Context.js

@@ -21,7 +21,7 @@ const Context = ({ children , config , lowdefy , resetContext  })=>{
         lowdefy,
         resetContext
     });
-    return(/*#__PURE__*/ React.createElement(MountEvents, {
+    return /*#__PURE__*/ React.createElement(MountEvents, {
         context: context,
         triggerEvent: async ()=>{
             await context._internal.runOnInit(()=>{
@@ -40,6 +40,6 @@ const Context = ({ children , config , lowdefy , resetContext  })=>{
     }, (loadingOnInit)=>{
         if (loadingOnInit) return '';
         return children(context);
-    }));
+    });
 };
 export default Context;

package/dist/DisplayMessage.js

@@ -15,7 +15,7 @@
 */ import React from 'react';
 import { makeCssClass } from '@lowdefy/block-utils';
 const DisplayMessage = ({ Component , id , methods  })=>{
-    return(/*#__PURE__*/ React.createElement(Component, {
+    return /*#__PURE__*/ React.createElement(Component, {
         blockId: id,
         key: id,
         methods: {
@@ -24,6 +24,6 @@ const DisplayMessage = ({ Component , id , methods  })=>{
             triggerEvent: ()=>undefined
         },
         properties: {}
-    }));
+    });
 };
 export default DisplayMessage;

package/dist/ErrorBoundary.js

@@ -29,12 +29,12 @@ let ErrorBoundary = class ErrorBoundary extends Component {
                 return fallback(error);
             }
             if (fullPage) {
-                return(/*#__PURE__*/ React.createElement(ErrorPage, {
+                return /*#__PURE__*/ React.createElement(ErrorPage, {
                     code: error.number,
                     description: description || error.description,
                     message: message || error.message,
                     name: name || error.name
-                }));
+                });
             }
             // Throw to console but fail silently to user?
             return '';

package/dist/ErrorPage.js

@@ -56,6 +56,5 @@ const ErrorPage = ({ code , description , message , name  })=>/*#__PURE__*/ Reac
         }
     }, /*#__PURE__*/ React.createElement("a", {
         href: "/"
-    }, "Return to home page"))))
-;
+    }, "Return to home page"))));
 export default ErrorPage;

package/dist/Head.js

@@ -14,6 +14,6 @@
   limitations under the License.
 */ import React from 'react';
 const BindHead = ({ Component , properties  })=>{
-    return(/*#__PURE__*/ React.createElement(Component, null, /*#__PURE__*/ React.createElement("title", null, properties.title)));
+    return /*#__PURE__*/ React.createElement(Component, null, /*#__PURE__*/ React.createElement("title", null, properties.title));
 };
 export default BindHead;

package/dist/MountEvents.js

@@ -17,27 +17,21 @@ const MountEvents = ({ children , context , triggerEvent , triggerEventAsync  })
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState(null);
     useEffect(()=>{
-        let mounted = true;
         setLoading(true);
         const mount = async ()=>{
             try {
                 await triggerEvent();
-                if (mounted) {
-                    triggerEventAsync();
-                    setLoading(false);
-                }
+                triggerEventAsync();
+                setLoading(false);
             } catch (err) {
                 setError(err);
             }
         };
-        mount(); // TODO: check only run once.
-        return ()=>{
-            mounted = false;
-        };
+        mount();
     }, [
         context
     ]);
     if (error) throw error;
-    return(/*#__PURE__*/ React.createElement(React.Fragment, null, children(loading)));
+    return /*#__PURE__*/ React.createElement(React.Fragment, null, children(loading));
 };
 export default MountEvents;

package/dist/ProgressBarController.js

@@ -57,10 +57,8 @@ const ProgressBarController = ({ id , lowdefy , resetContext  })=>{
     useEffect(()=>{
         const timer = state.progress < 95 && setInterval(()=>dispatch({
                 type: 'auto-increment'
-            })
-        , 500);
-        return ()=>clearInterval(timer)
-        ;
+            }), 500);
+        return ()=>clearInterval(timer);
     }, [
         state
     ]);
@@ -69,7 +67,7 @@ const ProgressBarController = ({ id , lowdefy , resetContext  })=>{
             type: 'reset'
         });
     }
-    return(/*#__PURE__*/ React.createElement(ProgressBar, {
+    return /*#__PURE__*/ React.createElement(ProgressBar, {
         basePath: lowdefy.basePath,
         blockId: id,
         components: lowdefy._internal.components,
@@ -78,8 +76,7 @@ const ProgressBarController = ({ id , lowdefy , resetContext  })=>{
             makeCssClass
         },
         pageId: lowdefy.pageId,
-        properties: state,
-        user: lowdefy.user
-    }));
+        properties: state
+    });
 };
 export default ProgressBarController;

package/dist/auth/createAuthMethods.js

@@ -0,0 +1,66 @@
+/*
+  Copyright 2020-2022 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 { type, urlQuery as urlQueryFn } from '@lowdefy/helpers';
+function getCallbackUrl({ lowdefy , callbackUrl ={}  }) {
+    const { home , pageId , urlQuery , url  } = callbackUrl;
+    if ([
+        !home,
+        !pageId,
+        !url
+    ].filter((v)=>!v).length > 1) {
+        throw Error(`Invalid Link: To avoid ambiguity, only one of 'home', 'pageId' or 'url' can be defined.`);
+    }
+    const query = type.isNone(urlQuery) ? '' : `${urlQueryFn.stringify(urlQuery)}`;
+    if (home === true) {
+        return `/${lowdefy.home.configured ? '' : lowdefy.home.pageId}${query ? `?${query}` : ''}`;
+    }
+    if (type.isString(pageId)) {
+        return `/${pageId}${query ? `?${query}` : ''}`;
+    }
+    if (type.isString(url)) {
+        return `${url}${query ? `?${query}` : ''}`;
+    }
+    return undefined;
+}
+function createAuthMethods({ lowdefy , auth  }) {
+    // login and logout are Lowdefy function that handle action params
+    // signIn and signOut are the next-auth methods
+    function login({ authUrl , callbackUrl , providerId , ...rest } = {}) {
+        if (type.isNone(providerId) && auth.authConfig.providers.length === 1) {
+            providerId = auth.authConfig.providers[0].id;
+        }
+        auth.signIn(providerId, {
+            ...rest,
+            callbackUrl: getCallbackUrl({
+                lowdefy,
+                callbackUrl
+            })
+        }, authUrl?.urlQuery);
+    }
+    function logout({ callbackUrl , redirect  } = {}) {
+        auth.signOut({
+            callbackUrl: getCallbackUrl({
+                lowdefy,
+                callbackUrl
+            }),
+            redirect
+        });
+    }
+    return {
+        login,
+        logout
+    };
+}
+export default createAuthMethods;

package/dist/block/Block.js

@@ -18,9 +18,8 @@ import ErrorBoundary from '../ErrorBoundary.js';
 import MountEvents from '../MountEvents.js';
 const Block = ({ block , Blocks , context , lowdefy , parentLoading  })=>{
     const [updates, setUpdate] = useState(0);
-    lowdefy._internal.updaters[block.id] = ()=>setUpdate(updates + 1)
-    ;
-    return(/*#__PURE__*/ React.createElement(ErrorBoundary, null, /*#__PURE__*/ React.createElement(MountEvents, {
+    lowdefy._internal.updaters[block.id] = ()=>setUpdate(updates + 1);
+    return /*#__PURE__*/ React.createElement(ErrorBoundary, null, /*#__PURE__*/ React.createElement(MountEvents, {
         context: context,
         triggerEvent: async ()=>{
             context._internal.lowdefy._internal.progress.dispatch({
@@ -56,7 +55,6 @@ const Block = ({ block , Blocks , context , lowdefy , parentLoading  })=>{
             loading: eventLoading || parentLoading || block.eval.loading,
             lowdefy: lowdefy,
             updates: updates
-        })
-    )));
+        })));
 };
 export default Block;

package/dist/block/CategorySwitch.js

@@ -21,46 +21,48 @@ import List from './List.js';
 import LoadingBlock from './LoadingBlock.js';
 const CategorySwitch = ({ block , Blocks , context , loading , lowdefy  })=>{
     if (!block.eval) return null; // TODO: check Renderer updates before eval is executed for the first time on lists. See #520
-    if (block.eval.visible === false) return(/*#__PURE__*/ React.createElement("div", {
+    if (block.eval.visible === false) return /*#__PURE__*/ React.createElement("div", {
         id: `vs-${block.blockId}`,
         style: {
             display: 'none'
         }
-    }));
+    });
     const Component = lowdefy._internal.blockComponents[block.type];
     if (loading && type.isObject(block.eval.skeleton)) {
-        return(/*#__PURE__*/ React.createElement(LoadingBlock, {
+        return /*#__PURE__*/ React.createElement(LoadingBlock, {
             blockLayout: block.eval.layout,
+            blockProperties: block.eval.properties,
+            blockStyle: block.eval.style,
             context: context,
             lowdefy: lowdefy,
             skeleton: block.eval.skeleton
-        }));
+        });
     }
     switch(Component.meta.category){
         case 'list':
-            return(/*#__PURE__*/ React.createElement(List, {
+            return /*#__PURE__*/ React.createElement(List, {
                 block: block,
                 Blocks: Blocks,
                 Component: Component,
                 context: context,
                 loading: loading,
                 lowdefy: lowdefy
-            }));
+            });
         case 'container':
-            return(/*#__PURE__*/ React.createElement(Container, {
+            return /*#__PURE__*/ React.createElement(Container, {
                 block: block,
                 Blocks: Blocks,
                 Component: Component,
                 context: context,
                 loading: loading,
                 lowdefy: lowdefy
-            }));
+            });
         case 'input':
-            return(/*#__PURE__*/ React.createElement(BlockLayout, {
+            return /*#__PURE__*/ React.createElement(BlockLayout, {
                 id: `bl-${block.blockId}`,
                 blockStyle: block.eval.style,
                 highlightBorders: lowdefy.lowdefyGlobal.highlightBorders,
-                layout: block.eval.layout || {},
+                layout: block.eval.layout,
                 makeCssClass: makeCssClass
             }, /*#__PURE__*/ React.createElement(Component, {
                 methods: Object.assign(block.methods, {
@@ -80,16 +82,15 @@ const CategorySwitch = ({ block , Blocks , context , loading , lowdefy  })=>{
                 pageId: lowdefy.pageId,
                 properties: block.eval.properties,
                 required: block.eval.required,
-                user: lowdefy.user,
                 validation: block.eval.validation,
                 value: block.value
-            })));
+            }));
         default:
-            return(/*#__PURE__*/ React.createElement(BlockLayout, {
+            return /*#__PURE__*/ React.createElement(BlockLayout, {
                 id: `bl-${block.blockId}`,
                 blockStyle: block.eval.style,
                 highlightBorders: lowdefy.lowdefyGlobal.highlightBorders,
-                layout: block.eval.layout || {},
+                layout: block.eval.layout,
                 makeCssClass: makeCssClass
             }, /*#__PURE__*/ React.createElement(Component, {
                 methods: Object.assign(block.methods, {
@@ -108,9 +109,8 @@ const CategorySwitch = ({ block , Blocks , context , loading , lowdefy  })=>{
                 pageId: lowdefy.pageId,
                 properties: block.eval.properties,
                 required: block.eval.required,
-                user: lowdefy.user,
                 validation: block.eval.validation
-            })));
+            }));
     }
 };
 export default CategorySwitch;

package/dist/block/Container.js

@@ -25,13 +25,13 @@ const Container = ({ block , Blocks , Component , context , loading , lowdefy  }
                 id: `ar-${block.blockId}-${areaKey}`,
                 key: `ar-${block.blockId}-${areaKey}-${i}`,
                 area: layoutParamsToArea({
-                    area: block.eval.areas[areaKey] || {},
+                    area: block.eval.areas[areaKey],
                     areaKey,
-                    layout: block.eval.layout || {}
+                    layout: block.eval.layout
                 }),
                 areaStyle: [
                     areaStyle,
-                    block.eval.areas[areaKey] && block.eval.areas[areaKey].style
+                    block.eval.areas[areaKey]?.style
                 ],
                 highlightBorders: lowdefy.lowdefyGlobal.highlightBorders,
                 makeCssClass: makeCssClass
@@ -42,15 +42,13 @@ const Container = ({ block , Blocks , Component , context , loading , lowdefy  }
                     context: context,
                     parentLoading: loading,
                     lowdefy: lowdefy
-                })
-            ))
-        ;
+                })));
     });
-    return(/*#__PURE__*/ React.createElement(BlockLayout, {
+    return /*#__PURE__*/ React.createElement(BlockLayout, {
         id: `bl-${block.blockId}`,
         blockStyle: block.eval.style,
         highlightBorders: lowdefy.lowdefyGlobal.highlightBorders,
-        layout: block.eval.layout || {},
+        layout: block.eval.layout,
         makeCssClass: makeCssClass
     }, /*#__PURE__*/ React.createElement(Component, {
         methods: Object.assign(block.methods, {
@@ -70,8 +68,7 @@ const Container = ({ block , Blocks , Component , context , loading , lowdefy  }
         pageId: lowdefy.pageId,
         properties: block.eval.properties,
         required: block.eval.required,
-        user: lowdefy.user,
         validation: block.eval.validation
-    })));
+    }));
 };
 export default Container;

package/dist/block/List.js

@@ -25,13 +25,13 @@ const List = ({ block , Blocks , Component , context , loading , lowdefy  })=>{
                     id: `ar-${block.blockId}-${SBlock.id}-${areaKey}`,
                     key: `ar-${block.blockId}-${SBlock.id}-${areaKey}`,
                     area: layoutParamsToArea({
-                        area: block.eval.areas[areaKey] || {},
+                        area: block.eval.areas[areaKey],
                         areaKey,
-                        layout: block.eval.layout || {}
+                        layout: block.eval.layout
                     }),
                     areaStyle: [
                         areaStyle,
-                        block.eval.areas[areaKey] && block.eval.areas[areaKey].style
+                        block.eval.areas[areaKey]?.style
                     ],
                     highlightBorders: lowdefy.lowdefyGlobal.highlightBorders,
                     makeCssClass: makeCssClass
@@ -42,19 +42,17 @@ const List = ({ block , Blocks , Component , context , loading , lowdefy  })=>{
                         context: context,
                         parentLoading: loading,
                         lowdefy: lowdefy
-                    })
-                ))
-            ;
+                    })));
         });
         contentList.push({
             ...content
         });
     });
-    return(/*#__PURE__*/ React.createElement(BlockLayout, {
+    return /*#__PURE__*/ React.createElement(BlockLayout, {
         id: `bl-${block.blockId}`,
         blockStyle: block.eval.style,
         highlightBorders: lowdefy.lowdefyGlobal.highlightBorders,
-        layout: block.eval.layout || {},
+        layout: block.eval.layout,
         makeCssClass: makeCssClass
     }, /*#__PURE__*/ React.createElement(Component, {
         methods: Object.assign(block.methods, {
@@ -79,8 +77,7 @@ const List = ({ block , Blocks , Component , context , loading , lowdefy  })=>{
         pageId: lowdefy.pageId,
         properties: block.eval.properties,
         required: block.eval.required,
-        user: lowdefy.user,
         validation: block.eval.validation
-    })));
+    }));
 };
 export default List;

package/dist/block/LoadingBlock.js

@@ -29,7 +29,7 @@ const blockMethods = {
     triggerEvent: ()=>{},
     unshiftItem: ()=>{}
 };
-const LoadingBlock = ({ blockLayout , blockId , context , lowdefy , skeleton  })=>{
+const LoadingBlock = ({ blockId , blockLayout , blockProperties , blockStyle , context , lowdefy , skeleton ,  })=>{
     let Component = lowdefy._internal.blockComponents[skeleton.type];
     useEffect(()=>{
         if (!lowdefy._internal.blockComponents[skeleton.type]) {
@@ -41,32 +41,32 @@ const LoadingBlock = ({ blockLayout , blockId , context , lowdefy , skeleton  })
         // default to box when a skeleton block is not found - should be a basic or loader block.
         Component = lowdefy._internal.blockComponents.Box;
     }
-    const layout = skeleton.layout || blockLayout || {};
     switch(Component.meta.category){
         case 'list':
-            return(/*#__PURE__*/ React.createElement(LoadingList, {
+            return /*#__PURE__*/ React.createElement(LoadingList, {
                 blockId: blockId,
                 Component: Component,
                 context: context,
-                layout: layout,
                 lowdefy: lowdefy,
                 skeleton: skeleton
-            }));
+            });
         case 'container':
-            return(/*#__PURE__*/ React.createElement(LoadingContainer, {
+            return /*#__PURE__*/ React.createElement(LoadingContainer, {
                 blockId: blockId,
+                blockLayout: blockLayout,
+                blockProperties: blockProperties,
+                blockStyle: blockStyle,
                 Component: Component,
                 context: context,
-                layout: layout,
                 lowdefy: lowdefy,
                 skeleton: skeleton
-            }));
+            });
         default:
-            return(/*#__PURE__*/ React.createElement(BlockLayout, {
-                blockStyle: skeleton.style,
+            return /*#__PURE__*/ React.createElement(BlockLayout, {
+                blockStyle: skeleton.style ?? blockStyle,
                 highlightBorders: lowdefy.lowdefyGlobal.highlightBorders,
                 id: `s-bl-${blockId}-${skeleton.id}`,
-                layout: layout,
+                layout: skeleton.layout ?? blockLayout,
                 makeCssClass: makeCssClass
             }, /*#__PURE__*/ React.createElement(Component, {
                 basePath: lowdefy.basePath,
@@ -76,9 +76,8 @@ const LoadingBlock = ({ blockLayout , blockId , context , lowdefy , skeleton  })
                 menus: lowdefy.menus,
                 methods: blockMethods,
                 pageId: lowdefy.pageId,
-                properties: skeleton.properties,
-                user: lowdefy.user
-            })));
+                properties: skeleton.properties ?? blockProperties
+            }));
     }
 };
 export default LoadingBlock;

package/dist/block/LoadingContainer.js

@@ -16,15 +16,15 @@
 import { Area, BlockLayout, layoutParamsToArea } from '@lowdefy/layout';
 import { makeCssClass } from '@lowdefy/block-utils';
 import LoadingBlock from './LoadingBlock.js';
-const LoadingContainer = ({ blockId , Component , context , layout , lowdefy , skeleton  })=>{
+const LoadingContainer = ({ blockId , blockLayout , blockProperties , blockStyle , Component , context , lowdefy , skeleton ,  })=>{
     const content = {};
     // eslint-disable-next-line prefer-destructuring
     Object.keys(skeleton.areas).forEach((areaKey, i)=>{
         content[areaKey] = (areaStyle)=>/*#__PURE__*/ React.createElement(Area, {
                 area: layoutParamsToArea({
-                    area: skeleton.areas[areaKey] || {},
+                    area: skeleton.areas[areaKey],
                     areaKey,
-                    layout
+                    layout: skeleton.layout ?? blockLayout
                 }),
                 areaStyle: [
                     areaStyle,
@@ -40,15 +40,13 @@ const LoadingContainer = ({ blockId , Component , context , layout , lowdefy , s
                     key: `s-co-${skl.id}-${k}`,
                     lowdefy: lowdefy,
                     skeleton: skl
-                })
-            ))
-        ;
+                })));
     });
-    return(/*#__PURE__*/ React.createElement(BlockLayout, {
-        blockStyle: skeleton.style,
+    return /*#__PURE__*/ React.createElement(BlockLayout, {
+        blockStyle: skeleton.style ?? blockStyle,
         highlightBorders: lowdefy.lowdefyGlobal.highlightBorders,
         id: `s-bl-${blockId}-${skeleton.id}`,
-        layout: layout,
+        layout: skeleton.layout ?? blockLayout,
         makeCssClass: makeCssClass
     }, /*#__PURE__*/ React.createElement(Component, {
         basePath: lowdefy.basePath,
@@ -61,8 +59,7 @@ const LoadingContainer = ({ blockId , Component , context , layout , lowdefy , s
             makeCssClass
         },
         pageId: lowdefy.pageId,
-        properties: skeleton.properties,
-        user: lowdefy.user
-    })));
+        properties: skeleton.properties ?? blockProperties
+    }));
 };
 export default LoadingContainer;

package/dist/block/LoadingList.js

@@ -16,20 +16,20 @@
 import { Area, BlockLayout, layoutParamsToArea } from '@lowdefy/layout';
 import { makeCssClass } from '@lowdefy/block-utils';
 import LoadingBlock from './LoadingBlock.js';
-const LoadingList = ({ blockId , Component , context , layout , lowdefy , skeleton  })=>{
+const LoadingList = ({ blockId , blockLayout , blockProperties , blockStyle , Component , context , lowdefy , skeleton ,  })=>{
     const content = {};
     const contentList = [];
     new Array(3).forEach(()=>{
         Object.keys(skeleton.areas).forEach((areaKey, i)=>{
             content[areaKey] = (areaStyle)=>/*#__PURE__*/ React.createElement(Area, {
                     area: layoutParamsToArea({
-                        area: skeleton.areas[areaKey] || {},
+                        area: skeleton.areas[areaKey],
                         areaKey,
-                        layout
+                        layout: skeleton.layout ?? blockLayout
                     }),
                     areaStyle: [
                         areaStyle,
-                        skeleton.areas[areaKey] && skeleton.areas[areaKey].style
+                        skeleton.areas[areaKey]?.style
                     ],
                     highlightBorders: lowdefy.lowdefyGlobal.highlightBorders,
                     id: `s-ar-${blockId}-${skeleton.id}-${areaKey}`,
@@ -41,19 +41,17 @@ const LoadingList = ({ blockId , Component , context , layout , lowdefy , skelet
                         key: `s-co-${skl.id}-${k}`,
                         lowdefy: lowdefy,
                         skeleton: skl
-                    })
-                ))
-            ;
+                    })));
         });
         contentList.push({
             ...content
         });
     });
-    return(/*#__PURE__*/ React.createElement(BlockLayout, {
-        blockStyle: skeleton.style,
+    return /*#__PURE__*/ React.createElement(BlockLayout, {
+        blockStyle: skeleton.style ?? blockStyle,
         highlightBorders: lowdefy.lowdefyGlobal.highlightBorders,
         id: `s-bl-${blockId}-${skeleton.id}`,
-        layout: layout,
+        layout: skeleton.layout ?? blockLayout,
         makeCssClass: makeCssClass
     }, /*#__PURE__*/ React.createElement(Component, {
         basePath: lowdefy.basePath,
@@ -65,8 +63,7 @@ const LoadingList = ({ blockId , Component , context , layout , lowdefy , skelet
             makeCssClass
         },
         pageId: lowdefy.pageId,
-        properties: skeleton.properties,
-        user: lowdefy.user
-    })));
+        properties: skeleton.properties ?? blockProperties
+    }));
 };
 export default LoadingList;

package/dist/createIcon.js

@@ -1,3 +1,17 @@
+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);
+}
 /*
   Copyright 2020-2022 Lowdefy, Inc
 
@@ -18,20 +32,6 @@ import { omit, type } from '@lowdefy/helpers';
 import Icon from '@ant-design/icons';
 import { blockDefaultProps, makeCssClass } from '@lowdefy/block-utils';
 import ErrorBoundary from './ErrorBoundary.js';
-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);
-}
 const lowdefyProps = [
     'actionLog',
     'basePath',
@@ -45,7 +45,6 @@ const lowdefyProps = [
     'registerEvent',
     'registerMethod',
     'schemaErrors',
-    'user',
     'validation', 
 ];
 const createIcon = (Icons)=>{
@@ -78,7 +77,7 @@ const createIcon = (Icons)=>{
         if (!IconComp) {
             IconComp = AiOutlineExclamationCircle;
         }
-        return(/*#__PURE__*/ React.createElement(React.Fragment, null, spin ? /*#__PURE__*/ React.createElement(AiOutlineLoading3Quarters, _extends({}, iconProps)) : /*#__PURE__*/ React.createElement(ErrorBoundary, {
+        return /*#__PURE__*/ React.createElement(React.Fragment, null, spin ? /*#__PURE__*/ React.createElement(AiOutlineLoading3Quarters, _extends({}, iconProps)) : /*#__PURE__*/ React.createElement(ErrorBoundary, {
             fallback: ()=>/*#__PURE__*/ React.createElement(AiOutlineExclamationCircle, _extends({}, {
                     ...iconProps,
                     color: '#F00'
@@ -87,16 +86,14 @@ const createIcon = (Icons)=>{
             id: blockId,
             onClick: onClick || events.onClick && (()=>methods.triggerEvent({
                     name: 'onClick'
-                })
-            ),
+                })),
             size: propertiesObj.size,
             title: propertiesObj.title
-        }, iconProps)))));
+        }, iconProps))));
     };
     const AntIcon = (all)=>/*#__PURE__*/ React.createElement(Icon, {
             component: ()=>/*#__PURE__*/ React.createElement(IconBlock, _extends({}, all))
-        })
-    ;
+        });
     AntIcon.defaultProps = blockDefaultProps;
     return AntIcon;
 };

package/dist/createLinkComponent.js

@@ -2,24 +2,23 @@ import React from 'react';
 import { createLink } from '@lowdefy/engine';
 import { type } from '@lowdefy/helpers';
 const createLinkComponent = (lowdefy, Link)=>{
+    const { window  } = lowdefy._internal.globals;
     const backLink = ({ ariaLabel , children , className , id , rel  })=>/*#__PURE__*/ React.createElement("a", {
             id: id,
-            onClick: ()=>lowdefy._internal.router.back()
-            ,
+            onClick: ()=>lowdefy._internal.router.back(),
             className: className,
             rel: rel,
             "aria-label": ariaLabel || 'back'
-        }, type.isFunction(children) ? children(id) : children)
-    ;
+        }, type.isFunction(children) ? children(id) : children);
     const newOriginLink = ({ ariaLabel , children , className , id , newTab , pageId , query , rel , url ,  })=>{
-        return(/*#__PURE__*/ React.createElement("a", {
+        return /*#__PURE__*/ React.createElement("a", {
             id: id,
             "aria-label": ariaLabel,
             className: className,
             href: `${url}${query ? `?${query}` : ''}`,
             rel: rel || newTab && 'noopener noreferrer',
             target: newTab && '_blank'
-        }, type.isFunction(children) ? children(pageId || url || id) : children));
+        }, type.isFunction(children) ? children(pageId || url || id) : children);
     };
     const sameOriginLink = ({ ariaLabel , children , className , id , newTab , pageId , pathname , query , rel , replace , scroll , setInput , url ,  })=>{
         if (newTab) {
@@ -33,7 +32,7 @@ const createLinkComponent = (lowdefy, Link)=>{
                 target: "_blank"
             }, type.isFunction(children) ? children(pageId || url || id) : children));
         }
-        return(/*#__PURE__*/ React.createElement(Link, {
+        return /*#__PURE__*/ React.createElement(Link, {
             href: {
                 pathname,
                 query
@@ -46,13 +45,12 @@ const createLinkComponent = (lowdefy, Link)=>{
             className: className,
             rel: rel,
             onClick: setInput
-        }, type.isFunction(children) ? children(pageId || url || id) : children)));
+        }, type.isFunction(children) ? children(pageId || url || id) : children));
     };
     const noLink = ({ className , children , id  })=>/*#__PURE__*/ React.createElement("span", {
             id: id,
             className: className
-        }, type.isFunction(children) ? children(id) : children)
-    ;
+        }, type.isFunction(children) ? children(id) : children);
     return createLink({
         backLink,
         lowdefy,

package/dist/initLowdefyContext.js

@@ -12,9 +12,9 @@
   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 { urlQuery } from '@lowdefy/helpers';
-import callRequest from './callRequest.js';
+*/ import callRequest from './callRequest.js';
 import createIcon from './createIcon.js';
+import createAuthMethods from './auth/createAuthMethods.js';
 import createLinkComponent from './createLinkComponent.js';
 import setupLink from './setupLink.js';
 const lowdefy = {
@@ -24,11 +24,9 @@ const lowdefy = {
         updaters: {},
         displayMessage: ({ content  })=>{
             console.log(content);
-            return ()=>undefined
-            ;
+            return ()=>undefined;
         },
-        link: ()=>undefined
-        ,
+        link: ()=>undefined,
         progress: {
             state: {
                 progress: 0
@@ -40,7 +38,7 @@ const lowdefy = {
     inputs: {},
     lowdefyGlobal: {}
 };
-function initLowdefyContext({ Components , config , router , stage , types , window  }) {
+function initLowdefyContext({ auth , Components , config , router , stage , types , window  }) {
     if (stage === 'dev') {
         window.lowdefy = lowdefy;
     }
@@ -49,18 +47,25 @@ function initLowdefyContext({ Components , config , router , stage , types , win
     lowdefy.lowdefyGlobal = config.rootConfig.lowdefyGlobal;
     lowdefy.menus = config.rootConfig.menus;
     lowdefy.pageId = config.pageConfig.pageId;
-    lowdefy.urlQuery = urlQuery.parse(window.location.search.slice(1));
-    lowdefy._internal.window = window;
-    lowdefy._internal.document = window.document;
+    lowdefy.user = auth?.session?.user ?? null;
+    lowdefy._internal.globals = {
+        document: window.document,
+        fetch: window.fetch,
+        window
+    };
     lowdefy._internal.router = router;
     lowdefy._internal.link = setupLink(lowdefy);
-    lowdefy._internal.updateBlock = (blockId)=>lowdefy._internal.updaters[blockId] && lowdefy._internal.updaters[blockId]()
-    ;
+    lowdefy._internal.updateBlock = (blockId)=>lowdefy._internal.updaters[blockId] && lowdefy._internal.updaters[blockId]();
     lowdefy._internal.components.Link = createLinkComponent(lowdefy, Components.Link);
     lowdefy._internal.components.Icon = createIcon(types.icons);
     lowdefy._internal.actions = types.actions;
     lowdefy._internal.blockComponents = types.blocks;
     lowdefy._internal.operators = types.operators;
+    // TODO: discuss not using object arguments
+    lowdefy._internal.auth = createAuthMethods({
+        lowdefy,
+        auth
+    });
     return lowdefy;
 }
 export default initLowdefyContext;

package/dist/setupLink.js

@@ -14,9 +14,9 @@
   limitations under the License.
 */ import { createLink } from '@lowdefy/engine';
 function setupLink(lowdefy) {
-    const { router , window  } = lowdefy._internal;
-    const backLink = ()=>router.back()
-    ;
+    const { router  } = lowdefy._internal;
+    const { window  } = lowdefy._internal.globals;
+    const backLink = ()=>router.back();
     const disabledLink = ()=>{};
     const newOriginLink = ({ url , query , newTab  })=>{
         if (newTab) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lowdefy/client",
-  "version": "4.0.0-alpha.9",
+  "version": "4.0.0-rc.0",
   "license": "Apache-2.0",
   "description": "Lowdefy Client",
   "homepage": "https://lowdefy.com",
@@ -33,39 +33,39 @@
     "dist/*"
   ],
   "scripts": {
-    "build": "yarn swc",
+    "build": "swc src --out-dir dist --config-file ../../.swcrc --delete-dir-on-start && pnpm copyfiles",
     "clean": "rm -rf dist",
     "copyfiles": "copyfiles -u 1 \"./src/**/*\" dist -e \"./src/**/*.js\" -e \"./src/**/*.yaml\" -e \"./src/**/*.snap\"",
-    "prepare": "yarn build",
-    "swc": "swc src --out-dir dist --config-file ../../.swcrc --delete-dir-on-start && yarn copyfiles",
+    "prepublishOnly": "pnpm build",
     "test:watch": "jest --coverage --watch",
     "test": "jest --coverage"
   },
   "dependencies": {
     "@ant-design/icons": "4.7.0",
-    "@lowdefy/block-utils": "4.0.0-alpha.9",
-    "@lowdefy/engine": "4.0.0-alpha.9",
-    "@lowdefy/helpers": "4.0.0-alpha.9",
-    "@lowdefy/layout": "4.0.0-alpha.9",
+    "@lowdefy/block-utils": "4.0.0-rc.0",
+    "@lowdefy/engine": "4.0.0-rc.0",
+    "@lowdefy/helpers": "4.0.0-rc.0",
+    "@lowdefy/layout": "4.0.0-rc.0",
     "classnames": "2.3.1",
-    "react": "17.0.2",
-    "react-dom": "17.0.2"
+    "react": "18.2.0",
+    "react-dom": "18.2.0"
   },
   "devDependencies": {
-    "@emotion/jest": "11.7.1",
-    "@swc/cli": "0.1.55",
-    "@swc/core": "1.2.135",
-    "@swc/jest": "0.2.17",
-    "@testing-library/dom": "8.11.3",
-    "@testing-library/react": "13.0.0-alpha.4",
-    "@testing-library/user-event": "14.0.0-alpha.14",
+    "@emotion/jest": "11.9.1",
+    "@lowdefy/jest-yaml-transform": "4.0.0-rc.0",
+    "@swc/cli": "0.1.57",
+    "@swc/core": "1.2.194",
+    "@swc/jest": "0.2.21",
+    "@testing-library/dom": "8.13.0",
+    "@testing-library/react": "13.3.0",
+    "@testing-library/user-event": "14.2.0",
     "copyfiles": "2.4.1",
-    "jest": "27.5.1",
-    "jest-serializer-html": "7.1.0",
-    "jest-transform-yaml": "1.0.0"
+    "jest": "28.1.0",
+    "jest-environment-jsdom": "28.1.0",
+    "jest-serializer-html": "7.1.0"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "98b544eca231bdcfca6c3a8601a891835d5ce571"
+  "gitHead": "f6872d7ff6da421710096536fce7b2016ef8f35c"
 }