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

package/dist/components/item-row/ItemRow.element.js

@@ -0,0 +1,53 @@
+import { defineElement } from "../../adapter/runtime/defineElement.js";
+import { ElementBase } from "../../adapter/runtime/element.base.js";
+import "../../adapter/index.js";
+import { buttonTemplate } from "../button/button.template.js";
+import { setupItemRow } from "./setup.component.js";
+import { ItemRowDescriptor } from "@soxa-ui/setup";
+//#region src/components/item-row/ItemRow.element.ts
+/**
+* Строка элемента коллекции — деталь разметки ListBox.Item, опции Select,
+* пунктов меню и тега: `<div is="so-item-row-div">`, у опции Select —
+* `<span is="so-item-row-span">`. Свойства, шаблон и разметка — Button
+* (`buttonTemplate`), сборка своя — по `ItemRowDescriptor`: её экземпляр
+* (`TItemRow`) роль и остановку Tab себе не пишет, их несёт набор `aria`
+* элемента, который разметка кладёт на строку.
+*
+* Экземпляр создаёт подключение элемента и отпускает его отключение: строка
+* живёт, пока стоит в документе, и окно `Virtual` держит их столько, сколько
+* показывает.
+*
+* Своего элемента на теге по умолчанию (`<button>`) у строки нет: на кнопке
+* выключенный элемент терял бы фокус и клик. Только теги строк, под именем с
+* тегом (AGENTS.md, «Элемент Web Components на другом теге»).
+*/
+/** Одно описание на все теги строки. */
+var ITEM_ROW = {
+	descriptor: ItemRowDescriptor,
+	template: buttonTemplate,
+	setup: setupItemRow
+};
+function variant(Native) {
+	return ElementBase(Native, ITEM_ROW);
+}
+/** Класс тега создаётся и регистрируется при первом обращении; чужой нативный класс не компилируется. */
+function registration(tag, Native) {
+	let element;
+	return () => {
+		if (!element) {
+			element = variant(Native);
+			defineElement(`so-item-row-${tag}`, element, tag);
+		}
+		return element;
+	};
+}
+var REGISTRATIONS = {
+	div: registration("div", HTMLDivElement),
+	span: registration("span", HTMLSpanElement)
+};
+/** `<div is="so-item-row-div">`, `<span is="so-item-row-span">` — регистрирует разметка, где тег нужен. */
+function registerItemRowTag(tag) {
+	return REGISTRATIONS[tag]();
+}
+//#endregion
+export { registerItemRowTag };

package/dist/components/item-row/index.d.ts

@@ -0,0 +1 @@
+export { registerItemRowTag, type TItemRowElementProps, type TItemRowTag, type TItemRowTagClass, } from './ItemRow.element';

package/dist/components/item-row/index.js

@@ -0,0 +1 @@
+export { registerItemRowTag } from "./ItemRow.element.js";

package/dist/components/item-row/setup.component.d.ts

@@ -0,0 +1,3 @@
+import type { IButton } from '@soxa-ui/core';
+import type { TBinding, TUpdateListener } from '../../adapter';
+export declare function setupItemRow(host: HTMLElement, ctrl: IButton | undefined, props: Record<string, unknown>, onUpdate: TUpdateListener): TBinding<IButton>;

package/dist/components/item-row/setup.component.js

@@ -0,0 +1,14 @@
+import { createWebcAdapterContext } from "../../adapter/common/createWebcAdapterContext.js";
+import { useAdapter } from "../../adapter/runtime/useAdapter.js";
+import "../../adapter/index.js";
+import { ItemRowDescriptor } from "@soxa-ui/setup";
+//#region src/components/item-row/setup.component.ts
+function setupItemRow(host, ctrl, props, onUpdate) {
+	const adapter = createWebcAdapterContext(host, ItemRowDescriptor(), {
+		ctrl,
+		props
+	});
+	return useAdapter(adapter, host, onUpdate);
+}
+//#endregion
+export { setupItemRow };

package/dist/components/label/Label.element.d.ts

