@panneau/app 3.0.126 → 3.0.128

package/es/index.js

@@ -35,6 +35,7 @@ import Menu from '@panneau/element-menu';
 import Navbar from '@panneau/element-navbar';
 import Label from '@panneau/element-label';
 import ResourceList from '@panneau/list-resource-items';
+import Loading from '@panneau/element-loading';
 import ResourceForm$1 from '@panneau/form-resource';
 import { getComponentFromName } from '@panneau/core/utils';
 import Filters from '@panneau/filter-filters';
@@ -173,18 +174,28 @@ ResourcesMenu.propTypes = propTypes$i;
 ResourcesMenu.defaultProps = defaultProps$h;
 var ResourcesMenu$1 = ResourcesMenu;
 
-var propTypes$h = {};
-var defaultProps$g = {};
-var MainNavbar = function MainNavbar(props) {
+var _excluded$4 = ["loading", "theme"];
+var propTypes$h = {
+  loading: PropTypes.bool,
+  theme: PropTypes.string
+};
+var defaultProps$g = {
+  loading: false,
+  theme: 'light'
+};
+var MainNavbar = function MainNavbar(_ref) {
+  var loading = _ref.loading,
+    theme = _ref.theme,
+    props = _objectWithoutProperties(_ref, _excluded$4);
   var _usePanneau = usePanneau(),
     name = _usePanneau.name,
     _usePanneau$menus = _usePanneau.menus,
     menus = _usePanneau$menus === void 0 ? null : _usePanneau$menus;
-  var _ref = menus || {},
-    _ref$main = _ref.main,
-    main = _ref$main === void 0 ? null : _ref$main,
-    _ref$guest = _ref.guest,
-    guest = _ref$guest === void 0 ? null : _ref$guest;
+  var _ref2 = menus || {},
+    _ref2$main = _ref2.main,
+    main = _ref2$main === void 0 ? null : _ref2$main,
+    _ref2$guest = _ref2.guest,
+    guest = _ref2$guest === void 0 ? null : _ref2$guest;
   var _usePanneauColorSchem = usePanneauColorScheme(),
     background = _usePanneauColorSchem.background;
   var route = useUrlGenerator();
@@ -231,11 +242,18 @@ var MainNavbar = function MainNavbar(props) {
     });
   }, [main]);
   return /*#__PURE__*/React.createElement(Navbar, Object.assign({
-    theme: background
+    theme: background,
+    loading: loading
   }, props), name !== null ? /*#__PURE__*/React.createElement(Link, {
     href: route('home'),
     className: "navbar-brand"
-  }, name) : null, items);
+  }, /*#__PURE__*/React.createElement("span", {
+    className: classNames([{
+      'text-light': theme === 'dark',
+      'text-dark': theme !== 'dark',
+      'text-opacity-75': loading
+    }])
+  }, name)) : null, items);
 };
 MainNavbar.propTypes = propTypes$h;
 MainNavbar.defaultProps = defaultProps$g;
