@orangelogic/design-system 4.43.0 → 4.44.0

package/library/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@orangelogic/design-system",
   "type": "module",
-  "version": "4.43.0",
+  "version": "4.44.0",
   "license": "UNLICENSED",
   "types": "library/types.d.ts",
   "scripts": {

package/library/packages/hybrid/table-core/src/tabulator-tables/core/tools/Alert.d.ts

@@ -4,10 +4,14 @@ export default class Alert extends CoreFeature implements IAlert {
     element: HTMLElement;
     msgElement: HTMLElement;
     type: string | null;
+    private loadingWidthObserver;
+    private loadingWidthCleanupSubscribed;
     constructor(table: ITabulator);
     _createAlertElement(): HTMLElement;
     _createMsgElement(): HTMLElement;
     _typeClass(): string;
     alert(content: string | HTMLElement | (() => string | HTMLElement) | undefined, type?: string): void;
+    private observeLoadingWidth;
+    private disconnectLoadingWidthObserver;
     clear(): void;
 }

package/library/packages/organisms/src/capacity-planner/components/capacity-week-bar/capacity-week-bar.d.ts

@@ -42,7 +42,7 @@ export interface CapacityBand {
  * @cssproperty [--cx-capacity-bar-height=22px] - Height of the bar.
  * @cssproperty [--cx-capacity-bar-radius=6px] - Corner radius of the bar.
  * @cssproperty --cx-capacity-track-bg - Background of the track behind the bands.
- * @cssproperty [--cx-capacity-zero-handle-width=10px] - Width of the grab handle shown for a 0-hour band.
+ * @cssproperty [--cx-capacity-zero-handle-width=10px] - Width of the grab handle shown for a 0-hour band. Must be a px length: the label layout reads it in px.
  *
  * @event {{ barWidth: number, categoryId: string, pointerEvent: PointerEvent }} cx-capacity-week-bar-band-pointer-down - Fired when a resizable band is pressed.
  * @event {{ categoryId: string, deltaHours: number }} cx-capacity-week-bar-band-step - Fired when a band is stepped via the keyboard.
@@ -76,11 +76,22 @@ export default class CxCapacityWeekBar extends CortexElement {
      * 0-hours category keeps its handle and stays grabbable to grow back.
      */
     collapseZeroBands: boolean;
-    /** Px width threshold above which the full "{h}h · {name}" label is shown. */
+    /**
+     * Minimum px width of the room a band has for the full "{h}h · {name}" label
+     * (the band less any 0-hour handles over it). The label is shown only when it
+     * also fits its measured text.
+     */
     fullLabelThreshold: number;
-    /** Px width threshold above which the number-only label is shown. */
+    /**
+     * Minimum px width of the room a band has for the number-only label. The label
+     * is shown only when it also fits its measured text.
+     */
     shortLabelThreshold: number;
     private readonly barEl;
+    /** Hidden full-label span whose computed font is what the full label is measured in. */
+    private readonly fullMeasureEl;
+    /** Hidden number-only-label span whose computed font is what that label is measured in. */
+    private readonly shortMeasureEl;
     private summary;
     /** Hours not held by an editable band: capacity − Σ non-derived hours (≥ 0). */
     private spareHours;
@@ -90,13 +101,22 @@ export default class CxCapacityWeekBar extends CortexElement {
     private geometries;
     /** Actual rendered width of the bar element, updated by ResizeObserver. */
     renderedBarWidth: number;
+    /**
+     * Bumped each time a web font finishes loading, so label widths measured in
+     * the fallback font are measured again. Not `private` (like `renderedBarWidth`):
+     * `willUpdate` reads it through `changed.has`, which only accepts public keys.
+     */
+    fontEpoch: number;
     private barResizeObserver;
+    constructor();
     connectedCallback(): void;
     disconnectedCallback(): void;
     runFirstUpdated(): void;
     willUpdate(changed: PropertyValues<this>): void;
     /** Measure the live bar width; falls back to the cached prop if unmeasurable. */
     private measuredBarWidth;
+    /** A web font finished loading: drop the cached widths and fit the labels again. */
+    private handleFontsLoaded;
     private handleBandPointerDown;
     private handleBandKeyDown;
     private bandValueMax;
@@ -106,10 +126,13 @@ export default class CxCapacityWeekBar extends CortexElement {
      * `render` so the tip shows/hides in exact sync with the inline label (and so
      * the tip text tracks a band being resized under a captured pointer).
      *
-     * Every band is on the same fixed scale, so the label thresholds see the
-     * band's real width. A real 0-hour band on a resizable bar is `zero` (0px,
-     * grabbed through its handle); in `collapseZeroBands` mode a 0-hour band is
-     * `collapsed` instead.
+     * Every band is on the same fixed scale, so the label fit sees the band's
+     * real width. A real 0-hour band on a resizable bar is `zero` (0px, grabbed
+     * through its handle); in `collapseZeroBands` mode a 0-hour band is
+     * `collapsed` instead. Only the width and zero flags are set here: the handle
+     * placement comes from `placeZeroHandles`, the label insets from
+     * `insetLabelsPastHandles` and the labels from `applyLabelFit`, which run
+     * after it, in that order.
      */
     private bandGeometry;
     /**
@@ -118,9 +141,38 @@ export default class CxCapacityWeekBar extends CortexElement {
      * spot, so each run of them gets increasing indices and the handles are laid
      * side by side. A run that starts at (or past) the right edge of the bar is
      * drawn leftwards instead, so the edge does not clip it. Bands that take no
-     * width (other 0-hour bands) do not break a run.
+     * width (other 0-hour bands) do not break a run. Returns the runs, with where
+     * each starts along a bar of `barPx`, for `insetLabelsPastHandles`.
      */
     private placeZeroHandles;
+    /**
+     * Write `labelInsetStartPx` / `labelInsetEndPx` into `geometries`: how far the
+     * handles reach into each band from its left and right end, so its label can
+     * be padded past them. A run's handles cover `[startPx, startPx + length *
+     * handleWidth]`, or `[startPx - length * handleWidth, startPx]` for a run
+     * drawn leftwards at the right edge, clipped to the bar (a run clipped away
+     * entirely, such as an `atEnd` run past the bar in an over-capacity week,
+     * covers nothing). A run wider than the band beside it also reaches the bands
+     * after it. Must run after `placeZeroHandles`.
+     */
+    private insetLabelsPastHandles;
+    /**
+     * Decide which label each band shows, writing `showFull` / `showShort` into
+     * `geometries`. A label shows only when the room the band has (its width less
+     * the handles over it) both reaches the label's threshold and fits the
+     * label's measured text. Where the text cannot be measured (the hidden
+     * measuring spans are not rendered yet, or there is no canvas), only the
+     * thresholds apply. Must run after `insetLabelsPastHandles`.
+     */
+    private applyLabelFit;
+    /** Width (px) of a 0-hour handle, read from the host's CSS custom property. */
+    private zeroHandleWidth;
+    /**
+     * Font and horizontal padding a hidden measuring span resolves to (it carries
+     * the label classes and no inset, so these are exactly a label's);
+     * `undefined` before it renders.
+     */
+    private labelMetrics;
     private renderBand;
     render(): TemplateResult;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@orangelogic/design-system",
   "type": "module",
-  "version": "4.43.0",
+  "version": "4.44.0",
   "license": "UNLICENSED",
   "types": "library/types.d.ts",
   "scripts": {