@orangelogic/design-system 3.58.0 → 3.63.0

package/library/package.json

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

package/library/packages/atoms/src/components/step/step.d.ts

@@ -66,6 +66,10 @@ export default class CxStep extends CortexElement {
      * This is the one that draws the circle
      */
     color: string;
+    /**
+     * Overrides the active label color, used as-is (no contrast adjustment). Defaults to `color`.
+     */
+    textColor: string;
     /**
      * Draws the step with a circle indicator instead of an arrow.
      */

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/library/packages/organisms/src/content-builder/content-builder.utils.d.ts

@@ -11,6 +11,11 @@ type FontPickerStoredValues = {
     style: string;
     weight: string;
 };
+/**
+ * Validates an "Open link" target: an absolute or intranet URL, or a relative
+ * URL resolved against the current site at click time (see `openLink`).
+ */
+export declare function isValidClickLink(clickLink: string): boolean;
 export declare function getTemplateClass(templateId: string): string;
 export declare function getContentConfigs(traits: PropertyConfig[], adHocProperties: string[]): string[];
 export declare function getLimitedBlocks(blockType: BlockType): BlockType[];

package/library/packages/organisms/src/space-selector/space-selector.d.ts

@@ -87,7 +87,10 @@ export default class CxSpaceSelector extends CortexElement {
     triggerIcon: string;
     /** Accessible name of the trigger, used when it renders as an icon button. */
     triggerLabel: string;
-    /** `button` shows the space name, `icon-button` is the compact header variant. */
+    /**
+     * `button` shows the space name, `icon-button` is the compact header variant, sized `small` like
+     * the other header icon buttons.
+     */
     triggerVariant: 'button' | 'icon-button';
     /** Whether the space list is currently being fetched. */
     private loading;

package/library/packages/tools/src/tiptap/extensions/subscript/index.d.ts

@@ -0,0 +1,2 @@
+declare const Subscript: import('@tiptap/core').Mark<import('@tiptap/extension-subscript').SubscriptExtensionOptions, any>;
+export default Subscript;

package/library/packages/tools/src/tiptap/extensions/superscript/index.d.ts

@@ -0,0 +1,2 @@
+declare const Superscript: import('@tiptap/core').Mark<import('@tiptap/extension-superscript').SuperscriptExtensionOptions, any>;
+export default Superscript;

package/library/packages/types/src/stepper-wizard.d.ts

@@ -7,4 +7,5 @@ export type StepData = {
     name: string;
     readonly: boolean;
     state: 'Done' | 'Active' | 'None' | 'Disabled';
+    textColor?: string;
 };

package/library/react-web-component.d.ts

@@ -29,7 +29,7 @@
             export type CxMentionsAutocompleteItem = { "id": string; "label": string; "name": string; "suffixContent": string; "suffixIcon": string; "suffixTooltip": string; "suffixType": "badge"; "title": string; "type": string; };
             export type CxMultiSelectColumnData = { "dividerColor": string; "id": string; "items": { "disabled": boolean; "group": string; "id": string; "index": string; "metadata": dictionary; "text": string; "tooltip": string; "type": string; }[]; "sort": boolean; "title": string; };
             export type CxShareOptionListShareOptionListItem = { "disabled": boolean; "icon": string; "id": string; "name": string; "tooltip": string; };
-            export type CxStepperWizardStepData = { "color": string; "description": string; "icon": string; "iconVariant": "outlined" | "filled" | "fa"; "id": string; "name": string; "readonly": boolean; "state": "Done" | "Active" | "None" | "Disabled"; };
+            export type CxStepperWizardStepData = { "color": string; "description": string; "icon": string; "iconVariant": "outlined" | "filled" | "fa"; "id": string; "name": string; "readonly": boolean; "state": "Done" | "Active" | "None" | "Disabled"; "textColor": string; };
             export type CxAssetLinkFormatAsset = { "allowATSLink": boolean; "docSubType": string; "docType": "Album" | "Audio" | "Audio segment" | "Image" | "Multimedia" | "ProjectDocument" | "Story" | "Video" | "Widget"; "extension": string; "height": string; "id": string; "identifier": string; "imageUrl": string; "name": string; "scrubUrl": string; "size": string; "width": string; };
             export type CxAssetLinkFormatCropMode = { "auto": boolean; "disabledSize": boolean; "label": string; "value": string; };
             export type CxAssetLinkFormatFocusMode = { "auto": boolean; "label": string; "value": string; };
@@ -4772,6 +4772,10 @@
           * This is the one that draws the circle
         */
         color?: string;
+        /**
+          * Overrides the active label color, used as-is (no contrast adjustment). Defaults to `color`.
+        */
+        textColor?: string;
         /**
           * Draws the step with a circle indicator instead of an arrow.
         */
@@ -10995,7 +10999,7 @@
         */
         triggerLabel?: string;
         /**
-          * `button` shows the space name, `icon-button` is the compact header variant.
+          * `button` shows the space name, `icon-button` is the compact header variant, sized `small` like the other header icon buttons.
         */
         triggerVariant?: "button" | "icon-button";
         /**

package/package.json

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