@@ -244,15 +262,19 @@ var MainNavbar$1 = MainNavbar;
 var styles$1 = {};
 
 var propTypes$g = {
-  children: PropTypes.node.isRequired,
+  children: PropTypes.node,
+  loading: PropTypes.bool,
   fullscreen: PropTypes.bool
 };
 var defaultProps$f = {
-  fullscreen: false
+  fullscreen: false,
+  loading: false,
+  children: null
 };
 var MainLayout = function MainLayout(_ref) {
-  var children = _ref.children,
-    fullscreen = _ref.fullscreen;
+  var fullscreen = _ref.fullscreen,
+    loading = _ref.loading,
+    children = _ref.children;
   var _usePanneauColorSchem = usePanneauColorScheme(),
     _usePanneauColorSchem2 = _usePanneauColorSchem.theme,
     theme = _usePanneauColorSchem2 === void 0 ? null : _usePanneauColorSchem2,
@@ -264,7 +286,9 @@ var MainLayout = function MainLayout(_ref) {
     className: classNames([styles$1.container, 'd-flex', 'flex-column', 'min-vh-100']),
     "data-bs-theme": theme !== null ? theme : null
   }, /*#__PURE__*/React.createElement(MainNavbar$1, {
-    className: classNames(['border-bottom', 'sticky-top', 'px-3'])
+    className: classNames(['border-bottom', 'sticky-top', 'px-3']),
+    theme: theme,
+    loading: loading
   }), /*#__PURE__*/React.createElement("div", {
     className: classNames(['flex-grow-1', _defineProperty(_defineProperty({
       'd-flex flex-column': fullscreen
@@ -393,7 +417,9 @@ var ResourceDeletePage = function ResourceDeletePage(_ref) {
     navigate = _useLocation2[1];
   var resourceRoute = useResourceUrlGenerator(resource);
   var _useResourceItem = useResourceItem(resource, itemId),
-    item = _useResourceItem.item;
+    item = _useResourceItem.item,
+    loading = _useResourceItem.loading,
+    error = _useResourceItem.error;
   var _ref2 = item || {},
     _ref2$type = _ref2.type,
     type = _ref2$type === void 0 ? null : _ref2$type;
@@ -404,7 +430,9 @@ var ResourceDeletePage = function ResourceDeletePage(_ref) {
   }, [navigate, resourceRoute]);
   return /*#__PURE__*/React.createElement(ResourceProvider, {
     resource: resource
-  }, /*#__PURE__*/React.createElement(MainLayout$1, null, /*#__PURE__*/React.createElement(PageHeader$1, {
+  }, /*#__PURE__*/React.createElement(MainLayout$1, {
+    loading: loading
+  }, /*#__PURE__*/React.createElement(PageHeader$1, {
     title: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormattedMessage, {
       values: resourceValues,
       id: "zN5N/Q",
@@ -430,7 +458,15 @@ var ResourceDeletePage = function ResourceDeletePage(_ref) {
     item: item,
     onSuccess: onSuccess,
     isDelete: true
-  }) : null)))));
+  }) : null, item === null && loading && !error ? /*#__PURE__*/React.createElement(Loading, {
+    withDelay: true
+  }, /*#__PURE__*/React.createElement(FormattedMessage, {
+    id: "TV3jir",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Loading"
+    }]
+  })) : null)))));
 };
 ResourceDeletePage.propTypes = propTypes$d;
 ResourceDeletePage.defaultProps = defaultProps$c;
@@ -445,7 +481,9 @@ var ResourceEditPage = function ResourceEditPage(_ref) {
   var itemId = _ref.itemId,
     resource = _ref.resource;
   var _useResourceItem = useResourceItem(resource, itemId),
-    item = _useResourceItem.item;
+    item = _useResourceItem.item,
+    loading = _useResourceItem.loading,
+    error = _useResourceItem.error;
   var _ref2 = item || {},
     _ref2$type = _ref2.type,
     type = _ref2$type === void 0 ? null : _ref2$type;
@@ -463,7 +501,9 @@ var ResourceEditPage = function ResourceEditPage(_ref) {
   var resourceValues = useResourceValues(resource);
   return /*#__PURE__*/React.createElement(ResourceProvider, {
     resource: resource
-  }, /*#__PURE__*/React.createElement(MainLayout$1, null, /*#__PURE__*/React.createElement(PageHeader$1, {
+  }, /*#__PURE__*/React.createElement(MainLayout$1, {
+    loading: loading
+  }, /*#__PURE__*/React.createElement(PageHeader$1, {
     title: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormattedMessage, {
       values: resourceValues,
       id: "mCfzkJ",
@@ -489,7 +529,15 @@ var ResourceEditPage = function ResourceEditPage(_ref) {
     item: editItem,
     type: type,
     onSuccess: onSuccess
-  }) : null)))));
+  }) : null, editItem === null && loading && !error ? /*#__PURE__*/React.createElement(Loading, {
+    withDelay: true
+  }, /*#__PURE__*/React.createElement(FormattedMessage, {
+    id: "TV3jir",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Loading"
+    }]
+  })) : null)))));
 };
 ResourceEditPage.propTypes = propTypes$c;
 ResourceEditPage.defaultProps = defaultProps$b;
