primeng 22.1.1 → 22.1.3

package/fesm2022/primeng-orderlist.mjs

@@ -1,26 +1,26 @@
-export * from 'primeng/types/orderlist';
-import { DragDropModule } from '@angular/cdk/drag-drop';
-import { isPlatformBrowser, NgTemplateOutlet } from '@angular/common';
-import * as i0 from '@angular/core';
-import { Injectable, InjectionToken, inject, input, numberAttribute, booleanAttribute, model, output, viewChild, contentChild, computed, signal, effect, untracked, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
-import * as i2 from '@angular/forms';
-import { FormsModule } from '@angular/forms';
-import { toSignal } from '@angular/core/rxjs-interop';
-import { uuid, findIndexInList, setAttribute } from '@primeuix/utils';
-import { FilterService } from 'primeng/api';
-import { BaseComponent, PARENT_INSTANCE } from 'primeng/basecomponent';
-import * as i1 from 'primeng/bind';
-import { Bind } from 'primeng/bind';
-import { ButtonDirective } from 'primeng/button';
-import { AngleDoubleDown } from '@primeicons/angular/angle-double-down';
-import { AngleDoubleUp } from '@primeicons/angular/angle-double-up';
-import { AngleDown } from '@primeicons/angular/angle-down';
-import { AngleUp } from '@primeicons/angular/angle-up';
-import { Listbox } from 'primeng/listbox';
-import { style } from '@primeuix/styles/orderlist';
-import { BaseStyle } from 'primeng/base';
-
-const theme = /*css*/ `
+import { DragDropModule } from "@angular/cdk/drag-drop";
+import { NgTemplateOutlet, isPlatformBrowser } from "@angular/common";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, Injectable, InjectionToken, NgModule, ViewEncapsulation, booleanAttribute, computed, contentChild, effect, inject, input, model, numberAttribute, output, signal, untracked, viewChild } from "@angular/core";
+import * as i2 from "@angular/forms";
+import { FormsModule } from "@angular/forms";
+import { toSignal } from "@angular/core/rxjs-interop";
+import { findIndexInList, setAttribute } from "@primeuix/utils";
+import { FilterService } from "primeng/api";
+import { BaseComponent, PARENT_INSTANCE } from "primeng/basecomponent";
+import * as i1 from "primeng/bind";
+import { Bind } from "primeng/bind";
+import { ButtonDirective } from "primeng/button";
+import { AngleDoubleDown } from "@primeicons/angular/angle-double-down";
+import { AngleDoubleUp } from "@primeicons/angular/angle-double-up";
+import { AngleDown } from "@primeicons/angular/angle-down";
+import { AngleUp } from "@primeicons/angular/angle-up";
+import { Listbox } from "primeng/listbox";
+import { getShadowRoot } from "primeng/dom";
+import { style } from "@primeuix/styles/orderlist";
+import { BaseStyle } from "primeng/base";
+export * from "primeng/types/orderlist";
+const theme = `
     ${style}
 
     /* For PrimeNG */
@@ -29,634 +29,751 @@ const theme = /*css*/ `
     }
 `;
 const classes = {
-    root: ({ instance }) => ['p-orderlist p-component', { 'p-orderlist-controls-left': instance.controlsPosition() === 'left', 'p-orderlist-controls-right': instance.controlsPosition() === 'right' }],
-    controls: 'p-orderlist-controls'
+	root: ({ instance }) => ["p-orderlist p-component", {
+		"p-orderlist-controls-left": instance.controlsPosition() === "left",
+		"p-orderlist-controls-right": instance.controlsPosition() === "right"
+	}],
+	controls: "p-orderlist-controls"
+};
+var OrderListStyle = class OrderListStyle extends BaseStyle {
+	name = "orderlist";
+	style = theme;
+	classes = classes;
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: OrderListStyle,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: OrderListStyle
+	});
 };
-class OrderListStyle extends BaseStyle {
-    name = 'orderlist';
-    style = theme;
-    classes = classes;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: OrderListStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: OrderListStyle });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: OrderListStyle, decorators: [{
-            type: Injectable
-        }] });
-/**
- *
- * OrderList is used to maneged the order of a collection.
- *
- * [Live Demo](https://primeng.dev/orderlist)
- *
- * @module orderliststyle
- *
- */
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: OrderListStyle,
+	decorators: [{ type: Injectable }]
+});
 var OrderListClasses;
