@orangelogic/design-system 2.114.0 → 2.115.0

package/library/package.json

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

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

@@ -4,20 +4,23 @@ import { CSSResultGroup } from 'lit';
 import { default as CxIconButton } from '../icon-button/icon-button';
 import { default as CxTypography } from '../typography/typography';
 
-/** A [lightColor, darkColor] tuple used for theme-aware waveform coloring. */
-type WaveColorPair = [string, string];
 /**
- * @summary Audio player with waveform visualization.
+ * @summary Audio player with server-rendered waveform visualization.
+ *
+ * @description Set `src` for the audio file and `waveform-src` for a server-rendered waveform PNG.
+ * The PNG is analyzed via canvas pixel sampling and rendered as a themeable SVG. A native `<audio>`
+ * element handles playback. Wave color and background are fully CSS-controllable.
  *
  * @event cx-play - Emitted when playback starts.
  * @event cx-pause - Emitted when playback pauses.
- * @event {{ currentTime: number }} cx-time-update - Emitted while the playback position changes.
+ * @event {{ time: number }} cx-time-update - Emitted while the playback position changes.
  * @event cx-ended - Emitted when playback reaches the end.
- * @event {{ error: Error }} cx-error - Emitted when the audio fails to load.
+ * @event cx-error - Emitted when the audio or waveform image fails to load.
  *
  * @csspart base - The main container.
  * @csspart player - Row containing play button and waveform.
- * @csspart waveform - WaveSurfer waveform container.
+ * @csspart waveform - Placeholder container shown while the waveform is loading.
+ * @csspart waveform-svg - SVG waveform element (once waveform-src is loaded).
  * @csspart footer - Time and filename row.
  * @csspart time - Current time / duration display.
  * @csspart filename - Audio filename label.
@@ -27,8 +30,10 @@ type WaveColorPair = [string, string];
  * @cssproperty [--height=auto] - Component height.
  * @cssproperty [--border=0px] - Border.
  * @cssproperty [--border-radius=0px] - Border radius.
- * @cssproperty [--background-color=white] - Background color.
- * @cssproperty --waves-color - Waveform bar color. Default: blue.
+ * @cssproperty [--background-color=transparent] - Background color.
+ * @cssproperty --waves-color - Waveform fill color. Default: `--cx-color-primary`.
+ * @cssproperty --played-color - Overlay color for the played portion. Default: `--cx-color-primary-700`.
+ * @cssproperty [--playhead-color=var(--cx-color-neutral-0)] - Color of the thin playhead line tracking current position.
  * @cssproperty --text-color - Time/icon color. Default: dark.
  * @cssproperty --margin-top - Top margin.
  * @cssproperty --margin-right - Right margin.
@@ -42,9 +47,9 @@ export default class CxAudio extends ResizableElement {
         'cx-typography': typeof CxTypography;
     };
     readonly localize: LocalizeController;
-    private readonly waveformContainerAsync;
-    private waveSurfer;
     private srcLoadVersion;
+    private extractWaveformPeaks;
+    private readonly audioEl;
     /**
      * The URL of the audio file to load.
      */