@@ -747,13 +795,17 @@ var ResourceShowPage = function ResourceShowPage(_ref) {
     itemId = _ref.itemId;
   var name = resource.name;
   var _useResourceItem = useResourceItem(resource, itemId),
-    item = _useResourceItem.item;
+    item = _useResourceItem.item,
+    loading = _useResourceItem.loading,
+    error = _useResourceItem.error;
   var _ref2 = item || {},
     _ref2$type = _ref2.type,
     type = _ref2$type === void 0 ? null : _ref2$type;
   return /*#__PURE__*/React.createElement(ResourceProvider, {
     resource: resource
-  }, /*#__PURE__*/React.createElement(MainLayout$1, null, /*#__PURE__*/React.createElement(PageHeader$1, {
+  }, /*#__PURE__*/React.createElement(MainLayout$1, {
+    loading: loading
+  }, /*#__PURE__*/React.createElement(PageHeader$1, {
     title: "".concat(name, " #").concat(itemId),
     small: true
   }), /*#__PURE__*/React.createElement("div", {
@@ -762,12 +814,20 @@ var ResourceShowPage = function ResourceShowPage(_ref) {
     className: "row justify-content-center"
   }, /*#__PURE__*/React.createElement("div", {
     className: "col-12 col-md-8 col-lg-7"
-  }, /*#__PURE__*/React.createElement(ResourceForm, {
+  }, item !== null ? /*#__PURE__*/React.createElement(ResourceForm, {
     resource: resource,
     item: item,
     type: type,
     disabled: true
-  }))))));
+  }) : null, item === null && loading && !error ? /*#__PURE__*/React.createElement(Loading, {
+    withDelay: true
+  }, /*#__PURE__*/React.createElement(FormattedMessage, {
+    id: "TV3jir",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Loading"
+    }]
+  })) : null)))));
 };
 ResourceShowPage.propTypes = propTypes$8;
 ResourceShowPage.defaultProps = defaultProps$8;

package/lib/index.js

@@ -43,6 +43,7 @@ var Menu = require('@panneau/element-menu');
 var Navbar = require('@panneau/element-navbar');
 var Label = require('@panneau/element-label');
 var ResourceList = require('@panneau/list-resource-items');
+var Loading = require('@panneau/element-loading');
 var ResourceForm$1 = require('@panneau/form-resource');
 var utils = require('@panneau/core/utils');
 var Filters = require('@panneau/filter-filters');
@@ -198,7 +199,7 @@ if (typeof history !== "undefined" && typeof window[patchKey] === "undefined") {
   });
 }
 
-var _excluded$4 = ["children"],
+var _excluded$5 = ["children"],
   _excluded2$1 = ["path", "nest", "match"],
   _excluded3 = ["to", "href", "onClick", "asChild", "children", "replace", "state"];
 
