@orangelogic/design-system 2.60.0 → 2.61.0

package/library/components/typography.js

@@ -1,6 +1,8 @@
-import "../chunks/custom-element.vnXBMQxc.js";
-import "../chunks/component.styles.CI-v8BZa.js";
-import { C as p } from "../chunks/typography.BFpl0WMA.js";
+import "../chunks/lib-cortex-element.CVMmyPMC.js";
+import "../chunks/component.styles.DMSLciL5.js";
+import { C as a } from "../chunks/typography.oDzoLbZS.js";
+import "../chunks/custom-element.L4WJXn1j.js";
+import "../chunks/lit-element.jLBm65_O.js";
 export {
-  p as default
+  a as default
 };

package/library/components/video.js

@@ -1,15 +1,17 @@
 import { a as Ab, c as ps, g as kn } from "../chunks/_commonjsHelpers.ByX85dGu.js";
-import { r as Tb, C as Eb, R as wb } from "../chunks/image.Ycf8RudS.js";
+import { r as Tb, C as Eb, R as wb } from "../chunks/image.DZCRhE3G.js";
 import Sb from "./resize-observer.js";
-import { c as Cb } from "../chunks/component.styles.CI-v8BZa.js";
-import { b as Mb } from "../chunks/browser.Va59Ix3P.js";
-import { i as Db, n as ki, x as Kc, c as Pb } from "../chunks/custom-element.vnXBMQxc.js";
-import { L as Lb } from "../chunks/i18n.BP2FRO1v.js";
-import { w as Bn } from "../chunks/watch.BCJD77bD.js";
-import { r as Fn } from "../chunks/state.Cw55xXlb.js";
+import { c as Cb } from "../chunks/component.styles.DMSLciL5.js";
+import { b as Mb } from "../chunks/browser.BHOCIF_A.js";
+import { c as Db } from "../chunks/custom-element.L4WJXn1j.js";
+import { L as Pb } from "../chunks/i18n.DrzK7TPf.js";
+import { w as Bn } from "../chunks/watch.q1sEjPWL.js";
+import { i as Lb, x as Kc } from "../chunks/lit-element.jLBm65_O.js";
+import { n as ki } from "../chunks/lib-cortex-element.CVMmyPMC.js";
+import { r as Fn } from "../chunks/state.CSDxrqLd.js";
 import { e as ao } from "../chunks/query.BBf1UFkC.js";
 import { r as Rb } from "../chunks/query-async.CTgXGyQ5.js";
