@orangelogic/design-system 2.188.0 → 2.190.0

package/library/components/color-swatch-group.js

@@ -3,7 +3,7 @@ import "../chunks/typography.IqHbnd3C.js";
 import "../chunks/lib-cortex-element.CVMmyPMC.js";
 import "../chunks/color-swatch.D6Gg5bpz.js";
 import "../chunks/component.styles.CRO4Odto.js";
-import { C as v } from "../chunks/color-swatch-group.CCgwey9f.js";
+import { C as v } from "../chunks/color-swatch-group.tnhiQ0jp.js";
 import "../chunks/transformation.8uLv6uwG.js";
 import "../chunks/custom-element.L4WJXn1j.js";
 import "../chunks/debounce.DaHuiSGU.js";

package/library/components/organisms.js

@@ -1,5 +1,5 @@
 import { C as a } from "../chunks/asset-link-format.D--xQVgR.js";
-import { C as t } from "../chunks/color-swatch-group.CCgwey9f.js";
+import { C as t } from "../chunks/color-swatch-group.tnhiQ0jp.js";
 import { default as C } from "./file-on-demand.js";
 export {
   a as CxAssetLinkFormat,

package/library/components/types.js

@@ -121,7 +121,7 @@ import { a as JZt, g as ZZt } from "../chunks/slot.j5oheLJC.js";
 import { c as Or, d as Oee, H as An, e as Ta, f as gs, a as Dee, b as rr } from "../chunks/resizable-component.styles.CAfXABBc.js";
 import { a as Fo, E as Kn, b as Yv, O as rp, T as vp, G as k8 } from "../chunks/index.Cpamj0jB.js";
 import { C as eQt } from "../chunks/index.Cpamj0jB.js";
-import { A as Bl, D as Ck, P as ZS, E as Mu, B as lt, c as yp, S as If, d as Bo, e as JF, g as Iee, T as _8, a as ZF, f as c3 } from "../chunks/transformation.8uLv6uwG.js";
+import { A as Bl, D as Ck, P as ZS, B as lt, E as Mu, c as yp, S as If, d as Bo, e as JF, g as Iee, T as _8, a as ZF, f as c3 } from "../chunks/transformation.8uLv6uwG.js";
 import { b as nQt } from "../chunks/transformation.8uLv6uwG.js";
 import { t as Tu, b as Mee, c as C8, g as S8 } from "../chunks/toast.CXEAfCvN.js";
 import { j as rQt, f as oQt, e as aQt, i as sQt, a as lQt, h as cQt, m as dQt, d as uQt, r as pQt } from "../chunks/toast.CXEAfCvN.js";
@@ -141,8 +141,8 @@ import { g as rz, F as jee } from "../chunks/form.DSsy3Fcy.js";
 import { c as xQt, f as kQt, v as _Qt, a as CQt } from "../chunks/form.DSsy3Fcy.js";
 import { d as eT, c as O8, e as Hee, i as D8, h as Vee, p as Uee, t as qee } from "../chunks/date.iWq_pkIk.js";
 import { b as TQt, f as AQt, g as EQt, a as OQt, n as DQt } from "../chunks/date.iWq_pkIk.js";
-import { F as oz, a as Wee, b as h6, H as Gee, c as u0, d as Kee, o as _u } from "../chunks/color-swatch-group.CCgwey9f.js";
-import { C as MQt, e as PQt, f as NQt } from "../chunks/color-swatch-group.CCgwey9f.js";
+import { F as oz, a as Wee, b as h6, H as Gee, c as u0, d as Kee, o as _u } from "../chunks/color-swatch-group.tnhiQ0jp.js";
+import { C as MQt, e as PQt, f as NQt } from "../chunks/color-swatch-group.tnhiQ0jp.js";
 import { F as Wd, C as g6, s as p3, a as tT } from "../chunks/folder-select.CIqVGGFl.js";
 import { b as h3, a as Aw, c as Yee, r as Ue, j as _e, w as Xee, R as Jee } from "../chunks/jsx-runtime.CTpPVMxj.js";
 import { j as nT } from "../chunks/index.CrhRU5m8.js";
@@ -143827,7 +143827,7 @@ var nUt = Object.defineProperty, iUt = Object.getOwnPropertyDescriptor, li = (n,
 };
 let Qn = class extends hn {
   constructor() {
-    super(), this.localize = new En(this), this.configsController = new Yx(this.localize), this.initialData = "", this.device = "desktop", this.devices = Iee, this.autoInit = !1, this.pageId = "", this.allowDuplicateBlocks = !1, this.enableAssetFormatControls = !1, this.enableMetrics = !1, this.defaultImageFormat = Pu, this.defaultVideoPosterFormat = Pu, this.defaultGalleryFormat = Pu, this.defaultCarouselFormat = Pu, this.defaultTimelineFormat = Pu, this.enableFontFamilyControls = !1, this.allowedFolders = [], this.defaultLanguage = "en-us", this.supportedLanguages = ["en"], this.mode = Mu.Template, this.contentBuilder = null, this.ready = !1, this.editingComponent = null, this.isGalleryConfigOpen = !1, this.hoveredComponent = void 0, this.hoveredComponentPlacement = "top", this.defaultRowGap = 0, this.containerDropdowns = [], this.containerDropdownStateMap = {}, this.distance = void 0, this.toolbar = [], this.toolbarActive = !1, this.childSelected = void 0, this.mappedSupportedLanguages = [], this.mousePosition = { x: 0, y: 0 }, this._teamSpaceRoles = [], this.canvasDocument = null, this._dsm = null, this.hasBoundUpdate = !1, this.newlyAddedComponentTimeout = null, this.initializeCustomFrame = _Nt(), this.containerDropdownObservers = [], this.nextMapHoveredBadgeState = null, this.deselectAll = this.deselectAll.bind(this), this.handleCanvasClick = this.handleCanvasClick.bind(this), this.handleRootToolbarRightClick = this.handleRootToolbarRightClick.bind(this), this.handleCanvasKeydown = this.handleCanvasKeydown.bind(this), this.handleTemplatesDataSourceChange = this.handleTemplatesDataSourceChange.bind(this), this.handleCanvasMouseMove = this.handleCanvasMouseMove.bind(this), this.handleTemplateManagerUpdated = this.handleTemplateManagerUpdated.bind(this), this.handleCanvasScroll = this.handleCanvasScroll.bind(this);
+    super(), this.localize = new En(this), this.configsController = new Yx(this.localize), this.initialData = "", this.device = "desktop", this.devices = Iee, this.autoInit = !1, this.pageId = "", this.allowDuplicateBlocks = !1, this.enableAssetFormatControls = !1, this.enableMetrics = !1, this.defaultImageFormat = Pu, this.defaultVideoPosterFormat = Pu, this.defaultGalleryFormat = Pu, this.defaultCarouselFormat = Pu, this.defaultTimelineFormat = Pu, this.enableFontFamilyControls = !1, this.allowedFolders = [], this.defaultLanguage = "en-us", this.supportedLanguages = ["en"], this.mode = Mu.Template, this.contentBuilder = null, this.ready = !1, this.editingComponent = null, this.isGalleryConfigOpen = !1, this.hoveredComponent = void 0, this.hoveredComponentPlacement = "top", this.defaultRowGap = 0, this.containerDropdowns = [], this.containerDropdownStateMap = {}, this.distance = void 0, this.toolbar = [], this.toolbarActive = !1, this.childSelected = void 0, this.mappedSupportedLanguages = [], this.mousePosition = { x: 0, y: 0 }, this._teamSpaceRoles = [], this.canvasDocument = null, this._dsm = null, this.hasBoundUpdate = !1, this.blockTypesPromise = null, this.newlyAddedComponentTimeout = null, this.initializeCustomFrame = _Nt(), this.containerDropdownObservers = [], this.nextMapHoveredBadgeState = null, this.deselectAll = this.deselectAll.bind(this), this.handleCanvasClick = this.handleCanvasClick.bind(this), this.handleRootToolbarRightClick = this.handleRootToolbarRightClick.bind(this), this.handleCanvasKeydown = this.handleCanvasKeydown.bind(this), this.handleTemplatesDataSourceChange = this.handleTemplatesDataSourceChange.bind(this), this.handleCanvasMouseMove = this.handleCanvasMouseMove.bind(this), this.handleTemplateManagerUpdated = this.handleTemplateManagerUpdated.bind(this), this.handleCanvasScroll = this.handleCanvasScroll.bind(this);
   }
   get teamSpaceRoles() {
     return this._teamSpaceRoles;
@@ -143838,6 +143838,11 @@ let Qn = class extends hn {
   get dsm() {
     return this._dsm ??= this.contentBuilder?.DataSources, this._dsm;
   }
+  prefetchBlockTypes() {
+    return this.blockTypesPromise = D3t({
+      excludeBlocksWithNoTemplates: !this.isDesigner
+    });
+  }
   /**
    * Host callbacks handed to GrapesJS blocks and config UI, each timed via
    * `measurePromise` so the promise's own settling is the completion signal.
@@ -144441,7 +144446,7 @@ let Qn = class extends hn {
     }), this.contentBuilder?.onReady(async () => {
       if (!this.contentBuilder)
         return;
-      this.contentBuilder.Canvas.getFrameEl().setAttribute("aria-label", "content-builder-frame"), this.updateFrameSize(), this._teamSpaceRoles = await this.fetchTeamSpaceRoles();
+      this.contentBuilder.Canvas.getFrameEl().setAttribute("aria-label", "content-builder-frame"), this.updateFrameSize(), this._teamSpaceRoles = await this.fetchTeamSpaceRoles(), this.prefetchBlockTypes();
     }), this.contentBuilder?.on("load", async (i) => {
       this.contentBuilder?.getEl()?.addEventListener(
         "mousedown",
@@ -144546,9 +144551,9 @@ let Qn = class extends hn {
         this.hasBoundUpdate || (this.contentBuilder?.on("update", () => {
           this.emit("cx-change");
         }), this.hasBoundUpdate = !0);
-        const { component: o, index: a, parentComponent: s } = i ?? {}, l = await D3t({
-          excludeBlocksWithNoTemplates: !this.isDesigner
-        }), c = this.contentBuilder?.getWrapper(), d = c?.findType(lt.Column) ?? [], u = d.find((k) => k.parent() === c) ?? d[0];
+        const { component: o, index: a, parentComponent: s } = i ?? {};
+        this.blockTypesPromise ??= this.prefetchBlockTypes();
+        const l = await this.blockTypesPromise, c = this.contentBuilder?.getWrapper(), d = c?.findType(lt.Column) ?? [], u = d.find((k) => k.parent() === c) ?? d[0];
         if (!u) {
           this.blockPicker.limitedBlocks = vR(lt.Column), this.blockPicker.show(), r();
           return;

package/library/package.json

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

package/library/packages/hybrid/table-core/src/table/styles/table-frozen.styles.d.ts

@@ -1,8 +1,8 @@
 /**
- * Sticky can't pin frozen cells here — every wrapper up to the real horizontal scroller (the
- * OverlayScrollbars viewport on `.tabulator`) is `width: max-content` and never scrolls — so
- * `syncFrozenOffset` mirrors the viewport's scrollLeft into these vars instead. If horizontal
- * scrolling ever moves back onto `.tabulator-tableholder`, delete this sheet.
+ * Frozen columns are pinned by `position: sticky` written from `FrozenColumns.layoutElement`, and
+ * their resize handles by matching insets from `ResizeColumns.reinitializeColumn`. Both resolve
+ * against `.tabulator-tableholder`, the table's single scroll container — keep it that way. This
+ * sheet only owns what sticky cannot express: the freeze divider and the stacking order around it.
  */
 declare const _default: import('lit').CSSResult;
 export default _default;

package/library/packages/hybrid/table-core/src/table/styles/table-overlay-scrollbar.styles.d.ts

@@ -1,9 +1,12 @@
 /**
- * use-overlay-scrollbar: table-scoped OverlayScrollbars rules — structure of
- * the generated horizontal viewport, positioning of the scrollbars slotted
- * into `.table` (see initVerticalScrollbar), and the mapping of the `:host`
- * scrollbar css vars (declared below) onto the OverlayScrollbars theme so
- * tables with and without use-overlay-scrollbar look the same.
+ * use-overlay-scrollbar: table-scoped OverlayScrollbars rules — positioning of
+ * the scrollbars slotted into `.table` (see initScrollbars) and the mapping of
+ * the `:host` scrollbar css vars (declared below) onto the OverlayScrollbars
+ * theme so tables with and without use-overlay-scrollbar look the same.
+ *
+ * There are deliberately no rules for a generated viewport element: the single
+ * instance runs in `viewportIsTarget` mode so `.tabulator-tableholder` stays
+ * the scroll container that frozen columns pin against.
  */
 declare const _default: import('lit').CSSResult;
 export default _default;

package/library/packages/hybrid/table-core/src/table/table.d.ts

@@ -102,10 +102,7 @@ export default class CxTable extends CortexElement {
         'cx-table-toolbar': typeof CxTableToolbar;
         'cx-tooltip': typeof CxTooltip;
     };
-    private verticalOsInstance;
-    private horizontalOsInstance;
-    /** Removes the horizontal scrollbar's scroll listener (see syncFrozenOffset). */
-    private frozenScrollOff;
+    private osInstance;
     private resizeObserver;
     private overflowObserver;
     private readonly ajaxFacetsController;
@@ -926,14 +923,7 @@ export default class CxTable extends CortexElement {
     private repositionValidationTooltipNow;
     private handleValidationMouseOut;
     disconnectedCallback(): void;
-    private initVerticalScrollbar;
-    private initHorizontalScrollbar;
-    /**
-     * Mirrors the horizontal scroller's offset into `--frozen-offset-start/end` so
-     * `table-frozen.styles.ts` can pin frozen columns. Deliberately not debounced: the offset must
-     * land in the same frame as the scroll, and it is only two custom-property writes.
-     */
-    private syncFrozenOffset;
+    private initScrollbars;
     private readonly checkHorizontalOverflow;
     private initOverflowObserver;
     private registerEventListeners;

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

@@ -62,6 +62,7 @@ export default class RowManager extends CoreFeature implements IRowManager {
     getElement(): HTMLElement;
     getTableElement(): HTMLElement;
     initialize(): void;
+    private initializeWheelWatcher;
     /**
      * IRow Manipulation
      */

package/library/packages/hybrid/table-core/src/tabulator-tables/modules/ResizeColumns/ResizeColumns.d.ts

@@ -28,6 +28,8 @@ export default class ResizeColumns extends Module {
      * walks `columns` because `columnsByIndex` is still empty when `column-rendered` creates handles.
      */
     private isPinnedEnd;
+    private pinHandle;
+    private repinFrozenHandles;
     /**
      * The in-flow handle goes right after the element it resizes — except for an end-pinned column,
      * whose right edge is the table edge: its handle goes before the element, onto the freeze
@@ -35,9 +37,9 @@ export default class ResizeColumns extends Module {
      */
     private attachHandle;
     /**
-     * Re-inserts handles next to the element they resize. Upstream wrote `left`/`right` insets here
-     * for frozen columns, which added to the flow position and pushed handles a column width off;
-     * frozen handles travel via `table-frozen.styles.ts` instead (which also owns their z-index).
+     * Re-inserts handles next to the element they resize and re-pins the frozen ones. Runs off
+     * `column-width`, which `FrozenColumns` subscribes to first (in `initialize()`, whereas this
+     * module subscribes lazily from `column-rendered`), so the margins read here are already current.
      */
     reinitializeColumn(column: Column): void;
     initializeColumn(type: string, component: any, column: Column, element: HTMLElement): void;

package/library/packages/organisms/src/content-builder/content-builder.d.ts

@@ -226,6 +226,14 @@ export default class CxContentBuilder extends CortexElement {
     private _dsm;
     private get dsm();
     private hasBoundUpdate;
+    /**
+     * In-flight/resolved block-types fetch, kept as a promise (not the awaited value) so the
+     * `component:open-picker` handler can share it even if it fires before the prefetch below
+     * settles. Prefetched once `isDesigner` is known (right after team-space roles resolve) so
+     * the block picker dialog shows immediately instead of waiting on the API on first open.
+     */
+    private blockTypesPromise;
+    private prefetchBlockTypes;
     private newlyAddedComponentTimeout;
     private readonly initializeCustomFrame;
     private containerDropdownObservers;

package/package.json

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