@@ -319,7 +320,7 @@ var matchRoute = function matchRoute(parser, route, path, loose) {
 
 var Router = function Router(_ref3) {
   var children = _ref3.children,
-    props = _objectWithoutProperties(_ref3, _excluded$4);
+    props = _objectWithoutProperties(_ref3, _excluded$5);
   // the router we will inherit from - it is the closest router in the tree,
   // unless the custom `hook` is provided (in that case it's the default one)
   var parent_ = useRouter();
@@ -1364,18 +1365,28 @@ ResourcesMenu.propTypes = propTypes$i;
 ResourcesMenu.defaultProps = defaultProps$h;
 var ResourcesMenu$1 = ResourcesMenu;
 
-var propTypes$h = {};
-var defaultProps$g = {};
-var MainNavbar = function MainNavbar(props) {
+var _excluded$4 = ["loading", "theme"];
+var propTypes$h = {
+  loading: PropTypes.bool,
+  theme: PropTypes.string
+};
+var defaultProps$g = {
+  loading: false,
+  theme: 'light'
+};
+var MainNavbar = function MainNavbar(_ref) {
+  var loading = _ref.loading,
+    theme = _ref.theme,
+    props = _objectWithoutProperties(_ref, _excluded$4);
   var _usePanneau = contexts.usePanneau(),
     name = _usePanneau.name,
     _usePanneau$menus = _usePanneau.menus,
     menus = _usePanneau$menus === void 0 ? null : _usePanneau$menus;
-  var _ref = menus || {},
-    _ref$main = _ref.main,
-    main = _ref$main === void 0 ? null : _ref$main,
-    _ref$guest = _ref.guest,
-    guest = _ref$guest === void 0 ? null : _ref$guest;
+  var _ref2 = menus || {},
+    _ref2$main = _ref2.main,
+    main = _ref2$main === void 0 ? null : _ref2$main,
+    _ref2$guest = _ref2.guest,
+    guest = _ref2$guest === void 0 ? null : _ref2$guest;
   var _usePanneauColorSchem = contexts.usePanneauColorScheme(),
     background = _usePanneauColorSchem.background;
   var route = contexts.useUrlGenerator();
@@ -1422,11 +1433,18 @@ var MainNavbar = function MainNavbar(props) {
     });
   }, [main]);
   return /*#__PURE__*/React.createElement(Navbar, Object.assign({
-    theme: background
+    theme: background,
+    loading: loading
   }, props), name !== null ? /*#__PURE__*/React.createElement(Link, {
     href: route('home'),
     className: "navbar-brand"
-  }, name) : null, items);
+  }, /*#__PURE__*/React.createElement("span", {
+    className: classNames([{
+      'text-light': theme === 'dark',
+      'text-dark': theme !== 'dark',
+      'text-opacity-75': loading
+    }])
+  }, name)) : null, items);
 };
 MainNavbar.propTypes = propTypes$h;
 MainNavbar.defaultProps = defaultProps$g;
