Skip to content

v12.0.0
Compare
Choose a tag to compare
@amcclain amcclain released this 20 Aug 22:35
· 4073 commits to develop since this release
v12.0.0
a1b14ac

Hoist React v12 is a relatively large release, with multiple refactorings around grid columns, elemFactory support, classNames, and a re-organization of classes and exports within utils.

💥 Breaking Changes

⭐️ Grid Columns

A new Column class describes a top-level API for columns and their supported options and is intended to be a cross-platform layer on top of ag-Grid and TBD mobile grid implementations.

  • The desktop GridModel class now accepts a collection of Column configuration objects to define its available columns.
  • Columns may be configured with flex: true to cause them to stretch all available horizontal space within a grid, sharing it equally with any other flex columns. However note that this should be used sparingly, as flex columns have some deliberate limitations to ensure stable and consistent behavior. Most noticeably, they cannot be resized directly by users. Often, a best practice will be to insert an emptyFlexCol configuration as the last column in a grid - this will avoid messy-looking gaps in the layout while not requiring a data-driven column be flexed.
  • User customizations to column widths are now saved if the GridModel has been configured with a stateModel key or model instance - see GridStateModel.
  • Columns accept a renderer config to format text or HTML-based output. This is a callback that is provided the value, the row-level record, and a metadata object with the column's colId. An elementRenderer config is also available for cells that should render a Component.
  • An agOptions config key continues to provide a way to pass arbitrary options to the underlying ag-Grid instance (for desktop implementations). This is considered an "escape hatch" and should be used with care, but can provide a bridge to required ag-Grid features as the Hoist-level API continues to develop.
  • The "factory pattern" for Column templates / defaults has been removed, replaced by a simpler approach that recommends exporting simple configuration partials and spreading them into instance-specific column configs. See the Admin app for some examples of this pattern.
  • See 0798f6b for primary commit.

⭐️ Element Factory, LayoutSupport, BaseClassName

Hoist provides core support for creating components via a factory pattern, powered by the elem() and elemFactory() methods. This approach remains the recommended way to instantiate component elements, but was simplified and streamlined.

  • The rarely used itemSpec argument was removed (this previously applied defaults to child items).
  • Developers can now also use JSX to instantiate all Hoist-provided components while still taking advantage of auto-handling for layout-related properties provided by the [LayoutSupport mixin].
    • HoistComponents should now spread ...this.getLayoutProps() into their outermost rendered child to enable promotion of layout properties.
  • All HoistComponents can now specify a baseClassName on their component class and should pass className: this.getClassName() down to their outermost rendered child. This allows components to cleanly layer on a base CSS class name with any instance-specific classes.
  • See 8342d38 for primary commit.

⭐️ Panel resizing / collapsing

The Panel component now takes a sizingModel prop to control and encapsulate newly built-in resizing and collapsing behavior (#534).

  • See the PanelSizingModel class for configurable details, including continued support for saving sizing / collapsed state as a user preference.
  • The standalone Resizable component was removed in favor of the improved support built into Panel directly.

Other

  • Two promise-related models have been combined into a new, more powerful PendingTaskModel, and the LoadMask component has been removed and consolidated into Mask (d00a5c6).
    • Panel now exposes a single mask prop that can take either a configured mask element or a simple boolean to display/remove a default mask.
  • Classes within the utils package have been re-organized into more standardized and scalable namespaces. Imports of these classes will need to be adjusted.

🎁 New Features

  • The desktop Grid component now offers a compact mode with configurable styling to display significantly more data with reduced padding and font sizes.
  • The top-level AppBar refresh button now provides a default implementation, calling a new abstract requestRefresh() method on HoistApp.
  • The grid column chooser can now be configured to display its column groups as initially collapsed, for especially large collections of columns.
  • A new XH.restoreDefaultsAsync() method provides a centralized way to wipe out user-specific preferences or customizations (#508).
  • Additional Blueprint MultiSelect, Tag, and FormGroup controls re-exported.

🐞 Bug Fixes

  • Some components were unintentionally not exporting their Component class directly, blocking JSX usage. All components now export their class.
  • Multiple fixes to DayField (#531).
  • JsonField now responds properly when switching from light to dark theme (#507).
  • Context menus properly filter out duplicated separators (#518).

:octocat: Commit Log

Assets 2
Loading