-(function (OrderListClasses) {
-    /**
-     * Class name of the root element
-     */
-    OrderListClasses["root"] = "p-orderlist";
-    /**
-     * Class name of the controls element
-     */
-    OrderListClasses["controls"] = "p-orderlist-controls";
+(function(OrderListClasses) {
+	OrderListClasses["root"] = "p-orderlist";
+	OrderListClasses["controls"] = "p-orderlist-controls";
 })(OrderListClasses || (OrderListClasses = {}));
-
-const ORDERLIST_INSTANCE = new InjectionToken('ORDERLIST_INSTANCE');
-/**
- * OrderList is used to manage the order of a collection.
- * @group Components
- */
-class OrderList extends BaseComponent {
-    componentName = 'OrderList';
-    bindDirectiveInstance = inject(Bind, { self: true });
-    $pcOrderList = inject(ORDERLIST_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;
-    /**
-     * Text for the caption.
-     * @group Props
-     */
-    header = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "header" }] : /* istanbul ignore next */ []));
-    /**
-     * Index of the element in tabbing order.
-     * @group Props
-     */
-    tabindex = input(undefined, { ...(ngDevMode ? { debugName: "tabindex" } : /* istanbul ignore next */ {}), transform: numberAttribute });
-    /**
-     * Defines a string that labels the input for accessibility.
-     * @group Props
-     */
-    ariaLabel = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
-    /**
-     * Specifies one or more IDs in the DOM that labels the input field.
-     * @group Props
-     */
-    ariaLabelledBy = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "ariaLabelledBy" }] : /* istanbul ignore next */ []));
-    /**
-     * Inline style of the list element.
-     * @group Props
-     */
-    listStyle = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "listStyle" }] : /* istanbul ignore next */ []));
-    /**
-     * A boolean value that indicates whether the component should be responsive.
-     * @group Props
-     */
-    responsive = input(false, { ...(ngDevMode ? { debugName: "responsive" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * When specified displays an input field to filter the items on keyup and decides which fields to search against.
-     * @group Props
-     */
-    filterBy = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "filterBy" }] : /* istanbul ignore next */ []));
-    /**
-     * Placeholder of the filter input.
-     * @group Props
-     */
-    filterPlaceholder = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "filterPlaceholder" }] : /* istanbul ignore next */ []));
-    /**
-     * Locale to use in filtering. The default locale is the host environment's current locale.
-     * @group Props
-     */
-    filterLocale = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "filterLocale" }] : /* istanbul ignore next */ []));
-    /**
-     * When true metaKey needs to be pressed to select or unselect an item and when set to false selection of each item can be toggled individually. On touch enabled devices, metaKeySelection is turned off automatically.
-     * @group Props
-     */
-    metaKeySelection = input(false, { ...(ngDevMode ? { debugName: "metaKeySelection" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Whether to enable dragdrop based reordering.
-     * @group Props
-     */
-    dragdrop = input(false, { ...(ngDevMode ? { debugName: "dragdrop" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Defines the location of the buttons with respect to the list.
-     * @group Props
-     */
-    controlsPosition = input('left', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "controlsPosition" }] : /* istanbul ignore next */ []));
-    /**
-     * Defines a string that labels the filter input.
-     * @group Props
-     */
-    ariaFilterLabel = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "ariaFilterLabel" }] : /* istanbul ignore next */ []));
-    /**
-     * Defines how the items are filtered.
-     * @group Props
-     */
-    filterMatchMode = input('contains', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "filterMatchMode" }] : /* istanbul ignore next */ []));
-    /**
-     * Indicates the width of the screen at which the component should change its behavior.
-     * @group Props
-     */
-    breakpoint = input('960px', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "breakpoint" }] : /* istanbul ignore next */ []));
-    /**
-     * Whether to displays rows with alternating colors.
-     * @group Props
-     */
-    stripedRows = input(false, { ...(ngDevMode ? { debugName: "stripedRows" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * When present, it specifies that the component should be disabled.
-     * @group Props
-     */
-    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Function to optimize the dom operations by delegating to ngForTrackBy, default algorithm checks for object identity.
-     * @group Props
-     */
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
-    trackBy = input((index, item) => item, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "trackBy" }] : /* istanbul ignore next */ []));
-    /**
-     * Height of the viewport, a scrollbar is defined if height of list exceeds this value.
-     * @group Props
-     */
-    scrollHeight = input('14rem', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "scrollHeight" }] : /* istanbul ignore next */ []));
-    /**
-     * Whether to focus on the first visible or selected element.
-     * @group Props
-     */
-    autoOptionFocus = input(true, { ...(ngDevMode ? { debugName: "autoOptionFocus" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Name of the field that uniquely identifies the record in the data.
-     * @group Props
-     */
-    dataKey = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "dataKey" }] : /* istanbul ignore next */ []));
-    /**
-     * A list of values that are currently selected.
-     * @group Props
-     */
-    selection = model([], /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "selection" }] : /* istanbul ignore next */ []));
-    /**
-     * Array of values to be displayed in the component.
-     * It represents the data source for the list of items.
-     * @group Props
-     */
-    value = model(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
-    /**
-     * Configuration object forwarded to the Button component.
-     * @group Props
-     */
-    buttonProps = input({ severity: 'secondary' }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "buttonProps" }] : /* istanbul ignore next */ []));
-    /**
-     * Configuration object forwarded to the move up button inside the component.
-     * @group Props
-     */
-    moveUpButtonProps = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "moveUpButtonProps" }] : /* istanbul ignore next */ []));
-    /**
-     * Configuration object forwarded to the move top button inside the component.
-     * @group Props
-     */
-    moveTopButtonProps = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "moveTopButtonProps" }] : /* istanbul ignore next */ []));
-    /**
-     * Configuration object forwarded to the move down button inside the component.
-     * @group Props
-     */
-    moveDownButtonProps = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "moveDownButtonProps" }] : /* istanbul ignore next */ []));
-    /**
-     * Configuration object forwarded to the move bottom button inside the component.
-     * @group Props
-     */
-    moveBottomButtonProps = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "moveBottomButtonProps" }] : /* istanbul ignore next */ []));
-    /**
-     * Callback to invoke when list is reordered.
-     * @param {*} any - list instance.
-     * @group Emits
-     */
-    onReorder = output();
-    /**
-     * Callback to invoke when selection changes.
-     * @param {OrderListSelectionChangeEvent} event - Custom change event.
-     * @group Emits
-     */
-    onSelectionChange = output();
-    /**
-     * Callback to invoke when filtering occurs.
-     * @param {OrderListFilterEvent} event - Custom filter event.
-     * @group Emits
-     */
-    onFilterEvent = output();
-    /**
-     * Callback to invoke when the list is focused
-     * @param {Event} event - Browser event.
-     * @group Emits
-     */
-    onFocus = output();
-    /**
-     * Callback to invoke when the list is blurred
-     * @param {Event} event - Browser event.
-     * @group Emits
-     */
-    onBlur = output();
-    listViewChild = viewChild.required('listelement', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "listViewChild" }] : /* istanbul ignore next */ []));
-    filterViewChild = viewChild('filter', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "filterViewChild" }] : /* istanbul ignore next */ []));
-    /**
-     * Custom item template.
-     * @param {OrderListItemTemplateContext} context - item context.
-     * @see {@link OrderListItemTemplateContext}
-     * @group Templates
-     */
-    itemTemplate = contentChild('item', { ...(ngDevMode ? { debugName: "itemTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom empty template.
-     * @group Templates
-     */
-    emptyMessageTemplate = contentChild('empty', { ...(ngDevMode ? { debugName: "emptyMessageTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom empty filter template.
-     * @group Templates
-     */
-    emptyFilterMessageTemplate = contentChild('emptyfilter', { ...(ngDevMode ? { debugName: "emptyFilterMessageTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom filter template.
-     * @param {OrderListFilterTemplateContext} context - filter context.
-     * @see {@link OrderListFilterTemplateContext}
-     * @group Templates
-     */
-    filterTemplate = contentChild('filter', { ...(ngDevMode ? { debugName: "filterTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom header template.
-     * @group Templates
-     */
-    headerTemplate = contentChild('header', { ...(ngDevMode ? { debugName: "headerTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom move up icon template.
-     * @group Templates
-     */
-    moveUpIconTemplate = contentChild('moveupicon', { ...(ngDevMode ? { debugName: "moveUpIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom move top icon template.
-     * @group Templates
-     */
-    moveTopIconTemplate = contentChild('movetopicon', { ...(ngDevMode ? { debugName: "moveTopIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom move down icon template.
-     * @group Templates
-     */
-    moveDownIconTemplate = contentChild('movedownicon', { ...(ngDevMode ? { debugName: "moveDownIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom move bottom icon template.
-     * @group Templates
-     */
-    moveBottomIconTemplate = contentChild('movebottomicon', { ...(ngDevMode ? { debugName: "moveBottomIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom filter icon template.
-     * @group Templates
-     */
-    filterIconTemplate = contentChild('filtericon', { ...(ngDevMode ? { debugName: "filterIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    translation = toSignal(this.config.translationObserver, { initialValue: this.config.translation });
-    moveUpAriaLabel = computed(() => this.translation()?.aria?.moveUp, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "moveUpAriaLabel" }] : /* istanbul ignore next */ []));
-    moveTopAriaLabel = computed(() => this.translation()?.aria?.moveTop, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "moveTopAriaLabel" }] : /* istanbul ignore next */ []));
-    moveDownAriaLabel = computed(() => this.translation()?.aria?.moveDown, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "moveDownAriaLabel" }] : /* istanbul ignore next */ []));
-    moveBottomAriaLabel = computed(() => this.translation()?.aria?.moveBottom, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "moveBottomAriaLabel" }] : /* istanbul ignore next */ []));
-    upButtonProps = computed(() => ({ ...this.buttonProps(), ...this.moveUpButtonProps() }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "upButtonProps" }] : /* istanbul ignore next */ []));
-    topButtonProps = computed(() => ({ ...this.buttonProps(), ...this.moveTopButtonProps() }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "topButtonProps" }] : /* istanbul ignore next */ []));
-    downButtonProps = computed(() => ({ ...this.buttonProps(), ...this.moveDownButtonProps() }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "downButtonProps" }] : /* istanbul ignore next */ []));
-    bottomButtonProps = computed(() => ({ ...this.buttonProps(), ...this.moveBottomButtonProps() }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "bottomButtonProps" }] : /* istanbul ignore next */ []));
-    _headerText = computed(() => this.header(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "_headerText" }] : /* istanbul ignore next */ []));
-    $optionLabel = computed(() => this.dataKey() ?? 'name', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$optionLabel" }] : /* istanbul ignore next */ []));
-    $moveDisabled = computed(() => this.disabled() || !this.selection()?.length, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$moveDisabled" }] : /* istanbul ignore next */ []));
-    _componentStyle = inject(OrderListStyle);
-    filterOptions;
-    d_selection = [];
-    movedUp;
-    movedDown;
-    itemTouched;
-    styleElement;
-    id = uuid('pn_id_');
-    filterValue = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "filterValue" }] : /* istanbul ignore next */ []));
-    visibleOptions = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "visibleOptions" }] : /* istanbul ignore next */ []));
-    filterService = inject(FilterService);
-    constructor() {
-        super();
-        effect(() => {
-            this.d_selection = this.selection();
-        });
-        effect(() => {
-            const val = this.value();
-            untracked(() => {
-                if (this.filterValue()) {
-                    this.filter();
-                }
-                else if (this.dragdrop()) {
-                    this.visibleOptions.set([...(val || [])]);
-                }
-            });
-        });
-    }
-    onAfterViewChecked() {
-        this.bindDirectiveInstance.setAttrs(this.ptms(['host', 'root']));
-    }
-    onInit() {
-        if (this.responsive()) {
-            this.createStyle();
-        }
-        if (this.filterBy()) {
-            this.filterOptions = {
-                filter: (value) => this.onFilterKeyup(value),
-                reset: () => this.resetFilter()
-            };
-        }
-        // Initialize visibleOptions for drag&drop if enabled and value exists
-        if (this.dragdrop() && this.value() && !this.visibleOptions()) {
-            this.visibleOptions.set([...this.value()]);
-        }
-    }
-    onChangeSelection(e) {
-        this.d_selection = e.value;
-        this.selection.set(e.value);
-        this.onSelectionChange.emit({ originalEvent: e.originalEvent, value: e.value });
-    }
-    onFilterKeyup(event) {
-        this.filterValue.set(event.target.value.trim().toLocaleLowerCase(this.filterLocale()));
-        this.filter();
-        this.onFilterEvent.emit({
-            originalEvent: event,
-            value: this.visibleOptions()
-        });
-    }
-    filter() {
-        let searchFields = this.filterBy().split(',');
-        this.visibleOptions.set(this.filterService.filter(this.value(), searchFields, this.filterValue(), this.filterMatchMode(), this.filterLocale()));
-    }
-    /**
-     * Callback to invoke on filter reset.
-     * @group Method
-     */
-    resetFilter() {
-        this.filterValue.set('');
-        const filterEl = this.filterViewChild();
-        if (filterEl) {
-            filterEl.nativeElement.value = '';
-        }
-    }
-    isItemVisible(item) {
-        if (this.filterValue() && this.filterValue().trim().length) {
-            for (let i = 0; i < this.visibleOptions().length; i++) {
-                if (item == this.visibleOptions()[i]) {
-                    return true;
-                }
-            }
-        }
-        else {
-            return true;
-        }
-    }
-    isSelected(item) {
-        return findIndexInList(item, this.d_selection) !== -1;
-    }
-    isEmpty() {
-        return this.filterValue() ? !this.visibleOptions() || this.visibleOptions().length === 0 : !this.value() || this.value().length === 0;
-    }
-    moveUp() {
-        const sel = this.selection();
-        const val = this.value();
-        if (sel && val instanceof Array) {
-            // Sort selection by their current index to process them from top to bottom
-            const sortedSelection = this.sortByIndexInList(sel, val);
-            for (let selectedItem of sortedSelection) {
-                let selectedItemIndex = findIndexInList(selectedItem, val);
-                if (selectedItemIndex > 0 && !this.isSelected(val[selectedItemIndex - 1])) {
-                    let movedItem = val[selectedItemIndex];
-                    let temp = val[selectedItemIndex - 1];
-                    val[selectedItemIndex - 1] = movedItem;
-                    val[selectedItemIndex] = temp;
-                }
-                // Don't break - continue with other items even if one can't move
-            }
-            this.value.set([...val]);
-            this.movedUp = true;
-            this.onReorder.emit(sel);
-            this.scrollInViewSelection('up');
-        }
-    }
-    moveTop() {
-        const sel = this.selection();
-        const val = this.value();
-        if (sel && val instanceof Array) {
-            const sortedSelection = this.sortByIndexInList(sel, val);
-            for (let i = sortedSelection.length - 1; i >= 0; i--) {
-                let selectedItemIndex = findIndexInList(sortedSelection[i], val);
-                if (selectedItemIndex > 0) {
-                    let movedItem = val.splice(selectedItemIndex, 1)[0];
-                    val.unshift(movedItem);
-                }
-            }
-            this.value.set([...val]);
-            this.onReorder.emit(sel);
-            setTimeout(() => {
-                this.listViewChild().scrollInView(0);
-            });
-        }
-    }
-    moveDown() {
-        const sel = this.selection();
-        const val = this.value();
-        if (sel && val instanceof Array) {
-            const sortedSelection = this.sortByIndexInList(sel, val).reverse();
-            for (let selectedItem of sortedSelection) {
-                let selectedItemIndex = findIndexInList(selectedItem, val);
-                if (selectedItemIndex < val.length - 1 && !this.isSelected(val[selectedItemIndex + 1])) {
-                    let movedItem = val[selectedItemIndex];
-                    let temp = val[selectedItemIndex + 1];
-                    val[selectedItemIndex + 1] = movedItem;
-                    val[selectedItemIndex] = temp;
-                }
-            }
-            this.value.set([...val]);
-            this.movedDown = true;
-            this.onReorder.emit(sel);
-            this.scrollInViewSelection('down');
-        }
-    }
-    moveBottom() {
-        const sel = this.selection();
-        const val = this.value();
-        if (sel && val instanceof Array) {
-            const sortedSelection = this.sortByIndexInList(sel, val);
-            for (let i = 0; i < sortedSelection.length; i++) {
-                let selectedItemIndex = findIndexInList(sortedSelection[i], val);
-                if (selectedItemIndex !== val.length - 1) {
-                    let movedItem = val.splice(selectedItemIndex, 1)[0];
-                    val.push(movedItem);
-                }
-            }
-            this.value.set([...val]);
-            this.onReorder.emit(sel);
-            const bottomIndex = val.length ? val.length - 1 : 0;
-            setTimeout(() => {
-                this.listViewChild()?.scrollInView(bottomIndex);
-            });
-        }
-    }
-    onDrop(event) {
-        if (event.previousIndex === event.currentIndex) {
-            return;
-        }
-        const val = this.value();
-        const sel = this.selection();
-        const originalValue = [...(val || [])];
-        const isMultiSelection = sel && sel.length > 1 && findIndexInList(event.item.data, sel) !== -1;
-        if (!isMultiSelection) {
-            const reordered = this.listViewChild()._options();
-            this.value.set([...reordered]);
-            this.onReorder.emit([event.item.data]);
-            return;
-        }
-        // Multi-selection: undo Listbox's single-item move and reorder all selected items
-        if (val) {
-            val.length = 0;
-            val.push(...originalValue);
-        }
-        // Map CDK drop index to real index when filtering
-        let currentIndex = event.currentIndex;
-        const listboxFilterValue = this.listViewChild()._filterValue?.();
-        if (listboxFilterValue && this.filterBy()) {
-            const filterFields = this.filterBy().split(',');
-            const filtered = this.filterService.filter(originalValue, filterFields, listboxFilterValue, this.filterMatchMode(), this.filterLocale());
-            currentIndex = findIndexInList(filtered[event.currentIndex], originalValue);
-        }
-        let itemsToMove = this.sortByIndexInList([...sel], val || []);
-        const draggedIndex = findIndexInList(event.item.data, val || []);
-        const insertionPoint = draggedIndex < currentIndex ? currentIndex + 1 : currentIndex;
-        let itemsBefore = 0;
-        for (const item of itemsToMove) {
-            const itemIndex = findIndexInList(item, val || []);
-            if (itemIndex !== -1 && itemIndex < insertionPoint) {
-                itemsBefore++;
-            }
-        }
-        for (let i = itemsToMove.length - 1; i >= 0; i--) {
-            const itemIndex = findIndexInList(itemsToMove[i], val || []);
-            if (itemIndex !== -1) {
-                val?.splice(itemIndex, 1);
-            }
-        }
-        const targetIndex = Math.max(0, insertionPoint - itemsBefore);
-        for (let i = 0; i < itemsToMove.length; i++) {
-            val?.splice(targetIndex + i, 0, itemsToMove[i]);
-        }
-        this.value.set([...(val || [])]);
-        this.onReorder.emit(itemsToMove);
-    }
-    /**
-     * Scrolls the list so the moved selection stays visible. For an upward move the topmost
-     * selected item is revealed, for a downward move the bottommost one, mirroring the behavior
-     * of moveTop/moveBottom.
-     */
-    scrollInViewSelection(direction) {
-        const val = this.value();
-        const sel = this.selection();
-        if (!val?.length || !sel?.length) {
-            return;
-        }
-        const indexes = sel.map((item) => findIndexInList(item, val)).filter((index) => index !== -1);
-        if (!indexes.length) {
-            return;
-        }
-        const targetIndex = direction === 'up' ? Math.min(...indexes) : Math.max(...indexes);
-        setTimeout(() => {
-            this.listViewChild()?.scrollInView(targetIndex);
-        });
-    }
-    // Helper method to sort items by their index in a list (without mutating the input)
-    sortByIndexInList(items, list) {
-        return [...items].sort((a, b) => {
-            const indexA = findIndexInList(a, list);
-            const indexB = findIndexInList(b, list);
-            return indexA - indexB;
-        });
-    }
-    onListFocus(event) {
-        this.onFocus.emit(event);
-    }
-    onListBlur(event) {
-        this.onBlur.emit(event);
-    }
-    getVisibleOptions() {
-        const vo = this.visibleOptions();
-        const val = this.value();
-        return vo && vo.length > 0 ? vo : val && val.length > 0 ? val : null;
-    }
-    createStyle() {
-        if (isPlatformBrowser(this.platformId)) {
-            if (!this.styleElement) {
-                this.renderer.setAttribute(this.el.nativeElement.children[0], this.id, '');
-                this.styleElement = this.renderer.createElement('style');
-                this.renderer.setAttribute(this.styleElement, 'type', 'text/css');
-                setAttribute(this.styleElement, 'nonce', this.config?.csp()?.nonce);
-                this.renderer.appendChild(this.document.head, this.styleElement);
-                let innerHTML = `
+const ORDERLIST_INSTANCE = new InjectionToken("ORDERLIST_INSTANCE");
+var OrderList = class OrderList extends BaseComponent {
+	componentName = "OrderList";
+	bindDirectiveInstance = inject(Bind, { self: true });
+	$pcOrderList = inject(ORDERLIST_INSTANCE, {
+		optional: true,
+		skipSelf: true
+	}) ?? void 0;
+	header = input(...ngDevMode ? [void 0, { debugName: "header" }] : /* istanbul ignore next */ []);
+	tabindex = input(void 0, {
+		...ngDevMode ? { debugName: "tabindex" } : /* istanbul ignore next */ {},
+		transform: numberAttribute
+	});
+	ariaLabel = input(...ngDevMode ? [void 0, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
+	ariaLabelledBy = input(...ngDevMode ? [void 0, { debugName: "ariaLabelledBy" }] : /* istanbul ignore next */ []);
+	listStyle = input(...ngDevMode ? [void 0, { debugName: "listStyle" }] : /* istanbul ignore next */ []);
+	responsive = input(false, {
+		...ngDevMode ? { debugName: "responsive" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	filterBy = input(...ngDevMode ? [void 0, { debugName: "filterBy" }] : /* istanbul ignore next */ []);
+	filterPlaceholder = input(...ngDevMode ? [void 0, { debugName: "filterPlaceholder" }] : /* istanbul ignore next */ []);
+	filterLocale = input(...ngDevMode ? [void 0, { debugName: "filterLocale" }] : /* istanbul ignore next */ []);
+	metaKeySelection = input(false, {
+		...ngDevMode ? { debugName: "metaKeySelection" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	dragdrop = input(false, {
+		...ngDevMode ? { debugName: "dragdrop" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	controlsPosition = input("left", ...ngDevMode ? [{ debugName: "controlsPosition" }] : /* istanbul ignore next */ []);
+	ariaFilterLabel = input(...ngDevMode ? [void 0, { debugName: "ariaFilterLabel" }] : /* istanbul ignore next */ []);
+	filterMatchMode = input("contains", ...ngDevMode ? [{ debugName: "filterMatchMode" }] : /* istanbul ignore next */ []);
+	breakpoint = input("960px", ...ngDevMode ? [{ debugName: "breakpoint" }] : /* istanbul ignore next */ []);
+	stripedRows = input(false, {
+		...ngDevMode ? { debugName: "stripedRows" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	disabled = input(false, {
+		...ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	trackBy = input((index, item) => item, ...ngDevMode ? [{ debugName: "trackBy" }] : /* istanbul ignore next */ []);
+	scrollHeight = input("14rem", ...ngDevMode ? [{ debugName: "scrollHeight" }] : /* istanbul ignore next */ []);
+	autoOptionFocus = input(true, {
+		...ngDevMode ? { debugName: "autoOptionFocus" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	dataKey = input(...ngDevMode ? [void 0, { debugName: "dataKey" }] : /* istanbul ignore next */ []);
+	selection = model([], ...ngDevMode ? [{ debugName: "selection" }] : /* istanbul ignore next */ []);
+	value = model(...ngDevMode ? [void 0, { debugName: "value" }] : /* istanbul ignore next */ []);
+	buttonProps = input({ severity: "secondary" }, ...ngDevMode ? [{ debugName: "buttonProps" }] : /* istanbul ignore next */ []);
+	moveUpButtonProps = input(...ngDevMode ? [void 0, { debugName: "moveUpButtonProps" }] : /* istanbul ignore next */ []);
+	moveTopButtonProps = input(...ngDevMode ? [void 0, { debugName: "moveTopButtonProps" }] : /* istanbul ignore next */ []);
+	moveDownButtonProps = input(...ngDevMode ? [void 0, { debugName: "moveDownButtonProps" }] : /* istanbul ignore next */ []);
+	moveBottomButtonProps = input(...ngDevMode ? [void 0, { debugName: "moveBottomButtonProps" }] : /* istanbul ignore next */ []);
+	onReorder = output();
+	onSelectionChange = output();
+	onFilterEvent = output();
+	onFocus = output();
+	onBlur = output();
+	listViewChild = viewChild.required("listelement", ...ngDevMode ? [{ debugName: "listViewChild" }] : /* istanbul ignore next */ []);
+	filterViewChild = viewChild("filter", ...ngDevMode ? [{ debugName: "filterViewChild" }] : /* istanbul ignore next */ []);
+	itemTemplate = contentChild("item", {
+		...ngDevMode ? { debugName: "itemTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	emptyMessageTemplate = contentChild("empty", {
+		...ngDevMode ? { debugName: "emptyMessageTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	emptyFilterMessageTemplate = contentChild("emptyfilter", {
+		...ngDevMode ? { debugName: "emptyFilterMessageTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	filterTemplate = contentChild("filter", {
+		...ngDevMode ? { debugName: "filterTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	headerTemplate = contentChild("header", {
+		...ngDevMode ? { debugName: "headerTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	moveUpIconTemplate = contentChild("moveupicon", {
+		...ngDevMode ? { debugName: "moveUpIconTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	moveTopIconTemplate = contentChild("movetopicon", {
+		...ngDevMode ? { debugName: "moveTopIconTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	moveDownIconTemplate = contentChild("movedownicon", {
+		...ngDevMode ? { debugName: "moveDownIconTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	moveBottomIconTemplate = contentChild("movebottomicon", {
+		...ngDevMode ? { debugName: "moveBottomIconTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	filterIconTemplate = contentChild("filtericon", {
+		...ngDevMode ? { debugName: "filterIconTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	translation = toSignal(this.config.translationObserver, { initialValue: this.config.translation });
+	moveUpAriaLabel = computed(() => this.translation()?.aria?.moveUp, ...ngDevMode ? [{ debugName: "moveUpAriaLabel" }] : /* istanbul ignore next */ []);
+	moveTopAriaLabel = computed(() => this.translation()?.aria?.moveTop, ...ngDevMode ? [{ debugName: "moveTopAriaLabel" }] : /* istanbul ignore next */ []);
+	moveDownAriaLabel = computed(() => this.translation()?.aria?.moveDown, ...ngDevMode ? [{ debugName: "moveDownAriaLabel" }] : /* istanbul ignore next */ []);
+	moveBottomAriaLabel = computed(() => this.translation()?.aria?.moveBottom, ...ngDevMode ? [{ debugName: "moveBottomAriaLabel" }] : /* istanbul ignore next */ []);
+	upButtonProps = computed(() => ({
+		...this.buttonProps(),
+		...this.moveUpButtonProps()
+	}), ...ngDevMode ? [{ debugName: "upButtonProps" }] : /* istanbul ignore next */ []);
+	topButtonProps = computed(() => ({
+		...this.buttonProps(),
+		...this.moveTopButtonProps()
+	}), ...ngDevMode ? [{ debugName: "topButtonProps" }] : /* istanbul ignore next */ []);
+	downButtonProps = computed(() => ({
+		...this.buttonProps(),
+		...this.moveDownButtonProps()
+	}), ...ngDevMode ? [{ debugName: "downButtonProps" }] : /* istanbul ignore next */ []);
+	bottomButtonProps = computed(() => ({
+		...this.buttonProps(),
+		...this.moveBottomButtonProps()
+	}), ...ngDevMode ? [{ debugName: "bottomButtonProps" }] : /* istanbul ignore next */ []);
+	_headerText = computed(() => this.header(), ...ngDevMode ? [{ debugName: "_headerText" }] : /* istanbul ignore next */ []);
+	$optionLabel = computed(() => this.dataKey() ?? "name", ...ngDevMode ? [{ debugName: "$optionLabel" }] : /* istanbul ignore next */ []);
+	$moveDisabled = computed(() => this.disabled() || !this.selection()?.length, ...ngDevMode ? [{ debugName: "$moveDisabled" }] : /* istanbul ignore next */ []);
+	_componentStyle = inject(OrderListStyle);
+	filterOptions;
+	d_selection = [];
+	movedUp;
+	movedDown;
+	itemTouched;
+	styleElement;
+	id = this.$useId.next("pn_id_");
+	filterValue = signal(null, ...ngDevMode ? [{ debugName: "filterValue" }] : /* istanbul ignore next */ []);
+	visibleOptions = signal(null, ...ngDevMode ? [{ debugName: "visibleOptions" }] : /* istanbul ignore next */ []);
+	filterService = inject(FilterService);
+	constructor() {
+		super();
+		effect(() => {
+			this.d_selection = this.selection();
+		});
+		effect(() => {
+			const val = this.value();
+			untracked(() => {
+				if (this.filterValue()) this.filter();
+				else if (this.dragdrop()) this.visibleOptions.set([...val || []]);
+			});
+		});
+	}
+	onAfterViewChecked() {
+		this.bindDirectiveInstance.setAttrs(this.ptms(["host", "root"]));
+	}
+	onInit() {
+		if (this.responsive()) this.createStyle();
+		if (this.filterBy()) this.filterOptions = {
+			filter: (value) => this.onFilterKeyup(value),
+			reset: () => this.resetFilter()
+		};
+		if (this.dragdrop() && this.value() && !this.visibleOptions()) this.visibleOptions.set([...this.value()]);
+	}
+	onChangeSelection(e) {
+		this.d_selection = e.value;
+		this.selection.set(e.value);
+		this.onSelectionChange.emit({
+			originalEvent: e.originalEvent,
+			value: e.value
+		});
+	}
+	onFilterKeyup(event) {
+		this.filterValue.set(event.target.value.trim().toLocaleLowerCase(this.filterLocale()));
+		this.filter();
+		this.onFilterEvent.emit({
+			originalEvent: event,
+			value: this.visibleOptions()
+		});
+	}
+	filter() {
+		let searchFields = this.filterBy().split(",");
+		this.visibleOptions.set(this.filterService.filter(this.value(), searchFields, this.filterValue(), this.filterMatchMode(), this.filterLocale()));
+	}
+	resetFilter() {
+		this.filterValue.set("");
+		const filterEl = this.filterViewChild();
+		if (filterEl) filterEl.nativeElement.value = "";
+	}
+	isItemVisible(item) {
+		if (this.filterValue() && this.filterValue().trim().length) {
+			for (let i = 0; i < this.visibleOptions().length; i++) if (item == this.visibleOptions()[i]) return true;
+		} else return true;
+	}
+	isSelected(item) {
+		return findIndexInList(item, this.d_selection) !== -1;
+	}
+	isEmpty() {
+		return this.filterValue() ? !this.visibleOptions() || this.visibleOptions().length === 0 : !this.value() || this.value().length === 0;
+	}
+	moveUp() {
+		const sel = this.selection();
+		const val = this.value();
+		if (sel && val instanceof Array) {
+			const sortedSelection = this.sortByIndexInList(sel, val);
+			for (let selectedItem of sortedSelection) {
+				let selectedItemIndex = findIndexInList(selectedItem, val);
+				if (selectedItemIndex > 0 && !this.isSelected(val[selectedItemIndex - 1])) {
+					let movedItem = val[selectedItemIndex];
+					let temp = val[selectedItemIndex - 1];
+					val[selectedItemIndex - 1] = movedItem;
+					val[selectedItemIndex] = temp;
+				}
+			}
+			this.value.set([...val]);
+			this.movedUp = true;
+			this.onReorder.emit(sel);
+			this.scrollInViewSelection("up");
+		}
+	}
+	moveTop() {
+		const sel = this.selection();
+		const val = this.value();
+		if (sel && val instanceof Array) {
+			const sortedSelection = this.sortByIndexInList(sel, val);
+			for (let i = sortedSelection.length - 1; i >= 0; i--) {
+				let selectedItemIndex = findIndexInList(sortedSelection[i], val);
+				if (selectedItemIndex > 0) {
+					let movedItem = val.splice(selectedItemIndex, 1)[0];
+					val.unshift(movedItem);
+				}
+			}
+			this.value.set([...val]);
+			this.onReorder.emit(sel);
+			setTimeout(() => {
+				this.listViewChild().scrollInView(0);
+			});
+		}
+	}
+	moveDown() {
+		const sel = this.selection();
+		const val = this.value();
+		if (sel && val instanceof Array) {
+			const sortedSelection = this.sortByIndexInList(sel, val).reverse();
+			for (let selectedItem of sortedSelection) {
+				let selectedItemIndex = findIndexInList(selectedItem, val);
+				if (selectedItemIndex < val.length - 1 && !this.isSelected(val[selectedItemIndex + 1])) {
+					let movedItem = val[selectedItemIndex];
+					let temp = val[selectedItemIndex + 1];
+					val[selectedItemIndex + 1] = movedItem;
+					val[selectedItemIndex] = temp;
+				}
+			}
+			this.value.set([...val]);
+			this.movedDown = true;
+			this.onReorder.emit(sel);
+			this.scrollInViewSelection("down");
+		}
+	}
+	moveBottom() {
+		const sel = this.selection();
+		const val = this.value();
+		if (sel && val instanceof Array) {
+			const sortedSelection = this.sortByIndexInList(sel, val);
+			for (let i = 0; i < sortedSelection.length; i++) {
+				let selectedItemIndex = findIndexInList(sortedSelection[i], val);
+				if (selectedItemIndex !== val.length - 1) {
+					let movedItem = val.splice(selectedItemIndex, 1)[0];
+					val.push(movedItem);
+				}
+			}
+			this.value.set([...val]);
+			this.onReorder.emit(sel);
+			const bottomIndex = val.length ? val.length - 1 : 0;
+			setTimeout(() => {
+				this.listViewChild()?.scrollInView(bottomIndex);
+			});
+		}
+	}
+	onDrop(event) {
+		if (event.previousIndex === event.currentIndex) return;
+		const val = this.value();
+		const sel = this.selection();
+		const originalValue = [...val || []];
+		if (!(sel && sel.length > 1 && findIndexInList(event.item.data, sel) !== -1)) {
+			const reordered = this.listViewChild()._options();
+			this.value.set([...reordered]);
+			this.onReorder.emit([event.item.data]);
+			return;
+		}
+		if (val) {
+			val.length = 0;
+			val.push(...originalValue);
+		}
+		let currentIndex = event.currentIndex;
+		const listboxFilterValue = this.listViewChild()._filterValue?.();
+		if (listboxFilterValue && this.filterBy()) {
+			const filterFields = this.filterBy().split(",");
+			const filtered = this.filterService.filter(originalValue, filterFields, listboxFilterValue, this.filterMatchMode(), this.filterLocale());
+			currentIndex = findIndexInList(filtered[event.currentIndex], originalValue);
+		}
+		let itemsToMove = this.sortByIndexInList([...sel], val || []);
+		const insertionPoint = findIndexInList(event.item.data, val || []) < currentIndex ? currentIndex + 1 : currentIndex;
+		let itemsBefore = 0;
+		for (const item of itemsToMove) {
+			const itemIndex = findIndexInList(item, val || []);
+			if (itemIndex !== -1 && itemIndex < insertionPoint) itemsBefore++;
+		}
+		for (let i = itemsToMove.length - 1; i >= 0; i--) {
+			const itemIndex = findIndexInList(itemsToMove[i], val || []);
+			if (itemIndex !== -1) val?.splice(itemIndex, 1);
+		}
+		const targetIndex = Math.max(0, insertionPoint - itemsBefore);
+		for (let i = 0; i < itemsToMove.length; i++) val?.splice(targetIndex + i, 0, itemsToMove[i]);
+		this.value.set([...val || []]);
+		this.onReorder.emit(itemsToMove);
+	}
+	scrollInViewSelection(direction) {
+		const val = this.value();
+		const sel = this.selection();
+		if (!val?.length || !sel?.length) return;
+		const indexes = sel.map((item) => findIndexInList(item, val)).filter((index) => index !== -1);
+		if (!indexes.length) return;
+		const targetIndex = direction === "up" ? Math.min(...indexes) : Math.max(...indexes);
+		setTimeout(() => {
+			this.listViewChild()?.scrollInView(targetIndex);
+		});
+	}
+	sortByIndexInList(items, list) {
+		return [...items].sort((a, b) => {
+			return findIndexInList(a, list) - findIndexInList(b, list);
+		});
+	}
+	onListFocus(event) {
+		this.onFocus.emit(event);
+	}
+	onListBlur(event) {
+		this.onBlur.emit(event);
+	}
+	getVisibleOptions() {
+		const vo = this.visibleOptions();
+		const val = this.value();
+		return vo && vo.length > 0 ? vo : val && val.length > 0 ? val : null;
+	}
+	createStyle() {
+		if (isPlatformBrowser(this.platformId)) {
+			if (this.$styleScope.isolated) {
+				this.renderer.setAttribute(this.el.nativeElement.children[0], this.id, "");
+				this.$isolatedStyle("breakpoint", this.psel(this.breakpointCSS()));
+				return;
+			}
+			if (!this.styleElement) {
+				this.renderer.setAttribute(this.el.nativeElement.children[0], this.id, "");
+				this.styleElement = this.renderer.createElement("style");
+				this.renderer.setAttribute(this.styleElement, "type", "text/css");
+				setAttribute(this.styleElement, "nonce", this.config?.csp()?.nonce);
+				this.renderer.appendChild(getShadowRoot(this.el.nativeElement) ?? this.document.head, this.styleElement);
+				let innerHTML = this.breakpointCSS();
+				this.renderer.setProperty(this.styleElement, "innerHTML", this.psel(innerHTML));
+				setAttribute(this.styleElement, "nonce", this.config?.csp()?.nonce);
+			}
+		}
+	}
+	breakpointCSS() {
+		return `
                     @media screen and (max-width: ${this.breakpoint()}) {
-                        .p-orderlist[${this.$attrSelector}] {
+                        .p-orderlist${this.$instanceSelector} {
                             flex-direction: column;
                         }
 
-                        .p-orderlist[${this.$attrSelector}] .p-orderlist-controls {
+                        .p-orderlist${this.$instanceSelector} .p-orderlist-controls {
                             padding: var(--px-content-padding);
                             flex-direction: row;
                         }
 
-                        .p-orderlist[${this.$attrSelector}] .p-orderlist-controls .p-button {
+                        .p-orderlist${this.$instanceSelector} .p-orderlist-controls .p-button {
                             margin-right: var(--px-inline-spacing);
                             margin-bottom: 0;
                         }
 
-                        .p-orderlist[${this.$attrSelector}] .p-orderlist-controls .p-button:last-child {
+                        .p-orderlist${this.$instanceSelector} .p-orderlist-controls .p-button:last-child {
                             margin-right: 0;
                         }
                     }
                 `;
-                this.renderer.setProperty(this.styleElement, 'innerHTML', innerHTML);
-                setAttribute(this.styleElement, 'nonce', this.config?.csp()?.nonce);
-            }
-        }
-    }
-    destroyStyle() {
-        if (isPlatformBrowser(this.platformId)) {
-            if (this.styleElement) {
-                this.renderer.removeChild(this.document, this.styleElement);
-                this.styleElement = null;
-            }
-        }
-    }
-    onDestroy() {
-        this.destroyStyle();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: OrderList, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: OrderList, isStandalone: true, selector: "p-orderlist, p-order-list", inputs: { header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, listStyle: { classPropertyName: "listStyle", publicName: "listStyle", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, filterBy: { classPropertyName: "filterBy", publicName: "filterBy", isSignal: true, isRequired: false, transformFunction: null }, filterPlaceholder: { classPropertyName: "filterPlaceholder", publicName: "filterPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, filterLocale: { classPropertyName: "filterLocale", publicName: "filterLocale", isSignal: true, isRequired: false, transformFunction: null }, metaKeySelection: { classPropertyName: "metaKeySelection", publicName: "metaKeySelection", isSignal: true, isRequired: false, transformFunction: null }, dragdrop: { classPropertyName: "dragdrop", publicName: "dragdrop", isSignal: true, isRequired: false, transformFunction: null }, controlsPosition: { classPropertyName: "controlsPosition", publicName: "controlsPosition", isSignal: true, isRequired: false, transformFunction: null }, ariaFilterLabel: { classPropertyName: "ariaFilterLabel", publicName: "ariaFilterLabel", isSignal: true, isRequired: false, transformFunction: null }, filterMatchMode: { classPropertyName: "filterMatchMode", publicName: "filterMatchMode", isSignal: true, isRequired: false, transformFunction: null }, breakpoint: { classPropertyName: "breakpoint", publicName: "breakpoint", isSignal: true, isRequired: false, transformFunction: null }, stripedRows: { classPropertyName: "stripedRows", publicName: "stripedRows", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null }, scrollHeight: { classPropertyName: "scrollHeight", publicName: "scrollHeight", isSignal: true, isRequired: false, transformFunction: null }, autoOptionFocus: { classPropertyName: "autoOptionFocus", publicName: "autoOptionFocus", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, buttonProps: { classPropertyName: "buttonProps", publicName: "buttonProps", isSignal: true, isRequired: false, transformFunction: null }, moveUpButtonProps: { classPropertyName: "moveUpButtonProps", publicName: "moveUpButtonProps", isSignal: true, isRequired: false, transformFunction: null }, moveTopButtonProps: { classPropertyName: "moveTopButtonProps", publicName: "moveTopButtonProps", isSignal: true, isRequired: false, transformFunction: null }, moveDownButtonProps: { classPropertyName: "moveDownButtonProps", publicName: "moveDownButtonProps", isSignal: true, isRequired: false, transformFunction: null }, moveBottomButtonProps: { classPropertyName: "moveBottomButtonProps", publicName: "moveBottomButtonProps", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange", value: "valueChange", onReorder: "onReorder", onSelectionChange: "onSelectionChange", onFilterEvent: "onFilterEvent", onFocus: "onFocus", onBlur: "onBlur" }, host: { properties: { "class": "cx('root')" } }, providers: [OrderListStyle, { provide: ORDERLIST_INSTANCE, useExisting: OrderList }, { provide: PARENT_INSTANCE, useExisting: OrderList }], queries: [{ propertyName: "itemTemplate", first: true, predicate: ["item"], isSignal: true }, { propertyName: "emptyMessageTemplate", first: true, predicate: ["empty"], isSignal: true }, { propertyName: "emptyFilterMessageTemplate", first: true, predicate: ["emptyfilter"], isSignal: true }, { propertyName: "filterTemplate", first: true, predicate: ["filter"], isSignal: true }, { propertyName: "headerTemplate", first: true, predicate: ["header"], isSignal: true }, { propertyName: "moveUpIconTemplate", first: true, predicate: ["moveupicon"], isSignal: true }, { propertyName: "moveTopIconTemplate", first: true, predicate: ["movetopicon"], isSignal: true }, { propertyName: "moveDownIconTemplate", first: true, predicate: ["movedownicon"], isSignal: true }, { propertyName: "moveBottomIconTemplate", first: true, predicate: ["movebottomicon"], isSignal: true }, { propertyName: "filterIconTemplate", first: true, predicate: ["filtericon"], isSignal: true }], viewQueries: [{ propertyName: "listViewChild", first: true, predicate: ["listelement"], descendants: true, isSignal: true }, { propertyName: "filterViewChild", first: true, predicate: ["filter"], descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `
+	}
+	destroyStyle() {
+		if (isPlatformBrowser(this.platformId)) {
+			if (this.styleElement) {
+				this.renderer.removeChild(this.document, this.styleElement);
+				this.styleElement = null;
+			}
+		}
+	}
+	onDestroy() {
+		this.destroyStyle();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: OrderList,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: OrderList,
+		isStandalone: true,
+		selector: "p-orderlist, p-order-list",
+		inputs: {
+			header: {
+				classPropertyName: "header",
+				publicName: "header",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			tabindex: {
+				classPropertyName: "tabindex",
+				publicName: "tabindex",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			ariaLabel: {
+				classPropertyName: "ariaLabel",
+				publicName: "ariaLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			ariaLabelledBy: {
+				classPropertyName: "ariaLabelledBy",
+				publicName: "ariaLabelledBy",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			listStyle: {
+				classPropertyName: "listStyle",
+				publicName: "listStyle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			responsive: {
+				classPropertyName: "responsive",
+				publicName: "responsive",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			filterBy: {
+				classPropertyName: "filterBy",
+				publicName: "filterBy",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			filterPlaceholder: {
+				classPropertyName: "filterPlaceholder",
+				publicName: "filterPlaceholder",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			filterLocale: {
+				classPropertyName: "filterLocale",
+				publicName: "filterLocale",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			metaKeySelection: {
+				classPropertyName: "metaKeySelection",
+				publicName: "metaKeySelection",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			dragdrop: {
+				classPropertyName: "dragdrop",
+				publicName: "dragdrop",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			controlsPosition: {
+				classPropertyName: "controlsPosition",
+				publicName: "controlsPosition",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			ariaFilterLabel: {
+				classPropertyName: "ariaFilterLabel",
+				publicName: "ariaFilterLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			filterMatchMode: {
+				classPropertyName: "filterMatchMode",
+				publicName: "filterMatchMode",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			breakpoint: {
+				classPropertyName: "breakpoint",
+				publicName: "breakpoint",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			stripedRows: {
+				classPropertyName: "stripedRows",
+				publicName: "stripedRows",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			disabled: {
+				classPropertyName: "disabled",
+				publicName: "disabled",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			trackBy: {
+				classPropertyName: "trackBy",
+				publicName: "trackBy",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			scrollHeight: {
+				classPropertyName: "scrollHeight",
+				publicName: "scrollHeight",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			autoOptionFocus: {
+				classPropertyName: "autoOptionFocus",
+				publicName: "autoOptionFocus",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			dataKey: {
+				classPropertyName: "dataKey",
+				publicName: "dataKey",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			selection: {
+				classPropertyName: "selection",
+				publicName: "selection",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			buttonProps: {
+				classPropertyName: "buttonProps",
+				publicName: "buttonProps",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			moveUpButtonProps: {
+				classPropertyName: "moveUpButtonProps",
+				publicName: "moveUpButtonProps",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			moveTopButtonProps: {
+				classPropertyName: "moveTopButtonProps",
+				publicName: "moveTopButtonProps",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			moveDownButtonProps: {
+				classPropertyName: "moveDownButtonProps",
+				publicName: "moveDownButtonProps",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			moveBottomButtonProps: {
+				classPropertyName: "moveBottomButtonProps",
+				publicName: "moveBottomButtonProps",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			selection: "selectionChange",
+			value: "valueChange",
+			onReorder: "onReorder",
+			onSelectionChange: "onSelectionChange",
+			onFilterEvent: "onFilterEvent",
+			onFocus: "onFocus",
+			onBlur: "onBlur"
+		},
+		host: { properties: { "class": "cx('root')" } },
+		providers: [
+			OrderListStyle,
+			{
+				provide: ORDERLIST_INSTANCE,
+				useExisting: OrderList
+			},
+			{
+				provide: PARENT_INSTANCE,
+				useExisting: OrderList
+			}
+		],
+		queries: [
+			{
+				propertyName: "itemTemplate",
+				first: true,
+				predicate: ["item"],
+				isSignal: true
+			},
+			{
+				propertyName: "emptyMessageTemplate",
+				first: true,
+				predicate: ["empty"],
+				isSignal: true
+			},
+			{
+				propertyName: "emptyFilterMessageTemplate",
+				first: true,
+				predicate: ["emptyfilter"],
+				isSignal: true
+			},
+			{
+				propertyName: "filterTemplate",
+				first: true,
+				predicate: ["filter"],
+				isSignal: true
+			},
+			{
+				propertyName: "headerTemplate",
+				first: true,
+				predicate: ["header"],
+				isSignal: true
+			},
+			{
+				propertyName: "moveUpIconTemplate",
+				first: true,
+				predicate: ["moveupicon"],
+				isSignal: true
+			},
+			{
+				propertyName: "moveTopIconTemplate",
+				first: true,
+				predicate: ["movetopicon"],
+				isSignal: true
+			},
+			{
+				propertyName: "moveDownIconTemplate",
+				first: true,
+				predicate: ["movedownicon"],
+				isSignal: true
+			},
+			{
+				propertyName: "moveBottomIconTemplate",
+				first: true,
+				predicate: ["movebottomicon"],
+				isSignal: true
+			},
+			{
+				propertyName: "filterIconTemplate",
+				first: true,
+				predicate: ["filtericon"],
+				isSignal: true
+			}
+		],
+		viewQueries: [{
+			propertyName: "listViewChild",
+			first: true,
+			predicate: ["listelement"],
+			descendants: true,
+			isSignal: true
+		}, {
+			propertyName: "filterViewChild",
+			first: true,
+			predicate: ["filter"],
+			descendants: true,
+			isSignal: true
+		}],
+		usesInheritance: true,
+		hostDirectives: [{ directive: i1.Bind }],
+		ngImport: i0,
+		template: `
         <div [pBind]="ptm('controls')" [class]="cx('controls')">
             <button [pButton]="upButtonProps()" [disabled]="$moveDisabled()" [attr.aria-label]="moveUpAriaLabel()" (click)="moveUp()" [pButtonPT]="ptm('pcMoveUpButton')" [pButtonUnstyled]="unstyled()" hostName="orderlist">
                 @if (!moveUpIconTemplate()) {
@@ -750,15 +867,189 @@ class OrderList extends BaseComponent {
                 </ng-template>
             }
         </p-listbox>
-    `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ButtonDirective, selector: "[pButton]", inputs: ["pButton", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "link", "rounded", "fluid", "variant", "iconOnly", "loading", "severity"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "component", type: AngleDoubleDown, selector: "svg[data-p-icon=\"angle-double-down\"]" }, { kind: "component", type: AngleDoubleUp, selector: "svg[data-p-icon=\"angle-double-up\"]" }, { kind: "component", type: AngleUp, selector: "svg[data-p-icon=\"angle-up\"]" }, { kind: "component", type: AngleDown, selector: "svg[data-p-icon=\"angle-down\"]" }, { kind: "component", type: Listbox, selector: "p-listbox, p-list-box", inputs: ["hostName", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "ariaLabel", "selectOnFocus", "searchLocale", "focusOnHover", "filterMessage", "filterFields", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "scrollHeight", "tabindex", "multiple", "listStyle", "listStyleClass", "readonly", "checkbox", "filter", "filterBy", "filterMatchMode", "filterLocale", "metaKeySelection", "dataKey", "showToggleAll", "optionLabel", "optionValue", "optionGroupChildren", "optionGroupLabel", "optionDisabled", "ariaFilterLabel", "filterPlaceHolder", "emptyFilterMessage", "emptyMessage", "group", "options", "filterValue", "selectAll", "striped", "highlightOnSelect", "checkmark", "dragdrop", "dropListData", "fluid"], outputs: ["onChange", "onClick", "onDblClick", "onFilter", "onFocus", "onBlur", "onSelectAllChange", "onLazyLoad", "onDrop"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: Bind, selector: "[pBind]", inputs: ["pBind"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: OrderList, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'p-orderlist, p-order-list',
-                    standalone: true,
-                    imports: [NgTemplateOutlet, ButtonDirective, DragDropModule, AngleDoubleDown, AngleDoubleUp, AngleUp, AngleDown, Listbox, FormsModule, Bind],
-                    template: `
+    `,
+		isInline: true,
+		dependencies: [
+			{
+				kind: "directive",
+				type: NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
+			{
+				kind: "directive",
+				type: ButtonDirective,
+				selector: "[pButton]",
+				inputs: [
+					"pButton",
+					"pButtonPT",
+					"pButtonUnstyled",
+					"hostName",
+					"text",
+					"plain",
+					"raised",
+					"size",
+					"outlined",
+					"link",
+					"rounded",
+					"fluid",
+					"variant",
+					"iconOnly",
+					"loading",
+					"severity"
+				]
+			},
+			{
+				kind: "ngmodule",
+				type: DragDropModule
+			},
+			{
+				kind: "component",
+				type: AngleDoubleDown,
+				selector: "svg[data-p-icon=\"angle-double-down\"]"
+			},
+			{
+				kind: "component",
+				type: AngleDoubleUp,
+				selector: "svg[data-p-icon=\"angle-double-up\"]"
+			},
+			{
+				kind: "component",
+				type: AngleUp,
+				selector: "svg[data-p-icon=\"angle-up\"]"
+			},
+			{
+				kind: "component",
+				type: AngleDown,
+				selector: "svg[data-p-icon=\"angle-down\"]"
+			},
+			{
+				kind: "component",
+				type: Listbox,
+				selector: "p-listbox, p-list-box",
+				inputs: [
+					"hostName",
+					"id",
+					"searchMessage",
+					"emptySelectionMessage",
+					"selectionMessage",
+					"autoOptionFocus",
+					"ariaLabel",
+					"selectOnFocus",
+					"searchLocale",
+					"focusOnHover",
+					"filterMessage",
+					"filterFields",
+					"lazy",
+					"virtualScroll",
+					"virtualScrollItemSize",
+					"virtualScrollOptions",
+					"scrollHeight",
+					"tabindex",
+					"multiple",
+					"listStyle",
+					"listStyleClass",
+					"readonly",
+					"checkbox",
+					"filter",
+					"filterBy",
+					"filterMatchMode",
+					"filterLocale",
+					"metaKeySelection",
+					"dataKey",
+					"showToggleAll",
+					"optionLabel",
+					"optionValue",
+					"optionGroupChildren",
+					"optionGroupLabel",
+					"optionDisabled",
+					"ariaFilterLabel",
+					"filterPlaceHolder",
+					"emptyFilterMessage",
+					"emptyMessage",
+					"group",
+					"options",
+					"filterValue",
+					"selectAll",
+					"striped",
+					"highlightOnSelect",
+					"checkmark",
+					"dragdrop",
+					"dropListData",
+					"fluid"
+				],
+				outputs: [
+					"onChange",
+					"onClick",
+					"onDblClick",
+					"onFilter",
+					"onFocus",
+					"onBlur",
+					"onSelectAllChange",
+					"onLazyLoad",
+					"onDrop"
+				]
+			},
+			{
+				kind: "ngmodule",
+				type: FormsModule
+			},
+			{
+				kind: "directive",
+				type: i2.NgControlStatus,
+				selector: "[formControlName],[ngModel],[formControl]"
+			},
+			{
+				kind: "directive",
+				type: i2.NgModel,
+				selector: "[ngModel]:not([formControlName]):not([formControl])",
+				inputs: [
+					"name",
+					"disabled",
+					"ngModel",
+					"ngModelOptions"
+				],
+				outputs: ["ngModelChange"],
+				exportAs: ["ngModel"]
+			},
+			{
+				kind: "directive",
+				type: Bind,
+				selector: "[pBind]",
+				inputs: ["pBind"]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush,
+		encapsulation: i0.ViewEncapsulation.None
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: OrderList,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "p-orderlist, p-order-list",
+			standalone: true,
+			imports: [
+				NgTemplateOutlet,
+				ButtonDirective,
+				DragDropModule,
+				AngleDoubleDown,
+				AngleDoubleUp,
+				AngleUp,
+				AngleDown,
+				Listbox,
+				FormsModule,
+				Bind
+			],
+			template: `
         <div [pBind]="ptm('controls')" [class]="cx('controls')">
             <button [pButton]="upButtonProps()" [disabled]="$moveDisabled()" [attr.aria-label]="moveUpAriaLabel()" (click)="moveUp()" [pButtonPT]="ptm('pcMoveUpButton')" [pButtonUnstyled]="unstyled()" hostName="orderlist">
                 @if (!moveUpIconTemplate()) {
@@ -853,31 +1144,392 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
             }
         </p-listbox>
     `,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    encapsulation: ViewEncapsulation.None,
-                    providers: [OrderListStyle, { provide: ORDERLIST_INSTANCE, useExisting: OrderList }, { provide: PARENT_INSTANCE, useExisting: OrderList }],
-                    host: {
-                        '[class]': "cx('root')"
-                    },
-                    hostDirectives: [Bind]
-                }]
-        }], ctorParameters: () => [], propDecorators: { header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], tabindex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabindex", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaLabelledBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledBy", required: false }] }], listStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "listStyle", required: false }] }], responsive: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsive", required: false }] }], filterBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterBy", required: false }] }], filterPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterPlaceholder", required: false }] }], filterLocale: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterLocale", required: false }] }], metaKeySelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "metaKeySelection", required: false }] }], dragdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "dragdrop", required: false }] }], controlsPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlsPosition", required: false }] }], ariaFilterLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaFilterLabel", required: false }] }], filterMatchMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterMatchMode", required: false }] }], breakpoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "breakpoint", required: false }] }], stripedRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "stripedRows", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], trackBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackBy", required: false }] }], scrollHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollHeight", required: false }] }], autoOptionFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoOptionFocus", required: false }] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }, { type: i0.Output, args: ["selectionChange"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], buttonProps: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonProps", required: false }] }], moveUpButtonProps: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveUpButtonProps", required: false }] }], moveTopButtonProps: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveTopButtonProps", required: false }] }], moveDownButtonProps: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveDownButtonProps", required: false }] }], moveBottomButtonProps: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveBottomButtonProps", required: false }] }], onReorder: [{ type: i0.Output, args: ["onReorder"] }], onSelectionChange: [{ type: i0.Output, args: ["onSelectionChange"] }], onFilterEvent: [{ type: i0.Output, args: ["onFilterEvent"] }], onFocus: [{ type: i0.Output, args: ["onFocus"] }], onBlur: [{ type: i0.Output, args: ["onBlur"] }], listViewChild: [{ type: i0.ViewChild, args: ['listelement', { isSignal: true }] }], filterViewChild: [{ type: i0.ViewChild, args: ['filter', { isSignal: true }] }], itemTemplate: [{ type: i0.ContentChild, args: ['item', { ...{ descendants: false }, isSignal: true }] }], emptyMessageTemplate: [{ type: i0.ContentChild, args: ['empty', { ...{ descendants: false }, isSignal: true }] }], emptyFilterMessageTemplate: [{ type: i0.ContentChild, args: ['emptyfilter', { ...{ descendants: false }, isSignal: true }] }], filterTemplate: [{ type: i0.ContentChild, args: ['filter', { ...{ descendants: false }, isSignal: true }] }], headerTemplate: [{ type: i0.ContentChild, args: ['header', { ...{ descendants: false }, isSignal: true }] }], moveUpIconTemplate: [{ type: i0.ContentChild, args: ['moveupicon', { ...{ descendants: false }, isSignal: true }] }], moveTopIconTemplate: [{ type: i0.ContentChild, args: ['movetopicon', { ...{ descendants: false }, isSignal: true }] }], moveDownIconTemplate: [{ type: i0.ContentChild, args: ['movedownicon', { ...{ descendants: false }, isSignal: true }] }], moveBottomIconTemplate: [{ type: i0.ContentChild, args: ['movebottomicon', { ...{ descendants: false }, isSignal: true }] }], filterIconTemplate: [{ type: i0.ContentChild, args: ['filtericon', { ...{ descendants: false }, isSignal: true }] }] } });
-class OrderListModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: OrderListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.5", ngImport: i0, type: OrderListModule, imports: [OrderList], exports: [OrderList] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: OrderListModule, imports: [OrderList] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: OrderListModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [OrderList],
-                    exports: [OrderList]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			providers: [
+				OrderListStyle,
+				{
+					provide: ORDERLIST_INSTANCE,
+					useExisting: OrderList
+				},
+				{
+					provide: PARENT_INSTANCE,
+					useExisting: OrderList
+				}
+			],
+			host: { "[class]": "cx('root')" },
+			hostDirectives: [Bind]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		header: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "header",
+				required: false
+			}]
+		}],
+		tabindex: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "tabindex",
+				required: false
+			}]
+		}],
+		ariaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaLabel",
+				required: false
+			}]
+		}],
+		ariaLabelledBy: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaLabelledBy",
+				required: false
+			}]
+		}],
+		listStyle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "listStyle",
+				required: false
+			}]
+		}],
+		responsive: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "responsive",
+				required: false
+			}]
+		}],
+		filterBy: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "filterBy",
+				required: false
+			}]
+		}],
+		filterPlaceholder: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "filterPlaceholder",
+				required: false
+			}]
+		}],
+		filterLocale: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "filterLocale",
+				required: false
+			}]
+		}],
+		metaKeySelection: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "metaKeySelection",
+				required: false
+			}]
+		}],
+		dragdrop: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "dragdrop",
+				required: false
+			}]
+		}],
+		controlsPosition: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "controlsPosition",
+				required: false
+			}]
+		}],
+		ariaFilterLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaFilterLabel",
+				required: false
+			}]
+		}],
+		filterMatchMode: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "filterMatchMode",
+				required: false
+			}]
+		}],
+		breakpoint: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "breakpoint",
+				required: false
+			}]
+		}],
+		stripedRows: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "stripedRows",
+				required: false
+			}]
+		}],
+		disabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disabled",
+				required: false
+			}]
+		}],
+		trackBy: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "trackBy",
+				required: false
+			}]
+		}],
+		scrollHeight: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "scrollHeight",
+				required: false
+			}]
+		}],
+		autoOptionFocus: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "autoOptionFocus",
+				required: false
+			}]
+		}],
+		dataKey: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "dataKey",
+				required: false
+			}]
+		}],
+		selection: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "selection",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["selectionChange"]
+		}],
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["valueChange"]
+		}],
+		buttonProps: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "buttonProps",
+				required: false
+			}]
+		}],
+		moveUpButtonProps: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "moveUpButtonProps",
+				required: false
+			}]
+		}],
+		moveTopButtonProps: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "moveTopButtonProps",
+				required: false
+			}]
+		}],
+		moveDownButtonProps: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "moveDownButtonProps",
+				required: false
+			}]
+		}],
+		moveBottomButtonProps: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "moveBottomButtonProps",
+				required: false
+			}]
+		}],
+		onReorder: [{
+			type: i0.Output,
+			args: ["onReorder"]
+		}],
+		onSelectionChange: [{
+			type: i0.Output,
+			args: ["onSelectionChange"]
+		}],
+		onFilterEvent: [{
+			type: i0.Output,
+			args: ["onFilterEvent"]
+		}],
+		onFocus: [{
+			type: i0.Output,
+			args: ["onFocus"]
+		}],
+		onBlur: [{
+			type: i0.Output,
+			args: ["onBlur"]
+		}],
+		listViewChild: [{
+			type: i0.ViewChild,
+			args: ["listelement", { isSignal: true }]
+		}],
+		filterViewChild: [{
+			type: i0.ViewChild,
+			args: ["filter", { isSignal: true }]
+		}],
+		itemTemplate: [{
+			type: i0.ContentChild,
+			args: ["item", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		emptyMessageTemplate: [{
+			type: i0.ContentChild,
+			args: ["empty", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		emptyFilterMessageTemplate: [{
+			type: i0.ContentChild,
+			args: ["emptyfilter", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		filterTemplate: [{
+			type: i0.ContentChild,
+			args: ["filter", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		headerTemplate: [{
+			type: i0.ContentChild,
+			args: ["header", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		moveUpIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["moveupicon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		moveTopIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["movetopicon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		moveDownIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["movedownicon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		moveBottomIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["movebottomicon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		filterIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["filtericon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}]
+	}
+});
+var OrderListModule = class OrderListModule {
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: OrderListModule,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.NgModule
+	});
+	static ɵmod = i0.ɵɵngDeclareNgModule({
+		minVersion: "14.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: OrderListModule,
+		imports: [OrderList],
+		exports: [OrderList]
+	});
+	static ɵinj = i0.ɵɵngDeclareInjector({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: OrderListModule,
+		imports: [OrderList]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: OrderListModule,
+	decorators: [{
+		type: NgModule,
+		args: [{
+			imports: [OrderList],
+			exports: [OrderList]
+		}]
+	}]
+});
 export { OrderList, OrderListClasses, OrderListModule, OrderListStyle };
-//# sourceMappingURL=primeng-orderlist.mjs.map
+