@@ -62,39 +67,42 @@ export default class CxAudio extends ResizableElement {
      */
     loop: boolean;
     /**
-     * CSS color for the waveform bars. Accepts a plain CSS color or `light-dark(lightColor, darkColor)`
-     * for theme-aware coloring. Defaults to `--cx-color-primary` if not set or if the value is invalid.
+     * URL of a server-rendered waveform PNG. The image is analyzed via canvas pixel sampling
+     * and rendered as a themeable SVG. Wave color and background are CSS-controllable via
+     * `--waves-color` and `--background-color`.
      */
-    waveColor: WaveColorPair;
+    waveformSrc: string;
     /** Whether the audio is currently playing. */
     private isPlaying;
     /** Whether the audio has finished loading and is ready for playback. */
     private isLoaded;
-    /** Whether an error occurred while loading the audio. */
+    /** Whether an error occurred while loading the audio or waveform image. */
     private isError;
     /** Current playback position in seconds. */
     private currentTimeSeconds;
     /** Total duration in seconds. */
     private durationSeconds;
-    constructor();
+    /** SVG path data extracted from the waveform PNG. */
+    private waveformPath;
+    /** viewBox width matching the number of samples extracted from the waveform image. */
+    private waveformViewBoxWidth;
+    /** Fraction of the audio that has been played, 0–1, for the progress overlay. */
+    private playedFraction;
+    /** Effective audio src bound to the <audio> element; set after waveform loads, cleared on cleanUp. */
+    private audioSrc;
     runConnectedCallback(): void;
     disconnectedCallback(): void;
     handleSrcChange(): Promise<void>;
     protected applySrc(src: string): Promise<void>;
-    handleWaveColorThemeChange(): Promise<void>;
     updated(changedProps: Map<string, unknown>): void;
-    private onWaveSurferReady;
-    private onWaveSurferPlay;
-    private onWaveSurferPause;
-    private onWaveSurferTimeUpdate;
-    private onWaveSurferFinish;
-    private onWaveSurferError;
-    private resolveColorValue;
-    private computeCursorColor;
-    private setupColors;
-    private setupWaveSurfer;
-    private attachWaveSurferEvents;
     private cleanUp;
+    private setupPngWaveform;
+    private handleAudioPlay;
+    private handleAudioPause;
+    private handleAudioTimeUpdate;
+    private handleAudioDurationChange;
+    private handleAudioEnded;
+    private handleAudioError;
     private handleSizeChange;
     /** Starts audio playback. */
     play(): void;
@@ -103,6 +111,7 @@ export default class CxAudio extends ResizableElement {
     /** Toggles between play and pause. */
     togglePlay(): void;
     private formatTime;
+    private handleWaveformClick;
     private handlePlayButtonKeyDown;
     render(): import('lit').TemplateResult<1>;
 }
@@ -111,4 +120,3 @@ declare global {
         'cx-audio': CxAudio;
     }
 }
-export {};

package/library/packages/events/src/cx-facet-change.d.ts

@@ -0,0 +1,16 @@
+import { DateRangeValue } from '../../types/src/faceted-filter';
+
+/**
+ * Internal (non-composed) event emitted by date facet adapters
+ * (`cx-facet-date-picker`, `cx-facet-date-range`) up to `cx-faceted-filter`.
+ * `range` is `null` when the facet's selection has been cleared.
+ */
+export type CxFacetChangeEvent = CustomEvent<{
+    field: string;
+    range: DateRangeValue | null;
+}>;
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'cx-facet-change': CxFacetChangeEvent;
+    }
+}

package/library/packages/events/src/cx-faceted-filter-change.d.ts