@@ -1435,15 +1453,19 @@ var MainNavbar$1 = MainNavbar;
 var styles$1 = {};
 
 var propTypes$g = {
-  children: PropTypes.node.isRequired,
+  children: PropTypes.node,
+  loading: PropTypes.bool,
   fullscreen: PropTypes.bool
 };
 var defaultProps$f = {
-  fullscreen: false
+  fullscreen: false,
+  loading: false,
+  children: null
 };
 var MainLayout = function MainLayout(_ref) {
-  var children = _ref.children,
-    fullscreen = _ref.fullscreen;
+  var fullscreen = _ref.fullscreen,
+    loading = _ref.loading,
+    children = _ref.children;
   var _usePanneauColorSchem = contexts.usePanneauColorScheme(),
     _usePanneauColorSchem2 = _usePanneauColorSchem.theme,
     theme = _usePanneauColorSchem2 === void 0 ? null : _usePanneauColorSchem2,
@@ -1455,7 +1477,9 @@ var MainLayout = function MainLayout(_ref) {
     className: classNames([styles$1.container, 'd-flex', 'flex-column', 'min-vh-100']),
     "data-bs-theme": theme !== null ? theme : null
   }, /*#__PURE__*/React.createElement(MainNavbar$1, {
-    className: classNames(['border-bottom', 'sticky-top', 'px-3'])
+    className: classNames(['border-bottom', 'sticky-top', 'px-3']),
+    theme: theme,
+    loading: loading
   }), /*#__PURE__*/React.createElement("div", {
     className: classNames(['flex-grow-1', _defineProperty(_defineProperty({
       'd-flex flex-column': fullscreen
@@ -1584,7 +1608,9 @@ var ResourceDeletePage = function ResourceDeletePage(_ref) {
     navigate = _useLocation2[1];
   var resourceRoute = hooks.useResourceUrlGenerator(resource);
   var _useResourceItem = data.useResourceItem(resource, itemId),
-    item = _useResourceItem.item;
+    item = _useResourceItem.item,
+    loading = _useResourceItem.loading,
+    error = _useResourceItem.error;
   var _ref2 = item || {},
     _ref2$type = _ref2.type,
     type = _ref2$type === void 0 ? null : _ref2$type;
@@ -1595,7 +1621,9 @@ var ResourceDeletePage = function ResourceDeletePage(_ref) {
   }, [navigate, resourceRoute]);
   return /*#__PURE__*/React.createElement(contexts.ResourceProvider, {
     resource: resource
-  }, /*#__PURE__*/React.createElement(MainLayout$1, null, /*#__PURE__*/React.createElement(PageHeader$1, {
+  }, /*#__PURE__*/React.createElement(MainLayout$1, {
+    loading: loading
+  }, /*#__PURE__*/React.createElement(PageHeader$1, {
     title: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
       values: resourceValues,
       id: "zN5N/Q",
@@ -1621,7 +1649,15 @@ var ResourceDeletePage = function ResourceDeletePage(_ref) {
     item: item,
     onSuccess: onSuccess,
     isDelete: true
-  }) : null)))));
+  }) : null, item === null && loading && !error ? /*#__PURE__*/React.createElement(Loading, {
+    withDelay: true
+  }, /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
+    id: "TV3jir",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Loading"
+    }]
+  })) : null)))));
 };
 ResourceDeletePage.propTypes = propTypes$d;
 ResourceDeletePage.defaultProps = defaultProps$c;
@@ -1636,7 +1672,9 @@ var ResourceEditPage = function ResourceEditPage(_ref) {
   var itemId = _ref.itemId,
     resource = _ref.resource;
   var _useResourceItem = data.useResourceItem(resource, itemId),
-    item = _useResourceItem.item;
+    item = _useResourceItem.item,
+    loading = _useResourceItem.loading,
+    error = _useResourceItem.error;
   var _ref2 = item || {},
     _ref2$type = _ref2.type,
     type = _ref2$type === void 0 ? null : _ref2$type;
@@ -1654,7 +1692,9 @@ var ResourceEditPage = function ResourceEditPage(_ref) {
   var resourceValues = intl.useResourceValues(resource);
   return /*#__PURE__*/React.createElement(contexts.ResourceProvider, {
     resource: resource
-  }, /*#__PURE__*/React.createElement(MainLayout$1, null, /*#__PURE__*/React.createElement(PageHeader$1, {
+  }, /*#__PURE__*/React.createElement(MainLayout$1, {
+    loading: loading
+  }, /*#__PURE__*/React.createElement(PageHeader$1, {
     title: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
       values: resourceValues,
       id: "mCfzkJ",
@@ -1680,7 +1720,15 @@ var ResourceEditPage = function ResourceEditPage(_ref) {
     item: editItem,
     type: type,
     onSuccess: onSuccess
-  }) : null)))));
+  }) : null, editItem === null && loading && !error ? /*#__PURE__*/React.createElement(Loading, {
+    withDelay: true
+  }, /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
+    id: "TV3jir",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Loading"
+    }]
+  })) : null)))));
 };
 ResourceEditPage.propTypes = propTypes$c;
 ResourceEditPage.defaultProps = defaultProps$b;
