@compill/admin 1.0.70 → 1.0.72

package/index.cjs.js

@@ -18,10 +18,10 @@ var react = require('@soperio/react');
 var editor = require('@compill/editor');
 var admin = require('@compill/admin');
 var reactDom = require('react-dom');
+var router = require('next/router');
 var table = require('@compill/table');
 var hooks = require('@compill/hooks');
 var env = require('@compill/env');
-var router = require('next/router');
 var reactQuery = require('@tanstack/react-query');
 var Image = require('next/image');
 
@@ -1135,18 +1135,27 @@ function Buttons$1({
   });
 }
 
+function useQueryField(queryField, useNextRouter) {
+  if (useNextRouter) {
+    const router$1 = router.useRouter();
+    return router$1.query[queryField];
+  }
+  const {
+    [queryField]: id
+  } = reactRouterDom.useParams();
+  return id;
+}
 function DetailsView(_a) {
   var {
       queryField,
       api,
+      useNextRouter,
       processInput,
       screen,
       tabbed
     } = _a,
-    props = __rest$1(_a, ["queryField", "api", "processInput", "screen", "tabbed"]);
-  const {
-    [queryField]: id
-  } = reactRouterDom.useParams();
+    props = __rest$1(_a, ["queryField", "api", "useNextRouter", "processInput", "screen", "tabbed"]);
+  const id = useQueryField(queryField, useNextRouter);
   const ref = React__default["default"].useRef(null);
   return jsxRuntime.jsx(PageQueryStateContainer, Object.assign({
     api: api,
@@ -2895,10 +2904,9 @@ function MenuItem(_a) {
       path,
       depth,
       darkMode,
-      subMenu,
-      children
+      subMenu
     } = _a,
-    props = __rest$1(_a, ["icon", "path", "depth", "darkMode", "subMenu", "children"]);
+    props = __rest$1(_a, ["icon", "path", "depth", "darkMode", "subMenu"]);
   const location = reactRouterDom.useLocation();
   const selected = path == "/" ? location.pathname == "/" : location.pathname.startsWith(path.startsWith("/") ? path : `/${path}`);
   const match = reactRouterDom.useMatch("/" + path) != null;
@@ -2934,10 +2942,9 @@ function NextMenuItem(_a) {
       path,
       depth,
       darkMode,
-      subMenu,
-      children
+      subMenu
     } = _a,
-    props = __rest$1(_a, ["icon", "path", "depth", "darkMode", "subMenu", "children"]);
+    props = __rest$1(_a, ["icon", "path", "depth", "darkMode", "subMenu"]);
   const {
     pathname
   } = router.useRouter();

package/index.esm.js

@@ -14,10 +14,10 @@ import { createContext as createContext$1, runIfFn, isFunction } from '@soperio/
 import { Editor } from '@compill/editor';
 import { PageSectionTitle as PageSectionTitle$1, ButtonBarDialogButton as ButtonBarDialogButton$1, TableRowActionButton as TableRowActionButton$1, DialogButton as DialogButton$1 } from '@compill/admin';
 import { createPortal } from 'react-dom';
+import { useRouter } from 'next/router';
 import { TableContextProvider, useTableContext, Table } from '@compill/table';
 import { useOpenLink, useBoolean } from '@compill/hooks';
 import { Env } from '@compill/env';
-import { useRouter } from 'next/router';
 import { useQueryClient } from '@tanstack/react-query';
 import Image from 'next/image';
 
@@ -1125,18 +1125,27 @@ function Buttons$1({
   });
 }
 
+function useQueryField(queryField, useNextRouter) {
+  if (useNextRouter) {
+    const router = useRouter();
+    return router.query[queryField];
+  }
+  const {
+    [queryField]: id
+  } = useParams();
+  return id;
+}
 function DetailsView(_a) {
   var {
       queryField,
       api,
+      useNextRouter,
       processInput,
       screen,
       tabbed
     } = _a,
-    props = __rest$1(_a, ["queryField", "api", "processInput", "screen", "tabbed"]);
-  const {
-    [queryField]: id
-  } = useParams();
+    props = __rest$1(_a, ["queryField", "api", "useNextRouter", "processInput", "screen", "tabbed"]);
+  const id = useQueryField(queryField, useNextRouter);
   const ref = React.useRef(null);
   return jsx(PageQueryStateContainer, Object.assign({
     api: api,
@@ -2885,10 +2894,9 @@ function MenuItem(_a) {
       path,
       depth,
       darkMode,
-      subMenu,
-      children
+      subMenu
     } = _a,
-    props = __rest$1(_a, ["icon", "path", "depth", "darkMode", "subMenu", "children"]);
+    props = __rest$1(_a, ["icon", "path", "depth", "darkMode", "subMenu"]);
   const location = useLocation();
   const selected = path == "/" ? location.pathname == "/" : location.pathname.startsWith(path.startsWith("/") ? path : `/${path}`);
   const match = useMatch("/" + path) != null;
@@ -2924,10 +2932,9 @@ function NextMenuItem(_a) {
       path,
       depth,
       darkMode,
-      subMenu,
-      children
+      subMenu
     } = _a,
-    props = __rest$1(_a, ["icon", "path", "depth", "darkMode", "subMenu", "children"]);
+    props = __rest$1(_a, ["icon", "path", "depth", "darkMode", "subMenu"]);
   const {
     pathname
   } = useRouter();

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@compill/admin",
-    "version": "1.0.70",
+    "version": "1.0.72",
     "module": "./index.esm.js",
     "main": "./index.cjs.js"
 }

package/src/index.d.ts

@@ -21,6 +21,7 @@ export * from "./lib/json/types/TableView";
 export * from "./lib/layout/AdminLayout";
 export * from "./lib/layout/ButtonBar";
 export * from "./lib/layout/menu/Menu";
+export * from "./lib/layout/menu/MenuConfig";
 export * from "./lib/modal/AttachDialog";
 export * from "./lib/modal/FormActionDialog";
 export * from "./lib/page/PageContainer";

package/src/lib/json/DetailsView.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { SoperioComponent } from "@soperio/react";
 import { DetailsViewConfig } from "./types/DetailsView";
-export declare function DetailsView({ queryField, api, processInput, screen, tabbed, ...props }: DetailsViewConfig & {
+export declare function DetailsView({ queryField, api, useNextRouter, processInput, screen, tabbed, ...props }: DetailsViewConfig & {
     tabbed?: boolean;
 } & SoperioComponent): JSX.Element;

package/src/lib/json/types/DetailsView.d.ts

@@ -7,6 +7,7 @@ export type DetailsViewConfig<T = any> = {
     type: "details";
     api: API<T>;
     queryField: string;
+    useNextRouter?: boolean;
     processInput?: (input: T) => any;
     screen: Screen | ((data: T) => Screen);
 };

package/src/lib/layout/menu/MenuItem.d.ts

@@ -8,5 +8,5 @@ interface MenuItemProps extends SoperioComponent, ParentComponent {
     darkMode?: boolean;
     subMenu?: Item[];
 }
-export declare function MenuItem({ icon, path, depth, darkMode, subMenu, children, ...props }: MenuItemProps): JSX.Element;
+export declare function MenuItem({ icon, path, depth, darkMode, subMenu, ...props }: MenuItemProps): JSX.Element;
 export {};

package/src/lib/layout/menu/NextMenuItem.d.ts

@@ -8,5 +8,5 @@ interface NextMenuItemProps extends SoperioComponent, ParentComponent {
     darkMode?: boolean;
     subMenu?: Item[];
 }
-export declare function NextMenuItem({ icon, path, depth, darkMode, subMenu, children, ...props }: NextMenuItemProps): JSX.Element;
+export declare function NextMenuItem({ icon, path, depth, darkMode, subMenu, ...props }: NextMenuItemProps): JSX.Element;
 export {};