@@ -1,5 +1,10 @@
+import { SelectedDateRanges, SelectedFacets } from '../../types/src/faceted-filter';
+
 export type CxFacetedFilterChangeEvent = CustomEvent<{
-    selection: Record<string, string[]>;
+    /** Date-facet selections (date-picker + date-range) keyed by facetFieldName. */
+    dateRanges?: SelectedDateRanges;
+    /** Checkbox-facet selections keyed by facetFieldName. */
+    selection: SelectedFacets;
 }>;
 declare global {
     interface GlobalEventHandlersEventMap {

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

@@ -70,6 +70,7 @@ export * from './cx-enter';
 export * from './cx-error';
 export * from './cx-expand';
 export * from './cx-export-settings';
+export * from './cx-facet-change';
 export * from './cx-faceted-filter-change';
 export * from './cx-file-on-demand-load-more';
 export * from './cx-file-on-demand-pin';

package/library/packages/molecules/src/faceted-filter/components/facet-date-picker/facet-date-picker.d.ts

@@ -0,0 +1,43 @@
+import { default as CxDetails } from '../../../../../atoms/src/components/details/details.ts';
+import { default as CortexElement } from '../../../../../base/src/cortex-element.ts';
+import { default as CxInputDatePicker } from '../../../input-date-picker/input-date-picker.ts';
+import { CSSResultGroup } from 'lit';
+
+/**
+ * @summary Internal single-date facet adapter for `cx-faceted-filter`. Renders a
+ * collapsible section (matching the checkbox facet) wrapping `cx-input-date-picker`,
+ * and normalizes its `cx-change` into the shared `cx-facet-change` event (an `=`
+ * filter on the chosen day).
+ *
+ * @event {{ field: string; range: DateRangeValue | null }} cx-facet-change - Fired
+ * when a date is committed (`range.type` is `date-picker`) or cleared (`range` is `null`).
+ */
+export default class CxFacetDatePicker extends CortexElement {
+    static readonly styles: CSSResultGroup;
+    static readonly dependencies: {
+        'cx-details': typeof CxDetails;
+        'cx-input-date-picker': typeof CxInputDatePicker;
+    };
+    /** Field name used as the filter key in the emitted event. */
+    field: string;
+    /** Human-readable label shown in the collapsible header. */
+    displayName: string;
+    /** Currently selected date in `YYYY-MM-DD`. */
+    value: string;
+    /** Currently selected time in 24-hour `HH:mm:ss`. */
+    fromTime: string;
+    /** Shows the hour/minute/second selects. */
+    showTime: boolean;
+    /** Minimum selectable date in `YYYY-MM-DD`. */
+    min: string;
+    /** Maximum selectable date in `YYYY-MM-DD`. */
+    max: string;
+    private handleChange;
+    private emitFacetChange;
+    render(): import('lit').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'cx-facet-date-picker': CxFacetDatePicker;
+    }
+}

package/library/packages/molecules/src/faceted-filter/components/facet-date-picker/facet-date-picker.styles.d.ts

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

package/library/packages/molecules/src/faceted-filter/components/facet-date-range/facet-date-range.d.ts

@@ -0,0 +1,51 @@
+import { default as CxDetails } from '../../../../../atoms/src/components/details/details.ts';
+import { default as CortexElement } from '../../../../../base/src/cortex-element.ts';
+import { default as CxInputDateRangePicker } from '../../../input-date-range-picker/input-date-range-picker.ts';
+import { CSSResultGroup } from 'lit';
+
+/**
+ * @summary Internal date-range facet adapter for `cx-faceted-filter`. Renders a
+ * collapsible section (matching the checkbox facet) wrapping `cx-input-date-range-picker`,
+ * and normalizes its `cx-change` into the shared `cx-facet-change` event. The event fires
+ * only once **both** the from and to dates are set, so incomplete edits keep the prior filter.
+ *
+ * @event {{ field: string; range: DateRangeValue | null }} cx-facet-change - Fired
+ * when both range ends are committed (`range.type` is `date-range`).
+ */
+export default class CxFacetDateRange extends CortexElement {
+    static readonly styles: CSSResultGroup;
+    static readonly dependencies: {
+        'cx-details': typeof CxDetails;
+        'cx-input-date-range-picker': typeof CxInputDateRangePicker;
+    };
+    /** Field name used as the filter key in the emitted event. */
+    field: string;
+    /** Human-readable label shown in the collapsible header. */
+    displayName: string;
+    /** The from date in `YYYY-MM-DD`. */
+    fromDate: string;
+    /** The to date in `YYYY-MM-DD`. */
+    toDate: string;
+    /** The from time in 24-hour `HH:mm:ss`. */
+    fromTime: string;
+    /** The to time in 24-hour `HH:mm:ss`. */
+    toTime: string;
+    /** Shows the hour/minute/second selects on both pickers. */
+    showTime: boolean;
+    /** Shows the preset selector (Today, Last 7 days, …). */
+    showPreset: boolean;
+    /** Selected preset key. Controlled so clearing resets the inner picker's preset. */
+    preset: string;
+    /** Minimum selectable date in `YYYY-MM-DD`. */
+    min: string;
+    /** Maximum selectable date in `YYYY-MM-DD`. */
+    max: string;
+    private handleChange;
+    private emitFacetChange;
+    render(): import('lit').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'cx-facet-date-range': CxFacetDateRange;
+    }
+}