@@ -1938,13 +1986,17 @@ var ResourceShowPage = function ResourceShowPage(_ref) {
     itemId = _ref.itemId;
   var name = resource.name;
   var _useResourceItem = data.useResourceItem(resource, itemId),
-    item = _useResourceItem.item;
+    item = _useResourceItem.item,
+    loading = _useResourceItem.loading,
+    error = _useResourceItem.error;
   var _ref2 = item || {},
     _ref2$type = _ref2.type,
     type = _ref2$type === void 0 ? null : _ref2$type;
   return /*#__PURE__*/React.createElement(contexts.ResourceProvider, {
     resource: resource
-  }, /*#__PURE__*/React.createElement(MainLayout$1, null, /*#__PURE__*/React.createElement(PageHeader$1, {
+  }, /*#__PURE__*/React.createElement(MainLayout$1, {
+    loading: loading
+  }, /*#__PURE__*/React.createElement(PageHeader$1, {
     title: "".concat(name, " #").concat(itemId),
     small: true
   }), /*#__PURE__*/React.createElement("div", {
@@ -1953,12 +2005,20 @@ var ResourceShowPage = function ResourceShowPage(_ref) {
     className: "row justify-content-center"
   }, /*#__PURE__*/React.createElement("div", {
     className: "col-12 col-md-8 col-lg-7"
-  }, /*#__PURE__*/React.createElement(ResourceForm, {
+  }, item !== null ? /*#__PURE__*/React.createElement(ResourceForm, {
     resource: resource,
     item: item,
     type: type,
     disabled: true
-  }))))));
+  }) : null, item === null && loading && !error ? /*#__PURE__*/React.createElement(Loading, {
+    withDelay: true
+  }, /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
+    id: "TV3jir",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Loading"
+    }]
+  })) : null)))));
 };
 ResourceShowPage.propTypes = propTypes$8;
 ResourceShowPage.defaultProps = defaultProps$8;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@panneau/app",
-    "version": "3.0.126",
+    "version": "3.0.128",
     "description": "",
     "keywords": [
         "javascript"
@@ -79,27 +79,27 @@
         "@panneau/element-button": "^3.0.126",
         "@panneau/element-buttons": "^3.0.126",
         "@panneau/element-dropdown": "^3.0.126",
-        "@panneau/element-form": "^3.0.126",
+        "@panneau/element-form": "^3.0.127",
         "@panneau/element-form-group": "^3.0.126",
         "@panneau/element-form-row": "^3.0.126",
         "@panneau/element-icon": "^3.0.126",
         "@panneau/element-label": "^3.0.126",
         "@panneau/element-link": "^3.0.126",
-        "@panneau/element-loading": "^3.0.126",
+        "@panneau/element-loading": "^3.0.128",
         "@panneau/element-menu": "^3.0.126",
         "@panneau/element-modal": "^3.0.126",
         "@panneau/element-navbar": "^3.0.126",
         "@panneau/element-pagination": "^3.0.126",
         "@panneau/element-radios": "^3.0.126",
         "@panneau/element-range": "^3.0.126",
-        "@panneau/fields": "^3.0.126",
+        "@panneau/fields": "^3.0.128",
         "@panneau/filter-filters": "^3.0.126",
-        "@panneau/filters": "^3.0.126",
-        "@panneau/form-resource": "^3.0.126",
-        "@panneau/forms": "^3.0.126",
-        "@panneau/intl": "^3.0.126",
-        "@panneau/list-resource-items": "^3.0.126",
-        "@panneau/lists": "^3.0.126",
+        "@panneau/filters": "^3.0.127",
+        "@panneau/form-resource": "^3.0.128",
+        "@panneau/forms": "^3.0.127",
+        "@panneau/intl": "^3.0.128",
+        "@panneau/list-resource-items": "^3.0.128",
+        "@panneau/lists": "^3.0.128",
         "@panneau/modals": "^3.0.126",
         "@panneau/themes": "^3.0.126",
         "@panneau/uppy": "^3.0.126",
@@ -113,5 +113,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "fa69ddff3f8cf22b00504093087608d5701e6f6a"
+    "gitHead": "3aaf7fc845c73397120b774dca538986a7b6068c"
 }