@@ -0,0 +1,9 @@
+/**
+ * `<label is="so-label">` — подпись: контрол — первый labelable-потомок, связки
+ * через `for` и `id` нет. docs/architecture.md, Layer 8d, «Подпись».
+ */
+import { LabelDescriptor } from '@soxa-ui/setup';
+import type { ILabel } from '@soxa-ui/core';
+import type { TElementClassOf, TElementType } from '../../adapter';
+export declare const TLabelElement: TElementClassOf<typeof HTMLLabelElement, typeof LabelDescriptor, ILabel>;
+export type TLabelElementProps = TElementType<typeof TLabelElement>;

package/dist/components/label/Label.element.js

@@ -0,0 +1,19 @@
+import { defineElement } from "../../adapter/runtime/defineElement.js";
+import { ElementBase } from "../../adapter/runtime/element.base.js";
+import "../../adapter/index.js";
+import { labelTemplate } from "./label.template.js";
+import { setupLabel } from "./setup.component.js";
+import { LabelDescriptor } from "@soxa-ui/setup";
+//#region src/components/label/Label.element.ts
+/**
+* `<label is="so-label">` — подпись: контрол — первый labelable-потомок, связки
+* через `for` и `id` нет. docs/architecture.md, Layer 8d, «Подпись».
+*/
+var TLabelElement = ElementBase(HTMLLabelElement, {
+	descriptor: LabelDescriptor,
+	template: labelTemplate,
+	setup: setupLabel
+});
+defineElement("so-label", TLabelElement, "label");
+//#endregion
+export { TLabelElement };

package/dist/components/label/index.d.ts

@@ -0,0 +1,3 @@
+/** Application API for this element entry. */
+export { TLabelElement } from './Label.element';
+export type { TLabelElementProps } from './Label.element';

package/dist/components/label/index.js

@@ -0,0 +1 @@
+export { TLabelElement } from "./Label.element.js";

package/dist/components/label/label.template.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Шаблон Label: контрол (слот `default`), потом текст (`content` или проп
+ * `text`); сторону рисует тема. Контрол — CheckBox, Switch или радио с
+ * `tag="span"`: `label` в `label` запрещён.
+ */
+import type { ILabel } from '@soxa-ui/core';
+import { type ITemplate } from '../../adapter';
+export declare const labelTemplate: ITemplate<ILabel>;

package/dist/components/label/label.template.js

@@ -0,0 +1,33 @@
+import { bind } from "../../adapter/template/types.js";
+import "../../adapter/index.js";
+//#region src/components/label/label.template.ts
+/** Обёртка текста каждой подписи — одна на всё время жизни элемента. */
+var texts = /* @__PURE__ */ new WeakMap();
+var labelTemplate = {
+	create: (root) => {
+		const { ownerDocument } = root;
+		const control = ownerDocument.createElement("span");
+		const text = ownerDocument.createElement("span");
+		control.className = "so-label__control";
+		text.className = "so-label__text";
+		root.append(control, text);
+		texts.set(root, text);
+		return { slots: {
+			default: {
+				mode: "append",
+				node: control
+			},
+			content: {
+				mode: "append",
+				node: text
+			}
+		} };
+	},
+	bindings: [bind("text", ({ root, state, hasSlot }) => {
+		if (hasSlot("content")) return;
+		const text = texts.get(root);
+		if (text) text.textContent = String(state.text ?? "");
+	})]
+};
+//#endregion
+export { labelTemplate };

package/dist/components/label/setup.component.d.ts

@@ -0,0 +1,3 @@
+import type { ILabel } from '@soxa-ui/core';
+import type { TBinding, TUpdateListener } from '../../adapter';
+export declare function setupLabel(host: HTMLElement, ctrl: ILabel | undefined, props: Record<string, unknown>, onUpdate: TUpdateListener): TBinding<ILabel>;

package/dist/components/label/setup.component.js

@@ -0,0 +1,14 @@
+import { createWebcAdapterContext } from "../../adapter/common/createWebcAdapterContext.js";
+import { useAdapter } from "../../adapter/runtime/useAdapter.js";
+import "../../adapter/index.js";
+import { LabelDescriptor } from "@soxa-ui/setup";
+//#region src/components/label/setup.component.ts
+function setupLabel(host, ctrl, props, onUpdate) {
+	const adapter = createWebcAdapterContext(host, LabelDescriptor(), {
+		ctrl,
+		props
+	});
+	return useAdapter(adapter, host, onUpdate);
+}
+//#endregion
+export { setupLabel };

