@xh/hoist 75.0.0-SNAPSHOT.1753726213836 → 75.0.0-SNAPSHOT.1753731626581

package/CHANGELOG.md

@@ -55,6 +55,27 @@
 * Removed deprecated `FetchService.setDefaultTimeout`
 * Removed deprecated `IdentityService.logoutAsync`
 
+### ✨ Styles
+
+* Upgraded the version of Hoist's default Inter UI font to a new major version, now v4.1. Note
+  that this brings slight differences to the font's appearance, including tweaks to internal
+  spacing and letterforms for tabular numbers. The name of the font face has also changed, from
+  `Inter Var` to `InterVariable`. The default value of the `--xh-font-family` CSS variable has been
+  updated to match, making this change transparent for most applications.
+
+### 📚 Libraries
+
+* @auth0/auth0-spa-js `2.1 → 2.3`
+* @azure/msal-browser `4.12 → 4.16`
+* filesize `6.4 → 11.0`
+* inter-ui `3.19 → 4.1`
+* mobx-react-lite `4.0 → 4.1`
+* qs `6.13 → 6.14`
+* react-markdown `9.0 → 10.1`
+* regenerator-runtime `0.13 → 0.14`
+* semver `7.6 → 7.7`
+* short-unique-id `5.2 → 5.3`
+* ua-parser-js `1.0 → 2.0`
 
 ## v74.1.2 - 2025-07-03
 

package/appcontainer/UserAgentModel.ts

@@ -5,7 +5,7 @@
  * Copyright © 2025 Extremely Heavy Industries Inc.
  */
 import {HoistModel} from '@xh/hoist/core';
