@xh/hoist 76.0.0-SNAPSHOT.1756219543970 → 76.0.0-SNAPSHOT.1756402657806

package/build/types/desktop/cmp/rest/RestGrid.d.ts

@@ -6,19 +6,28 @@ import { RestGridModel } from './RestGridModel';
 export interface RestGridProps extends HoistProps<RestGridModel>, Omit<PanelProps, 'model' | 'modelConfig' | 'modelRef'> {
     /**
      * This constitutes an 'escape hatch' for applications that need to get to the underlying
-     * ag-Grid API.  It should be used with care. Settings made here might be overwritten and/or
-     * interfere with the implementation of this component and its use of the ag-Grid API.
+     * AG Grid API. Use with care - settings made here might be overwritten and/or interfere with
+     * the implementation of this component and its use of AG Grid.
      */
     agOptions?: PlainObject;
-    /** Optional components rendered adjacent to the top toolbar's action buttons */
-    extraToolbarItems?: Some<ReactNode> | (() => Some<ReactNode>);
     /**
-     * Mask to render on this Component. Defaults to true, which renders a standard
-     * Hoist mask. Also can be set to false for no mask, or passed an element
-     * specifying a Mask instance.
+     * Optional components rendered adjacent to the top toolbar's action buttons.
+     * See also {@link tbar} to take full control of the toolbar.
      */
-    mask?: ReactElement | boolean;
+    extraToolbarItems?: Some<ReactNode> | (() => Some<ReactNode>);
     /** Classname to be passed to RestForm. */
     formClassName?: string;
+    /**
+     * Mask to render on this Component. Defaults to true, which renders a standard Hoist mask.
+     * Set to null/false for no mask, or pass a fully customized mask element.
+     */
+    mask?: ReactElement | boolean;
+    /**
+     * A custom toolbar to be docked above the grid. Note that this supersedes the default
+     * toolbar, meaning the `extraToolbarItems` prop will be ignored, as will the `RestGridModel`
+     * configs `toolbarActions`, `filterFields`, and `showRefreshButton`. If specified as an array,
+     * will be passed as children to a Toolbar component.
+     */
+    tbar?: Some<ReactNode>;
 }
 export declare const RestGrid: import("react").FC<RestGridProps>, restGrid: import("@xh/hoist/core").ElementFactory<RestGridProps>;

package/desktop/cmp/rest/RestGrid.ts

@@ -10,8 +10,10 @@ import {fragment} from '@xh/hoist/cmp/layout';
 import {hoistCmp, HoistProps, PlainObject, Some, uses} from '@xh/hoist/core';
 import {MaskProps} from '@xh/hoist/cmp/mask';
 import {panel, PanelProps} from '@xh/hoist/desktop/cmp/panel';
+import {toolbar} from '@xh/hoist/desktop/cmp/toolbar';
 import '@xh/hoist/desktop/register';
 import {getTestId} from '@xh/hoist/utils/js';
+import {isArray} from 'lodash';
 import {cloneElement, isValidElement, ReactElement, ReactNode} from 'react';
 
 import {restForm} from './impl/RestForm';
@@ -23,23 +25,33 @@ export interface RestGridProps
         Omit<PanelProps, 'model' | 'modelConfig' | 'modelRef'> {
     /**
      * This constitutes an 'escape hatch' for applications that need to get to the underlying
-     * ag-Grid API.  It should be used with care. Settings made here might be overwritten and/or
-     * interfere with the implementation of this component and its use of the ag-Grid API.
+     * AG Grid API. Use with care - settings made here might be overwritten and/or interfere with
+     * the implementation of this component and its use of AG Grid.
      */
     agOptions?: PlainObject;
 
-    /** Optional components rendered adjacent to the top toolbar's action buttons */
+    /**
+     * Optional components rendered adjacent to the top toolbar's action buttons.
+     * See also {@link tbar} to take full control of the toolbar.
+     */
     extraToolbarItems?: Some<ReactNode> | (() => Some<ReactNode>);
 
+    /** Classname to be passed to RestForm. */
+    formClassName?: string;
+
     /**
-     * Mask to render on this Component. Defaults to true, which renders a standard
-     * Hoist mask. Also can be set to false for no mask, or passed an element
-     * specifying a Mask instance.
+     * Mask to render on this Component. Defaults to true, which renders a standard Hoist mask.
+     * Set to null/false for no mask, or pass a fully customized mask element.
      */
     mask?: ReactElement | boolean;
 
-    /** Classname to be passed to RestForm. */
-    formClassName?: string;
+    /**
+     * A custom toolbar to be docked above the grid. Note that this supersedes the default
+     * toolbar, meaning the `extraToolbarItems` prop will be ignored, as will the `RestGridModel`
+     * configs `toolbarActions`, `filterFields`, and `showRefreshButton`. If specified as an array,
+     * will be passed as children to a Toolbar component.
+     */
+    tbar?: Some<ReactNode>;
 }
 
 export const [RestGrid, restGrid] = hoistCmp.withFactory<RestGridProps>({
@@ -51,6 +63,7 @@ export const [RestGrid, restGrid] = hoistCmp.withFactory<RestGridProps>({
         const {
                 model,
                 extraToolbarItems,
+                tbar,
                 mask = true,
                 agOptions,
                 formClassName,
@@ -63,7 +76,7 @@ export const [RestGrid, restGrid] = hoistCmp.withFactory<RestGridProps>({
             panel({
                 ref,
                 ...restProps,
-                tbar: restGridToolbar({model, extraToolbarItems, testId}),
+                tbar: innerToolbar({model, tbar, extraToolbarItems, testId}),
                 item: grid({model: gridModel, agOptions, testId: getTestId(testId, 'grid')}),
                 mask: getMaskFromProp(model, mask)
             }),
@@ -76,6 +89,14 @@ export const [RestGrid, restGrid] = hoistCmp.withFactory<RestGridProps>({
     }
 });
 
+const innerToolbar = hoistCmp.factory({
+    render({model, tbar, extraToolbarItems, testId}) {
+        if (isArray(tbar)) return toolbar(tbar);
+        if (tbar) return tbar;
+        return restGridToolbar({model, extraToolbarItems, testId});
+    }
+});
+
 function getMaskFromProp(model, mask) {
     if (isValidElement(mask)) {
         mask = cloneElement<MaskProps>(mask, {bind: model.loadModel});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xh/hoist",
-  "version": "76.0.0-SNAPSHOT.1756219543970",
+  "version": "76.0.0-SNAPSHOT.1756402657806",
   "description": "Hoist add-on for building and deploying React Applications.",
   "repository": "github:xh/hoist-react",
   "homepage": "https://xh.io",