package/dist/components/list-box/ListBox.element.d.ts

@@ -0,0 +1,10 @@
+/**
+ * `<div is="so-list-box">` — список с выбором; узел списка внутри — поле корня
+ * (`control`) и остановка Tab. Модуль регистрирует и части — группу и элемент.
+ * docs/architecture.md, Layer 8d, «Коллекция».
+ */
+import { ListBoxDescriptor } from '@soxa-ui/setup';
+import type { IListBox, TListBoxCollectionFacade } from '@soxa-ui/core';
+import type { TElementClassOf, TElementType } from '../../adapter';
+export declare const TListBoxElement: TElementClassOf<typeof HTMLDivElement, typeof ListBoxDescriptor, IListBox, TListBoxCollectionFacade>;
+export type TListBoxElementProps = TElementType<typeof TListBoxElement>;

package/dist/components/list-box/ListBox.element.js

@@ -0,0 +1,32 @@
+import { defineElement } from "../../adapter/runtime/defineElement.js";
+import { ElementBase } from "../../adapter/runtime/element.base.js";
+import "../../adapter/index.js";
+import { TListBoxItemElement } from "./item/ListBoxItem.element.js";
+import "./item/index.js";
+import { TListBoxGroupElement } from "./group/ListBoxGroup.element.js";
+import "./group/index.js";
+import { listBoxTemplate } from "./list-box.template.js";
+import { setupListBox } from "./setup.component.js";
+import { ListBoxCollectionDescriptor, ListBoxDescriptor } from "@soxa-ui/setup";
+//#region src/components/list-box/ListBox.element.ts
+/**
+* `<div is="so-list-box">` — список с выбором; узел списка внутри — поле корня
+* (`control`) и остановка Tab. Модуль регистрирует и части — группу и элемент.
+* docs/architecture.md, Layer 8d, «Коллекция».
+*/
+var TListBoxElement = ElementBase(HTMLDivElement, {
+	descriptor: ListBoxDescriptor,
+	facade: ListBoxCollectionDescriptor,
+	template: listBoxTemplate,
+	root: {
+		strategy: "host",
+		sets: ["attrs", "dataset"],
+		control: true
+	},
+	setup: setupListBox
+});
+defineElement("so-list-box", TListBoxElement, "div");
+defineElement("so-list-box-group", TListBoxGroupElement, "div");
+defineElement("so-list-box-item", TListBoxItemElement, "div");
+//#endregion
+export { TListBoxElement };

package/dist/components/list-box/group/ListBoxGroup.element.d.ts

@@ -0,0 +1,9 @@
+/**
+ * `<div is="so-list-box-group">` — элементы списка под общей подписью;
+ * регистрирует модуль списка. docs/architecture.md, Layer 8d, «Коллекция».
+ */
+import { ListBoxGroupDescriptor } from '@soxa-ui/setup';
+import type { IItemGroup } from '@soxa-ui/core';
+import type { TElementClassOf, TElementType } from '../../../adapter';
+export declare const TListBoxGroupElement: TElementClassOf<typeof HTMLDivElement, typeof ListBoxGroupDescriptor, IItemGroup>;
+export type TListBoxGroupElementProps = TElementType<typeof TListBoxGroupElement>;

package/dist/components/list-box/group/ListBoxGroup.element.js

@@ -0,0 +1,17 @@
+import { ElementBase } from "../../../adapter/runtime/element.base.js";
+import "../../../adapter/index.js";
+import { setupListBoxGroup } from "./setup.component.js";
+import { listBoxGroupTemplate } from "./list-box-group.template.js";
+import { ListBoxGroupDescriptor } from "@soxa-ui/setup";
+//#region src/components/list-box/group/ListBoxGroup.element.ts
+/**
+* `<div is="so-list-box-group">` — элементы списка под общей подписью;
+* регистрирует модуль списка. docs/architecture.md, Layer 8d, «Коллекция».
+*/
+var TListBoxGroupElement = ElementBase(HTMLDivElement, {
+	descriptor: ListBoxGroupDescriptor,
+	template: listBoxGroupTemplate,
+	setup: setupListBoxGroup
+});
+//#endregion
+export { TListBoxGroupElement };

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