package/library/packages/molecules/src/faceted-filter/components/facet-date-range/facet-date-range.styles.d.ts

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

package/library/packages/molecules/src/faceted-filter/facet-adapters.d.ts

@@ -0,0 +1,12 @@
+import { Facet, FacetRenderContext, FacetType } from '../../../types/src/faceted-filter';
+import { TemplateResult } from 'lit';
+
+/** Per-facet data the orchestrator hands each adapter so its render stays pure. */
+type FacetRenderer = (facet: Facet, ctx: FacetRenderContext) => TemplateResult;
+/**
+ * Adapter registry: maps a {@link FacetType} to the template that renders it.
+ * Add a new facet type by adding one entry here — the orchestrator dispatches
+ * through this map and never branches on type itself.
+ */
+export declare const FACET_ADAPTERS: Record<FacetType, FacetRenderer>;
+export {};

package/library/packages/molecules/src/faceted-filter/faceted-filter.d.ts

@@ -9,9 +9,8 @@ import { default as CxSpinner } from '../../../atoms/src/components/spinner/spin
 import { default as CxTag } from '../../../atoms/src/components/tag/tag.ts';
 import { default as CxTooltip } from '../../../atoms/src/components/tooltip/tooltip.ts';
 import { default as CortexElement } from '../../../base/src/cortex-element.ts';
-import { Facet, FacetDetails, FacetSelectionMode, SelectedFacets } from '../../../types/src/faceted-filter';
+import { Facet, FacetDetails, FacetSelectionMode, SelectedDateRanges, SelectedFacets } from '../../../types/src/faceted-filter';
 import { CSSResultGroup } from 'lit';
-import { default as CxFacetedFilterFacet } from './components/facet/facet';
 
 /**
  * @summary Filter icon button that opens a dropdown panel with collapsible facet groups.
@@ -27,7 +26,6 @@ export default class CxFacetedFilter extends CortexElement {
         'cx-button': typeof CxButton;
         'cx-details': typeof CxDetails;
         'cx-dropdown': typeof CxDropdown;
-        'cx-faceted-filter-facet': typeof CxFacetedFilterFacet;
         'cx-icon': typeof CxIcon;
         'cx-icon-button': typeof CxIconButton;
         'cx-space': typeof CxSpace;
@@ -36,12 +34,15 @@ export default class CxFacetedFilter extends CortexElement {
         'cx-tooltip': typeof CxTooltip;
     };
     private readonly localize;
+    private readonly shadowRootAutoloader;
     /** Active facets with their metadata and available option values. */
     facets: Facet[];
     /** Ordered list of facets to display. Controls which facets render and in what order. */
     availableFacets: FacetDetails[];
     /** Currently selected filter values. See `SelectedFacets` type. Can be set to reset selection. */
     selectedFacets: SelectedFacets;
+    /** Currently selected date facet values (date-picker + date-range). Can be set to reset selection. */
+    selectedDateRanges: SelectedDateRanges;
     /** Default selection mode for all facets. Per-facet selection in FacetDetails takes precedence. */
     selection: FacetSelectionMode;
     /** Whether the current selection is being applied by the consumer. */
@@ -50,17 +51,27 @@ export default class CxFacetedFilter extends CortexElement {
     private appliedFiltersCount;
     /** Internal selection state maintained by the component. */
     private internalSelection;
+    /** Internal date facet selection state maintained by the component. */
+    private internalDateRanges;
     /** Maps facetFieldName → (value → displayValue) for rendering applied-filter tags. */
     private mappedDisplayNames;
     handleFacetsChange(): void;
     handleSelectedFacetsChange(): void;
+    handleSelectedDateRangesChange(): void;
     handleInternalSelectionChange(): void;
     private updateAppliedFiltersCount;
     private getFacetSelectionMode;
+    private buildRenderContext;
     private handleSelectionChange;
+    private handleFacetChange;
     private handleRemove;
     private handleClearAllClick;
+    private emitChange;
     private renderAppliedFilters;
+    private getDateFacetLabel;
+    private formatDateRangeDisplay;
+    private renderDateTags;
+    private renderSelectionCheckboxTags;
     private renderFooter;
     render(): import('lit').TemplateResult<1>;
 }

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