-import parser from 'ua-parser-js';
+import {UAParser} from 'ua-parser-js';
 
 /**
  * Support for user agent parsing.
@@ -32,6 +32,6 @@ export class UserAgentModel extends HoistModel {
     // Implementation
     //---------------------
     private get uaParser() {
-        return (this._uaParser = this._uaParser ?? new parser());
+        return (this._uaParser = this._uaParser ?? new UAParser());
     }
 }

package/build/types/kit/swiper/index.d.ts

@@ -15,18 +15,18 @@ export declare const swiper: import("@xh/hoist/core").ElementFactory<import("rea
     onHashChange?: (swiper: import("swiper/react").SwiperClass) => void;
     onHashSet?: (swiper: import("swiper/react").SwiperClass) => void;
     onKeyPress?: (swiper: import("swiper/react").SwiperClass, keyCode: string) => void;
-    onScroll?: (swiper: import("swiper/react").SwiperClass, event: WheelEvent) => void;
     onNavigationHide?: (swiper: import("swiper/react").SwiperClass) => void;
     onNavigationShow?: (swiper: import("swiper/react").SwiperClass) => void;
     onNavigationPrev?: (swiper: import("swiper/react").SwiperClass) => void;
     onNavigationNext?: (swiper: import("swiper/react").SwiperClass) => void;
+    onScroll?: (swiper: import("swiper/react").SwiperClass, event: WheelEvent) => void;
+    onScrollbarDragStart?: (swiper: import("swiper/react").SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
+    onScrollbarDragMove?: (swiper: import("swiper/react").SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
+    onScrollbarDragEnd?: (swiper: import("swiper/react").SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
     onPaginationRender?: (swiper: import("swiper/react").SwiperClass, paginationEl: HTMLElement) => void;
     onPaginationUpdate?: (swiper: import("swiper/react").SwiperClass, paginationEl: HTMLElement) => void;
     onPaginationHide?: (swiper: import("swiper/react").SwiperClass) => void;
     onPaginationShow?: (swiper: import("swiper/react").SwiperClass) => void;
-    onScrollbarDragStart?: (swiper: import("swiper/react").SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
-    onScrollbarDragMove?: (swiper: import("swiper/react").SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
-    onScrollbarDragEnd?: (swiper: import("swiper/react").SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
     onZoomChange?: (swiper: import("swiper/react").SwiperClass, scale: number, imageEl: HTMLElement, slideEl: HTMLElement) => void;
     onInit?: (swiper: import("swiper/react").SwiperClass) => any;
     onBeforeDestroy?: (swiper: import("swiper/react").SwiperClass) => void;

package/cmp/error/ErrorMessage.scss

@@ -15,7 +15,7 @@
     border: 1px solid var(--xh-intent-danger);
     max-width: 50%;
     text-align: center;
-    word-break: break-word;
+    overflow-wrap: break-word;
 
     & > * {
       margin: 0 0 var(--xh-pad-px);

package/cmp/layout/TileFrame.scss

@@ -5,10 +5,7 @@
  * Copyright © 2025 Extremely Heavy Industries Inc.
  */
 .xh-tile-frame {
-  // Scrollbar will be shown above the content in order to not take up width.
-  // Consider increasing the spacing for TileFrames that are expected to scroll.
-  overflow-y: overlay !important;
-  overflow-x: overlay !important;
+  overflow: auto !important;
 
   &__tile {
     position: absolute !important;

package/desktop/appcontainer/Toast.scss

@@ -30,7 +30,7 @@
     }
 
     .bp5-toast-message {
-      word-break: break-word;
+      overflow-wrap: break-word;
     }
 
     // High level of specificity here required to override built-in BP styles

package/desktop/cmp/filechooser/FileChooserModel.ts

@@ -11,7 +11,7 @@ import '@xh/hoist/desktop/register';
 import {Icon} from '@xh/hoist/icon';
 import {action, makeObservable, observable} from '@xh/hoist/mobx';
 import {isEmpty} from 'codemirror/src/util/misc';
-import filesize from 'filesize';
+import {filesize} from 'filesize';
 import {find, uniqBy, without} from 'lodash';
 
 export class FileChooserModel extends HoistModel {

package/kit/blueprint/styles.scss

@@ -51,12 +51,12 @@
     // See https://github.com/xh/hoist-react/issues/862 for why this is necessary. Note need for
     // datepicker workaround below - indicates that this might be a problematic solution in general
     // to the original issue, but after a few years that's been the only reported issue, so...
-    word-break: break-word;
+    overflow-wrap: break-word;
 
     // Ensure that date numbers in the datepicker do not wrap if the datePicker portal is rendered
     // inside a dialogBody - e.g. `dateEditor` in a grid in a dialog. See comment on #862.
     .bp5-datepicker {
-      word-break: normal;
+      overflow-wrap: normal;
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xh/hoist",
-  "version": "75.0.0-SNAPSHOT.1753726213836",
+  "version": "75.0.0-SNAPSHOT.1753731626581",
   "description": "Hoist add-on for building and deploying React Applications.",
   "repository": "github:xh/hoist-react",
   "homepage": "https://xh.io",
@@ -28,8 +28,8 @@
     ]
   },
   "dependencies": {
-    "@auth0/auth0-spa-js": "~2.1.3",
-    "@azure/msal-browser": "~4.12.0",
+    "@auth0/auth0-spa-js": "~2.3.0",
+    "@azure/msal-browser": "~4.16.0",
     "@blueprintjs/core": "^5.10.5",
     "@blueprintjs/datetime": "^5.3.7",
     "@blueprintjs/datetime2": "^2.3.7",
@@ -39,52 +39,52 @@
     "@fortawesome/pro-regular-svg-icons": "^6.6.0",
     "@fortawesome/pro-solid-svg-icons": "^6.6.0",
     "@fortawesome/pro-thin-svg-icons": "^6.6.0",
-    "@fortawesome/react-fontawesome": "^0.2.2",
+    "@fortawesome/react-fontawesome": "^0.2.3",
     "@onsenui/fastclick": "~1.1.1",
     "@popperjs/core": "~2.11.0",
     "@seznam/compose-react-refs": "~1.0.5",
     "classnames": "~2.5.1",
     "clipboard-copy": "~4.0.1",
     "codemirror": "~5.65.0",
-    "core-js": "^3.0",
+    "core-js": "3.x",
     "debounce-promise": "~3.1.0",
     "dompurify": "~3.2.3",
     "downloadjs": "~1.4.7",
     "fast-deep-equal": "~3.1.1",
-    "filesize": "~6.4.0",
+    "filesize": "~11.0.2",
     "golden-layout": "~1.5.9",
     "http-status-codes": "~2.3.0",
-    "inter-ui": "~3.19.3",
+    "inter-ui": "~4.1.1",
     "jwt-decode": "~4.0.0",
     "lodash": "~4.17.21",
     "lodash-inflection": "~1.5.0",
     "mobx": "~6.13.2",
-    "mobx-react-lite": "~4.0.7",
+    "mobx-react-lite": "~4.1.0",
     "moment": "~2.30.1",
     "numbro": "~2.5.0",
     "onsenui": "~2.12.8",
-    "qs": "~6.13.0",
+    "qs": "~6.14.0",
     "react-beautiful-dnd": "~13.1.0",
     "react-dates": "~21.8.0",
     "react-dropzone": "~10.2.2",
     "react-grid-layout": "1.5.0",
-    "react-markdown": "~9.0.1",
+    "react-markdown": "~10.1.0",
     "react-onsenui": "~1.13.2",
     "react-popper": "~2.3.0",
     "react-select": "~4.3.1",
     "react-transition-group": "~4.4.2",
     "react-windowed-select": "~3.1.2",
-    "regenerator-runtime": "~0.13.11",
+    "regenerator-runtime": "~0.14.1",
     "remark-breaks": "~4.0.0",
     "remark-gfm": "~4.0.0",
     "resize-observer-polyfill": "~1.5.1",
     "router5": "~7.0.2",
     "router5-plugin-browser": "~7.0.2",
-    "semver": "~7.6.0",
-    "short-unique-id": "~5.2.0",
+    "semver": "~7.7.2",
+    "short-unique-id": "~5.3.2",
     "store2": "~2.14.3",
     "swiper": "^11.2.0",
-    "ua-parser-js": "~1.0.2"
+    "ua-parser-js": "~2.0.4"
   },
   "peerDependencies": {
     "react": "~18.2.0",
@@ -102,13 +102,13 @@
     "eslint-config-prettier": "10.x",
     "eslint-plugin-tsdoc": "0.x",
     "husky": "9.x",
-    "lint-staged": "15.x",
+    "lint-staged": "16.x",
     "postcss": "8.x",
     "prettier": "3.x",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
     "stylelint": "16.x",
-    "stylelint-config-standard-scss": "14.x",
+    "stylelint-config-standard-scss": "15.x",
     "type-fest": "4.x",
     "typescript": "~5.8.3"
   },

package/styles/XH.scss

@@ -9,7 +9,7 @@
 @use 'helpers';
 @use '~inter-ui/variable' with (
   $inter-font-display: block,
-  $inter-font-path: '~inter-ui/Inter (web)'
+  $inter-font-path: '~inter-ui/variable'
 );
 
 @include variable.all;

package/styles/vars.scss

@@ -374,7 +374,7 @@ body {
   //------------------------
   // Fonts
   //------------------------
-  --xh-font-family: var(--font-family, #{("Inter Var", system-ui, sans-serif)});
+  --xh-font-family: var(--font-family, #{("InterVariable", system-ui, sans-serif)});
   --xh-font-family-headings: var(--font-family-headings, var(--xh-font-family));
   --xh-font-family-mono: var(--font-family-mono, #{(Monaco, Consolas, monospace)});