@soxa-ui/vue 0.0.0-stage → 0.3.0-beta.1

package/dist/components/list-box/index.js

@@ -0,0 +1,17 @@
+import { emitsListBoxItem, propsListBoxItem } from "./item/base.component.js";
+import { ListBoxItem } from "./item/index.js";
+import { emitsListBoxGroup, propsListBoxGroup } from "./group/base.component.js";
+import { ListBoxGroup } from "./group/index.js";
+import { emitsListBox, propsListBox } from "./base.component.js";
+import ListBox_default from "./ListBox.js";
+import { withParts } from "@soxa-ui/setup";
+/**
+* Основная форма — `<ListBox.Item>` и `<ListBox.Group>`; плоские `ListBoxItem`
+* и `ListBoxGroup` работают так же.
+*/
+var ListBox = withParts(ListBox_default, {
+	Item: ListBoxItem,
+	Group: ListBoxGroup
+});
+//#endregion
+export { ListBox, ListBoxGroup, ListBoxItem, emitsListBox, emitsListBoxGroup, emitsListBoxItem, propsListBox, propsListBoxGroup, propsListBoxItem };

package/dist/components/list-box/item/Item.js

@@ -0,0 +1,69 @@
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.js";
+import Item_vue_vue_type_script_lang_default from "./Item.vue_vue_type_script_lang.js";
+import { createBlock, createCommentVNode, createElementBlock, createTextVNode, createVNode, mergeProps, openBlock, renderSlot, resolveComponent, resolveDynamicComponent, toDisplayString, vShow, withCtx, withDirectives } from "vue";
+//#region src/components/list-box/item/Item.vue
+var _hoisted_1 = {
+	key: 0,
+	class: "so-list-box-item__indicator",
+	"aria-hidden": "true"
+};
+var _hoisted_2 = {
+	key: 0,
+	class: "so-list-box-item__indicator",
+	"aria-hidden": "true"
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+	const _component_Icon = resolveComponent("Icon");
+	const _component_ItemRow = resolveComponent("ItemRow");
+	return _ctx.rendered ? withDirectives((openBlock(), createBlock(resolveDynamicComponent(_ctx.tag), mergeProps({
+		key: 0,
+		ref: "rootElement",
+		class: _ctx.classes,
+		style: { order: _ctx.order }
+	}, {
+		..._ctx.dataset,
+		..._ctx.containerAttrs,
+		..._ctx.attrs
+	}), {
+		default: withCtx(() => [createVNode(_component_ItemRow, mergeProps({
+			embedded: "list-box.row",
+			tag: "div",
+			view: _ctx.view,
+			disabled: _ctx.disabled,
+			size: _ctx.size,
+			variant: _ctx.variant,
+			onClick: _cache[0] || (_cache[0] = ($event) => _ctx.context?.adapters.list.choose())
+		}, {
+			..._ctx.aria,
+			..._ctx.dataset,
+			..._ctx.controlAttrs
+		}), {
+			leading: withCtx(() => [_ctx.indicator === "start" ? (openBlock(), createElementBlock("span", _hoisted_1, [renderSlot(_ctx.$slots, "indicator-icon", { selected: _ctx.selected }, () => [_ctx.selected ? (openBlock(), createBlock(_component_Icon, {
+				key: 0,
+				embedded: "list-box.indicator",
+				tag: _ctx.indicatorIconTag,
+				size: _ctx.size
+			}, null, 8, ["tag", "size"])) : createCommentVNode("", true)])])) : createCommentVNode("", true), renderSlot(_ctx.$slots, "leading")]),
+			trailing: withCtx(() => [renderSlot(_ctx.$slots, "trailing"), _ctx.indicator === "end" ? (openBlock(), createElementBlock("span", _hoisted_2, [renderSlot(_ctx.$slots, "indicator-icon", { selected: _ctx.selected }, () => [_ctx.selected ? (openBlock(), createBlock(_component_Icon, {
+				key: 0,
+				embedded: "list-box.indicator",
+				tag: _ctx.indicatorIconTag,
+				size: _ctx.size
+			}, null, 8, ["tag", "size"])) : createCommentVNode("", true)])])) : createCommentVNode("", true)]),
+			default: withCtx(() => [renderSlot(_ctx.$slots, "default", {
+				text: _ctx.text,
+				selected: _ctx.selected
+			}, () => [createTextVNode(toDisplayString(_ctx.text), 1)])]),
+			_: 3
+		}, 16, [
+			"view",
+			"disabled",
+			"size",
+			"variant"
+		])]),
+		_: 3
+	}, 16, ["class", "style"])), [[vShow, _ctx.visible]]) : createCommentVNode("", true);
+}
+var Item_default = /*#__PURE__*/ _plugin_vue_export_helper_default(Item_vue_vue_type_script_lang_default, [["render", _sfc_render]]);
+//#endregion
+export { Item_default as default };