@@ -0,0 +1,3 @@
+export { setupListBoxGroup } from './setup.component';
+export { TListBoxGroupElement, type TListBoxGroupElementProps } from './ListBoxGroup.element';
+export { listBoxGroupTemplate } from './list-box-group.template';

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

@@ -0,0 +1,3 @@
+import "./setup.component.js";
+import "./list-box-group.template.js";
+export { TListBoxGroupElement } from "./ListBoxGroup.element.js";

package/dist/components/list-box/group/list-box-group.template.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Шаблон группы ListBox: подпись — первый узел корня, пока `label` не пуст;
+ * её набор (`labelAria`, роль `presentation`) — на её узле: в `listbox` ARIA
+ * пускает только опции и группы.
+ */
+import type { IItemGroup } from '@soxa-ui/core';
+import { type ITemplate } from '../../../adapter';
+export declare const listBoxGroupTemplate: ITemplate<IItemGroup>;

package/dist/components/list-box/group/list-box-group.template.js

@@ -0,0 +1,32 @@
+import { bind } from "../../../adapter/template/types.js";
+import { ownerAttributes } from "../../../adapter/template/owner.js";
+import "../../../adapter/index.js";
+//#region src/components/list-box/group/list-box-group.template.ts
+var labels = /* @__PURE__ */ new WeakMap();
+var listBoxGroupTemplate = {
+	create: (root) => {
+		const label = root.ownerDocument.createElement("div");
+		label.className = "so-list-box-group__label";
+		labels.set(root, label);
+		return { slots: { default: {
+			mode: "append",
+			node: root
+		} } };
+	},
+	bindings: [bind("label", ({ root, state }) => {
+		const label = labels.get(root);
+		if (!label) return;
+		const text = String(state.label ?? "");
+		if (text === "") {
+			label.remove();
+			return;
+		}
+		label.textContent = text;
+		if (root.firstChild !== label) root.prepend(label);
+	}), bind("labelAria", ({ root, state }) => {
+		const label = labels.get(root);
+		if (label) ownerAttributes(label, state.labelAria);
+	})]
+};
+//#endregion
+export { listBoxGroupTemplate };

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

@@ -0,0 +1,3 @@
+import type { IItemGroup } from '@soxa-ui/core';
+import type { TBinding, TUpdateListener } from '../../../adapter';
+export declare function setupListBoxGroup(host: HTMLElement, ctrl: IItemGroup | undefined, props: Record<string, unknown>, onUpdate: TUpdateListener): TBinding<IItemGroup>;

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

@@ -0,0 +1,16 @@
+import { createWebcAdapterContext } from "../../../adapter/common/createWebcAdapterContext.js";
+import { useAdapter } from "../../../adapter/runtime/useAdapter.js";
+import { createWebcElevator } from "../../../adapter/elevator/factory.js";
+import "../../../adapter/elevator/index.js";
+import "../../../adapter/index.js";
+import { ListBoxGroupDescriptor, TItemGroupExtension } from "@soxa-ui/setup";
+//#region src/components/list-box/group/setup.component.ts
+function setupListBoxGroup(host, ctrl, props, onUpdate) {
+	const adapter = createWebcAdapterContext(host, ListBoxGroupDescriptor(), {
+		ctrl,
+		props
+	}).use(TItemGroupExtension, { elevator: createWebcElevator(host) });
+	return useAdapter(adapter, host, onUpdate);
+}
+//#endregion
+export { setupListBoxGroup };

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

@@ -0,0 +1,7 @@
+/** Application API for this element entry. */
+export { TListBoxElement } from './ListBox.element';
+export type { TListBoxElementProps } from './ListBox.element';
+export { TListBoxItemElement } from './item/ListBoxItem.element';
+export type { TListBoxItemElementProps } from './item/ListBoxItem.element';
+export { TListBoxGroupElement } from './group/ListBoxGroup.element';
+export type { TListBoxGroupElementProps } from './group/ListBoxGroup.element';

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

@@ -0,0 +1,4 @@
+import { TListBoxItemElement } from "./item/ListBoxItem.element.js";
+import { TListBoxGroupElement } from "./group/ListBoxGroup.element.js";
+import { TListBoxElement } from "./ListBox.element.js";
+export { TListBoxElement, TListBoxGroupElement, TListBoxItemElement };