-import { e as Dp } from "../chunks/class-map.CoZTSvbM.js";
+import { e as Dp } from "../chunks/class-map.BiVq-cVR.js";
 import { n as Pp } from "../chunks/when.Dr1es41R.js";
 function Qe(e) {
   if (e === void 0) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
@@ -46901,7 +46903,7 @@ const G3 = function(e) {
 };
 re.registerPlugin("qualityLevels", F_);
 F_.VERSION = B_;
-const V3 = 5e3, z3 = 500, H3 = Db`
+const V3 = 5e3, z3 = 500, H3 = Lb`
   :host {
     --border-radius: 0px;
     --border: 0px;
@@ -49291,7 +49293,7 @@ var W3 = Object.defineProperty, q3 = Object.getOwnPropertyDescriptor, Bt = (e, t
 };
 let Pt = class extends wb {
   constructor() {
-    super(), this.localize = new Lb(this), this.src = "", this.name = "", this.nameSourceField = "", this.type = "", this.poster = "", this.autoplay = !1, this.loop = !1, this.muted = !1, this.showControls = !1, this.disablePictureInPicture = !1, this.disableRemotePlayback = !1, this.disableVolumePanel = !1, this.isLoaded = !1, this.isPlaying = !1, this.isError = !1, this.isFullscreen = !1, this.player = null, this.videoWidth = 0, this.videoHeight = 0, this.autoPlayTimeout = null, this.parsedName = "", this.onPause = this.onPause.bind(this), this.onPlay = this.onPlay.bind(this), this.onTimeUpdate = this.onTimeUpdate.bind(this), this.onEnded = this.onEnded.bind(this), this.onSeeked = this.onSeeked.bind(this), this.onFullscreenChange = this.onFullscreenChange.bind(this), this.onLoadedMetadata = this.onLoadedMetadata.bind(this), this.onError = this.onError.bind(this);
+    super(), this.localize = new Pb(this), this.src = "", this.name = "", this.nameSourceField = "", this.type = "", this.poster = "", this.autoplay = !1, this.loop = !1, this.muted = !1, this.showControls = !1, this.disablePictureInPicture = !1, this.disableRemotePlayback = !1, this.disableVolumePanel = !1, this.isLoaded = !1, this.isPlaying = !1, this.isError = !1, this.isFullscreen = !1, this.player = null, this.videoWidth = 0, this.videoHeight = 0, this.autoPlayTimeout = null, this.parsedName = "", this.onPause = this.onPause.bind(this), this.onPlay = this.onPlay.bind(this), this.onTimeUpdate = this.onTimeUpdate.bind(this), this.onEnded = this.onEnded.bind(this), this.onSeeked = this.onSeeked.bind(this), this.onFullscreenChange = this.onFullscreenChange.bind(this), this.onLoadedMetadata = this.onLoadedMetadata.bind(this), this.onError = this.onError.bind(this);
   }
   /**
    * The current time of the video.
@@ -49639,7 +49641,7 @@ Bt([
   Bn("parsedName", { waitUntilFirstUpdate: !0 })
 ], Pt.prototype, "handleParsedNameChange", 1);
 Pt = Bt([
-  Pb("cx-video")
+  Db("cx-video")
 ], Pt);
 export {
   Pt as default

package/library/components/visually-hidden.js

@@ -1,6 +1,8 @@
-import { i as p, C as l, x as m, c } from "../chunks/custom-element.vnXBMQxc.js";
-import { c as d } from "../chunks/component.styles.CI-v8BZa.js";
-const h = p`
+import { C as a } from "../chunks/lib-cortex-element.CVMmyPMC.js";
+import { c as l } from "../chunks/component.styles.DMSLciL5.js";
+import { c as m } from "../chunks/custom-element.L4WJXn1j.js";
+import { i as c, x as d } from "../chunks/lit-element.jLBm65_O.js";
+const h = c`
   :host(:not(:focus-within)) {
     position: absolute !important;
     width: 1px !important;
@@ -13,20 +15,20 @@ const h = p`
     padding: 0 !important;
   }
 `;
-var u = Object.getOwnPropertyDescriptor, x = (r, n, a, i) => {
-  for (var t = i > 1 ? void 0 : i ? u(n, a) : n, e = r.length - 1, s; e >= 0; e--)
-    (s = r[e]) && (t = s(t) || t);
+var f = Object.getOwnPropertyDescriptor, u = (r, n, p, i) => {
+  for (var t = i > 1 ? void 0 : i ? f(n, p) : n, o = r.length - 1, s; o >= 0; o--)
+    (s = r[o]) && (t = s(t) || t);
   return t;
 };
-let o = class extends l {
+let e = class extends a {
   render() {
-    return m` <slot></slot> `;
+    return d` <slot></slot> `;
   }
 };
-o.styles = [d, h];
-o = x([
-  c("cx-visually-hidden")
-], o);
+e.styles = [l, h];
+e = u([
+  m("cx-visually-hidden")
+], e);
 export {
-  o as default
+  e as default
 };

package/library/events.d.ts

@@ -0,0 +1 @@
+export * from './packages/events/src/events'

package/library/events.js

@@ -0,0 +1 @@
+export {};

package/library/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@orangelogic/design-system",
   "type": "module",
-  "version": "2.60.0",
+  "version": "2.61.0",
   "license": "UNLICENSED",
   "types": "library/types.d.ts",
   "scripts": {
@@ -12,7 +12,7 @@
     "start": "vite",
     "open": "npx playwright test --project=chromium --ui",
     "playwright": "npx playwright test --project=chromium",
-    "build-library": "bun run build && vite build --config ./vite.library.config.js",
+    "build-library": "bun run build && vite build --config ./vite.library.config.ts",
     "publish": "./scripts/publish-if-needed.js"
   },
   "bin": {
@@ -30,6 +30,15 @@
       "import": "./library/components/*",
       "types": "./library/components/*.d.ts"
     },
+    "./utils": {
+      "types": "./library/utils.d.ts",
+      "import": "./library/utils.js",
+      "default": "./library/utils.js"
+    },
+    "./events": {
+      "import": "./library/events.js",
+      "types": "./library/events.d.ts"
+    },
     "./react-types": "./library/react-web-component.js",
     "./css/*": "./library/css/*",
     "./assets/*": "./library/assets/*"

package/library/packages/atoms/src/components/array-line-clamp/array-line-clamp.d.ts

@@ -0,0 +1,45 @@
+import { default as CortexElement } from '../../../../base/src/cortex-element.ts';
+import { CSSResultGroup } from 'lit';
+import { default as CxLineClamp } from '../line-clamp/line-clamp';
+import { default as CxResizeObserver } from '../resize-observer/resize-observer';
+import { default as CxTag } from '../tag/tag';
+
+/**
+ * @summary Renders an array of items in a row, hiding overflow with a "+N" indicator and tooltip.
+ *
+ * @slot (default) - One or more elements; each direct child is one item. Items that overflow are hidden and summarized in the indicator tooltip.
+ *
+ * @csspart container - The items container.
+ * @csspart indicator - The "+N" tag when items are clamped.
+ *
+ * @cssproperty [--array-clamp-separator=', '] - Separator text rendered between visible items.
+ */
+export default class CxArrayLineClamp extends CortexElement {
+    static readonly styles: CSSResultGroup;
+    static readonly dependencies: {
+        'cx-line-clamp': typeof CxLineClamp;
+        'cx-resize-observer': typeof CxResizeObserver;
+        'cx-tag': typeof CxTag;
+    };
+    private readonly containerEl;
+    private readonly slotEl;
+    /** Separator string between visible items (e.g. ", " or "; "). */
+    separator: string;
+    /** Separator used in the tooltip for hidden items (defaults to `separator` if not set). */
+    tooltipSeparator: string;
+    private clampedMap;
+    private get totalClamped();
+    private get totalVisible();
+    private get hiddenChildrenStr();
+    private applyItemClasses;
+    private handleSlotChange;
+    private handleResize;
+    runFirstUpdated(): void;
+    handleClampedMapChange(): void;
+    render(): import('lit').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'cx-array-line-clamp': CxArrayLineClamp;
+    }
+}

package/library/packages/atoms/src/components/array-line-clamp/array-line-clamp.styles.d.ts

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

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

@@ -65,6 +65,8 @@ export default class CxCheckbox extends CortexElement implements CortexFormContr
     helpText: string;
     /** Position of the label relative to the checkbox control. Use `--checkbox-label-gap` to control the distance. */
     labelPlacement: CxCheckboxLabelPlacement;
+    /** The checkbox's aria-label text. */
+    ariaLabel: string | null;
     /** Gets the validity state object */
     get validity(): ValidityState;
     /** Gets the validation message */

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

@@ -1,7 +1,7 @@
 import { default as CortexElement } from '../../../../base/src/cortex-element.ts';
 import { DrawerVariant } from '../../../../types/src/drawer';
 import { default as Modal } from '../../../../utils/src/custom-element/modal';
-import { CSSResultGroup } from 'lit';
+import { CSSResultGroup, PropertyValues } from 'lit';
 import { default as CxIconButton } from '../icon-button/icon-button';
 
 /**
@@ -70,6 +70,11 @@ export default class CxDrawer extends CortexElement {
     drawer: HTMLElement;
     panel: HTMLElement;
     overlay: HTMLElement;
+    /**
+     * Keeps `.drawer--open` sizing applied while the close animation runs so the panel is not clipped
+     * (`overflow: hidden` on `.drawer` with 0×0 size).
+     */
+    private isClosing;
     /**
      * Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can
      * use the `show()` and `hide()` methods and this attribute will reflect the drawer's open state.
@@ -100,6 +105,7 @@ export default class CxDrawer extends CortexElement {
     noCloseButton: boolean;
     connectedUpdatedCallback(): void;
     disconnectedCallback(): void;
+    protected willUpdate(changed: PropertyValues): void;
     private requestClose;
     private addOpenListeners;
     private removeOpenListeners;

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

@@ -24,6 +24,7 @@ export default class CxInclude extends CortexElement {
      * code and can result in XSS attacks.
      */
     allowScripts: boolean;
+    private requestInclude;
     private executeScript;
     handleSrcChange(): Promise<void>;
     render(): import('lit').TemplateResult<1>;

package/library/packages/atoms/src/components/menu-item/menu-item.d.ts

@@ -74,6 +74,8 @@ export default class CxMenuItem extends CortexElement {
     /** The shift boundary for the submenu. */
     shiftBoundary: Element | Element[];
     menu: string;
+    /** Whether to always show the checked icon. */
+    alwaysShowCheckedIcon: boolean;
     /** The placement of the submenu relative to the menu item. When null/undefined, uses RTL-aware default positioning. */
     submenuPlacement?: 'top' | 'bottom' | 'left' | 'right' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end';
     /** Enables lazy loading submenu behavior. */

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

@@ -72,10 +72,6 @@ export default class CxTree extends CortexElement {
      * Whether to disable dragging an item inside another item for this tree.
      */
     noDragInside: boolean;
-    /**
-     * When partialSyncCheckboxes is true, whether to include an item if it's indeterminate but previously selected.
-     */
-    noIndeterminatePreviouslySelected: boolean;
     /**
      * Indicates whether the tree items are focusable.
      * If set to 'false', the tree items will not be focusable and will not receive focus when the user clicks on it.

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

@@ -1,6 +1,7 @@
 export { default as CxAlert } from './components/alert/alert';
 export { default as CxAnimatedImage } from './components/animated-image/animated-image';
 export { default as CxAnimation } from './components/animation/animation';
+export { default as CxArrayLineClamp } from './components/array-line-clamp/array-line-clamp';
 export { default as CxAvatar } from './components/avatar/avatar';
 export { default as CxBadge } from './components/badge/badge';
 export { default as CxBreadcrumb } from './components/breadcrumb/breadcrumb';

package/library/packages/events/src/cx-file-on-demand-load-more.d.ts

@@ -0,0 +1,8 @@
+export type CxFileOnDemandLoadMoreEvent = CustomEvent<{
+    type: 'recent' | 'favorites' | 'uploads' | 'pinned';
+}>;
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'cx-file-on-demand-load-more': CxFileOnDemandLoadMoreEvent;
+    }
+}

package/library/packages/events/src/cx-file-on-demand-pin.d.ts

@@ -0,0 +1,8 @@
+export type CxFileOnDemandPinEvent = CustomEvent<{
+    assetId: string;
+}>;
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'cx-file-on-demand-pin': CxFileOnDemandPinEvent;
+    }
+}

package/library/packages/events/src/cx-file-on-demand-unpin.d.ts

@@ -0,0 +1,8 @@
+export type CxFileOnDemandUnpinEvent = CustomEvent<{
+    assetId: string;
+}>;
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'cx-file-on-demand-unpin': CxFileOnDemandUnpinEvent;
+    }
+}

package/library/packages/events/src/cx-folder-select-search-term-change.d.ts

@@ -0,0 +1,8 @@
+export type CxFolderSelectSearchTermChangeEvent = CustomEvent<{
+    value: string;
+}>;
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'cx-folder-select-search-term-change': CxFolderSelectSearchTermChangeEvent;
+    }
+}

package/library/packages/events/src/cx-share-option-list-item-selected.d.ts

@@ -0,0 +1,8 @@
+export type CxShareOptionListItemSelectedEvent = CustomEvent<{
+    value: string;
+}>;
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'cx-share-option-list-item-selected': CxShareOptionListItemSelectedEvent;
+    }
+}

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

@@ -51,13 +51,13 @@ export * from './cx-download-format-picker-select';
 export * from './cx-download-format-request-status';
 export * from './cx-drag-end';
 export * from './cx-drag-start';
-export * from './cx-table-dropdown-filter-change';
 export * from './cx-enter';
 export * from './cx-error';
 export * from './cx-expand';
 export * from './cx-export-settings';
 export * from './cx-finish';
 export * from './cx-focus';
+export * from './cx-folder-select-search-term-change';
 export * from './cx-gallery-chunk-request';
 export * from './cx-gallery-config-save';
 export * from './cx-gallery-item-click';
@@ -80,7 +80,7 @@ export * from './cx-lazy-change';
 export * from './cx-lazy-load';
 export * from './cx-list-editor-change';
 export * from './cx-load';
-export * from './cx-load-more';
+export * from './cx-file-on-demand-load-more';
 export * from './cx-mark-favorite';
 export * from './cx-masonry-select';
 export * from './cx-mount-request-asset';
@@ -94,6 +94,7 @@ export * from './cx-page-outline-headings-count';
 export * from './cx-page-outline-item-click';
 export * from './cx-page-size-change';
 export * from './cx-pause-upload';
+export * from './cx-file-on-demand-pin';
 export * from './cx-ready';
 export * from './cx-refresh';
 export * from './cx-register-tag';
@@ -113,6 +114,7 @@ export * from './cx-select';
 export * from './cx-selected-change';
 export * from './cx-selection-change';
 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-start';
@@ -120,6 +122,7 @@ export * from './cx-swatch-add';
 export * from './cx-tab-hide';
 export * from './cx-tab-show';
 export * from './cx-table-advanced-search-click';
+export * from './cx-table-dropdown-filter-change';
 export * from './cx-table-export';
 export * from './cx-table-row-action-click';
 export * from './cx-table-save-search-select';
@@ -128,6 +131,7 @@ export * from './cx-time-update';
 export * from './cx-typeface-change';
 export * from './cx-typeface-download';
 export * from './cx-unmark-favorite';
+export * from './cx-file-on-demand-unpin';
 export * from './cx-video-click';
 export * from './cx-video-editor-track-canvas-ready';
 export * from './cx-video-editor-track-click';

package/library/packages/molecules/src/asset-picker/asset-picker.d.ts

@@ -55,6 +55,8 @@ export default class CxAssetPicker extends CortexElement {
      * It should return a promise that resolves to an Asset object.
      */
     onRequestAsset: ((type: AssetTypeString, multiple?: boolean, accepts?: string[]) => Promise<Asset | Record<string, Asset>>) | undefined;
+    /** Kept as an instance field so tests can stub this API call. */
+    private apiGetAssets;
     private handleRequestAssetClick;
     handleValueChange(): Promise<void>;
     private handleDeleteClick;

package/library/packages/molecules/src/cropper/cropper.d.ts

@@ -40,6 +40,7 @@ export default class CxCropper extends CortexElement {
         width: number;
     };
     rotation: number;
+    fillImage: boolean;
     disabled: boolean;
     loadable: boolean;
     loading: boolean;

package/library/packages/molecules/src/cropper/react/Cropper.d.ts

@@ -13,6 +13,7 @@ type Props = {
         y: number;
     };
     disabled: boolean;
+    fillImage: boolean;
     image: {
         extension: string;
         height: number;

package/library/packages/molecules/src/download-format-picker/download-format-picker.d.ts

@@ -53,6 +53,7 @@ export default class CxDownloadFormatPicker extends CortexElement {
      * Populated by fetching available format codes from the API.
      */
     private formatLabelMap;
+    private apiGetAllFormatCodes;
     runFirstUpdated(): void;
     /**
      * Returns true if the value has any format selected.

package/library/packages/molecules/src/folder-select/components/folder-select-tree/folder-select-tree.d.ts

@@ -6,6 +6,7 @@ import { TemplateResult } from 'lit';
 import { default as CxFolderSelectTreeItem } from '../folder-select-tree-item/folder-select-tree-item';
 
 export default class CxFolderSelectTree extends CortexElement {
+    #private;
     static readonly dependencies: {
         'cx-button': typeof CxButton;
         'cx-folder-select-tree-item': typeof CxFolderSelectTreeItem;
@@ -19,8 +20,13 @@ export default class CxFolderSelectTree extends CortexElement {
     token: string;
     bearerToken: string;
     baseUrl: string;
+    extraFolderId: string;
+    extraFolderTitle: string;
+    seeThru: boolean;
+    extraFolderData: Folder | null;
     api?: FolderSelectApi;
     excludeVirtualFolders: boolean;
+    firstFetchCallback: ((data: Folder[]) => void) | null;
     data: Folder[];
     hasMore: boolean;
     loading: boolean;
@@ -30,8 +36,10 @@ export default class CxFolderSelectTree extends CortexElement {
      */
     createRenderRoot(): this;
     runFirstUpdated(): void;
+    handleExtraFolderIdChange(): Promise<void>;
     loadMore(event: MouseEvent): Promise<void>;
     handleFetchFolders(): Promise<void>;
+    private fetchFolders;
     private renderFolder;
     render(): TemplateResult;
 }

package/library/packages/molecules/src/folder-select/components/folder-select-tree-item/folder-select-tree-item.d.ts

@@ -30,6 +30,7 @@ export default class CxFolderSelectTreeItem extends CortexElement {
     token: string;
     bearerToken: string;
     baseUrl: string;
+    searchTerm: string;
     api?: FolderSelectApi;
     excludeVirtualFolders: boolean;
     url: string;

package/library/packages/molecules/src/folder-select/folder-select.d.ts

@@ -2,7 +2,7 @@ import { default as CxIcon } from '../../../atoms/src/components/icon/icon.ts';
 import { default as CxInput } from '../../../atoms/src/components/input/input.ts';
 import { default as CxSelect } from '../../../atoms/src/components/select/select.ts';
 import { default as CortexElement } from '../../../base/src/cortex-element.ts';
-import { FolderSelectApi, FolderSelectVariant } from '../../../types/src/folder-select';
+import { Folder, FolderSelectApi, FolderSelectVariant } from '../../../types/src/folder-select';
 import { CSSResultGroup, TemplateResult } from 'lit';
 import { default as CxFolderSelectTree } from './components/folder-select-tree/folder-select-tree';
 
@@ -27,13 +27,18 @@ export default class CxFolderSelect extends CortexElement {
     open: boolean;
     token: string;
     bearerToken: string;
+    seeThru: boolean;
     api?: FolderSelectApi;
     required: boolean;
     form: string | HTMLElement | undefined;
     excludeVirtualFolders: boolean;
+    extraFolderId: string;
+    extraFolderTitle: string;
+    firstFetchCallback: ((data: Folder[]) => void) | null;
     searchTerm: string;
     constructor();
     updateWrappedApi(): void;
+    handleSearchTermChange(): void;
     private handleSearchTermInputChange;
     private handleSearchTermSelectChange;
     selectGetOptionValue(option: HTMLElement): string;

package/library/packages/organisms/src/asset-link-format/asset-link-format.d.ts

@@ -42,13 +42,6 @@ export default class CxAssetLinkFormat extends CortexElement {
      * @example 'https://qa-latest.orangelogic.com'
      */
     baseUrl: string | undefined;
-    /**
-     * The access token for the asset service.
-     * This token is used to authenticate requests to the asset service.
-     * This is useful for integration with different environments that are outside of the Orange Logic platform, such as Content Browser SDK.
-     * If not provided, the component will not include an access token in requests.
-     */
-    accessToken: string | undefined;
     /**
      * The asset to be formatted.
      * This is an object that contains the asset's details such as ID, original URL, image URL, width, and height.
@@ -100,6 +93,8 @@ export default class CxAssetLinkFormat extends CortexElement {
         height: number;
         width: number;
     };
+    hideHeader: boolean;
+    queryElement: HTMLElement | null;
     /**
      * The currently active setting in the asset link format component.
      * This is a string that represents the active setting, such as 'cx-asset-link-format-crop', 'cx-asset-link-format-resize', etc.
@@ -249,6 +244,7 @@ export default class CxAssetLinkFormat extends CortexElement {
         x: number;
         y: number;
     };
+    setActiveSetting(activeSetting: string): void;
     private freezeTransformations;
     handleTransformationsChange(): Promise<void>;
     private handleCropperElementChange;

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

@@ -21,6 +21,13 @@ export default class StyleController {
         default?: any;
         text?: string | undefined;
         placeholder?: string;
+        category?: (string | import('grapesjs').BlockCategoryProperties) | undefined;
+        changeProp?: boolean | undefined;
+        getValue?: ((props: {
+            editor: import('grapesjs').Editor;
+            trait: import('grapesjs').Trait;
+            component: import('grapesjs').Component;
+        }) => any) | undefined;
         setValue?: ((props: {
             value: any;
             editor: import('grapesjs').Editor;
@@ -30,16 +37,9 @@ export default class StyleController {
             options: import('grapesjs').TraitSetValueOptions;
             emitUpdate: () => void;
         }) => void) | undefined;
-        step?: number | undefined;
-        getValue?: ((props: {
-            editor: import('grapesjs').Editor;
-            trait: import('grapesjs').Trait;
-            component: import('grapesjs').Component;
-        }) => any) | undefined;
-        category?: (string | import('grapesjs').BlockCategoryProperties) | undefined;
-        changeProp?: boolean | undefined;
         valueTrue?: string | undefined;
         valueFalse?: string | undefined;
+        step?: number | undefined;
         labelButton?: string | undefined;
         command?: string | ((editor: import('grapesjs').Editor, trait: import('grapesjs').Trait) => any) | undefined;
         full?: boolean | undefined;

package/library/packages/organisms/src/file-on-demand/components/file-on-demand-asset/file-on-demand-asset.d.ts

@@ -0,0 +1,80 @@
+import { default as CxFormatBytes } from '../../../../../atoms/src/components/format-bytes/format-bytes.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 CxLineClamp } from '../../../../../atoms/src/components/line-clamp/line-clamp.ts';
+import { default as CxProgressBar } from '../../../../../atoms/src/components/progress-bar/progress-bar.ts';
+import { default as CxRelativeTime } from '../../../../../atoms/src/components/relative-time/relative-time.ts';
+import { default as CxSpinner } from '../../../../../atoms/src/components/spinner/spinner.ts';
+import { default as CxTooltip } from '../../../../../atoms/src/components/tooltip/tooltip.ts';
+import { default as CxTypography } from '../../../../../atoms/src/components/typography/typography.ts';
+import { default as CortexElement } from '../../../../../base/src/cortex-element.ts';
+import { Asset } from '../../../../../types/src/file-on-demand';
+import { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
+import { ASSET_LIST_TYPES } from '../../file-on-demand.constants';
+import { default as CxFileOnDemandPinnedStatus } from '../file-on-demand-pinned-status.ts/file-on-demand-pinned-status';
+
+/**
+ * @summary CxFileOnDemandAsset
+ */
+export default class CxFileOnDemandAsset extends CortexElement {
+    static readonly styles: CSSResultGroup;
+    static readonly dependencies: {
+        'cx-file-on-demand-pinned-status': typeof CxFileOnDemandPinnedStatus;
+        'cx-format-bytes': typeof CxFormatBytes;
+        'cx-icon': typeof CxIcon;
+        'cx-icon-button': typeof CxIconButton;
+        'cx-line-clamp': typeof CxLineClamp;
+        'cx-progress-bar': typeof CxProgressBar;
+        'cx-relative-time': typeof CxRelativeTime;
+        'cx-spinner': typeof CxSpinner;
+        'cx-tooltip': typeof CxTooltip;
+        'cx-typography': typeof CxTypography;
+    };
+    private readonly localize;
+    asset: Asset;
+    listType: (typeof ASSET_LIST_TYPES)[keyof typeof ASSET_LIST_TYPES];
+    /** The assets that are currently being marked/unmarked as favorite. */
+    favoriteInProgressAssets: string[];
+    /** The assets that are currently being pinned/unpinning. */
+    pinInProgressAssets: string[];
+    /** Tracks whether the current thumbnail URL failed to load. */
+    private thumbnailLoadError;
+    get showFailedActions(): boolean;
+    get showInProgressActions(): boolean;
+    get showNormalActions(): boolean;
+    get showPinnedActions(): boolean;
+    get isFolder(): boolean;
+    get thumbnailUrl(): string;
+    get showThumbnailPlaceholder(): boolean;
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    private handleImgError;
+    private handleImgLoad;
+    private handleOpenDriveClick;
+    private openDrive;
+    private unmarkFavorite;
+    private markFavorite;
+    private pinAsset;
+    private unpinAsset;
+    private handlePinClick;
+    private handleFavoriteClick;
+    private retryUpload;
+    private handleRetryUploadClick;
+    private resumeUpload;
+    private pauseUpload;
+    private handlePauseUploadClick;
+    private renderProgress;
+    private renderUploadingStatus;
+    private renderPinnedStatus;
+    private renderThumbnailContent;
+    private renderThumbnail;
+    private renderNormalActions;
+    private renderFailedActions;
+    private renderInProgressActions;
+    private renderPinnedActions;
+    render(): TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'cx-file-on-demand-asset': CxFileOnDemandAsset;
+    }
+}

package/library/packages/organisms/src/file-on-demand/components/file-on-demand-asset/file-on-demand-asset.styles.d.ts

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