@panneau/app 1.0.0-alpha.225 → 1.0.0-alpha.229

package/es/index.js

@@ -2,7 +2,7 @@ import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import { useUser, useLogout, useAuth, AuthProvider } from '@panneau/auth';
 import { PropTypes } from '@panneau/core';
-import { useLocales, useFormsComponents, FormProvider, useUrlGenerator, usePanneauResources, usePanneau, usePanneauColorScheme, ResourceProvider, useFiltersComponents, useListsComponents, useFormComponent, useRoutes, PanneauProvider, UppyProvider, RoutesProvider, ComponentsProvider } from '@panneau/core/contexts';
+import { useLocales, useFormsComponents, FormProvider, useUrlGenerator, usePanneauResources, usePanneau, usePanneauColorScheme, ResourceProvider, useFiltersComponents, useListsComponents, useComponentsManager, useFormComponent, useRoutes, PanneauProvider, UppyProvider, RoutesProvider, ComponentsProvider } from '@panneau/core/contexts';
 import { useResourceStore, useResourceUpdate, useResourceDestroy, useResourceItem, useResourceItems, ApiProvider } from '@panneau/data';
 import DisplaysProvider from '@panneau/displays';
 import FieldsProvider from '@panneau/fields';
@@ -27,13 +27,14 @@ import Navbar from '@panneau/element-navbar';
 import Menu from '@panneau/element-menu';
 import Label from '@panneau/element-label';
 import Alert from '@panneau/element-alert';
+import isString from 'lodash/isString';
 import Dropdown from '@panneau/element-dropdown';
 import Pagination from '@panneau/element-pagination';
 import { faUndo } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import FormGroup from '@panneau/element-form-group';
 