package/dist/components/list-box/item/ListBoxItem.element.d.ts

@@ -0,0 +1,10 @@
+/**
+ * `<div is="so-list-box-item">` — элемент списка; строка внутри — Button на
+ * `div`, поле корня (`control`). Регистрирует модуль списка.
+ * docs/architecture.md, Layer 8d, «Коллекция».
+ */
+import { ListBoxItemDescriptor } from '@soxa-ui/setup';
+import type { IListBoxItem, TListBoxItemCollectionFacade } from '@soxa-ui/core';
+import type { TElementClassOf, TElementType } from '../../../adapter';
+export declare const TListBoxItemElement: TElementClassOf<typeof HTMLDivElement, typeof ListBoxItemDescriptor, IListBoxItem, TListBoxItemCollectionFacade>;
+export type TListBoxItemElementProps = TElementType<typeof TListBoxItemElement>;

package/dist/components/list-box/item/ListBoxItem.element.js

@@ -0,0 +1,25 @@
+import { ElementBase } from "../../../adapter/runtime/element.base.js";
+import "../../../adapter/index.js";
+import { setupListBoxItem } from "./setup.component.js";
+import { listBoxItemTemplate } from "./list-box-item.template.js";
+import { ListBoxCollectionItemDescriptor, ListBoxItemDescriptor } from "@soxa-ui/setup";
+//#region src/components/list-box/item/ListBoxItem.element.ts
+/**
+* `<div is="so-list-box-item">` — элемент списка; строка внутри — Button на
+* `div`, поле корня (`control`). Регистрирует модуль списка.
+* docs/architecture.md, Layer 8d, «Коллекция».
+*/
+var TListBoxItemElement = ElementBase(HTMLDivElement, {
+	descriptor: ListBoxItemDescriptor,
+	facade: ListBoxCollectionItemDescriptor,
+	template: listBoxItemTemplate,
+	root: {
+		strategy: "host",
+		sets: ["attrs", "dataset"],
+		order: true,
+		control: true
+	},
+	setup: setupListBoxItem
+});
+//#endregion
+export { TListBoxItemElement };

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

@@ -0,0 +1,3 @@
+export { setupListBoxItem } from './setup.component';
+export { TListBoxItemElement, type TListBoxItemElementProps } from './ListBoxItem.element';
+export { listBoxItemTemplate } from './list-box-item.template';

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

@@ -0,0 +1,3 @@
+import "./setup.component.js";
+import "./list-box-item.template.js";
+export { TListBoxItemElement } from "./ListBoxItem.element.js";

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

@@ -0,0 +1,8 @@
+/**
+ * Шаблон элемента ListBox: строка — деталь ItemRow на `div`, на ней `aria` и
+ * `dataset` элемента (тема красит выбор на `.so-button`); отметка выбранного —
+ * край строки. docs/architecture.md, Layer 8d, «Коллекция».
+ */
+import type { IListBoxItem, TListBoxItemCollectionFacade } from '@soxa-ui/core';
+import { type ITemplate } from '../../../adapter';
+export declare const listBoxItemTemplate: ITemplate<IListBoxItem, TListBoxItemCollectionFacade>;

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

