@xh/hoist 48.0.0 → 48.0.1

package/CHANGELOG.md

@@ -1,20 +1,30 @@
 # Changelog
 
+## v48.0.1 - 2022-04-22
+
+### 🐞 Bug Fixes
+
+* Improve default rendering to call `toString()` on non-react elements returned by renderers.
+* Fixed issue with `model` property missing from `Model.componentProps` under certain conditions.
+
+[Commit Log](https://github.com/xh/hoist-react/compare/v48.0.0...v48.0.1)
+
 ## v48.0.0 - 2022-04-21
 
 ### 🎁 New Features
-* A new `DashCanvas` layout component for creating scrollable dashboards that allow users to manually
-  place and size their widgets using a grid-based layout. Note that this component is in Beta and
-  its API is subject to change.
+
+* A new `DashCanvas` layout component for creating scrollable dashboards that allow users to
+  manually place and size their widgets using a grid-based layout. Note that this component is in
+  beta and its API is subject to change.
 * FontAwesome upgraded to v6. This includes redesigns of the majority of bundled icons - please
   check your app's icon usages carefully.
-* `fmtQuantity` now displays values greater than one billion with `b` unit, similar to current
-  handling of millions with `m`.
 * Enhancements to admin log viewer. Log file metadata (size & last modified) available with
   optional upgrade to `hoist-core >= 13.2`.
 * Mobile `Dialog` will scroll internally if taller than the screen.
 * Configs passed to `XH.message()` and its variants now take an optional `className` to apply to the
   message dialog.
+* `fmtQuantity` now displays values greater than one billion with `b` unit, similar to current
+  handling of millions with `m`.
 
 ### 💥 Breaking Changes
 
@@ -51,7 +61,6 @@
 
 [Commit Log](https://github.com/xh/hoist-react/compare/v47.1.2...v48.0.0)
 
-
 ## v47.1.2 - 2022-04-01
 
 ### 🐞 Bug Fixes

package/admin/columns/UserData.js

@@ -64,7 +64,7 @@ export const local = {
 };
 
 function truncateIfJson(value, {record}) {
-    return record.data.type === 'json' ? truncateValue(value) : value;
+    return record.data.type === 'json' ? truncateValue(value) : value?.toString();
 }
 
 function truncateValue(value) {

package/admin/tabs/general/about/AboutPanel.js

@@ -37,7 +37,7 @@ function renderTables() {
     let hrVersion = get('hoistReactVersion');
     if (hrVersion.includes('SNAPSHOT.')) {
         const snapDate = new Date(parseInt(hrVersion.split('SNAPSHOT.')[1]));
-        hrVersion += ` (${fmtDateTime(snapDate)})`;
+        hrVersion += ` (${fmtDateTime(snapDate, {asHtml: true})})`;
     }
 
     return [

package/admin/tabs/general/config/ConfigPanelModel.js

@@ -118,7 +118,7 @@ export class ConfigPanelModel extends HoistModel {
             case 'json':
                 return truncate(value, {length: 500});
             default:
-                return value;
+                return value?.toString();
         }
     }
 

package/cmp/filter/impl/QueryEngine.js

@@ -298,7 +298,7 @@ export class QueryEngine {
 
         const max = this.model.maxResults;
         return max > 0 && results.length > max ?
-            [...results.slice(0, max), msgOption(`${max} of ${fmtNumber(results.length)} results shown`)] :
+            [...results.slice(0, max), msgOption(`${max} of ${fmtNumber(results.length, {asHtml: true})} results shown`)] :
             results;
     }
 

package/cmp/grid/columns/Column.js

@@ -4,10 +4,11 @@
  *
  * Copyright © 2021 Extremely Heavy Industries Inc.
  */
-import {div, ul, li, span} from '@xh/hoist/cmp/layout';
+import {div, li, span, ul} from '@xh/hoist/cmp/layout';
 import {XH} from '@xh/hoist/core';
 import {genDisplayName} from '@xh/hoist/data';
-import {throwIf, warnIf, withDefault, apiRemoved} from '@xh/hoist/utils/js';
+import {apiRemoved, throwIf, warnIf, withDefault} from '@xh/hoist/utils/js';
+import classNames from 'classnames';
 import {
     castArray,
     clone,
@@ -23,8 +24,7 @@ import {
     isString,
     toString
 } from 'lodash';
-import {forwardRef, useImperativeHandle, createElement, isValidElement} from 'react';
-import classNames from 'classnames';
+import {createElement, forwardRef, isValidElement, useImperativeHandle} from 'react';
 import {GridSorter} from '../impl/GridSorter';
 import {ExcelFormat} from './ExcelFormat';
 
@@ -611,9 +611,11 @@ export class Column {
         const {renderer} = this;
         if (!agOptions.cellRenderer) {
             setRenderer((agParams) => {
-                const ret = renderer ?
+                let ret = renderer ?
                     renderer(agParams.value, {record: agParams.data, column: this, gridModel, agParams}) :
-                    agParams.value?.toString();
+                    agParams.value;
+
+                ret = isNil(ret) || isValidElement(ret) ? ret : toString(ret);
 
                 // Add wrapping span for styling purposes
                 return span({className: 'xh-cell-inner-wrapper', item: ret});

package/cmp/websocket/WebSocketIndicator.js

@@ -28,7 +28,7 @@ export const [WebSocketIndicator, webSocketIndicator] = hoistCmp.withFactory({
         } else if (connected) {
             icon = Icon.circle({prefix: 'fas', intent: 'success'});
             txt = 'Connected';
-            tooltip = `Last message: ${fmtTime(lastMessageTime)}`;
+            tooltip = `Last message: ${fmtTime(lastMessageTime, {asHtml: true})}`;
         } else {
             icon = Icon.xCircle({intent: 'danger'});
             txt = 'Disconnected';

package/core/HoistComponent.js

@@ -209,9 +209,10 @@ function callRender(render, spec, model, modelLookup, props, ref, displayName) {
     }
     const ctx = localModelContext;
     try {
+        props = propsWithModel(props, model);
         ctx.props = props;
         ctx.modelLookup = modelLookup;
-        return render(propsWithModel(props, model), ref);
+        return render(props, ref);
     } finally {
         ctx.props = null;
         ctx.modelLookup = null;

package/package.json

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