@umbraco-cms/backoffice 15.3.0 → 15.4.0-rc

package/dist-cms/monaco-editor/vs/base/browser/touch.js

@@ -0,0 +1,268 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import * as DomUtils from './dom.js';
+import { mainWindow } from './window.js';
+import * as arrays from '../common/arrays.js';
+import { memoize } from '../common/decorators.js';
+import { Event as EventUtils } from '../common/event.js';
+import { Disposable, markAsSingleton, toDisposable } from '../common/lifecycle.js';
+import { LinkedList } from '../common/linkedList.js';
+export var EventType;
+(function (EventType) {
+    EventType.Tap = '-monaco-gesturetap';
+    EventType.Change = '-monaco-gesturechange';
+    EventType.Start = '-monaco-gesturestart';
+    EventType.End = '-monaco-gesturesend';
+    EventType.Contextmenu = '-monaco-gesturecontextmenu';
+})(EventType || (EventType = {}));
+export class Gesture extends Disposable {
+    static { this.SCROLL_FRICTION = -0.005; }
+    static { this.HOLD_DELAY = 700; }
+    static { this.CLEAR_TAP_COUNT_TIME = 400; } // ms
+    constructor() {
+        super();
+        this.dispatched = false;
+        this.targets = new LinkedList();
+        this.ignoreTargets = new LinkedList();
+        this.activeTouches = {};
+        this.handle = null;
+        this._lastSetTapCountTime = 0;
+        this._register(EventUtils.runAndSubscribe(DomUtils.onDidRegisterWindow, ({ window, disposables }) => {
+            disposables.add(DomUtils.addDisposableListener(window.document, 'touchstart', (e) => this.onTouchStart(e), { passive: false }));
+            disposables.add(DomUtils.addDisposableListener(window.document, 'touchend', (e) => this.onTouchEnd(window, e)));
+            disposables.add(DomUtils.addDisposableListener(window.document, 'touchmove', (e) => this.onTouchMove(e), { passive: false }));
+        }, { window: mainWindow, disposables: this._store }));
+    }
+    static addTarget(element) {
+        if (!Gesture.isTouchDevice()) {
+            return Disposable.None;
+        }
+        if (!Gesture.INSTANCE) {
+            Gesture.INSTANCE = markAsSingleton(new Gesture());
+        }
+        const remove = Gesture.INSTANCE.targets.push(element);
+        return toDisposable(remove);
+    }
+    static ignoreTarget(element) {
+        if (!Gesture.isTouchDevice()) {
+            return Disposable.None;
+        }
+        if (!Gesture.INSTANCE) {
+            Gesture.INSTANCE = markAsSingleton(new Gesture());
+        }
+        const remove = Gesture.INSTANCE.ignoreTargets.push(element);
+        return toDisposable(remove);
+    }
+    static isTouchDevice() {
+        // `'ontouchstart' in window` always evaluates to true with typescript's modern typings. This causes `window` to be
+        // `never` later in `window.navigator`. That's why we need the explicit `window as Window` cast
+        return 'ontouchstart' in mainWindow || navigator.maxTouchPoints > 0;
+    }
+    dispose() {
+        if (this.handle) {
+            this.handle.dispose();
+            this.handle = null;
+        }
+        super.dispose();
+    }
+    onTouchStart(e) {
+        const timestamp = Date.now(); // use Date.now() because on FF e.timeStamp is not epoch based.
+        if (this.handle) {
+            this.handle.dispose();
+            this.handle = null;
+        }
+        for (let i = 0, len = e.targetTouches.length; i < len; i++) {
+            const touch = e.targetTouches.item(i);
+            this.activeTouches[touch.identifier] = {
+                id: touch.identifier,
+                initialTarget: touch.target,
+                initialTimeStamp: timestamp,
+                initialPageX: touch.pageX,
+                initialPageY: touch.pageY,
+                rollingTimestamps: [timestamp],
+                rollingPageX: [touch.pageX],
+                rollingPageY: [touch.pageY]
+            };
+            const evt = this.newGestureEvent(EventType.Start, touch.target);
+            evt.pageX = touch.pageX;
+            evt.pageY = touch.pageY;
+            this.dispatchEvent(evt);
+        }
+        if (this.dispatched) {
+            e.preventDefault();
+            e.stopPropagation();
+            this.dispatched = false;
+        }
+    }
+    onTouchEnd(targetWindow, e) {
+        const timestamp = Date.now(); // use Date.now() because on FF e.timeStamp is not epoch based.
+        const activeTouchCount = Object.keys(this.activeTouches).length;
+        for (let i = 0, len = e.changedTouches.length; i < len; i++) {
+            const touch = e.changedTouches.item(i);
+            if (!this.activeTouches.hasOwnProperty(String(touch.identifier))) {
+                console.warn('move of an UNKNOWN touch', touch);
+                continue;
+            }
+            const data = this.activeTouches[touch.identifier], holdTime = Date.now() - data.initialTimeStamp;
+            if (holdTime < Gesture.HOLD_DELAY
+                && Math.abs(data.initialPageX - arrays.tail(data.rollingPageX)) < 30
+                && Math.abs(data.initialPageY - arrays.tail(data.rollingPageY)) < 30) {
+                const evt = this.newGestureEvent(EventType.Tap, data.initialTarget);
+                evt.pageX = arrays.tail(data.rollingPageX);
+                evt.pageY = arrays.tail(data.rollingPageY);
+                this.dispatchEvent(evt);
+            }
+            else if (holdTime >= Gesture.HOLD_DELAY
+                && Math.abs(data.initialPageX - arrays.tail(data.rollingPageX)) < 30
+                && Math.abs(data.initialPageY - arrays.tail(data.rollingPageY)) < 30) {
+                const evt = this.newGestureEvent(EventType.Contextmenu, data.initialTarget);
+                evt.pageX = arrays.tail(data.rollingPageX);
+                evt.pageY = arrays.tail(data.rollingPageY);
+                this.dispatchEvent(evt);
+            }
+            else if (activeTouchCount === 1) {
+                const finalX = arrays.tail(data.rollingPageX);
+                const finalY = arrays.tail(data.rollingPageY);
+                const deltaT = arrays.tail(data.rollingTimestamps) - data.rollingTimestamps[0];
+                const deltaX = finalX - data.rollingPageX[0];
+                const deltaY = finalY - data.rollingPageY[0];
+                // We need to get all the dispatch targets on the start of the inertia event
+                const dispatchTo = [...this.targets].filter(t => data.initialTarget instanceof Node && t.contains(data.initialTarget));
+                this.inertia(targetWindow, dispatchTo, timestamp, // time now
+                Math.abs(deltaX) / deltaT, // speed
+                deltaX > 0 ? 1 : -1, // x direction
+                finalX, // x now
+                Math.abs(deltaY) / deltaT, // y speed
+                deltaY > 0 ? 1 : -1, // y direction
+                finalY // y now
+                );
+            }
+            this.dispatchEvent(this.newGestureEvent(EventType.End, data.initialTarget));
+            // forget about this touch
+            delete this.activeTouches[touch.identifier];
+        }
+        if (this.dispatched) {
+            e.preventDefault();
+            e.stopPropagation();
+            this.dispatched = false;
+        }
+    }
+    newGestureEvent(type, initialTarget) {
+        const event = document.createEvent('CustomEvent');
+        event.initEvent(type, false, true);
+        event.initialTarget = initialTarget;
+        event.tapCount = 0;
+        return event;
+    }
+    dispatchEvent(event) {
+        if (event.type === EventType.Tap) {
+            const currentTime = (new Date()).getTime();
+            let setTapCount = 0;
+            if (currentTime - this._lastSetTapCountTime > Gesture.CLEAR_TAP_COUNT_TIME) {
+                setTapCount = 1;
+            }
+            else {
+                setTapCount = 2;
+            }
+            this._lastSetTapCountTime = currentTime;
+            event.tapCount = setTapCount;
+        }
+        else if (event.type === EventType.Change || event.type === EventType.Contextmenu) {
+            // tap is canceled by scrolling or context menu
+            this._lastSetTapCountTime = 0;
+        }
+        if (event.initialTarget instanceof Node) {
+            for (const ignoreTarget of this.ignoreTargets) {
+                if (ignoreTarget.contains(event.initialTarget)) {
+                    return;
+                }
+            }
+            const targets = [];
+            for (const target of this.targets) {
+                if (target.contains(event.initialTarget)) {
+                    let depth = 0;
+                    let now = event.initialTarget;
+                    while (now && now !== target) {
+                        depth++;
+                        now = now.parentElement;
+                    }
+                    targets.push([depth, target]);
+                }
+            }
+            targets.sort((a, b) => a[0] - b[0]);
+            for (const [_, target] of targets) {
+                target.dispatchEvent(event);
+                this.dispatched = true;
+            }
+        }
+    }
+    inertia(targetWindow, dispatchTo, t1, vX, dirX, x, vY, dirY, y) {
+        this.handle = DomUtils.scheduleAtNextAnimationFrame(targetWindow, () => {
+            const now = Date.now();
+            // velocity: old speed + accel_over_time
+            const deltaT = now - t1;
+            let delta_pos_x = 0, delta_pos_y = 0;
+            let stopped = true;
+            vX += Gesture.SCROLL_FRICTION * deltaT;
+            vY += Gesture.SCROLL_FRICTION * deltaT;
+            if (vX > 0) {
+                stopped = false;
+                delta_pos_x = dirX * vX * deltaT;
+            }
+            if (vY > 0) {
+                stopped = false;
+                delta_pos_y = dirY * vY * deltaT;
+            }
+            // dispatch translation event
+            const evt = this.newGestureEvent(EventType.Change);
+            evt.translationX = delta_pos_x;
+            evt.translationY = delta_pos_y;
+            dispatchTo.forEach(d => d.dispatchEvent(evt));
+            if (!stopped) {
+                this.inertia(targetWindow, dispatchTo, now, vX, dirX, x + delta_pos_x, vY, dirY, y + delta_pos_y);
+            }
+        });
+    }
+    onTouchMove(e) {
+        const timestamp = Date.now(); // use Date.now() because on FF e.timeStamp is not epoch based.
+        for (let i = 0, len = e.changedTouches.length; i < len; i++) {
+            const touch = e.changedTouches.item(i);
+            if (!this.activeTouches.hasOwnProperty(String(touch.identifier))) {
+                console.warn('end of an UNKNOWN touch', touch);
+                continue;
+            }
+            const data = this.activeTouches[touch.identifier];
+            const evt = this.newGestureEvent(EventType.Change, data.initialTarget);
+            evt.translationX = touch.pageX - arrays.tail(data.rollingPageX);
+            evt.translationY = touch.pageY - arrays.tail(data.rollingPageY);
+            evt.pageX = touch.pageX;
+            evt.pageY = touch.pageY;
+            this.dispatchEvent(evt);
+            // only keep a few data points, to average the final speed
+            if (data.rollingPageX.length > 3) {
+                data.rollingPageX.shift();
+                data.rollingPageY.shift();
+                data.rollingTimestamps.shift();
+            }
+            data.rollingPageX.push(touch.pageX);
+            data.rollingPageY.push(touch.pageY);
+            data.rollingTimestamps.push(timestamp);
+        }
+        if (this.dispatched) {
+            e.preventDefault();
+            e.stopPropagation();
+            this.dispatched = false;
+        }
+    }
+}
+__decorate([
+    memoize
+], Gesture, "isTouchDevice", null);