@@ -0,0 +1,116 @@
+import { bind } from "../../../adapter/template/types.js";
+import { ownerAttributes } from "../../../adapter/template/owner.js";
+import { lend } from "../../../adapter/template/lend.js";
+import { createDetail, patch } from "../../../adapter/template/parts.js";
+import "../../../adapter/index.js";
+import { registerItemRowTag } from "../../item-row/ItemRow.element.js";
+import "../../item-row/index.js";
+import { TIconElement } from "../../icon/Icon.element.js";
+import "../../icon/index.js";
+import { DEFAULT_SLOT } from "@soxa-ui/setup";
+//#region src/components/list-box/item/list-box-item.template.ts
+/** На `<button>` выключенный пункт терял бы фокус и клик. */
+var TItemRowDivElement = registerItemRowTag("div");
+var parts = /* @__PURE__ */ new WeakMap();
+/** Край — свет строки: до её сборки обёртка встаёт в слот, после — ребёнком кнопки (`lend`). */
+function placeIndicator(row, indicator, side) {
+	if (side === "start") {
+		if (row.firstChild !== indicator) lend(row, "leading", indicator, "start");
+	} else if (side === "end") {
+		if (row.lastChild !== indicator) lend(row, "trailing", indicator, "end");
+	} else indicator.remove();
+}
+var listBoxItemTemplate = {
+	create: (root, ctx) => {
+		const { hasSlot } = ctx;
+		const { ownerDocument } = root;
+		const row = createDetail(ownerDocument, TItemRowDivElement, { embedded: "list-box.row" });
+		const indicator = ownerDocument.createElement("span");
+		indicator.className = "so-list-box-item__indicator";
+		indicator.setAttribute("aria-hidden", "true");
+		let icon = null;
+		if (!hasSlot("indicator-icon")) {
+			icon = createDetail(ownerDocument, TIconElement, { embedded: "list-box.indicator" });
+			icon.icon = "check";
+		}
+		row.addEventListener("click", () => {
+			ctx.facade?.context?.adapters.list.choose();
+		});
+		root.appendChild(row);
+		parts.set(root, {
+			row,
+			indicator,
+			icon
+		});
+		return {
+			slots: {
+				leading: {
+					mode: "append",
+					node: row,
+					slot: "leading"
+				},
+				default: {
+					mode: "append",
+					node: row,
+					slot: DEFAULT_SLOT
+				},
+				trailing: {
+					mode: "append",
+					node: row,
+					slot: "trailing"
+				},
+				"indicator-icon": {
+					mode: "append",
+					node: indicator
+				}
+			},
+			control: row
+		};
+	},
+	bindings: [
+		bind([
+			"view",
+			"disabled",
+			"size",
+			"variant"
+		], ({ root, state }) => {
+			const own = parts.get(root);
+			if (!own) return;
+			const { row, icon } = own;
+			const disabled = state.disabled === true;
+			patch(row, {
+				view: state.view,
+				disabled,
+				size: state.size,
+				variant: state.variant
+			});
+			if (icon && icon.size !== state.size) icon.size = state.size;
+		}),
+		bind(["aria", "dataset"], ({ root, state }) => {
+			const row = parts.get(root)?.row;
+			if (row) ownerAttributes(row, {
+				...state.aria,
+				...state.dataset
+			});
+		}),
+		bind("text", ({ root, state, hasSlot }) => {
+			const row = parts.get(root)?.row;
+			const text = state.text ?? "";
+			if (row && !hasSlot(DEFAULT_SLOT) && row.text !== text) row.text = text;
+		}),
+		bind("indicator", ({ root, state }) => {
+			const own = parts.get(root);
+			if (own) placeIndicator(own.row, own.indicator, state.indicator);
+		}),
+		bind("selected", ({ root, state, showSlot }) => {
+			const own = parts.get(root);
+			const selected = state.selected === true;
+			showSlot("indicator-icon", selected);
+			if (!own?.icon) return;
+			if (!selected) own.icon.remove();
+			else if (own.icon.parentNode !== own.indicator) own.indicator.appendChild(own.icon);
+		})
+	]
+};
+//#endregion
+export { listBoxItemTemplate };

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

@@ -0,0 +1,3 @@
+import type { IListBoxItem, TListBoxItemCollectionFacade } from '@soxa-ui/core';
+import type { TBinding, TUpdateListener } from '../../../adapter';
+export declare function setupListBoxItem(host: HTMLElement, ctrl: IListBoxItem | undefined, props: Record<string, unknown>, onUpdate: TUpdateListener): TBinding<IListBoxItem, TListBoxItemCollectionFacade>;

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

@@ -0,0 +1,22 @@
+import { createWebcAdapterContext } from "../../../adapter/common/createWebcAdapterContext.js";
+import { joinBindings, useAdapter, useCollectionAdapter } from "../../../adapter/runtime/useAdapter.js";
+import { createWebcElevator } from "../../../adapter/elevator/factory.js";
+import "../../../adapter/elevator/index.js";
+import "../../../adapter/index.js";
+import { ListBoxCollectionItemDescriptor, ListBoxItemDescriptor, TCollectionItemExtension } from "@soxa-ui/setup";
+//#region src/components/list-box/item/setup.component.ts
+function setupListBoxItem(host, ctrl, props, onUpdate) {
+	const adapter = createWebcAdapterContext(host, ListBoxItemDescriptor(), {
+		ctrl,
+		props
+	});
+	const itemAdapter = createWebcAdapterContext(host, ListBoxCollectionItemDescriptor(), { props }, { bundle: adapter.bundle }).use(TCollectionItemExtension, {
+		adapter,
+		elevator: createWebcElevator(host)
+	});
+	const item = useCollectionAdapter(itemAdapter, host, onUpdate);
+	const owner = useAdapter(adapter, host, onUpdate);
+	return joinBindings(owner, item);
+}
+//#endregion
+export { setupListBoxItem };

