@xh/hoist 67.0.0-SNAPSHOT.1725050021281 → 67.0.0-SNAPSHOT.1725050936701

package/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## 67.0.0-SNAPSHOT - unreleased
 
+### 💥 Breaking Changes (upgrade difficulty: 🟢 LOW - Hoist Core update only)
+
+* Requires `hoist-core >= 21.0`.
+
 ### 🎁 New Features
 
 * Added support for Correlation IDs across fetch requests and error / activity tracking:
@@ -15,31 +19,28 @@
           new `FetchOptions.track` API (see below).
     * If set on a fetch request, Correlation IDs are passed through to downstream error reporting
       and are available for review in the Admin Console.
-* New `FetchOptions.track` - specify `TrackOptions` or message `string` to track a request via
-  Hoist activity tracking. The request's Correlation ID and LoadSpec will be included automatically.
-* New global interceptors on `FetchService`. See `FetchService.addInterceptor()`.
-* New property `FetchOptions.asJson` to instruct `FetchService` to decode an HTTP response as JSON.
+* Added `FetchOptions.track` as streamlined syntax to track a request via Hoist activity tracking.
+  Prefer this option (vs. a chained `.track()` call) to relay the request's `correlationId` and
+  `loadSpec` automatically.
+* Added `FetchOptions.asJson` to instruct `FetchService` to decode an HTTP response as JSON.
   Note that `FetchService` methods suffixed with `Json` will set this property automatically.
+* Added global interceptors on `FetchService`. See `FetchService.addInterceptor()`.
 * `GridModel` will now accept `contextMenu: false` to omit context menus.
-* New bindable property `AppContainerModel.intializingLoadMaskMessage` to allow apps to customize
-  the loading mask message shown during app initialization.
+* Added bindable `AppContainerModel.intializingLoadMaskMessage` to allow apps to customize the
+  load mask message shown during app initialization.
 * Enhanced `select` component with new `emptyValue` prop, allowing for a custom value to be returned
-  when the control is empty (vs default of `null`). Expected usage is `[]` when `enableMulti:true`.
-* New `GroupingChooserModel.setDimensions()` API, to support updating available dimensions on an
+  when the control is empty (vs `null`). Expected usage is `[]` when `enableMulti:true`.
+* Added `GroupingChooserModel.setDimensions()` API, to support updating available dimensions on an
   already constructed `GroupingChooserModel`.
 
 ### 🐞 Bug Fixes
 
-* Fixed bug where a role with a dot in its name could not be deleted.
-* Fixed `SelectEditor` to ensure new value is flushed before editing stops.
-
-### 💥 Breaking Changes
+* Fixed Admin Console bug where a role with a dot in its name could not be deleted.
+* Fixed inline `SelectEditor` to ensure new value is flushed before grid editing stops.
 
-* Requires `hoist-core >= 21.0`.
-
-### ⚙️ Technical
+### ✨ Styles
 
-* Remove context menus from column choosers.
+* Added CSS variables to support customization of `Badge` component styling.
 
 ### 📚 Libraries
 

package/cmp/badge/Badge.scss

@@ -10,16 +10,16 @@
   justify-content: center;
   align-items: center;
   align-self: center;
-  font-size: 0.75em;
+  font-size: var(--xh-badge-font-size);
   font-weight: bold;
-  border-radius: 4px;
+  border-radius: var(--xh-badge-border-radius);
   margin-left: 5px;
-  padding: 0 4px;
-  height: 1.6em;
+  padding: var(--xh-badge-padding);
+  height: var(--xh-badge-height);
   width: fit-content;
-  min-width: 15px;
-  background-color: var(--xh-blue-gray);
-  color: white;
+  min-width: var(--xh-badge-min-width);
+  background-color: var(--xh-badge-bg);
+  color: var(--xh-badge-text-color);
 
   &--compact {
     font-size: 0.5em;

package/package.json

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

package/styles/vars.scss

@@ -254,6 +254,16 @@ body {
     --xh-bg-highlight: var(--bg-highlight, hsl(200, 50%, 27%));
   }
 
+  //-----------------------------------------
+  // Badges
+  //-----------------------------------------
+  --xh-badge-bg: var(--badge-bg, var(--xh-blue-gray));
+  --xh-badge-border-radius: var(--badge-border-radius, var(--xh-border-radius-px));
+  --xh-badge-font-size: var(--badge-font-size, 0.75em);
+  --xh-badge-height: var(--badge-height, 1.6em);
+  --xh-badge-min-width: var(--badge-min-width, 15px);
+  --xh-badge-padding: var(--badge-padding, #{0 4px});
+  --xh-badge-text-color: var(--badge-text-color, white);
 
   //------------------------
   // Borders