package/dist/components/list-box/item/Item.vue.d.ts

@@ -0,0 +1,203 @@
+/**
+ * Обёртка отметки рисуется, пока `indicator` не `none` — и у невыбранных тоже:
+ * она резервирует место, иначе строка прыгала бы при выборе. Иконка внутри —
+ * только у выбранного.
+ *
+ * Сторона логическая (`start`/`end`), поэтому в RTL отметка сама оказывается с
+ * нужного края: `dir` стоит на корне элемента, а строка — flex.
+ *
+ * `aria-hidden`: отметка декоративна, состояние скринридеру объявляет
+ * `aria-selected`. Два источника одного факта дали бы двойное объявление.
+ */
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<{
+    name?: string | undefined;
+    rendered?: boolean | undefined;
+    visible?: boolean | undefined;
+    tag?: string | object | undefined;
+    direction?: import("@soxa-ui/core").TDirection | undefined;
+    text?: string | undefined;
+    disabled?: boolean | undefined;
+    focused?: boolean | undefined;
+    selected?: boolean | undefined;
+    value?: string | number | undefined;
+    contentFit?: import("@soxa-ui/core").TListItemContentFit | undefined;
+    aria_label?: string | undefined;
+    aria_labelledBy?: string | undefined;
+    aria_describedBy?: string | undefined;
+    id?: string | undefined;
+    ctrl?: import("@soxa-ui/core").IListBoxItem<import("@soxa-ui/core").IListBoxItemProps, import("@soxa-ui/core").TListBoxItemEvents> | undefined;
+    embedded?: string | undefined;
+    pluginProps?: import("@soxa-ui/setup").TExternalPluginProps | undefined;
+}, Omit<import("../../../adapter/runtime/useAdapter").TBindingFields<import("@soxa-ui/setup").TContextContract<import("@soxa-ui/core").IListBoxItem<import("@soxa-ui/core").IListBoxItemProps, import("@soxa-ui/core").TListBoxItemEvents>, {
+    props: object & {} & {} & {} & {
+        aria_label?: string | undefined;
+        aria_labelledBy?: string | undefined;
+        aria_describedBy?: string | undefined;
+    } & {} & {} & {
+        id?: string | undefined;
+    } & {};
+    events: object & {
+        "element:ready": (element: Element) => void;
+        "element:removed": () => void;
+    } & {} & {
+        "aria:change:label": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+        "aria:change:labelledBy": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+        "aria:change:describedBy": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+    } & {
+        "action:blur": (event: FocusEvent) => void;
+        "action:click": (event: MouseEvent) => void;
+        "action:focus": (event: FocusEvent) => void;
+        "action:press": (event: MouseEvent) => void;
+    } & {} & {
+        "change:id": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+    } & {};
+    outputs: object & {} & {} & {} & {} & {} & {
+        readonly listItem_highlighted: boolean;
+    } & {} & {};
+}>> & import("../../../adapter/runtime/useAdapter").TUnwrapRefs<import("./base.component").ListBoxItemProps> & import("../../../adapter/runtime/useAdapter").TExtractControllerState<object & import("@soxa-ui/core").IListBoxItem<import("@soxa-ui/core").IListBoxItemProps, import("@soxa-ui/core").TListBoxItemEvents>> & import("@soxa-ui/setup").TInstanceState<object & {} & {} & {} & {} & {} & {
+    readonly listItem_highlighted: boolean;
+} & {} & {}> & {
+    plugins: import("@soxa-ui/plugins").IPluginBundle | null;
+} & import("../../../adapter/runtime/useAdapter").TExtractControllerState<object & import("@soxa-ui/core").TListBoxItemCollectionFacade> & object, "context" | "indicatorIconTag" | "containerAttrs" | "controlAttrs"> & {
+    containerAttrs: import("vue").ComputedRef<Record<string, unknown>>;
+    controlAttrs: import("vue").ComputedRef<{
+        [x: string]: unknown;
+    }>;
+    context: import("@soxa-ui/core").TItemContext<import("@soxa-ui/core").IListBoxItem<import("@soxa-ui/core").IListBoxItemProps, import("@soxa-ui/core").TListBoxItemEvents>, import("@soxa-ui/core").TListBoxCollectionExtensions> | undefined;
+    indicatorIconTag: import("vue").Component;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, {
+    name: string;
+    emits: import("../../../types").TEmits;
+    props: Readonly<Record<string, unknown>>;
+}, {}, string, import("vue").PublicProps, Readonly<{
+    name?: string | undefined;
+    rendered?: boolean | undefined;
+    visible?: boolean | undefined;
+    tag?: string | object | undefined;
+    direction?: import("@soxa-ui/core").TDirection | undefined;
+    text?: string | undefined;
+    disabled?: boolean | undefined;
+    focused?: boolean | undefined;
+    selected?: boolean | undefined;
+    value?: string | number | undefined;
+    contentFit?: import("@soxa-ui/core").TListItemContentFit | undefined;
+    aria_label?: string | undefined;
+    aria_labelledBy?: string | undefined;
+    aria_describedBy?: string | undefined;
+    id?: string | undefined;
+    ctrl?: import("@soxa-ui/core").IListBoxItem<import("@soxa-ui/core").IListBoxItemProps, import("@soxa-ui/core").TListBoxItemEvents> | undefined;
+    embedded?: string | undefined;
+    pluginProps?: import("@soxa-ui/setup").TExternalPluginProps | undefined;
+}> & Readonly<{}>, {}, {}, {
+    Icon: import("../../../adapter").TClosedComponent<import("vue").DefineComponent<{
+        size?: import("@soxa-ui/core").TComponentSize | undefined;
+        width?: number | string | undefined;
+        height?: number | string | undefined;
+        rendered?: boolean | undefined;
+        visible?: boolean | undefined;
+        tag?: string | object | undefined;
+        direction?: import("@soxa-ui/core").TDirection | undefined;
+        aria_label?: string | undefined;
+        aria_labelledBy?: string | undefined;
+        aria_describedBy?: string | undefined;
+        ctrl?: import("@soxa-ui/core").IIcon | undefined;
+        embedded?: string | undefined;
+        pluginProps?: import("@soxa-ui/setup").TExternalPluginProps | undefined;
+    }, import("../../../adapter/runtime/useAdapter").TBinding<import("@soxa-ui/setup").TContextContract<import("@soxa-ui/core").IIcon, {
+        props: object & {} & {} & {} & {
+            aria_label?: string | undefined;
+            aria_labelledBy?: string | undefined;
+            aria_describedBy?: string | undefined;
+        };
+        events: object & {
+            "element:ready": (element: Element) => void;
+            "element:removed": () => void;
+        } & {} & {} & {
+            "aria:change:label": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+            "aria:change:labelledBy": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+            "aria:change:describedBy": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+        };
+        outputs: object & {} & {} & {
+            readonly layout_styles: Record<string, string | number>;
+        } & {};
+    }>, import("../../..").IconProps>, {}, {}, {}, import("vue").ComponentOptionsMixin, {
+        name: string;
+        emits: import("../../../types").TEmits;
+        props: Readonly<Record<string, unknown>>;
+    }, {}, string, import("vue").PublicProps, Readonly<{
+        size?: import("@soxa-ui/core").TComponentSize | undefined;
+        width?: number | string | undefined;
+        height?: number | string | undefined;
+        rendered?: boolean | undefined;
+        visible?: boolean | undefined;
+        tag?: string | object | undefined;
+        direction?: import("@soxa-ui/core").TDirection | undefined;
+        aria_label?: string | undefined;
+        aria_labelledBy?: string | undefined;
+        aria_describedBy?: string | undefined;
+        ctrl?: import("@soxa-ui/core").IIcon | undefined;
+        embedded?: string | undefined;
+        pluginProps?: import("@soxa-ui/setup").TExternalPluginProps | undefined;
+    }> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;
+    ItemRow: import("../../../adapter").TClosedComponent<import("vue").DefineComponent<{
+        variant?: import("@soxa-ui/core").TComponentVariant | undefined;
+        view?: import("@soxa-ui/core").TButtonView | undefined;
+        text?: string | undefined;
+        disabled?: boolean | undefined;
+        focused?: boolean | undefined;
+        size?: import("@soxa-ui/core").TComponentSize | undefined;
+        rendered?: boolean | undefined;
+        visible?: boolean | undefined;
+        tag?: string | object | undefined;
+        direction?: import("@soxa-ui/core").TDirection | undefined;
+        aria_label?: string | undefined;
+        aria_labelledBy?: string | undefined;
+        aria_describedBy?: string | undefined;
+        ctrl?: import("@soxa-ui/core").IButton | undefined;
+        embedded?: string | undefined;
+        pluginProps?: import("@soxa-ui/setup").TExternalPluginProps | undefined;
+    }, import("../../../adapter/runtime/useAdapter").TBinding<import("@soxa-ui/setup").TContextContract<import("@soxa-ui/core").IButton, {
+        props: object & {} & {} & {} & {
+            aria_label?: string | undefined;
+            aria_labelledBy?: string | undefined;
+            aria_describedBy?: string | undefined;
+        };
+        events: object & {
+            "element:ready": (element: Element) => void;
+            "element:removed": () => void;
+        } & {} & {
+            "aria:change:label": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+            "aria:change:labelledBy": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+            "aria:change:describedBy": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+        } & {
+            "action:blur": (event: FocusEvent) => void;
+            "action:click": (event: MouseEvent) => void;
+            "action:focus": (event: FocusEvent) => void;
+            "action:press": (event: MouseEvent) => void;
+        };
+        outputs: object & {} & {} & {} & {};
+    }>, import("../../..").ButtonProps>, {}, {}, {}, import("vue").ComponentOptionsMixin, {
+        name: string;
+        emits: import("../../../types").TEmits;
+        props: Readonly<Record<string, unknown>>;
+    }, {}, string, import("vue").PublicProps, Readonly<{
+        variant?: import("@soxa-ui/core").TComponentVariant | undefined;
+        view?: import("@soxa-ui/core").TButtonView | undefined;
+        text?: string | undefined;
+        disabled?: boolean | undefined;
+        focused?: boolean | undefined;
+        size?: import("@soxa-ui/core").TComponentSize | undefined;
+        rendered?: boolean | undefined;
+        visible?: boolean | undefined;
+        tag?: string | object | undefined;
+        direction?: import("@soxa-ui/core").TDirection | undefined;
+        aria_label?: string | undefined;
+        aria_labelledBy?: string | undefined;
+        aria_describedBy?: string | undefined;
+        ctrl?: import("@soxa-ui/core").IButton | undefined;
+        embedded?: string | undefined;
+        pluginProps?: import("@soxa-ui/setup").TExternalPluginProps | undefined;
+    }> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;
+}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/components/list-box/item/Item.vue_vue_type_script_lang.js

@@ -0,0 +1,24 @@
+import { Icon } from "../../icon/index.js";
+import { ItemRow } from "../../item-row/index.js";
+import setup_component_default from "./setup.component.js";
+//#region src/components/list-box/item/Item.vue?vue&type=script&lang.ts
+/**
+* Обёртка отметки рисуется, пока `indicator` не `none` — и у невыбранных тоже:
+* она резервирует место, иначе строка прыгала бы при выборе. Иконка внутри —
+* только у выбранного.
+*
+* Сторона логическая (`start`/`end`), поэтому в RTL отметка сама оказывается с
+* нужного края: `dir` стоит на корне элемента, а строка — flex.
+*
+* `aria-hidden`: отметка декоративна, состояние скринридеру объявляет
+* `aria-selected`. Два источника одного факта дали бы двойное объявление.
+*/
+var Item_vue_vue_type_script_lang_default = {
+	...setup_component_default,
+	components: {
+		Icon,
+		ItemRow
+	}
+};
+//#endregion
+export { Item_vue_vue_type_script_lang_default as default };

package/dist/components/list-box/item/base.component.d.ts

@@ -0,0 +1,12 @@
+import type { TEmits, TProps, UseProps } from '../../../types/common';
+import { ListBoxItemDescriptor } from '@soxa-ui/setup';
+import type { IListBoxItem } from '@soxa-ui/core';
+export declare const emitsListBoxItem: TEmits;
+export declare const propsListBoxItem: TProps;
+export type ListBoxItemProps = UseProps<typeof ListBoxItemDescriptor, IListBoxItem>;
+declare const _default: {
+    name: string;
+    emits: TEmits;
+    props: Readonly<Record<string, unknown>>;
+};
+export default _default;

package/dist/components/list-box/item/base.component.js

@@ -0,0 +1,16 @@
+import { useProps } from "../../../adapter/static/useProps.js";
+import { useEmits } from "../../../adapter/static/useEmits.js";
+import { ListBoxCollectionItemDescriptor, ListBoxItemDescriptor } from "@soxa-ui/setup";
+//#region src/components/list-box/item/base.component.ts
+var emitsListBoxItem = [...useEmits(ListBoxItemDescriptor()), ...useEmits(ListBoxCollectionItemDescriptor())];
+var propsListBoxItem = {
+	...useProps(ListBoxItemDescriptor()),
+	...useProps(ListBoxCollectionItemDescriptor())
+};
+var base_component_default = {
+	name: "BaseListBoxItem",
+	emits: emitsListBoxItem,
+	props: propsListBoxItem
+};
+//#endregion
+export { base_component_default as default, emitsListBoxItem, propsListBoxItem };

package/dist/components/list-box/item/index.d.ts

@@ -0,0 +1,5 @@
+import type { TClosedComponent } from '../../../adapter';
+import ListBoxItemComponent from './Item.vue';
+export * from './base.component';
+export { default as BaseListBoxItem } from './base.component';
+export declare const ListBoxItem: TClosedComponent<typeof ListBoxItemComponent>;

package/dist/components/list-box/item/index.js

@@ -0,0 +1,6 @@
+import { emitsListBoxItem, propsListBoxItem } from "./base.component.js";
+import Item_default from "./Item.js";
+//#region src/components/list-box/item/index.ts
+var ListBoxItem = Item_default;
+//#endregion
+export { ListBoxItem, emitsListBoxItem, propsListBoxItem };

package/dist/components/list-box/item/setup.component.d.ts

@@ -0,0 +1,51 @@
+import { type SetupContext } from '../../../adapter';
+import { type ListBoxItemProps } from './base.component';
+declare const _default: {
+    name: string;
+    inheritAttrs: boolean;
+    extends: {
+        name: string;
+        emits: import("../../../types").TEmits;
+        props: Readonly<Record<string, unknown>>;
+    };
+    expose: string[];
+    setup(props: ListBoxItemProps, { emit }: SetupContext): Omit<import("../../../adapter/runtime/useAdapter").TBindingFields<import("@soxa-ui/setup").TContextContract<import("@soxa-ui/core").IListBoxItem<import("@soxa-ui/core").IListBoxItemProps, import("@soxa-ui/core").TListBoxItemEvents>, {
+        props: object & {} & {} & {} & {
+            aria_label?: string | undefined;
+            aria_labelledBy?: string | undefined;
+            aria_describedBy?: string | undefined;
+        } & {} & {} & {
+            id?: string | undefined;
+        } & {};
+        events: object & {
+            "element:ready": (element: Element) => void;
+            "element:removed": () => void;
+        } & {} & {
+            "aria:change:label": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+            "aria:change:labelledBy": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+            "aria:change:describedBy": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+        } & {
+            "action:blur": (event: FocusEvent) => void;
+            "action:click": (event: MouseEvent) => void;
+            "action:focus": (event: FocusEvent) => void;
+            "action:press": (event: MouseEvent) => void;
+        } & {} & {
+            "change:id": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+        } & {};
+        outputs: object & {} & {} & {} & {} & {} & {
+            readonly listItem_highlighted: boolean;
+        } & {} & {};
+    }>> & import("../../../adapter/runtime/useAdapter").TUnwrapRefs<ListBoxItemProps> & import("../../../adapter/runtime/useAdapter").TExtractControllerState<object & import("@soxa-ui/core").IListBoxItem<import("@soxa-ui/core").IListBoxItemProps, import("@soxa-ui/core").TListBoxItemEvents>> & import("@soxa-ui/setup").TInstanceState<object & {} & {} & {} & {} & {} & {
+        readonly listItem_highlighted: boolean;
+    } & {} & {}> & {
+        plugins: import("@soxa-ui/plugins").IPluginBundle | null;
+    } & import("../../../adapter/runtime/useAdapter").TExtractControllerState<object & import("@soxa-ui/core").TListBoxItemCollectionFacade> & object, "context" | "indicatorIconTag" | "containerAttrs" | "controlAttrs"> & {
+        containerAttrs: import("vue").ComputedRef<Record<string, unknown>>;
+        controlAttrs: import("vue").ComputedRef<{
+            [x: string]: unknown;
+        }>;
+        context: import("@soxa-ui/core").TItemContext<import("@soxa-ui/core").IListBoxItem<import("@soxa-ui/core").IListBoxItemProps, import("@soxa-ui/core").TListBoxItemEvents>, import("@soxa-ui/core").TListBoxCollectionExtensions> | undefined;
+        indicatorIconTag: import("vue").Component;
+    };
+};
+export default _default;

package/dist/components/list-box/item/setup.component.js

@@ -0,0 +1,36 @@
+import { roleIcon } from "../../../adapter/common/icon.js";
+import { useSplitAttrs } from "../../../adapter/common/useSplitAttrs.js";
+import { createVueAdapterContext } from "../../../adapter/common/createVueAdapterContext.js";
+import { useExpose } from "../../../adapter/static/useExpose.js";
+import { extendBinding, joinBindings } from "../../../adapter/runtime/view.js";
+import { useAdapter } from "../../../adapter/runtime/useAdapter.js";
+import { useCollectionAdapter } from "../../../adapter/runtime/useCollectionAdapter.js";
+import { VueElevatorFactory } from "../../../adapter/elevator/factory.js";
+import base_component_default from "./base.component.js";
+import { ListBoxCollectionItemDescriptor, ListBoxItemDescriptor, TCollectionItemExtension } from "@soxa-ui/setup";
+//#region src/components/list-box/item/setup.component.ts
+var setup_component_default = {
+	name: "_ListBoxItem",
+	inheritAttrs: false,
+	extends: base_component_default,
+	expose: useExpose(),
+	setup(props, { emit }) {
+		const adapter = createVueAdapterContext(ListBoxItemDescriptor(), {
+			ctrl: props.ctrl,
+			props
+		});
+		const itemAdapter = createVueAdapterContext(ListBoxCollectionItemDescriptor(), { props }, { bundle: adapter.bundle }).use(TCollectionItemExtension, {
+			adapter,
+			elevator: VueElevatorFactory
+		});
+		const itemBinding = useCollectionAdapter(itemAdapter, props, emit);
+		const ownerBinding = useAdapter(adapter, props, emit);
+		return extendBinding(joinBindings(ownerBinding, itemBinding), {
+			context: itemAdapter.instance.context,
+			indicatorIconTag: roleIcon("check"),
+			...useSplitAttrs()
+		});
+	}
+};
+//#endregion
+export { setup_component_default as default };

package/dist/components/list-box/setup.component.d.ts

@@ -0,0 +1,41 @@
+import { type SetupContext } from '../../adapter';
+import { type ListBoxProps } from './base.component';
+declare const _default: {
+    name: string;
+    inheritAttrs: boolean;
+    extends: {
+        name: string;
+        emits: import("../../types").TEmits;
+        props: Readonly<Record<string, unknown>>;
+    };
+    expose: string[];
+    setup(props: ListBoxProps, { emit }: SetupContext): Omit<import("../../adapter/runtime/useAdapter").TBindingFields<import("@soxa-ui/setup").TContextContract<import("@soxa-ui/core").IListBox<import("@soxa-ui/core").IListBoxProps, import("@soxa-ui/core").TListBoxEvents>, {
+        props: object & {} & {} & {} & {
+            aria_label?: string | undefined;
+            aria_labelledBy?: string | undefined;
+            aria_describedBy?: string | undefined;
+        } & {} & {} & {} & {} & {} & {} & {};
+        events: object & {
+            "element:ready": (element: Element) => void;
+            "element:removed": () => void;
+        } & {} & {
+            "aria:change:label": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+            "aria:change:labelledBy": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+            "aria:change:describedBy": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+        } & {
+            "action:blur": (event: FocusEvent) => void;
+            "action:click": (event: MouseEvent) => void;
+            "action:focus": (event: FocusEvent) => void;
+            "action:press": (event: MouseEvent) => void;
+        } & {} & {} & {} & {} & {} & {};
+        outputs: object & {} & {} & {} & {} & {} & {} & {} & {} & {} & {} & {};
+    }>> & import("../../adapter/runtime/useAdapter").TUnwrapRefs<ListBoxProps> & import("../../adapter/runtime/useAdapter").TExtractControllerState<object & import("@soxa-ui/core").IListBox<import("@soxa-ui/core").IListBoxProps, import("@soxa-ui/core").TListBoxEvents>> & import("@soxa-ui/setup").TInstanceState<object & {} & {} & {} & {} & {} & {} & {} & {} & {} & {} & {}> & {
+        plugins: import("@soxa-ui/plugins").IPluginBundle | null;
+    } & import("../../adapter/runtime/useAdapter").TExtractControllerState<object & import("@soxa-ui/core").TListBoxCollectionFacade> & object, "containerAttrs" | "controlAttrs"> & {
+        containerAttrs: import("vue").ComputedRef<Record<string, unknown>>;
+        controlAttrs: import("vue").ComputedRef<{
+            [x: string]: unknown;
+        }>;
+    };
+};
+export default _default;

package/dist/components/list-box/setup.component.js

@@ -0,0 +1,34 @@
+import { useSplitAttrs } from "../../adapter/common/useSplitAttrs.js";
+import { createVueAdapterContext } from "../../adapter/common/createVueAdapterContext.js";
+import { useExpose } from "../../adapter/static/useExpose.js";
+import { extendBinding, joinBindings } from "../../adapter/runtime/view.js";
+import { useAdapter } from "../../adapter/runtime/useAdapter.js";
+import { useCollectionAdapter } from "../../adapter/runtime/useCollectionAdapter.js";
+import { VueElevatorFactory } from "../../adapter/elevator/factory.js";
+import base_component_default from "./base.component.js";
+import { ListBoxCollectionDescriptor, ListBoxDescriptor, TCollectionExtension, TDragAndDropCollectionExtension, TVirtualCollectionExtension } from "@soxa-ui/setup";
+//#region src/components/list-box/setup.component.ts
+var setup_component_default = {
+	name: "_ListBox",
+	inheritAttrs: false,
+	extends: base_component_default,
+	expose: useExpose(),
+	setup(props, { emit }) {
+		const adapter = createVueAdapterContext(ListBoxDescriptor(), {
+			ctrl: props.ctrl,
+			props
+		});
+		const collectionAdapter = createVueAdapterContext(ListBoxCollectionDescriptor(), {
+			props,
+			options: {
+				owner: adapter.instance,
+				engine: props.engine
+			}
+		}, { bundle: adapter.bundle }).use(TCollectionExtension, { elevator: VueElevatorFactory }).use(TDragAndDropCollectionExtension, { elevator: VueElevatorFactory }).use(TVirtualCollectionExtension, { elevator: VueElevatorFactory });
+		const refsCollection = useCollectionAdapter(collectionAdapter, props, emit);
+		const refs = useAdapter(adapter, props, emit);
+		return extendBinding(joinBindings(refs, refsCollection), useSplitAttrs());
+	}
+};
+//#endregion
+export { setup_component_default as default };