package/dist/components/list-box/list-box.template.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Шаблон ListBox: корень — рамка (`header`, узел списка, `footer`), набор `aria`
+ * владельца — на узле списка: в `listbox` ARIA пускает только опции и группы.
+ * Без элементов разметки строки по секциям рисует `TDrawnRows`.
+ * docs/architecture.md, Layer 8d, «Коллекция».
+ */
+import type { IListBox, TListBoxCollectionFacade } from '@soxa-ui/core';
+import { type ITemplate, type TItemSlots } from '../../adapter';
+/** Образец списка → слот элемента из данных (`setup/__tests__/item-slots.spec.ts`). */
+export declare const LIST_BOX_ITEM_SLOTS: TItemSlots;
+export declare const listBoxTemplate: ITemplate<IListBox, TListBoxCollectionFacade>;

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

@@ -0,0 +1,77 @@
+import { bind } from "../../adapter/template/types.js";
+import { ownerAttributes } from "../../adapter/template/owner.js";
+import "../../adapter/index.js";
+import { TListBoxItemElement } from "./item/ListBoxItem.element.js";
+import "./item/index.js";
+import { TListBoxGroupElement } from "./group/ListBoxGroup.element.js";
+import "./group/index.js";
+import { TDrawnRows } from "../common/drawn-rows.js";
+//#region src/components/list-box/list-box.template.ts
+/** Образец списка → слот элемента из данных (`setup/__tests__/item-slots.spec.ts`). */
+var LIST_BOX_ITEM_SLOTS = {
+	"item-leading": "leading",
+	item: "default",
+	"item-trailing": "trailing",
+	"item-indicator-icon": "indicator-icon"
+};
+var ROWS = {
+	block: "list-box",
+	item: TListBoxItemElement,
+	group: TListBoxGroupElement,
+	slots: LIST_BOX_ITEM_SLOTS
+};
+var lists = /* @__PURE__ */ new WeakMap();
+/** Строки — только у списка без элементов разметки. */
+var rows = /* @__PURE__ */ new WeakMap();
+var listBoxTemplate = {
+	create: (root, { hasSlot }) => {
+		const { ownerDocument } = root;
+		const list = ownerDocument.createElement("div");
+		const end = ownerDocument.createComment("");
+		list.className = "so-list-box__list";
+		list.setAttribute("tabindex", "0");
+		list.appendChild(end);
+		root.appendChild(list);
+		if (!hasSlot("default")) rows.set(root, new TDrawnRows(list, end, ROWS));
+		lists.set(root, list);
+		return {
+			slots: {
+				header: {
+					mode: "before",
+					node: list
+				},
+				default: {
+					mode: "before",
+					node: end
+				},
+				empty: {
+					mode: "before",
+					node: end
+				},
+				footer: {
+					mode: "append",
+					node: root
+				},
+				item: { mode: "sample" },
+				"item-leading": { mode: "sample" },
+				"item-trailing": { mode: "sample" },
+				"item-indicator-icon": { mode: "sample" }
+			},
+			control: list
+		};
+	},
+	bindings: [
+		bind("aria", ({ root, state }) => {
+			const list = lists.get(root);
+			if (list) ownerAttributes(list, state.aria);
+		}),
+		bind(["drawnSections", "groupSeparators"], (ctx) => {
+			rows.get(ctx.root)?.draw(ctx, ctx.state.drawnSections, ctx.state.groupSeparators === true);
+		}),
+		bind("shown", ({ state, showSlot }) => {
+			showSlot("empty", (state.shown ?? []).length === 0);
+		})
+	]
+};
+//#endregion
+export { LIST_BOX_ITEM_SLOTS, listBoxTemplate };