package/dist-cms/monaco-editor/vs/base/browser/trustedTypes.js

@@ -0,0 +1,24 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+import { onUnexpectedError } from '../common/errors.js';
+export function createTrustedTypesPolicy(policyName, policyOptions) {
+    const monacoEnvironment = globalThis.MonacoEnvironment;
+    if (monacoEnvironment?.createTrustedTypesPolicy) {
+        try {
+            return monacoEnvironment.createTrustedTypesPolicy(policyName, policyOptions);
+        }
+        catch (err) {
+            onUnexpectedError(err);
+            return undefined;
+        }
+    }
+    try {
+        return globalThis.trustedTypes?.createPolicy(policyName, policyOptions);
+    }
+    catch (err) {
+        onUnexpectedError(err);
+        return undefined;
+    }
+}

package/dist-cms/monaco-editor/vs/base/browser/ui/actionbar/actionViewItems.js

@@ -0,0 +1,373 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+import { isFirefox } from '../../browser.js';
+import { DataTransfers } from '../../dnd.js';
+import { addDisposableListener, EventHelper, EventType } from '../../dom.js';
+import { EventType as TouchEventType, Gesture } from '../../touch.js';
+import { getDefaultHoverDelegate } from '../hover/hoverDelegateFactory.js';
+import { SelectBox } from '../selectBox/selectBox.js';
+import { Action, ActionRunner, Separator } from '../../../common/actions.js';
+import { Disposable } from '../../../common/lifecycle.js';
+import * as platform from '../../../common/platform.js';
+import * as types from '../../../common/types.js';
+import './actionbar.css';
+import * as nls from '../../../../nls.js';
+import { getBaseLayerHoverDelegate } from '../hover/hoverDelegate2.js';
+export class BaseActionViewItem extends Disposable {
+    get action() {
+        return this._action;
+    }
+    constructor(context, action, options = {}) {
+        super();
+        this.options = options;
+        this._context = context || this;
+        this._action = action;
+        if (action instanceof Action) {
+            this._register(action.onDidChange(event => {
+                if (!this.element) {
+                    // we have not been rendered yet, so there
+                    // is no point in updating the UI
+                    return;
+                }
+                this.handleActionChangeEvent(event);
+            }));
+        }
+    }
+    handleActionChangeEvent(event) {
+        if (event.enabled !== undefined) {
+            this.updateEnabled();
+        }
+        if (event.checked !== undefined) {
+            this.updateChecked();
+        }
+        if (event.class !== undefined) {
+            this.updateClass();
+        }
+        if (event.label !== undefined) {
+            this.updateLabel();
+            this.updateTooltip();
+        }
+        if (event.tooltip !== undefined) {
+            this.updateTooltip();
+        }
+    }
+    get actionRunner() {
+        if (!this._actionRunner) {
+            this._actionRunner = this._register(new ActionRunner());
+        }
+        return this._actionRunner;
+    }
+    set actionRunner(actionRunner) {
+        this._actionRunner = actionRunner;
+    }
+    isEnabled() {
+        return this._action.enabled;
+    }
+    setActionContext(newContext) {
+        this._context = newContext;
+    }
+    render(container) {
+        const element = this.element = container;
+        this._register(Gesture.addTarget(container));
+        const enableDragging = this.options && this.options.draggable;
+        if (enableDragging) {
+            container.draggable = true;
+            if (isFirefox) {
+                // Firefox: requires to set a text data transfer to get going
+                this._register(addDisposableListener(container, EventType.DRAG_START, e => e.dataTransfer?.setData(DataTransfers.TEXT, this._action.label)));
+            }
+        }
+        this._register(addDisposableListener(element, TouchEventType.Tap, e => this.onClick(e, true))); // Preserve focus on tap #125470
+        this._register(addDisposableListener(element, EventType.MOUSE_DOWN, e => {
+            if (!enableDragging) {
+                EventHelper.stop(e, true); // do not run when dragging is on because that would disable it
+            }
+            if (this._action.enabled && e.button === 0) {
+                element.classList.add('active');
+            }
+        }));
+        if (platform.isMacintosh) {
+            // macOS: allow to trigger the button when holding Ctrl+key and pressing the
+            // main mouse button. This is for scenarios where e.g. some interaction forces
+            // the Ctrl+key to be pressed and hold but the user still wants to interact
+            // with the actions (for example quick access in quick navigation mode).
+            this._register(addDisposableListener(element, EventType.CONTEXT_MENU, e => {
+                if (e.button === 0 && e.ctrlKey === true) {
+                    this.onClick(e);
+                }
+            }));
+        }
+        this._register(addDisposableListener(element, EventType.CLICK, e => {
+            EventHelper.stop(e, true);
+            // menus do not use the click event
+            if (!(this.options && this.options.isMenu)) {
+                this.onClick(e);
+            }
+        }));
+        this._register(addDisposableListener(element, EventType.DBLCLICK, e => {
+            EventHelper.stop(e, true);
+        }));
+        [EventType.MOUSE_UP, EventType.MOUSE_OUT].forEach(event => {
+            this._register(addDisposableListener(element, event, e => {
+                EventHelper.stop(e);
+                element.classList.remove('active');
+            }));
+        });
+    }
+    onClick(event, preserveFocus = false) {
+        EventHelper.stop(event, true);
+        const context = types.isUndefinedOrNull(this._context) ? this.options?.useEventAsContext ? event : { preserveFocus } : this._context;
+        this.actionRunner.run(this._action, context);
+    }
+    // Only set the tabIndex on the element once it is about to get focused
+    // That way this element wont be a tab stop when it is not needed #106441
+    focus() {
+        if (this.element) {
+            this.element.tabIndex = 0;
+            this.element.focus();
+            this.element.classList.add('focused');
+        }
+    }
+    blur() {
+        if (this.element) {
+            this.element.blur();
+            this.element.tabIndex = -1;
+            this.element.classList.remove('focused');
+        }
+    }
+    setFocusable(focusable) {
+        if (this.element) {
+            this.element.tabIndex = focusable ? 0 : -1;
+        }
+    }
+    get trapsArrowNavigation() {
+        return false;
+    }
+    updateEnabled() {
+        // implement in subclass
+    }
+    updateLabel() {
+        // implement in subclass
+    }
+    getClass() {
+        return this.action.class;
+    }
+    getTooltip() {
+        return this.action.tooltip;
+    }
+    updateTooltip() {
+        if (!this.element) {
+            return;
+        }
+        const title = this.getTooltip() ?? '';
+        this.updateAriaLabel();
+        if (this.options.hoverDelegate?.showNativeHover) {
+            /* While custom hover is not inside custom hover */
+            this.element.title = title;
+        }
+        else {
+            if (!this.customHover && title !== '') {
+                const hoverDelegate = this.options.hoverDelegate ?? getDefaultHoverDelegate('element');
+                this.customHover = this._store.add(getBaseLayerHoverDelegate().setupManagedHover(hoverDelegate, this.element, title));
+            }
+            else if (this.customHover) {
+                this.customHover.update(title);
+            }
+        }
+    }
+    updateAriaLabel() {
+        if (this.element) {
+            const title = this.getTooltip() ?? '';
+            this.element.setAttribute('aria-label', title);
+        }
+    }
+    updateClass() {
+        // implement in subclass
+    }
+    updateChecked() {
+        // implement in subclass
+    }
+    dispose() {
+        if (this.element) {
+            this.element.remove();
+            this.element = undefined;
+        }
+        this._context = undefined;
+        super.dispose();
+    }
+}
+export class ActionViewItem extends BaseActionViewItem {
+    constructor(context, action, options) {
+        super(context, action, options);
+        this.options = options;
+        this.options.icon = options.icon !== undefined ? options.icon : false;
+        this.options.label = options.label !== undefined ? options.label : true;
+        this.cssClass = '';
+    }
+    render(container) {
+        super.render(container);
+        types.assertType(this.element);
+        const label = document.createElement('a');
+        label.classList.add('action-label');
+        label.setAttribute('role', this.getDefaultAriaRole());
+        this.label = label;
+        this.element.appendChild(label);
+        if (this.options.label && this.options.keybinding) {
+            const kbLabel = document.createElement('span');
+            kbLabel.classList.add('keybinding');
+            kbLabel.textContent = this.options.keybinding;
+            this.element.appendChild(kbLabel);
+        }
+        this.updateClass();
+        this.updateLabel();
+        this.updateTooltip();
+        this.updateEnabled();
+        this.updateChecked();
+    }
+    getDefaultAriaRole() {
+        if (this._action.id === Separator.ID) {
+            return 'presentation'; // A separator is a presentation item
+        }
+        else {
+            if (this.options.isMenu) {
+                return 'menuitem';
+            }
+            else if (this.options.isTabList) {
+                return 'tab';
+            }
+            else {
+                return 'button';
+            }
+        }
+    }
+    // Only set the tabIndex on the element once it is about to get focused
+    // That way this element wont be a tab stop when it is not needed #106441
+    focus() {
+        if (this.label) {
+            this.label.tabIndex = 0;
+            this.label.focus();
+        }
+    }
+    blur() {
+        if (this.label) {
+            this.label.tabIndex = -1;
+        }
+    }
+    setFocusable(focusable) {
+        if (this.label) {
+            this.label.tabIndex = focusable ? 0 : -1;
+        }
+    }
+    updateLabel() {
+        if (this.options.label && this.label) {
+            this.label.textContent = this.action.label;
+        }
+    }
+    getTooltip() {
+        let title = null;
+        if (this.action.tooltip) {
+            title = this.action.tooltip;
+        }
+        else if (!this.options.label && this.action.label && this.options.icon) {
+            title = this.action.label;
+            if (this.options.keybinding) {
+                title = nls.localize({ key: 'titleLabel', comment: ['action title', 'action keybinding'] }, "{0} ({1})", title, this.options.keybinding);
+            }
+        }
+        return title ?? undefined;
+    }
+    updateClass() {
+        if (this.cssClass && this.label) {
+            this.label.classList.remove(...this.cssClass.split(' '));
+        }
+        if (this.options.icon) {
+            this.cssClass = this.getClass();
+            if (this.label) {
+                this.label.classList.add('codicon');
+                if (this.cssClass) {
+                    this.label.classList.add(...this.cssClass.split(' '));
+                }
+            }
+            this.updateEnabled();
+        }
+        else {
+            this.label?.classList.remove('codicon');
+        }
+    }
+    updateEnabled() {
+        if (this.action.enabled) {
+            if (this.label) {
+                this.label.removeAttribute('aria-disabled');
+                this.label.classList.remove('disabled');
+            }
+            this.element?.classList.remove('disabled');
+        }
+        else {
+            if (this.label) {
+                this.label.setAttribute('aria-disabled', 'true');
+                this.label.classList.add('disabled');
+            }
+            this.element?.classList.add('disabled');
+        }
+    }
+    updateAriaLabel() {
+        if (this.label) {
+            const title = this.getTooltip() ?? '';
+            this.label.setAttribute('aria-label', title);
+        }
+    }
+    updateChecked() {
+        if (this.label) {
+            if (this.action.checked !== undefined) {
+                this.label.classList.toggle('checked', this.action.checked);
+                if (this.options.isTabList) {
+                    this.label.setAttribute('aria-selected', this.action.checked ? 'true' : 'false');
+                }
+                else {
+                    this.label.setAttribute('aria-checked', this.action.checked ? 'true' : 'false');
+                    this.label.setAttribute('role', 'checkbox');
+                }
+            }
+            else {
+                this.label.classList.remove('checked');
+                this.label.removeAttribute(this.options.isTabList ? 'aria-selected' : 'aria-checked');
+                this.label.setAttribute('role', this.getDefaultAriaRole());
+            }
+        }
+    }
+}
+export class SelectActionViewItem extends BaseActionViewItem {
+    constructor(ctx, action, options, selected, contextViewProvider, styles, selectBoxOptions) {
+        super(ctx, action);
+        this.selectBox = new SelectBox(options, selected, contextViewProvider, styles, selectBoxOptions);
+        this.selectBox.setFocusable(false);
+        this._register(this.selectBox);
+        this.registerListeners();
+    }
+    select(index) {
+        this.selectBox.select(index);
+    }
+    registerListeners() {
+        this._register(this.selectBox.onDidSelect(e => this.runAction(e.selected, e.index)));
+    }
+    runAction(option, index) {
+        this.actionRunner.run(this._action, this.getActionContext(option, index));
+    }
+    getActionContext(option, index) {
+        return option;
+    }
+    setFocusable(focusable) {
+        this.selectBox.setFocusable(focusable);
+    }
+    focus() {
+        this.selectBox?.focus();
+    }
+    blur() {
+        this.selectBox?.blur();
+    }
+    render(container) {
+        this.selectBox.render(container);
+    }
+}