@orangelogic/design-system 2.179.0 → 2.181.0

package/library/components/video.js

@@ -1,7 +1,7 @@
 import { _ as kd, a as Sa, b as Be, c as Je } from "../chunks/inheritsLoose.BuSn_CvZ.js";
 import { c as ps, a as Bn } from "../chunks/_commonjsHelpers.DQNKXVTB.js";
 import { r as Sb } from "../chunks/___vite-browser-external_commonjs-proxy.C2tf3HsQ.js";
-import { C as Cb } from "../chunks/image.mG-NXUWX.js";
+import { C as Cb } from "../chunks/image.CCDdKXjt.js";
 import Mb from "./resize-observer.js";
 import { r as Db, R as Pb, a as Rp, b as Lb } from "../chunks/resizable-component.styles.CAfXABBc.js";
 import { c as Rb } from "../chunks/component.styles.CRO4Odto.js";

package/library/package.json

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

package/library/packages/events/src/cx-space-create.d.ts

@@ -0,0 +1,6 @@
+export type CxSpaceCreateEvent = CustomEvent<Record<PropertyKey, unknown>>;
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'cx-space-create': CxSpaceCreateEvent;
+    }
+}

package/library/packages/events/src/cx-space-delete.d.ts

@@ -0,0 +1,6 @@
+export type CxSpaceDeleteEvent = CustomEvent<Record<PropertyKey, unknown>>;
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'cx-space-delete': CxSpaceDeleteEvent;
+    }
+}

package/library/packages/events/src/cx-space-select.d.ts

@@ -0,0 +1,9 @@
+export type CxSpaceSelectEvent = CustomEvent<{
+    module: string;
+    url: string;
+}>;
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'cx-space-select': CxSpaceSelectEvent;
+    }
+}

package/library/packages/events/src/cx-space-settings.d.ts

@@ -0,0 +1,6 @@
+export type CxSpaceSettingsEvent = CustomEvent<Record<PropertyKey, unknown>>;
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'cx-space-settings': CxSpaceSettingsEvent;
+    }
+}

package/library/packages/events/src/events.d.ts

@@ -191,6 +191,10 @@ export * from './cx-shadow-input-group-change';
 export * from './cx-share-option-list-item-selected';
 export * from './cx-show';
 export * from './cx-slide-change';
+export * from './cx-space-create';
+export * from './cx-space-delete';
+export * from './cx-space-select';
+export * from './cx-space-settings';
 export * from './cx-special-characters-insert';
 export * from './cx-start';
 export * from './cx-swatch-add';

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

@@ -34,6 +34,8 @@ import { default as CxTableSavedSearchDropdown } from './table-saved-search-drop
  *
  * @cssproperty [--dropdown-filter-icon-color=currentColor] - Color of the icon in a dropdown filter trigger.
  * @cssproperty [--dropdown-filter-icon-size=var(--cx-font-size-large)] - Size of the icon in a dropdown filter trigger. Matches the 20px icon in the design; without it the icon inherits 16px from cx-button.
