@compill/admin 1.0.71 → 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,

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,

package/package.json

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

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);
 };