-var _excluded$3 = ["resource", "action", "previous", "status", "value", "onSubmit", "errors", "generalError", "className"];
+var _excluded$5 = ["resource", "action", "previous", "status", "value", "onSubmit", "errors", "generalError", "className"];
 var propTypes$n = {
   resource: PropTypes.resource.isRequired,
   action: PropTypes$1.string,
@@ -69,7 +70,7 @@ var DeleteForm = function DeleteForm(_ref) {
       _ref.errors;
       var generalError = _ref.generalError,
       className = _ref.className,
-      props = _objectWithoutProperties(_ref, _excluded$3);
+      props = _objectWithoutProperties(_ref, _excluded$5);
 
   return /*#__PURE__*/React.createElement(Form, Object.assign({
     className: classNames(['form', _defineProperty({
@@ -126,7 +127,7 @@ var DeleteForm = function DeleteForm(_ref) {
 DeleteForm.propTypes = propTypes$n;
 DeleteForm.defaultProps = defaultProps$n;
 
-var _excluded$2 = ["component", "resource", "onSuccess", "item", "type", "isDelete"];
+var _excluded$4 = ["component", "resource", "onSuccess", "item", "type", "isDelete"];
 var propTypes$m = {
   component: PropTypes$1.string,
   resource: PropTypes.resource.isRequired,
@@ -151,7 +152,7 @@ var ResourceForm = function ResourceForm(_ref) {
       item = _ref.item,
       type = _ref.type,
       isDelete = _ref.isDelete,
-      props = _objectWithoutProperties(_ref, _excluded$2);
+      props = _objectWithoutProperties(_ref, _excluded$4);
 
   var locales = useLocales();
   var FormComponents = useFormsComponents();
@@ -762,7 +763,7 @@ var ResourceCreateButtom = function ResourceCreateButtom(_ref) {
 ResourceCreateButtom.propTypes = propTypes$d;
 ResourceCreateButtom.defaultProps = defaultProps$d;
 
-var _excluded$1 = ["component", "name", "groupLabel"];
+var _excluded$3 = ["component", "name", "groupLabel"];
 var propTypes$c = {
   filters: PropTypes$1.arrayOf(PropTypes$1.shape({
     id: PropTypes$1.string.isRequired,
@@ -822,7 +823,7 @@ var ResourceFilters = function ResourceFilters(_ref) {
     var component = _ref3.component,
         name = _ref3.name,
         groupLabel = _ref3.groupLabel,
-        filterProps = _objectWithoutProperties(_ref3, _excluded$1);
+        filterProps = _objectWithoutProperties(_ref3, _excluded$3);
 
     var FilterComponent = getComponentFromName(component, FilterComponents, null);
     var filterValue = value !== null && value[name] ? value[name] : null;
@@ -850,8 +851,8 @@ var ResourceFilters = function ResourceFilters(_ref) {
 ResourceFilters.propTypes = propTypes$c;
 ResourceFilters.defaultProps = defaultProps$c;
 
-var _excluded = ["component", "showPagination", "filters"],
-    _excluded2 = ["page"];
+var _excluded$2 = ["component", "showPagination", "filters"],
+    _excluded2$1 = ["page"];
 var propTypes$b = {
   resource: PropTypes.resource.isRequired,
   query: PropTypes$1.object,
@@ -890,7 +891,7 @@ var ResourceItemsList = function ResourceItemsList(_ref) {
       showPagination = _resource$index$showP === void 0 ? true : _resource$index$showP,
       _resource$index$filte = _resource$index.filters,
       filters = _resource$index$filte === void 0 ? null : _resource$index$filte,
-      listProps = _objectWithoutProperties(_resource$index, _excluded);
+      listProps = _objectWithoutProperties(_resource$index, _excluded$2);
 
   var _usePanneauColorSchem = usePanneauColorScheme(),
       _usePanneauColorSchem2 = _usePanneauColorSchem.background,
@@ -902,7 +903,7 @@ var ResourceItemsList = function ResourceItemsList(_ref) {
     var _ref2 = query || {},
         _ref2$page = _ref2.page,
         currentPage = _ref2$page === void 0 ? 1 : _ref2$page,
-        rest = _objectWithoutProperties(_ref2, _excluded2);
+        rest = _objectWithoutProperties(_ref2, _excluded2$1);
 
     return [currentPage, rest];
   }, [query]),
@@ -951,16 +952,23 @@ var ResourceItemsList = function ResourceItemsList(_ref) {
 ResourceItemsList.propTypes = propTypes$b;
 ResourceItemsList.defaultProps = defaultProps$b;
 
+var _excluded$1 = ["id", "component"];
 var propTypes$a = {
-  resource: PropTypes.resource.isRequired
+  resource: PropTypes.resource.isRequired,
+  defaultActions: PropTypes$1.arrayOf(PropTypes$1.object)
+};
+var defaultProps$a = {
+  defaultActions: ['create']
 };
-var defaultProps$a = {};
 
 var ResourceIndexPage = function ResourceIndexPage(_ref) {
-  var resource = _ref.resource;
+  var resource = _ref.resource,
+      defaultActions = _ref.defaultActions;
   var name = resource.name,
       _resource$settings = resource.settings,
-      settings = _resource$settings === void 0 ? {} : _resource$settings;
+      settings = _resource$settings === void 0 ? {} : _resource$settings,
+      _resource$index = resource.index,
+      index = _resource$index === void 0 ? {} : _resource$index;
 
   var _ref2 = settings || {},
       _ref2$canCreate = _ref2.canCreate,
@@ -968,6 +976,24 @@ var ResourceIndexPage = function ResourceIndexPage(_ref) {
       _ref2$indexIsPaginate = _ref2.indexIsPaginated,
       paginated = _ref2$indexIsPaginate === void 0 ? false : _ref2$indexIsPaginate;
 
+  var _ref3 = index || {},
+      _ref3$actions = _ref3.actions,
+      actions = _ref3$actions === void 0 ? null : _ref3$actions;
+
+  var finalActions = useMemo(function () {
+    return (actions || defaultActions.filter(function (it) {
+      return it !== 'create' || canCreate;
+    })).map(function (it) {
+      return it === 'create' ? {
+        id: 'create',
+        component: ResourceCreateButtom,
+        size: 'lg',
+        theme: 'primary'
+      } : it;
+    });
+  }, [canCreate, actions]);
+  var componentsManager = useComponentsManager();
+
   var _useLocation = useLocation(),
       search = _useLocation.search;
 
@@ -979,11 +1005,11 @@ var ResourceIndexPage = function ResourceIndexPage(_ref) {
     return query;
   }, [query]); // TODO: omit routes
 
-  var _ref3 = query || {},
-      _ref3$created = _ref3.created,
-      created = _ref3$created === void 0 ? false : _ref3$created,
-      _ref3$deleted = _ref3.deleted,
-      deleted = _ref3$deleted === void 0 ? false : _ref3$deleted;
+  var _ref4 = query || {},
+      _ref4$created = _ref4.created,
+      created = _ref4$created === void 0 ? false : _ref4$created,
+      _ref4$deleted = _ref4.deleted,
+      deleted = _ref4$deleted === void 0 ? false : _ref4$deleted;
 
   var resourceRoute = useResourceUrlGenerator(resource);
   var url = resourceRoute('index');
@@ -1009,11 +1035,23 @@ var ResourceIndexPage = function ResourceIndexPage(_ref) {
     resource: resource
   }, /*#__PURE__*/React.createElement(MainLayout, null, /*#__PURE__*/React.createElement(PageHeader, {
     title: name,
-    actions: canCreate ? /*#__PURE__*/React.createElement(ResourceCreateButtom, {
-      resource: resource,
-      size: "lg",
-      theme: "primary"
-    }) : null
+    actions: finalActions.length > 0 ? /*#__PURE__*/React.createElement("div", {
+      className: "d-flex align-items-center"
+    }, finalActions.map(function (_ref5) {
+      var id = _ref5.id,
+          _ref5$component = _ref5.component,
+          component = _ref5$component === void 0 ? Button : _ref5$component,
+          actionProps = _objectWithoutProperties(_ref5, _excluded$1);
+
+      var ActionComponent = isString(component) ? componentsManager.getComponent(component) : component;
+      return ActionComponent !== null ? /*#__PURE__*/React.createElement(ActionComponent, Object.assign({
+        key: "action-".concat(id)
+      }, actionProps, ActionComponent !== Button ? {
+        resource: resource,
+        query: query,
+        onQueryChange: onQueryChange
+      } : {})) : null;
+    })) : null
   }), /*#__PURE__*/React.createElement("div", {
     className: classNames(['container-sm py-4'])
   }, created ? /*#__PURE__*/React.createElement(Alert, {
@@ -1401,6 +1439,8 @@ var basePages = /*#__PURE__*/Object.freeze({
     Error: ErrorPage
 });
 
+var _excluded = ["path", "component", "exact"],
+    _excluded2 = ["id"];
 var propTypes$2 = {
   resource: PropTypes.resource.isRequired
 };
@@ -1410,8 +1450,11 @@ var ResourceRoutes = function ResourceRoutes(_ref) {
   var resource = _ref.resource;
   var resourceId = resource.id,
       _resource$pages = resource.pages,
-      pages = _resource$pages === void 0 ? {} : _resource$pages;
-  var route = useUrlGenerator(); // Load custom pages from resource
+      pages = _resource$pages === void 0 ? {} : _resource$pages,
+      _resource$extraRoutes = resource.extraRoutes,
+      extraRoutes = _resource$extraRoutes === void 0 ? [] : _resource$extraRoutes;
+  var route = useUrlGenerator();
+  var componentsManager = useComponentsManager(); // Load custom pages from resource
 
   var _ref2 = pages || {},
       _ref2$index = _ref2.index,
@@ -1425,12 +1468,35 @@ var ResourceRoutes = function ResourceRoutes(_ref) {
       _ref2$delete = _ref2["delete"],
       deletePage = _ref2$delete === void 0 ? null : _ref2$delete;
 
-  var ResourceIndexComponent = getComponentFromName((indexPage === null || indexPage === void 0 ? void 0 : indexPage.component) || 'resource-index', basePages, indexPage === null || indexPage === void 0 ? void 0 : indexPage.component);
-  var ResourceShowComponent = getComponentFromName((showPage === null || showPage === void 0 ? void 0 : showPage.component) || 'resource-show', basePages, showPage === null || showPage === void 0 ? void 0 : showPage.component);
-  var ResourceCreateComponent = getComponentFromName((createPage === null || createPage === void 0 ? void 0 : createPage.component) || 'resource-create', basePages, createPage === null || createPage === void 0 ? void 0 : createPage.component);
-  var ResourceEditComponent = getComponentFromName((editPage === null || editPage === void 0 ? void 0 : editPage.component) || 'resource-edit', basePages, editPage === null || editPage === void 0 ? void 0 : editPage.component);
-  var ResourceDeleteComponent = getComponentFromName((deletePage === null || deletePage === void 0 ? void 0 : deletePage.component) || 'resource-delete', basePages, deletePage === null || deletePage === void 0 ? void 0 : deletePage.component);
-  return /*#__PURE__*/React.createElement(Switch, null, /*#__PURE__*/React.createElement(Route, {
+  var ResourceIndexComponent = indexPage !== null && typeof indexPage.component !== 'undefined' ? componentsManager.getComponent(indexPage.component) : ResourceIndexPage;
+  var ResourceShowComponent = showPage !== null && typeof showPage.component !== 'undefined' ? componentsManager.getComponent(showPage.component) : ResourceShowPage;
+  var ResourceCreateComponent = createPage !== null && typeof createPage.component !== 'undefined' ? componentsManager.getComponent(createPage.component) : ResourceCreatePage;
+  var ResourceEditComponent = editPage !== null && typeof editPage.component !== 'undefined' ? componentsManager.getComponent(editPage.component) : ResourceEditPage;
+  var ResourceDeleteComponent = deletePage !== null && typeof deletePage.component !== 'undefined' ? componentsManager.getComponent(deletePage.component) : ResourceDeletePage;
+  return /*#__PURE__*/React.createElement(Switch, null, extraRoutes.map(function (_ref3) {
+    var path = _ref3.path,
+        component = _ref3.component,
+        _ref3$exact = _ref3.exact,
+        exact = _ref3$exact === void 0 ? true : _ref3$exact,
+        routeProps = _objectWithoutProperties(_ref3, _excluded);
+
+    var RouteComponent = componentsManager.getComponent(component);
+    return RouteComponent !== null ? /*#__PURE__*/React.createElement(Route, Object.assign({
+      key: "route-".concat(path),
+      path: path,
+      exact: exact,
+      render: function render(_ref4) {
+        var _ref4$match$params = _ref4.match.params,
+            id = _ref4$match$params.id,
+            params = _objectWithoutProperties(_ref4$match$params, _excluded2);
+
+        return /*#__PURE__*/React.createElement(RouteComponent, Object.assign({
+          resource: resource,
+          itemId: id
+        }, params));
+      }
+    }, routeProps)) : null;
+  }), /*#__PURE__*/React.createElement(Route, {
     path: route('resources.index', {
       resource: resourceId
     }),
@@ -1456,8 +1522,8 @@ var ResourceRoutes = function ResourceRoutes(_ref) {
       id: ':id'
     }),
     exact: true,
-    render: function render(_ref3) {
-      var id = _ref3.match.params.id;
+    render: function render(_ref5) {
+      var id = _ref5.match.params.id;
       return /*#__PURE__*/React.createElement(ResourceShowComponent, {
         resource: resource,
         itemId: id
@@ -1469,8 +1535,8 @@ var ResourceRoutes = function ResourceRoutes(_ref) {
       id: ':id'
     }),
     exact: true,
-    render: function render(_ref4) {
-      var id = _ref4.match.params.id;
+    render: function render(_ref6) {
+      var id = _ref6.match.params.id;
       return /*#__PURE__*/React.createElement(ResourceEditComponent, {
         resource: resource,
         itemId: id
@@ -1482,8 +1548,8 @@ var ResourceRoutes = function ResourceRoutes(_ref) {
       id: ':id'
     }),
     exact: true,
-    render: function render(_ref5) {
-      var id = _ref5.match.params.id;
+    render: function render(_ref7) {
+      var id = _ref7.match.params.id;
       return /*#__PURE__*/React.createElement(ResourceDeleteComponent, {
         resource: resource,
         itemId: id

package/lib/index.js

@@ -31,6 +31,7 @@ var Navbar = require('@panneau/element-navbar');
 var Menu = require('@panneau/element-menu');
 var Label = require('@panneau/element-label');
 var Alert = require('@panneau/element-alert');
+var isString = require('lodash/isString');
 var Dropdown = require('@panneau/element-dropdown');
 var Pagination = require('@panneau/element-pagination');
 var freeSolidSvgIcons = require('@fortawesome/free-solid-svg-icons');
@@ -57,11 +58,12 @@ var Navbar__default = /*#__PURE__*/_interopDefaultLegacy(Navbar);
 var Menu__default = /*#__PURE__*/_interopDefaultLegacy(Menu);
 var Label__default = /*#__PURE__*/_interopDefaultLegacy(Label);
 var Alert__default = /*#__PURE__*/_interopDefaultLegacy(Alert);
+var isString__default = /*#__PURE__*/_interopDefaultLegacy(isString);
 var Dropdown__default = /*#__PURE__*/_interopDefaultLegacy(Dropdown);
 var Pagination__default = /*#__PURE__*/_interopDefaultLegacy(Pagination);
 var FormGroup__default = /*#__PURE__*/_interopDefaultLegacy(FormGroup);
 
-var _excluded$3 = ["resource", "action", "previous", "status", "value", "onSubmit", "errors", "generalError", "className"];
+var _excluded$5 = ["resource", "action", "previous", "status", "value", "onSubmit", "errors", "generalError", "className"];
 var propTypes$n = {
   resource: core.PropTypes.resource.isRequired,
   action: PropTypes__default["default"].string,
@@ -97,7 +99,7 @@ var DeleteForm = function DeleteForm(_ref) {
       _ref.errors;
       var generalError = _ref.generalError,
       className = _ref.className,
-      props = _objectWithoutProperties__default["default"](_ref, _excluded$3);
+      props = _objectWithoutProperties__default["default"](_ref, _excluded$5);
 
   return /*#__PURE__*/React__default["default"].createElement(Form__default["default"], Object.assign({
     className: classNames__default["default"](['form', _defineProperty__default["default"]({
@@ -154,7 +156,7 @@ var DeleteForm = function DeleteForm(_ref) {
 DeleteForm.propTypes = propTypes$n;
 DeleteForm.defaultProps = defaultProps$n;
 
-var _excluded$2 = ["component", "resource", "onSuccess", "item", "type", "isDelete"];
+var _excluded$4 = ["component", "resource", "onSuccess", "item", "type", "isDelete"];
 var propTypes$m = {
   component: PropTypes__default["default"].string,
   resource: core.PropTypes.resource.isRequired,
@@ -179,7 +181,7 @@ var ResourceForm = function ResourceForm(_ref) {
       item = _ref.item,
       type = _ref.type,
       isDelete = _ref.isDelete,
-      props = _objectWithoutProperties__default["default"](_ref, _excluded$2);
+      props = _objectWithoutProperties__default["default"](_ref, _excluded$4);
 
   var locales = contexts.useLocales();
   var FormComponents = contexts.useFormsComponents();
@@ -790,7 +792,7 @@ var ResourceCreateButtom = function ResourceCreateButtom(_ref) {
 ResourceCreateButtom.propTypes = propTypes$d;
 ResourceCreateButtom.defaultProps = defaultProps$d;
 
-var _excluded$1 = ["component", "name", "groupLabel"];
+var _excluded$3 = ["component", "name", "groupLabel"];
 var propTypes$c = {
   filters: PropTypes__default["default"].arrayOf(PropTypes__default["default"].shape({
     id: PropTypes__default["default"].string.isRequired,
@@ -850,7 +852,7 @@ var ResourceFilters = function ResourceFilters(_ref) {
     var component = _ref3.component,
         name = _ref3.name,
         groupLabel = _ref3.groupLabel,
-        filterProps = _objectWithoutProperties__default["default"](_ref3, _excluded$1);
+        filterProps = _objectWithoutProperties__default["default"](_ref3, _excluded$3);
 
     var FilterComponent = utils.getComponentFromName(component, FilterComponents, null);
     var filterValue = value !== null && value[name] ? value[name] : null;
@@ -878,8 +880,8 @@ var ResourceFilters = function ResourceFilters(_ref) {
 ResourceFilters.propTypes = propTypes$c;
 ResourceFilters.defaultProps = defaultProps$c;
 
-var _excluded = ["component", "showPagination", "filters"],
-    _excluded2 = ["page"];
+var _excluded$2 = ["component", "showPagination", "filters"],
+    _excluded2$1 = ["page"];
 var propTypes$b = {
   resource: core.PropTypes.resource.isRequired,
   query: PropTypes__default["default"].object,
@@ -918,7 +920,7 @@ var ResourceItemsList = function ResourceItemsList(_ref) {
       showPagination = _resource$index$showP === void 0 ? true : _resource$index$showP,
       _resource$index$filte = _resource$index.filters,
       filters = _resource$index$filte === void 0 ? null : _resource$index$filte,
-      listProps = _objectWithoutProperties__default["default"](_resource$index, _excluded);
+      listProps = _objectWithoutProperties__default["default"](_resource$index, _excluded$2);
 
   var _usePanneauColorSchem = contexts.usePanneauColorScheme(),
       _usePanneauColorSchem2 = _usePanneauColorSchem.background,
@@ -930,7 +932,7 @@ var ResourceItemsList = function ResourceItemsList(_ref) {
     var _ref2 = query || {},
         _ref2$page = _ref2.page,
         currentPage = _ref2$page === void 0 ? 1 : _ref2$page,
-        rest = _objectWithoutProperties__default["default"](_ref2, _excluded2);
+        rest = _objectWithoutProperties__default["default"](_ref2, _excluded2$1);
 
     return [currentPage, rest];
   }, [query]),
@@ -979,16 +981,23 @@ var ResourceItemsList = function ResourceItemsList(_ref) {
 ResourceItemsList.propTypes = propTypes$b;
 ResourceItemsList.defaultProps = defaultProps$b;
 
+var _excluded$1 = ["id", "component"];
 var propTypes$a = {
-  resource: core.PropTypes.resource.isRequired
+  resource: core.PropTypes.resource.isRequired,
+  defaultActions: PropTypes__default["default"].arrayOf(PropTypes__default["default"].object)
+};
+var defaultProps$a = {
+  defaultActions: ['create']
 };
-var defaultProps$a = {};
 
 var ResourceIndexPage = function ResourceIndexPage(_ref) {
-  var resource = _ref.resource;
+  var resource = _ref.resource,
+      defaultActions = _ref.defaultActions;
   var name = resource.name,
       _resource$settings = resource.settings,
-      settings = _resource$settings === void 0 ? {} : _resource$settings;
+      settings = _resource$settings === void 0 ? {} : _resource$settings,
+      _resource$index = resource.index,
+      index = _resource$index === void 0 ? {} : _resource$index;
 
   var _ref2 = settings || {},
       _ref2$canCreate = _ref2.canCreate,
@@ -996,6 +1005,24 @@ var ResourceIndexPage = function ResourceIndexPage(_ref) {
       _ref2$indexIsPaginate = _ref2.indexIsPaginated,
       paginated = _ref2$indexIsPaginate === void 0 ? false : _ref2$indexIsPaginate;
 
+  var _ref3 = index || {},
+      _ref3$actions = _ref3.actions,
+      actions = _ref3$actions === void 0 ? null : _ref3$actions;
+
+  var finalActions = React.useMemo(function () {
+    return (actions || defaultActions.filter(function (it) {
+      return it !== 'create' || canCreate;
+    })).map(function (it) {
+      return it === 'create' ? {
+        id: 'create',
+        component: ResourceCreateButtom,
+        size: 'lg',
+        theme: 'primary'
+      } : it;
+    });
+  }, [canCreate, actions]);
+  var componentsManager = contexts.useComponentsManager();
+
   var _useLocation = reactRouter.useLocation(),
       search = _useLocation.search;
 
@@ -1007,11 +1034,11 @@ var ResourceIndexPage = function ResourceIndexPage(_ref) {
     return query;
   }, [query]); // TODO: omit routes
 
-  var _ref3 = query || {},
-      _ref3$created = _ref3.created,
-      created = _ref3$created === void 0 ? false : _ref3$created,
-      _ref3$deleted = _ref3.deleted,
-      deleted = _ref3$deleted === void 0 ? false : _ref3$deleted;
+  var _ref4 = query || {},
+      _ref4$created = _ref4.created,
+      created = _ref4$created === void 0 ? false : _ref4$created,
+      _ref4$deleted = _ref4.deleted,
+      deleted = _ref4$deleted === void 0 ? false : _ref4$deleted;
 
   var resourceRoute = hooks.useResourceUrlGenerator(resource);
   var url = resourceRoute('index');
@@ -1037,11 +1064,23 @@ var ResourceIndexPage = function ResourceIndexPage(_ref) {
     resource: resource
   }, /*#__PURE__*/React__default["default"].createElement(MainLayout, null, /*#__PURE__*/React__default["default"].createElement(PageHeader, {
     title: name,
-    actions: canCreate ? /*#__PURE__*/React__default["default"].createElement(ResourceCreateButtom, {
-      resource: resource,
-      size: "lg",
-      theme: "primary"
-    }) : null
+    actions: finalActions.length > 0 ? /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "d-flex align-items-center"
+    }, finalActions.map(function (_ref5) {
+      var id = _ref5.id,
+          _ref5$component = _ref5.component,
+          component = _ref5$component === void 0 ? Button__default["default"] : _ref5$component,
+          actionProps = _objectWithoutProperties__default["default"](_ref5, _excluded$1);
+
+      var ActionComponent = isString__default["default"](component) ? componentsManager.getComponent(component) : component;
+      return ActionComponent !== null ? /*#__PURE__*/React__default["default"].createElement(ActionComponent, Object.assign({
+        key: "action-".concat(id)
+      }, actionProps, ActionComponent !== Button__default["default"] ? {
+        resource: resource,
+        query: query,
+        onQueryChange: onQueryChange
+      } : {})) : null;
+    })) : null
   }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: classNames__default["default"](['container-sm py-4'])
   }, created ? /*#__PURE__*/React__default["default"].createElement(Alert__default["default"], {
@@ -1429,6 +1468,8 @@ var basePages = /*#__PURE__*/Object.freeze({
     Error: ErrorPage
 });
 
+var _excluded = ["path", "component", "exact"],
+    _excluded2 = ["id"];
 var propTypes$2 = {
   resource: core.PropTypes.resource.isRequired
 };
@@ -1438,8 +1479,11 @@ var ResourceRoutes = function ResourceRoutes(_ref) {
   var resource = _ref.resource;
   var resourceId = resource.id,
       _resource$pages = resource.pages,
-      pages = _resource$pages === void 0 ? {} : _resource$pages;
-  var route = contexts.useUrlGenerator(); // Load custom pages from resource
+      pages = _resource$pages === void 0 ? {} : _resource$pages,
+      _resource$extraRoutes = resource.extraRoutes,
+      extraRoutes = _resource$extraRoutes === void 0 ? [] : _resource$extraRoutes;
+  var route = contexts.useUrlGenerator();
+  var componentsManager = contexts.useComponentsManager(); // Load custom pages from resource
 
   var _ref2 = pages || {},
       _ref2$index = _ref2.index,
@@ -1453,12 +1497,35 @@ var ResourceRoutes = function ResourceRoutes(_ref) {
       _ref2$delete = _ref2["delete"],
       deletePage = _ref2$delete === void 0 ? null : _ref2$delete;
 
-  var ResourceIndexComponent = utils.getComponentFromName((indexPage === null || indexPage === void 0 ? void 0 : indexPage.component) || 'resource-index', basePages, indexPage === null || indexPage === void 0 ? void 0 : indexPage.component);
-  var ResourceShowComponent = utils.getComponentFromName((showPage === null || showPage === void 0 ? void 0 : showPage.component) || 'resource-show', basePages, showPage === null || showPage === void 0 ? void 0 : showPage.component);
-  var ResourceCreateComponent = utils.getComponentFromName((createPage === null || createPage === void 0 ? void 0 : createPage.component) || 'resource-create', basePages, createPage === null || createPage === void 0 ? void 0 : createPage.component);
-  var ResourceEditComponent = utils.getComponentFromName((editPage === null || editPage === void 0 ? void 0 : editPage.component) || 'resource-edit', basePages, editPage === null || editPage === void 0 ? void 0 : editPage.component);
-  var ResourceDeleteComponent = utils.getComponentFromName((deletePage === null || deletePage === void 0 ? void 0 : deletePage.component) || 'resource-delete', basePages, deletePage === null || deletePage === void 0 ? void 0 : deletePage.component);
-  return /*#__PURE__*/React__default["default"].createElement(reactRouter.Switch, null, /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
+  var ResourceIndexComponent = indexPage !== null && typeof indexPage.component !== 'undefined' ? componentsManager.getComponent(indexPage.component) : ResourceIndexPage;
+  var ResourceShowComponent = showPage !== null && typeof showPage.component !== 'undefined' ? componentsManager.getComponent(showPage.component) : ResourceShowPage;
+  var ResourceCreateComponent = createPage !== null && typeof createPage.component !== 'undefined' ? componentsManager.getComponent(createPage.component) : ResourceCreatePage;
+  var ResourceEditComponent = editPage !== null && typeof editPage.component !== 'undefined' ? componentsManager.getComponent(editPage.component) : ResourceEditPage;
+  var ResourceDeleteComponent = deletePage !== null && typeof deletePage.component !== 'undefined' ? componentsManager.getComponent(deletePage.component) : ResourceDeletePage;
+  return /*#__PURE__*/React__default["default"].createElement(reactRouter.Switch, null, extraRoutes.map(function (_ref3) {
+    var path = _ref3.path,
+        component = _ref3.component,
+        _ref3$exact = _ref3.exact,
+        exact = _ref3$exact === void 0 ? true : _ref3$exact,
+        routeProps = _objectWithoutProperties__default["default"](_ref3, _excluded);
+
+    var RouteComponent = componentsManager.getComponent(component);
+    return RouteComponent !== null ? /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, Object.assign({
+      key: "route-".concat(path),
+      path: path,
+      exact: exact,
+      render: function render(_ref4) {
+        var _ref4$match$params = _ref4.match.params,
+            id = _ref4$match$params.id,
+            params = _objectWithoutProperties__default["default"](_ref4$match$params, _excluded2);
+
+        return /*#__PURE__*/React__default["default"].createElement(RouteComponent, Object.assign({
+          resource: resource,
+          itemId: id
+        }, params));
+      }
+    }, routeProps)) : null;
+  }), /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
     path: route('resources.index', {
       resource: resourceId
     }),
@@ -1484,8 +1551,8 @@ var ResourceRoutes = function ResourceRoutes(_ref) {
       id: ':id'
     }),
     exact: true,
-    render: function render(_ref3) {
-      var id = _ref3.match.params.id;
+    render: function render(_ref5) {
+      var id = _ref5.match.params.id;
       return /*#__PURE__*/React__default["default"].createElement(ResourceShowComponent, {
         resource: resource,
         itemId: id
@@ -1497,8 +1564,8 @@ var ResourceRoutes = function ResourceRoutes(_ref) {
       id: ':id'
     }),
     exact: true,
-    render: function render(_ref4) {
-      var id = _ref4.match.params.id;
+    render: function render(_ref6) {
+      var id = _ref6.match.params.id;
       return /*#__PURE__*/React__default["default"].createElement(ResourceEditComponent, {
         resource: resource,
         itemId: id
@@ -1510,8 +1577,8 @@ var ResourceRoutes = function ResourceRoutes(_ref) {
       id: ':id'
     }),
     exact: true,
-    render: function render(_ref5) {
-      var id = _ref5.match.params.id;
+    render: function render(_ref7) {
+      var id = _ref7.match.params.id;
       return /*#__PURE__*/React__default["default"].createElement(ResourceDeleteComponent, {
         resource: resource,
         itemId: id

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@panneau/app",
-    "version": "1.0.0-alpha.225",
+    "version": "1.0.0-alpha.229",
     "description": "",
     "keywords": [
         "javascript"
@@ -35,6 +35,12 @@
     "license": "ISC",
     "main": "lib/index.js",
     "module": "es/index.js",
+    "exports": {
+        ".": "./lib/index.js",
+        "./scss/styles": "./scss/styles.scss",
+        "./scss/styles.scss": "./scss/styles.scss",
+        "./assets/css/styles.css": "./assets/css/styles.css"
+    },
     "files": [
         "lib",
         "es",
@@ -60,27 +66,27 @@
         "@panneau/auth": "^1.0.0-alpha.224",
         "@panneau/core": "^1.0.0-alpha.224",
         "@panneau/data": "^1.0.0-alpha.224",
-        "@panneau/displays": "^1.0.0-alpha.224",
-        "@panneau/element-alert": "^1.0.0-alpha.224",
-        "@panneau/element-button": "^1.0.0-alpha.224",
-        "@panneau/element-buttons": "^1.0.0-alpha.224",
-        "@panneau/element-dropdown": "^1.0.0-alpha.224",
-        "@panneau/element-form": "^1.0.0-alpha.224",
-        "@panneau/element-form-group": "^1.0.0-alpha.224",
+        "@panneau/displays": "^1.0.0-alpha.227",
+        "@panneau/element-alert": "^1.0.0-alpha.227",
+        "@panneau/element-button": "^1.0.0-alpha.227",
+        "@panneau/element-buttons": "^1.0.0-alpha.227",
+        "@panneau/element-dropdown": "^1.0.0-alpha.227",
+        "@panneau/element-form": "^1.0.0-alpha.227",
+        "@panneau/element-form-group": "^1.0.0-alpha.227",
         "@panneau/element-label": "^1.0.0-alpha.224",
         "@panneau/element-link": "^1.0.0-alpha.224",
         "@panneau/element-loading": "^1.0.0-alpha.224",
-        "@panneau/element-menu": "^1.0.0-alpha.224",
-        "@panneau/element-navbar": "^1.0.0-alpha.224",
+        "@panneau/element-menu": "^1.0.0-alpha.227",
+        "@panneau/element-navbar": "^1.0.0-alpha.227",
         "@panneau/element-pagination": "^1.0.0-alpha.224",
-        "@panneau/element-radios": "^1.0.0-alpha.224",
-        "@panneau/fields": "^1.0.0-alpha.224",
-        "@panneau/filters": "^1.0.0-alpha.224",
-        "@panneau/forms": "^1.0.0-alpha.224",
+        "@panneau/element-radios": "^1.0.0-alpha.227",
+        "@panneau/fields": "^1.0.0-alpha.227",
+        "@panneau/filters": "^1.0.0-alpha.227",
+        "@panneau/forms": "^1.0.0-alpha.227",
         "@panneau/intl": "^1.0.0-alpha.225",
-        "@panneau/lists": "^1.0.0-alpha.224",
-        "@panneau/modals": "^1.0.0-alpha.224",
-        "@panneau/themes": "^1.0.0-alpha.224",
+        "@panneau/lists": "^1.0.0-alpha.227",
+        "@panneau/modals": "^1.0.0-alpha.227",
+        "@panneau/themes": "^1.0.0-alpha.227",
         "classnames": "^2.2.6",
         "lodash": "^4.17.21",
         "prop-types": "^15.7.2",
@@ -92,5 +98,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "030c9df287c349757e0943051f3c54f11729f66f"
+    "gitHead": "c536479c610184d385873f2a1d3936707f8baaae"
 }