@@ -14,7 +14,10 @@ export { default as CxDocsExample } from './docs-example/docs-example';
 export { default as CxDownloadFormatPicker } from './download-format-picker/download-format-picker';
 export { default as CxDynamicSelect } from './dynamic-select/dynamic-select';
 export { default as CxEstimatedReadingTime } from './estimated-reading-time/estimated-reading-time';
+export { default as CxFacetDatePicker } from './faceted-filter/components/facet-date-picker/facet-date-picker';
+export { default as CxFacetDateRange } from './faceted-filter/components/facet-date-range/facet-date-range';
 export { default as CxFacetedFilter } from './faceted-filter/faceted-filter';
+export { default as CxFacetedFilterFacet } from './faceted-filter/components/facet/facet';
 export { default as CxFolderSelect } from './folder-select/folder-select';
 export { default as CxGalleryItem } from './gallery-item/gallery-item';
 export { default as CxGraphView } from './graph-view/graph-view';

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

@@ -84,7 +84,7 @@ export default class CxAssetTransformationDialog extends CortexElement {
      * announce the correct role/state rather than the custom-element host. */
     private updateAccessibleTrigger;
     /** Fetches the asset and its available proxies when the dialog opens.
-     * Guards on `result.id` because `fetchAssetByID` returns `{}` on network error. */
+     * Guards on `result.id` because `fetchAssetByIDViaContentSdk` returns `{}` on network error. */
     private handleDialogShow;
     private handleTriggerClick;
     private handleTriggerKeyDown;

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

@@ -80,6 +80,7 @@ export default class CxGalleryConfig extends CortexElement {
     get galleryPickerDialogTitle(): string;
     constructor();
     private apiGetTeamSpaceSpaceList;
+    private apiGetAssets;
     private apiGetPagesAndLinks;
     fetchSelectedPage(): Promise<void>;
     /**

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

@@ -23,6 +23,7 @@ export default class CxPagePicker extends CortexElement {
         'cx-typography': typeof CxTypography;
     };
     private readonly localize;
+    private apiGetAssets;
     dialog: CxDialog;
     selectEl: CxFolderSelect;
     /**

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

@@ -15,7 +15,7 @@ type Attribute = {
     'resize-direction': CxSbAudio['resizeDirection'];
     src: CxSbAudio['src'];
     'version-label'?: string;
-    'wave-color': string;
+    'waveform-src'?: string;
     width: string;
 };
 declare const _default: {

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

@@ -21,7 +21,7 @@ export default class ConfigsController {
         'resize-direction': import('./blocks/audio/audio').default["resizeDirection"];
         src: import('./blocks/audio/audio').default["src"];
         'version-label'?: string;
-        'wave-color': string;
+        'waveform-src'?: string;
         width: string;
     }>[] | import('../../../types/src/content-builder').PropertyConfig<{
         'asset-button-type': import('./blocks/button/button').default["assetType"];
@@ -311,7 +311,7 @@ export default class ConfigsController {
         'resize-direction': import('./blocks/audio/audio').default["resizeDirection"];
         src: import('./blocks/audio/audio').default["src"];
         'version-label'?: string;
-        'wave-color': string;
+        'waveform-src'?: string;
         width: string;
     }> | Partial<{
         'asset-button-type': import('./blocks/button/button').default["assetType"];

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

@@ -1,4 +1,4 @@
-import { GetAllFormatCodesResponse, GetAssetsInFolderRequest, GetAssetsInFolderResponse, GetAssetsRequest, GetAssetsResponse, GetAvailableProxiesResponse, GetCropZoneSuggestionRequest, GetCropZoneSuggestionResponse, GetTransformAssetLinkResponse, SearchAssetsParams, SearchAssetsResponse } from './asset.types';
+import { GetAllFormatCodesResponse, GetAssetsInFolderRequest, GetAssetsInFolderResponse, GetAssetsRequest, GetAssetsResponse, GetAvailableProxiesResponse, GetCropZoneSuggestionRequest, GetCropZoneSuggestionResponse, GetFolderContentRequest, GetTransformAssetLinkResponse, SearchAssetsParams, SearchAssetsResponse } from './asset.types';
 
 export declare const DEFAULT_VIEW_SIZE = "CoreField.LargeSizePreview";
 export declare const FIELD_CORTEX_PATH = "Document.CortexPath";
@@ -38,7 +38,9 @@ export declare function apiGetTransformAssetLink({ assetId, extension, format, s
     useSession?: string;
 }): Promise<GetTransformAssetLinkResponse | null>;
 export declare function apiGetAssets({ extraFields, getPermanentAssetsPaths, recordIds, securityByPassToken, token, }: GetAssetsRequest): Promise<GetAssetsResponse>;
+export declare function apiGetAssetsViaContentSdk({ extraFields, recordIds, }: GetAssetsRequest): Promise<GetAssetsResponse>;
 export declare function apiGetAssetsInFolder({ countPerPage, directParentFolderIdentifier, extraFields, getPermanentAssetsPaths, limitedDocTypes, pageNumber, parentFolderIdentifier, searchTerm, securityByPassToken, sortOrder, token, }: GetAssetsInFolderRequest): Promise<GetAssetsInFolderResponse>;
+export declare function apiGetAssetsInFolderViaContentSdk({ extraFields, folderId, limit, limitedDocTypes, searchTerm, seeThrough, selectedFacets, sortOrder, start, }: GetFolderContentRequest): Promise<GetAssetsInFolderResponse>;
 export declare function apiGetCropFocusMode({ autoCropMode, cropHeight, cropWidth, imageUrl, useSession, }: GetCropZoneSuggestionRequest): Promise<GetCropZoneSuggestionResponse | null>;
 export declare function apiGetAvailableProxies({ assetRecordId, siteUrl, token, useSession, }: {
     assetRecordId: string;

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

@@ -9,6 +9,8 @@ export declare enum TEAMSPACE_API_ENDPOINT {
     GET_USER_ROLE = "webapi/objectmanagement/teamspaces/getuserroles_41E7_v1"
 }
 export declare enum ASSET_API_ENDPOINT {
+    GET_CONTENT_V1 = "webapi/extensibility/integrations/contentBrowserSDK/getcontent_4bw_v1",
+    GET_CONTENT_V3 = "webapi/extensibility/integrations/contentBrowserSDK/getcontent_4bw_v3",
     GET_CROP_ZONE_SUGGESTION = "webapi/mediafile/assettransformation/getcropzonesuggestion_41UP_v1",
     GET_LARGEST_DOWNLOAD_LINK = "webapi/objectmanagement/share/getlargestdownloadlink_46X_v1",
     GET_TRANSFORM_ASSET_LINK = "webapi/mediafile/assettransformation/transformasset_41E6_v1",

package/library/packages/tools/src/fetch-asset/fetch-asset.d.ts

@@ -3,6 +3,8 @@ import { ReactiveController, ReactiveElement } from 'lit';
 export declare class FetchAssetController implements ReactiveController {
     private readonly host;
     private data;
+    private apiGetAssetsViaContentSdk;
+    private apiGetAssets;
     constructor(host: ReactiveElement);
     fetchAssetByID({ extraFields, recordId, securityByPassToken, token, }: {
         extraFields?: string[];
@@ -10,6 +12,10 @@ export declare class FetchAssetController implements ReactiveController {
         securityByPassToken?: string;
         token?: string;
     }): Promise<Record<string, string>>;
+    fetchAssetByIDViaContentSdk({ extraFields, recordId, }: {
+        extraFields?: string[];
+        recordId: string;
+    }): Promise<Record<string, string>>;
     hostConnected?(): void;
     hostDisconnected?(): void;
 }

package/library/packages/tools/src/fetch-image/fetch-image.d.ts

@@ -23,17 +23,21 @@ export declare class FetchImageController implements ReactiveController {
     private readonly authToken;
     private securityByPassToken;
     private requestEpoch;
+    private apiGetAssets;
+    private apiGetAssetsInFolder;
+    private apiGetAssetsInFolderViaContentSdk;
     constructor(host: ReactiveElement, options?: FetchImageControllerOptions);
     get totalDataCount(): number;
     setSecurityByPassToken(token: string | undefined): void;
-    fetchImages({ end, extraFields, format, start, transformations, }: {
+    fetchImages({ end, extraFields, format, start, transformations, useContentSdk, }: {
         end: number;
         extraFields: string[];
         format?: string;
         start: number;
         transformations?: Transformation[];
+        useContentSdk?: boolean;
     }): Promise<ExtendedGalleryItem[] | undefined>;
-    fetchImagesInFolderBySlide({ activeSlide, extraFields, folderId, forceRefetch, format, minLimit, noPlaceholders, transformations, }: {
+    fetchImagesInFolderBySlide({ activeSlide, extraFields, folderId, forceRefetch, format, minLimit, noPlaceholders, transformations, useContentSdk, }: {
         activeSlide: number;
         extraFields?: string[];
         folderId: string;
@@ -42,6 +46,7 @@ export declare class FetchImageController implements ReactiveController {
         minLimit?: number;
         noPlaceholders?: boolean;
         transformations?: Transformation[];
+        useContentSdk?: boolean;
     }): Promise<ExtendedGalleryItem[]>;
     fetchImagesByIDs({ extraFields, format, recordIds, transformations, }: {
         extraFields?: string[];
@@ -49,7 +54,7 @@ export declare class FetchImageController implements ReactiveController {
         recordIds: string[];
         transformations?: Transformation[];
     }): Promise<ExtendedGalleryItem[]>;
-    fetchImagesInFolderByPage({ extraFields, folderId, forceRefetch, format, noPlaceholders, page, pageSize, transformations, }: {
+    fetchImagesInFolderByPage({ extraFields, folderId, forceRefetch, format, noPlaceholders, page, pageSize, transformations, useContentSdk, }: {
         extraFields?: string[];
         folderId: string;
         forceRefetch?: boolean;
@@ -58,8 +63,9 @@ export declare class FetchImageController implements ReactiveController {
         page: number;
         pageSize?: number;
         transformations?: Transformation[];
+        useContentSdk?: boolean;
     }): Promise<ExtendedGalleryItem[]>;
-    fetchImagesInFolderByChunk({ chunkSize: rawChunkSize, end, extraFields, folderId, forceRefetch, format, start, transformations, }: {
+    fetchImagesInFolderByChunk({ chunkSize: rawChunkSize, end, extraFields, folderId, forceRefetch, format, start, transformations, useContentSdk, }: {
         chunkSize?: number;
         end?: number;
         extraFields?: string[];
@@ -68,6 +74,7 @@ export declare class FetchImageController implements ReactiveController {
         format?: string;
         start?: number;
         transformations?: Transformation[];
+        useContentSdk?: boolean;
     }): AsyncGenerator<ExtendedGalleryItem[], void, unknown>;
     hostConnected?(): void;
     hostDisconnected?(): void;

package/library/packages/types/src/faceted-filter.d.ts

@@ -2,13 +2,54 @@ export declare enum FacetSelectionMode {
     Multiple = "multiple",
     Single = "single"
 }
-export type FacetDetails = {
+/** The kind of control a facet renders. Drives the adapter chosen by `cx-faceted-filter`. */
+export declare enum FacetType {
+    /** Multi/single-select tree of values with counts (default). */
+    Checkbox = "checkbox",
+    /** A single date picker — emits an `=` filter on the chosen day. */
+    DatePicker = "date-picker",
+    /** A from/to date range — emits `>=` / `<=` filters once both ends are set. */
+    DateRange = "date-range"
+}
+/** Checkbox (tree) facet — `type` defaults to `checkbox` when omitted. */
+export type CheckboxFacetDetails = {
     displayName: string;
     facetFieldName: string;
     facetIndexedFieldName?: string;
-    /** Controls whether the facet allows single or multi-select. Defaults to single. */
     selection?: FacetSelectionMode;
+    type?: FacetType.Checkbox;
 };
+/** Single date-picker facet. */
+export type DatePickerFacetDetails = {
+    displayName: string;
+    facetFieldName: string;
+    facetIndexedFieldName?: string;
+    /** Maximum selectable date in `YYYY-MM-DD`. */
+    max?: string;
+    /** Minimum selectable date in `YYYY-MM-DD`. */
+    min?: string;
+    selection?: FacetSelectionMode;
+    /** Show the hour/minute/second selects. */
+    showTime?: boolean;
+    type: FacetType.DatePicker;
+};
+/** From/to date-range facet. */
+export type DateRangeFacetDetails = {
+    displayName: string;
+    facetFieldName: string;
+    facetIndexedFieldName?: string;
+    /** Maximum selectable date in `YYYY-MM-DD`. */
+    max?: string;
+    /** Minimum selectable date in `YYYY-MM-DD`. */
+    min?: string;
+    selection?: FacetSelectionMode;
+    /** Show the preset selector (Today, Last 7 days, …). */
+    showPreset?: boolean;
+    /** Show the hour/minute/second selects. */
+    showTime?: boolean;
+    type: FacetType.DateRange;
+};
+export type FacetDetails = CheckboxFacetDetails | DatePickerFacetDetails | DateRangeFacetDetails;
 export type FacetValue = {
     count: number;
     displayValue: string;
@@ -21,3 +62,31 @@ export type Facet = {
 };
 /** Selected filter values keyed by facetFieldName. e.g. `{ status: ['active'], category: ['image>>png'] }` */
 export type SelectedFacets = Record<string, string[]>;
+/**
+ * A committed date selection for a single date facet. Shared by both date types:
+ * - `DatePicker` sets `fromDate` only (`toDate` stays empty) and maps to an `=` filter.
+ * - `DateRange` sets both `fromDate` and `toDate` and maps to `>=` / `<=` filters.
+ *
+ * Dates are ISO `YYYY-MM-DD`; times are 24-hour `HH:mm:ss`. When `showTime` is true the
+ * consumer combines date + time into an ISO datetime (`YYYY-MM-DDTHH:mm:ss`).
+ */
+export type DateRangeValue = {
+    fromDate: string;
+    fromTime: string;
+    /** Selected preset key for date-range facets when a preset was used. */
+    preset?: string;
+    showTime: boolean;
+    toDate: string;
+    toTime: string;
+    type: FacetType.DatePicker | FacetType.DateRange;
+};
+/** Committed date selections keyed by facetFieldName. e.g. `{ createdDate: { type: 'date-picker', fromDate: '2026-06-24', … } }` */
+export type SelectedDateRanges = Record<string, DateRangeValue>;
+export type FacetRenderContext = {
+    /** Committed date selection for this facet (`internalDateRanges[field]`). */
+    dateRange: DateRangeValue | undefined;
+    /** Fallback selection mode when the facet does not define its own. */
+    defaultSelection: FacetSelectionMode;
+    /** Selected checkbox values for this facet (`internalSelection[field]`). */
+    selectionValues: string[];
+};

package/library/packages/utils/src/image/index.d.ts

@@ -1 +1,2 @@
 export * from './image';
+export * from './waveform';