@xh/hoist 71.0.0-SNAPSHOT.1735657683714 → 71.0.0-SNAPSHOT.1735673121607

package/CHANGELOG.md

@@ -32,6 +32,8 @@
   ID and access tokens in a single request and to use refresh tokens to maintain access without
   relying on third-party cookies.
 * Updated sorting on grouped grids to place ungrouped items at the bottom.
+* `DashCanvas` views can now be resized left and up in addition to right and down.
+* `FetchService.autoGenCorrelationIds` now supports a functional form for per-request behavior.
 
 ### 🐞 Bug Fixes
 

package/build/types/core/model/HoistModel.d.ts

@@ -49,7 +49,7 @@ export declare abstract class HoistModel extends HoistBase implements Loadable {
     config: unknown;
     static get isHoistModel(): boolean;
     get isHoistModel(): boolean;
-    _componentProps: {};
+    _componentProps: any;
     _modelLookup: any;
     _created: number;
     constructor();

package/build/types/svc/FetchService.d.ts

@@ -9,8 +9,8 @@ import { IStringifyOptions } from 'qs';
  * the most common use-cases. The Fetch API will be called with CORS enabled, credentials
  * included, and redirects followed.
  *
- * Set {@link autoGenCorrelationIds} to true on this service to enable auto-generation of UUID
- * Correlation IDs for all requests issued by this service. Can also be set on a per-request basis
+ * Set {@link autoGenCorrelationIds} on this service to enable auto-generation of UUID
+ * Correlation IDs for requests issued by this service. Can also be set on a per-request basis
  * via {@link FetchOptions.correlationId}.
  *
  * Custom headers can be set on a request via {@link FetchOptions.headers}. Default headers for all
@@ -28,8 +28,11 @@ export declare class FetchService extends HoistService {
     private autoAborters;
     private _defaultHeaders;
     private _interceptors;
-    /** True to auto-generate a Correlation ID for each request unless otherwise specified. */
-    autoGenCorrelationIds: boolean;
+    /**
+     * Should hoist auto-generate a Correlation ID for a request when not otherwise specified?
+     * Set to `true` or a dynamic per-request function to enable.  Default false.
+     */
+    autoGenCorrelationIds: boolean | ((opts: FetchOptions) => boolean);
     /**
      * Method for generating Correlation ID's. Defaults to a 16 character random string with
      * an extremely low probability of collisions.  Applications may customize

package/core/model/HoistModel.ts

@@ -4,9 +4,9 @@
  *
  * Copyright © 2025 Extremely Heavy Industries Inc.
  */
-import {action, makeObservable, observable} from '@xh/hoist/mobx';
+import {action, computed, comparer, makeObservable, observable} from '@xh/hoist/mobx';
 import {warnIf} from '@xh/hoist/utils/js';
-import {forOwn, has, isFunction} from 'lodash';
+import {isFunction} from 'lodash';
 import {DefaultHoistProps, HoistBase, LoadSpecConfig, managed, PlainObject} from '../';
 import {instanceManager} from '../impl/InstanceManager';
 import {Loadable, LoadSpec, LoadSupport} from '../load';
@@ -67,8 +67,7 @@ export abstract class HoistModel extends HoistBase implements Loadable {
     }
 
     // Internal State
-    @observable
-    _componentProps = {};
+    @observable.ref _componentProps = null;
     _modelLookup = null;
     _created = Date.now();
 
@@ -136,6 +135,7 @@ export abstract class HoistModel extends HoistBase implements Loadable {
      * Observability is based on a shallow computation for each prop (i.e. a reference
      * change in any particular prop will trigger observers to be notified).
      */
+    @computed({equals: comparer.shallow})
     get componentProps(): DefaultHoistProps {
         return this._componentProps;
     }
@@ -187,13 +187,7 @@ export abstract class HoistModel extends HoistBase implements Loadable {
     /** @internal */
     @action
     setComponentProps(newProps) {
-        const props = this._componentProps;
-        Object.assign(props, newProps);
-        forOwn(props, (v, k) => {
-            if (!has(newProps, k)) {
-                delete props[k];
-            }
-        });
+        this._componentProps = newProps;
     }
 
     /** @internal */

package/desktop/cmp/dash/canvas/DashCanvas.scss

@@ -1,3 +1,32 @@
+@mixin resize-handle-ew {
+  height: 100%;
+  top: 0;
+  transform: rotate(0);
+  width: 8px;
+}
+
+@mixin resize-handle-ns {
+  height: 8px;
+  left: 0;
+  transform: rotate(0);
+  width: 100%;
+}
+
+@mixin resize-handle-corner {
+  height: 16px;
+  width: 16px;
+}
+
+@mixin resize-handle-se-sw {
+  @include resize-handle-corner;
+  bottom: -8px;
+}
+
+@mixin resize-handle-ne-nw {
+  @include resize-handle-corner;
+  top: -8px;
+}
+
 .xh-dash-canvas {
   width: 100%;
   height: 100%;
@@ -21,27 +50,44 @@
 
     > .react-resizable-handle {
       // Make the resize handles fill the entire side
+      &.react-resizable-handle-n {
+        @include resize-handle-ns;
+        top: -4px;
+      }
+
       &.react-resizable-handle-s {
+        @include resize-handle-ns;
         bottom: -4px;
-        height: 8px;
-        left: 0;
-        transform: rotate(0);
-        width: 100%;
       }
 
       &.react-resizable-handle-e {
-        height: 100%;
+        @include resize-handle-ew;
         right: -4px;
-        top: 0;
-        transform: rotate(0);
-        width: 8px;
+      }
+
+      &.react-resizable-handle-w {
+        @include resize-handle-ew;
+        left: -4px;
+      }
+
+      &.react-resizable-handle-ne {
+        @include resize-handle-ne-nw;
+        right: -8px;
+      }
+
+      &.react-resizable-handle-nw {
+        @include resize-handle-ne-nw;
+        left: -8px;
       }
 
       &.react-resizable-handle-se {
-        bottom: -8px;
-        height: 16px;
+        @include resize-handle-se-sw;
         right: -8px;
-        width: 16px;
+      }
+
+      &.react-resizable-handle-sw {
+        @include resize-handle-se-sw;
+        left: -8px;
       }
 
       // Hide the resize handles

package/desktop/cmp/dash/canvas/DashCanvasModel.ts

@@ -112,7 +112,9 @@ export class DashCanvasModel
 
             return {
                 ...it,
-                resizeHandles: autoHeight ? ['e'] : ['e', 's', 'se'],
+                resizeHandles: autoHeight
+                    ? ['w', 'e']
+                    : ['s', 'w', 'e', 'n', 'sw', 'nw', 'se', 'ne'],
                 maxH: viewSpec.maxHeight,
                 minH: viewSpec.minHeight,
                 maxW: viewSpec.maxWidth,

package/package.json

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

package/svc/FetchService.ts

@@ -28,8 +28,8 @@ import ShortUniqueId from 'short-unique-id';
  * the most common use-cases. The Fetch API will be called with CORS enabled, credentials
  * included, and redirects followed.
  *
- * Set {@link autoGenCorrelationIds} to true on this service to enable auto-generation of UUID
- * Correlation IDs for all requests issued by this service. Can also be set on a per-request basis
+ * Set {@link autoGenCorrelationIds} on this service to enable auto-generation of UUID
+ * Correlation IDs for requests issued by this service. Can also be set on a per-request basis
  * via {@link FetchOptions.correlationId}.
  *
  * Custom headers can be set on a request via {@link FetchOptions.headers}. Default headers for all
@@ -52,8 +52,11 @@ export class FetchService extends HoistService {
     //-----------------------------------
     // Public properties, Getters/Setters
     //------------------------------------
-    /** True to auto-generate a Correlation ID for each request unless otherwise specified. */
-    autoGenCorrelationIds = false;
+    /**
+     * Should hoist auto-generate a Correlation ID for a request when not otherwise specified?
+     * Set to `true` or a dynamic per-request function to enable.  Default false.
+     */
+    autoGenCorrelationIds: boolean | ((opts: FetchOptions) => boolean) = false;
 
     /**
      * Method for generating Correlation ID's. Defaults to a 16 character random string with
@@ -253,10 +256,12 @@ export class FetchService extends HoistService {
 
     // Resolve convenience options for Correlation ID to server-ready string
     private withCorrelationId(opts: FetchOptions): FetchOptions {
-        const {correlationId} = opts;
-        if (isString(correlationId)) return opts;
-        if (correlationId === false || correlationId === null) return omit(opts, 'correlationId');
-        if (correlationId === true || this.autoGenCorrelationIds) {
+        const cid = opts.correlationId,
+            autoCid = this.autoGenCorrelationIds;
+
+        if (isString(cid)) return opts;
+        if (cid === false || cid === null) return omit(opts, 'correlationId');
+        if (cid === true || autoCid === true || (isFunction(autoCid) && autoCid(opts))) {
             return {...opts, correlationId: this.genCorrelationId()};
         }
         return opts;