+ * @cssproperty [--search-border-width-focus=0] - Thickness added around the `can-search` search box while it has focus. Drawn outside the box so the input never resizes. Applies to that input only.
+ * @cssproperty [--search-border-color-focus=var(--cx-color-primary-600)] - Border color of the `can-search` search box while it has focus. Applies to that input only.
  */
 export default class CxTableToolbar extends CortexElement {
     static readonly styles: CSSResultGroup;

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

@@ -65,6 +65,8 @@ import { CxTableColumnEditor, CxTableFooter, CxTableHeaderMenu, CxTableRowAction
  * @cssproperty [--table-active-cell-border-color=var(--cx-color-neutral-200)] - The border color of the active/hover range overlay cell outline.
  * @cssproperty [--table-selected-cell-border-width=1px] - The border width of the active selected cell.
  * @cssproperty [--table-selected-cell-border-style=solid] - The border style of the active selected cell.
+ * @cssproperty [--search-border-width-focus=0] - Thickness added around the `can-search` search box while it has focus. Drawn outside the box so the input never resizes. Applies to that input only.
+ * @cssproperty [--search-border-color-focus=var(--cx-color-primary-600)] - Border color of the `can-search` search box while it has focus. Applies to that input only.
  * @slot add-action - Passed through to `cx-table-toolbar`'s `add-action` slot. Replaces the default add button when provided; when empty the toolbar's default add button (controlled by `can-add`) is rendered unchanged.
  *
  * @event {{ args: any[] }} cx-table.[event_name] - Emitted when the event with such name is emitted on the table.

package/library/packages/organisms/src/asset-transformation-dialog/asset-transformation-dialog.d.ts

@@ -21,7 +21,7 @@ import { default as CxAssetLinkFormat } from '../asset-link-format/asset-link-fo
  *
  * @event cx-asset-transformation-dialog-cancel - Emitted when the user closes or cancels the dialog.
  * @event {{ detail: { format: string; transformations: Transformation[] } }} cx-asset-transformation-dialog-confirm - Emitted when the user saves, with the selected proxy id and transformation array.
- * @event cx-asset-transformation-dialog-delete - Emitted when the user clears the saved transformations via the delete button.
+ * @event cx-asset-transformation-dialog-delete - Emitted when the user resets the format to its default and clears the saved transformations via the reset button.
  */
 export default class CxAssetTransformationDialog extends CortexElement {
     static readonly styles: import('lit').CSSResult[];
@@ -44,6 +44,8 @@ export default class CxAssetTransformationDialog extends CortexElement {
     private apiGetAuthorizedObjects;
     private apiGetAvailableProxies;
     private apiSearchAssets;
+    /** Maps proxy format codes to human-readable labels for the settings-row format display. */
+    private formatLabels;
     /** Stores the accessible trigger element for focus return and ARIA updates. */
     private accessibleTrigger;
     private readonly triggerSlot;
@@ -85,6 +87,8 @@ export default class CxAssetTransformationDialog extends CortexElement {
     /** False while the authorization check is in flight or after it confirms no access. */
     private canAccess;
     private get hasTransformations();
+    /** Resolves the selected format code to its proxy label, falling back to the raw code. */
+    private get resolvedFormatLabel();
     handleAssetIdChange(): Promise<void>;
     handleCanAccessChange(): void;
     handleOpenChange(): void;
@@ -107,6 +111,8 @@ export default class CxAssetTransformationDialog extends CortexElement {
     private handleSave;
     private handleCancel;
     private handleAssetLinkFormatShow;
+    /** Shows the selected format's resolved label in the settings row, matching cx-asset-format-picker. */
+    private renderFormatDisplay;
     private renderTriggerSlot;
     render(): import('lit').TemplateResult<1>;
 }

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

@@ -0,0 +1,43 @@
+import { default as CortexLightElement } from '../../../base/src/cortex-light-element.ts';
+
+/**
+ * @summary Wraps content-builder output — read mode and the editor canvas alike —
+ * supplying its blocks with data they would otherwise each fetch for themselves.
+ *
+ * @description Renders no UI. Scans its light-DOM children for blocks linking to a
+ * space, fetches the space list once, and assigns it as `spaces`. Blocks skip their
+ * own fetch whenever an ancestor supplies it, so they must sit inside this element
+ * for that to apply — in the editor that means inside the canvas document.
+ *
+ * They re-resolve their stored space URL because it breaks when the space moves
+ * domain; doing it per block would repeat one identical request each and race this
+ * assignment.
+ */
+export default class CxContentBuilderViewer extends CortexLightElement {
+    #private;
+    /** Blocks already populated by a previous scan; skipped on re-scans. */
+    private readonly processedBlocks;
+    private apiGetTeamSpaceSpaceList;
+    constructor();
+    createRenderRoot(): this;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /** Blocks arrive in bursts as the page parses, so scans are collapsed. */
+    private scheduleScan;
+    private scanAndFetch;
+    /**
+     * One request per element, shared by every scan — authoring mutates the tree
+     * constantly, and each burst would otherwise refetch the same list.
+     *
+     * A failed lookup is not retained, so it is retried on the next scan instead of
+     * disabling resolution for the rest of the session.
+     */
+    private fetchSpaceList;
+    private collectPendingBlocks;
+    private applySpaceList;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'cx-content-builder-viewer': CxContentBuilderViewer;
+    }
+}

package/library/packages/organisms/src/index.d.ts

@@ -14,11 +14,13 @@ export { default as CxComment } from './comment/comment';
 export { default as CxCommentV1 } from './_v1/comment-v1/comment-v1';
 export { default as CxDamCustomToolbarButtonsEditor } from './dam-custom-toolbar-buttons-editor/dam-custom-toolbar-buttons-editor';
 export { default as CxContentBuilder } from './content-builder/content-builder';
+export { default as CxContentBuilderViewer } from './content-builder-viewer/content-builder-viewer';
 export { default as CxDownloader } from './downloader/downloader';
 export { default as CxFileOnDemand } from './file-on-demand/file-on-demand';
 export { default as CxFindAndReplace } from './find-and-replace/find-and-replace';
 export { default as CxLightbox } from './lightbox/lightbox';
 export { default as CxListEditor } from './list-editor/list-editor';
+export { default as CxSpaceSelector } from './space-selector/space-selector';
 export { default as CxSpecialCharactersDialog } from './special-characters-dialog/special-characters-dialog';
 export { default as CxTemplateSwitcher } from './template-switcher/template-switcher';
 export { default as CxTextToSpeech } from './text-to-speech/text-to-speech';

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

@@ -0,0 +1,99 @@
+import { default as CxButton } from '../../../atoms/src/components/button/button.ts';
+import { default as CxDropdown } from '../../../atoms/src/components/dropdown/dropdown.ts';
+import { default as CxIcon } from '../../../atoms/src/components/icon/icon.ts';
+import { default as CxIconButton } from '../../../atoms/src/components/icon-button/icon-button.ts';
+import { default as CxMenu } from '../../../atoms/src/components/menu/menu.ts';
+import { default as CxMenuItem } from '../../../atoms/src/components/menu-item/menu-item.ts';
+import { default as CxMenuSection } from '../../../atoms/src/components/menu-section/menu-section.ts';
+import { default as CxSpace } from '../../../atoms/src/components/space/space.ts';
+import { default as CxSpinner } from '../../../atoms/src/components/spinner/spinner.ts';
+import { default as CortexElement } from '../../../base/src/cortex-element.ts';
+import { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
+
+/**
+ * @summary The space switcher in the page header.
+ *
+ * The list of spaces it offers costs a search plus a permission trim on the server, and none of it
+ * is on screen until the user asks for it - so the list is fetched on first open rather than at page
+ * render. In `inline` mode there is no open event to hang that on (the menu is dropped straight into
+ * a drawer panel), so visibility drives the fetch instead.
+ *
+ * Switching, creating, editing and deleting a space stay server-side flows: this component reports
+ * the intent as an event and the host decides what to do with it.
+ *
+ * @slot (default) - Entries the host renders above the space list, e.g. a drawer's "Back" item.
+ *
+ * @event cx-space-select - The user picked a different space. Detail carries its module and URL.
+ * @event cx-space-create - The user asked for a new space.
+ * @event cx-space-settings - The user asked for the current space's settings.
+ * @event cx-space-delete - The user asked to delete the current space.
+ *
+ * @dependency cx-button
+ * @dependency cx-dropdown
+ * @dependency cx-icon
+ * @dependency cx-icon-button
+ * @dependency cx-menu
+ * @dependency cx-menu-item
+ * @dependency cx-menu-section
+ * @dependency cx-space
+ * @dependency cx-spinner
+ */
+export default class CxSpaceSelector extends CortexElement {
+    #private;
+    static readonly styles: CSSResultGroup;
+    static readonly dependencies: {
+        'cx-button': typeof CxButton;
+        'cx-dropdown': typeof CxDropdown;
+        'cx-icon': typeof CxIcon;
+        'cx-icon-button': typeof CxIconButton;
+        'cx-menu': typeof CxMenu;
+        'cx-menu-item': typeof CxMenuItem;
+        'cx-menu-section': typeof CxMenuSection;
+        'cx-space': typeof CxSpace;
+        'cx-spinner': typeof CxSpinner;
+    };
+    /** Whether the user may create a space. */
+    canCreate: boolean;
+    /** Whether the user may delete the space that is open. */
+    canDelete: boolean;
+    /** Whether the user may edit the space that is open. */
+    canEdit: boolean;
+    /** Label of the create entry. Translated by the host. */
+    createLabel: string;
+    /** Module of the space that is open, so it can be ticked and made unselectable. */
+    currentSpaceId: string;
+    /** Name of the space that is open, shown on the trigger. */
+    currentSpaceName: string;
+    /** Label of the delete entry. Translated by the host. */
+    deleteLabel: string;
+    /** A space that must never be offered, i.e. the default CMS space. */
+    excludedSpaceId: string;
+    /** Message shown when the user has no space to switch to. Translated by the host. */
+    emptyLabel: string;
+    /**
+     * `dropdown` renders a trigger that opens the list in a panel (page header).
+     * `inline` renders the bare menu, for a host that reveals it itself (right drawer).
+     */
+    mode: 'dropdown' | 'inline';
+    /**
+     * `always` keeps the panel available at every width. `desktop-only` hides it below the desktop
+     * breakpoint, for the headers whose trigger opens the right drawer on smaller screens.
+     */
+    panelVisibility: 'always' | 'desktop-only';
+    /** Label of the settings entry. Translated by the host. */
+    settingsLabel: string;
+    /** Icon of the trigger. */
+    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. */
+    triggerVariant: 'button' | 'icon-button';
+    /** Whether the space list is currently being fetched. */
+    private loading;
+    /** Spaces available to switch to, once fetched. */
+    private spaces;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected updated(changedProperties: PropertyValues): void;
+    render(): TemplateResult;
+}

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

@@ -0,0 +1,2 @@
+declare const _default: import('lit').CSSResult;
+export default _default;

package/library/packages/services/src/api/teamspace/teamspace.d.ts

@@ -17,9 +17,21 @@ export declare function apiGetTeamSpaceSpaceListOptions({ searchTerm, }: {
     }[];
     hasMore: boolean;
 }>;
-export declare function apiGetPagesAndLinks({ forcedPageId, parentId, searchTerm, start, }: {
+/**
+ * Lists the current space's pages and links, one folder at a time by default.
+ * Pass `limit: null` to drop the page cap and `seeThru: true` to flatten the
+ * hierarchy regardless of `searchTerm`.
+ */
+export declare function apiGetPagesAndLinks({ forcedPageId, limit, parentId, searchTerm, seeThru, start, }: {
     forcedPageId?: string;
+    limit?: null | number;
     parentId: string;
     searchTerm: string;
+    seeThru?: boolean;
     start: number;
 }): Promise<GetPagesAndLinksResponse>;
+/**
+ * The space's whole page/link catalog, flattened and uncapped, for looking up
+ * an item by ID regardless of which folder it now lives in.
+ */
+export declare function apiGetAllPagesAndLinks(): Promise<(import('../../../../types/src/content-builder').Page | import('../../../../types/src/content-builder').Link)[]>;

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

@@ -268,6 +268,8 @@ export type TeamSpace = {
     description: string;
     module: string;
     name: string;
+    /** Relative URL of the space. Falls back as a label for a space with no name. */
+    url?: string;
 };
 export declare enum TeamSpaceRole {
     Administrator = "Administrator",

package/library/packages/utils/src/url/url.d.ts

@@ -7,6 +7,30 @@
  * @param origin - Origin to compare against (defaults to `window.location.origin`).
  */
 export declare function toRelativeUrl(url: string | null | undefined, origin?: string): string | undefined;
+/**
+ * Path of a URL, without origin, trailing slash, query or hash — a key for
+ * matching two links that may be served from different domains. Accepts
+ * absolute and relative URLs; returns an empty string for falsy input.
+ */
+export declare function toUrlPathKey(url: string | null | undefined): string;
+/**
+ * Current URL of the space a stored URL points at, given the live space list.
+ *
+ * A stored space URL is a snapshot from when it was picked, so it breaks once
+ * the space is served from another domain. Spaces carry no id, so a moved space
+ * can only be identified by its path — a heuristic, applied conservatively:
+ *
+ * - a URL still matching a live space is returned unchanged;
+ * - otherwise its path is matched, which is what repairs a moved space;
+ * - a path claimed by several spaces identifies none of them, and a root-level
+ *   URL has no path to match on, so both are left unresolved.
+ *
+ * Returns `undefined` for anything it cannot place, so callers keep the stored
+ * URL rather than pointing the link somewhere else.
+ */
+export declare function resolveSpaceUrl(storedUrl: string | null | undefined, spaces: Array<{
+    absoluteURL: string;
+}>): string | undefined;
 export declare function appendProtocol(inputUrl: string, defaultProtocol?: string, ignoreRelativeUrl?: boolean): string;
 /**
  * Appends a query parameter to a URL, using `&` when the URL already has a